// JavaScript Document
$(function(){	
	$('#products .largeEvents .textbox').change(function(){
		var $parentTable = $(this).closest('table');								
		var jsonTradePricesID = 'tradePrice_' + $parentTable.attr('id'); //refers to the Json array
		var jsonArray = producTradePricetJson.productTradPrices[jsonTradePricesID];
		var $parentContainer = $(this).closest('tr'); //find the parent element
		var $price = $parentContainer.find('.price');
		var decimalPrice = $price.text().split('£')[1];
		var textboxValue = $(this).val();
		var calculatedPrice;

		if(!$price.data('price')){
			$price.data('price', decimalPrice);	
		}
		if(!isNaN(textboxValue)){
			if($parentTable.is('.largeEvents') && jsonArray){ //if the table has a large event class apply trade price calculations
				if(parseInt(textboxValue) >= jsonArray[0]['from'] && parseInt(textboxValue) <= jsonArray[0]['to'])
				{				
					calculatedPrice = parseFloat(jsonArray[0]['price']);// * parseInt(textboxValue);
				}	
				else if(parseInt(textboxValue) >= jsonArray[1]['from'] && parseInt(textboxValue) <= jsonArray[1]['to'])
				{
					calculatedPrice = parseFloat(jsonArray[1]['price']);//  * parseInt(textboxValue);	
				}
				else if(parseInt(textboxValue) >= jsonArray[2]['from'])
				{
					calculatedPrice = parseFloat(jsonArray[2]['price']);//  * parseInt(textboxValue);	
				}
				else
				{
					calculatedPrice = parseFloat($price.data('price'));//  * parseInt(textboxValue)		
				}
			}else{
				if(!$(this).val()){
					calculatedPrice = $price.data('price');
				}else{ 
					calculatedPrice = parseFloat($price.data('price'));//  * parseInt(textboxValue)		
				}
			}
			calculatedPrice = addCommas(round2DecimalPlaces(calculatedPrice));
			$price.html('£' + calculatedPrice);		
		}
	});	 
	
	$('#products .largeEvents .productOption').change(function(e){
		var dropdownSelectedValue = Strip_Css_Class_Of_Whitespace($(this).find('option:selected').text());
		//1. Establish the thumb image 
		var $element = $(this)
		var $parentContainer = $element.closest('li'); //find the parent element
		var $thumbImages = $parentContainer.find('a .thumb');	
		var $thumbImage = $parentContainer.find('a .thumb.' + dropdownSelectedValue);		
		$thumbImages.hide();
		$thumbImage.fadeIn('normal');
	});
	$('#products .imageLinkPOGDescription').click(function(e){
		e.preventDefault();
		$('#ModalImage .inner').html('<div class="imgLoaderContainer"><img src="/img/ajax-loader.gif" /></div>');
		//1. Establish the thumb image that was clicked
		var $elementClicked = $(this)
		var $parent_li = $elementClicked.closest('li') //find the parent element
		var $image = $elementClicked.find('.thumb');
		var $dropdown = $parent_li.find('select:first');
		//2. Get the value of the dropdown list so that the correct large image can be found
		var dropdownSelectedValue = Strip_Css_Class_Of_Whitespace($dropdown.find('option:selected').text());
		//3. Find the larger image that relates to the current thumb that is visible
		var $largeImage = $(this).find('img.large.' + dropdownSelectedValue);
		var $largeImageHtml = $largeImage.get(0)
		//4. Open modal dialog and add the image inside 
		$('#ModalImage .inner').html($largeImageHtml);
		$('#ModalImage').modal({onOpen: modalOpen, onClose: modalClose, containerCss: {width: 640}, position: ["160px"]});
		$('#simplemodal-overlay').closeModalWithOverlay();
		$('#ModalImage .inner img').attr('style', 'display:block');
	});
	$('#crackerImageList a, #catDescription a, #products .imageLinkPOGContent, #content #designerCrackersCatImage').click(function(e){
		e.preventDefault();
		$('#ModalImage .inner').html('<div class="imgLoaderContainer"><img src="/img/ajax-loader.gif" /></div>');
		var $largeImageUrl = $(this).attr('href');
		var largeImageHtml = '<img src="' + $largeImageUrl + '" width="600" class="large" border="0" />'
		//4. Open modal dialog and add the image inside 
		$('#ModalImage .inner').html(largeImageHtml);
		$('#ModalImage').modal({onOpen: modalOpen, onClose: modalClose, containerCss: {width: 640}, position: ["160px"]});
		$('#simplemodal-overlay').closeModalWithOverlay();
		$('#ModalImage .inner img').attr('style', 'display:block');
	});
	function modalOpen(dialog) {
		dialog.overlay.fadeIn('fast', function () {
			dialog.container.slideDown('fast', function () {
				dialog.data.show().fadeIn('fast', function(){
				});	 
			});
		});
	}
	function modalClose(dialog) { 
		dialog.data.fadeOut('fast', function() {
			dialog.container.fadeOut('fast', function () {
				dialog.overlay.fadeOut('fast', function () {
					$.modal.close();
				});
			});						
		});
	}	
	$.fn.closeModalWithOverlay = function() {
		$(this).bind("click", 
			function(objEvent) {
				$.modal.close();
			}							
		);  	
	}
	//Util functions
	function Strip_Css_Class_Of_Whitespace(sClass){
		var arrClass = sClass.split(' ');
		var sNewClass = '';
		
		for(var i=0; i<arrClass.length; i++){
			sNewClass += arrClass[i]
		}
		if(sNewClass.length>0){return sNewClass.toLowerCase()}
		return '';
	}
});//end jQuery