tinymce-2.js 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203
  1. (function($) {
  2. /**
  3. * Initialize editor instances.
  4. *
  5. * This function needs to be called before the page is fully loaded, as
  6. * calling tinyMCE.init() after the page is loaded breaks IE6.
  7. *
  8. * @param editorSettings
  9. * An object containing editor settings for each input format.
  10. */
  11. Drupal.wysiwyg.editor.init.tinymce = function(settings) {
  12. // Initialize editor configurations.
  13. for (var format in settings) {
  14. tinyMCE.init(settings[format]);
  15. if (Drupal.settings.wysiwyg.plugins[format]) {
  16. // Load native external plugins.
  17. // Array syntax required; 'native' is a predefined token in JavaScript.
  18. for (var plugin in Drupal.settings.wysiwyg.plugins[format]['native']) {
  19. tinyMCE.loadPlugin(plugin, Drupal.settings.wysiwyg.plugins[format]['native'][plugin]);
  20. }
  21. // Load Drupal plugins.
  22. for (var plugin in Drupal.settings.wysiwyg.plugins[format].drupal) {
  23. Drupal.wysiwyg.editor.instance.tinymce.addPlugin(plugin, Drupal.settings.wysiwyg.plugins[format].drupal[plugin], Drupal.settings.wysiwyg.plugins.drupal[plugin]);
  24. }
  25. }
  26. }
  27. };
  28. /**
  29. * Attach this editor to a target element.
  30. *
  31. * See Drupal.wysiwyg.editor.attach.none() for a full desciption of this hook.
  32. */
  33. Drupal.wysiwyg.editor.attach.tinymce = function(context, params, settings) {
  34. // Configure editor settings for this input format.
  35. for (var setting in settings) {
  36. tinyMCE.settings[setting] = settings[setting];
  37. }
  38. // Remove TinyMCE's internal mceItem class, which was incorrectly added to
  39. // submitted content by Wysiwyg <2.1. TinyMCE only temporarily adds the class
  40. // for placeholder elements. If preemptively set, the class prevents (native)
  41. // editor plugins from gaining an active state, so we have to manually remove
  42. // it prior to attaching the editor. This is done on the client-side instead
  43. // of the server-side, as Wysiwyg has no way to figure out where content is
  44. // stored, and the class only affects editing.
  45. $field = $('#' + params.field);
  46. $field.val($field.val().replace(/(<.+?\s+class=['"][\w\s]*?)\bmceItem\b([\w\s]*?['"].*?>)/ig, '$1$2'));
  47. // Attach editor.
  48. tinyMCE.execCommand('mceAddControl', true, params.field);
  49. };
  50. /**
  51. * Detach a single or all editors.
  52. *
  53. * See Drupal.wysiwyg.editor.detach.none() for a full desciption of this hook.
  54. */
  55. Drupal.wysiwyg.editor.detach.tinymce = function (context, params, trigger) {
  56. if (typeof params != 'undefined') {
  57. tinyMCE.removeMCEControl(tinyMCE.getEditorId(params.field));
  58. $('#' + params.field).removeAttr('style');
  59. }
  60. // else if (tinyMCE.activeEditor) {
  61. // tinyMCE.triggerSave();
  62. // tinyMCE.activeEditor.remove();
  63. // }
  64. };
  65. Drupal.wysiwyg.editor.instance.tinymce = {
  66. addPlugin: function(plugin, settings, pluginSettings) {
  67. if (typeof Drupal.wysiwyg.plugins[plugin] != 'object') {
  68. return;
  69. }
  70. tinyMCE.addPlugin(plugin, {
  71. // Register an editor command for this plugin, invoked by the plugin's button.
  72. execCommand: function(editor_id, element, command, user_interface, value) {
  73. switch (command) {
  74. case plugin:
  75. if (typeof Drupal.wysiwyg.plugins[plugin].invoke == 'function') {
  76. var ed = tinyMCE.getInstanceById(editor_id);
  77. var data = { format: 'html', node: ed.getFocusElement(), content: ed.getFocusElement() };
  78. Drupal.wysiwyg.plugins[plugin].invoke(data, pluginSettings, ed.formTargetElementId);
  79. return true;
  80. }
  81. }
  82. // Pass to next handler in chain.
  83. return false;
  84. },
  85. // Register the plugin button.
  86. getControlHTML: function(control_name) {
  87. switch (control_name) {
  88. case plugin:
  89. return tinyMCE.getButtonHTML(control_name, settings.iconTitle, settings.icon, plugin);
  90. }
  91. return '';
  92. },
  93. // Load custom CSS for editor contents on startup.
  94. initInstance: function(ed) {
  95. if (settings.css) {
  96. tinyMCE.importCSS(ed.getDoc(), settings.css);
  97. }
  98. },
  99. cleanup: function(type, content) {
  100. switch (type) {
  101. case 'insert_to_editor':
  102. // Attach: Replace plain text with HTML representations.
  103. if (typeof Drupal.wysiwyg.plugins[plugin].attach == 'function') {
  104. content = Drupal.wysiwyg.plugins[plugin].attach(content, pluginSettings, tinyMCE.selectedInstance.editorId);
  105. content = Drupal.wysiwyg.editor.instance.tinymce.prepareContent(content);
  106. }
  107. break;
  108. case 'get_from_editor':
  109. // Detach: Replace HTML representations with plain text.
  110. if (typeof Drupal.wysiwyg.plugins[plugin].detach == 'function') {
  111. content = Drupal.wysiwyg.plugins[plugin].detach(content, pluginSettings, tinyMCE.selectedInstance.editorId);
  112. }
  113. break;
  114. }
  115. // Pass through to next handler in chain
  116. return content;
  117. },
  118. // isNode: Return whether the plugin button should be enabled for the
  119. // current selection.
  120. handleNodeChange: function(editor_id, node, undo_index, undo_levels, visual_aid, any_selection) {
  121. if (node === null) {
  122. return;
  123. }
  124. if (typeof Drupal.wysiwyg.plugins[plugin].isNode == 'function') {
  125. if (Drupal.wysiwyg.plugins[plugin].isNode(node)) {
  126. tinyMCE.switchClass(editor_id + '_' + plugin, 'mceButtonSelected');
  127. return true;
  128. }
  129. }
  130. tinyMCE.switchClass(editor_id + '_' + plugin, 'mceButtonNormal');
  131. return true;
  132. },
  133. /**
  134. * Return information about the plugin as a name/value array.
  135. */
  136. getInfo: function() {
  137. return {
  138. longname: settings.title
  139. };
  140. }
  141. });
  142. },
  143. openDialog: function(dialog, params) {
  144. var editor = tinyMCE.getInstanceById(this.field);
  145. tinyMCE.openWindow({
  146. file: dialog.url + '/' + this.field,
  147. width: dialog.width,
  148. height: dialog.height,
  149. inline: 1
  150. }, params);
  151. },
  152. closeDialog: function(dialog) {
  153. var editor = tinyMCE.getInstanceById(this.field);
  154. tinyMCEPopup.close();
  155. },
  156. prepareContent: function(content) {
  157. // Certain content elements need to have additional DOM properties applied
  158. // to prevent this editor from highlighting an internal button in addition
  159. // to the button of a Drupal plugin.
  160. var specialProperties = {
  161. img: { 'name': 'mce_drupal' }
  162. };
  163. var $content = $('<div>' + content + '</div>'); // No .outerHTML() in jQuery :(
  164. jQuery.each(specialProperties, function(element, properties) {
  165. $content.find(element).each(function() {
  166. for (var property in properties) {
  167. if (property == 'class') {
  168. $(this).addClass(properties[property]);
  169. }
  170. else {
  171. $(this).attr(property, properties[property]);
  172. }
  173. }
  174. });
  175. });
  176. return $content.html();
  177. },
  178. insert: function(content) {
  179. content = this.prepareContent(content);
  180. var editor = tinyMCE.getInstanceById(this.field);
  181. editor.execCommand('mceInsertContent', false, content);
  182. editor.repaint();
  183. }
  184. };
  185. })(jQuery);