// JavaScript Document
var lastMenu = 0;
var clickedMenu = 0;
var lastImage = 0;
var clickedImage = 0;
var clickedBagNum = 0;
var clickedBag;
var animTime = 300;
var fromCol = false;

$(document).ready(function() {
	
	//TURN OFF LOADER
	$('#loader').hide();
	
	//Extend Nav
	newNHeight = $(document).height();
	$('#leftSide').css({ height: newNHeight });
						   
						   
	//ORIGINAL X
	leftSideX = $('#leftSide').css('left').replace('px', '');;
	navVertLineX = $('#navVertLine').css('left').replace('px', '');;
	itemNavX = $('#itemNav').css('left').replace('px', '');
	
	$('#about').click(function() {
		$('#aboutClose').show();
		$('#leftSide').animate({ left: leftSideX-300+'px' },animTime);	
		$('#navVertLine').animate({ left: navVertLineX-300+'px' },animTime);
		$('#itemNav').animate({ left: itemNavX-300+'px'  },animTime);
		$('#aboutContent').fadeIn(animTime);
		
		
		//FADE OUT ALL OTHER CONTENT
		$('#overviewDesc').hide();
		$('#overviewContent').hide();
		$('#productPanel').hide();
		$('#rightSide').hide();
		$('#bgImage').hide();
	});
	
	$('#aboutClose').click(function() {
		$('#aboutClose').fadeOut(animTime);
		$('#aboutContent').hide();
		$('#leftSide').animate({ left: leftSideX+'px' },animTime);	
		$('#navVertLine').animate({ left: navVertLineX+'px' },animTime);
		$('#itemNav').animate({ left: itemNavX+'px'  },animTime);
		
		
		//FADE OUT ALL OTHER CONTENT
		$('#overviewContent').fadeIn(animTime);
		$('#productPanel').fadeIn(animTime);
		$('#rightSide').fadeIn(animTime);
		$('#bgImage').fadeIn(300);
	});
	
	
	//ABOUT INSIDE MENU
	$('#aboutHead div:first').show();
	$('#aboutDesc div:first').show();
	
	$('#about').hover(function() {
		$(this).children('img').attr('src', 'images/nav/about_on.png');						  
	}, function() {
		$(this).children('img').attr('src', 'images/nav/about_off.png');
	});
	
	$('div.aboutMenu').click(function() {
		$('div.aboutMenu').each(function(intIndex){
			$(this).css({ color: '#999' });
		});
		
		$(this).css({ color: '#333' });
		
		var aboutID = $('#aboutMenu div').index($(this));
		//HIDE OLD 
		$('div.aboutMenu').each(function(intIndex){
			$('#aboutHead div:eq('+intIndex+')').hide();
			$('#aboutDesc div:eq('+intIndex+')').hide();
		});
		
		$('#aboutHead div:eq('+aboutID+')').fadeIn(300);
		$('#aboutDesc div:eq('+aboutID+')').fadeIn(300);
		
	});
						   
	//STYLE NAVIGATION
	
	//BAG MENU HEIGHT
	bigHeight = 500;
	$('div.collection').each(function(intIndex){
		theHeight = $('div.collection:eq('+intIndex+')').css('height').replace('px', '');
		if (Number(theHeight) > bigHeight) {
			bigHeight = Number(theHeight);
		}
	});
	
	$('#itemNav').css({ height: bigHeight+'px' });
	
	//HIDE ALL COLLECTIONS
	$('div.collection').css({ left: '100px' });
	
	$('div.item').hover(function() {
		//GET INDEX
		var rollIdx = $('div.collection:eq('+clickedMenu+') div').index($(this));
		menuPos = $('#itemNav').css('left');
		
		$(this).css({ backgroundImage: 'url(images/bag_on.png)'  });
		//SHOW ROLL
		overviewOn = $('#overview').css('display');
		if (overviewOn == "block" && menuPos == '100px') {
			$('.rollItem:eq('+rollIdx+')').show();
			//$('#rollOvers').fadeIn(animTime);
			$('#rollOvers').show();
			$('#overview').hide();
			$('#bgImage').hide();
		}
	},function() {
		thisStyle = $(this).attr('id').replace("style_", "");
		if (clickedBag != thisStyle) {
			$(this).css({ backgroundImage: 'url(images/bag_off.png)' });
		}
		
		menuPos = $('#itemNav').css('left');
		
		//HIDE ROLL
		overviewOn = $('#overview').css('display');
		if (overviewOn == "none" && menuPos == '100px') {
			$('.rollItem').hide();
			$('#rollOvers').hide();
			$('#overview').show();
			if ($('#overviewDesc').length) {
				if ($('#overviewDesc').css('display') == 'none') {
					$('#bgImage').show();
				}
			}
		}
		if ($.browser.msie && $.browser.version.substr(0,1)<7) {
			pngfix();
		}
	});
	
	$('div.itemLast').hover(function() {
		//GET INDEX
		var rollIdx = $('div.collection:eq('+clickedMenu+') div').index($(this));
		menuPos = $('#itemNav').css('left');

		$(this).css({ backgroundImage: 'url(images/bag_on.png)'  });
		
		//SHOW ROLL
		overviewOn = $('#overview').css('display');
		if (overviewOn == "block" && menuPos == '100px') {
			$('.rollItem:eq('+rollIdx+')').show();
			//$('#rollOvers').fadeIn(animTime);
			$('#rollOvers').show();
			$('#overview').hide();
			$('#bgImage').hide();
		}
	},function() {
		thisStyle = $(this).attr('id').replace("style_", "");
		if (clickedBag != thisStyle) {
			$(this).css({ backgroundImage: 'none' });
		}
		
		menuPos = $('#itemNav').css('left');
		
		//HIDE ROLL
		overviewOn = $('#overview').css('display');
		if (overviewOn == "none"  && menuPos == '100px') {
			$('.rollItem').hide();
			$('#rollOvers').hide();
			$('#overview').show();
			if ($('#overviewDesc').length) {
				if ($('#overviewDesc').css('display') == 'none') {
					$('#bgImage').show();
				}
			}
		}
		if ($.browser.msie && $.browser.version.substr(0,1)<7) {
			pngfix();
		}
	});
	
	$('div.item, div.itemLast').click(function() {
		if (clickedBag != "") {
			$('div.collection:eq('+clickedMenu+')').children('div:eq('+clickedBagNum+')').css({ backgroundImage: 'url(images/bag_off.png)'  });
		}
		theStyle = $(this).attr('id').replace("style_", "");
		clickedBag = theStyle;
		theStyleNum = $(this).children('img').attr('class').replace("style_", "");
		clickedBagNum = theStyleNum-1;
		clickedImage = 0;
		
		//GET COLLECTION
		var wholeHash = location.hash.slice(1);
		if (wholeHash) {
			var hashArr = wholeHash.split("/");
			theColName = hashArr[0];
		}else {
			theColName = "solar";	
		}
		var colID = $('#menu div').index($('#menu_'+theColName));
		
		
	
		var furl = "process/requestProduct.php?c="+(colID+1)+"&s="+theStyle.replaceAll("_", " ");
		$.ajax({
			url:furl,
			data:{ url:escape(furl) },
			dataType:"html",
			success:function(data){
				window.location = "#"+(theColName) + "/" + theStyle;
				
				removeContent();
				
				$("body").append( data );
				
				initialSetup();
				
				//IF PAGE IS COLLECTION
				if (fromCol) {
					//ROLL IMAGE IN
					currentX = $('#rightSide').css('left');
					windowWidth = $(window).width();
					//SLIDE FROM RIGHT
					//$('#rightSide').css({ "left": windowWidth});
					//$('#rightSide').animate({ "left": currentX}, animTime);
					
					//FADEIN
					$('#rightSide').fadeIn(animTime);
					
					//ROLL DESC IN
					
					$('#productPanel').css({ "left": '235px'});
					$('#productPanel').animate({ "left": '210px'}, animTime);
					fromCol = false;
				}else {
					$('#rightSide').hide();
					$('#rightSide').fadeIn(animTime);
				}
			},
			error:function(xhr,err,e){ alert( "Error: " + err ); }
		});
	});
	
	
	//MENU NAVIGATION
	$('#menu div').children('img').hover(function() {
		thisImg = $(this).attr('src');
		newImg = thisImg.replace("_off", "_on");
		$(this).attr('src', newImg);
	}, function() {
		thisIndx = $('#menu div').index($(this).parent('div'));
		//alert(thisIndx);
		
		if (clickedMenu != thisIndx) {
			thisImg = $(this).attr('src');
			newImg = thisImg.replace("_on", "_off");
			$(this).attr('src', newImg);
		}
	});
	
	
	$('#menu div').click(function() {
		toggleMenu('open');
		fromCol = true;	
		//clickedBagNum = -1;
		//CLEAR BAG SELECTOR
		if (clickedBag) {
			$('div.collection:eq('+clickedMenu+')').children('#style_'+clickedBag).css({ backgroundImage: 'url(images/bag_off.png)'  });
		}
		clickedBag = "";
								  
		lastMenu = clickedMenu;
		clickedMenu = $('#menu div').index(this);
		
		lastSrc = $('#menu div:eq('+lastMenu+')').children('img').attr('src').replace('on', 'off');
		newSrc = $(this).children('img').attr('src').replace('off', 'on');
		
		$('#menu div:eq('+lastMenu+')').children('img').attr('src', lastSrc);
		$(this).children('img').attr('src', newSrc);
		
		theColName = $(this).attr('id').replace("menu_", "");
		
		//SHIFT BAG MENU OVER
		$('div.collection:eq('+lastMenu+')').animate({ left: '-100px' }, animTime, function() {
			$('div.collection:eq('+lastMenu+')').css({ left: '100px' });
		 });
		$('div.collection:eq('+clickedMenu+')').animate({ left: '0px' }, animTime);
		
		var furl = "process/requestCol.php?c="+(clickedMenu+1);
		$.ajax({
			url:furl,
			data:{ url:escape(furl) },
			dataType:"html",
			success:function(data){
				//SET HASH
				window.location = "#"+(theColName);
				
				removeContent();
				
				$("body").append(data);
				
				overviewSetup();
			},
			error:function(xhr,err,e){ alert( "Error: " + err ); }
		});
		
	});
	

});

