// create object
var colorPicker = 
{
	// class vars
	activeBuilder: 'trim',
	activeTrim: 'sw01',
	activeRoof: 'sw01',
	activeWall: 'sw01',
	quoteRequest: false,

	// class methods
	landscape: function(jqObject)
	{
		// make this landscape active
		switch($(jqObject).attr('id'))
		{
			case 'l1':
				$(jqObject).attr('src', 'buildImages/l1Active.jpg');
				$('#l2').attr('src','buildImages/l2Inactive.jpg');
				$('#l3').attr('src','buildImages/l3Inactive.jpg');
				break;

			case 'l2':
				$('#l1').attr('src', 'buildImages/l1Inactive.jpg');
				$(jqObject).attr('src','buildImages/l2Active.jpg');
				$('#l3').attr('src','buildImages/l3Inactive.jpg');
				break;

			case 'l3':
				$('#l1').attr('src', 'buildImages/l1Inactive.jpg');
				$('#l2').attr('src','buildImages/l2Inactive.jpg');
				$(jqObject).attr('src','buildImages/l3Active.jpg');
				break;
		}

		// change landscape in main view
		$('#currentLandscape').attr('src', function()
		{
			var id = $(jqObject).attr('id');
			return 'buildImages/landscape'+id.replace('l','')+'.png';
		});
		
		// save to db if coming from quote request
		if(colorPicker.quoteRequest)
		{
			// normal ajax save
			$.ajax(
			{
				type: 'get',
				url: 'ajaxQuoteRequest.php',
				data: 'action='+$('#page').val()+'&field=color_landscape&value='+encodeURIComponent($(jqObject).attr('id').replace('l','')),
				dataType: 'xml',
				success: function(xmlDoc)
				{
					// if successful
					if($('response:first', xmlDoc).text() == 'success')
					{
						// success functionality					
					}					
				}			
			});
		}
	},

	builder: function(jqObject)
	{
		var ajaxField = null;
		
		// make this builder active
		switch($(jqObject).attr('id'))
		{
			case 'trim':
				$(jqObject).attr('src', 'buildImages/trimActive.jpg');
				$('#roof').attr('src','buildImages/roofInactive.jpg');
				$('#walls').attr('src','buildImages/wallsInactive.jpg');

				// change color to trim color
				$('img.activeSwatch').attr('class','swatch');
				$('#'+colorPicker.activeTrim).attr('class','activeSwatch');
				break;

			case 'roof':
				$('#trim').attr('src', 'buildImages/trimInactive.jpg');
				$(jqObject).attr('src','buildImages/roofActive.jpg');
				$('#walls').attr('src','buildImages/wallsInactive.jpg');

				// change color to trim color
				$('img.activeSwatch').attr('class','swatch');
				$('#'+colorPicker.activeRoof).attr('class','activeSwatch');
				break;

			case 'walls':
				$('#trim').attr('src', 'buildImages/trimInactive.jpg');
				$('#roof').attr('src','buildImages/roofInactive.jpg');
				$(jqObject).attr('src','buildImages/wallsActive.jpg');

				// change color to trim color
				$('img.activeSwatch').attr('class','swatch');
				$('#'+colorPicker.activeWall).attr('class','activeSwatch');
				break;
		}

		// update class property
		colorPicker.activeBuilder = $(jqObject).attr('id');		
	},

	color: function(jqObject)
	{
		var newSrc;
		var ajaxField;
		
		// change color of roof/trim/walls depending on what is selected
		switch(colorPicker.activeBuilder)
		{
			case 'trim':
				newSrc = 'buildImages/'+$(jqObject).attr('id').replace('sw','tc')+'.png';		
				$('#currentTrim').attr('src',newSrc);

				colorPicker.activeTrim = $(jqObject).attr('id');
				ajaxField = 'color_trim';
				break;

			case 'roof':
				newSrc = 'buildImages/'+$(jqObject).attr('id').replace('sw','rc')+'.png';
				$('#currentRoof').attr('src',newSrc);

				colorPicker.activeRoof = $(jqObject).attr('id');
				ajaxField = 'color_roof';
				break;

			case 'walls':
				newSrc = 'buildImages/'+$(jqObject).attr('id').replace('sw','wc')+'.png';
				$('#currentWall').attr('src',newSrc);

				colorPicker.activeWall = $(jqObject).attr('id');
				ajaxField = 'color_wall';
				break;
		}

		// remove active swatch and add new one
		$('img.activeSwatch').attr('class','swatch');
		$(jqObject).attr('class','activeSwatch');
		
		// save to db if coming from quote request
		if(colorPicker.quoteRequest)
		{
			var thisValue = $(jqObject).attr('id').replace('sw','')+'-'+$(jqObject).attr('contextualhelp');;
			// normal ajax save
			$.ajax(
			{
				type: 'get',
				url: 'ajaxQuoteRequest.php',
				data: 'action='+$('#page').val()+'&field='+ajaxField+'&value='+encodeURIComponent(thisValue),
				dataType: 'xml',
				success: function(xmlDoc)
				{
					// if successful
					if($('response:first', xmlDoc).text() == 'success')
					{
						// success functionality					
					}					
				}			
			});
		}
	},	

	// initial method
	init: function()
	{
		// add events to landscape choices
		$('#l1').bind('click', function() { colorPicker.landscape($(this)); });
		$('#l2').bind('click', function() { colorPicker.landscape($(this)); });
		$('#l3').bind('click', function() { colorPicker.landscape($(this)); });

		// add events to builder
		$('#trim').bind('click', function() { colorPicker.builder($(this)); });
		$('#roof').bind('click', function() { colorPicker.builder($(this)); });
		$('#walls').bind('click', function() { colorPicker.builder($(this)); });

		// add events to color
		$('img.swatch').bind('click', function() { colorPicker.color($(this)); });
		$('img.activeSwatch').bind('click', function() { colorPicker.color($(this)); });
		
		// set defaults
		colorPicker.activeTrim = 'sw15';
		colorPicker.activeRoof = 'sw13';
		colorPicker.activeWall = 'sw13';
		
		// add ajax save events if froming from quote request
		if($('#page').val() == 'quote_color')
		{
			colorPicker.quoteRequest = true;
			
			// set new defaults
			$.ajax(
			{
				type: 'get',
				url: 'ajaxQuoteRequest.php',
				data: 'action=getQuoteColor',
				dataType: 'xml',
				success: function(xmlDoc)
				{
					colorPicker.activeTrim = 'sw'+$('response > trim:first', xmlDoc).text().split('-')[0];
					colorPicker.activeRoof = 'sw'+$('response > roof:first', xmlDoc).text().split('-')[0];
					colorPicker.activeWall = 'sw'+$('response > wall:first', xmlDoc).text().split('-')[0];			
				}			
			});
		}
	}	
}

// add to document after dom is loaded
$(document).ready(function() { colorPicker.init(); });