/*function expandDropdown(id, sender) {
    $$('#'+id+' .list')[0].style.display = 'block';
}
function collapseDropdown(id, sender, activeLabel) {
    $$('#'+id+' .list')[0].style.display = 'none';
    if (!(activeLabel == undefined)) $$('#'+id+' .label')[0].innerHTML = activeLabel;
}*/

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

var new_step1List = null;
var new_step2List = null;
var new_step3List = null;

function initializeDropdown()  {
    //loadDropdownContentStep1();
    //loadDropdownContentStep2();
    //loadDropdownContentStep3();
    
    //new_step1List = new DropdownList('step1List',$('step1Input'));
    //new_step2List = new DropdownList('step2List',$('step2Input'));
    //new_step3List = new DropdownList('step3List',$('step3Input'));
    //new_step1List.update();
    //new_step2List.update();
    //new_step3List.update();
}

var DropdownList = new Class({
    initialize: function(id, original)    {
        this.selectedIndex = 0;
        this.id = id;
        this.original = original;
        this.container = this.original.getParent();
        
        this.original.setStyle('display','none');
        this.original.addEvent('change',function(event)    {
            this.setSelectedIndex(this.original.selectedIndex);
        }.bind(this));
        
        this.dropdown = new Element('div',{
            'class': 'dropdownlist',
            'id': this.id,
            'events': {
                'click': function(event)   {
                    event.stop();
                    this.dropdownList.setStyle('display','block');
                }.bind(this)/*,
                'mouseenter': function(event)   {
                    this.dropdownList.setStyle('display','block');
                }.bind(this),
                'mouseleave': function(event)   {
                    this.dropdownList.setStyle('display','none');
                }.bind(this)*/
            }
        });
        this.dropdownLabel = new Element('span',{
            'class': 'label',
            'html': ''
        });
        this.dropdownButton = new Element('span',{
            'class': 'dropbutton',
            'events': {
                'click': function(event)   {
                    event.stop();
                    this.dropdownList.setStyle('display','block');
                }.bind(this)/*,
                'mouseleave': function(event)   {
                    this.dropdownList.setStyle('display','none');
                }.bind(this)*/
            }
        });
        this.dropdownList = new Element('ul',{
            'class': 'list',
            'styles': {
                'display': 'none',
                'z-index': '999'
            },
            'events': {
                'click': function(event)   {
                    event.stop();
                    this.dropdownList.setStyle('display','block');
                }.bind(this)/*,
                'mouseenter': function(event)   {
                    this.dropdownList.setStyle('display','block');
                }.bind(this),
                'mouseleave': function(event)   {
                    this.dropdownList.setStyle('display','none');
                }.bind(this)*/
            }
        });
        
        document.addEvent('click',function(event)    {
            this.dropdownList.setStyle('display','none');
        }.bind(this));
        
        this.dropdownLabel.inject(this.dropdown);
        this.dropdownButton.inject(this.dropdown);
        this.dropdownList.inject(this.dropdown);
        this.dropdown.inject(this.container);
    },
    update: function()  {
        this.dropdownList.empty();
        for (var i = 0; i < this.original.options.length; i++) {
            new Element('li',{
                'html': this.original.options[i].text,
                'class': i,
                'events': {
                    'click': function(event)   {
                        var event = new Event(event);
                        this.setSelectedIndex(event.target.className);
                        this.dropdownList.setStyle('display','none');
                        event.stop();
                    }.bind(this)
                }
            }).inject(this.dropdownList);
            
            if (i == 0) {
                this.selectedIndex = i;
            }
        }
        this.setSelectedIndex(this.selectedIndex);
    },
    setSelectedIndex: function(index)   {
        this.selectedIndex = index;
        if (this.original.selectedIndex != this.selectedIndex)  {
            this.original.selectedIndex = this.selectedIndex;
            this.original.onchange();
        }
        this.dropdownLabel.set('text',this.original.options[index].text);
    }
});


