$(document).ready(function () {

    //************************************************ CAROUSEL *********************************************

    //rotation speed and timer
    var speed = 15000;
    var speedSm = 10000;
    var run = setInterval('rotate()', speed);
    var runsm = setInterval('rotatesm()', speedSm);

    //grab the width and calculate left value
    var item_width = $('#slides li').outerWidth();
    var left_value = item_width * (-1);

    //grab the width and calculate left value
    var item_widthSm = $('#slidessm li').outerWidth();
    var left_valueSm = item_widthSm * (-1);

    //move the last item before first item, just in case user click prev button
    $('#slides li:first').before($('#slides li:last'));

    //move the last item before first item, just in case user click prev button
    $('#slidessm li:first').before($('#slidessm li:last'));

    //set the default item to the correct position 
    $('#slides ul').css({ 'left': left_value });

    //set the default item to the correct position 
    $('#slidessm ul').css({ 'left': left_valueSm });

    //if user clicked on prev button
    $('#prev').click(function () {

        //get the right position            
        var left_indent = parseInt($('#slides ul').css('left')) + item_width;

        //slide the item            
        $('#slides ul:not(:animated)').animate({ 'left': left_indent }, 200, function () {

            //move the last item and put it as first item            	
            $('#slides li:first').before($('#slides li:last'));

            //set the default item to correct position
            $('#slides ul').css({ 'left': left_value });

        });

        //cancel the link behavior            
        return false;

    });


    //if user clicked on next button
    $('#next').click(function () {

        //get the right position
        var left_indent = parseInt($('#slides ul').css('left')) - item_width;

        //slide the item
        $('#slides ul:not(:animated)').animate({ 'left': left_indent }, 200, function () {

            //move the first item and put it as last item
            $('#slides li:last').after($('#slides li:first'));

            //set the default item to correct position
            $('#slides ul').css({ 'left': left_value });

        });

        //cancel the link behavior
        return false;

    });

    //if user clicked on prev button
    $('#prevsm').click(function () {

        //get the right position            
        var left_indentSm = parseInt($('#slidessm ul').css('left')) + item_widthSm;

        //slide the item            
        $('#slidessm ul:not(:animated)').animate({ 'left': left_indentSm }, 200, function () {

            //move the last item and put it as first item            	
            $('#slidessm li:first').before($('#slidessm li:last'));

            //set the default item to correct position
            $('#slidessm ul').css({ 'left': left_valueSm });

        });

        //cancel the link behavior            
        return false;

    });


    //if user clicked on next button
    $('#nextsm').click(function () {

        //get the right position
        var left_indentSm = parseInt($('#slidessm ul').css('left')) - item_widthSm;

        //slide the item
        $('#slidessm ul:not(:animated)').animate({ 'left': left_indentSm }, 200, function () {

            //move the first item and put it as last item
            $('#slidessm li:last').after($('#slidessm li:first'));

            //set the default item to correct position
            $('#slidessm ul').css({ 'left': left_valueSm });

        });

        //cancel the link behavior
        return false;

    });

    //if mouse hover, pause the auto rotation, otherwise rotate it
    $('#slides').hover(

		function () {
		    clearInterval(run);
		},
		function () {
		    run = setInterval('rotate()', speed);
		}
	);

	//if mouse hover, pause the auto rotation, otherwise rotate it
	$('#slidessm').hover(

	    function () {
	        clearInterval(runsm);
	    },
	    function () {
	        runsm = setInterval('rotateSm()', speed);
		}
    );
});

//a simple function to click next link
//a timer will call this function, and the rotation will begin :)  
function rotate() {
    $('#next').click();
}


//a simple function to click next link
//a timer will call this function, and the rotation will begin :)  
function rotateSm() {
    $('#nextsm').click();
}