/* Main javascript file for abacusaccounting.co.uk
 * @author Simon Pollard for Deckchair UK Ltd
 * @version 1.1
 * @date August 2010
 */
jQuery.easing.def = "easeInOutCubic";
$(function() {

    // Remove naviagtion elements
    $(".portfolio .portfolio_nav").remove();

    // Get all the divs within portfolio
    kids = $(".portfolio").children();
    // Now createa an array with their html data
    websites = new Array();
    kids.each(function(){
        websites.push($(this).html());
    });

    // Create a second array to store the names
    names = new Array();
    kids.each(function(){
        names.push($(this).attr("id"));
    });

    // Now clear out the portfolio
    $(".portfolio div").remove();

    // And add back in the first project
    $(".portfolio").html("<div id=\""+names[0]+"\">"+websites[0]+"</div>");
    
    $(".portfolio div").css("width","850px");

    // Add the navigation back
    $(".portfolio").prepend("<div class=\"portfolio_nav_js\"><a class=\"prev_button\">prev &uarr;</a><a class=\"next_button\">next &darr;</a></div>");

    $(".prev_button").mousedown(function() {
       prevImage();
    });

    $(".next_button").mousedown(function() {
       nextImage();
    });

    // Get the total number of images (minus 1 as the array starts at 0)
   websites_total = (websites.length-1);

    current = 0;

});

/*
 * Shows the next item in portfolio
 */
function nextImage() {

    // We need to remove the div after animation, at which point current value has changed, so use another variable
    removediv = current;

    // Now set up what the next site will be
    // If we are at the end, then go back to the start
    if (current == websites_total){
        next_site = 0;
        current = 0;
    } else {
        next_site = current+1;
        current = current+1;
    }

   animate("next");

}

/*
 * Shows the next item in portfolio
 */
function prevImage() {

    // We need to remove the div after animation, at which point current value has changed, so use another variable
    removediv = current;

    // Now set up what the next site will be
    // If we are at the end, then go back to the start
    if (current == 0){
        next_site = websites_total;
        current = websites_total;
    } else {
        next_site = current-1;
        current = current-1;
    }

    animate("prev");
   
}

/*
 * Animate to the next or previous prtoject
 */
function animate($type) {
    // Remove the click events from the prev and next buttons
   $(".prev_button").unbind();
   $(".next_button").unbind();

   // If viewing next image, simply add it to the parent div
   if ($type=="next") {
        $(".portfolio").append("<div id=\""+names[next_site]+"\">"+websites[next_site]+"</div>");
   } else {
       // Otherwise we need to add it before the current project
        $(".portfolio").prepend("<div id=\""+names[next_site]+"\">"+websites[next_site]+"</div>");
        // Make it invisible (it will show on slideDown)
        $(".portfolio div#"+names[next_site]).css("display","none");
        // And now move the navigation back to the top
        $(".portfolio").prepend($(".portfolio_nav_js"));
   }
   
   // Make sure it is the right size
   $(".portfolio div#"+names[next_site]).css("width","850px");

   // For next projects
   if ($type=="next") {
       // Slide up the current one, then remove it
       $("#"+names[removediv]).slideUp(function(){
                $("#"+names[removediv]).remove();
                add_button_function();
            });
   } else {
       // Slide down the next one, then remove the previous project
       $("#"+names[next_site]).slideDown(function(){
                $("#"+names[removediv]).remove();
                add_button_function();
            });
   }
}

/*
 * Add functionality to previous and next buttons
 */
function add_button_function() {
    $(".prev_button").mousedown(function() {
       prevImage();
    });

    $(".next_button").mousedown(function() {
       nextImage();
    });
}
