//  JavaScript Document
//  Written by Codify Design Studio

// Variables for Marquee AutoPlay
var currentPanel = 1;
var totalPanels = 0;
var autoPlay = true;
var timePassed = 0;
var timeToChange = 6;

$(document).ready(function() {
	
	// Activate dropdown menus
	$('#spi_menu > ul').dropmenu({
		effect	: 'slide',
		speed	: 215,
		timeout : 0,
		nbsp	: false
	});
	$('#spi_menu').removeClass('hidden');
	
	// Marquee
	setInterval(autoAdvance, 1000);
	
	$('.spi_marquee_container').hover(
		function(){
			window.autoPlay = false;
			$(this).removeClass('autoplay');
		},
		function(){
			window.autoPlay = true; window.timePassed = 0;
			$(this).addClass('autoplay');
		}
	);
	
	// Marquee - Generate Navigation links
	$('.spi_marquee_panels .spi_marquee_panel').each(function(index){
		$('.spi_marquee_nav').append('<a class="spi_marquee_nav_item"></a>');
		totalPanels = index + 1;
	});
	
	// Marquee - Generate Photo Lineup
	$('img.spi_marquee_panel_photo').each(function(index){
		var photoWidth = 980;
		var photoPosition = index * 980;
		$('.spi_marquee_photos').append('<img class="spi_marquee_photo" style="left: '+photoPosition+'px;" src="'+$(this).attr('src')+'" alt="'+$(this).attr('alt')+'" width="980" height="350" />');
		$('.spi_marquee_photos').css('width', photoPosition+photoWidth);
	});

	// Marquee - Set up Navigation Links
	$('.spi_marquee_nav a.spi_marquee_nav_item').click(function(){
		
		// Set the navigation state
		$('.spi_marquee_nav a.spi_marquee_nav_item').removeClass('selected');
		$(this).addClass('selected');
		
		var navClicked = $(this).index();
		var marqueeWidth = 980;
		var distanceToMove = marqueeWidth*(-1);
		var newPhotoPosition = navClicked*distanceToMove + 'px';
		var newCaption = $('.spi_marquee_panel_caption').get(navClicked);
		
		window.currentPanel = navClicked + 1;
		
		// Animate the photos and caption
		$('.spi_marquee_photos').animate({left: newPhotoPosition}, 1000);
		$('.spi_marquee_caption').animate({top: '340px'}, 500, function(){
			var newHTML = $(newCaption).html();
			$('.spi_marquee_caption_content').html(newHTML);
			setCaption();
		});
	});
	
	// Marquee - Preload all images, then initialize marquee
	$('.spi_marquee_panels img').imgpreload(function(){
		initializeMarquee();
	});

});

function initializeMarquee(){
	$('.spi_marquee_caption_content').html(
		$('.spi_marquee_panels .spi_marquee_panel:first .spi_marquee_panel_caption').html()
	);
	$('.spi_marquee_nav a.spi_marquee_nav_item:first').addClass('selected');
	$('.spi_marquee_photos').fadeIn(1500);
	setCaption();
}

function setCaption(){
	var captionHeight = $('.spi_marquee_caption').height();
	var marqueeHeight = $('.spi_marquee_container').height();
	var newCaptionTop = marqueeHeight - captionHeight - 25;
	$('.spi_marquee_caption').delay(100).animate({top: newCaptionTop}, 500);
}

function autoAdvance(){
	if (window.timePassed == window.timeToChange){
		window.timePassed = 0;
		if(window.currentPanel == window.totalPanels){
			currentPanel = 0;
		}
		if (autoPlay == true){
			$('.spi_marquee_nav a.spi_marquee_nav_item:nth-child('+(window.currentPanel+1)+')').trigger('click');
		}
	}else{
		window.timePassed += 1;
	}

}

// Hide address bar on mobile
window.addEventListener("load",function(){setTimeout(function(){window.scrollTo(0,1);},0);});