(function($) { /** * Attach this editor to a target element. */ Drupal.wysiwyg.editor.attach.epiceditor = function (context, params, settings) { var $target = $('#' + params.field), containerId = params.field + '-epiceditor', defaultContent = $target.val(), $container = $('
'); $target.hide().after($container); if (!settings.height) { settings.height = $('#' + params.field).height(); } $container.height(settings.height); settings.container = containerId; settings.file = { defaultContent: defaultContent }; settings.theme = { preview: '/themes/preview/preview-dark.css', editor: '/themes/editor/' + settings.theme + '.css' }; var editor = new EpicEditor(settings).load(); $target.data('epiceditor', editor); }; /** * Detach a single edtor instance. */ Drupal.wysiwyg.editor.detach.epiceditor = function (context, params, trigger) { var $target = $('#' + params.field, context); var editor = $target.data('epiceditor'); if (!editor) { return; } // Save contents of the editor back into the textarea. $target.val(editor.exportFile()); if (trigger !== 'serialize') { // Remove editor instance and container. editor.unload(function () { $target.show(); $('#' + $target.attr('id') + '-epiceditor').remove(); }); $target.removeData('epiceditor'); } }; /** * Check if a DOM node is inside another or if they are the same. */ function isInside (innerNode, outerNode) { var found = false; if (innerNode === outerNode) { return true; } $(innerNode).parents().each(function (index, parent) { if (parent === outerNode) { found = true; return false; } }); return found; } /** * Converts HTML markup to plain text. * * EpicEditor isn't WYSIWYG and is meant to handle plain text though it does so * in a contentEditable element. This is taken from EpicEditor's internal * _setText() function in version 0.2.0. */ function toPlainText (content) { content = content.replace(//g, '>'); content = content.replace(/\n/g, '
'); content = content.replace(/\s\s/g, '  ') return content; } Drupal.wysiwyg.editor.instance.epiceditor = { insert: function (content) { var instance = this.getInstance(); var editingArea = instance.getElement('editor').body; // IE. // @todo Can't test this, EpicEditor breaks in IE. if (document.selection) { var sel = editingArea.selection; range = sel.createRange(); // If the caret is not in the editing area, just append the content. if (!isInside(range.parentElement(), editingArea)) { editingArea.innerHTML += toPlainText(content); } else { // Insert content and set the caret after it. range.pasteHTML(content); range.select(); range.collapse(false); } } else { // The code below doesn't work in IE, but it never gets here. var sel = editingArea.ownerDocument.getSelection(); // Convert selection to a range. // W3C compatible. if (sel.getRangeAt) { if (sel.rangeCount > 0) { range = sel.getRangeAt(0); } } // Safari. else { range = editingArea.ownerDocument.createRange(); range.setStart(sel.anchorNode, sel.anchorOffset); range.setEnd(sel.focusNode, userSeletion.focusOffset); } // If the caret is not in the editing area, just append the content. if (sel.rangeCount == 0 || !isInside(range.commonAncestorContainer, editingArea)) { editingArea.innerHTML += toPlainText(content); return; } var fragment = editingArea.ownerDocument.createDocumentFragment(); // Fragments don't support innerHTML. var wrapper = editingArea.ownerDocument.createElement('div'); wrapper.innerHTML = toPlainText(content); while (wrapper.firstChild) { fragment.appendChild(wrapper.firstChild); } // Append a temporary node to control caret position. var tn = editingArea.ownerDocument.createElement('span'); fragment.appendChild(tn); range.deleteContents(); // Only fragment children are inserted. range.insertNode(fragment); // Move caret to temp node and remove it. range.setStartBefore(tn); range.setEndBefore(tn); sel.removeAllRanges(); sel.addRange(range); tn.parentNode.removeChild(tn); } }, setContent: function (content) { this.getInstance().importFile(null, content); }, getContent: function () { return this.getInstance().exportFile(); }, isFullscreen: function () { return this.getInstance().is('fullscreen'); }, getInstance: function () { if (!this.editorInstance) { this.editorInstance = $('#' + this.field).data('epiceditor'); } return this.editorInstance; } } })(jQuery);