// ------------------------------------------------------------------------//
// Homepage functions
// ------------------------------------------------------------------------//

// start LEDE Rotator JS

var ledeData;
var totalItems;
var pauseRotator=false;
var currPos;
var buttonsActive = true;

function initLede() {
       $.ajax({url:"/wp-content/themes/Slope/js/temp", cache:false, dataType: "json",
        success: function(data){
          $.each(data.items, function(i,item){
                 ledeData = data;
                 var headline = this.headline;
                 var imagePath = this.image;
                 var link = this.link;
         var rubric = this.rubric;
                 headline = "<h3><span><a href=\'" + link + "\'>" + rubric + "</a></span><br><a class=\'headline\' href=\'"+link+"\'>"+headline+"</a></h3>";
                 imagePath = "<a class=\'image\' href=\'"+link+"\'><img src=\'"+imagePath+"\'/></a>";
                 var article = "<article onclick=\'window.location.href=\"" + link + "\"\' pos=\'" + i + "\'>" + imagePath + headline + "</article>";
                 if($.browser.msie) article = $(innerShiv(article, false));
                 $("#content-head #article-container").append(article);

          });
                $("#content-head article:first").addClass("active");
                totalItems = data.items.length;
                        if (totalItems > 1) {
                                setButtons();
                                $("#content-head").hover(function() {
                                        pauseRotator=true;
                                        clearTimeout(startRotate);
                                 }, function() {
                                        pauseRotator=false;
                                        rotateLede();
                                });
                                rotateLede();
                        }
        }});
}

function getLedeItem(pos) {
        // deactivates buttons during animation
        buttonsActive = false;
        if (!pos) {
                pos = $("#content-head article[class=active]").attr("pos");
                pos = (parseInt(pos) + 1);
                if (pos == totalItems) { pos = 0; }
        }
        if($.browser.msie && $.browser.version <= 7) {
                $("#content-head article[class=active]").css("z-index", "200");
                activeZindex = 200;
                $("#content-head article[pos=" + pos + "]").css("z-index", activeZindex + 1);
                $("#content-head article[class=active] h3").hide();
        } else {
                $("#content-head article[class=active] h3").hide("slide", { direction: "left", easing: "easeOutQuad"}, 500);
        }
        $("#content-head article[class=active] img").hide("slide", { direction: "right", easing:"easeOutQuad" }, 900, function() { $(this).parent().parent().removeClass("active"); });

        $("#rotator-controls li[class=active]").removeClass("active");
        $("#content-head article[pos=" + pos + "] img").show("slide", { easing:"easeOutQuad" }, 900);
        $("#content-head article[pos=" + pos + "] h3").show("slide" , { direction: "right", easing: "easeOutQuad" }, 900, function() { $(this).parent().addClass("active"); buttonsActive = true;});
        $("#rotator-controls li#ctrl" + pos).addClass("active");
        rotateLede();
}

var ulWidth = 0;

function setButtons() {
                // set up button dots
                $.each(ledeData.items, function(i,item){
                        var buttonPos = (i);
                        var button = "<li id=\'ctrl" + buttonPos +"\'>"+ buttonPos +"</li>";
                        $("#rotator-controls ul").append(button);
                });
        var buttonCount = $("#rotator-controls ul li").size();
        var rotatorWidth = buttonCount * 18;
                rotatorLeft = ((480-rotatorWidth)/2);
        rotatorLeft = rotatorLeft + "px";
        $("#rotator-controls").attr("style", "padding-left:" + rotatorLeft);
        $("#rotator-controls").css("padding-left", rotatorLeft);
                $("#rotator-controls li:first").addClass("active");

                $("#rotator-controls li:not(.active)").live("click", function() {
                                var sequence = $(this).attr("id");
                                sequence = sequence.substring(4);
                                if (buttonsActive == true) {
                                        getLedeItem(sequence);
                                } else {
                                        return false;
                                }
                });

}

function rotateLede() {
        if (pauseRotator == false) {
                startRotate = setTimeout("getLedeItem();", 5500);
        } else {
                return;
        }
}
// end LEDE Rotator JS