// PRICES
var SOLO_COST = 60;
var DUETTRIO_COST = 40;
var GROUP_COST = 38;
var LINEPROD_COST = 28;

var STEP_INFO = 0;
var STEP_CATEGORY = 1;
var STEP_DANCERS = 2;
var STEP_SUBMIT = 3;
var BOX_WIDTH = 600;
var LEFT_MARGIN = 0;
var step = 0;
var form;
var dancersCount = 1;
var groupDancersCount = 1;
var dancerBoxHTML = "";
var groupDancerBoxHTML = "";

var errorDiv;
var trace = alert;

var rules = [{
	field: 'studio_name',
	reqs: ['required'],
	msg: 'Please enter the studio name',
	step: 0
}, {
	field: 'contacts_full_name',
	reqs: ['required'],
	msg: 'Please enter the contact full name',
	step: 0
}, {
	field: 'email_address',
	reqs: ['required', 'email'],
	msg: 'Please enter a valid e-mail address',
	step: 0
}, {
	field: 'phone_code',
	reqs: ['required', 'numeric'],
	msg: 'Please enter a valid phone number',
	step: 0
}, {
	field: 'phone_number',
	reqs: ['required', 'numeric'],
	msg: 'Please enter a valid phone number',
	step: 0
}, {
	field: 'category',
	reqs: ['required'],
	msg: 'Please select a category',
	step: 1
}, {
	field: 'division_category',
	reqs: ['required'],
	msg: 'Please select division a category',
	step: 1
}, {
	field: 'age_category',
	reqs: ['required'],
	msg: 'Please select an age category',
	step: 1
}, {
	field: 'dancers_count',
	reqs: ['required'],
	msg: 'Please select the number of dancers',
	step: 1
}];

function setStep(toStep)
{
	if (validate()) 
	{
		step = toStep;
		$('container').tween('left', -step * BOX_WIDTH + LEFT_MARGIN);

		if (step == STEP_SUBMIT && form['copy_email'].value == '') 
		{
			form['copy_email'].value = form['email_address'].value;
		}
		
		if (step == STEP_SUBMIT) 
		{
			updateCosts();
		}
		
		var type = $('cmb_category').options[$('cmb_category').selectedIndex].text || 'Solo';
		if (step == STEP_DANCERS) 
		{
			/*switch (type)
			{
				case 'Duets':
					count = 2;
					break;
				case 'Trios':
					count = 3;
					break;
			}*/
			var count = parseInt($('cmb_dancercount').options[$('cmb_dancercount').selectedIndex].text);
			//alert(count);
			if ( dancersCount < count ) addDancer( count - dancersCount );
			//while (dancersCount < count) addDancer();
			while (dancersCount > count) removeDancer();
			$('dancers_count_details').innerHTML = 'You have entered ' + count + ' dancers.';
			//alert(dancersCount);
		}
	}
}

function validate()
{
	var revision = arguments.length > 0 && arguments[0];
	var valid = true;
	$$('input').setProperty('invalid', false);
	for (var i = 0; i < rules.length; i++) 
	{
		var rule = rules[i];
		if (rule.step == step) 
		{
			var field = form[rule.field];
			var val = ( field.type == 'select' || field.type == 'select-one' ) ? field.options[field.selectedIndex].text : field.value;
						
			if (!revision || (revision && rule.invalid)) 
			{
				for (var j = 0; j < rule.reqs.length; j++) 
				{
					var req = rule.reqs[j];
					switch (req)
					{
						case 'required':
							if (!$chk(val)) 
							{
								valid = valid && false;
							}
							break;
						case 'numeric':
							if (isNaN(parseFloat(val))) 
							{
								valid = valid && false;
							}
							break;
						case 'email':
							var pattern = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
							valid = valid && pattern.test(val);
							break;
					}
				}
				if (!valid) 
				{
					displayError(field.parentNode, rule.msg);
					rule.invalid = field.invalid = true;
					field.focus();
					new Fx.Tween(field).start('background-color', '#ff9999');
					return false;
				}
				else 
				{
					removeErrorDiv();
					rule.invalid = field.invalid = false;
					new Fx.Tween(field).start('background-color', '#ffffff');
				}
			}
		}
	}
	return true;
}

function removeErrorDiv()
{
	if (errorDiv) 
	{
		errorDiv.parentNode.removeChild(errorDiv);
		errorDiv = null;
	}
}

function displayError(node, msg)
{
	removeErrorDiv();
	errorDiv = document.createElement("div");
	errorDiv.setAttribute("id", "errorDiv");
	errorDiv.appendChild(document.createTextNode(msg));
	node.appendChild(errorDiv);
}

