//Updated 3-2-2007

//About button and iframe states

function aboutContent(section) {
	if(section == "philosophy")
		{ sectionTitle = "our " + section; 
		  Element.update('about_title', sectionTitle);
		  aboutBtnsOff();
		  $('btn_philosophy').src="/img/about/btn_philosophy_on.gif" }

	if(section == "designer")
		{ sectionTitle = "the " + section; 
		  Element.update('about_title', sectionTitle);
		  aboutBtnsOff();
		  $('btn_designer').src="/img/about/btn_designer_on.gif" }

	if(section == "seen")
		{ sectionTitle = "as " + section + " in"; 
		Element.update('about_title', sectionTitle);
		aboutBtnsOff();
		$('btn_seen').src="/img/about/btn_seen_on.gif" }
}

function aboutBtnsOff() {
	$('btn_philosophy').src="/img/about/btn_philosophy.gif";
	$('btn_designer').src="/img/about/btn_designer.gif";
	$('btn_seen').src="/img/about/btn_seen.gif"
}

//Service button and iframe states

function serviceContent(section) { 
	if(section == "faq")
		{ sectionTitle = section +"s"; 
		  Element.update('service_title', sectionTitle);
		  serviceBtnsOff();
		  $('btn_faq').src="/img/service/btn_faq_on.gif" }

	if(section == "policies")
		{ sectionTitle = section; 
		  Element.update('service_title', sectionTitle);
		  serviceBtnsOff();
		  $('btn_policies').src="/img/service/btn_policies_on.gif" }

	if(section == "contact")
		{ sectionTitle = section + " us"; 
		Element.update('service_title', sectionTitle);
		serviceBtnsOff();
		$('btn_contact').src="/img/service/btn_contact_on.gif" }
}

function serviceBtnsOff() {
	$('btn_faq').src="/img/service/btn_faq.gif";
	$('btn_policies').src="/img/service/btn_policies.gif";
	$('btn_contact').src="/img/service/btn_contact.gif"
}

//color swatch effects 

function initSwatches() {
var myElements = $("colorSwatchContainer");
var mySquares = myElements.getElementsByTagName("img");
for(i=0;i<mySquares.length;i++) {
	if(Element.hasClassName(mySquares[i], "colorSwatch"))
		{ mySquares[i].onmouseover = growSwatch; mySquares[i].onmouseout = shrinkSwatch; }
	}
}

function initProductSwatches() {
var myElements = $("availableColors");
var mySquares = myElements.getElementsByTagName("img");
for(i=0;i<mySquares.length;i++) {
	mySquares[i].onmouseover = growSwatch; mySquares[i].onmouseout = shrinkSwatch;
	}
}

function growSwatch(mousedElement) {
	mousedElement = this;
	new Effect.Opacity(mousedElement, {duration:0.3, from:1.0, to:0.7});

}

function shrinkSwatch() {
	mousedElement = this;
	new Effect.Opacity(mousedElement, {duration:0.3, from:0.7, to:1.0});	

}

//show different shopping sections

function shoppingType(cat,catImg) { 
	if(cat != currentCat) {
			Element.show(cat); Element.hide(currentCat);
			$(catImg).className = 'collectionSubnavOn';
			$(catImg).src = '/img/collection/'+cat+'_btn_on.gif';
			$(currentGraphic).className = 'collectionSubnavOff';
			$(currentGraphic).src = '/img/collection/'+currentCat+'_btn.gif';
			currentCat = cat; currentGraphic = catImg;
	}
}

//show monogram layer 
var monogram = 0;

function showMonogramInfo() { 
	if(monogram == 0) {
		new Effect.Appear('monogramLinkWin', {duration: 0.5});
		monogram = 1;
	} else {
		new Effect.Fade('monogramLinkWin', {duration: 0.5});
		monogram = 0;
	}
}

//monogram in popup window for shopping cart

function showMonogramInfoPop() {
	window.open('/shop/monogram.html','monogram','width=189,height=268')
}

//------------------------
// CUSTOM TOOL FUNCTIONS
//------------------------

//variables for custom tool functionality
var currentStep = 1;
var currentNeckline;
var currentNecklineId;
var currentNecklineLookImage = '';
var currentType;
var urlStr;

//chosen products and prices
var currentNecklace;
var currentNecklacePrice;
var currentEarring;
var currentEarringPrice;
var currentAccessory;
var currentAccessoryPrice;
var currentNecklaceId;
var currentNecklaceColor;
var currentEarringId;
var currentEarringColor;
var currentAccessoryId;
var currentAccessoryColor;

// name of the look
var currentLookName = 'your bridal look';

