//Javascript / jQuery for diamond search
//Author: Jarod Knoten
//Date: 06/12/2009
//Adds slider functionality and AJAX controls to the loose certified diamond search page

// set default cookie values
$(function() {
	if ( $.cookie('looseSearch') == null) {
	
		$.cookie('caratLow', 0 );
		$.cookie('caratHigh', 10 );
		$.cookie('priceLow', 100 );
		$.cookie('priceHigh', 50000 );
		$.cookie('clarityLow', 1 );
		$.cookie('clarityHigh', 10 );
		$.cookie('cutLow', 1 );
		$.cookie('cutHigh', 4 );
		$.cookie('colorLow', 1 );
		$.cookie('colorHigh', 13 );
		$.cookie('start', 1 );
		$.cookie('results', 10 );
		$.cookie('shape', 'Round' );
		$.cookie('sortLoose', 'loose_retail_cost%20DESC' );
		
	}
});

//Slider controls (Builds sliders and handles slide labels)
$(function() {
	//---------Carat Weight Slider Functionality ----------
    $("#caratSlider").slider({
    	range: true,
    	min: 0,
    	max: 10,
    	values: [$.cookie( 'caratLow' ), $.cookie( 'caratHigh' )],
    	step: .05,
    	animate: true,
    	stop: function(event, ui) {
    		//set slider values when the slider changes
    		$("#caratLabel").val(ui.values[0] + 'ct - ' +  ui.values[1] + 'ct');
    		$.cookie( 'caratLow', ui.values[0] );
    		$.cookie( 'caratHigh', ui.values[1] );
    		updateDiv();
    	},
    	slide: function(event, ui) {
    		$("#caratLabel").val(ui.values[0] + 'ct - ' +  ui.values[1] + 'ct');
    	}
    });//end carat build slider
    
    //Set initial slider values at page load for carat weight fields
    $("#caratLabel").val($("#caratSlider").slider("values", 0) + ' - ' + $("#caratSlider").slider("values", 1));
    $("#weightLow").val( $("#caratSlider").slider("values", 0) );
    $("#weightHigh").val( $("#caratSlider").slider("values", 1) );
    
    //---------Price Slider Functionality ----------
		$("#priceSlider").slider({
			range: true,
			min: 100,
			max: 50000,
			step: 100,
			values: [$.cookie('priceLow'), $.cookie('priceHigh')],
			animate: true,
			stop: function(event, ui) {
				if (ui.values[1] < 50000) {
					$("#priceLabel").val('$' + ui.values[0] + ' - $' + ui.values[1]);
				}
				else {
					$("#priceLabel").val('$' + ui.values[0] + ' - $' + ui.values[1] + "+");
				}
				$.cookie('priceLow', ui.values[0] );
				$.cookie('priceHigh', ui.values[1] );
				updateDiv();
		
			},
			slide: function(event, ui) {
				if (ui.values[1] < 50000) {
					$("#priceLabel").val('$' + ui.values[0] + ' - $' + ui.values[1]);
				}
				else {
					$("#priceLabel").val('$' + ui.values[0] + ' - $' + ui.values[1] + "+");
				}
			}
		});//enda price build slider
		
		//Set initial slider values at page load for price fields
		$("#priceLabel").val('$' + $("#priceSlider").slider("values", 0) + ' - $' + $("#priceSlider").slider("values", 1) + "+");

		
	//---------Clarity Slider Functionality ----------
		$("#claritySlider").slider({
			range: true,
			min: 1,
			max: 10,
			step: 1,
			values: [parseInt( $.cookie('clarityLow') ), parseInt( $.cookie('clarityHigh') )],
			animate: true,
			slide: function(event, ui) {
			
				switch(ui.values[0]) 
				{
				case 1: var clarityName = "FL"; break;
				case 2: var clarityName = "IF"; break;
				case 3: var clarityName = "VVS1"; break;
				case 4: var clarityName = "VVS2"; break;
				case 5: var clarityName = "VS1"; break;
				case 6: var clarityName = "VS2"; break;
				case 7: var clarityName = "SI1"; break;
				case 8: var clarityName = "SI2"; break;
				case 9: var clarityName = "I1"; break;
				case 10: var clarityName = "I2"; break;
				default: var clarityName = "Err.";
				}
				
				switch(ui.values[1]) 
				{
				case 1: var clarityName2 = "FL"; break;
				case 2: var clarityName2 = "IF"; break;
				case 3: var clarityName2 = "VVS1"; break;
				case 4: var clarityName2 = "VVS2"; break;
				case 5: var clarityName2 = "VS1"; break;
				case 6: var clarityName2 = "VS2"; break;
				case 7: var clarityName2 = "SI1"; break;
				case 8: var clarityName2 = "SI2"; break;
				case 9: var clarityName2 = "I1"; break;
				case 10: var clarityName2 = "I2"; break;
				default: var clarityName2 = "Err.";
				}
			
				$("#clarityLabel").val(clarityName + ' clarity - ' + clarityName2 + ' clarity');
				
			},
			stop:  function(event, ui) {
				$.cookie('clarityLow', ui.values[0] );
				$.cookie('clarityHigh', ui.values[1] );
				updateDiv();
			}
		});
		
		switch($("#claritySlider").slider("values", 0)) 
				{
				case 1: var clarityName = "FL"; break;
				case 2: var clarityName = "IF"; break;
				case 3: var clarityName = "VVS1"; break;
				case 4: var clarityName = "VVS2"; break;
				case 5: var clarityName = "VS1"; break;
				case 6: var clarityName = "VS2"; break;
				case 7: var clarityName = "SI1"; break;
				case 8: var clarityName = "SI2"; break;
				case 9: var clarityName = "I1"; break;
				case 10: var clarityName = "I2"; break;
				default: var clarityName = "Err.";
				}
				
				switch($("#claritySlider").slider("values", 1)) 
				{
				case 1: var clarityName2 = "FL"; break;
				case 2: var clarityName2 = "IF"; break;
				case 3: var clarityName2 = "VVS1"; break;
				case 4: var clarityName2 = "VVS2"; break;
				case 5: var clarityName2 = "VS1"; break;
				case 6: var clarityName2 = "VS2"; break;
				case 7: var clarityName2 = "SI1"; break;
				case 8: var clarityName2 = "SI2"; break;
				case 9: var clarityName2 = "I1"; break;
				case 10: var clarityName2 = "I2"; break;
				default: var clarityName2 = "Err.";
				}
		
		$("#clarityLabel").val(clarityName + ' clarity - ' + clarityName2 + ' clarity');
		
		//---------Cut Slider Functionality ----------
		$("#cutSlider").slider({
			range: true,
			min: 1,
			max: 4,
			step: 1,
			values: [parseInt( $.cookie('cutLow') ), parseInt( $.cookie('cutHigh') )],
			animate: true,
			slide: function(event, ui) {
			
				switch(ui.values[0]) 
				{
				case 4: var cutName = "Fair"; break;
				case 3: var cutName = "Good"; break;
				case 2: var cutName = "Very Good"; break;
				case 1: var cutName = "Excellent"; break;
				default: var cutName = "Err.";
				}
				
				switch(ui.values[1]) 
				{
				case 4: var cutName2 = "Fair"; break;
				case 3: var cutName2 = "Good"; break;
				case 2: var cutName2 = "Very Good"; break;
				case 1: var cutName2 = "Excellent"; break;
				default: var cutName2 = "Err.";
				}
				
				$("#cutLabel").val(cutName + ' Cut - ' + cutName2 + ' Cut');
			},
			stop: function(event, ui) {
				$.cookie('cutLow', ui.values[0] );
				$.cookie('cutHigh', ui.values[1] );
				updateDiv();
			}
			
		});
		
		switch($("#cutSlider").slider("values", 0)) 
				{
				case 4: var cutName = "Fair"; break;
				case 3: var cutName = "Good"; break;
				case 2: var cutName = "Very Good"; break;
				case 1: var cutName = "Excellent"; break;
				default: var cutName = "Err.";
				}
				
				switch($("#cutSlider").slider("values", 1)) 
				{
				case 4: var cutName2 = "Fair"; break;
				case 3: var cutName2 = "Good"; break;
				case 2: var cutName2 = "Very Good"; break;
				case 1: var cutName2 = "Excellent"; break;
				default: var cutName2 = "Err.";
				}
		
		$("#cutLabel").val(cutName + ' Cut - ' + cutName2 + ' Cut');
		
		//---------Color Slider Functionality ----------
		$("#colorSlider").slider({
			range: true,
			min: 1,
			max: 13,
			step: 1,
			values: [parseInt( $.cookie('colorLow') ), parseInt( $.cookie('colorHigh') )],
			slide: function(event, ui) {
				
				switch(ui.values[0]) 
				{
				case 1: var colorName = "D"; break;
				case 2: var colorName = "E"; break;
				case 3: var colorName = "F"; break;
				case 4: var colorName = "G"; break;
				case 5: var colorName = "H"; break;
				case 6: var colorName = "I"; break;
				case 7: var colorName = "J"; break;
				case 8: var colorName = "K"; break;
				case 9: var colorName = "L"; break;
				case 10: var colorName = "M"; break;
				case 11: var colorName = "N"; break;
				case 12: var colorName = "O"; break;
				case 13: var colorName = "P"; break;
				default: var colorName = "err.";
				}
				
				switch(ui.values[1]) 
				{
				case 1: var colorName2 = "D"; break;
				case 2: var colorName2 = "E"; break;
				case 3: var colorName2 = "F"; break;
				case 4: var colorName2 = "G"; break;
				case 5: var colorName2 = "H"; break;
				case 6: var colorName2 = "I"; break;
				case 7: var colorName2 = "J"; break;
				case 8: var colorName2 = "K"; break;
				case 9: var colorName2 = "L"; break;
				case 10: var colorName2 = "M"; break;
				case 11: var colorName2 = "N"; break;
				case 12: var colorName2 = "O"; break;
				case 13: var colorName2 = "P"; break;
				default: var colorName2 = "err.";
				}
				
				$("#colorLabel").val(colorName + ' color - ' + colorName2 + ' color');
				
				},
				stop: function(event, ui) {
					$.cookie('colorLow', ui.values[0] );
					$.cookie('colorHigh', ui.values[1] );
					updateDiv();
				}
		});
		
		switch($("#colorSlider").slider("values", 0)) 
				{
				case 1: var colorName = "D"; break;
				case 2: var colorName = "E"; break;
				case 3: var colorName = "F"; break;
				case 4: var colorName = "G"; break;
				case 5: var colorName = "H"; break;
				case 6: var colorName = "I"; break;
				case 7: var colorName = "J"; break;
				case 8: var colorName = "K"; break;
				case 9: var colorName = "L"; break;
				case 10: var colorName = "M"; break;
				case 11: var colorName = "N"; break;
				case 12: var colorName = "O"; break;
				case 13: var colorName = "P"; break;
				default: var colorName = "err.";
				}
				
				switch($("#colorSlider").slider("values", 1)) 
				{
				case 1: var colorName2 = "D"; break;
				case 2: var colorName2 = "E"; break;
				case 3: var colorName2 = "F"; break;
				case 4: var colorName2 = "G"; break;
				case 5: var colorName2 = "H"; break;
				case 6: var colorName2 = "I"; break;
				case 7: var colorName2 = "J"; break;
				case 8: var colorName2 = "K"; break;
				case 9: var colorName2 = "L"; break;
				case 10: var colorName2 = "M"; break;
				case 11: var colorName2 = "N"; break;
				case 12: var colorName2 = "O"; break;
				case 13: var colorName2 = "P"; break;
				default: var colorName2 = "err.";
				}
		
		$("#colorLabel").val(colorName + ' color - ' + colorName2 + ' color');
    
});//End sliders

