sanitizer configuration (#179)

codex.js

@@ -128,6 +128,7 @@ module.exports = (function (editor) {
         // If all ok, make UI, bind events and parse initial-content
             .then(editor.ui.prepare)
             .then(editor.tools.prepare)
+            .then(editor.sanitizer.prepare)
             .then(editor.paste.prepare)
             .then(editor.transport.prepare)
             .then(editor.renderer.makeBlocksFromData)

example.html

@@ -59,6 +59,11 @@
         holderId : "codex-editor",
         initialBlockPlugin : 'paragraph',
         hideToolbar: false,
+        sanitizer : {
+            tags : {
+                p : {}
+            }
+        },
         tools : {
             paragraph: {
                 type: 'paragraph',

modules/callbacks.js

@@ -895,43 +895,6 @@ module.exports = (function (callbacks) {
 
     };
 
-    /**
-     * This method is used to observe pasted dirty data.
-     *
-     * Mutation handlers send to separate observers each mutation (added, changed and so on), which will be
-     * passed from handler that sanitizes and replaces data.
-     *
-     * Probably won't be used
-     *
-     * @deprecated
-     *
-     * @param event
-     * @private
-     */
-    callbacks._blockPasteCallback = function () {
-
-        var currentInputIndex = editor.caret.getCurrentInputIndex();
-
-        /**
-         * create an observer instance
-         */
-        var observer = new MutationObserver(editor.callback.handleMutationsOnPaste);
-
-        /**
-         * configuration of the observer:
-         */
-        var config = {
-            attributes: true,
-            childList: false,
-            characterData: false,
-            subtree : true
-        };
-
-        // pass in the target node, as well as the observer options
-        observer.observe(editor.state.inputs[currentInputIndex], config);
-
-    };
-
     /**
      * This method prevents default behaviour.
      *
@@ -970,7 +933,7 @@ module.exports = (function (callbacks) {
 
         /** Temporary DIV that is used to work with childs as arrays item */
         var div     = editor.draw.node('DIV', '', {}),
-            cleaner = new editor.sanitizer.init(editor.sanitizer.Config.BASIC),
+            cleaner = new editor.sanitizer.init(),
             cleanData,
             fragment;
 
@@ -1031,29 +994,6 @@ module.exports = (function (callbacks) {
 
     };
 
-    /**
-     * @deprecated
-     * Sends all mutations to paste handler
-     */
-    callbacks.handleMutationsOnPaste = function (mutations) {
-
-        var self = this;
-
-        /**
-         * Calling function with context of this function.
-         * Also, we should sanitize pasted or changed data one time and ignore
-         * changings which makes sanitize method.
-         * For that, we need to send Context, MutationObserver.__proto__ that contains
-         * observer disconnect method.
-         */
-        mutations.forEach(function (mutation) {
-
-            editor.content.paste.call(self, mutation);
-
-        });
-
-    };
-
     /**
      * used by UI module
      * Clicks on block settings button

modules/content.js

@@ -567,115 +567,6 @@ module.exports = (function (content) {
 
     };
 
-    /**
-     * @deprecated
-     *
-     * Callback for HTML Mutations
-     * @param {Array} mutation - Mutation Record
-     */
-    content.paste = function (mutation) {
-
-        var workingNode = editor.content.currentNode,
-            tool        = workingNode.dataset.tool;
-
-        if (editor.tools[tool].allowedToPaste) {
-
-            editor.content.sanitize.call(this, mutation.target);
-
-        } else {
-
-            editor.content.pasteTextContent(mutation.addedNodes);
-
-        }
-
-    };
-
-    /**
-     * @deprecated
-     *
-     * gets only text/plain content of node
-     * @param {Element} target - HTML node
-     */
-    content.pasteTextContent = function (nodes) {
-
-        var node = nodes[0],
-            textNode;
-
-        if (!node) {
-
-            return;
-
-        }
-
-        if (node.nodeType == editor.core.nodeTypes.TEXT) {
-
-            textNode = document.createTextNode(node);
-
-        } else {
-
-            textNode = document.createTextNode(node.textContent);
-
-        }
-
-        if (editor.core.isDomNode(node)) {
-
-            node.parentNode.replaceChild(textNode, node);
-
-        }
-
-    };
-
-    /**
-     * @deprecated
-     *
-     * Sanitizes HTML content
-     * @param {Element} target - inserted element
-     * @uses Sanitize library html-janitor
-     */
-    content.sanitize = function (target) {
-
-        if (!target) {
-
-            return;
-
-        }
-
-        var node = target[0];
-
-        if (!node) {
-
-            return;
-
-        }
-
-        /**
-         * Disconnect Observer
-         * hierarchy of function calls inherits context of observer
-         */
-        this.disconnect();
-
-        /**
-         * Don't sanitize text node
-         */
-        if (node.nodeType == editor.core.nodeTypes.TEXT) {
-
-            return;
-
-        }
-
-        /**
-         * Clear dirty content
-         */
-        var cleaner = editor.sanitizer.init(editor.satinizer.Config.BASIC),
-            clean = cleaner.clean(target.outerHTML);
-
-        var div = editor.draw.node('DIV', [], { innerHTML: clean });
-
-        node.replaceWith(div.childNodes[0]);
-
-
-    };
-
     /**
      * Iterates all right siblings and parents, which has right siblings
      * while it does not reached the first-level block

modules/core.js

@@ -37,6 +37,12 @@ module.exports = (function (core) {
 
             }
 
+            if (userSettings.sanitizer) {
+
+                editor.settings.sanitizer = userSettings.sanitizer;
+
+            }
+
             editor.hideToolbar = userSettings.hideToolbar;
 
             editor.nodes.holder = document.getElementById(userSettings.holderId || editor.settings.holderId);

modules/sanitizer.js

@@ -4,13 +4,30 @@
 
 module.exports = (function (sanitizer) {
 
-    var janitor = require('html-janitor');
+    /** HTML Janitor library */
+    let janitor = require('html-janitor');
+
+    /** Codex Editor */
+    let editor  = codex.editor;
+
+    sanitizer.prepare = function () {
+
+        if (editor.settings.sanitizer && !editor.core.isEmpty(editor.settings.sanitizer)) {
+
+            Config.CUSTOM = editor.settings.sanitizer;
+
+        }
+
+    };
 
     /**
      * Basic config
      */
     var Config = {
 
+        /** User configuration */
+        CUSTOM : null,
+
         BASIC : {
 
             tags: {
@@ -31,7 +48,13 @@ module.exports = (function (sanitizer) {
 
     sanitizer.Config = Config;
 
-    sanitizer.init = janitor;
+    sanitizer.init = function () {
+
+        let configuration = Config.CUSTOM || Config.BASIC;
+
+        return new janitor(configuration);
+
+    };
 
     return sanitizer;
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "codex.editor",
-  "version": "1.6.0",
+  "version": "1.6.1",
   "description": "Codex Editor. Native JS, based on API and Open Source",
   "main": "index.js",
   "scripts": {