/* 
 ___    __    ____    __    _    _  ____  ____ 
/ __)  /__\  (  _ \  /__\  ( \/\/ )( ___)(  _ \
\__ \ /(__)\  )(_) )/(__)\  )    (  )__)  ) _ <
(___/(__)(__)(____/(__)(__)(__/\__)(____)(____/

All Your Base are Belong to Slideshow
Developed by SADA Systems Inc.
*/

$(document).ready(function (){
	
	jQuery.easing.def = "easeInOutCirc"; // set the easing default

	var hue = ""; // testing only
	var that = ""; 

	var screenX = $(window).width();
	var screenY = $(window).height();
	
	if (screenX < "960"){
		screenX = 960;
	}

	var objectW = screenX; // object width
	var objectH = 410;
	var objectC = $("#cont_inner .eSlide").length; // how many slides

	var oldActive = 0;

	$("#ayb_stopbutton").css("opacity", .1);
	$("#ayb_playbutton").css("opacity", .1);
	
	$("#ayb_nextbutton").css("opacity", 0);
	$("#ayb_backbutton").css("opacity", 0);

	$("#cont_inner").css("width", objectW * objectC);
	$('#slidenav li:first-child').attr({ 'class': 'active navitem'});
	var active = $('.active').attr('id'); // get the slide number
	
	$("#" + "dsli" + $('.active').attr('id') + " h1").css("color", "red");
	$("#" + "dsli" + $('.active').attr('id') + " h1").css("left", -screenX / 2);
	
	// Prepare all elements --------------------------------------------------------------------- /
	$("#cont_inner .eSlide").each(function (i) {
		
		// position and style slides
		$(this).css("display", "block");
		
		$(this).css("position", "absolute");
		$(this).css("left", screenX + objectW);
		$(this).css("z-index", "0");
		
		$(this).css("width", objectW);
		$(this).css("height", objectH);

		// get a random color for each slide
		color = 'rgb(' + (Math.floor(Math.random() * 156)) + ',' + (Math.floor(Math.random() * 156)) + ',' + (Math.floor(Math.random() * 156)) + ')';
		$(this).css("background-color", color); // assign random bg color (testing only)
		$(this).attr('id', 'dsli' + i); // give the slides a unique name for targeting
	});
	
	$("#cont_inner:first-child").css("left", 0); // set the first items position
	$("#dsli" + $('.active').attr('id') + " .slide_box").css("left", 0); // set the first active item

	// Event Handlers --------------------------------------------------------------------- /


	$(".navitem").click(function(){
		clearInterval(play); //Stop the rotation
		oldActive = $(".active").attr("id");  // get the old item
		$('.active').attr({ 'class': 'navitem' });  // set the class of the old
		$(this).attr({ 'class': 'active' });  // set the class of the new
		target = $(this).attr("id"); // get the target
		// do nothing if the current item is clicked
		if (oldActive != target){
			gotoSlide(target); // make the magic happen
		}
	});
	
	// Stop & Play Buttons
	$("#ayb_playbutton").click(function(){
		eSwitch(); //Resume rotation timer
	});
	
	$("#ayb_stopbutton").click(function(){
		clearInterval(play); //Stop the rotation
	});
		
	$("#ayb_playbutton").hover(function() {
		$(this).stop().animate({opacity: 1}, 500);
	}, function() {
		$(this).stop().animate({opacity: .10}, 500);
	});	
	
	$("#ayb_stopbutton").hover(function() {
		$(this).stop().animate({opacity: 1}, 500);
	}, function() {
		$(this).stop().animate({opacity: .10}, 500);
	});

	// Prev & Next Buttons
	$("#ayb_nextbutton").click(function(){
		clearInterval(play); //Stop the rotation
		oldActive = $(".active").attr("id");
		if (oldActive  == (objectC - 1)){
			$('.active').attr({ 'class': 'navitem' }); 
			$('.navitem:first-child').attr({ 'class': 'active' });  
		} else {
			$('.active').next().attr({ 'class': 'active' });  
			$('.active').prev().attr({ 'class': 'navitem' });  
		}
		target = $('.active').attr("id"); // get the target
		gotoSlide(target); // make the magic happen
	});
	
	$("#ayb_backbutton").click(function(){
		clearInterval(play); //Stop the rotation
		oldActive = $(".active").attr("id");  // get the old item
		if (oldActive  == 0){
			$('.active').attr({ 'class': 'navitem' }); 
			$('.navitem:last-child').attr({ 'class': 'active' }); 
		} else {
			$('.active').prev().attr({ 'class': 'active' });
			$('.active').next().attr({ 'class': 'navitem' });
		}
		target = $('.active').attr("id"); // get the target
		gotoSlide(target); // make the magic happen
	});
		
	$("#ayb_nextbutton").hover(function() {
		$(this).stop().animate({opacity: .80}, 500);
	}, function() {
		$(this).stop().animate({opacity: 0}, 500);
	});	
	
	$("#ayb_backbutton").hover(function() {
		$(this).stop().animate({opacity: .80}, 500);
	}, function() {
		$(this).stop().animate({opacity: 0}, 500);
	});	

	$(window).resize(function() {
		$().resetAll();
		/*
		delay(function(){
			eDelay = 0;
			if ("#cont_inner:animated") {
				eDelay = "1000";
			}
			$().delay(eDelay).resetAll();
		}, 500);
		*/
	});

	var trigerDelay = (function(){
	  var timer = 0;
	  return function(callback, ms){
		clearTimeout (timer);
		timer = setTimeout(callback, ms);
	  };
	})();

	// Functions --------------------------------------------------------------------- /

	//Rotation and Timing Event
	eSwitch = function(){
		
		play = setInterval(function(){ //Set timer 
			active = $('.active').attr('id'); // get the slide number
			if (active == objectC - 1) { //If slides reach the end
				oldActive = $(".active").attr("id");  // get the old item
				$('.active').attr({ 'class': 'navitem' });  // set the class of the old
				$('#slidenav li:first').attr({ 'class': 'active' });  // set the class of the new
				active = $('.active').attr('id'); //go back to first
				gotoSlide(active); // make the magic happen
			} else {
				active = $('.active').next().attr('id'); // get the slide number
				oldActive = $(".active").attr("id");  // get the old item
				$('.active').attr({ 'class': 'navitem' });  // set the class of the old
				$('#' + active).attr({ 'class': 'active' });  // set the class of the new
				gotoSlide(active); // make the magic happen
			}
		}, 7000); //Timer speed in milliseconds (10 seconds)
	};

	jQuery.fn.resetAll = function(target) {
		screenX = $(window).width();
		if (screenX < "960"){
			screenX = 960;
		}
		$(".eSlide").css("width", screenX);
		$(".eSlide").css("left", -screenX);
		$("#dsli" + $(".active").attr("id")).css("left", 0);
	};// resetAll

	jQuery.fn.aniTextin = function(target) {
		$("#dsli" + $('.active').attr('id') + " .slide_box").css("left", -(screenX));
		$("#dsli" + $('.active').attr('id') + " .slide_box").delay(380).animate({left: 0}, 1200, "easeInOutExpo");
	};// aniTextin
	
	jQuery.fn.aniTextOut = function(target) {
		textAnimTarget = ($('.active').attr('id')); // set up the target
		if (oldActive < textAnimTarget) {
			$("#dsli" + (oldActive) + " .slide_box").animate({left: (screenX)}, 1200, "easeInBack", function() {
				$("#dsli" + (oldActive) + " .slide_box").css("left", (screenX));
			});
		} else if (oldActive > textAnimTarget) {
			$("#dsli" + oldActive + " .slide_box").animate({left: -(screenX)}, 1200, "easeInBack", function() {
				$("#dsli" + oldActive + " .slide_box").css("left", -(screenX));
			});
		} else {
			// do nothing - this will fire on the last slide
		}
	};// aniTextOut

	gotoSlide = function(target) {

		$().aniTextOut();
		$().aniTextin();
		
		if (oldActive < target) {
			$("#dsli" + target).css("left", screenX);
			$("#dsli" + oldActive).animate({left: -screenX}, 2200, function(){
				$("#dsli" + oldActive).css("left", -screenX);
			});
			$("#dsli" + target).animate({left: 0}, 1800);
		} else if (oldActive > target) {
			$("#dsli" + target).css("left", -screenX);
			$("#dsli" + oldActive).animate({left: screenX}, 2200, function(){
				$("#dsli" + oldActive).css("left", screenX);
			});
			$("#dsli" + target).animate({left: 0}, 1800);
		} else {
			// triggers if first slide
			//alert(oldActive + "       " + target);
			$("#dsli" + target).delay(50).animate({left: 0}, 1000);
		}
	};// gotoSlide
	
	eSwitch();
	gotoSlide(active);
	//alert(active);
	
	// For the homepage
	$(".primary_services_flap").hover(function() {
		$(this).stop().animate({top: -10}, 800, "easeOutElastic");
	}, function() {
		$(this).stop().animate({top: 5}, 800, "easeOutElastic");
	});	

}); // onload
