/*

	faderSlider.js
	
	©2007 Sound Evolution Pty Ltd
	
	
	This is a javascript class for the sliding faders in the web interface
	
	
*/


function log(x)
{
	if( window.console ) window.console.log(x)
	else {
		var xyz = document.getElementById("xyz");
		if(xyz) xyz.value = x;
	}
}
		
		
		
		
function faderSlider( index, steps, left, right )
{
	this._index = index;
	this._steps = steps;
	this._left = left;
	this._right = right;
	this._tracking = false;
	
    this._mousex = 0;
    this._mousey = 0;
    this._algor = '';
	
	
	this.deltaX = 0;
	this._position = 0;
	this._snapValue = true;
}

faderSlider.prototype._index;
faderSlider.prototype._steps;
faderSlider.prototype._left;
faderSlider.prototype._right;
faderSlider.prototype._oldImages;
faderSlider.prototype._isdImages;
faderSlider.prototype._tracking;
faderSlider.prototype._deltaX;
faderSlider.prototype._faderImg;
faderSlider.prototype._position;
faderSlider.prototype._mousex;
faderSlider.prototype._mousey;
faderSlider.prototype._algor;
faderSlider.prototype._adjustPositionReceiver;
faderSlider.prototype._adjustPositionFunc;
faderSlider.prototype._snapValue;


faderSlider.prototype.test = function(x)
{
//	log(x);
}

faderSlider.prototype.prepare = function() {
	
	this._faderImg = document.getElementById("fader");
	
	this._faderImg.style.position='relative';
	this._faderImg.style.left = this._left+'px';
	
	// set the fader position to be 0
	
//	log("prepare complete");
}


faderSlider.prototype.startTracking = function(e) {
	
	if( !this._tracking )
	{
		this.getMouseXY(e);


		this._tracking = true;
		this._deltaX = parseInt(this._faderImg.style.left) - this._mousex;

//		log( "startTracking ==>  e.pageX = " + e.pageX + ", faderImg.x = " + this._faderImg.style.left + ", _deltaX = " + this._deltaX )

		document.onmousemove=faderMoveHandler;
		document.onmouseup=faderMouseUpHandler;
		document._faderBeingDragged = this;
	}
	
	if( navigator.userAgent.indexOf('MSIE') !=-1 )
	{
		return true;
	}
	
	return false; // to prevent browser dragging action in normal browsers.
}

faderSlider.prototype.trackMouse = function(e) {
	
	if( this._tracking )
	{
		this.getMouseXY(e);

//		log( "trackMouse    ==>  _mousex = " + this._mousex + ", faderImg.x = " + this._faderImg.style.left )
		
		var x = this._deltaX + this._mousex;
		
		if( x < this._left ) x = this._left;
		if( x > this._right ) x = this._right;
		
		this._faderImg.style.left = x+'px';
		
		
		x -= this._left;
		x /= (this._right - this._left);
		x *= this._steps;
		this._position = x;
		
		
		if( this._adjustPositionFunc )
		{
			var func = this._adjustPositionFunc;
			var obj;
			if( this._adjustPositionReceiver ) obj = this._adjustPositionReceiver;
			else obj = this;
			
			func.call( obj,this._position );
		}
	}
	
	if( navigator.userAgent.indexOf('MSIE') !=-1 )
	{
		return true;
	}
	
	return false; // to prevent browser dragging action in normal browsers.
}



faderSlider.prototype.finishTracking = function(e) {
	
	this.getMouseXY(e);
	
	this._tracking = false;
	document.onmouseup=null;
	document.onmousemove=null;
	document._faderBeingDragged=null;
	
	// snap the position to the nearest one.
	if( this._snapValue )
	{
		var footer = document.getElementById("footer"+this._index);
	
		var x = Math.round(this._position);
	
		x /= this._steps;
		x *= (this._right - this._left);
		x += this._left;
		this._faderImg.style.position = 'relative';
		this._faderImg.style.left = x;
	
	}
	return true;
}






