// Global variable to store the ID for the setInterval call used for
// the automated transitions 
var refreshId;

// Global variables used to set times for transitions etc.
var fadeOutTime = 500;
var fadeInTime = 500;
var imageTransitionTime = 1000;
var pauseTime = 3000;
var totalSlideTime = fadeOutTime + fadeInTime + imageTransitionTime + pauseTime;

// This function fades out the description para and indicator image and
// returns to the callback function if it exists.
function fadeOutAssets($description, $indicator, f) {
    $description.fadeOut(fadeOutTime);
    $indicator.fadeOut(fadeOutTime, function() {
        if (typeof f == "function") f();
    });
}

// This function fades in the description para image.
function fadeInAssets($description) {
    $description.fadeIn(fadeInTime);
}

// This function fades out the current slide image (if specified), fades in the
// next slide image and indicator image and returns to the callback function if
// it exists.
function transitionImages($oldImage, $newImage, $indicator, f) {
    $indicator.fadeIn(imageTransitionTime);
    if ($oldImage != null) {
        $oldImage.fadeOut(imageTransitionTime);
    }
    $newImage.fadeIn(imageTransitionTime, function() {
        if (typeof f == "function") f();
    });
}

// This method is used to rotate between slides.
function rotateSlides() {
    $tab = $('#main.home ul#promotions li.current');
    $slide = $('#main.home ul#slides li.current');
    $nextTab = $tab.next();
    $nextSlide = $slide.next();
    
    // If this is the last slide reset to the first slide again.
    if ($nextTab.length < 1) {
        $nextTab = $('#main.home ul#promotions li:first');
        $nextSlide = $('#main.home ul#slides li:first');
    }
    
    transitionSlides($tab, $nextTab, $slide, $nextSlide);
}

// This function transitions to a specified slide.
function moveToSlide($nextTab, $nextSlideId) {
    // Stop the automatic rotation
    clearInterval(refreshId);
    
    $tab = $('#main.home ul#promotions li.current');
    $slide = $('#main.home ul#slides li.current');
    $nextSlide = $('#main.home ul#slides li#' + $nextSlideId);
    
    transitionSlides($tab, $nextTab, $slide, $nextSlide);
}

// This function contains all actions to transition to the next slide.
function transitionSlides($tab, $nextTab, $slide, $nextSlide) {
    // Fade out, transition images and fade in
    fadeOutAssets($slide.children('p'),
                  $tab.children('.indicator'),
                  function() {
                        transitionImages($slide.find('img'),
                        $nextSlide.find('img'),
                        $nextTab.children('.indicator'),
                        function() {
                            fadeInAssets($nextSlide.children('p'));
                        });
                  });
    
    // Set current tab and slide
    $tab.removeClass('current');
    $nextTab.addClass('current');
    
    $slide.removeClass('current');
    $nextSlide.addClass('current');
}

// This function adds click events to each tab link to jump to a specific slide.
function addClickEvents() {
    $('#main.home ul#promotions li a').click(function() {
        moveToSlide($(this).parent(), $(this).attr('href').replace('#',''));
        
        // Override default action
        return false;
    });
}

// This function initialises the heroslot showing and hiding elements as
// required.
function initialise(f) {
    $('#main.home ul#slides li').show();
    $('#main.home ul#slides li p').hide();
    $('#main.home ul#slides li div.logo img').hide();
    $('#main.home ul#slides li div.image img').hide();
    $('#main.home ul#promotions').show('normal', function() {
        if (typeof f == "function") f();
    });
}

// When the document is ready it will initialise the heroslot, fade in
// the initial slide and then start the automatic transitions.
$(document).ready( function() {
    initialise(function() {
        transitionImages(null,
                         $('#main.home ul#slides li.current img'),
                         $('#main.home ul#promotions li.current .indicator'),
                         function() {
                            fadeInAssets($('#main.home ul#slides li.first p'));
                         });
    });
    
    addClickEvents();
    
    // Start slide automatic rotation
    refreshId = setInterval(rotateSlides, totalSlideTime);
});