// Constants
////////////////////////////
var messageCharLimit = 200;

var voucher_design_img_id_prefix = "voucherPreview";
var voucher_design_radio_id_prefix = "voucherDesign";


// Events
////////////////////////////
$(document).ready(function() {
	// Trigger voucher link title on/off when the mouse is over its related image
	$(".voucher_link a img").bind("mouseenter mouseleave", function(e){
		$("#"+this.parentNode.parentNode.id+" h3 a").toggleClass("active")
    });
	
	// Voucher value change on the order form -- update design images
	$("#frmVoucherAmount").change(function(e){
		changeVoucherPreview(this);
    });
	
	// Voucher design image clicked -- check the related radio button
	$(".voucher_design img").click(function(e){
		var radio_id = this.id.replace(voucher_design_img_id_prefix, voucher_design_radio_id_prefix);
		var radio_node = document.getElementById(radio_id);
		if(radio_node !== null) {
			radio_node.checked=true;
		}
	});
	
	// Voucher message textbox received some input -- ensure we are not over the char limit
	$("#voucher_message").keypress(function(e){
		return (this.value.length <= messageCharLimit);
	});
	
	// Voucher message textbox received some input -- show user how many chars they have remaining
	$("#voucher_message").keyup(function(e){
		messageCharCount(this);
	});
	
	// Personal Message help button clicked
	$("#help_message").click(function(e){
		return popup(this, 'HelpPopup', 400, 200);
	});
	
	// Delivery help button clicked
	$("#help_delivery").click(function(e){
		return popup(this, 'HelpPopup', 400, 530);
	});
	
	// Delivery Charges help button clicked
	$("#help_delivery_charges").click(function(e){
		return popup(this, 'HelpPopup', 400, 530);
	});
});


// Support functions
////////////////////////////
/**
 * Changes the voucher image when a different voucher value is selected on the HomeVouchers.php page.
 */
function changeVoucherPreview(selection) {
	// Fetch newly selected voucher value
	var newVoucherValue = selection.options[selection.selectedIndex].value;

	// Update HTML document with new img src paths.
	document.getElementById("voucherPreview1").src = "images/vouchers/voucherPreview-1" + "-" + newVoucherValue + ".jpg";
	document.getElementById("voucherPreview2").src = "images/vouchers/voucherPreview-2" + "-" + newVoucherValue + ".jpg";
	document.getElementById("voucherPreview3").src = "images/vouchers/voucherPreview-3" + "-" + newVoucherValue + ".jpg";
	document.getElementById("voucherPreview4").src = "images/vouchers/voucherPreview-4" + "-" + newVoucherValue + ".jpg";
	document.getElementById("voucherPreview5").src = "images/vouchers/voucherPreview-5" + "-" + newVoucherValue + ".jpg";
	document.getElementById("voucherPreview6").src = "images/vouchers/voucherPreview-6" + "-" + newVoucherValue + ".jpg";
}


/**
 * Displays the number of chars left in the textarea for the message
 */
function messageCharCount(textarea) {
	var message = textarea.value;
	var length = message.length;

	// Delete any chars over the limit
	if(length > messageCharLimit) {
		frmVoucher.message.innerHTML = message.substr(0, messageCharLimit);
		length = message.length;
	}

	// Update msg showing num chars left
	document.getElementById("messageCount").innerHTML = "Characters remaining: " + (messageCharLimit-length);
}


/**
 * Creates a popup window
 * - mylink: the link or href object of the popup page
 * - windowname: name of the popup window
 */
function popup(mylink, windowname, width, height)
	{
	if (! window.focus)
		return true;

	var href;
	if (typeof(mylink) == 'string')
		href=mylink;
	else
		href=mylink.href;

	window.open(href, windowname, 'width=' + width + ',height=' + height + ',scrollbars=no,location=no');
	return false;
}