window.onload = init;

document.write('<style type="text/css">#van, #house, #boxes { display: none }</style>');

function init () {
	storageCalc();
	formChecker();
}

var forms = new Array(
	{
		'id':   'QuoteForm',
		'names': new Array (
			'Postcode',
			'Email',
			'Mobile Telephone',
			'Daytime Telephone',
			'Location',
			'When?',
			'How long for?'
		),
		'fields': new Array(
			'postcode',
			'email',
			'mobile',
			'telephone',
			'location',
			'when',
			'length'
		)
	}
);


function formChecker() {
	for (var i = 0; i < forms.length; i++) {
		var frm = document.getElementById(forms[i]['id']);
		if (frm) {
			frm.onsubmit = function () {
				return checkForm(this.id);
			}
		}
	}
}

function checkForm (id) {
	var found = false;
	for (var i = 0; i < forms.length; i++) {
		if (forms[i]['id'] == id) {
			found = true;
			break;
		}
	}
	if (!found) return;
	var frm = document.getElementById(id);
	if (frm) {
		var incompleteFields = new Array();
		for (var j = 0; j < forms[i]['fields'].length; j++) {
			var fld = document.getElementById(forms[i]['fields'][j]);
			if (fld) {
				if (fld.value.length == 0) {
					incompleteFields[incompleteFields.length] = forms[i]['names'][j];
				}
			}
		}
		if (incompleteFields.length > 0) {
			var s = 'Please complete the following fields:\n\n  o) ';
			s += incompleteFields.join('\n  o) ');
			alert(s);
			return false;
		}
	}
	return true;
}

function storageCalc () {
	var ids = new Array ('van', 'house', 'boxes');

	for (var i = 0; i < ids.length; i++) {
		var o = document.getElementById(ids[i]);
		if (o) {
			o.className += ' estimatorBlock';
			o.style.display = 'block';
		}
	}
	

	// preload all the images
	var images = new Array();
	for (var i = 0; i < ids.length; i++) {
		for (var j = 1; j <= 4; j++) {
			var c = images.length;
			images[c] = document.createElement('img');
			images[c].src = 'images/' + ids[i] + j + '.gif';
		}
	}

	// set the actions
	var lis = document.getElementsByTagName('li');
	for (var i = 0; i < lis.length; i++) {
		// the li has a class name of s1, s2, s3 or s4
		if (lis[i].className.match(/\s*?s[1-4]\s*?/)) {
			lis[i].onmouseover = function () {
				var num = this.className.match(/\s*?s([1-4])\s*?/)[1];

				// get the id name
				var o = this.parentNode;
				while (o.nodeName != 'DIV') {
					o = o.parentNode;
				}
				var s = o.id;
				if (s == '') {
					return;
				}

				// get the parent ul
				var o = this.parentNode;
				while (o.nodeName != 'UL' && o.nodeName != 'OL') {
					o = o.parentNode;
				}
				o.style.background = 'url(images/'+ s + num+ '.gif) no-repeat';
			}
			lis[i].onmouseout = function () {
				var num = 1;
				// get the id name
				var o = this.parentNode;
				while (o.nodeName != 'DIV') {
					o = o.parentNode;
				}
				var s = o.id;
				if (s == '') {
					return;
				}

				// get the parent ul
				var o = this.parentNode;
				while (o.nodeName != 'UL' && o.nodeName != 'OL') {
					o = o.parentNode;
				}
				o.style.background = 'url(images/'+ s + num+ '.gif) no-repeat';
			}
		}
	}
}