From 56834dbd98b4ad5f1e15b4d7fb9a5437e7f744e9 Mon Sep 17 00:00:00 2001 From: Joffrey JAFFEUX Date: Fri, 26 Jan 2018 14:42:24 +0100 Subject: [PATCH] FEATURE: select-kit api to modify collection header --- .../discourse/lib/plugin-api.js.es6 | 2 +- .../select-kit/components/multi-select.js.es6 | 2 ++ .../select-kit/components/select-kit.js.es6 | 13 +++++++++- .../components/single-select.js.es6 | 2 ++ .../select-kit/mixins/dom-helpers.js.es6 | 1 + .../select-kit/mixins/plugin-api.js.es6 | 24 +++++++++++++++++++ .../templates/components/select-kit.hbs | 2 +- .../select-kit/select-kit-collection.hbs | 4 ++-- 8 files changed, 45 insertions(+), 5 deletions(-) diff --git a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 b/app/assets/javascripts/discourse/lib/plugin-api.js.es6 index b8377be96f6..60fc1233a58 100644 --- a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 +++ b/app/assets/javascripts/discourse/lib/plugin-api.js.es6 @@ -25,7 +25,7 @@ import { modifySelectKit } from "select-kit/mixins/plugin-api"; import { addGTMPageChangedCallback } from 'discourse/lib/page-tracker'; // If you add any methods to the API ensure you bump up this number -const PLUGIN_API_VERSION = '0.8.16'; +const PLUGIN_API_VERSION = '0.8.17'; class PluginApi { constructor(version, container) { diff --git a/app/assets/javascripts/select-kit/components/multi-select.js.es6 b/app/assets/javascripts/select-kit/components/multi-select.js.es6 index 616af382413..beec8844592 100644 --- a/app/assets/javascripts/select-kit/components/multi-select.js.es6 +++ b/app/assets/javascripts/select-kit/components/multi-select.js.es6 @@ -46,6 +46,7 @@ export default SelectKitComponent.extend({ values = this.computeValues(values); values = this._beforeDidComputeValues(values); this._setHeaderComputedContent(); + this._setCollectionHeaderComputedContent(); this.didComputeContent(content); this.didComputeValues(values); this.didComputeAttributes(); @@ -85,6 +86,7 @@ export default SelectKitComponent.extend({ Ember.run.next(() => { this.mutateContent(this.get("computedContent")); this.mutateValues(this.get("computedValues")); + this._setCollectionHeaderComputedContent(); this._setHeaderComputedContent(); }); }, diff --git a/app/assets/javascripts/select-kit/components/select-kit.js.es6 b/app/assets/javascripts/select-kit/components/select-kit.js.es6 index d5e2be02473..e08b74e32f8 100644 --- a/app/assets/javascripts/select-kit/components/select-kit.js.es6 +++ b/app/assets/javascripts/select-kit/components/select-kit.js.es6 @@ -7,7 +7,8 @@ import PluginApiMixin from "select-kit/mixins/plugin-api"; import { applyContentPluginApiCallbacks, applyHeaderContentPluginApiCallbacks, - applyOnSelectPluginApiCallbacks + applyOnSelectPluginApiCallbacks, + applyCollectionHeaderCallbacks } from "select-kit/mixins/plugin-api"; export default Ember.Component.extend(UtilsMixin, PluginApiMixin, DomHelpersMixin, EventsMixin, { @@ -51,6 +52,7 @@ export default Ember.Component.extend(UtilsMixin, PluginApiMixin, DomHelpersMixi headerComponent: "select-kit/select-kit-header", headerComponentOptions: null, headerComputedContent: null, + collectionHeaderComputedContent: null, collectionComponent: "select-kit/select-kit-collection", collectionHeight: 200, verticalOffset: 0, @@ -237,6 +239,15 @@ export default Ember.Component.extend(UtilsMixin, PluginApiMixin, DomHelpersMixi this.setProperties({ filter: "" }); }, + _setCollectionHeaderComputedContent() { + const collectionHeaderComputedContent = applyCollectionHeaderCallbacks( + this.get("pluginApiIdentifiers"), + this.get("collectionHeader"), + this + ); + this.set("collectionHeaderComputedContent", collectionHeaderComputedContent); + }, + _setHeaderComputedContent() { const headerComputedContent = applyHeaderContentPluginApiCallbacks( this.get("pluginApiIdentifiers"), diff --git a/app/assets/javascripts/select-kit/components/single-select.js.es6 b/app/assets/javascripts/select-kit/components/single-select.js.es6 index 495757dd286..af7c1e035a1 100644 --- a/app/assets/javascripts/select-kit/components/single-select.js.es6 +++ b/app/assets/javascripts/select-kit/components/single-select.js.es6 @@ -26,6 +26,7 @@ export default SelectKitComponent.extend({ if (this.get("allowInitialValueMutation")) this.mutateAttributes(); + this._setCollectionHeaderComputedContent(); this._setHeaderComputedContent(); }); }, @@ -36,6 +37,7 @@ export default SelectKitComponent.extend({ run.next(() => { this.mutateContent(this.get("computedContent")); this.mutateValue(this.get("computedValue")); + this._setCollectionHeaderComputedContent(); this._setHeaderComputedContent(); }); }, diff --git a/app/assets/javascripts/select-kit/mixins/dom-helpers.js.es6 b/app/assets/javascripts/select-kit/mixins/dom-helpers.js.es6 index 55707f12c68..eb7e93715fc 100644 --- a/app/assets/javascripts/select-kit/mixins/dom-helpers.js.es6 +++ b/app/assets/javascripts/select-kit/mixins/dom-helpers.js.es6 @@ -80,6 +80,7 @@ export default Ember.Mixin.create({ this.setProperties({ isExpanded: true, renderedBodyOnce: true, isFocused: true }); this.focusFilterOrHeader(); this.autoHighlight(); + this._setCollectionHeaderComputedContent(); this._setHeaderComputedContent(); }, diff --git a/app/assets/javascripts/select-kit/mixins/plugin-api.js.es6 b/app/assets/javascripts/select-kit/mixins/plugin-api.js.es6 index e1055d4a1a1..579795911f0 100644 --- a/app/assets/javascripts/select-kit/mixins/plugin-api.js.es6 +++ b/app/assets/javascripts/select-kit/mixins/plugin-api.js.es6 @@ -34,6 +34,15 @@ function modifyHeaderComputedContent(pluginApiIdentifiers, contentFunction) { _modifyHeaderComputedContentCallbacks[pluginApiIdentifiers].push(contentFunction); } +let _modifyCollectionHeaderCallbacks = {}; +function modifyCollectionHeader(pluginApiIdentifiers, contentFunction) { + if (Ember.isNone(_modifyCollectionHeaderCallbacks[pluginApiIdentifiers])) { + _modifyCollectionHeaderCallbacks[pluginApiIdentifiers] = []; + } + + _modifyCollectionHeaderCallbacks[pluginApiIdentifiers].push(contentFunction); +} + let _onSelectCallbacks = {}; function onSelect(pluginApiIdentifiers, mutationFunction) { if (Ember.isNone(_onSelectCallbacks[pluginApiIdentifiers])) { @@ -69,6 +78,16 @@ export function applyHeaderContentPluginApiCallbacks(identifiers, content, conte return content; } +export function applyCollectionHeaderCallbacks(identifiers, content, context) { + identifiers.forEach((key) => { + (_modifyCollectionHeaderCallbacks[key] || []).forEach((c) => { + content = c(context, content); + }); + }); + + return content; +} + export function applyOnSelectPluginApiCallbacks(identifiers, val, context) { identifiers.forEach((key) => { (_onSelectCallbacks[key] || []).forEach((c) => c(context, val)); @@ -93,6 +112,10 @@ export function modifySelectKit(pluginApiIdentifiers) { modifyHeaderComputedContent(pluginApiIdentifiers, callback); return modifySelectKit(pluginApiIdentifiers); }, + modifyCollectionHeader: (callback) => { + modifyCollectionHeader(pluginApiIdentifiers, callback); + return modifySelectKit(pluginApiIdentifiers); + }, onSelect: (callback) => { onSelect(pluginApiIdentifiers, callback); return modifySelectKit(pluginApiIdentifiers); @@ -105,6 +128,7 @@ export function clearCallbacks() { _prependContentCallbacks = {}; _modifyContentCallbacks = {}; _modifyHeaderComputedContentCallbacks = {}; + _modifyCollectionHeaderCallbacks = {}; _onSelectCallbacks = {}; } diff --git a/app/assets/javascripts/select-kit/templates/components/select-kit.hbs b/app/assets/javascripts/select-kit/templates/components/select-kit.hbs index 5b3ba8691bc..20bc4ca19fa 100644 --- a/app/assets/javascripts/select-kit/templates/components/select-kit.hbs +++ b/app/assets/javascripts/select-kit/templates/components/select-kit.hbs @@ -23,7 +23,7 @@ {{#if renderedBodyOnce}} {{component collectionComponent - collectionHeader=collectionHeader + collectionHeaderComputedContent=collectionHeaderComputedContent hasSelection=hasSelection noneRowComputedContent=noneRowComputedContent createRowComputedContent=createRowComputedContent diff --git a/app/assets/javascripts/select-kit/templates/components/select-kit/select-kit-collection.hbs b/app/assets/javascripts/select-kit/templates/components/select-kit/select-kit-collection.hbs index 98919b89242..bb02559029f 100644 --- a/app/assets/javascripts/select-kit/templates/components/select-kit/select-kit-collection.hbs +++ b/app/assets/javascripts/select-kit/templates/components/select-kit/select-kit-collection.hbs @@ -1,6 +1,6 @@ -{{#if collectionHeader}} +{{#if collectionHeaderComputedContent}}
- {{{collectionHeader}}} + {{{collectionHeaderComputedContent}}}
{{/if}}