var preload = new Array();

/* ****** Variables to be set ****** */

var sliderSize = 300;  //Width of slider in pixels
var moveValue = 10;  //Value to change the slider on any action.

//preload all the images

 preload[0] = 'http://media.codefisher.org/images/webapps/slider/right.png';
 preload[1] = 'http://media.codefisher.org/images/webapps/slider/left.png';
 preload[2] = 'http://media.codefisher.org/images/webapps/slider/right_h.png';
 preload[3] = 'http://media.codefisher.org/images/webapps/slider/left_h.png';
 preload[4] = 'http://media.codefisher.org/images/webapps/slider/right_a.png';
 preload[5] = 'http://media.codefisher.org/images/webapps/slider/left_a.png';
 preload[6] = 'http://media.codefisher.org/images/webapps/slider/back.png';
 preload[7] = 'http://media.codefisher.org/images/webapps/slider/slider.png';
 preload[8] = 'http://media.codefisher.org/images/webapps/slider/slider_h.png';
 preload[9] = 'http://media.codefisher.org/images/webapps/slider/slider_a.png';

/* ****** Don't edit after this point ****** */

function loadSlider(sliderId){
 var slider = document.getElementById(sliderId);
 /* this fixes things if the page is send as HTML */
 var className = slider.className;
 if(className.toString().match && className.toString().match(/valuenow/)){
  var valueNow = className.match(/valuenow:([0-9]*)/)[1];
  var valueMin = className.match(/valuemin:([0-9]*)/)[1];
  var valueMax = className.match(/valuemax:([0-9]*)/)[1];
 } else if(document.contentType && document.contentType.match('text/html')){
  var valueNow = slider.getAttribute("aaa:valuenow");
  var valueMin = slider.getAttribute("aaa:valuemin");
  var valueMax = slider.getAttribute("aaa:valuemax");
 }
 if(valueNow){
  setAaaAttri("valuenow",slider,valueNow);
  setAaaAttri("valuemin",slider,valueMin);
  setAaaAttri("valuemax",slider,valueMax);
 }
 slider.tabIndex = 0;
 slider.setAttribute('role','role:slider');
 var nodes = slider.parentNode.childNodes;
 var i = 0;
 while(nodes[i]){
  if(nodes[i].className && nodes[i].className.match(/button/)){
   slider.setAttribute('role','role:button');
  }
  i++;
 }
 displaySlider(slider);
 // preload the images
 var image = document.createElement('img');
 image.style.display = 'none';
 var i = 0;
 while(preload[i]){
  var img = image.cloneNode(true);
  img.src = preload[i];
  document.body.appendChild(img);
  i++;
 }
}

function displaySlider(slider){

  var valueNow = getAaaAttri("valuenow", slider);
  var valueMin = getAaaAttri("valuemin", slider);
  var valueMax = getAaaAttri("valuemax", slider);

 var barWidth = slider.firstChild.scrollWidth;
 var grade = sliderSize/valueMax;

	//Set the left padding.
	var leftPad  = valueNow*grade-barWidth/2;
	// if it is less then the min width.
	if(leftPad < valueMin*grade){
		leftPad = valueMin*grade;
	}
	// if it is greater than the max width
	if(leftPad > valueMax*grade-barWidth){
		leftPad = valueMax*grade-barWidth;
	}
	//The deferance between max and the current value, were going to use it like the valueMin was
	var valueDown = valueMax-valueNow;
	//Set the right padding
	var rightPad  = valueDown*grade-barWidth/2;
	//If it is less than zero
	if(rightPad < 0){
		rightPad = 0;
	}
	//If it is too big
	if(rightPad > valueMax*grade-barWidth-valueMin*grade){
		rightPad = valueMax*grade-barWidth-valueMin*grade;
	}

	//Remove cases where *.5 is involved, this can cause the width to change by 1px if we don't fix it
	if(rightPad >= leftPad){
	var rightNew = Math.round(rightPad);
	 if(rightNew != rightPad){
		rightPad = rightNew;
		leftPad = leftPad-0.5;
		 }
	}
	if(leftPad >= rightPad){
	var leftNew = Math.round(leftPad);
	 if(leftNew != leftPad){
		leftPad = leftNew;
		rightPad = rightPad-0.5;
	 }
	}

	//set the padding
	slider.style.paddingRight  = rightPad+'px';
	slider.style.paddingLeft  = leftPad+'px';

  return false;
}
function handleSliderKey(slider, event)
{
var valueNow  = getAaaAttri("valuenow",slider);
var valueMin  = getAaaAttri("valuemin",slider);
var valueMax  = getAaaAttri("valuemax",slider);

//Find the key press and respond to it
 var delta = 0;
  if (event.keyCode == 37) {
    delta = -moveValue/2;
  }
  else if (event.keyCode == 39) {
    delta = moveValue/2;
  }
  else if (event.keyCode == 36) {
    delta = -( valueNow - valueMin );
  }
  else if (event.keyCode == 35) {
    delta = valueMax - valueNow
  }
  else {
    return true;
  }

//Stop the values going over the max and min
  valueNow += delta;
  if (valueNow < valueMin) {
    valueNow = valueMin;
  }
  if (valueNow > valueMax) {
    valueNow = valueMax;
  }

//set the value and move the slider
  setAaaAttri("valuenow",slider,valueNow);
  displaySlider(slider);

  return false;
}