(function($){
	//Adjust image size
	$.fn.resizeBars = function() {
	  		//Set default size
			smallest = 200;
			
			//Gather current info
			var imagewidth = $(this).width();
			var imageheight = $(this).height();
			//Define image ratio
			var ratio = imageheight/imagewidth;

			var browserwidth = $(window).width() - 510;
			var browserheight = $(window).height();
			
			if (browserwidth == 0) {
				var browserwidth = window.innerWidth - 510;
			}
			if (browserheight == 0) {
				var browserheight = window.innerHeight;
			}
			
			var offset;
			
			//Resize image to proper ratio
			if ((browserheight/browserwidth) < ratio){
				//alert('by height');
				//SET MINIMUM
				
				//alert(browserheight);
				if (browserheight < smallest) {
					browserheight = smallest;
				}
				
				$(this).height(browserheight);
				$(this).width((browserheight) / ratio);
				
				$(this).parent('div.productShot').css('top', 0);
				//$(this).parent('div.productShot').css('left', 510);
			} else {
				//alert('by width');
				if (browserwidth < smallest) {
			    	browserwidth = smallest;
				}
				
				$(this).width(browserwidth);
			    $(this).height(browserwidth * ratio);
				
				$(this).parent('div.productShot').css('top', (browserheight - $(this).height())/2);
				
			}

			putLeft =  ((browserwidth - $(this).width())/2) + 510;
			if (putLeft < 510) { putLeft = 510 };

			$(this).parent('div.productShot').css('left', putLeft);
			
			return false;
	};
})(jQuery);