function loadDropdownContentStep1() {
    //$('step1LoadingIndicator').style.visibility = 'visible';
    
    var step1List = $('step1Input');
    var step2List = $('step2Input');
    
    var sportId = 0;
    /*if (step2List.selectedIndex > -1)   {
        sportId = step2List.options[step2List.selectedIndex].value;
    }*/
    
    var jsonRequest = new Request.JSON({url: sitebase+'/ajax.php', onComplete: function(countries){
        for (var i = step1List.options.length ; i > 0; i--) { step1List.options[i] = null;}
        countries.each(function(country,index){
            step1List.options[index] = new Option(country.name,country.id);
        });
        //new_step1List.update();
        //$('step1LoadingIndicator').style.visibility = 'hidden';
    }}).get({'content': 'step1_countries', 'sportId': sportId, 'lang_id': languageId});
    
    loadDropdownContentStep3();
}
function loadBannerStep2()  {
    var step1List = $('step1Input');
    
    var countryId = 0;
    if (step1List.selectedIndex > -1)   {
        countryId = step1List.options[step1List.selectedIndex].value;
    }
    
    getContent('banner', {'languageId': languageId, 'countryId': countryId, 'sportId': 0}, $('banner'));    
}
function loadDropdownContentStep2() {
    //$('step2LoadingIndicator').style.visibility = 'visible';
    
    var step1List = $('step1Input');
    var step2List = $('step2Input');
    
    var countryId = 0;
    if (step1List.selectedIndex > -1)   {
        countryId = step1List.options[step1List.selectedIndex].value;
    }
    
    var jsonRequest = new Request.JSON({url: sitebase+'/ajax.php', onComplete: function(sports){
        for (var i = step2List.options.length ; i > 0; i--) { step2List.options[i] = null;}
        sports.each(function(sport,index){
            step2List.options[index] = new Option(sport.name,sport.id);
        });
        //new_step2List.update();
        //$('step2LoadingIndicator').style.visibility = 'hidden';
    }}).get({'content': 'step2_sports', 'countryId': countryId, 'lang_id': languageId});
}

function loadBannerStep3()  {
    var step1List = $('step1Input');
    var step2List = $('step2Input');
    
    var countryId = 0;
    if (step1List.selectedIndex > -1)   {
        countryId = step1List.options[step1List.selectedIndex].value;
    }
    var sportId = 0;
    if (step2List.selectedIndex > 0)   {
        sportId = step2List.options[step2List.selectedIndex].value;
    }
    
    getContent('banner', {'languageId': languageId, 'countryId': countryId, 'sportId': sportId}, $('banner'));    
}
function loadDropdownContentStep3() {
    //$('step3LoadingIndicator').style.visibility = 'visible';
    
    var step1List = $('step1Input');
    var step2List = $('step2Input');
    var step3List = $('step3Input');
    
    var countryId = 0;
    if (step1List.selectedIndex > -1)   {
        countryId = step1List.options[step1List.selectedIndex].value;
    }
    var sportId = 0;
    if (step2List.selectedIndex > 0)   {
        sportId = step2List.options[step2List.selectedIndex].value;
    }

    var jsonRequest = new Request.JSON({url: sitebase+'/ajax.php', onComplete: function(clubs){
        for (var i = step3List.options.length ; i > 0; i--) { step3List.options[i] = null;}
        clubs.each(function(club,index){
            step3List.options[index] = new Option(club.name,club.id);
        });
        //new_step3List.update();
        //$('step3LoadingIndicator').style.visibility = 'hidden';
    }}).get({'content': 'step3_clubs', 'countryId': countryId, 'sportId': sportId, 'lang_id': languageId});
}

function loadClubPage(clubId) {
    location.href = urlbase+'/clubs/'+clubId;
}

function getContent(url,params,object)   {
    url = "ajax.php?content="+url+"&"+params;
    var myHTMLRequest = new Request.HTML({'url':url, 'update':object}).get(params); 
    
    return false;
}







function loadDropdownContentSports() {
    //$('step2LoadingIndicator').style.visibility = 'visible';
    
    var step1List = $('countryInput');
    var step2List = $('sportInput');
    var step3List = $('clubInput');
    
    var countryId = 0;
    if (step1List.selectedIndex > -1)   {
        countryId = step1List.options[step1List.selectedIndex].value;
    }
    
    var jsonRequest = new Request.JSON({url: sitebase+'/ajax.php', onComplete: function(sports){
        for (var i = step2List.options.length ; i > 0; i--) { step2List.options[i] = null;}
        for (var i = step3List.options.length ; i > 0; i--) { step3List.options[i] = null;}
        sports.each(function(sport,index){
            step2List.options[index] = new Option(sport.name,sport.id);
        });
        //new_step2List.update();
        //$('step2LoadingIndicator').style.visibility = 'hidden';
    }}).get({'content': 'step2_sports', 'countryId': countryId, 'lang_id': languageId});
}
function loadDropdownContentClubs() {
    //$('step3LoadingIndicator').style.visibility = 'visible';
    
    var step1List = $('countryInput');
    var step2List = $('sportInput');
    var step3List = $('clubInput');
    
    var countryId = 0;
    if (step1List.selectedIndex > -1)   {
        countryId = step1List.options[step1List.selectedIndex].value;
    }
    var sportId = 0;
    if (step2List.selectedIndex > 0)   {
        sportId = step2List.options[step2List.selectedIndex].value;
    }

    var jsonRequest = new Request.JSON({url: sitebase+'/ajax.php', onComplete: function(clubs){
        for (var i = step3List.options.length ; i > 0; i--) { step3List.options[i] = null;}
        clubs.each(function(club,index){
            step3List.options[index] = new Option(club.name,club.id);
        });
        //new_step3List.update();
        //$('step3LoadingIndicator').style.visibility = 'hidden';
    }}).get({'content': 'step3_clubs', 'countryId': countryId, 'sportId': sportId, 'lang_id': languageId});
}