ここの情報は古いです。ご理解頂いた上でお取り扱いください。

source: OpenPNE/branches/stable-2.12.x/public_html/js/tiny_mce/plugins/openpne/editor_plugin.js.src @ 7139

Last change on this file since 7139 was 7139, checked in by ebihara, 14 years ago

#2383:jsmin.cによって頻繁に読み込まれるJavaScriptを圧縮

File size: 15.9 KB
Line 
1/**
2 * TinyMCE Plugin for OpenPNE
3 *
4 * @author Kousuke Ebihara
5 */
6
7(function() {
8
9    tinymce.create('tinymce.ui.OpenPNEColorButton:tinymce.ui.ColorSplitButton', {
10        renderHTML : function() {
11            var s = this.settings, h = '<a id="' + this.id + '" href="javascript:;" class="mceButton mceButtonEnabled ' + s['class']
12                + '" onmousedown="return false;" onclick="return false;" title="' + tinymce.DOM.encode(s.title) + '">';
13
14            if (s.image) {
15                h += '<img class="mceIcon" src="' + s.image + '" /></a>';
16            } else {
17                h += '<span class="mceIcon ' + s['class'] + '"></span></a>';
18            }
19
20            return h;
21        },
22
23        postRender : function() {
24            tinymce.dom.Event.add(this.id, 'click', this.showMenu, this);
25        },
26
27        setColor : function(c) {
28            this.value = c;
29            this.hideMenu();
30            this.settings.onselect(c);
31        }
32    });
33
34    tinymce.create('tinymce.ui.OpenPNEEmojiButton:tinymce.ui.ColorSplitButton', {
35        OpenPNEEmojiButton : function(id, s) {
36            var t = this;
37
38            t.parent(id, s);
39
40            t.settings = s;
41        },
42
43        renderMenu : function() {
44            var t = this, m, i = 0, s = t.settings, n, tb, tr, w;
45            var DOM = tinymce.DOM, Event = tinymce.dom.Event, is = tinymce.is, each = tinymce.each;
46            w = DOM.add(s.menu_container, 'div', {id : t.id + '_menu', dir : 'ltr', 'class' : s['menu_class'] + ' ' + s['class'],
47                style : 'position:absolute;left:0;top:-1000px;'});
48            m = DOM.add(w, 'div', {'class' : s['class'] + ' mceSplitButtonMenu'});
49            DOM.add(m, 'span', {'class' : 'mceMenuLine'});
50
51            n = DOM.add(m, 'table', {'class' : 'mceEmojiSplitMenu'});
52            tb = DOM.add(n, 'tbody');
53
54            for (var num in s.emoji) {
55                var emoji = s.emoji[num];
56                for (var i = emoji.start; i <= emoji.end; i++) {
57                    if (i == emoji.start || i % 25 == 0) {
58                        tr = DOM.add(tb, 'tr');
59                    }
60                    n = DOM.add(tr, 'td');
61
62                    n = DOM.add(n, 'img', {
63                        src : "./skin/default/img/emoji/" + s.carrier +"/" + s.carrier + i + ".gif",
64                        alt : "[" + s.carrier + ":" + i + "]",
65                    });
66
67                    Event.add(n, 'mousedown', function(e) {
68                        tinyMCE.execCommand("mceInsertContent", false, e.element().getAttribute("alt"));
69                    });
70                }
71            }
72
73            DOM.addClass(m, 'mceColorSplitMenu');
74
75            return w;
76        },
77
78        renderHTML : function() {
79            var s = this.settings, h = '<a id="' + this.id + '" href="javascript:;" class="mceButton mceButtonEnabled ' + s['class']
80                + '" onmousedown="return false;" onclick="return false;" title="' + tinymce.DOM.encode(s.title) + '">';
81
82            if (s.image) {
83                h += '<img class="mceIcon" src="' + s.image + '" /></a>';
84            } else {
85                h += '<span class="mceIcon ' + s['class'] + '"></span></a>';
86            }
87
88            return h;
89        },
90
91        postRender : function() {
92            tinymce.dom.Event.add(this.id, 'click', this.showMenu, this);
93        }
94    });
95
96    tinymce.PluginManager.requireLangPack('openpne');
97
98    var config = pne_mce_editor_get_config();
99
100    tinymce.create('tinymce.plugins.OpenPNEPlugin', {
101        init : function(ed, url) {
102            var t = this;
103
104            // change the editor setting
105            ed.settings.content_css = url + "/css/editor.css";
106
107            // command
108            ed.addCommand('mceOpenPNE_op_b', function() {
109                tinyMCE.execCommand("Bold");
110            });
111            ed.addCommand('mceOpenPNE_op_u', function() {
112                tinyMCE.execCommand("Underline");
113            });
114            ed.addCommand('mceOpenPNE_op_s', function() {
115                tinyMCE.execCommand("Strikethrough");
116            });
117            ed.addCommand('mceOpenPNE_op_i', function() {
118                tinyMCE.execCommand("Italic");
119            });
120            ed.addCommand('mceOpenPNE_op_large', function() {
121                tinyMCE.execCommand("Fontsize", false, 5);
122            });
123            ed.addCommand('mceOpenPNE_op_small', function() {
124                tinyMCE.execCommand("Fontsize", false, 1);
125            });
126            ed.addCommand('mceOpenPNE_op_image', function() {
127                window.open(config.op_image.contentURL, '', 'width=600,height=550,toolbar=no,scrollbars=yes,left=10,top=10');
128            });
129
130            // button
131            for (var key in config) {
132                var value = config[key];
133                if (value.isEnabled && key != "op_color") {
134                    ed.addButton(key, {title : '{#openpne.' + key + '}', image: value.imageURL, cmd : 'mceOpenPNE_' + key});
135                }
136            }
137
138            // event
139            ed.onBeforeSetContent.add(function(ed, o) {  // To preview mode
140                o.content = t._textToPreview(o.content);
141            });
142            ed.onPostProcess.add(function(ed, o) {  // To text mode
143                if (o.save) {
144                    if (ed.isHidden()) {
145                        o.content = ed.getElement().value;
146                    } else {
147                        o.content = t._previewToText(o.content, ed);
148                    }
149                }
150            });
151            ed.onNodeChange.add(function(ed, cm, n) {
152                cm.setActive('mce_editor_textarea_op_b', n.nodeName.toLowerCase() == 'b');
153                cm.setActive('mce_editor_textarea_op_u', n.nodeName.toLowerCase() == 'u');
154                cm.setActive('mce_editor_textarea_op_s', n.nodeName.toLowerCase() == 's');
155                cm.setActive('mce_editor_textarea_op_i', n.nodeName.toLowerCase() == 'i');
156            });
157        },
158
159        createControl: function(n, cm) {
160            var c = null;
161            if (n == "op_color" && config["op_color"].isEnabled) {
162                c = this._createOpenPNEColorButton("op_color", { title : "{#openpne.op_color}", image: config["op_color"].imageURL, cmd : "ForeColor"}, cm);
163            }
164
165            if (n == "op_emoji_docomo" || n == "op_emoji_au" && config["op_emoji_au"].isEnabled || n == "op_emoji_softbank" && config["op_emoji_softbank"].isEnabled) {
166                var emoji_config = {
167                    op_emoji_docomo : {
168                        carrier : "i",
169                        emoji : [ {start : 1, end : 252} ],
170                        title : "{#openpne." + n + "}",
171                        image: config[n].imageURL
172                    },
173                    op_emoji_au : {
174                        carrier : "e",
175                        emoji : [ {start : 1, end : 518}, {start : 700, end : 822} ],
176                        title : "{#openpne." + n + "}",
177                        image: config[n].imageURL
178                    },
179                    op_emoji_softbank : {
180                        carrier : "s",
181                        emoji : [ {start : 1, end : 485} ],
182                        title : "{#openpne." + n + "}",
183                        image: config[n].imageURL
184                    }
185                }
186                c = this._createOpenPNEEmojiButton(n, emoji_config[n], cm);
187            }
188
189            return c;
190        },
191
192        getInfo : function() {
193            return {
194                longname : 'OpenPNE plugin',
195                author : 'Kousuke Ebihara',
196                version : "1.0"
197            }
198        },
199
200        _createOpenPNEColorButton : function(id, s, cm) {
201            var t = cm, ed = t.editor, cmd, c;
202
203            if (t.get(id)) {
204                return null;
205            }
206
207            s.title = ed.translate(s.title);
208            s.scope = s.scope || ed;
209
210            if (!s.onclick) {
211                s.onclick = function(v) { ed.execCommand(s.cmd, s.ui || false, v || s.value); };
212            }
213
214            if (!s.onselect) {
215                s.onselect = function(v) { ed.execCommand(s.cmd, s.ui || false, v || s.value); };
216            }
217
218            id = t.prefix + id;
219
220            s = tinymce.extend({ title : s.title, 'class' : 'mce_' + id, 'menu_class' : ed.getParam('skin') + 'Skin', scope : s.scope, more_colors_title : ed.getLang('more_colors') }, s);
221
222            c = new tinymce.ui.OpenPNEColorButton(id, s);
223            ed.onMouseDown.add(c.hideMenu, c);
224
225            ed.onRemove.add(function() {
226                c.destroy();
227            });
228
229            return t.add(c);
230        },
231
232        _createOpenPNEEmojiButton : function(id, s, cm) {
233            var t = cm, ed = t.editor, cmd, c;
234
235            if (t.get(id)) {
236                return null;
237            }
238
239            s.title = ed.translate(s.title);
240            s.scope = s.scope || ed;
241
242            if (!s.onclick) {
243                s.onclick = function(v) { ed.execCommand(s.cmd, s.ui || false, v || s.value); };
244            }
245
246            if (!s.onselect) {
247                s.onselect = function(v) { ed.execCommand(s.cmd, s.ui || false, v || s.value); };
248            }
249
250            id = t.prefix + id;
251
252            s = tinymce.extend({ title : s.title, 'class' : 'mce_' + id, 'menu_class' : ed.getParam('skin') + 'Skin', scope : s.scope}, s);
253
254            c = new tinymce.ui.OpenPNEEmojiButton(id, s);
255            ed.onMouseDown.add(c.hideMenu, c);
256
257            ed.onRemove.add(function() {
258                c.destroy();
259            });
260
261            return t.add(c);
262        },
263        _previewToText : function(s, editor) {
264            var editorDoc = editor.getBody();
265
266            function rep(re, str) {
267                s = s.replace(re, str);
268            };
269
270            if (!tinymce.isWebKit) {  // not safari
271                s = tinymce.trim(s);
272                rep('/<(\/?)strong>/gi', '<\1b>');
273                rep('/<(\/?)strike>/gi', '<\1s>');
274                rep('/<(\/?)em>/gi', '<\1i>');
275                editor.dom.setHTML(editor.getBody(), s);
276            }
277
278            function convertHtmlTagToDecoTag(doc, tagname)
279            {
280                var tagList = doc.getElementsByTagName(tagname);
281                var org_tagname = tagname;
282                var args = {};
283
284                while (tagList.length) {
285                    targetObj = tagList[0];
286
287                    if (org_tagname == "font") {
288                        var size = targetObj.getAttribute("size");
289                        var color = targetObj.getAttribute("color");
290
291                        if (size && color) {
292                            if (tinymce.isIE) {
293                                targetObj.removeAttribute("color");
294                                targetObj.innerHTML = '<font color="' + color + '">' + targetObj.innerHTML + "</font>";
295                            } else {
296                                var fontSize = document.createElement("font");
297                                fontSize.setAttribute("size", size);
298                                fontSize.removeAttribute("color");
299
300                                var clone = targetObj.cloneNode(true);
301                                clone.removeAttribute("size");
302
303                                fontSize.appendChild(clone);
304                                targetObj.parentNode.replaceChild(fontSize, targetObj);
305                            }
306
307                            // initialize
308                            tagList = doc.getElementsByTagName(org_tagname);
309                            args = {};
310
311                            continue;
312                        }
313
314                        if (size == '5') {
315                            tagname = 'op:large';
316                        } else if (size == '1') {
317                            tagname = 'op:small';
318                        }
319
320                        if (color) {
321                            tagname = 'op:color';
322                            args = {
323                                code: color
324                            };
325                        }
326                    } else if (org_tagname == 'span') {  // for safari
327                        if (targetObj.style.fontWeight == 'bold') {
328                            tagname = 'op:b';
329                        } else if (targetObj.style.textDecoration == 'underline') {
330                            tagname = 'op:u';
331                        } else if (targetObj.style.textDecoration == 'line-through') {
332                            tagname = 'op:s';
333                        } else if (targetObj.style.fontStyle == 'italic') {
334                            tagname = 'op:i';
335                        } else if (targetObj.style.color) {
336                            var color = tinyMCE.activeEditor.dom.toHex(targetObj.style.color);
337                            tagname = 'op:color';
338                            args = {
339                                code: color
340                            };
341                        } else if (targetObj.style.fontSize == 'x-large') {
342                            tagname = 'op:large';
343                        } else if (targetObj.style.fontSize == 'x-small') {
344                            tagname = 'op:small';
345                        } else {
346                            editor.dom.remove(targetObj, true);
347                            continue;
348                        }
349                    } else {
350                        tagname = 'op:' + org_tagname;
351                    }
352
353                    if (tinymce.isIE) {
354                        tagname = tagname.replace("op:", "op");
355                    }
356
357                    var newObj = editor.dom.create(tagname);
358                    editor.dom.setAttribs(newObj, args);
359
360                    if (tinymce.isIE) {
361                        newObj.innerHTML = targetObj.innerHTML;
362                        targetObj.parentNode.replaceChild(newObj, targetObj);
363                    } else {
364                        editor.dom.replace(newObj, targetObj, true);
365                    }
366                    tagList = doc.getElementsByTagName(org_tagname);
367                }
368                s = editorDoc.innerHTML;
369            }
370
371            var convertList = new Array('span', 'b', 'u', 's', 'i', 'font');
372            for (var i = 0; i < convertList.length; i++) {
373                convertHtmlTagToDecoTag(editor.getBody(), convertList[i]);
374            }
375
376            rep(/<\/?div>/gi,"");  // for Safari
377
378            if (tinymce.isIE) {
379                rep(/<op/gi, "<op:");
380                rep(/<\/op/gi, "</op:");
381            }
382
383            rep(/<br\s?\/?[^>]*>/gi,"\n\n");
384            rep(/&nbsp;/gi," ");
385            rep(/&quot;/gi,"\"");
386            rep(/&lt;/gi,"<");
387            rep(/&gt;/gi,">");
388            rep(/&amp;/gi,"&");
389
390            return s;
391        },
392
393        _textToPreview : function(s) {
394            s = tinymce.trim(s);
395            var rule = /&lt;op:(b|u|s|i|large|small|color)( code="(#[0-9a-f]{3,6})"|)&gt;(.*?)&lt;\/op:\1&gt;/i;
396
397            function rep(re, str) {
398                s = s.replace(re, str);
399            };
400
401            function convertDecoTagToHtmlTag(matches)
402            {
403                var tagname = matches[1];
404                var color = matches[3];
405                var value = matches[4].gsub(rule, convertDecoTagToHtmlTag);
406                var opt = '';
407
408                if (tagname == 'color' && color) {
409                    tagname = 'font';
410                    opt = ' color="' + color + '"';
411                }
412
413                if (tagname == 'large') {
414                    tagname = 'font';
415                    opt = ' size="5"';
416                }
417           
418                if (tagname == 'small') {
419                    tagname = 'font';
420                    opt = ' size="1"';
421                }
422
423                var converted = "<" + tagname + opt + ">" + value + "</" + tagname + ">";
424                return converted;
425            };
426
427            rep(/</gi,"&lt;");
428            rep(/>/gi,"&gt;");
429            rep(/\n/gi,"<br />");
430            s = s.gsub(rule, convertDecoTagToHtmlTag);
431
432            return s;
433        }
434    });
435
436    // Register plugin
437    tinymce.PluginManager.add('openpne', tinymce.plugins.OpenPNEPlugin);
438})();
Note: See TracBrowser for help on using the repository browser.