// Diamond Shape selector functionality
$(function() {

     //Round Image functionality
	$("#roundImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/b-checked.jpg");
				$.cookie('shape', 'Round' );
				noGlow( "Round" );
				updateDiv();
        })
       
     // Princess Image functionality   
     $("#princessImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/pr-checked.jpg");
				$.cookie('shape', 'Princess' );
				noGlow( "Princess" );
				updateDiv();
        })

	//Marquise Image functionality
	$("#marquiseImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/m-checked.jpg");
				$.cookie('shape', 'Marquise' );
				noGlow( "Marquise" );
				updateDiv();
        })
       
     // Emerald Image functionality   
     $("#emeraldImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/e-checked.jpg");
				$.cookie('shape', 'Emerald' );
				noGlow( "Emerald" );
				updateDiv();
        })
     
     //Asscher Image functionality
	$("#asscherImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/ass-checked.jpg");
				$.cookie('shape', 'Asscher' );
				noGlow( "Asscher" );
				updateDiv();
        })
       
     // Oval Image functionality   
     $("#ovalImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/o-checked.jpg");
				$.cookie('shape', 'Oval' );
				noGlow( "Oval" );
				updateDiv();
        })

	//Radient Image functionality
	$("#radientImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/r-checked.jpg");
				$.cookie('shape', 'Radiant' );
				noGlow( "Radiant" );
				updateDiv();
        })
       
     // Pear Image functionality   
     $("#pearImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/p-checked.jpg");
				$.cookie('shape', 'Pear' );
				noGlow( "Pear" );
				updateDiv();
        })
        
      // Cuchion Image functionality   
     $("#cushionImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/c-checked.jpg");
				$.cookie('shape', 'Cushion' );
				noGlow( "Cushion" );
				updateDiv();
        })

	//Triangle Image functionality
	$("#triangleImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/t-checked.jpg");
				$.cookie('shape', 'Triangle' );
				noGlow( "Triangle" );
				updateDiv();
        })
       
     //Heart Image functionality   
     $("#heartImage")
		.click(function() { 
				$(this).attr("src", "images/certified/selectors/h-checked.jpg");
				$.cookie('shape', 'Heart' );
				noGlow( "Heart" );
				updateDiv();
        })
        
});//End Shape selectors

