Example of try :
- Copied nodebb-plugin-extended-markdown as a basis of my plugin (unchanged, it works with colorpicker "of nodebb" like I said above).
- Added to dependencies in package.json :
"bootstrap-colorpicker": "^2.x"
"modules": {
"bootstrap-colorpicker.js": "node_modules/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.js"
}
- I replaced the require call in client.js like this :
require([
'composer/formatting',
'composer/controls',
'translator',
// 'vendor/colorpicker/colorpicker',
'bootstrap-colorpicker'
], function (formatting, controls, translator) {
if (formatting && controls) {
// params is (language, namespace, callback)
translator.getTranslations(window.config.userLang || window.config.defaultLang, 'extendedmarkdown', function (strings) {
var composerTextarea;
$('li[data-format="color"]').colorpicker();
// Commented all the following from initial plugin
// $('li[data-format="color"]').ColorPicker({
// eventName: 'showPicker',
// color: '#a67f00',
// ......
- I commented also the last line in client.js here :
formatting.addButtonDispatch('color', function (textarea, selectionStart, selectionEnd) {
if (selectionStart === selectionEnd) {
controls.insertIntoTextarea(textarea, '%(#a67f00)[' + strings.color_text + ']');
controls.updateTextareaSelection(textarea, selectionStart + 3, selectionStart + 9);
} else {
var wrapDelta = controls.wrapSelectionInTextareaWith(textarea, '%(#a67f00)[', ']');
controls.updateTextareaSelection(textarea, selectionStart + 3, selectionStart + 9);
}
composerTextarea = textarea;
// $('li[data-format="color"]').trigger("showPicker");
});
(I must find with what I must replace this last line to call the colorpicker... but the problem is not here...)
Then, after build of course, when I open the editor in nodebb, I have this message in the console.log of the browser :
TypeError: e is undefined bootstrap-colorpicker.js:1:21152
At 21152 corresponds "e.colorpicker=o;" in the following extract of bootstrap-colorpicker.js :
this.element.trigger({type:"changeColor",color:this.color,value:this.input.val()})}};e.colorpicker=o;e.fn.colorpicker=function(t){var i=Array.prototype.slice.call(arguments,1)
I think I make a big mistake in how to use the colorpicker or implement it in nodebb but I'm not a js expert (I learn about it each day ).