function sliderButton(event, where, id)
{ 
var slider = document.getElementById(id);

var valueNow  = getAaaAttri("valuenow",slider);
var valueMin  = getAaaAttri("valuemin",slider);
var valueMax  = getAaaAttri("valuemax",slider);

if(where == 'after'){
	var value = -moveValue;
} else {
	var value = moveValue;
}

//Enter was pressed or mouse clicked on the button
 if(event.keyCode == 13 || event.button == 0){

	//Caculate new value
	var valueNow = valueNow+value;

	//Stop the values going over the max and min
	if(valueNow < valueMin){
		valueNow = valueMin;
	} else if(valueNow > valueMax) {
		valueNow = valueMax;
	}

	//set the value and move the slider
	setAaaAttri("valuenow",slider,valueNow);
	displaySlider(slider);
 }
}

function barMouseDown(event,bar) {

if (event.preventDefault) {
  event.preventDefault();
 }

   bar.id = 'active';
	setEventListener(document,'mousemove',mouseMove,true);
	setEventListener(document,'mouseup',barMouseUp,true);

  return false
}

function barMouseUp() {
var bar = document.getElementById('active');
   bar.removeAttribute('id');
   delEventListener(document,'mousemove',mouseMove,true);
   delEventListener(document,'mouseup',barMouseUp,true);
}

function mouseMove(event) {

//Get the slider we are moveing
var slider = document.getElementById('active').parentNode;

var valueNow  = getAaaAttri("valuenow",slider);
var valueMin  = getAaaAttri("valuemin",slider);
var valueMax  = getAaaAttri("valuemax",slider);

 var grade = sliderSize/valueMax;
 // Find what the new value should be and round it.
 valueNow =  event.clientX/grade-find_real_pos(slider)[0]/grade;
 valueNow = Math.round(valueNow);

  //Stop the values going over the max and min
  if (valueNow < valueMin) {
    valueNow = valueMin;
  }
  if (valueNow > valueMax) {
    valueNow = valueMax;
  }
   //set the value and move the slider
  setAaaAttri("valuenow",slider,valueNow);
  displaySlider(slider);

}

function find_real_pos(obj) {
 var curleft = curtop = 0;
  if(obj.offsetParent) {
   curleft = obj.offsetLeft
   curtop = obj.offsetTop
   while (obj = obj.offsetParent) {
    curleft += obj.offsetLeft
    curtop += obj.offsetTop
   }
  }
 return [curleft,curtop];
}

function sliderMouseDown(slider,event) {

var valueNow  = getAaaAttri("valuenow",slider);
var valueMin  = getAaaAttri("valuemin",slider);
var valueMax  = getAaaAttri("valuemax",slider);

 var grade = sliderSize/valueMax;

 // Find where was clicked, and were the bar is.
var clickPos =  event.clientX-find_real_pos(slider)[0];
 var barWidth = slider.firstChild.scrollWidth;
var barPos =  slider.firstChild.offsetLeft-find_real_pos(slider)[0];

// change the value
if(clickPos > barPos && clickPos < barPos+barWidth){
	return true;
} else if(clickPos > barPos) {
	var valueNow = valueNow+moveValue;
	if(valueNow > clickPos/grade){
		valueNow = clickPos/grade;
	}
} else if(clickPos < barPos+barWidth) {
	var valueNow = valueNow-moveValue;
	if(valueNow < clickPos/grade){
		valueNow = clickPos/grade;
	}
}

   //set the value and move the slider

  setAaaAttri("valuenow",slider,valueNow);
  displaySlider(slider);

if (event.preventDefault) {
  event.preventDefault();
 }

  return false

}

function getAaaAttri(aAttri,aSlider){
 if(aSlider.getAttributeNS){
   var num = parseInt(aSlider.getAttributeNS("http://www.w3.org/2005/07/aaa", aAttri));
 } else {
   var num = parseInt(aSlider.getAttribute("aaa:" + aAttri));
 }
 if(isNaN(num)){
  return 0;
 } else {
  return num;
 }
}

function setAaaAttri(aAttri,aSlider,value){
 if(aSlider.getAttributeNS){
   aSlider.setAttributeNS("http://www.w3.org/2005/07/aaa", aAttri, value);
 } else {
   aSlider.setAttribute("aaa:" + aAttri, value);
 }
 return null;
}

function setEventListener(item,event,func,bool) {
 if(item.addEventListener){
	item.addEventListener(event,func,bool);
 } else {
	item.attachEvent( 'on'+event,func,bool);
 }
}

function delEventListener(item,event,func,bool) {
 if(item.removeEventListener){
	item.removeEventListener(event,func,bool);
 } else {
	item.detachEvent('on'+event,func,bool);
 }
}