//Pagination Button functionality 
$(function() {
	   
     $("#previousButton")
		.click(function() {
			$.cookie('start',  parseInt( $.cookie('start') )  - parseInt( $.cookie('results') )  );
			updateDivNoStart();
        })
        
      //Next Button functionality   
     $("#nextButton")
		.click(function() { 
			$.cookie('start',  parseInt( $.cookie('start') ) + parseInt( $.cookie('results') ) );
			updateDivNoStart();
        })
        
     //Result count selector functionality   
     $("#resultsSelector")
		.change(function() { 
			$.cookie('results',  document.getElementById('resultsSelector').value );
			updateDiv();
        })
        
     //Sort selector functionality   
     $("#sortSelector")
		.change(function() { 
			$.cookie('sortLoose',  document.getElementById('sortSelector').value );
			updateDiv();
        })

});// End Pagination controler


//function to update display data (Also resets page number to one)
function updateDiv() {
	$.cookie('start', 1);
    
     //Disable previous button if on the first page of results otherwise activate it
     if (  parseInt( $.cookie('start') ) <= 1 )
    	{
    		$("#previousButton").attr("disabled", "disabled");
    		$.cookie('start', 1);
    	}
    else
    	 {
    		$("#previousButton").removeAttr("disabled");
    	}
    
    //Disable next button if on the first page of results otherwise activate it
    if ( parseInt( $.cookie('start') ) + parseInt( $.cookie('results') )  >= parseInt( document.getElementById("recordcount").value )  )
    	{
    		$("#nextButton").attr("disabled", "disabled");
    	}
    else
    	 {
    		$("#nextButton").removeAttr("disabled");
    	}
    	
    var theUrl;
    var theUrl = "cfc/loose-certified-output.cfm?" + 
    			  "&caratLow=" + $.cookie('caratLow') +
    			  "&caratHigh=" + $.cookie('caratHigh') +
    			  "&priceLow=" + $.cookie('priceLow') + 
    			  "&priceHigh=" + $.cookie('priceHigh') +
    			  "&clarityLow=" + $.cookie('clarityLow') + 
    			  "&clarityHigh=" + $.cookie('clarityHigh') +
    			  "&cutLow=" + $.cookie('cutLow') + 
    			  "&cutHigh=" + $.cookie('cutHigh') +
    			  "&colorLow=" + $.cookie('colorLow') + 
    			  "&colorHigh=" + $.cookie('colorHigh') +
    			  "&start=" + parseInt( $.cookie('start' ) ) +
    			  "&results=" + $.cookie('results') +
    			  "&shape=" + $.cookie('shape') +
    			  "&sort=" + $.cookie( 'sortLoose' );
	  
    $.cookie('looseSearch', theUrl );
    $('#certifiedDisplay').load(theUrl);

}// END updateDiv

