//-- global timer
var mainTimer

//-- original position
var offPos = { top: new Number(), left: new Number(), width: 120, height: 120, bgColor: '#666666', seed: 20 }
//-- show position
var onPos = { top: new Number(), left: new Number(), width: 305, height: 180, bgColor: '#BED201', menuOffset: { top: 110, left: 450}, curShow: -1, curRun: true }

$(function() {
    homeSetup();
    inSetup();
});

//############################################################################################################################################
//##  INTERNA
function inSetup() {

//-- internal menu
    if ($('td.option').size() != 0) {
        $('td.option')
        .hover(
            function() { $(this).animate({ backgroundColor: onPos.bgColor, color: '#000' }, 'fast') },
            function() { $(this).animate({ backgroundColor: offPos.bgColor, color: '#fff' }, 'fast') }
          )
        .click(function() {
            if( ($(this).find('a').attr('href')) != undefined ){ location = ($(this).find('a').attr('href')) }
        })
    }

//-- imgGallery switch
    if ($('div.thumbs').size() != 0) {
        $('div.thumbs img').click(function() {
            $('div.left').html('<img src="' + $(this).attr('longdesc') + '"/>').animate({'height': 325});
        })

    }
 }




//############################################################################################################################################
//##  HOME

 function homeSetup() {

     if ($('.hm').size() == 0) { return true } // skip if not home
     
    //-- read client offset
    offPos.left = $('.grid').offset().left + (offPos.seed / 2);
    offPos.top = $('.grid').offset().top + (offPos.seed / 2);

    //-- place thumbs
    var pPos = offPos.left;
    $('.hm')
    .each(function() {
        $(this)
        .css({ position: 'absolute', left: (pPos), overflow: 'hidden', top: (offPos.top), width: offPos.width, height: offPos.height })
        .attr('or', pPos)
        .find('p').hide();
        pPos += (offPos.width + offPos.seed);
    });

    //-- calculate show position
    onPos.top = offPos.top + offPos.height + offPos.seed;
    onPos.left = $('.hm:eq(4)').offset().left;
    onPos.width = (offPos.width * 3) + (offPos.seed * 2);
    onPos.height = (offPos.height * 2) + (offPos.seed * 1);

    $('.hm')
    .click(function() {
        if ($(this).hasClass('show')) { return true }
        clearTimeout(mainTimer);
        showPad($(this), true);
    })

    .hover(
        function() { $(this).animate({ backgroundColor: onPos.bgColor }, "fast") },
        function() {
            if (!($(this).hasClass('show'))) {
                $(this).animate({ backgroundColor: offPos.bgColor }, "fast")
            }
        });

    $('.hm img').hide();
    $('div.left')
        .css({
            position: 'absolute',
            overflow: 'hidden',
            left: (offPos.left),
            top: (onPos.top),
            width: (offPos.width * 4) + (offPos.seed * 3),
            height: (offPos.height * 2) + (offPos.seed * 1)
        })
    $('.grid')
        .css({
            height: (offPos.height + onPos.height + (offPos.seed * 2.5))
        })

    selChannel();
}

function selChannel() {
    if (!(onPos.curRun)) {return true;};
    if (onPos.curShow > ($('.hm').size())-2) { onPos.curShow =-1}
    onPos.curShow++
    var pSel = '.hm:eq(' + onPos.curShow + ')'
    showPad($(pSel));
    mainTimer = setTimeout('selChannel()', 4000)
}

function showPad(oThis) {
    if ($(oThis).hasClass('show')) { return true };

    $('.hm').animate({ backgroundColor: offPos.bgColor });

    var orL = $('.hm.show').attr('or')
    $('.hm.show p').hide();
    $('.hm.show')
            .removeClass('show')
            .css({ 'z-index': 1, width: offPos.width, height: offPos.height, backgroundColor: offPos.bgColor })
            .animate({ top: offPos.top, left: (orL) }, 'fast')
            .dequeue()
            .find('img').hide();

    $(oThis)
            .addClass('show')
            .css({ 'z-index': 10, backgroundColor: onPos.bgColor })
            .animate({ top: onPos.top, left: onPos.left, backgroundColor: onPos.bgColor })
            .animate({ width: onPos.width, height: onPos.height }, 'fast', function() { $(oThis).find('p').fadeIn('fast'); $(oThis).find('img').fadeIn(function() { $('.hm:not(.show)').css({ 'z-index': 1, width: offPos.width, height: offPos.height, backgroundColor: offPos.bgColor }) }) })
}