function toolNav(step) { 
	if(step != currentStep) { 
	if(currentNeckline) {
	//swap out nav buttons & change styles
		//on button	
		$('step'+step+'Btn').src='../img/custom/btn_step'+step+'_on.png'; 
		$('step'+currentStep+'Btn').src='../img/custom/btn_step'+currentStep+'.png'; 
	}
			//show correct step
			if(step == 1) { 
				Element.hide('details'); Element.hide('order');
				Element.show('necklines'); 
			}
			if(step > 1 && step < 5) { 
				if(currentNeckline) {
					Element.hide('necklines'); Element.hide('order');
					Element.show('details'); 		
					//now set neckline, etc
					setLook(step);
				} else {
					alert('You must select a neckline before moving to the next step!')
				}
			}
			if(step == 5) { 
				if(currentNeckline) {
					Element.hide('details'); Element.hide('necklines');
					Element.show('order'); 
					//now load up all look pieces into iframe
					//change the url to the proper php page
					urlStr = 'tool_order.php?necklace_id='+currentNecklaceId+'&necklace_color='+currentNecklaceColor+'&earring_id='+currentEarringId+'&earring_color='+currentEarringColor+'&accessory_id='+currentAccessoryId+'&accessory_color='+currentAccessoryColor;

			
					//frames['orderContents'].location.href = urlStr;
					//changed iframe access method for Safari
					//alert(urlStr);
					$('orderContents').src = urlStr;

					// set look name					
					document.getElementById('toolLookNameTxt').innerHTML = currentLookName;
					document.forms['fm_save_look'].elements['name'].value = currentLookName;
					//document.forms['fm_email_look'].elements['name'].value = currentLookName;

					// set order form hidden vars
					document.getElementById('of_necklace_id').value = currentNecklaceId;
					document.getElementById('of_necklace_color').value = currentNecklaceColor;
					document.getElementById('of_earring_id').value = currentEarringId;
					document.getElementById('of_earring_color').value = currentEarringColor;
					document.getElementById('of_accessory_id').value = currentAccessoryId;
					document.getElementById('of_accessory_color').value = currentAccessoryColor;

					// set save look form hidden vars
					document.getElementById('sl_neckline_id').value = currentNecklineId;
					document.getElementById('sl_necklace_id').value = currentNecklaceId;
					document.getElementById('sl_necklace_color').value = currentNecklaceColor;
					document.getElementById('sl_earring_id').value = currentEarringId;
					document.getElementById('sl_earring_color').value = currentEarringColor;
					document.getElementById('sl_accessory_id').value = currentAccessoryId;
					document.getElementById('sl_accessory_color').value = currentAccessoryColor;

					// set save look form hidden vars
					document.getElementById('el_neckline_id').value = currentNecklineId;
					document.getElementById('el_necklace_id').value = currentNecklaceId;
					document.getElementById('el_necklace_color').value = currentNecklaceColor;
					document.getElementById('el_earring_id').value = currentEarringId;
					document.getElementById('el_earring_color').value = currentEarringColor;
					document.getElementById('el_accessory_id').value = currentAccessoryId;
					document.getElementById('el_accessory_color').value = currentAccessoryColor;
				} else {
					alert('You must select a neckline before moving to the next step!')
				}
			}		
		
		if(currentNeckline) { currentStep = step; }
		
	}
}

//sets current look & product type
function setLook(step) {
	//set product type and load iframe if required
	if(step == 2) { type = 'Necklace' }
	if(step == 3) { type = 'Earrings' }
	if(step == 4) { type = 'Accessory' }

	//change the URL below to load the appropriate product type
	productsUrl = 'tool_products.php?category='+type;
	$('productsIframe').src = productsUrl;
	currentType = type;

	//set neckline image if changed
	// newNeckline =  '../images/necklines/'+currentNeckline+'.jpg';
	newNeckline = currentNecklineLookImage;
	if($('necklineImg').src != newNeckline) { $('necklineImg').src = newNeckline;}
	//load image all over again because IE6
	necklineAgain = '<img src='+newNeckline+' width="311" height="285" id="necklineImg">';
	Element.update('toolNeckline',necklineAgain);
	
}


