bsw/jbe@1309: /**
bsw/jbe@1309:  * Toolbar Dialog
bsw/jbe@1309:  *
bsw/jbe@1309:  * @param {Element} link The toolbar link which causes the dialog to show up
bsw/jbe@1309:  * @param {Element} container The dialog container
bsw/jbe@1309:  *
bsw/jbe@1309:  * @example
bsw/jbe@1309:  *    <!-- Toolbar link -->
bsw/jbe@1309:  *    <a data-wysihtml-command="insertImage">insert an image</a>
bsw/jbe@1309:  *
bsw/jbe@1309:  *    <!-- Dialog -->
bsw/jbe@1309:  *    <div data-wysihtml-dialog="insertImage" style="display: none;">
bsw/jbe@1309:  *      <label>
bsw/jbe@1309:  *        URL: <input data-wysihtml-dialog-field="src" value="http://">
bsw/jbe@1309:  *      </label>
bsw/jbe@1309:  *      <label>
bsw/jbe@1309:  *        Alternative text: <input data-wysihtml-dialog-field="alt" value="">
bsw/jbe@1309:  *      </label>
bsw/jbe@1309:  *    </div>
bsw/jbe@1309:  *
bsw/jbe@1309:  *    <script>
bsw/jbe@1309:  *      var dialog = new wysihtml.toolbar.Dialog(
bsw/jbe@1309:  *        document.querySelector("[data-wysihtml-command='insertImage']"),
bsw/jbe@1309:  *        document.querySelector("[data-wysihtml-dialog='insertImage']")
bsw/jbe@1309:  *      );
bsw/jbe@1309:  *      dialog.observe("save", function(attributes) {
bsw/jbe@1309:  *        // do something
bsw/jbe@1309:  *      });
bsw/jbe@1309:  *    </script>
bsw/jbe@1309:  */
bsw/jbe@1309: (function(wysihtml) {
bsw/jbe@1309:   var dom                     = wysihtml.dom,
bsw/jbe@1309:       CLASS_NAME_OPENED       = "wysihtml-command-dialog-opened",
bsw/jbe@1309:       SELECTOR_FORM_ELEMENTS  = "input, select, textarea",
bsw/jbe@1309:       SELECTOR_FIELDS         = "[data-wysihtml-dialog-field]",
bsw/jbe@1309:       ATTRIBUTE_FIELDS        = "data-wysihtml-dialog-field";
bsw/jbe@1309: 
bsw/jbe@1309: 
bsw/jbe@1309:   wysihtml.toolbar.Dialog = wysihtml.lang.Dispatcher.extend(
bsw/jbe@1309:     /** @scope wysihtml.toolbar.Dialog.prototype */ {
bsw/jbe@1309:     constructor: function(link, container) {
bsw/jbe@1309:       this.link       = link;
bsw/jbe@1309:       this.container  = container;
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _observe: function() {
bsw/jbe@1309:       if (this._observed) {
bsw/jbe@1309:         return;
bsw/jbe@1309:       }
bsw/jbe@1309: 
bsw/jbe@1309:       var that = this,
bsw/jbe@1309:           callbackWrapper = function(event) {
bsw/jbe@1309:             var attributes = that._serialize();
bsw/jbe@1309:             that.fire("save", attributes);
bsw/jbe@1309:             that.hide();
bsw/jbe@1309:             event.preventDefault();
bsw/jbe@1309:             event.stopPropagation();
bsw/jbe@1309:           };
bsw/jbe@1309: 
bsw/jbe@1309:       dom.observe(that.link, "click", function() {
bsw/jbe@1309:         if (dom.hasClass(that.link, CLASS_NAME_OPENED)) {
bsw/jbe@1309:           setTimeout(function() { that.hide(); }, 0);
bsw/jbe@1309:         }
bsw/jbe@1309:       });
bsw/jbe@1309: 
bsw/jbe@1309:       dom.observe(this.container, "keydown", function(event) {
bsw/jbe@1309:         var keyCode = event.keyCode;
bsw/jbe@1309:         if (keyCode === wysihtml.ENTER_KEY) {
bsw/jbe@1309:           callbackWrapper(event);
bsw/jbe@1309:         }
bsw/jbe@1309:         if (keyCode === wysihtml.ESCAPE_KEY) {
bsw/jbe@1309:           that.cancel();
bsw/jbe@1309:         }
bsw/jbe@1309:       });
bsw/jbe@1309: 
bsw/jbe@1309:       dom.delegate(this.container, "[data-wysihtml-dialog-action=save]", "click", callbackWrapper);
bsw/jbe@1309: 
bsw/jbe@1309:       dom.delegate(this.container, "[data-wysihtml-dialog-action=cancel]", "click", function(event) {
bsw/jbe@1309:         that.cancel();
bsw/jbe@1309:         event.preventDefault();
bsw/jbe@1309:         event.stopPropagation();
bsw/jbe@1309:       });
bsw/jbe@1309: 
bsw/jbe@1309:       this._observed = true;
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     /**
bsw/jbe@1309:      * Grabs all fields in the dialog and puts them in key=>value style in an object which
bsw/jbe@1309:      * then gets returned
bsw/jbe@1309:      */
bsw/jbe@1309:     _serialize: function() {
bsw/jbe@1309:       var data    = {},
bsw/jbe@1309:           fields  = this.container.querySelectorAll(SELECTOR_FIELDS),
bsw/jbe@1309:           length  = fields.length,
bsw/jbe@1309:           i       = 0;
bsw/jbe@1309: 
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         data[fields[i].getAttribute(ATTRIBUTE_FIELDS)] = fields[i].value;
bsw/jbe@1309:       }
bsw/jbe@1309:       return data;
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     /**
bsw/jbe@1309:      * Takes the attributes of the "elementToChange"
bsw/jbe@1309:      * and inserts them in their corresponding dialog input fields
bsw/jbe@1309:      *
bsw/jbe@1309:      * Assume the "elementToChange" looks like this:
bsw/jbe@1309:      *    <a href="http://www.google.com" target="_blank">foo</a>
bsw/jbe@1309:      *
bsw/jbe@1309:      * and we have the following dialog:
bsw/jbe@1309:      *    <input type="text" data-wysihtml-dialog-field="href" value="">
bsw/jbe@1309:      *    <input type="text" data-wysihtml-dialog-field="target" value="">
bsw/jbe@1309:      *
bsw/jbe@1309:      * after calling _interpolate() the dialog will look like this
bsw/jbe@1309:      *    <input type="text" data-wysihtml-dialog-field="href" value="http://www.google.com">
bsw/jbe@1309:      *    <input type="text" data-wysihtml-dialog-field="target" value="_blank">
bsw/jbe@1309:      *
bsw/jbe@1309:      * Basically it adopted the attribute values into the corresponding input fields
bsw/jbe@1309:      *
bsw/jbe@1309:      */
bsw/jbe@1309:     _interpolate: function(avoidHiddenFields) {
bsw/jbe@1309:       var field,
bsw/jbe@1309:           fieldName,
bsw/jbe@1309:           newValue,
bsw/jbe@1309:           focusedElement = document.querySelector(":focus"),
bsw/jbe@1309:           fields         = this.container.querySelectorAll(SELECTOR_FIELDS),
bsw/jbe@1309:           length         = fields.length,
bsw/jbe@1309:           i              = 0;
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         field = fields[i];
bsw/jbe@1309: 
bsw/jbe@1309:         // Never change elements where the user is currently typing in
bsw/jbe@1309:         if (field === focusedElement) {
bsw/jbe@1309:           continue;
bsw/jbe@1309:         }
bsw/jbe@1309: 
bsw/jbe@1309:         // Don't update hidden fields
bsw/jbe@1309:         // See https://github.com/xing/wysihtml5/pull/14
bsw/jbe@1309:         if (avoidHiddenFields && field.type === "hidden") {
bsw/jbe@1309:           continue;
bsw/jbe@1309:         }
bsw/jbe@1309: 
bsw/jbe@1309:         fieldName = field.getAttribute(ATTRIBUTE_FIELDS);
bsw/jbe@1309:         newValue  = (this.elementToChange && typeof(this.elementToChange) !== 'boolean') ? (this.elementToChange.getAttribute(fieldName) || "") : field.defaultValue;
bsw/jbe@1309:         field.value = newValue;
bsw/jbe@1309:       }
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     update: function (elementToChange) {
bsw/jbe@1309:       this.elementToChange = elementToChange ? elementToChange : this.elementToChange;
bsw/jbe@1309:       this._interpolate();
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     /**
bsw/jbe@1309:      * Show the dialog element
bsw/jbe@1309:      */
bsw/jbe@1309:     show: function(elementToChange) {
bsw/jbe@1309:       var firstField  = this.container.querySelector(SELECTOR_FORM_ELEMENTS);
bsw/jbe@1309: 
bsw/jbe@1309:       this._observe();
bsw/jbe@1309:       this.update(elementToChange);
bsw/jbe@1309: 
bsw/jbe@1309:       dom.addClass(this.link, CLASS_NAME_OPENED);
bsw/jbe@1309:       this.container.style.display = "";
bsw/jbe@1309:       this.isOpen = true;
bsw/jbe@1309:       this.fire("show");
bsw/jbe@1309: 
bsw/jbe@1309:       if (firstField && !elementToChange) {
bsw/jbe@1309:         try {
bsw/jbe@1309:           firstField.focus();
bsw/jbe@1309:         } catch(e) {}
bsw/jbe@1309:       }
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     /**
bsw/jbe@1309:      * Hide the dialog element
bsw/jbe@1309:      */
bsw/jbe@1309:     _hide: function(focus) {
bsw/jbe@1309:       this.elementToChange = null;
bsw/jbe@1309:       dom.removeClass(this.link, CLASS_NAME_OPENED);
bsw/jbe@1309:       this.container.style.display = "none";
bsw/jbe@1309:       this.isOpen = false;
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     hide: function() {
bsw/jbe@1309:       this._hide();
bsw/jbe@1309:       this.fire("hide");
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     cancel: function() {
bsw/jbe@1309:       this._hide();
bsw/jbe@1309:       this.fire("cancel");
bsw/jbe@1309:     }
bsw/jbe@1309:   });
bsw/jbe@1309: })(wysihtml); //jshint ignore:line
bsw/jbe@1309: 
bsw/jbe@1309: (function(wysihtml) {
bsw/jbe@1309:   var dom                     = wysihtml.dom,
bsw/jbe@1309:       SELECTOR_FIELDS         = "[data-wysihtml-dialog-field]",
bsw/jbe@1309:       ATTRIBUTE_FIELDS        = "data-wysihtml-dialog-field";
bsw/jbe@1309: 
bsw/jbe@1309:   wysihtml.toolbar.Dialog_bgColorStyle = wysihtml.toolbar.Dialog.extend({
bsw/jbe@1309:     multiselect: true,
bsw/jbe@1309: 
bsw/jbe@1309:     _serialize: function() {
bsw/jbe@1309:       var data    = {},
bsw/jbe@1309:           fields  = this.container.querySelectorAll(SELECTOR_FIELDS),
bsw/jbe@1309:           length  = fields.length,
bsw/jbe@1309:           i       = 0;
bsw/jbe@1309: 
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         data[fields[i].getAttribute(ATTRIBUTE_FIELDS)] = fields[i].value;
bsw/jbe@1309:       }
bsw/jbe@1309:       return data;
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _interpolate: function(avoidHiddenFields) {
bsw/jbe@1309:       var field,
bsw/jbe@1309:           fieldName,
bsw/jbe@1309:           newValue,
bsw/jbe@1309:           focusedElement = document.querySelector(":focus"),
bsw/jbe@1309:           fields         = this.container.querySelectorAll(SELECTOR_FIELDS),
bsw/jbe@1309:           length         = fields.length,
bsw/jbe@1309:           i              = 0,
bsw/jbe@1309:           firstElement   = (this.elementToChange) ? ((wysihtml.lang.object(this.elementToChange).isArray()) ? this.elementToChange[0] : this.elementToChange) : null,
bsw/jbe@1309:           colorStr       = (firstElement) ? firstElement.getAttribute('style') : null,
bsw/jbe@1309:           color          = (colorStr) ? wysihtml.quirks.styleParser.parseColor(colorStr, "background-color") : null;
bsw/jbe@1309: 
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         field = fields[i];
bsw/jbe@1309:         // Never change elements where the user is currently typing in
bsw/jbe@1309:         if (field === focusedElement) {
bsw/jbe@1309:           continue;
bsw/jbe@1309:         }
bsw/jbe@1309:         // Don't update hidden fields3
bsw/jbe@1309:         if (avoidHiddenFields && field.type === "hidden") {
bsw/jbe@1309:           continue;
bsw/jbe@1309:         }
bsw/jbe@1309:         if (field.getAttribute(ATTRIBUTE_FIELDS) === "color") {
bsw/jbe@1309:           if (color) {
bsw/jbe@1309:             if (color[3] && color[3] != 1) {
bsw/jbe@1309:               field.value = "rgba(" + color[0] + "," + color[1] + "," + color[2] + "," + color[3] + ");";
bsw/jbe@1309:             } else {
bsw/jbe@1309:               field.value = "rgb(" + color[0] + "," + color[1] + "," + color[2] + ");";
bsw/jbe@1309:             }
bsw/jbe@1309:           } else {
bsw/jbe@1309:             field.value = "rgb(0,0,0);";
bsw/jbe@1309:           }
bsw/jbe@1309:         }
bsw/jbe@1309:       }
bsw/jbe@1309:     }
bsw/jbe@1309: 
bsw/jbe@1309:   });
bsw/jbe@1309: })(wysihtml);
bsw/jbe@1309: 
bsw/jbe@1309: (function(wysihtml) {
bsw/jbe@1309:   wysihtml.toolbar.Dialog_createTable = wysihtml.toolbar.Dialog.extend({
bsw/jbe@1309:     show: function(elementToChange) {
bsw/jbe@1309:       this.base(elementToChange);
bsw/jbe@1309:     }
bsw/jbe@1309:   });
bsw/jbe@1309: })(wysihtml);
bsw/jbe@1309: 
bsw/jbe@1309: (function(wysihtml) {
bsw/jbe@1309:   var dom                     = wysihtml.dom,
bsw/jbe@1309:       SELECTOR_FIELDS         = "[data-wysihtml-dialog-field]",
bsw/jbe@1309:       ATTRIBUTE_FIELDS        = "data-wysihtml-dialog-field";
bsw/jbe@1309: 
bsw/jbe@1309:   wysihtml.toolbar.Dialog_fontSizeStyle = wysihtml.toolbar.Dialog.extend({
bsw/jbe@1309:     multiselect: true,
bsw/jbe@1309: 
bsw/jbe@1309:     _serialize: function() {
bsw/jbe@1309:       return {"size" : this.container.querySelector('[data-wysihtml-dialog-field="size"]').value};
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _interpolate: function(avoidHiddenFields) {
bsw/jbe@1309:       var focusedElement = document.querySelector(":focus"),
bsw/jbe@1309:           field          = this.container.querySelector("[data-wysihtml-dialog-field='size']"),
bsw/jbe@1309:           firstElement   = (this.elementToChange) ? ((wysihtml.lang.object(this.elementToChange).isArray()) ? this.elementToChange[0] : this.elementToChange) : null,
bsw/jbe@1309:           styleStr       = (firstElement) ? firstElement.getAttribute('style') : null,
bsw/jbe@1309:           size           = (styleStr) ? wysihtml.quirks.styleParser.parseFontSize(styleStr) : null;
bsw/jbe@1309: 
bsw/jbe@1309:       if (field && field !== focusedElement && size && !(/^\s*$/).test(size)) {
bsw/jbe@1309:         field.value = size;
bsw/jbe@1309:       }
bsw/jbe@1309:     }
bsw/jbe@1309:   });
bsw/jbe@1309: })(wysihtml);
bsw/jbe@1309: 
bsw/jbe@1309: (function(wysihtml) {
bsw/jbe@1309:   var SELECTOR_FIELDS         = "[data-wysihtml-dialog-field]",
bsw/jbe@1309:       ATTRIBUTE_FIELDS        = "data-wysihtml-dialog-field";
bsw/jbe@1309: 
bsw/jbe@1309:   wysihtml.toolbar.Dialog_foreColorStyle = wysihtml.toolbar.Dialog.extend({
bsw/jbe@1309:     multiselect: true,
bsw/jbe@1309: 
bsw/jbe@1309:     _serialize: function() {
bsw/jbe@1309:       var data    = {},
bsw/jbe@1309:           fields  = this.container.querySelectorAll(SELECTOR_FIELDS),
bsw/jbe@1309:           length  = fields.length,
bsw/jbe@1309:           i       = 0;
bsw/jbe@1309: 
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         data[fields[i].getAttribute(ATTRIBUTE_FIELDS)] = fields[i].value;
bsw/jbe@1309:       }
bsw/jbe@1309:       return data;
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _interpolate: function(avoidHiddenFields) {
bsw/jbe@1309:       var field, colourMode,
bsw/jbe@1309:           styleParser = wysihtml.quirks.styleParser,
bsw/jbe@1309:           focusedElement = document.querySelector(":focus"),
bsw/jbe@1309:           fields         = this.container.querySelectorAll(SELECTOR_FIELDS),
bsw/jbe@1309:           length         = fields.length,
bsw/jbe@1309:           i              = 0,
bsw/jbe@1309:           firstElement   = (this.elementToChange) ? ((wysihtml.lang.object(this.elementToChange).isArray()) ? this.elementToChange[0] : this.elementToChange) : null,
bsw/jbe@1309:           colourStr       = (firstElement) ? firstElement.getAttribute("style") : null,
bsw/jbe@1309:           colour          = (colourStr) ? styleParser.parseColor(colourStr, "color") : null;
bsw/jbe@1309: 
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         field = fields[i];
bsw/jbe@1309:         // Never change elements where the user is currently typing in
bsw/jbe@1309:         if (field === focusedElement) {
bsw/jbe@1309:           continue;
bsw/jbe@1309:         }
bsw/jbe@1309:         // Don't update hidden fields3
bsw/jbe@1309:         if (avoidHiddenFields && field.type === "hidden") {
bsw/jbe@1309:           continue;
bsw/jbe@1309:         }
bsw/jbe@1309:         if (field.getAttribute(ATTRIBUTE_FIELDS) === "color") {
bsw/jbe@1309:           colourMode = (field.dataset.colormode || "rgb").toLowerCase();
bsw/jbe@1309:           colourMode = colourMode === "hex" ? "hash" : colourMode;
bsw/jbe@1309: 
bsw/jbe@1309:           if (colour) {
bsw/jbe@1309:             field.value = styleParser.unparseColor(colour, colourMode);
bsw/jbe@1309:           } else {
bsw/jbe@1309:             field.value = styleParser.unparseColor([0, 0, 0], colourMode);
bsw/jbe@1309:           }
bsw/jbe@1309:         }
bsw/jbe@1309:       }
bsw/jbe@1309:     }
bsw/jbe@1309: 
bsw/jbe@1309:   });
bsw/jbe@1309: })(wysihtml);
bsw/jbe@1309: 
bsw/jbe@1309: /**
bsw/jbe@1309:  * Converts speech-to-text and inserts this into the editor
bsw/jbe@1309:  * As of now (2011/03/25) this only is supported in Chrome >= 11
bsw/jbe@1309:  *
bsw/jbe@1309:  * Note that it sends the recorded audio to the google speech recognition api:
bsw/jbe@1309:  * http://stackoverflow.com/questions/4361826/does-chrome-have-buil-in-speech-recognition-for-input-type-text-x-webkit-speec
bsw/jbe@1309:  *
bsw/jbe@1309:  * Current HTML5 draft can be found here
bsw/jbe@1309:  * http://lists.w3.org/Archives/Public/public-xg-htmlspeech/2011Feb/att-0020/api-draft.html
bsw/jbe@1309:  *
bsw/jbe@1309:  * "Accessing Google Speech API Chrome 11"
bsw/jbe@1309:  * http://mikepultz.com/2011/03/accessing-google-speech-api-chrome-11/
bsw/jbe@1309:  */
bsw/jbe@1309: (function(wysihtml) {
bsw/jbe@1309:   var dom = wysihtml.dom;
bsw/jbe@1309: 
bsw/jbe@1309:   var linkStyles = {
bsw/jbe@1309:     position: "relative"
bsw/jbe@1309:   };
bsw/jbe@1309: 
bsw/jbe@1309:   var wrapperStyles = {
bsw/jbe@1309:     left:     0,
bsw/jbe@1309:     margin:   0,
bsw/jbe@1309:     opacity:  0,
bsw/jbe@1309:     overflow: "hidden",
bsw/jbe@1309:     padding:  0,
bsw/jbe@1309:     position: "absolute",
bsw/jbe@1309:     top:      0,
bsw/jbe@1309:     zIndex:   1
bsw/jbe@1309:   };
bsw/jbe@1309: 
bsw/jbe@1309:   var inputStyles = {
bsw/jbe@1309:     cursor:     "inherit",
bsw/jbe@1309:     fontSize:   "50px",
bsw/jbe@1309:     height:     "50px",
bsw/jbe@1309:     marginTop:  "-25px",
bsw/jbe@1309:     outline:    0,
bsw/jbe@1309:     padding:    0,
bsw/jbe@1309:     position:   "absolute",
bsw/jbe@1309:     right:      "-4px",
bsw/jbe@1309:     top:        "50%"
bsw/jbe@1309:   };
bsw/jbe@1309: 
bsw/jbe@1309:   var inputAttributes = {
bsw/jbe@1309:     "x-webkit-speech": "",
bsw/jbe@1309:     "speech":          ""
bsw/jbe@1309:   };
bsw/jbe@1309: 
bsw/jbe@1309:   wysihtml.toolbar.Speech = function(parent, link) {
bsw/jbe@1309:     var input = document.createElement("input");
bsw/jbe@1309:     if (!wysihtml.browser.supportsSpeechApiOn(input)) {
bsw/jbe@1309:       link.style.display = "none";
bsw/jbe@1309:       return;
bsw/jbe@1309:     }
bsw/jbe@1309:     var lang = parent.editor.textarea.element.getAttribute("lang");
bsw/jbe@1309:     if (lang) {
bsw/jbe@1309:       inputAttributes.lang = lang;
bsw/jbe@1309:     }
bsw/jbe@1309: 
bsw/jbe@1309:     var wrapper = document.createElement("div");
bsw/jbe@1309: 
bsw/jbe@1309:     wysihtml.lang.object(wrapperStyles).merge({
bsw/jbe@1309:       width:  link.offsetWidth  + "px",
bsw/jbe@1309:       height: link.offsetHeight + "px"
bsw/jbe@1309:     });
bsw/jbe@1309: 
bsw/jbe@1309:     dom.insert(input).into(wrapper);
bsw/jbe@1309:     dom.insert(wrapper).into(link);
bsw/jbe@1309: 
bsw/jbe@1309:     dom.setStyles(inputStyles).on(input);
bsw/jbe@1309:     dom.setAttributes(inputAttributes).on(input);
bsw/jbe@1309: 
bsw/jbe@1309:     dom.setStyles(wrapperStyles).on(wrapper);
bsw/jbe@1309:     dom.setStyles(linkStyles).on(link);
bsw/jbe@1309: 
bsw/jbe@1309:     var eventName = "onwebkitspeechchange" in input ? "webkitspeechchange" : "speechchange";
bsw/jbe@1309:     dom.observe(input, eventName, function() {
bsw/jbe@1309:       parent.execCommand("insertText", input.value);
bsw/jbe@1309:       input.value = "";
bsw/jbe@1309:     });
bsw/jbe@1309: 
bsw/jbe@1309:     dom.observe(input, "click", function(event) {
bsw/jbe@1309:       if (dom.hasClass(link, "wysihtml-command-disabled")) {
bsw/jbe@1309:         event.preventDefault();
bsw/jbe@1309:       }
bsw/jbe@1309: 
bsw/jbe@1309:       event.stopPropagation();
bsw/jbe@1309:     });
bsw/jbe@1309:   };
bsw/jbe@1309: })(wysihtml);
bsw/jbe@1309: 
bsw/jbe@1309: /**
bsw/jbe@1309:  * Toolbar
bsw/jbe@1309:  *
bsw/jbe@1309:  * @param {Object} parent Reference to instance of Editor instance
bsw/jbe@1309:  * @param {Element} container Reference to the toolbar container element
bsw/jbe@1309:  *
bsw/jbe@1309:  * @example
bsw/jbe@1309:  *    <div id="toolbar">
bsw/jbe@1309:  *      <a data-wysihtml-command="createLink">insert link</a>
bsw/jbe@1309:  *      <a data-wysihtml-command="formatBlock" data-wysihtml-command-value="h1">insert h1</a>
bsw/jbe@1309:  *    </div>
bsw/jbe@1309:  *
bsw/jbe@1309:  *    <script>
bsw/jbe@1309:  *      var toolbar = new wysihtml.toolbar.Toolbar(editor, document.getElementById("toolbar"));
bsw/jbe@1309:  *    </script>
bsw/jbe@1309:  */
bsw/jbe@1309: (function(wysihtml) {
bsw/jbe@1309:   var CLASS_NAME_COMMAND_DISABLED   = "wysihtml-command-disabled",
bsw/jbe@1309:       CLASS_NAME_COMMANDS_DISABLED  = "wysihtml-commands-disabled",
bsw/jbe@1309:       CLASS_NAME_COMMAND_ACTIVE     = "wysihtml-command-active",
bsw/jbe@1309:       CLASS_NAME_ACTION_ACTIVE      = "wysihtml-action-active",
bsw/jbe@1309:       dom                           = wysihtml.dom;
bsw/jbe@1309: 
bsw/jbe@1309:   wysihtml.toolbar.Toolbar = Base.extend(
bsw/jbe@1309:     /** @scope wysihtml.toolbar.Toolbar.prototype */ {
bsw/jbe@1309:     constructor: function(editor, container, showOnInit) {
bsw/jbe@1309:       this.editor     = editor;
bsw/jbe@1309:       this.container  = typeof(container) === "string" ? document.getElementById(container) : container;
bsw/jbe@1309:       this.composer   = editor.composer;
bsw/jbe@1309: 
bsw/jbe@1309:       this._getLinks("command");
bsw/jbe@1309:       this._getLinks("action");
bsw/jbe@1309: 
bsw/jbe@1309:       this._observe();
bsw/jbe@1309:       if (showOnInit) { this.show(); }
bsw/jbe@1309: 
bsw/jbe@1309:       if (editor.config.classNameCommandDisabled != null) {
bsw/jbe@1309:         CLASS_NAME_COMMAND_DISABLED = editor.config.classNameCommandDisabled;
bsw/jbe@1309:       }
bsw/jbe@1309:       if (editor.config.classNameCommandsDisabled != null) {
bsw/jbe@1309:         CLASS_NAME_COMMANDS_DISABLED = editor.config.classNameCommandsDisabled;
bsw/jbe@1309:       }
bsw/jbe@1309:       if (editor.config.classNameCommandActive != null) {
bsw/jbe@1309:         CLASS_NAME_COMMAND_ACTIVE = editor.config.classNameCommandActive;
bsw/jbe@1309:       }
bsw/jbe@1309:       if (editor.config.classNameActionActive != null) {
bsw/jbe@1309:         CLASS_NAME_ACTION_ACTIVE = editor.config.classNameActionActive;
bsw/jbe@1309:       }
bsw/jbe@1309: 
bsw/jbe@1309:       var speechInputLinks  = this.container.querySelectorAll("[data-wysihtml-command=insertSpeech]"),
bsw/jbe@1309:           length            = speechInputLinks.length,
bsw/jbe@1309:           i                 = 0;
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         new wysihtml.toolbar.Speech(this, speechInputLinks[i]);
bsw/jbe@1309:       }
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _getLinks: function(type) {
bsw/jbe@1309:       var links   = this[type + "Links"] = wysihtml.lang.array(this.container.querySelectorAll("[data-wysihtml-" + type + "]")).get(),
bsw/jbe@1309:           length  = links.length,
bsw/jbe@1309:           i       = 0,
bsw/jbe@1309:           mapping = this[type + "Mapping"] = {},
bsw/jbe@1309:           link,
bsw/jbe@1309:           group,
bsw/jbe@1309:           name,
bsw/jbe@1309:           value,
bsw/jbe@1309:           dialog,
bsw/jbe@1309:           tracksBlankValue;
bsw/jbe@1309: 
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         link    = links[i];
bsw/jbe@1309:         name    = link.getAttribute("data-wysihtml-" + type);
bsw/jbe@1309:         value   = link.getAttribute("data-wysihtml-" + type + "-value");
bsw/jbe@1309:         tracksBlankValue   = link.getAttribute("data-wysihtml-" + type + "-blank-value");
bsw/jbe@1309:         group   = this.container.querySelector("[data-wysihtml-" + type + "-group='" + name + "']");
bsw/jbe@1309:         dialog  = this._getDialog(link, name);
bsw/jbe@1309: 
bsw/jbe@1309:         mapping[name + ":" + value] = {
bsw/jbe@1309:           link:   link,
bsw/jbe@1309:           group:  group,
bsw/jbe@1309:           name:   name,
bsw/jbe@1309:           value:  value,
bsw/jbe@1309:           tracksBlankValue: tracksBlankValue,
bsw/jbe@1309:           dialog: dialog,
bsw/jbe@1309:           state:  false
bsw/jbe@1309:         };
bsw/jbe@1309:       }
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _getDialog: function(link, command) {
bsw/jbe@1309:       var that          = this,
bsw/jbe@1309:           dialogElement = this.container.querySelector("[data-wysihtml-dialog='" + command + "']"),
bsw/jbe@1309:           dialog, caretBookmark;
bsw/jbe@1309: 
bsw/jbe@1309:       if (dialogElement) {
bsw/jbe@1309:         if (wysihtml.toolbar["Dialog_" + command]) {
bsw/jbe@1309:             dialog = new wysihtml.toolbar["Dialog_" + command](link, dialogElement);
bsw/jbe@1309:         } else {
bsw/jbe@1309:             dialog = new wysihtml.toolbar.Dialog(link, dialogElement);
bsw/jbe@1309:         }
bsw/jbe@1309: 
bsw/jbe@1309:         dialog.on("show", function() {
bsw/jbe@1309:           caretBookmark = that.composer.selection.getBookmark();
bsw/jbe@1309:           that.editor.fire("show:dialog", { command: command, dialogContainer: dialogElement, commandLink: link });
bsw/jbe@1309:         });
bsw/jbe@1309: 
bsw/jbe@1309:         dialog.on("save", function(attributes) {
bsw/jbe@1309:           if (caretBookmark) {
bsw/jbe@1309:             that.composer.selection.setBookmark(caretBookmark);
bsw/jbe@1309:           }
bsw/jbe@1309:           that._execCommand(command, attributes);
bsw/jbe@1309:           that.editor.fire("save:dialog", { command: command, dialogContainer: dialogElement, commandLink: link });
bsw/jbe@1309:           that._hideAllDialogs();
bsw/jbe@1309:           that._preventInstantFocus();
bsw/jbe@1309:           caretBookmark = undefined;
bsw/jbe@1309: 
bsw/jbe@1309:         });
bsw/jbe@1309: 
bsw/jbe@1309:         dialog.on("cancel", function() {
bsw/jbe@1309:           if (caretBookmark) {
bsw/jbe@1309:             that.composer.selection.setBookmark(caretBookmark);
bsw/jbe@1309:           }
bsw/jbe@1309:           that.editor.fire("cancel:dialog", { command: command, dialogContainer: dialogElement, commandLink: link });
bsw/jbe@1309:           caretBookmark = undefined;
bsw/jbe@1309:           that._preventInstantFocus();
bsw/jbe@1309:         });
bsw/jbe@1309: 
bsw/jbe@1309:         dialog.on("hide", function() {
bsw/jbe@1309:           that.editor.fire("hide:dialog", { command: command, dialogContainer: dialogElement, commandLink: link });
bsw/jbe@1309:           caretBookmark = undefined;
bsw/jbe@1309:         });
bsw/jbe@1309: 
bsw/jbe@1309:       }
bsw/jbe@1309:       return dialog;
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     /**
bsw/jbe@1309:      * @example
bsw/jbe@1309:      *    var toolbar = new wysihtml.Toolbar();
bsw/jbe@1309:      *    // Insert a <blockquote> element or wrap current selection in <blockquote>
bsw/jbe@1309:      *    toolbar.execCommand("formatBlock", "blockquote");
bsw/jbe@1309:      */
bsw/jbe@1309:     execCommand: function(command, commandValue) {
bsw/jbe@1309:       if (this.commandsDisabled) {
bsw/jbe@1309:         return;
bsw/jbe@1309:       }
bsw/jbe@1309: 
bsw/jbe@1309:       this._execCommand(command, commandValue);
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _execCommand: function(command, commandValue) {
bsw/jbe@1309:       // Make sure that composer is focussed (false => don't move caret to the end)
bsw/jbe@1309:       this.editor.focus(false);
bsw/jbe@1309: 
bsw/jbe@1309:       this.composer.commands.exec(command, commandValue);
bsw/jbe@1309:       this._updateLinkStates();
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     execAction: function(action) {
bsw/jbe@1309:       var editor = this.editor;
bsw/jbe@1309:       if (action === "change_view") {
bsw/jbe@1309:         if (editor.currentView === editor.textarea || editor.currentView === "source") {
bsw/jbe@1309:           editor.fire("change_view", "composer");
bsw/jbe@1309:         } else {
bsw/jbe@1309:           editor.fire("change_view", "textarea");
bsw/jbe@1309:         }
bsw/jbe@1309:       }
bsw/jbe@1309:       if (action == "showSource") {
bsw/jbe@1309:           editor.fire("showSource");
bsw/jbe@1309:       }
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _observe: function() {
bsw/jbe@1309:       var that      = this,
bsw/jbe@1309:           editor    = this.editor,
bsw/jbe@1309:           container = this.container,
bsw/jbe@1309:           links     = this.commandLinks.concat(this.actionLinks),
bsw/jbe@1309:           length    = links.length,
bsw/jbe@1309:           i         = 0;
bsw/jbe@1309: 
bsw/jbe@1309:       for (; i<length; i++) {
bsw/jbe@1309:         // 'javascript:;' and unselectable=on Needed for IE, but done in all browsers to make sure that all get the same css applied
bsw/jbe@1309:         // (you know, a:link { ... } doesn't match anchors with missing href attribute)
bsw/jbe@1309:         if (links[i].nodeName === "A") {
bsw/jbe@1309:           dom.setAttributes({
bsw/jbe@1309:             href:         "javascript:;",
bsw/jbe@1309:             unselectable: "on"
bsw/jbe@1309:           }).on(links[i]);
bsw/jbe@1309:         } else {
bsw/jbe@1309:           dom.setAttributes({ unselectable: "on" }).on(links[i]);
bsw/jbe@1309:         }
bsw/jbe@1309:       }
bsw/jbe@1309: 
bsw/jbe@1309:       // Needed for opera and chrome
bsw/jbe@1309:       dom.delegate(container, "[data-wysihtml-command], [data-wysihtml-action]", "mousedown", function(event) { event.preventDefault(); });
bsw/jbe@1309: 
bsw/jbe@1309:       dom.delegate(container, "[data-wysihtml-command]", "click", function(event) {
bsw/jbe@1309:         var state,
bsw/jbe@1309:             link          = this,
bsw/jbe@1309:             command       = link.getAttribute("data-wysihtml-command"),
bsw/jbe@1309:             commandValue  = link.getAttribute("data-wysihtml-command-value"),
bsw/jbe@1309:             commandObj = that.commandMapping[command + ":" + commandValue];
bsw/jbe@1309: 
bsw/jbe@1309:         if (commandValue || !commandObj.dialog) {
bsw/jbe@1309:           that.execCommand(command, commandValue);
bsw/jbe@1309:         } else {
bsw/jbe@1309:           state = getCommandState(that.composer, commandObj);
bsw/jbe@1309:           commandObj.dialog.show(state);
bsw/jbe@1309:         }
bsw/jbe@1309: 
bsw/jbe@1309:         event.preventDefault();
bsw/jbe@1309:       });
bsw/jbe@1309: 
bsw/jbe@1309:       dom.delegate(container, "[data-wysihtml-action]", "click", function(event) {
bsw/jbe@1309:         var action = this.getAttribute("data-wysihtml-action");
bsw/jbe@1309:         that.execAction(action);
bsw/jbe@1309:         event.preventDefault();
bsw/jbe@1309:       });
bsw/jbe@1309: 
bsw/jbe@1309:       editor.on("interaction:composer", function(event) {
bsw/jbe@1309:         if (!that.preventFocus) {
bsw/jbe@1309:           that._updateLinkStates();
bsw/jbe@1309:         }
bsw/jbe@1309:       });
bsw/jbe@1309: 
bsw/jbe@1309:       this._ownerDocumentClick = function(event) {
bsw/jbe@1309:         if (!wysihtml.dom.contains(that.container, event.target) && !wysihtml.dom.contains(that.composer.element, event.target)) {
bsw/jbe@1309:           that._updateLinkStates();
bsw/jbe@1309:           that._preventInstantFocus();
bsw/jbe@1309:         }
bsw/jbe@1309:       };
bsw/jbe@1309: 
bsw/jbe@1309:       this.container.ownerDocument.addEventListener("click", this._ownerDocumentClick, false);
bsw/jbe@1309:       this.editor.on("destroy:composer", this.destroy.bind(this));
bsw/jbe@1309: 
bsw/jbe@1309:       if (this.editor.config.handleTables) {
bsw/jbe@1309:         editor.on("tableselect:composer", function() {
bsw/jbe@1309:             that.container.querySelectorAll('[data-wysihtml-hiddentools="table"]')[0].style.display = "";
bsw/jbe@1309:         });
bsw/jbe@1309:         editor.on("tableunselect:composer", function() {
bsw/jbe@1309:             that.container.querySelectorAll('[data-wysihtml-hiddentools="table"]')[0].style.display = "none";
bsw/jbe@1309:         });
bsw/jbe@1309:       }
bsw/jbe@1309: 
bsw/jbe@1309:       editor.on("change_view", function(currentView) {
bsw/jbe@1309:         // Set timeout needed in order to let the blur event fire first
bsw/jbe@1309:           setTimeout(function() {
bsw/jbe@1309:             that.commandsDisabled = (currentView !== "composer");
bsw/jbe@1309:             that._updateLinkStates();
bsw/jbe@1309:             if (that.commandsDisabled) {
bsw/jbe@1309:               dom.addClass(container, CLASS_NAME_COMMANDS_DISABLED);
bsw/jbe@1309:             } else {
bsw/jbe@1309:               dom.removeClass(container, CLASS_NAME_COMMANDS_DISABLED);
bsw/jbe@1309:             }
bsw/jbe@1309:           }, 0);
bsw/jbe@1309:       });
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     destroy: function() {
bsw/jbe@1309:       this.container.ownerDocument.removeEventListener("click", this._ownerDocumentClick, false);
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _hideAllDialogs: function() {
bsw/jbe@1309:       var commandMapping      = this.commandMapping;
bsw/jbe@1309:       for (var i in commandMapping) {
bsw/jbe@1309:         if (commandMapping[i].dialog) {
bsw/jbe@1309:           commandMapping[i].dialog.hide();
bsw/jbe@1309:         }
bsw/jbe@1309:       }
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _preventInstantFocus: function() {
bsw/jbe@1309:       this.preventFocus = true;
bsw/jbe@1309:       setTimeout(function() {
bsw/jbe@1309:         this.preventFocus = false;
bsw/jbe@1309:       }.bind(this),0);
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     _updateLinkStates: function() {
bsw/jbe@1309: 
bsw/jbe@1309:       var i, state, action, command, displayDialogAttributeValue,
bsw/jbe@1309:           commandMapping      = this.commandMapping,
bsw/jbe@1309:           composer            = this.composer,
bsw/jbe@1309:           actionMapping       = this.actionMapping;
bsw/jbe@1309:       // every millisecond counts... this is executed quite often
bsw/jbe@1309:       for (i in commandMapping) {
bsw/jbe@1309:         command = commandMapping[i];
bsw/jbe@1309:         if (this.commandsDisabled) {
bsw/jbe@1309:           state = false;
bsw/jbe@1309:           dom.removeClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
bsw/jbe@1309:           if (command.group) {
bsw/jbe@1309:             dom.removeClass(command.group, CLASS_NAME_COMMAND_ACTIVE);
bsw/jbe@1309:           }
bsw/jbe@1309:           if (command.dialog) {
bsw/jbe@1309:             command.dialog.hide();
bsw/jbe@1309:           }
bsw/jbe@1309:         } else {
bsw/jbe@1309:           state = this.composer.commands.state(command.name, command.value);
bsw/jbe@1309:           dom.removeClass(command.link, CLASS_NAME_COMMAND_DISABLED);
bsw/jbe@1309:           if (command.group) {
bsw/jbe@1309:             dom.removeClass(command.group, CLASS_NAME_COMMAND_DISABLED);
bsw/jbe@1309:           }
bsw/jbe@1309:         }
bsw/jbe@1309:         if (command.state === state && !command.tracksBlankValue) {
bsw/jbe@1309:           continue;
bsw/jbe@1309:         }
bsw/jbe@1309: 
bsw/jbe@1309:         command.state = state;
bsw/jbe@1309:         if (state) {
bsw/jbe@1309:           if (command.tracksBlankValue) {
bsw/jbe@1309:             dom.removeClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
bsw/jbe@1309:           } else {
bsw/jbe@1309:             dom.addClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
bsw/jbe@1309:             if (command.group) {
bsw/jbe@1309:               dom.addClass(command.group, CLASS_NAME_COMMAND_ACTIVE);
bsw/jbe@1309:             }
bsw/jbe@1309:             // commands with fixed value can not have a dialog.
bsw/jbe@1309:             if (command.dialog && (typeof command.value === "undefined" || command.value === null)) {
bsw/jbe@1309:               if (state && typeof state === "object") {
bsw/jbe@1309:                 state = getCommandState(composer, command);
bsw/jbe@1309:                 command.state = state;
bsw/jbe@1309: 
bsw/jbe@1309:                 // If dialog has dataset.showdialogonselection set as true,
bsw/jbe@1309:                 // Dialog displays on text state becoming active regardless of clobal showToolbarDialogsOnSelection options value
bsw/jbe@1309:                 displayDialogAttributeValue = command.dialog.container.dataset ? command.dialog.container.dataset.showdialogonselection : false;
bsw/jbe@1309: 
bsw/jbe@1309:                 if (composer.config.showToolbarDialogsOnSelection || displayDialogAttributeValue) {
bsw/jbe@1309:                   command.dialog.show(state);
bsw/jbe@1309:                 } else {
bsw/jbe@1309:                   command.dialog.update(state);
bsw/jbe@1309:                 }
bsw/jbe@1309:               } else {
bsw/jbe@1309:                 command.dialog.hide();
bsw/jbe@1309:               }
bsw/jbe@1309:             }
bsw/jbe@1309:           }
bsw/jbe@1309:         } else {
bsw/jbe@1309:           if (command.tracksBlankValue) {
bsw/jbe@1309:             dom.addClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
bsw/jbe@1309:           } else {
bsw/jbe@1309:             dom.removeClass(command.link, CLASS_NAME_COMMAND_ACTIVE);
bsw/jbe@1309:             if (command.group) {
bsw/jbe@1309:               dom.removeClass(command.group, CLASS_NAME_COMMAND_ACTIVE);
bsw/jbe@1309:             }
bsw/jbe@1309:             // commands with fixed value can not have a dialog.
bsw/jbe@1309:             if (command.dialog && !command.value) {
bsw/jbe@1309:               command.dialog.hide();
bsw/jbe@1309:             }
bsw/jbe@1309:           }
bsw/jbe@1309:         }
bsw/jbe@1309:       }
bsw/jbe@1309: 
bsw/jbe@1309:       for (i in actionMapping) {
bsw/jbe@1309:         action = actionMapping[i];
bsw/jbe@1309: 
bsw/jbe@1309:         if (action.name === "change_view") {
bsw/jbe@1309:           action.state = this.editor.currentView === this.editor.textarea || this.editor.currentView === "source";
bsw/jbe@1309:           if (action.state) {
bsw/jbe@1309:             dom.addClass(action.link, CLASS_NAME_ACTION_ACTIVE);
bsw/jbe@1309:           } else {
bsw/jbe@1309:             dom.removeClass(action.link, CLASS_NAME_ACTION_ACTIVE);
bsw/jbe@1309:           }
bsw/jbe@1309:         }
bsw/jbe@1309:       }
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     show: function() {
bsw/jbe@1309:       this.container.style.display = "";
bsw/jbe@1309:     },
bsw/jbe@1309: 
bsw/jbe@1309:     hide: function() {
bsw/jbe@1309:       this.container.style.display = "none";
bsw/jbe@1309:     }
bsw/jbe@1309:   });
bsw/jbe@1309: 
bsw/jbe@1309:   function getCommandState (composer, command) {
bsw/jbe@1309:     var state = composer.commands.state(command.name, command.value);
bsw/jbe@1309: 
bsw/jbe@1309:     // Grab first and only object/element in state array, otherwise convert state into boolean
bsw/jbe@1309:     // to avoid showing a dialog for multiple selected elements which may have different attributes
bsw/jbe@1309:     // eg. when two links with different href are selected, the state will be an array consisting of both link elements
bsw/jbe@1309:     // but the dialog interface can only update one
bsw/jbe@1309:     if (!command.dialog.multiselect && wysihtml.lang.object(state).isArray()) {
bsw/jbe@1309:       state = state.length === 1 ? state[0] : true;
bsw/jbe@1309:     }
bsw/jbe@1309: 
bsw/jbe@1309:     return state;
bsw/jbe@1309:   }
bsw/jbe@1309: 
bsw/jbe@1309:   // Extend defaults
bsw/jbe@1309: 
bsw/jbe@1309:   // Id of the toolbar element, pass falsey value if you don't want any toolbar logic
bsw/jbe@1309:   wysihtml.Editor.prototype.defaults.toolbar = undefined;
bsw/jbe@1309: 
bsw/jbe@1309:   // Whether toolbar is displayed after init by script automatically.
bsw/jbe@1309:   // Can be set to false if toolobar is set to display only on editable area focus
bsw/jbe@1309:   wysihtml.Editor.prototype.defaults.showToolbarAfterInit = true;
bsw/jbe@1309: 
bsw/jbe@1309:   // With default toolbar it shows dialogs in toolbar when their related text format state becomes active (click on link in text opens link dialogue)
bsw/jbe@1309:   wysihtml.Editor.prototype.defaults.showToolbarDialogsOnSelection= true;
bsw/jbe@1309: 
bsw/jbe@1309:   // Bind toolbar initiation on editor instance creation
bsw/jbe@1309:   wysihtml.extendEditor(function(editor) {
bsw/jbe@1309:     if (editor.config.toolbar) {
bsw/jbe@1309:       editor.toolbar = new wysihtml.toolbar.Toolbar(editor, editor.config.toolbar, editor.config.showToolbarAfterInit);
bsw/jbe@1309:       editor.on('destroy:composer', function() {
bsw/jbe@1309:         if (editor && editor.toolbar) {
bsw/jbe@1309:           editor.toolbar.destroy();
bsw/jbe@1309:         }
bsw/jbe@1309:       });
bsw/jbe@1309:     }
bsw/jbe@1309:   });
bsw/jbe@1309: 
bsw/jbe@1309: })(wysihtml);