var ProductSelector = Class.create(
{
	initialize: function()
	{
		if (!$('productSelector'))
		{
			return false;
		}
		
		this.productSelector = $('productSelector');
		this.resultsContainer = $('resultsContainer');
		
		this.start();
	},
	
	start: function()
	{
		$('results').hide();
		this.resultsContainer.hide();
		this.productSelector.observe('submit', this.formSubmit.bind(this));
		$('viewDetails').observe('click', this.viewDetails.bind(this));
	
		$$('input[name="varied"]').each(function(el)
		{
			el.observe('click', this.viewDetails.bind(this));
		}.bind(this));
	},
	
	formSubmit: function(event)
	{
		event.stop();
		
		var inputWeight 		= this.productSelector.select('input[name="weight"]')[0];
		var inputLength 		= this.productSelector.select('input[name="length"]')[0];
		var inputDistance 		= this.productSelector.select('input[name="distance"]')[0];
		var inputSuspending 	= this.productSelector.select('select[name="suspending"]')[0];
		
		this.valueWeight 		= inputWeight.getValue();
		this.valueLength 		= inputLength.getValue();
		this.valueDistance 		= inputDistance.getValue();
		this.valueSuspending 	= parseInt(inputSuspending.getValue());
		
		var error = false;
		
		if (!this.valueWeight || isNaN(this.valueWeight))
		{
			inputWeight.addClassName('error');
			error = true;
		}
		else
		{
			inputWeight.removeClassName('error');
		}
		
		if (!this.valueLength || isNaN(this.valueLength))
		{
			inputLength.addClassName('error');
			error = true;
		}
		else
		{
			inputLength.removeClassName('error');
		}
		
		if (!this.valueDistance || isNaN(this.valueDistance))
		{
			inputDistance.addClassName('error');
			error = true;
		}
		else
		{
			inputDistance.removeClassName('error');
		}
		
		this.resultQuantity = Math.round((this.valueLength / this.valueDistance) + 1);
		
		this.weight = this.valueWeight / this.resultQuantity;
		this.resultSize = this.getSizeForWeight(this.weight);
		
		this.resultType = '';
		
		switch (this.valueSuspending)
		{
			case 1:
			case 2:
				this.resultType = 'LOOP';
				inputSuspending.removeClassName('error');
				break;
				
			case 3:
				this.resultType = 'STUD with DROP IN ANCHOR or CEILING CLIP';
				inputSuspending.removeClassName('error');
				break;
				
			case 4:
				this.resultType = 'STUD with DROP IN ANCHOR';
				inputSuspending.removeClassName('error');
				break;
				
			case 5:
				this.resultType = 'TOGGLE or STUD with WEDGE NUTS';
				inputSuspending.removeClassName('error');
				break;
		
			default:
				inputSuspending.addClassName('error');
				error = true;
				break;
		}
		
		if (error)
		{
			return false;
		}
		
		$('resultQuantity').update(this.resultQuantity);
		$('resultSize').update(this.resultSize);
		$('resultType').update(this.resultType);
		
		new Effect.SlideDown('results',
		{
			duration: 0.3
		});
	},
	
	viewDetails: function(event)
	{
		try
		{
			this.varied = event.element().getValue() != 'n';
		}
		catch(e) 
		{
			this.varied = true;
		}
		
		this.productSelector.hide();
		
		$('suspendedFrom').update(this.valueSuspending);
		$('totalWeight').update(this.valueWeight);
		$('totalLength').update(this.valueLength);
		$$('#rowDistance .main')[0].update(this.valueDistance);
		$$('#rowQuantity .main')[0].update(this.resultQuantity);
		$$('#rowWeight .main')[0].update(Math.round(this.valueWeight / this.resultQuantity));
		$$('#rowRecommended .main')[0].update(this.resultSize);
		
		this.buildColumn('vertical', 0);
		this.buildColumn('degree15', 15);
		this.buildColumn('degree30', 30);
		this.buildColumn('degree45', 45);
		this.buildColumn('degree60', 60);
		
		if (!this.doneResults)
		{
			this.resultsContainer.insert({after: new Element('div', {className: 'productSelectorResults recommendedResults'}).update($('results').innerHTML)});
		}
		
		this.doneResults = true;
		
		this.resultsContainer.show();
	},
	
	buildColumn: function(cssClass, degrees)
	{
		var weightPerHanger = this.getWeightPerHanger(this.resultSize, degrees);
		var quantity = this.varied ? this.valueWeight / weightPerHanger : this.resultQuantity;
		var distance = this.varied ? parseFloat(this.valueLength / quantity).toFixed(1) : this.valueDistance;
		
		$$('#rowDistance .'+cssClass)[0].update(distance);
		$$('#rowQuantity .'+cssClass)[0].update(Math.round(quantity));
		$$('#rowWeight .'+cssClass)[0].update(Math.round(weightPerHanger));
		$$('#rowRecommended .'+cssClass)[0].update(this.getSizeForWeight(weightPerHanger));
	},
	
	getSizeForWeight: function(weight)
	{
		if (weight < 10)
		{
			return 'No1';
		}
		else if (weight <= 45)
		{
			return 'No2';
		}
		else if (weight <= 90)
		{
			return 'No3';
		}
		else if (weight <= 225)
		{
			return 'No4';
		}
		else if (weight <= 325)
		{
			return 'No5';
		}
		else
		{
			return 'Oversized';
		}
	},
	
	getWeightPerHanger: function(hanger, degrees)
	{
		if (!degrees)
		{
			degrees = 0;
		}
		
		switch (hanger)
		{
			case 'No1':
				weightPerHanger = 10;
				break;
			
			case 'No2':
				weightPerHanger = 45;
				break;
			
			case 'No3':
				weightPerHanger = 90;
				break;
				
			case 'No4':
				weightPerHanger = 225;
				break;
				
			case 'No5':
				weightPerHanger = 325;
				break;
				
			case 'Oversized':
				weightPerHanger = 'Oversized';
				break;
		
			default:
				break;
		}
		
		if (this.varied)
		{
			return (weightPerHanger * Math.cos(degrees*Math.PI/180));
		}
		else
		{
			return (this.weight / Math.cos(degrees*Math.PI/180));
		}
	}
});