function removeContent() {
	$('#productPanel').remove();
	$('#rightSide').remove();
	$('#overview').remove();
	$('#rollOvers').remove();
	$('#bgImage').remove();
}

//RUN EVERYTIME OVERVIEW IS LOADED0
function overviewSetup() {
	
	//SET SIFR
	sIFR.replace(gothamBold, {
	  selector: '.rollItem .styleHead',
	  css: '.sIFR-root { color: #444539; font-size: 14px; }',
	  wmode: 'transparent',
	  tuneHeight: -5,
	  forceSingleLine: true
	});
	sIFR.replace(gothamLight, {
	  selector: '.rollItem .stylePrice',
	  css: '.sIFR-root { color: #FFFFFF; font-size: 14px; }',
	  wmode: 'transparent',
	  tuneHeight: -5,
	  forceSingleLine: true
	});
	sIFR.replace(gothamLight, {
	  selector: '.bagSaying',
	  css: '.sIFR-root { color: #6c6d6e; font-size: 20px; }',
	  tuneHeight: 0,
	  forceSingleLine: false
	});
	
	
	//OVERVIEW HIDE DESCRIPTION TO START
	$('#overviewDesc').hide();
	
	//ROLL OVER MENU
	$('.rollItem').hide();
	$('#rollOvers').hide();
	
	$('#viewMore').click(function() {
		$('#overviewContent').hide();
		$('#bgImage').hide();
		$('#overviewDesc').show();	
	});
	
	$('#closeMore').click(function() {
		$('#overviewContent').show();
		$('#bgImage').show();
		$('#overviewDesc').hide();						  
	});
	
	
	//RESIZE BG DIV TO MENU
	$(window).bind("resize", function(){	
		//RESIZE IMAGE
		 //$("#bgImage").ezBgResize();
		$('div.backImage').resizeBgImage();
	});
	
	$('div.backImage').resizeBgImage();
	//$('#bgImage').ezBgResize();
	
	if ($.browser.msie && $.browser.version.substr(0,1)<7) {
		pngfix();
	}
}

