diff --git a/app/assets/javascripts/discourse/helpers/bound-avatar.js.es6 b/app/assets/javascripts/discourse/helpers/bound-avatar.js.es6 index 2833f8cefb1..43cea519d48 100644 --- a/app/assets/javascripts/discourse/helpers/bound-avatar.js.es6 +++ b/app/assets/javascripts/discourse/helpers/bound-avatar.js.es6 @@ -1,5 +1,6 @@ import { htmlHelper } from 'discourse-common/lib/helpers'; import { avatarImg } from 'discourse/lib/utilities'; +import { classesForUser } from 'discourse/helpers/user-avatar'; export default htmlHelper((user, size) => { if (Ember.isEmpty(user)) { @@ -7,5 +8,10 @@ export default htmlHelper((user, size) => { } const avatarTemplate = Em.get(user, 'avatar_template'); - return avatarImg({ size, avatarTemplate }); + let args = { size, avatarTemplate }; + let extraClasses = classesForUser(user).join(' '); + if (extraClasses && extraClasses.length) { + args.extraClasses = extraClasses; + } + return avatarImg(args); }); diff --git a/app/assets/javascripts/discourse/helpers/user-avatar.js.es6 b/app/assets/javascripts/discourse/helpers/user-avatar.js.es6 index 71e6e87249c..8054631dfab 100644 --- a/app/assets/javascripts/discourse/helpers/user-avatar.js.es6 +++ b/app/assets/javascripts/discourse/helpers/user-avatar.js.es6 @@ -1,6 +1,23 @@ import { registerUnbound } from 'discourse-common/lib/helpers'; import { avatarImg, formatUsername } from 'discourse/lib/utilities'; +let _customAvatarHelpers; + +export function registerCustomAvatarHelper(fn) { + _customAvatarHelpers = _customAvatarHelpers || []; + _customAvatarHelpers.push(fn); +} + +export function classesForUser(u) { + let result = []; + if (_customAvatarHelpers) { + for (let i=0; i<_customAvatarHelpers.length; i++) { + result = result.concat(_customAvatarHelpers[i](u)); + } + } + return result; +} + function renderAvatar(user, options) { options = options || {}; diff --git a/app/assets/javascripts/discourse/initializers/banner.js.es6 b/app/assets/javascripts/discourse/initializers/banner.js.es6 index 9c9ff47d927..1e9695d081e 100644 --- a/app/assets/javascripts/discourse/initializers/banner.js.es6 +++ b/app/assets/javascripts/discourse/initializers/banner.js.es6 @@ -1,11 +1,11 @@ import PreloadStore from 'preload-store'; +import { withPluginApi } from 'discourse/lib/plugin-api'; export default { name: "banner", after: "message-bus", initialize(container) { - const banner = Em.Object.create(PreloadStore.get("banner")), site = container.lookup('site:main'); diff --git a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 b/app/assets/javascripts/discourse/lib/plugin-api.js.es6 index 60fc1233a58..bc15c489529 100644 --- a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 +++ b/app/assets/javascripts/discourse/lib/plugin-api.js.es6 @@ -23,9 +23,10 @@ import { addNavItem } from 'discourse/models/nav-item'; import { replaceFormatter } from 'discourse/lib/utilities'; import { modifySelectKit } from "select-kit/mixins/plugin-api"; import { addGTMPageChangedCallback } from 'discourse/lib/page-tracker'; +import { registerCustomAvatarHelper } from 'discourse/helpers/user-avatar'; // If you add any methods to the API ensure you bump up this number -const PLUGIN_API_VERSION = '0.8.17'; +const PLUGIN_API_VERSION = '0.8.18'; class PluginApi { constructor(version, container) { @@ -368,6 +369,23 @@ class PluginApi { appEvents.on(name, fn); } + /** + Registers a function to generate custom avatar CSS classes + for a particular user. + + Takes a function that will accept a user as a parameter + and return an array of CSS classes to apply. + + ```javascript + api.customUserAvatarClasses(user => { + if (Ember.get(user, 'primary_group_name') === 'managers') { + return ['managers']; + } + }); + **/ + customUserAvatarClasses(fn) { + registerCustomAvatarHelper(fn); + } /** * Changes a setting associated with a widget. For example, if