window.addEvent('domready', function() {
    
    //initialize top10
    $$('#rightTop10 .styled option').each(function(item, index)
    {
        if(item.selected)
        {
            $$('#rightTop10 div.' + item.className).setStyle('display', 'block');
        }
    });

    //set event hadler for top10 drop-down box
    $$('#rightTop10 .styled').addEvent('change', function()
    {
        $$('#rightTop10 .styled option').each(function(item, index)
        {
            if(item.selected)
            {
                $$('#rightTop10 div.' + item.className).setStyle('display', 'block');
                changeTop10Bg(item.className);
            }
            else
                $$('#rightTop10 div.' + item.className).setStyle('display', 'none');
        });
    });
  
    var sectionTitles = new Array('New', 'Hot', 'Staff');
    for(i = 0; i < sectionTitles.length; ++i)
    {
        initScroll($$('#left' + sectionTitles[i]), 
                    $$('#left' + sectionTitles[i] + ' .scrollBlockButtonLeft'),
                    $$('#left' + sectionTitles[i] + ' .scrollBlockButtonRight'));
        initDropBox('#left' + sectionTitles[i], '/xhr/home/' + sectionTitles[i].toLowerCase());
    }
    
    initNewsScroll(10000);

    
});
function initScroll(block, leftArrow, rightArrow)
{
    var pages = block[0].getElements('.scrollBlock');
    var dotContainer = block[0].getElement('.pageDots');
    dotContainer.empty();
    
    if(pages.length > 1)
    {
        var pageIndex = 0;

        for (var i = 0; i < pages.length; i++)
        {
            var dot = new Element('div', {'class' : 'pageDot'});
            dot.inject(dotContainer);
            if(i) 
            {
                pages[i].setStyle('left', '100%');
                dot.addClass('inactive');
            }
            else
                dot.addClass('active');
            pages[i].setStyle('display', 'block');
            dot.setStyle('display', 'block');
        }
        var dots = dotContainer.getElements('.pageDot');
        //also display arrows
        leftArrow.setStyle('display', 'block');
        rightArrow.setStyle('display', 'block');
        //
        
        rightArrow.addEvent('click', function()
        {
            var fx = new Fx.Tween(pages[pageIndex], {'unit':'%'});
            fx.set('left', 0);
            fx.start('left', -100);
            dots[pageIndex].removeClass('active');
            dots[pageIndex].addClass('inactive');
            
            pageIndex = pageIndex + 1 < pages.length ? pageIndex + 1 : 0;

            var fx = new Fx.Tween(pages[pageIndex], {'unit':'%'});
            fx.set('left', 100);
            fx.start('left', 0);
            dots[pageIndex].removeClass('inactive');
            dots[pageIndex].addClass('active');
        });
        leftArrow.addEvent('click', function()
        {
            var fx = new Fx.Tween(pages[pageIndex], {'unit':'%'});
            fx.set('left', 0);
            fx.start('left', 100);
            dots[pageIndex].removeClass('active');
            dots[pageIndex].addClass('inactive');

            pageIndex = pageIndex - 1 >= 0 ? pageIndex - 1 : pages.length - 1;

            var fx = new Fx.Tween(pages[pageIndex], {'unit':'%'});
            fx.set('left', -100);
            fx.start('left', 0);
            dots[pageIndex].removeClass('inactive');
            dots[pageIndex].addClass('active');
        });
    }
    else
    {
        pages[0].setStyle('display', 'block');
        leftArrow.setStyle('display', 'none');
        rightArrow.setStyle('display', 'none');
    }
}

function initDropBox(elem, link)
{   
    $$(elem + ' .styled').addEvent('change', function()
    {
        var selectedCat = '';
        $$(elem + ' .styled option').each(function(item, index)
        {
            if(item.selected)
                selectedCat = item.get('text');
        });
        var req = new Request(
        {
             method: 'get',
             url: link + '/' + escape(selectedCat),
             onRequest: function()
             {  
                var waitMessage = '<div class="loadWaitMessage"><span>Loading...</span></div>';
                $$(elem + ' .scrollBlockButtonLeft').setStyle('display', 'none');
                $$(elem + ' .scrollBlockButtonRight').setStyle('display', 'none');
                $$(elem + ' .scrollBlockCnt').set('html', waitMessage);
             },
             onComplete: function(response)
             { 
                $$(elem + ' .scrollBlockCnt').set('html', response);
                var block = $$(elem);
                var leftArrow = $$(elem + ' .scrollBlockButtonLeft');
                var rightArrow = $$(elem + ' .scrollBlockButtonRight');
                initScroll(block, leftArrow, rightArrow);
             },
             onException: function()
             {
                alert('Error sending request');
             }
        }).send();
    });
}

function initNewsScroll(timeout)
{
    var pageIndex = 0;
    var pages = $$('.spinletsNewsGroup');
//    var dotContainerArr = $$('#leftSoon .pageDots');
    if(pages.length < 1)
        return;
    else
        if(pages.length < 2)
        {
            pages[0].setStyle('display', 'block');
            return;
        }
    
    for (var i = 0; i < pages.length; i++)
    {
//        var dot = new Element('div', {'class' : 'pageDot'});
//        dot.inject(dotContainerArr[0]);
        if(i)
        {
            pages[i].setStyle('left', '100%');
//            dot.addClass('inactiveSoon');
        }
//        else
//            dot.addClass('activeSoon');
        pages[i].setStyle('display', 'block');
//        dot.setStyle('display', 'block');
    }
    
    setTimeout('doNewsScroll(0, ' + timeout + ')', timeout);
}

function doNewsScroll(index, timeout)
{
    var pages = $$('.spinletsNewsGroup');
//    var dots = $$('#leftSoon .pageDot');
    var fx = new Fx.Tween(pages[index], {'unit' : '%', 'duration' : 'long'});
    fx.set('left', 0);
    fx.start('left', -100);
//    dots[index].removeClass('activeSoon');
//    dots[index].addClass('inactiveSoon');
    
    index = index + 1 < pages.length ? index + 1 : 0;

    var fx = new Fx.Tween(pages[index], {'unit' : '%', 'duration' : 'long'});
    fx.set('left', 100);
    fx.start('left', 0);
//    dots[index].removeClass('inactiveSoon');
//    dots[index].addClass('activeSoon');
    
    setTimeout('doNewsScroll(' + index + ', ' + timeout + ')', timeout);
}

function coverflowOn()
{
    var elem = new Element('div', {'id' : 'header1en'});
    elem.replaces($('header1_1en'));
}

function changeTop10Bg(className)
{
    var index = className.substr(className.length - 1);
    var backGrounds = new Array('blockRight', 'blockRightMusic', 'blockRightNewspodcasts', 'blockRightNewspodcasts','blockRightSports');

    var oldClass = $('rightTop10').className;
    $('rightTop10').removeClass(oldClass);
    $('rightTop10').addClass(backGrounds[index - 1]);
}