//function to update display data (Pages through listings)
function updateDivNoStart() {

    //Disable previous button if on the first page of results otherwise activate it
     if ( parseInt( $.cookie('start') )  <= 1 )
    	{
    		$("#previousButton").attr("disabled", "disabled");
    		$.cookie('start', 1);
    	}
    else
    	 {
    		$("#previousButton").removeAttr("disabled");
    	}
    
    //Disable next button if on the first page of results otherwise activate it
    if ( parseInt( $.cookie('start') ) + parseInt( $.cookie('results') )  >= parseInt( document.getElementById("recordcount").value )  )
    	looseSearch
    else
    	 {
    		$("#nextButton").removeAttr("disabled");
    	}
    	
    var theUrl;	
    var theUrl = "cfc/loose-certified-output.cfm?" + 
    			  "&caratLow=" + $.cookie('caratLow') +
    			  "&caratHigh=" + $.cookie('caratHigh') +
    			  "&priceLow=" + $.cookie('priceLow') + 
    			  "&priceHigh=" + $.cookie('priceHigh') +
    			  "&clarityLow=" + $.cookie('clarityLow') + 
    			  "&clarityHigh=" + $.cookie('clarityHigh') +
    			  "&cutLow=" + $.cookie('cutLow') + 
    			  "&cutHigh=" + $.cookie('cutHigh') +
    			  "&colorLow=" + $.cookie('colorLow') + 
    			  "&colorHigh=" + $.cookie('colorHigh') +
    			  "&start=" + parseInt( $.cookie('start' ) ) +
    			  "&results=" + $.cookie( 'results' ) +
    			  "&shape=" + $.cookie( 'shape' ) +
    			  "&sort=" + $.cookie( 'sortLoose' );
	  
    $.cookie('looseSearch', theUrl ); 
    $('#certifiedDisplay').load(theUrl);
    
}// END updateDivNoStart