var AngleSelector = Class.create(
{
	initialize: function()
	{
		if (!$('angleSelector'))
		{
			return false;
		}
		
		drawIEBar(
		{
			link: 'http://www.opera.com/download/',
			text: 'For improved performance using this tool, we recommend that you upgrade your web browser to Opera, Mozilla Firefox or Google Chrome.'
		});
		
		this.angleSelector = $('angleSelector');
		
		this.start();
	},
	
	start: function()
	{
		this.lastValue = -1;
		
		this.updateValues(0);
		this.buildSlider();
	},
	
	buildSlider: function()
	{
		new Control.Slider('handle', 'track', {
			range: $R(0, 89),
			onSlide: false ? null : this.updateValues.bind(this),
			onChange: this.updateValues.bind(this)
		});
	},
	
	updateValues: function(v)
	{
		v = Math.round(v);
		
		if (v != this.lastValue)
		{
			this.lastValue = v;
			
			$('degree').innerHTML = v + '&deg;';
			
			v = Math.cos(v*Math.PI/180);
			
			this.updateValue('hanger1', v);
			this.updateValue('hanger2', v);
			this.updateValue('hanger3', v);
			this.updateValue('hanger4', v);
			this.updateValue('hanger5', v);
			this.updateValue('lockable4', v);
			this.updateValue('lockable5', v);
			this.updateValue('lockable6', v);
		}
	},
	
	updateValue: function(cssClass, v)
	{
		var wll = $$('#' + cssClass + ' .wll')[0].innerHTML;
		
		$$('#' + cssClass + ' .load')[0].update( Math.round(wll * v) );
	}
});

document.observe('dom:loaded', function()
{
	var productSelector = new ProductSelector();
	var angleSelector = new AngleSelector();
});