function updateCosts()
{
	//if ( groupDancersCount == 1 && form['group_dancer_name_1'].value == '' ) groupDancersCount = 0;
	count = ( dancersCount == 1 && form['dancer_name_1'].value == '' ) ? 0 : dancersCount;

	var type = $('cmb_category').options[$('cmb_category').selectedIndex].text || 'Solo';
	var soloCount = type == 'Solo' ? count : 0;
	var duetTrioCount = ( type == 'Duet' || type == 'Trio' ) ? count : 0;
	var groupCount = type == 'Group' ? count : 0;
	var lineProdCount = ( type == 'Line' || type == 'Extended Line' || type == 'Production' ) ? count : 0;
	$('soloCount').innerHTML = soloCount;
	$('soloCost').innerHTML = '$' + (soloCount * SOLO_COST);
	$('duetTrioCount').innerHTML = duetTrioCount;
	$('duetTrioCost').innerHTML = '$' + (duetTrioCount * DUETTRIO_COST);
	$('groupLineCount').innerHTML = groupCount;
	$('groupLineCost').innerHTML = '$' + (groupCount * GROUP_COST);
	$('lineProdCount').innerHTML = lineProdCount;
	$('lineProdCost').innerHTML = '$' + (lineProdCount * LINEPROD_COST);
	$('totalCost').innerHTML = '$' + ((soloCount * SOLO_COST) + (duetTrioCount * DUETTRIO_COST) + (groupCount * GROUP_COST) + (lineProdCount * LINEPROD_COST));
}

window.onload = function()
{
	form = document.forms['RegisterForm'];
	dancerBoxHTML = $('dancers_container').innerHTML;
	//dancerBoxHTML = $('dancers_container').innerHTML;
	
	$('soloPriceLabel').innerHTML = $('soloPriceLabel').innerHTML.replace('[PRICE]', SOLO_COST);
	$('duetTrioPriceLabel').innerHTML = $('duetTrioPriceLabel').innerHTML.replace('[PRICE]', DUETTRIO_COST);
	$('groupLinePriceLabel').innerHTML = $('groupLinePriceLabel').innerHTML.replace('[PRICE]', GROUP_COST);
	$('lineProdPriceLabel').innerHTML = $('lineProdPriceLabel').innerHTML.replace('[PRICE]', LINEPROD_COST);

	$$('input').addEvent('focus', function()
	{
		new Fx.Tween(this).start('border-color', this.invalid ? '#FF3333' : '#3399FF');
	});
	$$('input').addEvent('blur', function()
	{
		new Fx.Tween(this).start('border-color', '#222222');
		if (this.invalid) 
		{
			validate(true);
		}
	});
	$$('#btn_next_1, #btn_next_2, #btn_next_3').addEvent('click', function()
	{
		setStep(step + 1);
	});
	$$('.add_dancer_img').addEvent('click', function()
	{
		addDancer();
	});
	$('cmb_category').addEvent('change', function()
	{
		switch (this.options[this.selectedIndex].text)
		{
			case 'Solo':
				$('cmb_dancercount').selectedIndex = 1;
				break;
			case 'Duet':
				$('cmb_dancercount').selectedIndex = 2;
				break;
			case 'Trio':
				$('cmb_dancercount').selectedIndex = 3;
				break;
		}
				
	});
	$$('#phone_code, #fax_code').addEvent('keyup', function(evt){
		if (String.fromCharCode(evt.code).length > 0)
		{
			if (this.value.length==3) focusNext(this);	
		}
	});
	
	$$('.remove_dancer').addEvent('click', removeDancer);
	$('btn_submit').addEvent('click', function()
	{
		if (validate()) 
		{
			form.submit();
		}
	});
}

function focusNext( current ) {
	var found = false;
	for (var i = 0; i < form.length; i ++)
	{
		if (found)
		{
			form[i].focus();
			return;
		}
		if (form[i] == current) found = true;
	}
}

function addDancer( num )
{
	var container; 
	var index;
	var added;
	container = $('dancers_container');
	var html = '';
	for (var i = 0; i < num; i++) 
	{
		index = ++dancersCount;
		added = dancerBoxHTML;
		added = added.replace(/_1/g, '_' + index);
		added = added.replace(/#1/g, '#' + index);
		html += added;
	}
	container.innerHTML += html;
}

function removeDancer(evt)
{
	var index = evt ? parseInt(this.id.split('_')[1]) : dancersCount;
	var container = $('dancers_container');
	container.getElementById('dancer_' + index).destroy();
	dancersCount--;
	//updateDancers();
}

function updateDancers()
{
	var elements;
	elements = $$('#dancers_container .dancer');
	
	for (var i = 0; i < elements.length; i++) 
	{
		//if ( step == STEP_DANCERS ) elements[ i ].getElements('.remove_dancer')[ 0 ].id = elements[ i ].getElements('.remove_dancer')[ 0 ].id.replace(/_[0-9]/g, '_' + (i + 1));
		elements[ i ].getElements('.dancer_label')[ 0 ].innerHTML = elements[ i ].getElements('.dancer_label')[ 0 ].innerHTML.replace(/#[0-9]*/g, '#' + (i + 1));
		elements[ i ].id = elements[ i ].id.replace(/_[0-9]*/g, '_' + (i + 1));
	}	
	
	$$('.remove_dancer').addEvent('click', removeDancer);
}