var Site = {
    start: function() {
        HelpTextBox.start('helptextemail', 'type your email here...');
        ResourceSelector.start();
        ExternalLinks.start();
        FadeTextBox.start();
        FadeTextArea.start();
        Navigation.start();
    }
}

var PopUp = {
    open: function(url){
        window.open(url);
        return false;
    }
}

var ExternalLinks = {
    start: function() {
        if (!document.getElementsByTagName) return;
        var anchors = document.getElementsByTagName('a');
        for (var i=0; i<anchors.length; i++) {
            var anchor = anchors[i];
            if (anchor.getAttribute('href') && anchor.getAttribute('rel') == 'external')
                anchor.target = '_blank';
        }
    }
};

var HelpTextBox = {
    start: function(className, text) {
        var tbs = document.getElementsByClassName(className);
        tbs.each(function(tb) {
            if(tb.value == "")
                tb.value = text;
            tb.helpText = text;
            
            tb.addEvent('focus', function() {
                if(this.value == this.helpText)
                    this.value = "";
            });
            tb.addEvent('blur', function() {
                if(this.value == "")
                    this.value = this.helpText;
            });
        });
    }
};

var FadeTextBox = {
    start: function() {
        var els = $$('INPUT');
        els = els.filter(function(el) {
            return el.type == 'text';
        });
        
        els.each(function(el) {
            el.fadeToColour = FadeTextBox.getFadeToColour();
            
            el.addEvent('focus', function() {
                var fadeTo = this.fadeToColour;
                var fade = new Fx.Styles(el, {duration: 120, transition: Fx.Transitions.linear});
                fade.start({
                    'background-color': fadeTo,
                    'color': '000000'
                });
            });
            
            el.addEvent('blur', function() {
                var fade = new Fx.Styles(el, {duration: 120, transition: Fx.Transitions.linear});
                fade.start({
                    'background-color': 'FFFFFF',
                    'color': '5c5c5c'
                });
            });
        });
    },
    
    getFadeToColour: function() {
        var col = 'edf9f7';
        return col;
    }
};

var FadeTextArea = {
    start: function() {
        var els = $$('TEXTAREA');
        
        els.each(function(el) {
            el.fadeToColour = FadeTextArea.getFadeToColour();
            
            el.addEvent('focus', function() {
                var fadeTo = this.fadeToColour;
                var fade = new Fx.Styles(el, {duration: 120, transition: Fx.Transitions.linear});
                fade.start({
                    'background-color': fadeTo,
                    'color': '000000'
                });
            });
            
            el.addEvent('blur', function() {
                var fade = new Fx.Styles(el, {duration: 120, transition: Fx.Transitions.linear});
                fade.start({
                    'background-color': 'FFFFFF',
                    'color': '5c5c5c'
                });
            });
        });
    },
    
    getFadeToColour: function() {
        var col = 'fff0e6';
        return col;
    }
};

