// theme changer javascript

function UpdateExternalCss(themeName) {
    //
    // Changing a theme for preview. Logic:
    // 1. disable all themes in the header with a path "App_Themes" EXCEPT
    //  a) the current selected theme
    //  b) _Crossbone (editor/main site) themes
    //  c) cssCustom.css will be disable for themes other than current theme
    //
    
    var themeChanger_CurrentTheme = document.getElementById(themeChanger_hfCurrentTheme_ID).value;
    var loaded = false;
    var currentTheme = false;
    var customStyleIndex;
    for (var i = 0; i < document.styleSheets.length; i++) {
        if (document.styleSheets[i].href != null) {
            if (document.styleSheets[i].href.search('App_Themes/' + themeName + '/') != -1) {
                document.styleSheets[i].disabled = false;
                loaded = true;
                if (themeChanger_CurrentTheme == themeName) {
                    currentTheme = true;
                }
                SetSelectedTheme(themeName);
            }
            else if (document.styleSheets[i].href.search('App_Themes/_Crossbone') != -1) {
                //crossbone editor theme, do not disable
            }
            else if (document.styleSheets[i].href.search('App_Themes') != -1) {
                document.styleSheets[i].disabled = true;
            }
            else if (document.styleSheets[i].href.search('customCss.css') != -1) {
                customStyleIndex = i;
            }
        }
    }
    
    if (!currentTheme) {
        document.styleSheets[customStyleIndex].disabled = true;
    }
    
    //
    // load the theme if never loaded 
    // TODO: clean this up in future
    //
    if (!loaded) {
        var headID = document.getElementsByTagName("head")[0];
        var cssNode = document.createElement('link');
        cssNode.type = 'text/css';
        cssNode.rel = 'stylesheet';
        cssNode.href = 'App_Themes/' + themeName + '/styling.css';
        cssNode.media = 'screen';
        headID.appendChild(cssNode);
        cssNode = document.createElement('link');
        cssNode.type = 'text/css';
        cssNode.rel = 'stylesheet';
        cssNode.href = 'App_Themes/' + themeName + '/font.css';
        cssNode.media = 'screen';
        headID.appendChild(cssNode);
        cssNode = document.createElement('link');
        cssNode.type = 'text/css';
        cssNode.rel = 'stylesheet';
        cssNode.href = 'App_Themes/' + themeName + '/layout.css';
        cssNode.media = 'screen';
        headID.appendChild(cssNode);
        SetSelectedTheme(themeName);
    }
    
}

function SetSelectedTheme(themeName) {
    document.getElementById(themeChanger_hfSelectedTheme_ID).value = themeName;
}

function CancelThemeChange() {
    //
    // "Roll back" by disabling every theme but the current theme
    //
    var themeChanger_CurrentTheme = document.getElementById(themeChanger_hfCurrentTheme_ID).value;

    for (var i = 0; i < document.styleSheets.length; i++) {
        var styleSheet = document.styleSheets[i];

        if (styleSheet.href != null) {
            if (styleSheet.href.search('App_Themes/_Crossbone') != -1) {
                //Crossbone's editor theme, skip
            }
            else if (styleSheet.href.search('App_Themes/') != -1) {
                if (styleSheet.href.search('App_Themes/' + themeChanger_CurrentTheme + '/') != -1) {
                    styleSheet.disabled = false;
                }
                else {
                    styleSheet.disabled = true;
                }
            }
            else if (styleSheet.href.search('Users/') != -1) {
                styleSheet.disabled = false;
            }
        }
    }

    SetSelectedTheme(themeChanger_CurrentTheme);
}