User:DatRoot/Scripts/Common.js

Code that you insert on this page could contain malicious content capable of compromising your account. If you import a script from another page with "importScript", "mw.loader.load", "iusc", or "lusc", take note that this causes you to dynamically load a remote script, which could be changed by others. Editors are responsible for all edits and actions they perform, including by scripts. User scripts are not centrally supported and may malfunction or become inoperable due to software changes. A guide to help you find broken scripts is available. If you are unsure whether code you are adding to this page is safe, you can ask at the appropriate village pump.
This code will be executed when previewing this page.

Documentation for this user script can be added at User:DatRoot/Scripts/Common.

Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.

/*
Methods for use in other scripts
My JS isn't that good and I'm new to W3C dhtml so there may well be 
bugs / memory leaks / reinvention of the wheel.
All objects are put into a 'DatRoot' object to avoid pollutiong the global namespace.
*/

String.prototype.equals = function(other, ignoreCase)
{
    if(ignoreCase) return this.toLowerCase() == other.toLowerCase();
    else return this == other;
}
String.isNullOrEmpty = function(s) 
{
    return !s || s.length == 0;
}
String.prototype.startsWith = function(s, ignoreCase)
{
    if(ignoreCase) return this.substr(0, s.length).toLowerCase() == s.toLowerCase();
    else return this.substr(0, s.length) == s;
}
String.prototype.trimEnd = function()
{
    for(var p = this.length - 1; p >= 0; p--)
    {
        var c = this.charAt(p);
        var matched = false;
        for(var i = 0; i < arguments.length; i++)
        {
            if(arguments[i] == c) 
            {
                matched = true;
                break;
            }
        }
        if(!matched) return this.substr(0, p + 1);
    }
    return "";
}

var DatRoot = function()
{
    var obj = {};
    
    var newObject = obj.newObject = function(inheritFrom)
    {
        function Funk(){};
        if(inheritFrom) Funk.prototype = inheritFrom;
        return new Funk();
    };
    
    var addEventHandler = obj.addEventHandler = function(elem, eventName, handler)
    {
        if(typeof(elem) == "string") elem = document.getElementById(elem);
        if(!elem) return;
        
        if(elem.addEventListener) elem.addEventListener(eventName, handler, false);
        else if(elem.attachEvent)
        {
            // For IE create create event.target & event.currentTarget
            elem.attachEvent("on" + eventName, function() {
                // For some reason you can't add properties to the event object,
                // but you can create a reverence to it, and then assign properties
                // to it, like this.
                var ev = event;
                ev.target = ev.srcElement;
                ev.currentTarget = elem;
                handler(ev);
            });
        }
    };
    
    var addOnloadHook = obj.addOnloadHook = function(func, name)
    {
        window.addOnloadHook(func);
    };

    var addPortletLink = obj.addPortletLink = function(parent, link)
    {
        if(typeof(link) == "string") link = document.getElementById(link);
        if(!link) return;
        if(typeof(parent) == "string") parent = document.getElementById(parent);
        if(!parent) return;
        
        for(parent = parent.firstChild; parent != null; parent = parent.nextSibling)
        {
            if(parent.className == "pBody")
            {
                for(parent = parent.firstChild; parent != null; parent = parent.nextSibling)
                {
                    if(parent.nodeName == "UL")
                    {
                        parent.appendChild(link);
                        return link;
                    }
                }
            }
        }
    };

    var createElement = obj.createElement = function(tagName, id, className, innerHTML)
    {
        var elem = document.createElement(tagName);
        elem.id = id || "";
        elem.className = className || "";
        if(!String.isNullOrEmpty(innerHTML)) elem.innerHTML = innerHTML;
        return elem;
    };
    
    var createPortletLink = obj.createPortletLink = function (id, text, href, tooltip, accesskey) 
    {
        var link = document.createElement( "a" );
        link.appendChild( document.createTextNode( text ) );
        link.href = href;

        var item = document.createElement( "li" );
        item.appendChild( link );
        if ( id ) item.id = id;

        if ( accesskey ) {
            link.setAttribute( "accesskey", accesskey );
            tooltip += " ["+accesskey+"]";
        }
        if ( tooltip ) {
            link.setAttribute( "title", tooltip );
        }
        if ( accesskey && tooltip ) {
            updateTooltipAccessKeys( new Array( link ) );
        }

        return item;
	}
    
    var getArticleElement = obj.getArticleElement = function()
    {
        if(!articleElement) 
            articleElement = document.getElementById("content") || document.getElementById("article");
        return articleElement;
    };
    var articleElement;
    
    var getChildByClassName = obj.getChildByClassName = function(parent, name)
    {
        var elem = parent.firstChild;
        while(elem != null && elem.className != name) elem = elem.nextSibling;
        return elem;
    };

    var getChildByNodeName = obj.getChildByNodeName = function(parent, name)
    {
        var elem = parent.firstChild;
        while(elem != null && elem.nodeName != name) elem = elem.nextSibling;
        return elem;
    }
    
    var insertBefore = obj.insertBefore = function (newElem, refElem)
    {
        if(typeof(newElem) === "string") newElem = document.getElementById(newElem);
        if(!newElem) return;
        if(typeof(refElem) === "string") refElem = document.getElementById(refElem);
        if(!refElem) return;
        
        refElem.parentNode.insertBefore(newElem, refElem);
    }
    
    return obj;
}();

