I'm toying with the idea of having a multi-select richcombo that basically adds and removes classes from the current element. However, the documentation is a litte terse on this subject, so I have no idea what to do. Could someone please have a small look at my idea and comment if it makes any sense:
editor.ui.addRichCombo("foobar", {
multiSelect: true,
panel: {
css: [CKEDITOR.getUrl('elementstylecombo.css')],
multiSelect: true
},
init: function () {
this.add("AA", "<span class='row'>AA</span>", "");
this.add("BB", "<span class='row'>BB</span>", "");
this.add("CC", "<span class='row'>CC</span>", "");
},
onRender: function () {
this.selectionChangeHandlder = function (ev) {
// Target element is '<p class="AA CC">Lorem ipsum</p>'
// How do I make the items in the dropdown hilight AA and CC?
// This simply sets the dropdown preview text, which doesn't help
this.setValue("AA CC");
};
editor.on('selectionChange', this.selectionChangeHandlder, this);
},
onClick: function (value, marked) {
// If target has clicked value, remove it - If not, add it
}
});
Btw, text coloring doesn't work here in the forums. Also, it's hard to format code prettily - I'm sorry if it's hard to read.