/**
 * Register a function, fired after the site has loaded
 */
Event.observe(window, 'load', siteInit);

/**
 * Called after DOM loaded
 */
function siteInit()
{
    var modeChange = {
        generic: function(event) {
            var mode = Event.element(event).value;
            
            if (mode === 'small') {
                $('thirdTld').style.display = 'none';
            } else {
                $('thirdTld').style.display = '';
            }
            
            generateSource();
        }
    };
    
    siteInit.fields = new Array('firstTld', 'secondTld', 'thirdTld');

    var tldChange = {
        generic: function(event) {
            for (var i = 0; i < siteInit.fields.length; i++) {
                if (siteInit.fields[i] == Event.element(event).id) {
                    continue;
                }

                var selectedTlds = new Array();

                for (var j = 0; j < siteInit.fields.length; j++) {
                    if (siteInit.fields[j] != siteInit.fields[i]) {
                        var select = $(siteInit.fields[j]);
                        selectedTlds.push(select.options[select.selectedIndex].value);
                    }
                }

                var select = $(siteInit.fields[i]);
                var currentSelectedTld = select.options[select.selectedIndex].value;

                clearSelect(select);

                for (var tld in tldList) {
                    if (typeof(tldList[tld]) != 'object') {
                        continue;
                    } else {
                        var used = false;

                        for (var j = 0; j < selectedTlds.length; j++) {
                            if (selectedTlds[j] == tld) {
                                used = true;
                                break;
                            }
                        }

                        if (used) {
                            continue;
                        }
                    }

                    var option = document.createElement('option');
                    option.value     = tld;
                    option.innerHTML = tld;

                    if (tld == currentSelectedTld) {
                        option.selected = true;
                    }

                    select.appendChild(option);
                }
            }

            generateSource();
        }
    };

    for (var i = 0; i < siteInit.fields.length; i++) {
        var select = $(siteInit.fields[i]);

        clearSelect(select);

        var j = -1;
        for (var tld in tldList) {
            if (typeof(tldList[tld]) != 'object') {
                continue;
            }

            j++;

            if (j < siteInit.fields.length && j != i) {
                continue;
            }

            var option = document.createElement('option');
            option.value     = tld;
            option.innerHTML = tld;

            select.appendChild(option);
        }

        Event.observe(siteInit.fields[i], 'change', tldChange.generic.bindAsEventListener(tldChange));
    }
    
    Event.observe($('widget-mode-normal'), 'change', modeChange.generic.bindAsEventListener(modeChange));
    Event.observe($('widget-mode-small'), 'change', modeChange.generic.bindAsEventListener(modeChange));
    
    var autoFocusChange = {
        generic: function(event) {
            generateSource();
        }
    };
    
    Event.observe($('auto-focus'), 'change', autoFocusChange.generic.bindAsEventListener(autoFocusChange));

    generateSource();
}

/**
 * Convert HTML special characters
 */
function htmlspecialchars(string)
{
    string = string.replace(/&/g,  "&amp;")
    string = string.replace(/\"/g, "&quot;")
    string = string.replace(/\'/g, "&#039;")
    string = string.replace(/</g,  "&lt;")
    string = string.replace(/>/g,  "&gt;")

    return string;
}

/**
 * Clear a select box
 */
function clearSelect(select)
{
    numOptions = select.options.length;

    for (var i = 0; i < numOptions; i++) {
        select.options[0] = null;
    }
}

/**
 * Generate sourcecode for the widget
 */
function generateSource()
{
    if ($('widget-mode-normal').checked) {
        var mode = 'normal';
    } else {
        var mode = 'small';
    }

    if ($('auto-focus').checked) {
        var autoFocus = true;
    } else {
        var autoFocus = false;
    }
    
    if (mode == 'normal') {
        var tlds = $('firstTld').options[$('firstTld').selectedIndex].value
                 + ','
                 + $('secondTld').options[$('secondTld').selectedIndex].value
                 + ','
                 + $('thirdTld').options[$('thirdTld').selectedIndex].value;
        
        var width = 348;
    } else {
        var tlds = $('firstTld').options[$('firstTld').selectedIndex].value
                 + ','
                 + $('secondTld').options[$('secondTld').selectedIndex].value;
        
        var width = 240;
    }
   
    var sourceCode = "<div id=\"snailo-widget\"></div>\n"
                   + "<scr" + "ipt type=\"text/javascript\">\n"
                   + "var snailoLanguage  = '" + lang['language'] + "';\n"
                   + "var snailoTlds      = '" + tlds + "';\n"
                   + "var snailoWidth     = " + width +";\n"
                   + "var snailoHeight    = 265;\n"
                   + "var snailoAutoFocus = " + (autoFocus ? 'true' : 'false') + ";\n"
                   + "</scr" + "ipt>\n"
                   + "<scr" + "ipt type=\"text/javascript\" src=\"" + absoluteUri + "media/js/widget-embedded.js\"></scr" + "ipt>";
    
    var snailoUrl = absoluteUri + 'widget/' + (autoFocus ? 'auto-focus/' : '') + tlds;
    
    $('example').innerHTML = '';
    
    if (document.all) {
        var snailoObject         = document.createElement('iframe');
        snailoObject.width       = width;
        snailoObject.height      = 265;
        snailoObject.src         = snailoUrl;
        snailoObject.frameBorder = 0;
        document.getElementById('example').appendChild(snailoObject);
    } else {
        var snailoObject       = document.createElement('object');
        snailoObject.classid   = 'clsid:25336920-03F9-11CF-8FD0-00AA00686F13';
        snailoObject.type      = 'text/html';
        snailoObject.data      = snailoUrl;
        snailoObject.width     = width;
        snailoObject.height    = 265;
        document.getElementById('example').appendChild(snailoObject);
    }

    $('widget_source').value = sourceCode;
}