﻿$(document).ready(function () {
           var autoPlayTime = 7000;
           autoPlayTimer = setInterval(autoPlay, autoPlayTime);
           function autoPlay() {
               Slidebox('next');
           }
           $('#slidebox .next').click(function () {
               Slidebox('next', 'stop');
           });
           $('#slidebox .previous').click(function () {
               Slidebox('previous', 'stop');
           });
           var yPosition = ($('#slidebox').height() - $('#slidebox .next').height()) / 2;
           $('#slidebox .next').css('top', yPosition);
           $('#slidebox .previous').css('top', yPosition);
           $('#slidebox .thumbs a:first-child').removeClass('thumb').addClass('selected_thumb');
           $("#slidebox .content").each(function (i) {
               slideboxTotalContent = i * $('#slidebox').width();
               $('#slidebox .container').css("width", slideboxTotalContent + $('#slidebox').width());
           });
       });

       function Slidebox(slideTo, autoPlay) {
           var animSpeed = 1000; //animation speed
           var easeType = 'easeInOutExpo'; //easing type
           var sliderWidth = $('#slidebox').width();
           var leftPosition = $('#slidebox .container').css("left").replace("px", "");
           if (!$("#slidebox .container").is(":animated")) {
               if (slideTo == 'next') { //next
                   if (autoPlay == 'stop') {
                       clearInterval(autoPlayTimer);
                   }
                   if (leftPosition == -slideboxTotalContent) {
                       $('#slidebox .container').animate({ left: 0 }, animSpeed, easeType); //reset
                       $('#slidebox .thumbs a:first-child').removeClass('thumb').addClass('selected_thumb');
                       $('#slidebox .thumbs a:last-child').removeClass('selected_thumb').addClass('thumb');
                   } else {
                       $('#slidebox .container').animate({ left: '-=' + sliderWidth }, animSpeed, easeType); //next
                       $('#slidebox .thumbs .selected_thumb').next().removeClass('thumb').addClass('selected_thumb');
                       $('#slidebox .thumbs .selected_thumb').prev().removeClass('selected_thumb').addClass('thumb');
                   }
               } else if (slideTo == 'previous') { //previous
                   if (autoPlay == 'stop') {
                       clearInterval(autoPlayTimer);
                   }
                   if (leftPosition == '0') {
                       $('#slidebox .container').animate({ left: '-' + slideboxTotalContent }, animSpeed, easeType); //reset
                       $('#slidebox .thumbs a:last-child').removeClass('thumb').addClass('selected_thumb');
                       $('#slidebox .thumbs a:first-child').removeClass('selected_thumb').addClass('thumb');
                   } else {
                       $('#slidebox .container').animate({ left: '+=' + sliderWidth }, animSpeed, easeType); //previous
                       $('#slidebox .thumbs .selected_thumb').prev().removeClass('thumb').addClass('selected_thumb');
                       $('#slidebox .thumbs .selected_thumb').next().removeClass('selected_thumb').addClass('thumb');
                   }
               } else {
                   var slide2 = (slideTo - 1) * sliderWidth;
                   if (leftPosition != -slide2) {
                       clearInterval(autoPlayTimer);
                       $('#slidebox .container').animate({ left: -slide2 }, animSpeed, easeType); //go to number
                       $('#slidebox .thumbs .selected_thumb').removeClass('selected_thumb').addClass('thumb');
                       var selThumb = $('#slidebox .thumbs a').eq((slideTo - 1));
                       selThumb.removeClass('thumb').addClass('selected_thumb');
                   }
               }
           }
       }

