$(document).ready(function() {

//$("#scrollableArea a span").append('<img src="/images/homepage/down_arrow.png" alt="" style="margin: 3px 0 0 5px; float: right;" />');


// duplicate content 2 times
$('#scrollableArea a').appendTo('.scrollableArea');


$(".hide").animate({opacity: 0},1);

// start scroll
$("div#makeMeScrollable").smoothDivScroll({
    autoScroll: "onstart",
    autoScrollDirection: "endlessloopright",
    autoScrollStep: 1,
    autoScrollInterval: 15,
    visibleHotSpots: "always"
});

$('#scrollableArea span').each(function(index, dom) {

    var margin = ($(dom).width()) / 1.25;
    //alert(margin);
    $(dom).css("margin-left", "-" + margin + "px");

});


// scroll again after using arrows
$('.hotspot').live('mouseleave', function(){
    $("div#makeMeScrollable").smoothDivScroll("startAutoScroll");
});


// hover actions
$("div#makeMeScrollable #scrollableArea a").live({
    mouseenter: function() {

        // Case Studies
        if ($(this).attr('class') == 'cs') {
            $(this).find(".anim").stop(true,true).animate({
                opacity : 1
            }, 500);
        }

        // TV
        if ($(this).attr('class') == 'tv') {
            $(this).find("#replacer").attr("src", "/images/homepage/tv-anim2.gif");
        }

        // Contact
        if ($(this).attr('class') == 'contact') {
            $(this).find(".anim").animate({opacity : 0.5}, 500);
        }

        // Clients
        if ($(this).attr('class') == 'clients') {
            $(this).children(".c_main").stop(true).animate({bottom : 45}, 500);
        }
        
        // About
        if ($(this).attr('class') == 'about') {
            if (!$.browser.msie) {
                $(this).children(".c_main").stop(true).animate({opacity : 0.4}, 500);
            }
        }


        $(this).find('span').addClass('hover');


    },
    mouseleave: function() {

        // Case studies
        if ($(this).attr('class') == 'cs') {
            $(this).find(".anim").stop(true,true).animate({
                'opacity' : 0
            }, 500);
        }

        // TV
        if ($(this).attr('class') == 'tv') {
            $(this).find("#replacer").attr("src", "/images/homepage/tv-anim.jpg");
        }

        // Contact
        if ($(this).attr('class') == 'contact') {
            $(this).find(".anim").animate({opacity : 1}, 500);
        }

        // Clients
        if ($(this).attr('class') == 'clients') {
            $(this).children(".c_main").stop(true).animate({bottom : 0}, 500);
        }
        
        // About
        if ($(this).attr('class') == 'about') {
            if (!$.browser.msie) {
                $(this).children(".c_main").stop(true).animate({opacity : 1}, 500);
            }
        }


        $(this).find('span').removeClass('hover');

    }

// TODO:
// Add touchstart & touchend events

});

});