Plugin for Summernote WYSIWYG editor that cleans up the pasted in content

summernote-pastclean.js

/**
 * Summernote PasteClean
 *
 * This is a plugin for Summernote (www.summernote.org) WYSIWYG editor.
 * It will clean up the content your editors may paste in for unknown sources
 * into your CMS. It strips Word special characters, style attributes, script
 * tags, and other annoyances so that the content can be clean HTML with
 * no unknown hitchhiking scripts or styles.
 *
 * @author Jason Byrne, FloSports <jason.byrne@flosports.tv>
 *
 */

(function (factory) {
  /* global define */
  if (typeof define === 'function' && define.amd) {
    // AMD. Register as an anonymous module.
    define(['jquery'], factory);
  } else {
    // Browser globals: jQuery
    factory(window.jQuery);
  }
}(function ($) {

    var badTags = [
            'font',
            'style',
            'embed',
            'param',
            'script',
            'html',
            'body',
            'head',
            'meta',
            'title',
            'link',
            'iframe',
            'applet',
            'noframes',
            'noscript',
            'form',
            'input',
            'select',
            'option',
            'std',
            'xml:',
            'st1:',
            'o:',
            'w:',
            'v:'
        ],
        badAttributes = [
            'style',
            'start',
            'charset'
        ];

    $.summernote.addPlugin({
        name: 'pasteClean',
        init: function(layoutInfo) {

            var $note = layoutInfo.holder();

            $note.on('summernote.paste', function(e, evt) {
                evt.preventDefault();
                // Capture pasted data
                var text = evt.originalEvent.clipboardData.getData('text/plain'),
                    html = evt.originalEvent.clipboardData.getData('text/html');
                // Clean up html input
                if (html) {
                    // Regular expressions
                    var tagStripper         = new RegExp('<[ /]*(' + badTags.join('|') + ')[^>]*>', 'gi'),
                        attributeStripper   = new RegExp(' (' + badAttributes.join('|') + ')(="[^"]*"|=\'[^\']*\'|=[^ ]+)?', 'gi'),
                        commentStripper     = new RegExp('<!--(.*)-->', 'g');

                    // clean it up
                    html = html.toString()
                        // Remove comments
                        .replace(commentStripper, '')
                        // Remove unwanted tags
                        .replace(tagStripper, '')
                        // remove unwanted attributes
                        .replace(attributeStripper, ' ')
                        // remove Word classes
                        .replace(/( class=(")?Mso[a-zA-Z]+(")?)/g, ' ')
                        // remove whitespace (space and tabs) before tags
                        .replace(/[\t ]+\</g, "<")
                        // remove whitespace between tags
                        .replace(/\>[\t ]+\</g, "><")
                        // remove whitespace after tags
                        .replace(/\>[\t ]+$/g, ">")
                        // smart single quotes and apostrophe
                        .replace(/[\u2018\u2019\u201A]/g, "'")
                        // smart double quotes
                        .replace(/[\u201C\u201D\u201E]/g, '"')
                        // ellipsis
                        .replace(/\u2026/g, '...')
                        // dashes
                        .replace(/[\u2013\u2014]/g, '-');
                }
                // Do the paste
                var $dom = $('<div class="pasted"/>').html(html || text);
                $note.summernote('insertNode', $dom[0]);
                return false;
            });

        }
    });
}));

how to use?

All you have to do is include the script and then just include the plugin like you would any other toolbar item. It won't do a button or anything, it just invisibly works.

give me example

give me example²

Hi Jason, as of Summernote 0.8.0 this code doesn't work.

doesn't work... fix please....
Uncaught TypeError: $.summernote.addPlugin is not a function

I see this on the Summernote site. So the gist above was built on the old plugin system and would need to be updated to the new module system.

Plugin was redesigned by new module system after v0.7.0

Old plugin was hard to control editor states(eg, range, layout so on). After v0.7.0 plugin is redesigned by new module system. It is exactly same with module except surrounding module pattern.

Any examples working?

It does not work for me!

Thanks

Grate Script!
Above script really doesn't work. I modified plugin and working for me. Thank you

https://gist.github.com/hiteshaggarwal/388cd3fae7331aa0415c63e0a883e8f5