var ResourceSelector = {
    start: function() {
        var els = $$('.resourceselector');
        els.each(function(el) {
            // set the initial state of the control
            ResourceSelector.init(el);
            
            // hook up action to add link
            var add = el.getElements('.add')[0];
            add.selector = el;
            add.selector.max = el.max;
            add.addEvent('click', function() {
                ResourceSelector.addRow(this.selector);
            });
        });
    },
    // used to set maxresources for a selector
    setMaxResources: function(num, id){
        $(id).max = num;
    },    
    
    init : function(selector) {
        var drop = selector.getElements('select')[0];
        var tb = selector.getElements('.selectedvalue')[0];
        
        // init selected options        
        var selectedOptions = new Array();
        for(var i=0; i<drop.options.length; i++) {
            if(tb.value.indexOf(drop.options[i].value) >= 0)
                selectedOptions[selectedOptions.length] = drop.options[i];
        }
        selectedOptions.each(function(opt) {
            opt.selected = true;
            ResourceSelector.addRow(selector);
        });
        
        // sort options
        ResourceSelector.sortDrop(drop);
    },
    
    addRow : function(selector) {

        var drop = selector.getElements('select')[0];
        var tb = selector.getElements('.selectedvalue')[0];
        var lastRow = selector.getElements('.dropdown')[0];
        var numSelected = selector.getElements('tr').length;        

        //check if item selected and is within maximum if a maximum has been set
        if(drop.selectedIndex >= 0 && (selector.max==null || selector.max>=numSelected)) {

            // disable dropdown if has reached maximum limit
            if(selector.max==numSelected){
                drop.disabled = true;
                drop.setStyle('background-color', 'f7f7f7');
            }
            
            // get selected option
            var opt = drop.options[drop.selectedIndex];
            var val = opt.value;
            var txt = opt.text;
            var txt_l = txt.toLowerCase();
            
            // remove from drop down
            drop.options[drop.selectedIndex] = null;
            drop.selectedIndex = 0;
            if(drop.options.length == 0) {
                drop.disabled = true;
                drop.setStyle('background-color', 'f7f7f7');
            }
            
            // add to text box
            if(tb.value.indexOf(val) < 0)
                tb.value += val;
            
            // work out where to inject this row
            var before = null;
            var trs = selector.getElements('tr');
            trs.each(function(tr) {
                if(!tr.hasClass('dropdown')) {
                    var trval = tr.getElements('input')[0].value.toLowerCase();
                    var comp = (trval < txt_l) - (txt_l < trval);
                    if(comp > 0)
                        before = tr;
                }
            });
            if(before == null)
                before = lastRow;
            
            // add new row to table
            var newRow = new Element('tr').injectAfter(before);
            var tbCell = new Element('td').injectInside(newRow);
            var tbNew = new Element('input').addClass('text').injectInside(tbCell);
            tbNew.type = 'text';
            tbNew.value = txt;
            var dlCell = new Element('td').injectInside(newRow);
            
            // add delete link
            var link = new Element('a').addClass('delete').injectInside(dlCell);
            link.innerHTML = 'x';
            link.selectedValue = val;
            link.selectedText = txt;
            link.row = newRow;
            link.selector = selector;
            link.href = 'javascript:void(0)';
            link.addEvent('click', function() {
                ResourceSelector.deleteRow(this.selector, this, this.row);
            });
        }
    },
    
    deleteRow : function(selector, link, row) {
        var drop = selector.getElements('select')[0];
        var tb = selector.getElements('.selectedvalue')[0];
        var lastRow = selector.getElements('.dropdown')[0];
        var numSelected = selector.getElements('tr').length; 
        
        // put option back in drop down
        var opt = new Option(link.selectedText, link.selectedValue);
        drop.options[drop.options.length] = opt;
        opt.selected = true;
        ResourceSelector.sortDrop(drop);
        drop.disabled = false;
        drop.setStyle('background-color', 'ffffff');
        //lastRow.setStyle('display', 'block');
        
        // remove row from table
        row.remove();
        
        // remove from selected text
        tb.value = tb.value.replace(link.selectedValue, '');
    },
    
    sortDrop : function(drop) {
        // collect current options in array
        var copyOption = new Array();
        for (var i = 0; i < drop.options.length; i++)
            copyOption[i] = new Array(drop.options[i].text, drop.options[i].value, drop.options[i].selected);

        // sort array by text
        copyOption.sort(
            function(a, b) { 
                return (b[0].toLowerCase() < a[0].toLowerCase()) - (a[0].toLowerCase() < b[0].toLowerCase()); 
            }
        );

        // clear current options
        drop.options.length = 0;

        // add sorted options back to dropdown
        for (var i = 0; i < copyOption.length; i++) {
            var opt = new Option(copyOption[i][0], copyOption[i][1], copyOption[i][2]);
            drop.options[drop.options.length] = opt;
        }
    }
};

var Navigation = {
    start: function() {
        var nav = $('nav');
        var ul = nav.getElements("ul")[0];
        var ul2s = ul.getElements("ul");
        
        ul2s.each(function(ul2) {
            ul2.link = $(ul2.parentNode).getElements("a")[0];
            ul2.link.linkwidth = ul2.link.getCoordinates()["width"];
            
            ul2.link.addEvent('mouseover', function() {
                this.setStyle("background-position", "-" + this.linkwidth + "px 0px");
            });
            ul2.link.addEvent('mouseout', function() {
                this.setStyle("background-position", "0px 0px");
            });
            ul2.addEvent('mouseover', function() {
                this.link.setStyle("background-position", "-" + this.link.linkwidth + "px 0px");
            });
            ul2.addEvent('mouseout', function() {
                this.link.setStyle("background-position", "0px 0px");
            });
            
            // ie6 hacks
            if(window.ie6) {
                ul2.link.addEvent('mouseover', function() {
                    Navigation.ie6HideAll();
                    var ul = $(this.parentNode).getElements("ul")[0];
                    var left = this.getPosition()["x"];
                    ul.setStyle("left", left + "px");
                    
                });
                
                ul2.link.addEvent('mouseleave', function() {
                    var ul = $(this.parentNode).getElements("ul")[0];
                });
                
                ul2.addEvent('mouseleave', function() {
                    this.setStyle("left", "-999px");
                });
            }
        });
        
        // ie6 hacks    
        if(window.ie6) {
            var nav = $('nav');
            var ul = nav.getElements('ul')[0];
            
            nav.addEvent('mouseleave', function() {
                var ul = this.getElements("ul")[0];
                var ul2s = ul.getElements("ul");
                ul2s.each(function(ul2) {
                    ul2.setStyle("left", "-999px");
                });
            });
            
            for(var i=0; i<ul.childNodes.length; i++) {
                var li = $(ul.childNodes[i]);
                var a = li.getElements("a")[0];
                if(li.getElements('ul').length == 0) {
                    a.addEvent('mouseover', function() {
                        Navigation.ie6HideAll();
                    });
                }
            }
        }
    },
    
    ie6HideAll: function() {
        var ul2s = $('nav').getElements("ul")[0].getElements("ul");
        ul2s.each(function(ul2) {
            ul2.setStyle("left", "-999px");
        });
    }
};

window.addEvent('domready', function(){Site.start();});