faderSlider.prototype.getMouseXY = function(e) // works on IE6,FF,Moz,Opera7
{ 
  if (!e) e = window.event; // works on IE, but not NS (we rely on NS passing us the event)

  if (e)
  { 
    if (e.pageX || e.pageY)
    { // this doesn't work on IE6!! (works on FF,Moz,Opera7)
      this._mousex = e.pageX;
      this._mousey = e.pageY;
      this._algor = '[e.pageX]';
      if (e.clientX || e.clientY) this._algor += ' [e.clientX] '
    }
    else if (e.clientX || e.clientY)
    { // works on IE6,FF,Moz,Opera7
      this._mousex = e.clientX + document.body.scrollLeft;
      this._mousey = e.clientY + document.body.scrollTop;
      this._algor = '[e.clientX]';
      if (e.pageX || e.pageY) this._algor += ' [e.pageX] '
    }  
  }
}



function faderMoveHandler(e)
{
//	log('faderMoveHandler');
	
    if (e == null) { e = window.event }
	
	if( document._faderBeingDragged )
	{
		document._faderBeingDragged.trackMouse(e);
	}
	
	if( navigator.userAgent.indexOf('MSIE') !=-1 )
	{
		return false;
	}
	
	return false; // to prevent browser dragging action in normal browsers.
};


function faderMouseUpHandler(e)
{
//	log('faderMouseUpHandler');
	
    if (e == null) { e = window.event }
	
	if( document._faderBeingDragged )
	{
		document._faderBeingDragged.finishTracking(e);
	}
};









function isdDemo( index, steps, left, right )
{
	this._index = index;
	this._fader = new faderSlider( index, steps, left, right )
	this._fader._adjustPositionFunc = this.adjustPosition;
	this._fader._adjustPositionReceiver = this;
	
	this._scale = 0;
	this._isdStatus = true;
	this._oldImages = new Array();
	this._isdImages = new Array();
	
	this._steps = steps;
	
	this.setIndex( index );
	
	this._isdStatusImages = new Array();
	this._isdStatusImages[0] = new Image();
	this._isdStatusImages[0].src = "../images/ISD_Example_off.png";
	this._isdStatusImages[1] = new Image();
	this._isdStatusImages[1].src = "../images/ISD_Example_on.png";
	
	if( !this._isdStatusImg ) this._isdStatusImg = document.getElementById('status');
	if( !this._waveformImg )  this._waveformImg = document.getElementById('waveform');
	
	if( this._isdStatusImg ) {
		this._isdStatusImg.src = '../images/ISD_Example_' + (this._isdStatus?'on':'off') + '.png';
	}
//	log("loading images complete");
}


isdDemo.prototype._index;
isdDemo.prototype._fader;
isdDemo.prototype._oldImages;
isdDemo.prototype._isdImages;
isdDemo.prototype._isdStatus;
isdDemo.prototype._scale;
isdDemo.prototype._waveformImg;
isdDemo.prototype._isdStatusImg;
isdDemo.prototype._isdStatusImages;
isdDemo.prototype._steps;


isdDemo.prototype.setIndex = function( index )
{
	this._index = index;
	
	var i, image, x, src;

	// load the images
	for( i = 0; i <= this._steps; ++i )
	{
		x = Math.pow( 2, i );

//		log("Loading image i = " + i + ", x = "+x );

		// the old image
		image = new Image();
		src = "../images/ISD_Example"+index+"_old"+x+".png";
		image.src = src;
		this._oldImages[i] = image;

		// the isd image
		image = new Image();
		src = "../images/ISD_Example"+index+"_isd"+x+".png";
		image.src = src;
		this._isdImages[i] = image;
	}
	
	if( !this._waveformImg ) this._waveformImg = document.getElementById('waveform');
	
	var src;
	if( this._isdStatus ) src = this._isdImages[ this._scale ].src;
	else src = this._oldImages[ this._scale ].src;

	if( this._waveformImg ) this._waveformImg.src = src;
}