function initialSetup() {
	
	//SET SIFR
	sIFR.replace(gothamBook, {
	  selector: '#productPanel .styleHead',
	  css: '.sIFR-root { color: #444539; font-size: 22px; }',
	  wmode: 'transparent',
	  tuneHeight: 0,
	  forceSingleLine: true
	});
	sIFR.replace(gothamLight, {
	  selector: '#productPanel .stylePrice',
	  css: '.sIFR-root { color: #444539; font-size: 22px; }',
	  wmode: 'transparent',
	  tuneHeight: 0,
	  forceSingleLine: true
	});

	
	//DESCRIPTION INITIAL SETUP
	//$('#descB').hide();
	$('#descC').hide();
	$('#descD').hide();
	$('#descE').hide();
	
	$('.answr').hide();
	
	//FAQ CLICKS
	$('.faq').click(function() {
		$(this).next('.answr').toggle(300);				   
	});
	
	
	//$('#productDesc').hide();
	
	$(window).bind("resize", function(){	
		//RESIZE IMAGE
		$('div.productShot:eq('+clickedImage+')').children('img').resizeBars();
		
		//RESIZE NAVIGATION
		newNHeight = $(document).height();
		$('#leftSide').css({ height: newNHeight });
	});
	
	$('.productImage').hide();
	
	//INITIAL IMAGE SETUP
	$('.productImage').load(function() {
		$(this).resizeBars();
		$('div.productShot').hide();
		$(this).show();
		$('div.productShot:eq('+clickedImage+')').show();
	});
	
	//SET SELECTED IMAGE
	$('#selImg').removeAttr('id');
	$('.imageNum:eq('+clickedImage+')').attr('id', 'selImg');
	
	$('.imageNum').click(function() {
		clickedImage = $('#imageHolder .imageNum').index(this);
		
		//REMOVE OLD ID ADD NEW
		$('#selImg').removeAttr('id');
		$(this).attr('id', 'selImg');
		
		
		//SHOW NEW IMAGE
		$('div.productShot:eq('+lastImage+')').hide();
		lastImage = clickedImage;
		$('div.productShot:eq('+clickedImage+')').show();
		$('div.productShot:eq('+clickedImage+')').children('img').resizeBars();
		
		
	});
	
	//VIEW INFO
	/*$('#viewInfo').click(function() {
		descStatus = $('#productDesc').css('display');
		if (descStatus == "none") {
			$('#productDesc').show();
			$('#viewInfo').children('img').attr('src', "images/hideinfo.jpg"); 
			//$('#productPanel').animate({ 'top': '170px' }, 600);
		}else {
			$('#productDesc').hide();
			$('#viewInfo').children('img').attr('src', "images/viewInfo.jpg"); 
			$('#productPanel').animate({ 'top': '170px' }, 600);
		}
	});*/
	
	//DESCRIPTION NAVIGATION
	$('#showInfo').click(function() {
		$('#descA').show();
		//$('#descB').hide();
		//$('#descC').hide();
		$('#descD').hide();
		$('#descE').hide();
		
		$('#showInfo').children('img.descArrow').attr('src', 'images/arrow.jpg');
		//$('#showDim').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		//$('#showInc').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showFaq').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showAbt').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
	});
	/*$('#showDim').click(function() {
		$('#descA').hide();
		$('#descB').show();
		$('#descC').hide();
		$('#descD').hide();
		$('#descE').hide();
		
		$('#showInfo').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showDim').children('img.descArrow').attr('src', 'images/arrow.jpg');
		$('#showInc').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showFaq').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showAbt').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
	});
	$('#showInc').click(function() {
		$('#descA').hide();
		$('#descB').hide();	
		$('#descC').show();
		$('#descD').hide();
		$('#descE').hide();
		
		$('#showInfo').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showDim').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showInc').children('img.descArrow').attr('src', 'images/arrow.jpg');
		$('#showFaq').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showAbt').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
	});*/
	
	$('#showFaq').click(function() {
		$('#descA').hide();
		//$('#descB').hide();	
		//$('#descC').hide();
		$('#descD').show();
		$('#descE').hide();
		
		$('#showInfo').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		//$('#showDim').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		//$('#showInc').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showFaq').children('img.descArrow').attr('src', 'images/arrow.jpg');
		$('#showAbt').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
	});
	
	$('#showAbt').click(function() {
		$('#descA').hide();
		//$('#descB').hide();	
		//$('#descC').hide();
		$('#descD').hide();
		$('#descE').show();
		
		$('#showInfo').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		//$('#showDim').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		//$('#showInc').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showFaq').children('img.descArrow').attr('src', 'images/arrow_blank.jpg');
		$('#showAbt').children('img.descArrow').attr('src', 'images/arrow.jpg');
	});
	
	
	
	//SETUP COLOR SWATCHES
	$('div.colorImg').click(function() {
		//var wholeHash = location.hash.slice(1);
		//var hashArr = wholeHash.split("/");
		/*if (wholeHash) {
			var collection = hashArr[0];
			var colID = $('#menu div').index($('#menu_'+collection));
			var style = hashArr[1];
			var furl = "process/requestProduct.php?c="+(colID+1)+"&s="+style.replaceAll("_", " ");
		}*/
		theProdID = $(this).attr('id').replace("swatch_", "");
		var furl = "process/requestProduct.php?p="+theProdID;
		
		$.ajax({
			url:furl,
			data:{ url:escape(furl) },
			dataType:"html",
			success:function(data){
				//SET HASH
				//window.location = "#"+hashArr[0]+"/"+hashArr[1]+"/"+prodID;
				
				removeContent();
				//Change URL
				$("body").append( data );
				
				initialSetup();
				overviewSetup();
				
				//SET SELECTED BORDER
				//$('.selSwatch').css({ borderColor: '#d5e04e' });
				
				//OPEN DESC
				//$('#viewInfo').children('img').attr('src', "images/hideinfo.jpg"); 
				//$('#productDesc').show();

				
				//SET INITIAL STATES
				/*clickedMenu = $('#menu div').index($('#menu_'+collection));
				if (clickedMenu < 0) {
					clickedMenu = 0;	
				}
				newSrc = $('#menu_'+collection).children('img').attr('src').replace('off', 'on');
				$('#menu div:eq('+clickedMenu+')').children('img').attr('src', newSrc);
				
				//SET BAG STYLE
				if (style != "") {
					clickedBag = style;
					theStyle = $('div.collection:eq('+clickedMenu+')').children('#style_'+clickedBag).css({ backgroundImage: 'url(images/bag_on.png)'  });
					clickedBagNum = $('div.collection:eq('+clickedMenu+') div').index($('#style_'+clickedBag));
				}
				
				//CHANGE BAG MENU
				$('div.collection:eq('+clickedMenu+')').css({ left: '0px' });*/
			},
			error:function(xhr,err,e){ alert( "Error: " + err ); }
		});
	});
	
	if ($.browser.msie && $.browser.version.substr(0,1)<7) {
		pngfix();
	}
}

