MediaWiki:Highlight.js

// Script for highlighting of non-breaking spaces
// Author: [[:ru:User:Vort]]

mw.loader.using('mediawiki.util').done(function () {
    var highlight = {
        enabled : false
    };

    highlight.removeHighlight = function (container, className) {
        $(container).find('span.' + className).toggleClass(className + ' ' + className + '-disabled');
    };

    highlight.addHighlight = function (container, highlightText, className) {
        var disabledSpans = $(container).find('span.' + className + '-disabled');
        if (disabledSpans.length > 0) {
            disabledSpans.toggleClass(className + ' ' + className + '-disabled');
            return;
        }

        // Based on:
        // http://stackoverflow.com/questions/8644428/how-to-highlight-text-using-javascript/29798094#29798094

        var checkAndReplace = function(node) {
            var nodeVal = node.nodeValue,
                parentNode = node.parentNode,
                foundIndex, begin, matched,
                textNode, span, isFirst;

            isFirst = true;
            while (true) {
                foundIndex = nodeVal.indexOf(highlightText);
                if (foundIndex < 0) {
                    if (isFirst)
                        break;

                    if (nodeVal) {
                        textNode = document.createTextNode(nodeVal);
                        parentNode.insertBefore(textNode, node);
                    }

                    parentNode.removeChild(node);
                    break;
                }

                isFirst = false;

                begin = nodeVal.substring(0, foundIndex);
                matched = nodeVal.substr(foundIndex, highlightText.length);

                if (begin) {
                    textNode = document.createTextNode(begin);
                    parentNode.insertBefore(textNode, node);
                }

                span = document.createElement('span');
                span.className += className;
                span.appendChild(document.createTextNode(matched));
                parentNode.insertBefore(span, node);

                nodeVal = nodeVal.substring(foundIndex + highlightText.length);
            }
        };

        var iterator = function(p) {
            if (p === null)
                return;

            var children = Array.prototype.slice.call(p.childNodes), i, cur;

            if (children.length) {
                for (i = 0; i < children.length; i++) {
                    cur = children[i];
                    if (cur.nodeType === 3)
                        checkAndReplace(cur);
                    else if (cur.nodeType === 1 && cur.tagName.toLowerCase() !== 'textarea')
                        iterator(cur);
                }
            }
        };

        iterator(container);
    };

    highlight.updateLink = function() {
        if (this.enabled) {
            this.link.innerHTML = '🗝';
            this.link.title = 'Highlighting OFF - Выключить подсветку';
        }
        else {
            this.link.innerHTML = '❊'; //🔑
            this.link.title = 'Highlighting ON - Включить подсветку';
        }
    };

    highlight.toggle = function() {
        var nbsp = '\xa0';
        var shy = '\xad';
        nbspp = nbsp, shy;
        var className = 'highlight-nbsp';
        var container = document.getElementById('content');
        if (this.enabled)
            this.removeHighlight(container, className);
            
        else
//            this.addHighlight(container, nbsp , className);
            this.addHighlight(container, shy , className);

        this.enabled = !this.enabled;
        this.updateLink();
    };

    highlight.init = function() {
        mw.util.addCSS('.highlight-nbsp {background-color:#f6b94d; padding-left: 10px;}');

        this.link = document.createElement('a');
        this.link.href = 'javascript:void(0);';
        this.updateLink();
        this.link.onclick = function() {
            highlight.toggle();
            return false;
        };

        var listEntry = document.createElement('li');
        listEntry.id = 't-highlight';
        listEntry.appendChild(this.link);

        var nextListEntry = document.getElementById('t-whatlinkshere');
        if (nextListEntry)
            nextListEntry.parentElement.insertBefore(listEntry, nextListEntry);
    };

    highlight.init();
});