// JavaScript Document

var allCollections = []
var defaultCollection = 1002


	$(function(){
			   
	function imageCycleFront() {
	
		var imgs = []
		var j = [1009006,1058001,1067013,1068003,1010001,1032006,1040005,1069001,1070001]
		for (var i=1; i<=j.length; i++) {
		//imgs[i] = new Image();
		//var j = (collid * 100) + i
		
		//imgs[i].src = '../images/global/product/' + j + '.jpg'
		
		imgs = imgs + '<img src= "images/product/main/' + j[i-1] + '.jpg">'
		//alert (imgs)
		//alert(imgs[i].src)
		}
	
		$('#mainImages').html(imgs);
		$('#mainImages').cycle('fade')
		}	
		
		// Image cycle function ##################################################
		
		function imageCycle(collid, collPhotos) {
			
				var imgs = []
			for (var i=1; i<=collPhotos; i++) {
				//imgs[i] = new Image();
				var j = (collid * 1000) + i
				
				//imgs[i].src = '../images/global/product/' + j + '.jpg'
				
				imgs = imgs + '<img src= "images/product/main/' + j + '.jpg">'
				//alert (imgs)
				//alert(imgs[i].src)
			}
			
			$('#apMainRoomset').html(imgs);
			$('#apMainRoomset').cycle('fade')
		}
		// End of Image cycle function #########################################
	
		$('#checkScript').html('')
		imageCycleFront()


		// Accordion
		$("#accordion").accordion({ header: "h3" });

		// Tabs
		$('#tabs').tabs();


		// Dialog			
		$('#dialog').dialog({
			autoOpen: false,
			width: 600,
			buttons: {
				"Ok": function() { 
					$(this).dialog("close"); 
				}, 
				"Cancel": function() { 
					$(this).dialog("close"); 
				} 
			}
		});
		
		// Dialog Link
		$('#dialog_link').click(function(){
			$('#dialog').dialog('open');
			return false;
		});

		// Datepicker
		$('#datepicker').datepicker({
			inline: true
		});
		
		// Slider
		$('#slider').slider({
			range: true,
			values: [17, 67]
		});
		
		// Progressbar
		$("#progressbar").progressbar({
			value: 20 
		});
		
		//hover states on the static widgets
		$('#dialog_link, ul#icons li').hover(
			function() { $(this).addClass('ui-state-hover'); }, 
			function() { $(this).removeClass('ui-state-hover'); }
			
		);
		
		$('#container').removeClass('hide')
		
		$('#apCollectionList').html('<img src="images/loading.gif" >');
		$('#apSmallRoomsets').html('<img src="images/loading.gif" >');
		
		// Submit button retailer form
		$('#Submit').click(function(){
									$('#Submit').attr('disabled',true)
						var inputValues = $('#retailer input')
							
							var vMailshot2
							var vMailshot = inputValues[4].checked
					if (vMailshot == true){vMailshot2 = 'Yes'}else{vblMailshot2 = 'No'}
							
									var loadParams = {sendParams:{
						vName: inputValues[0].value,
						vTown: inputValues[1].value,
						vPostcode: inputValues[2].value,
						vEmail: inputValues[3].value,
						vMailing: vMailshot2
						}}
									
									$('#orderFrameFrame').load('php/mail.sample.php',loadParams, function(response, status, xhr) {
						  if (status == "error") {
							var msg = "Sorry but there was an error please try again: ";
							alert(msg + xhr.status + " " + xhr.statusText);
						  } else {
						  }})
								$('.clearForm').attr('value','')
								$('#mailing').attr('checked', false)
								setTimeout(function(){
												$('#Submit').attr('disabled', false)
												},10000)
								
									})
								
		
		
		// Load collections (far left) and drop down in Search and start thumbnail cycle ###################
		 $.getJSON('php/get.collections.php',function(cdata) {
											  
				allCollections = cdata	
				
				var collectionLeftBar = ''
				var k = 0
				
				$('#apCollectionList').html('')
				$.each(cdata, function(collections, collName){
						
						if (collName.ID >1000){
							k = k+1 
							collectionLeftBar += '<div title1="'+collName.ID+'" class="imageFarLeft" id="photo' + collName.ID +'"><p>'+collName.Name+'</p>'	
							var imgs = []
							var j = (collName.ID)
							imgs = '<img class="farLeftTN" src= "images/product/' + j + 'cover.jpg" collid="'+collName.ID+'" title="'+collName.Name+'">'
							
							collectionLeftBar += imgs+'</div>'
						}
					
				})
				
				$('#apCollectionList').html(collectionLeftBar)
				
				for (var l=1 ; l <=k; l++) {
					$('#photo'+l).cycle('fade')
				}
				
				
					
				collid = defaultCollection
				$('#apProductHeader').html ('Collection: ' + allCollections[collid].Name)
				var collname = allCollections[collid].Name
				var collPhotos = allCollections[collid].PhotosQty
				
				
				loadCollections(collid,collname,collPhotos)
				
		})
		 
		 //End of Load collections far left and start thumbnail cycle ###########################################
		
		
		// Click a Collection far left ##########################################
		$('.imageFarLeft').live('click',function(){
														 
			var at = $(this)
			
			var collid = at.attr('title1');
			
			//var collcolour = "all";
			var collname = allCollections[collid].Name
			//var collname = at.attr('collname');
			var collPhotos = allCollections[collid].PhotosQty
			
			loadCollections(collid, collname, collPhotos);
			
			
			
		});
		// End of Click a Collection far left ##########################################
		
		$('.imageFarLeft').live('mouseover',function(){
										$('.farLeftTN').css('width','0px').css('height','0px')			 
									
									var collid = $(this).attr('id');							  
									$('#'+collid+' img').fadeIn('slow').css('width','100px').css('height','100px')
									
		})
		
		
		
		
	// Click a roomset ##########################################
		$('#apSmallRoomsets img').live('click',function(){
														 
			var at = $(this)							  
			var collid = at.attr('collid');
			
			
			$('#apMainRoomset').html('<img src="images/product/main/'+collid+'.jpg" >')
			
			
		});
		// End of Click a Collection far left ##########################################	
		
	// load collections function and image cycle initial Main image ##############################
function loadCollections (collid, collname, collPhotos) {
	
		
		var imgs2 = ['<table width="170px">']

		var prodHead = collname+' Collection'   ;
		
		
		$('#apProductHeader').html(prodHead);
		
		$('#apSmallRoomsets').html('<img src="images/loading3.gif" >');
		
		
	for (var i=1; i<=collPhotos; i++) {
		
								var j = (collid * 1000) + i
								imgs2 += '<tr><td><img class="smallRoom" src= "images/product/' + j + '.jpg" collid="'+j+'" title="'+collname+'"></td></tr>'
							}
						imgs2 += '</table>'	
			$('#apSmallRoomsets').html(imgs2)	
			
		imageCycle(collid,collPhotos)
		//loadProducts(collid, collcolour ,collname, 1);
	//	getCollapsibleStatus(1);
		//imageCycle (collid, collPhotos)
};

//End of load collections function and image cycle initial Main image	
		
	});