//Polyfill for URLSearchParams
(function (w) {

    w.URLSearchParams = w.URLSearchParams || function (searchString) {
        var self = this;
        self.searchString = searchString;
        self.get = function (name) {
            var results = new RegExp('[\?&]' + name + '=([^&#]*)').exec(self.searchString);
            if (results == null) {
                return null;
            }
            else {
                return decodeURI(results[1]) || 0;
            }
        };
    }

    w["platform-ui-skin"] = {
        "manual_url": null
    };
 
})(window);


(function () {

    var LINK_ELEM_ID = "skinLinkElem"
    var SANDBOX_QUERYPARAM = "platform-skin"
    var STATE_URL = "/ui/css/skin/state.json";
    var SKIN_ROOT = "/ui/css/skin/";
    var CHECK_INTERVAL = 80000

    function errorHandler(error) {
        console.error(error);
    }
    function shallowEqual(object1, object2) {
        var keys1 = Object.keys(object1);
        var keys2 = Object.keys(object2);

        if (keys1.length !== keys2.length) {
            return false;
        }

        for (var i = 0; i < keys1.length - 1; i++) {
            var key = keys1[i];
            if (object1[key] !== object2[key]) {
                return false;
            }
        }

        return true;
    }
    function skinPath(name, hash) {
        return SKIN_ROOT + name + "/skin.css" + "?" + hash
    }

    var state = {"settings":{"manual_url":"https://help.davra.com"},"current":{}};
    var settings = state.settings
    var urlParams = new URLSearchParams(window.location.search);
    var sandboxParam = urlParams.get(SANDBOX_QUERYPARAM);
    let skinningEnabled = (sandboxParam === "" && settings.sandbox === true) || settings.sandbox === false ? true : false;
    let skinName = settings.default
    var skinHash = state.current[skinName]
    
    window["platform-ui-skin"]["manual_url"] = settings.manual_url;
    window["platform-ui-skin"]["settings"] = settings;
 
    function applyLinkElement(name, hash, state) {
        console.warn("Skinning applyLinkElement")
        var newLink = document.createElement('link');
        newLink.id = LINK_ELEM_ID
        newLink.href = skinPath(name, hash)
        newLink.type = 'text/css';
        newLink.rel = 'stylesheet';
        newLink.addEventListener('error', errorHandler, false);

        var newFavicon = document.createElement('link');
        newFavicon.rel = 'shortcut icon';
        newFavicon.href = state.settings.favicon

        var favicon = document.querySelector("link[rel~='icon']");
        var existing = document.getElementById(LINK_ELEM_ID);

        if (existing) {
            existing.replaceWith(newLink)
        } else {
            document.getElementsByTagName('head')[0].appendChild(newLink);
        }

        if (favicon) {
            favicon.replaceWith(newFavicon)
        } else {
            document.getElementsByTagName('head')[0].appendChild(newFavicon);
        }
    }

    function checkSkinChange() {

        function processState(state) {
            console.log(state);

            skinningEnabled = (sandboxParam === "" && state.settings.sandbox === true) || state.settings.sandbox === false ? true : false;

            if (skinningEnabled === false && shallowEqual(state.settings, {})) {
                console.warn("Skinning DISABLED")
                skinHash = null;
                try {
                    var existing = document.getElementById(LINK_ELEM_ID);

                    if (!('remove' in Element.prototype)) {
                        Element.prototype.remove = function () {
                            if (this.parentNode) {
                                this.parentNode.removeChild(this);
                            }
                        };
                    }


                    if (existing != null) {
                        existing.remove();
                    }
                } catch (e) {
                    console.error(e);
                }
                return;
            }
            skinName = state.settings.default
            var newHash = state.current[skinName];
            window["platform-ui-skin"]["manual_url"] = settings.manual_url;

            if (newHash == null) {
                console.error('skin ' + skinName + ' not available');
                return;
            }
            if (newHash === skinHash) {
                return;
            }

            skinHash = newHash;

            applyLinkElement(skinName, skinHash, state);


        }

        function reqListener() {
            state = JSON.parse(this.responseText);
            processState(state);
        }
        function errorListener(error) {
            console.error(error)
        }

        var xhr = new XMLHttpRequest();
        xhr.addEventListener("load", reqListener);
        xhr.addEventListener('error', errorListener);
        xhr.open("GET", STATE_URL + "?" + (Math.random() * 100).toString());
        xhr.send();

    }
    var intervalId = setInterval(checkSkinChange, CHECK_INTERVAL);
})();