MDL-24507 tinymce moodleemoticon plugin replaces all occurrences of emoticon text...
[moodle.git] / lib / editor / tinymce / tiny_mce / 3.3.9.2 / plugins / moodleemoticon / editor_plugin_src.js
CommitLineData
ca725066
DM
1/**
2 * TinyMCE plugin MoodleEmoticon - provides GUI to insert emoticon images
3 *
4 * Based on the example plugin (c) 2009 Moxiecode Systems AB
5 *
6 * @author David Mudrak <david@moodle.com>
7 * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
8 */
9
10(function() {
11 tinymce.create('tinymce.plugins.MoodleEmoticon', {
12
13 /**
14 * Holds the list of emoticons provided by emoticon_manager
15 *
16 * @private
17 */
18 _emoticons : {},
19
20 /**
21 * Initializes the plugin, this will be executed after the plugin has been created.
22 * This call is done before the editor instance has finished it's initialization so use the onInit event
23 * of the editor instance to intercept that event.
24 *
25 * @param {tinymce.Editor} ed Editor instance that the plugin is initialized in.
26 * @param {string} url Absolute URL to where the plugin is located.
27 */
28 init : function(ed, url) {
29 // Register the command so that it can be invoked by using tinyMCE.activeEditor.execCommand('mceMoodleEmoticon');
30 ed.addCommand('mceMoodleEmoticon', function() {
31 lang = ed.getParam('language');
32 ed.windowManager.open({
33 file : url + '/dialog.php?lang=' + lang ,
34 width : 250 + parseInt(ed.getLang('moodleemoticon.delta_width', 0)),
35 height : 400 + parseInt(ed.getLang('moodleemoticon.delta_height', 0)),
36 inline : 1
37 }, {
38 plugin_url : url, // Plugin absolute URL
39 });
40 });
41
42 // Add an observer to the onInit event to convert emoticon texts to images
43 ed.onInit.add(function(ed) {
44 var data = ed.getContent();
45 this._emoticons = tinymce.util.JSON.parse(ed.getParam('moodleemoticon_emoticons'));
46 for (var emotxt in this._emoticons) {
5d394ec1
DM
47 // escape the metacharacters so we can use it as regexp
48 search = emotxt.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
49 // convert to regexp
50 search = new RegExp(search, 'g');
51 // and replace all occurrences of it with the image
52 data = data.replace(search, this._emoticons[emotxt]);
ca725066
DM
53 }
54 ed.setContent(data);
55 });
56
57 // Add an observer to the onPreProcess event to convert emoticon images to texts
58 ed.onPreProcess.add(function(ed, o) {
59 if (o.save) {
60 tinymce.each(ed.dom.select('img.emoticon', o.node), function(image) {
61 var emoticontxt = '';
62 var matches = /^emoticon emoticon-index-([0-9]+)$/.exec(image.className);
63 if (matches.length != 2) {
64 // this is not valid emoticon image inserted via dialog
65 // return true so that each() does not halt
66 return true;
67 }
68 var index = matches[1];
69 var search = new RegExp('class="emoticon emoticon-index-'.concat(index, '"'));
70 for (var emotxt in this._emoticons) {
71 if (search.test(this._emoticons[emotxt])) {
72 emoticontxt = emotxt;
73 break;
74 }
75 }
76 if (emoticontxt) {
77 ed.dom.setOuterHTML(image, emoticontxt);
78 }
79 }, this);
80 }
81 });
82
83 // Register moodleemoticon button
84 ed.addButton('moodleemoticon', {
85 title : 'moodleemoticon.desc',
86 cmd : 'mceMoodleEmoticon',
87 image : url + '/img/moodleemoticon.gif'
88 });
89 },
90
91 /**
92 * Creates control instances based in the incomming name. This method is normally not
93 * needed since the addButton method of the tinymce.Editor class is a more easy way of adding buttons
94 * but you sometimes need to create more complex controls like listboxes, split buttons etc then this
95 * method can be used to create those.
96 *
97 * @param {String} n Name of the control to create.
98 * @param {tinymce.ControlManager} cm Control manager to use inorder to create new control.
99 * @return {tinymce.ui.Control} New control instance or null if no control was created.
100 */
101 createControl : function(n, cm) {
102 return null;
103 },
104
105 /**
106 * Returns information about the plugin as a name/value array.
107 * The current keys are longname, author, authorurl, infourl and version.
108 *
109 * @return {Object} Name/value array containing information about the plugin.
110 */
111 getInfo : function() {
112 return {
113 longname : 'Moodle Emoticon plugin',
114 author : 'David Mudrak',
115 authorurl : 'http://mudrak.name',
116 infourl : 'http://moodle.org',
117 version : "1.0"
118 };
119 }
120 });
121
122 // Register plugin
123 tinymce.PluginManager.add('moodleemoticon', tinymce.plugins.MoodleEmoticon);
124})();