function changeNav(colName) {
	//Change Menu
	menuID = '#menu_'+colName
	clickedMenu = $('#menu div').index( $(menuID) );
	
	lastSrc = $('#menu div:eq('+lastMenu+')').children('img').attr('src').replace('on', 'off');
	newSrc = $(this).children('img').attr('src').replace('off', 'on');
	
	$('#menu div:eq('+lastMenu+')').children('img').attr('src', lastSrc);
	$(this).children('img').attr('src', newSrc);
	
	theColName = $(this).attr('id').replace("menu_", "");
	
	//SHIFT BAG MENU OVER
	$('div.collection:eq('+lastMenu+')').animate({ left: '-100px' }, animTime, function() {
		$('div.collection:eq('+lastMenu+')').css({ left: '100px' });
	 });
	$('div.collection:eq('+clickedMenu+')').animate({ left: '0px' }, animTime);	
}

String.prototype.replaceAll = function(stringToFind,stringToReplace){
var temp = this;
var index = temp.indexOf(stringToFind);
	while(index != -1){
		temp = temp.replace(stringToFind,stringToReplace);
		index = temp.indexOf(stringToFind);
	}
	return temp;
}

//MENU TOGGLE //toggleMenu('open'); OR toggleMenu('close');
function toggleMenu(pos) {
	if (pos == 'open') {
		//LENGTHEN MENU
		$('#leftSide').stop().animate({ width: '180px' }, 200, function() {
			//SHOW BAG NAV	
			$('#itemNav').show();
			$('#navVertLine').show();															
		});	
	}else if (pos == 'close') {
		//HIDE BAG NAV
		
		$('#itemNav').hide();
		$('#navVertLine').hide();
		
		//SHORTEN MENU
		$('#leftSide').stop().css({ width: '90px' }, 200);
	}
	
	//$('div.backImage').resizeBgImage();
}