// Mootools related
window.addEvent('domready', function() {

	/* Handle calculating of line totals */
	var order_qty = $$('.order_qty');
	if ( order_qty.length > 0 ) {
		order_qty.each(function(el, i) {
			el.addEvent('change', function(event) {
				// fetch quantity
				qty = parseInt(el.value);
				if ( qty >= 0 ) {
					// grab price
					price = $('price_'+el.id).value;
					// build total
					$('total_'+el.id).value = (qty * price).toFixed(2);
					// orderform refresh
					orderform_refresh();
				} else {
					el.value = 0;
					el.fireEvent('change');
				}
			});
		});
		
		$('shipcost').addEvent('change', function(event) {
			orderform_refresh();
		});
		
		function orderform_refresh() {
			// grabs
			var bottletotal = $('bottletotal');
			var boxtotal = $('boxtotal');
			var boxstatus = $('boxstatus');
			var subtotal = $('subtotal');
			var shipcost = $('shipcost');
			var shippingtotal = $('shippingtotal');
			var grandtotal = $('grandtotal');
			
			var order_qty = $$('.order_qty');
			var order_linetotal = $$('.order_linetotal');
			
			// update bottletotal
			var bottletotal_val = 0;
			order_qty.each(function(el, i) {
				if ( parseInt(el.value) > 0 )
					bottletotal_val += parseInt(el.value);
				var price = $('price_'+el.id).value;
				$('total_'+el.id).value = (parseInt(el.value) * price).toFixed(2);
			});
			bottletotal.value = bottletotal_val;
					
			// update boxtotal
			var boxtotal_val = parseInt(bottletotal.value / 6);
			boxtotal.value = boxtotal_val;
			
			// update boxtotal_status
			if ( bottletotal_val > 0 && boxtotal_val * 6 == bottletotal_val ) {
				if ( boxtotal_val == 1 ) {
					boxstatus.innerHTML = '<span style="color: green; font-weight: bold;">You have the correct number of bottles for '+(boxtotal_val)+' box of wine.</span>';
				} else {
					boxstatus.innerHTML = '<span style="color: green; font-weight: bold;">You have the correct number of bottles for '+(boxtotal_val)+' boxes of wine.</span>';
				}
			} else if ( bottletotal_val > 0 ) {
				var bottles_rem = (6-(bottletotal_val - (boxtotal_val * 6)));
				if ( bottles_rem == 1 ) {
					boxstatus.innerHTML = '<span style="color: red; font-weight: bold;">You must order '+(bottles_rem)+' more bottle to fill the box.</span>';
				} else {
					boxstatus.innerHTML = '<span style="color: red; font-weight: bold;">You must order '+(bottles_rem)+ ' more bottles to fill the box.</span>';
				}
			} else {
				boxstatus.innerHTML = '<span style="color: red; font-weight: bold;">You must order 6 more bottles to fill the box.</span>';
			}
			
			// update subtotal
			var subtotal_val = 0.00;
			order_linetotal.each(function(el, i) {
				subtotal_val += parseFloat(el.value);
			});
			subtotal.value = subtotal_val.toFixed(2);
			
			// update shipping total
			var shipcost_val = parseFloat(shipcost.value);
			if ( shipcost_val > 0 && boxtotal_val > 0 ) {
				// setup the shippingtotal
				var shippingtotal_val = (shipcost_val * boxtotal_val).toFixed(2);
				
				// if we have more >= 2 boxes, 20% discount
				if ( boxtotal_val >= 2 ) {
					shippingtotal_val = (shippingtotal_val * 0.8).toFixed(2);
				}
			} else {
				var shippingtotal_val = 'N/A';
			}
			shippingtotal.value = shippingtotal_val;
			
			// update the grandtotal
			if ( parseFloat(shippingtotal_val) > 0 ) {
				var grandtotal_val = (parseFloat(shippingtotal_val) + parseFloat(subtotal_val)).toFixed(2);
			} else {
				var grandtotal_val = 'N/A';
			}
			grandtotal.value = grandtotal_val;
		}
		
		// run orderform refresh once!
		orderform_refresh();

		$('orderform').addEvent('submit', function(e) {
			// refresh orderform
			orderform_refresh();
			
			// check to see if the number of bottles is valid, and that the shippingtotal_val > 0 and grandtotal_val > 0
			var bottletotal = $('bottletotal').value;
			var boxtotal = $('boxtotal').value;
			var shippingtotal = $('shippingtotal').value;
			var grandtotal = $('grandtotal').value;
			
			// number of bottles is ok?
			if ( bottletotal > 0 && (boxtotal * 6) == bottletotal ) {
				// shippingtotal and grandtotal are ok?
				if ( shippingtotal > 0 && grandtotal > 0 ) {
					return;
				} else {
					alert('You must choose your delivery province.');
				}
			} else {
				// alert the user to their error
				alert('You must orders bottles in multiples of 6.');
			}

			// stop the event
			e.stop();			
		});
	}
	
	// handle order form submit

	
	/* Handle counting of bottles, number of boxes, sub total, etc */
	

	/* FIND ALL SUNNY_IMAGE_LEFT */
	var sunny_imgs = $$('.sunny_img_left');
	if ( sunny_imgs ) {
		sunny_imgs.each(function(el, i) {
			// wrapper
			var ie_wrapper = new Element("div", {'style': 'float: left; position: relative;'});
			var wrapper = new Element("div", {'style': 'position: relative; margin-left: -35px;'});
			var img_wrapper = new Element("div", {'style': 'clear: both; padding-left: 22px; padding-right: 22px;'});
			
			// pieces
			var top_left = new Element("div", {'style': 'float: left; width: 22px; height: 22px; background: url(/img/v1/imgbox/topleft.gif) no-repeat 1px 0px;'});
			var top_right = new Element("div", {'style': 'float: right; width: 22px; height: 22px; background: url(/img/v1/imgbox/topright.gif) no-repeat;'});
			var bot_left = new Element("div", {'style': 'float: left; width: 22px; height: 22px; background: url(/img/v1/imgbox/bottomleft.gif) no-repeat 1px 0px;'});
			var bot_right = new Element("div", {'style': 'float: right; width: 22px; height: 22px; background: url(/img/v1/imgbox/bottomright.gif) no-repeat;'});
			
			// find the width of the element, add 46px
			el_width = el.getStyle('width').toInt();
			el_width += 46;
			//ie_wrapper.setStyle('width', el_width+'px');
			wrapper.setStyle('width', el_width+'px');
			
			// make a clone of the image and put wrapper around it
			el_clone = el.clone();
			el_clone.setStyle('border','1px solid #000');
			img_wrapper.grab(el_clone);

			// wrapper
			wrapper.grab(top_left);
			wrapper.grab(top_right);
			wrapper.grab(img_wrapper);
			wrapper.grab(bot_left);
			wrapper.grab(bot_right);

			// double wrap (IE SUCKS!)
			ie_wrapper.grab(wrapper);
			ie_wrapper.replaces(el);
		});
	}
	
	var sunny_imgs = $$('.sunny_img_right');
	if ( sunny_imgs ) {
		sunny_imgs.each(function(el, i) {
			// wrapper
			var ie_wrapper = new Element("div", {'style': 'float: right; position: relative;'});
			var wrapper = new Element("div", {'style': 'position: relative; margin-right: -35px;'});
			var img_wrapper = new Element("div", {'style': 'clear: both; padding-left: 22px; padding-right: 22px;'});
			
			// pieces
			var top_left = new Element("div", {'style': 'float: left; width: 22px; height: 22px; background: url(/img/v1/imgbox/topleft.gif) no-repeat;'});
			var top_right = new Element("div", {'style': 'float: right; width: 22px; height: 22px; background: url(/img/v1/imgbox/topright.gif) no-repeat -1px 0px;'});
			var bot_left = new Element("div", {'style': 'float: left; width: 22px; height: 22px; background: url(/img/v1/imgbox/bottomleft.gif) no-repeat;'});
			var bot_right = new Element("div", {'style': 'float: right; width: 22px; height: 22px; background: url(/img/v1/imgbox/bottomright.gif) no-repeat -1px 0px;'});
			
			// find the width of the element, add 46px
			el_width = el.getStyle('width').toInt();
			el_width += 46;
			//ie_wrapper.setStyle('width', el_width+'px');
			wrapper.setStyle('width', el_width+'px');
			
			// make a clone of the image and put wrapper around it
			el_clone = el.clone();
			el_clone.setStyle('border','1px solid #000');
			img_wrapper.grab(el_clone);

			// wrapper
			wrapper.grab(top_left);
			wrapper.grab(top_right);
			wrapper.grab(img_wrapper);
			wrapper.grab(bot_left);
			wrapper.grab(bot_right);

			// double wrap (IE SUCKS!)
			ie_wrapper.grab(wrapper);
			ie_wrapper.replaces(el);
		});
	}
	var sunny_imgs = $$('.sunny_img');
	if ( sunny_imgs ) {
		sunny_imgs.each(function(el, i) {
			// wrapper
			var ie_wrapper = new Element("div", {'style': 'position: relative;'});
			var wrapper = new Element("div", {'style': 'position: relative; margin: 0 auto;'});
			var img_wrapper = new Element("div", {'style': 'clear: both; padding-left: 22px; padding-right: 22px;'});
			
			// pieces
			var top_left = new Element("div", {'style': 'float: left; width: 22px; height: 22px; background: url(/img/v1/imgbox/topleft.gif) no-repeat;'});
			var top_right = new Element("div", {'style': 'float: right; width: 22px; height: 22px; background: url(/img/v1/imgbox/topright.gif) no-repeat;'});
			var bot_left = new Element("div", {'style': 'float: left; width: 22px; height: 22px; background: url(/img/v1/imgbox/bottomleft.gif) no-repeat;'});
			var bot_right = new Element("div", {'style': 'float: right; width: 22px; height: 22px; background: url(/img/v1/imgbox/bottomright.gif) no-repeat;'});
			
			// find the width of the element, add 46px
			el_width = el.getStyle('width').toInt();
			el_width += 46;
			//ie_wrapper.setStyle('width', el_width+'px');
			wrapper.setStyle('width', el_width+'px');
			
			// make a clone of the image and put wrapper around it
			el_clone = el.clone();
			el_clone.setStyle('border','1px solid #000');
			img_wrapper.grab(el_clone);

			// wrapper
			wrapper.grab(top_left);
			wrapper.grab(top_right);
			wrapper.grab(img_wrapper);
			wrapper.grab(bot_left);
			wrapper.grab(bot_right);

			// double wrap (IE SUCKS!)
			ie_wrapper.grab(wrapper);
			ie_wrapper.replaces(el);
		});
	}

});