isdDemo.prototype.adjustPosition = function(position)
{
	if( document._trackingISD && this != document._trackingISD)
	{
		document._trackingISD.adjustPosition(position);
	}
	else
	{
		var x = Math.round(position);
	
		if( !this._waveformImg ) this._waveformImg = document.getElementById('waveform');
	
		if( x != this._scale )
		{
			var xyz;
			xyz = document.getElementById('xyz');
			if(xyz) xyz.value = ('position = '+x);
			
			this._scale = x;
		
			var src;
			if( this._isdStatus ) src = this._isdImages[x].src;
			else src = this._oldImages[x].src;
		
			this._waveformImg.src = src;
		}
	}
}


isdDemo.prototype.startTracking = function(e)
{
//	log ('isd-start-tracking');
	
	this._fader.startTracking(e);
	this._fader._adjustPositionFunc = this.adjustPosition;
	this._fader._adjustPositionReceiver = this;
	document._trackingISD = this;
	
	
	if( navigator.userAgent.indexOf('MSIE') !=-1 )
	{
		return true;
	}
	return false;
}


isdDemo.prototype.toggleISD = function()
{
//	log('toggle');
	
	this._isdStatus = !this._isdStatus;
	
	if( !this._isdStatusImg ) this._isdStatusImg = document.getElementById('status');
	if( !this._waveformImg )  this._waveformImg = document.getElementById('waveform');
	
	var src;
	if( this._isdStatus ) src = this._isdImages[this._scale].src;
	else src = this._oldImages[this._scale].src;
	
	this._waveformImg.src = src;
	this._isdStatusImg.src = '../images/ISD_Example_' + (this._isdStatus?'on':'off') + '.png'
	
	return this;
}








function ratingSlider( left, right )
{
	this._fader = new faderSlider( 1, 10, left, right );
	this._rating = document.getElementById('Rating');
	this._left = left;
	this._right = right;
	this._fader.prepare();
	this._fader._adjustPositionFunc = this.adjustPosition;
	this._fader._adjustPositionReceiver = this;
	this._ratingOffDiv = document.getElementById('rating_left');
	this._ratingOnDiv = document.getElementById('rating_right');
	this._ratingOnImg = document.getElementById('rating_right_img');
}


ratingSlider.prototype._fader;
ratingSlider.prototype._rating;
ratingSlider.prototype._left;
ratingSlider.prototype._right;
ratingSlider.prototype._ratingOffDiv;
ratingSlider.prototype._ratingOnDiv;
ratingSlider.prototype._ratingOnImg;


ratingSlider.prototype.startTracking = function(e)
{
//	log ('isd-start-tracking');
	
	this._fader.startTracking(e);
	this._fader._adjustPositionFunc = this.adjustPosition;
	this._fader._adjustPositionReceiver = this;
	this._fader._snapValue = false;
	
	document._trackingISD = this;
	
	if( navigator.userAgent.indexOf('MSIE') !=-1 )
	{
		return true;
	}
	return false;
}


ratingSlider.prototype.adjustPosition = function(position)
{
	var x = Math.round(position * 10.0) /10.0;	// leave one decimal place.
	
	document.rate_isd2.Rating.value = x;
	
	this.updateRatingSliderBackround( x );
}

ratingSlider.prototype.setValue = function( value )
{
	var pos = value / 10.0;
	pos *= (this._right - this._left);
	pos += this._left;
	
	if( !this._faderImg) this._faderImg = document.getElementById('fader');
	
	this._faderImg.style.left = pos+"px";
	document.rate_isd2.Rating.value = value;
	
	this.updateRatingSliderBackround( value );
}


ratingSlider.prototype.updateRatingSliderBackround = function( value )
{
	var left = 27;
	var right = 30;
	var width = 428;
	
	if( value < 0 ) value = 0.0;
	if( value > 10 ) value = 10.0;
	
	var x = left + ((width-right-left) * value / 10.0);
	x = Math.floor(x);
	this._ratingOffDiv.style.width = x+"px";
	this._ratingOnDiv.style.width = (width-x)+"px";
	this._ratingOnImg.style.left = "-" + x + "px";
}