/*
    Document   : frontend
    Created on : Oct 13, 2009, 1:44:53 PM
    Author     : daniel & mike
    Description:
        Frontent JS implementations
*/

// DomReady
$(function(){
    //alert("ready");
    //$(".hideOnReady").hide();    
    if(!($(".noFade").size() >= 1)) $("#main>div.inside").fadeTo(1, 0.001);

    if($(".box_987_special").length > 0) {
        setupSliders();
    }
});

$(window).load(function(){
    //alert("load");
    //$(".fadeInOnLoad").show();
    //$.timer(10000, function(){$("#home_content").fadeIn("slow")});
    if(!($(".noFade").size() >= 1))  $.timer(2500, function(){$("#main>div.inside").fadeTo("slow", 1)});
    if($(".fadeLayer").size() >= 1)$("#layer").css('display', 'block').fadeTo("slow", 1)
});

var setupSliders = function() {
    //starting value of 140 so the last messages is now overlayed by the fader
    var maxWidth = 140;
    var amountOfMessages = $(".scrolling_container .block").length;
    $(".scrolling_container .block").each(function() {
        maxWidth += $(this).innerWidth();
    });

    //setting maxWidth
    $(".scrolling_container").css("width", maxWidth + "px");
    $(".box_987_special .inside").css("overflow", "hidden");

    var maxSlider = parseInt($(".box_987_special .scrolling_container").css("width")) - parseInt($(".box_987_special").css("width"));
    var calcPadding = maxSlider * 0.054;
    $(".scrolling_container").css("padding-left", calcPadding + "px");

    //adding some elements to the dom
    $(".box_987_special").append($("<div></div>").attr("id", "scroller_container"));
    $("#scroller_container").append($("<div></div>").attr("id", "scroller").slider({
        step: 1,
        queue: false,
        min: 0,
        max: maxSlider,
        animate: false,
        slide: function(event, ui) {
            return sliderAction(event, ui, false);
        },
        change: function(event, ui) {
            return sliderAction(event, ui, true);
        }
    }));
    //add the faders
    $(".box_987_special").append($("<div></div>").attr("id", "fader_left").addClass("fader"));
    $(".box_987_special").append($("<div></div>").attr("id", "fader_right").addClass("fader"));
    
    //append both buttons with a slide action
    $("#scroller_container").append($("<a></a>").attr("id", "button_left").addClass("buttons").click(function(e) {
        e.preventDefault();
        $("#scroller").slider("value", $("#scroller").slider("value") - (maxSlider / amountOfMessages));
    }));
    $("#scroller_container").append($("<a></a>").attr("id", "button_right").addClass("buttons").click(function(e) {
        e.preventDefault();
        $("#scroller").slider("value", $("#scroller").slider("value") + (maxSlider / amountOfMessages));
    }));
   $("#scroller").slider("value", parseInt($("#scroller").slider('option', 'max')) * 0.054);
};

var sliderAction = function(event, ui, animation) {
    //prevent the slider from going through the button (grapically) on the right side
    if (ui.value >= parseInt($("#scroller").slider('option', 'max')) * 0.948) {
        $("#scroller").slider("value", parseInt($("#scroller").slider('option', 'max')) * 0.946);
        return false;
    }
    //prevent the slider from going through the button (grapically) on the left side
    if (ui.value <= parseInt($("#scroller").slider('option', 'max')) * 0.052) {
        $("#scroller").slider("value", parseInt($("#scroller").slider('option', 'max')) * 0.054);
        return false;
    }
    //using stop() before animate() removes the (sometimes) nerve whacking "animation queue" effect you see with jquery :3
    if(animation) {
        $(".box_987_special .scrolling_container").stop().animate({
            marginLeft: -ui.value + "px"
        }, "fast", "linear");
    } else {
        $(".box_987_special .scrolling_container").css({
            marginLeft: -ui.value + "px"
        });
    }
};