diff --git a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 b/app/assets/javascripts/discourse/lib/plugin-api.js.es6 index a674d497f31..68cc7eb8e61 100644 --- a/app/assets/javascripts/discourse/lib/plugin-api.js.es6 +++ b/app/assets/javascripts/discourse/lib/plugin-api.js.es6 @@ -24,7 +24,7 @@ import { replaceFormatter } from 'discourse/lib/utilities'; import { modifySelectKit } from "select-kit/mixins/plugin-api"; // If you add any methods to the API ensure you bump up this number -const PLUGIN_API_VERSION = '0.8.12'; +const PLUGIN_API_VERSION = '0.8.13'; 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 c99933bb2d0..8cdd5b9460f 100644 --- a/app/assets/javascripts/select-kit/components/multi-select.js.es6 +++ b/app/assets/javascripts/select-kit/components/multi-select.js.es6 @@ -2,6 +2,9 @@ import SelectKitComponent from "select-kit/components/select-kit"; import computed from "ember-addons/ember-computed-decorators"; import { on } from "ember-addons/ember-computed-decorators"; const { get, isNone, isEmpty, makeArray } = Ember; +import { + applyOnSelectPluginApiCallbacks +} from "select-kit/mixins/plugin-api"; export default SelectKitComponent.extend({ pluginApiIdentifiers: ["multi-select"], @@ -81,10 +84,14 @@ export default SelectKitComponent.extend({ Ember.run.next(() => { this.mutateContent(this.get("computedContent")); this.mutateValues(this.get("computedValues")); + applyOnSelectPluginApiCallbacks(this.get("pluginApiIdentifiers"), this.get("computedValues"), this); this.set("headerComputedContent", this.computeHeaderContent()); }); }, - mutateValues(computedValues) { this.set("values", computedValues); }, + mutateValues(computedValues) { + this.set("values", computedValues); + }, + mutateContent() { }, filterComputedContent(computedContent, computedValues, filter) { const lowerFilter = filter.toLowerCase(); 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 29b418540da..1c228553a3d 100644 --- a/app/assets/javascripts/select-kit/components/select-kit.js.es6 +++ b/app/assets/javascripts/select-kit/components/select-kit.js.es6 @@ -1,10 +1,12 @@ -const { isNone, run, makeArray } = Ember; +const { isNone, makeArray } = Ember; import computed from "ember-addons/ember-computed-decorators"; import UtilsMixin from "select-kit/mixins/utils"; import DomHelpersMixin from "select-kit/mixins/dom-helpers"; import EventsMixin from "select-kit/mixins/events"; import PluginApiMixin from "select-kit/mixins/plugin-api"; -import { applyContentPluginApiCallbacks } from "select-kit/mixins/plugin-api"; +import { + applyContentPluginApiCallbacks +} from "select-kit/mixins/plugin-api"; export default Ember.Component.extend(UtilsMixin, PluginApiMixin, DomHelpersMixin, EventsMixin, { pluginApiIdentifiers: ["select-kit"], @@ -81,7 +83,7 @@ export default Ember.Component.extend(UtilsMixin, PluginApiMixin, DomHelpersMixi willComputeContent(content) { return content; }, computeContent(content) { return content; }, _beforeDidComputeContent(content) { - content = applyContentPluginApiCallbacks(this.get("pluginApiIdentifiers"), content); + content = applyContentPluginApiCallbacks(this.get("pluginApiIdentifiers"), content, this); const existingCreatedComputedContent = this.get("computedContent").filterBy("created", true); this.setProperties({ @@ -91,16 +93,6 @@ export default Ember.Component.extend(UtilsMixin, PluginApiMixin, DomHelpersMixi }, didComputeContent() {}, - mutateAttributes() { - run.next(() => { - this.mutateContent(this.get("computedContent")); - this.mutateValue(this.get("computedValue")); - this.set("headerComputedContent", this.computeHeaderContent()); - }); - }, - mutateContent() {}, - mutateValue(computedValue) { this.set("value", computedValue); }, - computeHeaderContent() { return this.baseHeaderComputedContent(); }, 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 a363b1d67e3..eedaa6f162d 100644 --- a/app/assets/javascripts/select-kit/components/single-select.js.es6 +++ b/app/assets/javascripts/select-kit/components/single-select.js.es6 @@ -1,7 +1,10 @@ import SelectKitComponent from "select-kit/components/select-kit"; import { on } from "ember-addons/ember-computed-decorators"; import computed from "ember-addons/ember-computed-decorators"; -const { get, isNone, isEmpty, isPresent } = Ember; +const { get, isNone, isEmpty, isPresent, run } = Ember; +import { + applyOnSelectPluginApiCallbacks +} from "select-kit/mixins/plugin-api"; export default SelectKitComponent.extend({ pluginApiIdentifiers: ["single-select"], @@ -44,6 +47,19 @@ export default SelectKitComponent.extend({ }); }, + mutateAttributes() { + run.next(() => { + this.mutateContent(this.get("computedContent")); + this.mutateValue(this.get("computedValue")); + applyOnSelectPluginApiCallbacks(this.get("pluginApiIdentifiers"), this.get("computedValue"), this); + this.set("headerComputedContent", this.computeHeaderContent()); + }); + }, + mutateContent() {}, + mutateValue(computedValue) { + this.set("value", computedValue); + }, + _beforeWillComputeValue(value) { switch (typeof value) { case "string": 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 effe298a02a..5fd32fcd1d4 100644 --- a/app/assets/javascripts/select-kit/mixins/plugin-api.js.es6 +++ b/app/assets/javascripts/select-kit/mixins/plugin-api.js.es6 @@ -25,7 +25,16 @@ function modifyContent(pluginApiIdentifiers, contentFunction) { _modifyContentCallbacks[pluginApiIdentifiers].push(contentFunction); } -export function applyContentPluginApiCallbacks(identifiers, content) { +let _onSelectCallbacks = {}; +function onSelect(pluginApiIdentifiers, mutationFunction) { + if (Ember.isNone(_onSelectCallbacks[pluginApiIdentifiers])) { + _onSelectCallbacks[pluginApiIdentifiers] = []; + } + + _onSelectCallbacks[pluginApiIdentifiers].push(mutationFunction); +} + +export function applyContentPluginApiCallbacks(identifiers, content, context) { identifiers.forEach((key) => { (_prependContentCallbacks[key] || []).forEach((c) => { content = c().concat(content); @@ -34,13 +43,19 @@ export function applyContentPluginApiCallbacks(identifiers, content) { content = content.concat(c()); }); (_modifyContentCallbacks[key] || []).forEach((c) => { - content = c(content); + content = c(context, content); }); }); return content; } +export function applyOnSelectPluginApiCallbacks(identifiers, val, context) { + identifiers.forEach((key) => { + (_onSelectCallbacks[key] || []).forEach((c) => c(context, val)); + }); +} + export function modifySelectKit(pluginApiIdentifiers) { return { appendContent: (content) => { @@ -54,6 +69,10 @@ export function modifySelectKit(pluginApiIdentifiers) { modifyContent: (callback) => { modifyContent(pluginApiIdentifiers, callback); return modifySelectKit(pluginApiIdentifiers); + }, + onSelect: (callback) => { + onSelect(pluginApiIdentifiers, callback); + return modifySelectKit(pluginApiIdentifiers); } }; } @@ -62,6 +81,7 @@ export function clearCallbacks() { _appendContentCallbacks = {}; _prependContentCallbacks = {}; _modifyContentCallbacks = {}; + _onSelectCallbacks = {}; } const EMPTY_ARRAY = Object.freeze([]); diff --git a/test/javascripts/components/single-select-test.js.es6 b/test/javascripts/components/single-select-test.js.es6 index ca066907625..d3c13c16740 100644 --- a/test/javascripts/components/single-select-test.js.es6 +++ b/test/javascripts/components/single-select-test.js.es6 @@ -301,7 +301,7 @@ componentTest('support appending content through plugin api', { template: '{{single-select content=content}}', beforeEach() { - withPluginApi('0.8.11', api => { + withPluginApi('0.8.13', api => { api.modifySelectKit("select-kit") .appendContent([{ id: "2", name: "regis"}]); }); @@ -316,7 +316,7 @@ componentTest('support appending content through plugin api', { assert.equal(selectKit().rows.eq(1).data("name"), "regis"); }); - clearCallbacks(); + andThen(() => clearCallbacks()); } }); @@ -324,9 +324,9 @@ componentTest('support modifying content through plugin api', { template: '{{single-select content=content}}', beforeEach() { - withPluginApi('0.8.11', api => { + withPluginApi('0.8.13', api => { api.modifySelectKit("select-kit") - .modifyContent((existingContent) => { + .modifyContent((context, existingContent) => { existingContent.splice(1, 0, { id: "2", name: "sam" }); return existingContent; }); @@ -343,7 +343,7 @@ componentTest('support modifying content through plugin api', { assert.equal(selectKit().rows.eq(1).data("name"), "sam"); }); - clearCallbacks(); + andThen(() => clearCallbacks()); } }); @@ -351,7 +351,7 @@ componentTest('support prepending content through plugin api', { template: '{{single-select content=content}}', beforeEach() { - withPluginApi('0.8.11', api => { + withPluginApi('0.8.13', api => { api.modifySelectKit("select-kit") .prependContent([{ id: "2", name: "regis"}]); }); @@ -367,6 +367,34 @@ componentTest('support prepending content through plugin api', { assert.equal(selectKit().rows.eq(0).data("name"), "regis"); }); - clearCallbacks(); + andThen(() => clearCallbacks()); + } +}); + +componentTest('support modifying on select behavior through plugin api', { + template: '{{single-select content=content}}', + + beforeEach() { + withPluginApi('0.8.13', api => { + api + .modifySelectKit("select-kit") + .onSelect((context, value) => { + find(".on-select-test").html(value); + }); + }); + + this.set("content", [{ id: "1", name: "robin"}]); + }, + + test(assert) { + expandSelectKit(); + + selectKitSelectRow(1); + + andThen(() => { + assert.equal(find(".on-select-test").html(), "1"); + }); + + andThen(() => clearCallbacks()); } });