function productPicks(img,name,price,id,colorid) {
	//display selected image on neckline
	layerType = 'tool'+currentType;
	//set image dimensions because IE sucks
	if(currentStep == 2) { prodHeight = " width=311 "; prodWidth = "height=285" };
	if(currentStep == 3) { prodHeight = " width=311 "; prodWidth = "height=285" };
	if(currentStep == 4) { prodHeight = " width=140 "; prodWidth = "height=140" }
	img = '<img src='+img+prodHeight+prodWidth+' class=imgTrans />';	
	Element.update(layerType,img);
	Element.show(layerType);
	//more IE 6 hacks
	necklineAgain = '<img src='+newNeckline+' width="311" height="285" id="necklineImg">';
	Element.update('toolNeckline',necklineAgain);
	if(currentStep == 4) { Element.show('toolAccessoryBG')} 
	
	//set the product name and price here
	
	if(currentStep == 2) {  
		currentNecklace = name ; 
		currentNecklacePrice = "$" + price;
		currentNecklaceId = id;
		currentNecklaceColor = colorid;
		Element.show('currentNecklaceContainer'); Element.update('currentNecklace',currentNecklace +' '+ currentNecklacePrice);		
	}
	if(currentStep == 3) { 
		currentEarring = name ; 
		currentEarringPrice = "$" + price;
		currentEarringId = id;
		currentEarringColor = colorid;
		Element.show('currentEarringContainer'); Element.update('currentEarring',currentEarring +' '+ currentEarringPrice);		
	}
	if(currentStep == 4) {  
		currentAccessory = name ; 
		currentAccessoryPrice = "$" + price;
		currentAccessoryId = id;
		currentAccessoryColor = colorid;
		Element.show('currentAccessoryContainer'); Element.update('currentAccessory',currentAccessory +' '+ currentAccessoryPrice);
	}

}

//move between tool steps 
function productSteps(dir) {
	step = currentStep + dir;
	toolNav(step);
	setLook(step);
	//more IE 6 hacks
	necklineAgain = '<img src='+newNeckline+' width="311" height="285" id="necklineImg">';
	Element.update('toolNeckline',necklineAgain);	
}

function necklineChoice(neck, neckImage, neckId) {
	if(neck != currentNeckline) {
		changeNeck = '../images/necklines/'+neck+'_MO.png'; 
		$(neck).src= changeNeck;
		if(currentNeckline) { $(currentNeckline).src='../images/necklines/'+currentNeckline+'.png';; }
		//set current neckline
		currentNeckline = neck;
		currentNecklineId = neckId;
	}
	
	if(neckImage != currentNecklineLookImage) { 
		currentNecklineLookImage = neckImage;
	}
}

//Use this to replace above when the world becomes IE7 
function necklineChoiceOriginal(neck, neckImage, neckId) {
	if(neck != currentNeckline) {
		new Effect.Opacity(neck, {duration:0.5, from:1.0, to:0.5});
		if(currentNeckline) { new Effect.Opacity(currentNeckline, {duration:0.5, from:0.5, to:1.0}); }
		//set current neckline
		currentNeckline = neck;
		currentNecklineId = neckId;
	}
	
	if(neckImage != currentNecklineLookImage) { 
		currentNecklineLookImage = neckImage;
	}
}



function colorName(color) {
	//Element.show('toolColorName');
	Element.update('toolColorNameTxt',color)	
}

function clearColorName() {
	//Element.hide('toolColorName');
	Element.update('toolColorNameTxt','')	
}

function lookSaveWin(windowType,windowState) {
	//clear windows first
	Element.hide('saveLook');Element.hide('emailLook');
	//now display appropriate window
	if(windowState == 1) { new Effect.Appear(windowType, {duration: 0.5}) 
	} else {
	new Effect.Fade(windowType, {duration: 0.5}) 	
	}
}

function submitSaveLookForm ( ) {
	
	form = document.forms['fm_save_look'];
	
	if (form.name.value == "") {
	alert( "Please enter your name.");
	form.name.focus();
	return false;
	}
	if (form.email.value == "") {
	alert( "Please enter your email.");
	form.email.focus();
	return false;
	}
	if (form.pass.value == "") {
	alert( "Please enter your password.");
	form.pass.focus();
	return false;
	}
		
	var opt = {
		// Use POST
		method: 'post',
		// Send this lovely data
		postBody: Form.serialize(form),
		// Handle successful response
		onSuccess: function(t) {
			if (t.responseText == 0) {
				// success
				alert( "look saved successfully. You may retrieve it by accessing My Account" );
				lookSaveWin('saveLook');
			} else if (t.responseText == 1) {
				// password doesn't match
				alert( "password doesn't match." );
				
			}
			
		},
		// Handle 404
		on404: function(t) {
			alert('Error 404: location "' + t.statusText + '" was not found.');
		},
		// Handle other errors
		onFailure: function(t) {
			alert('Error ' + t.status + ' -- ' + t.statusText);
		}
	}

	Element.hide('sl_fm_steps');
	Element.show('sl_fm_waiting');
	new Ajax.Request( '/custom/save_look.php', opt);

	Element.hide('sl_fm_waiting');
	Element.show('sl_fm_steps');

	return true;
}

