/*
	Re-wrote Slider.js to handle 2 knobs with 2 independent values being shown.
	Class takes 3 variables on initalize: 	
			- The element that is the slider bar/backgorund
			- Knob 1 (initially small value)
			- Knob 2 (initially large value)
	
	
	Variables:
		Steps - The Value of the entire slider ex....from 0 to end is 0 to 1000.  Steps is then 1000.
				
	User Defined Functions/Events:
		onChange - Event fired when a slider is moved
		onComplete - Event fired when slider is unclicked
		onTick - Event fired when any of the sliders are moved
*/

var HF_squareFeet = new Class({														
	options: {
		step1							: 0,
		step2							: 0,
		previousEndKnob1	: 0,
		previousEndKnob2	: 0,
		lowTxt						: false,
		highTxt						: false,
		minValue					: 0,
		maxValue					: 0,
		steps							: 100,
		mode							: 'horizontal',
		offset						: 5,
		type							: false,
		id								: false,
		onChange					: Class.empty,
		onComplete				: function(){
													var lowerVal = 0;
													var higherVal = 0;
													if (this.step1 > this.step2){
														lowerVal = this.minValue + this.ratio*(this.step2-1);
														higherVal = this.minValue + this.ratio*(this.step1+1);
													}else {
														lowerVal = this.minValue + this.ratio*(this.step1-1);
														higherVal = this.minValue + this.ratio*(this.step2+1);
													}
													lowerVal = lowerVal.toPrecision(6);
													higherVal = higherVal.toPrecision(6);
													
													//MJ - Added this next line to ensure we don't get a negative value.
													if(lowerVal < 0){lowerVal = 0;}
													
													var value = [lowerVal,higherVal];
													HomeFinder.update(this.id,'null',value);
												},					
		onTick						: function(posKnob1, posKnob2){        
													this.knob1.setStyle(this.p, posKnob1+'px');
													this.knob2.setStyle(this.p, posKnob2+'px');
												}
	},
//----------------------------------------------------------------------------
	initialize: function(el, sliderSM, sliderLG, initVals){
		this.element = $(el);
		this.knob1 = $(sliderSM); 
		this.knob2 = $(sliderLG); 
		this.setOptions(this.options, initVals);
		this.id	= this.options.id;
		this.minValue = this.options.minValue;
		this.maxValue = this.options.maxValue;
		this.steps = this.options.steps;
		this.lowTxt = $(this.options.lowTxt);
		this.highTxt = $(this.options.highTxt);
		this.step1 = 0;		
		this.step2 = this.options.steps;		
	
		this.ratio = (this.maxValue - this.minValue)/this.steps;
								//-->>Values for Drag function	
		var mod, offset;
		this.z = 'x';
		this.p = 'left';
		mod = {'x': 'left', 'y': false};
		offset = 'offsetWidth';
		this.max = this.element[offset] - this.knob1[offset];
		this.max2 = this.element[offset] - this.knob2[offset] + (this.knob2[offset] * 2);  		//value to offset knob2
		this.getPos = this.element['get' + this.p.capitalize()].bind(this.element); 					//value used later in calculations		
		this.half = this.knob1[offset]/2;
		var lim = {}, lim2 = {};
		lim[this.z] = [0, this.max];
		lim2[this.z] = [-this.knob2.offsetWidth, this.max - this.knob2.offsetWidth];

		this.drag = new Drag.Base(this.knob1, {	
			limit				: lim,
			modifiers		: mod,
			snap				: 0,
			onStart			: function(){  this.draggedKnob1();  }.bind(this),
			onDrag			: function(){  this.draggedKnob1();  }.bind(this),
			onComplete	: function(){
											this.draggedKnob1();
											this.endKnob1();
										}.bind(this)
		});
		
		this.drag2 = new Drag.Base(this.knob2, {
			limit				: lim2,
			modifiers		: mod,
			onStart			: function(){  this.draggedKnob2();  }.bind(this),
			onDrag			: function(){  this.draggedKnob2();  }.bind(this),
			onComplete	: function(){ 
											this.draggedKnob2();
											this.endKnob2();
										}.bind(this)
		});
		
	if (this.options.initialize) this.options.initialize.call(this);  //Not sure about this one either		
	},
//----------------------------------------------------------------------------
//custom call for home Finder initializiation
	getHighLow: function(){
		var lowerVal = 0;
		var higherVal = 0;
		if (this.step1 > this.step2){
			lowerVal = this.minValue + this.ratio*(this.step2-1);
			higherVal = this.minValue + this.ratio*(this.step1+1);
		}else {
			lowerVal = this.minValue + this.ratio*(this.step1-1);
			higherVal = this.minValue + this.ratio*(this.step2+1);
		}
		lowerVal = lowerVal.toPrecision(6);
		higherVal = higherVal.toPrecision(6);
		var value = [lowerVal,higherVal];
		return value;
	},

//----------------------------------------------------------------------------	
	set: function(stepSM, stepLG){			
		if ((stepLG > this.steps) || (!stepLG)) stepLG = this.steps;
		if ((stepSM < 0) || (!stepSM)) stepSM = 0;		
		this.stepSM = stepSM;
		this.stepLG = stepLG;
		this.checkStepKnob1();
		this.checkStepKnob2();
		if (this.previousEndKnob1 != this.step1) { this.previousEndKnob1 = this.step1; }
		if (this.previousEndKnob2 != this.step2) { this.previousEndKnob2 = this.step2; }
		this.updateText(stepSM, stepLG);
		this.fireEvent('onTick', [this.toPosition(stepSM), this.toPosition(stepLG-7)]);
		return this;
	},
//----------------------------------------------------------------------------
	draggedKnob1: function(){
		this.step1 = this.toStep1(this.drag.value.now[this.z]);
		this.checkStepKnob1();
	},
//----------------------------------------------------------------------------
	draggedKnob2: function(){
		this.step2 = this.toStep2(this.drag2.value.now[this.z]);
		this.checkStepKnob2();
	},	
//----------------------------------------------------------------------------	
	checkStepKnob1: function(){
		if (this.previousEndKnob1 != this.step1){
			if(this.step1 > this.step2) {	this.updateText('null',this.step1); }
			else 	{ this.updateText(this.step1,'null'); }
			this.fireEvent('onChange'); 
		}
	},
//----------------------------------------------------------------------------
	checkStepKnob2: function(){		
		if (this.previousChange2 != this.step2){
			if(this.step2 < this.step1)	{ this.updateText(this.step2,'null');	}
			else { this.updateText('null',this.step2);	}
			this.fireEvent('onChange');
		}
	},
//----------------------------------------------------------------------------		
	endKnob1: function(){
		if (this.previousEndKnob1 != this.step1){
			this.previousEndKnob1 = this.step1;
			this.fireEvent('onComplete');
		}
	},	
//----------------------------------------------------------------------------	
	endKnob2: function(){
		if (this.previousEndKnob2 != this.step2){
			this.previousEndKnob2 = this.step2;
			this.fireEvent('onComplete');
		}
	},
//----------------------------------------------------------------------------			
	toStep1: function(position){		//formats the value passed into for use on the slider
		return Math.round(position/this.max*this.steps); 
	},
//----------------------------------------------------------------------------	
	toStep2: function(position){		//formats the value passed into for use on the slider
		return Math.round((position+this.knob2.offsetWidth)/this.max*this.steps);  //accounts for offset by knob2
	},
//----------------------------------------------------------------------------	
	toPosition: function(step){		//this returns a number, basically a percentage of the bar
		return (this.max)*step/this.steps;
	},	
//----------------------------------------------------------------------------		
	updateText: function(valueSm, valueLg){
		if((valueSm == 'null') && (valueLg != 'null')){
			this.highTxt.setHTML('To: '+this.formatText(this.minValue + this.ratio*valueLg)+'ft');
		}else if ((valueLg == 'null') && (valueSm != 'null')){
			this.lowTxt.setHTML('From: '+this.formatText(this.minValue + this.ratio*valueSm)+'ft');
		}else{
			this.lowTxt.setHTML('From: '+this.formatText(this.minValue + this.ratio*valueSm)+'ft');
			this.highTxt.setHTML('To: '+this.formatText(this.minValue + this.ratio*valueLg)+'ft');
		}
	},
//----------------------------------------------------------------------------	
	formatText: function(value){
			return Math.max(value.toFixed(0),0);
	},
//----------------------------------------------------------------------------		
	update: function(valueSm, valueLg, knob1Val, knob2Val ){
		//alert(valueSm+'  :  '+valueLg);
					//save previous values
		var prevRatio = this.ratio;
		var prevMinValue = this.minValue;
		var prevMaxValue = this.maxValue;
		var knobLow;
		var knobHigh;
		var newStep1;
		var newStep2;
					//set new upper/lower values and calc new ratio
		this.minValue = valueSm;
		this.maxValue = valueLg;
		
		this.ratio = (this.maxValue - this.minValue)/this.steps;
				//decide which knob is at the lower value
		if (this.step1 < this.step2) {
			knobLow = this.step1;
			knobHigh = this.step2;
		}else{
			knobLow = this.step2;
			knobHigh = this.step1;
		}
		//alert(this.step1+'  :  '+this.step2);
		//alert(knobLow+'  :  '+knobHigh);
		//alert((prevMinValue + prevRatio*this.step1));
		//alert((prevMinValue + prevRatio*this.step2));
/*		if ((prevMinValue + prevRatio*knobLow) <= this.minValue) {
					then the step 1 becomes the minValue -- get new step value for step1
					alert('step1 is smaller than New minValue');
			newStep1 = 0;
		}
		if ((prevMinValue + prevRatio*knobLow) > this.minValue) {
					then the step 1 maintains value but needs new step position based on new minValue/ratio
					alert('step1 is larger than New minValue');
			var tempValue = (prevMinValue + prevRatio*knobLow);
			newStep1 = (tempValue - this.minValue)/this.ratio;	
		}
		if ((prevMinValue + prevRatio*knobHigh) < this.maxValue) {
					then the step 2 maintains value but needs new step position based on new maxValue/ratio
					alert('step2 is smaller than New maxValue');
			var tempValue = (prevMinValue + prevRatio*knobHigh);
			newStep2 = (tempValue - this.minValue)/this.ratio;
		}
		if ((prevMinValue + prevRatio*knobHigh) >= this.maxValue) {
					then the step 2 becomes max value
					alert('step2 is larger than New maxValue');
			newStep2 = 100;
		}*/
		
		//have to take knob1 Value and figure out step
		if(knob1Val == valueSm){
			newStep1 = 0;
		} else {
			newStep1 = ((knob1Val - valueSm)/this.ratio) + 1;	//account for change in variables
		}
		//have to take knob2 Value and figure out step	
		if(knob2Val == valueLg){
			newStep2 = 100;
		} else {
			newStep2 = ((knob2Val - valueSm)/this.ratio) - 1;
			
		}
		
		//alert('Knob Valu 1:  '+knob1Val+'  stepVal: '+newStep1+'  Knob Valu 2: '+knob2Val+'  StepVal2: '+newStep2);
			
		this.set(newStep1, newStep2);
	}

});
//----------------------------------------------------------------------------
HF_squareFeet.implement(new Events);
HF_squareFeet.implement(new Options);