[795] | 1 | // Simple CSS (className) plugin for the editor |
---|
| 2 | // Sponsored by http://www.miro.com.au |
---|
| 3 | // Implementation by Mihai Bazon, http://dynarch.com/mishoo. |
---|
| 4 | // |
---|
| 5 | // (c) dynarch.com 2003 |
---|
| 6 | // Distributed under the same terms as HTMLArea itself. |
---|
| 7 | // This notice MUST stay intact for use (see license.txt). |
---|
| 8 | // |
---|
| 9 | |
---|
| 10 | function CSS(editor, params) { |
---|
| 11 | this.editor = editor; |
---|
| 12 | var cfg = editor.config; |
---|
| 13 | var toolbar = cfg.toolbar; |
---|
| 14 | var self = this; |
---|
| 15 | var i18n = CSS.I18N; |
---|
| 16 | var plugin_config = params[0]; |
---|
| 17 | var combos = plugin_config.combos; |
---|
| 18 | |
---|
| 19 | var first = true; |
---|
| 20 | for (var i = combos.length; --i >= 0;) { |
---|
| 21 | var combo = combos[i]; |
---|
| 22 | var id = "CSS-class" + i; |
---|
| 23 | var css_class = { |
---|
| 24 | id : id, |
---|
| 25 | options : combo.options, |
---|
| 26 | action : function(editor) { self.onSelect(editor, this, combo.context, combo.updatecontextclass); }, |
---|
| 27 | refresh : function(editor) { self.updateValue(editor, this); }, |
---|
| 28 | context : combo.context |
---|
| 29 | }; |
---|
| 30 | cfg.registerDropdown(css_class); |
---|
| 31 | |
---|
| 32 | // prepend to the toolbar |
---|
| 33 | toolbar[1].splice(0, 0, first ? "separator" : "space"); |
---|
| 34 | toolbar[1].splice(0, 0, id); |
---|
| 35 | if (combo.label) |
---|
| 36 | toolbar[1].splice(0, 0, "T[" + combo.label + "]"); |
---|
| 37 | first = false; |
---|
| 38 | } |
---|
| 39 | }; |
---|
| 40 | |
---|
| 41 | CSS._pluginInfo = { |
---|
| 42 | name : "CSS", |
---|
| 43 | version : "1.0", |
---|
| 44 | developer : "Mihai Bazon", |
---|
| 45 | developer_url : "http://dynarch.com/mishoo/", |
---|
| 46 | c_owner : "Mihai Bazon", |
---|
| 47 | sponsor : "Miro International", |
---|
| 48 | sponsor_url : "http://www.miro.com.au", |
---|
| 49 | license : "htmlArea" |
---|
| 50 | }; |
---|
| 51 | |
---|
| 52 | CSS.prototype.onSelect = function(editor, obj, context, updatecontextclass) { |
---|
| 53 | var tbobj = editor._toolbarObjects[obj.id]; |
---|
| 54 | var index = tbobj.element.selectedIndex; |
---|
| 55 | var className = tbobj.element.value; |
---|
| 56 | |
---|
| 57 | // retrieve parent element of the selection |
---|
| 58 | var parent = editor.getParentElement(); |
---|
| 59 | var surround = true; |
---|
| 60 | |
---|
| 61 | var is_span = (parent && parent.tagName.toLowerCase() == "span"); |
---|
| 62 | var update_parent = (context && updatecontextclass && parent && parent.tagName.toLowerCase() == context); |
---|
| 63 | |
---|
| 64 | if (update_parent) { |
---|
| 65 | parent.className = className; |
---|
| 66 | editor.updateToolbar(); |
---|
| 67 | return; |
---|
| 68 | } |
---|
| 69 | |
---|
| 70 | if (is_span && index == 0 && !/\S/.test(parent.style.cssText)) { |
---|
| 71 | while (parent.firstChild) { |
---|
| 72 | parent.parentNode.insertBefore(parent.firstChild, parent); |
---|
| 73 | } |
---|
| 74 | parent.parentNode.removeChild(parent); |
---|
| 75 | editor.updateToolbar(); |
---|
| 76 | return; |
---|
| 77 | } |
---|
| 78 | |
---|
| 79 | if (is_span) { |
---|
| 80 | // maybe we could simply change the class of the parent node? |
---|
| 81 | if (parent.childNodes.length == 1) { |
---|
| 82 | parent.className = className; |
---|
| 83 | surround = false; |
---|
| 84 | // in this case we should handle the toolbar updation |
---|
| 85 | // ourselves. |
---|
| 86 | editor.updateToolbar(); |
---|
| 87 | } |
---|
| 88 | } |
---|
| 89 | |
---|
| 90 | // Other possibilities could be checked but require a lot of code. We |
---|
| 91 | // can't afford to do that now. |
---|
| 92 | if (surround) { |
---|
| 93 | // shit happens ;-) most of the time. this method works, but |
---|
| 94 | // it's dangerous when selection spans multiple block-level |
---|
| 95 | // elements. |
---|
| 96 | editor.surroundHTML("<span class='" + className + "'>", "</span>"); |
---|
| 97 | } |
---|
| 98 | }; |
---|
| 99 | |
---|
| 100 | CSS.prototype.updateValue = function(editor, obj) { |
---|
| 101 | var select = editor._toolbarObjects[obj.id].element; |
---|
| 102 | var parent = editor.getParentElement(); |
---|
| 103 | if (typeof parent.className != "undefined" && /\S/.test(parent.className)) { |
---|
| 104 | var options = select.options; |
---|
| 105 | var value = parent.className; |
---|
| 106 | for (var i = options.length; --i >= 0;) { |
---|
| 107 | var option = options[i]; |
---|
| 108 | if (value == option.value) { |
---|
| 109 | select.selectedIndex = i; |
---|
| 110 | return; |
---|
| 111 | } |
---|
| 112 | } |
---|
| 113 | } |
---|
| 114 | select.selectedIndex = 0; |
---|
| 115 | }; |
---|