﻿$j(document).ready(function () {
    //alert('ready');

    //rotation speed and timer   
    var speed = 5000;
    //  var run = setInterval('rotate()', speed);

    //grab the width and calculate left value
    var item_width = $j("#frameLayer li").outerWidth(true);

    //  var left_value = item_width * (-1);
    var left_value = 0;

    //move the last item before first item, just in case user click prev button
 //   $j('#frameLayer li:first').before($j('#frameLayer li:last'));

    //set the default item to the correct position
    //    $('#frameLayer ul').css({ 'left': left_value });

    //if user clicked on prev button
    $j('#prev').click(function() {

        //get the right position
        var left_indent = parseInt($j('#frameLayer ul').css('left')) + item_width;

        //slide the item
        $j('#frameLayer ul').animate({ 'left': left_indent }, 200, function() {

            //move the last item and put it as first item
        $j('#frameLayer li:first').before($j('#frameLayer li:last'));

            //set the default item to correct position
        $j('#frameLayer ul').css({ 'left': left_value });

        });

        //cancel the link behavior               
        return false;

    });


    //if user clicked on next button
    $j('#next').click(function() {

        //get the right position
        var left_indent = parseInt($j('#frameLayer ul').css('left')) - item_width;


        //slide the item
        $j('#frameLayer ul').animate({ 'left': left_indent }, 200, function() {

            //move the first item and put it as last item
        $j('#frameLayer li:last').after($j('#frameLayer li:first'));

            //set the default item to correct position
            $j('#frameLayer ul').css({ 'left': left_value });

        });

        //cancel the link behavior   
        return false;

    });

    //if mouse hover, pause the auto rotation, otherwise rotate it
    /* $('#frameLayer').hover(

    function () {
    clearInterval(run);
    },
    function () {
    run = setInterval('rotate()', speed);
    }
    );*/

});   
  
//a simple function to click next link   
//a timer will call this function, and the rotation will begin :)     
function rotate() {
    $j('#next').click();   
}  