/*
Create a floating element for tooltips/menus
Still WIP; need do positioning
 */
DatRoot.createContextFloater = function ()
{
    var obj = {};
    var showTimeoutId, hideTimeoutId;
    
    function createDisplayElement()
    {
        obj.displayElement = DatRoot.createElement("div", "", "contextFloater", "Tooltip");
        var deStyle = obj.displayElement.style;
        deStyle.display = "none";
        deStyle.backgroundColor = "InfoBackground";
        deStyle.border = "1px solid black";
        deStyle.padding = "0.2em 0.5em";
        deStyle.font = "8pt Tahoma, sans-serif";
        deStyle.color = "InfoText";
    }
    
    function displayMouseoutHandler(ev)
    {
        hideTimeoutId = setTimeout(hide, obj.hideDelay);
    }
    
    function displayMouseoverHandler(ev)
    {
        if(hideTimeoutId) clearTimeout(hideTimeoutId);
        hideTimeoutId = null;
    }
    
    function sourceMouseoutHandler(ev)
    {
        if(showTimeoutId) clearTimeout(showTimeoutId);
        showTimeoutId = null;
        
        if(obj.sourceElement == ev.currentTarget)
            hideTimeoutId = setTimeout(hide, obj.hideDelay);
    }
    
    function sourceMouseoverHandler(ev)
    {
        var hoverElem = ev.currentTarget;
        
        if(hideTimeoutId && hoverElem == obj.sourceElement)
            clearTimeout(hideTimeoutId);
        else 
        {
            var x, y;
            if (ev.pageX != null)
            {
                x = ev.pageX; y = ev.pageY;
            }
            else if(ev.clientX != null)
            {
                x = ev.clientX + document.body.scrollLeft
                    + document.documentElement.scrollLeft;
                y = ev.clientY + document.body.scrollTop
                    + document.documentElement.scrollTop;
            }
            showTimeoutId = 
                setTimeout(function() { obj.show(hoverElem, x, y); }, obj.showDelay);
        }
    }
    
    obj.displayElement = null;
    createDisplayElement();
    obj.showDelay = 400;
    obj.hideDelay = 400;
    obj.sourceElement = null;
    obj.onShow = null;
    
    obj.applyToElement = function(elem)
    {
        DatRoot.addEventHandler(elem, "mouseover", sourceMouseoverHandler);
        DatRoot.addEventHandler(elem, "mouseout", sourceMouseoutHandler);
    };
    
    var hide = obj.hide = function()
    {
        clearTimeout(hideTimeoutId);
        hideTimeoutId = null;
        
        obj.sourceElement = null;
        if(obj.displayElement) obj.displayElement.style.display = "none";
    };
    
    var show = obj.show = function(sourceElement, x, y)
    {
        clearTimeout(showTimeoutId);
        showTimeoutId = null;
        
        obj.sourceElement = sourceElement || obj.sourceElement;
        if(!obj.sourceElement) return;
        
        if(obj.onShow) obj.onShow();
        if(!obj.displayElement) return;
        
        var srcElem = obj.sourceElement, dispElem = obj.displayElement;
        dispElem.style.display = "none";
        dispElem.style.position = "absolute";
        if(dispElem.parentNode != document.body) document.body.appendChild(dispElem);
        dispElem.style.left = x + "px";
        dispElem.style.top = (y + 15) + "px";
        dispElem.style.display = "block";
        
        dispElem.onmouseover = displayMouseoverHandler;
        dispElem.onmouseout = displayMouseoutHandler;
    };
    
    return obj;
};