//Function takes away other diamonds healthy glow
function noGlow( theGlower ) {

	if( theGlower != "Princess" ) {
		$("#princessImage").attr("src", "images/certified/selectors/pr.jpg");
	}
	else {
		$("#princessImage").attr("src", "images/certified/selectors/pr-checked.jpg");
	}
		
	if( theGlower != "Round" ) {
		$("#roundImage").attr("src", "images/certified/selectors/b.jpg");
	}
	else{
		$("#roundImage").attr("src", "images/certified/selectors/b-checked.jpg");
	}
	
	if( theGlower != "Marquise" ) {
		$("#marquiseImage").attr("src", "images/certified/selectors/m.jpg");
	}
	else{
		$("#marquiseImage").attr("src", "images/certified/selectors/m-checked.jpg");
	}
		
	if( theGlower != "Emerald" ) {
		$("#emeraldImage").attr("src", "images/certified/selectors/e.jpg");
	}
	else{
		$("#emeraldImage").attr("src", "images/certified/selectors/e-checked.jpg");
	}
	
	if( theGlower != "Asscher" ) {
		$("#asscherImage").attr("src", "images/certified/selectors/ass.jpg");
	}
	else{
		$("#asscherImage").attr("src", "images/certified/selectors/ass-checked.jpg");
	}
		
	if( theGlower != "Oval" ) {
		$("#ovalImage").attr("src", "images/certified/selectors/o.jpg");
	}
	else{
		$("#ovalImage").attr("src", "images/certified/selectors/o-checked.jpg");
	}
	
	if( theGlower != "Pear" ) {
		$("#pearImage").attr("src", "images/certified/selectors/p.jpg");
	}
	else{
		$("#pearImage").attr("src", "images/certified/selectors/p-checked.jpg");
	}
		
	if( theGlower != "Cushion" ) {
		$("#cushionImage").attr("src", "images/certified/selectors/c.jpg");
	}
	else{
		$("#cushionImage").attr("src", "images/certified/selectors/c-checked.jpg");
	}
		
	if( theGlower != "Heart" ) {
		$("#heartImage").attr("src", "images/certified/selectors/h.jpg");
	}
	else{
		$("#heartImage").attr("src", "images/certified/selectors/h-checked.jpg");
	}
	
	if( theGlower != "Triangle" ) {
		$("#triangleImage").attr("src", "images/certified/selectors/t.jpg");
	}
	else{
		$("#triangleImage").attr("src", "images/certified/selectors/t-checked.jpg");
	}
	
	if( theGlower != "Radiant" ) {
		$("#radientImage").attr("src", "images/certified/selectors/r.jpg");
	}
	else{
		$("#radientImage").attr("src", "images/certified/selectors/r-checked.jpg");
	}
		
}

//Reseet Search functionality 
$(function() {
	   
     $("#reset")
		.click(function() {
			
			$.cookie('caratLow', 0 );
			$.cookie('caratHigh', 10 );
			$.cookie('priceLow', 100 );
			$.cookie('priceHigh', 50000 );
			$.cookie('clarityLow', 1 );
			$.cookie('clarityHigh', 10 );
			$.cookie('cutLow', 1 );
			$.cookie('cutHigh', 4 );
			$.cookie('colorLow', 1 );
			$.cookie('colorHigh', 13 );
			$.cookie('start', 1 );
			$.cookie('results', 10 );
			$.cookie('shape', 'Round' );
			$.cookie('sortLoose', 'loose_retail_cost%20DESC' );
			
			location.reload(true);
			updateDiv();

        })
        
});// End Reset Search