function submitEmailLookForm ( ) {
	
	form = document.forms['fm_email_look'];
	
	if (form.from_name.value == "") {
	alert( "Please enter your name.");
	form.from_name.focus();
	return false;
	}
	if (form.from_email.value == "") {
	alert( "Please enter your email.");
	form.from_email.focus();
	return false;
	}
	if (form.to_email.value == "") {
	alert( "Please enter your friend's email.");
	form.to_email.focus();
	return false;
	}
		
	var opt = {
		// Use POST
		method: 'post',
		// Send this lovely data
		postBody: Form.serialize(form),
		// Handle successful response
		onSuccess: function(t) {
			if (t.responseText == 0) {
				// success
				alert( "look sent successfully." );
				lookSaveWin('saveLook');
			} else if (t.responseText == 1) {
				// password doesn't match
				alert( "email was not sent." );
				
			}
			
		},
		// Handle 404
		on404: function(t) {
			alert('Error 404: location "' + t.statusText + '" was not found.');
		},
		// Handle other errors
		onFailure: function(t) {
			alert('Error ' + t.status + ' -- ' + t.statusText);
		}
	}

	Element.hide('el_fm_steps');
	Element.show('el_fm_waiting');
	new Ajax.Request( '/custom/email_look.php', opt);

	Element.hide('sl_fm_waiting');
	Element.show('el_fm_steps');

	return true;
}

function submitEmailItemForm ( ) {
	
	form = document.forms['fm_email_item'];
	
	if (form.from_name.value == "") {
	alert( "Please enter your name.");
	form.from_name.focus();
	return false;
	}
	if (form.from_email.value == "") {
	alert( "Please enter your email.");
	form.from_email.focus();
	return false;
	}
	if (form.to_email.value == "") {
	alert( "Please enter your friend's email.");
	form.to_email.focus();
	return false;
	}
		
	var opt = {
		// Use POST
		method: 'post',
		// Send this lovely data
		postBody: Form.serialize(form),
		// Handle successful response
		onSuccess: function(t) {
			if (t.responseText == 0) {
				// success
				alert( "item sent successfully." );
				lookSaveWin('saveLook');
			} else if (t.responseText == 1) {
				// password doesn't match
				alert( "email was not sent." );
				
			}
			
		},
		// Handle 404
		on404: function(t) {
			alert('Error 404: location "' + t.statusText + '" was not found.');
		},
		// Handle other errors
		onFailure: function(t) {
			alert('Error ' + t.status + ' -- ' + t.statusText);
		}
	}
	

	Element.hide('ei_fm_steps');
	Element.show('ei_fm_waiting');
	new Ajax.Request( '/collection/email_item.php', opt);

	Element.hide('ei_fm_waiting');
	Element.show('ei_fm_steps');

	return true;
}

function viewOnTool ( look_image, style, price, item_id, color_id, category ) {
	
	if(!currentNeckline) {
		// hardcode to choose scoop if no neckline is specified
		necklineChoice('neckline_scoop', '/images/necklines/neckline_scoop.jpg', '3');
	} 
	
	currentType = category;
	
	if ( currentType == 'Necklace' ) {
		step = 2;
	}
	if ( currentType == 'Earrings' ) {
		step = 3;
	}
	if ( currentType == 'Accessory' ) {
		step = 4;
	}
	
	toolNav(step);
	productPicks(look_image,style,price,item_id,color_id);		
	
	// set the color in the products iFrame
	productsUrl = 'tool_products.php?category='+category+'&color_id='+color_id;
	$('productsIframe').src = productsUrl;

}

function setFlashLook ( num ) {
	if(!currentNeckline) {
		// hardcode to choose scoop if no neckline is specified
		necklineChoice('neckline_scoop', '/images/necklines/neckline_scoop.jpg', '3');
	} 
	currentType = 'Necklace';
	
	switch ( num ) {
		case 1:
		toolNav(2);
		productPicks( '/images/items/I11_lk_I11_lk_102-4.png', 'Haylie', '38.00', '11', '11');
		toolNav(3);
		productPicks( '/images/items/I13_lk_I13_lk_201-4.png', 'Patricia', '53.00', '13', '11');
		break;
		
		case 2:
		toolNav(2);
		productPicks( '/images/items/I19_lk_I19_lk_101-12.png', 'Elizabeth', '58.00', '19', '21');
		toolNav(3);
		productPicks( '/images/items/I21_lk_I21_lk_203-12.png', 'Maria', '48.00', '21', '21');
		toolNav(4);
		productPicks( '/images/items/I14_lk_I14_lk_303-12.png', 'Marissa', '33.00', '14', '21');
		break;
		
		case 3:
		toolNav(2);
		productPicks( '/images/items/I10_lk_I10_lk_104-12.png', 'Bettina', '68.00', '10', '21');
		toolNav(3);
		productPicks( '/images/items/I25_lk_I25_lk_207-12.png', 'Danielle', '33.00', '25', '21');
		break;
	}
}