//  JavaScript Document

//  sliderTransform (2010-03-24)

//  typical using of this component
//  window.sliderTransform = new sliderTransform();
//  window.sliderTransform.applyTo('question-1-4');

//

function sliderTransform() {
  var self = this;
  //
  this.containerID = '';
  this.containerElem = null;
  //
  this.valuesArr = null;
  this.textsArr = null;
  this.sliderValueElem = null;
  this.rulesContainerElem = null;
  this.labelsContainerElem = null;
  this.checkedIndex = 0;
  this.inputElemsArr = null;
  this.mainQuery = 'div.slidertransform';
  //
  this.init = function() {
    dojo.require("dijit.form.Slider");
    return true;
  };
  //
  this.applyTo = function(containerID) {
    self.containerID = containerID;
    self.containerElem = dojo.byId(self.containerID);
    if (!self.containerElem) return false;
    dojo.query(self.mainQuery,self.containerElem).forEach(self.transform);
    return true;
  };
  //
  this.transform = function(node,index) {
    self.checkedIndex = 0;
    self.valuesArr = new Array();
    self.textsArr = new Array('not selected');
    //
    dojo.query('br',node.parentNode).forEach(function(node,index){
      node.parentNode.removeChild(node);
    });
    //
    self.inputElemsArr = dojo.query('input',node);
    dojo.forEach(self.inputElemsArr,self.transformInput);
    self.sliderValueElem = dojo.create('div', {innerHTML: self.textsArr[self.checkedIndex], className: 'value', id: (self.containerID+'-'+index+'-sliderValue')}, node);
    self.rulesContainerElem = dojo.create('div', {innerHTML: '', className: '', id: (self.containerID+'-'+index+'-sliderRules')}, node);
    self.labelsContainerElem = dojo.create('div', {innerHTML: '', className: '', id: (self.containerID+'-'+index+'-sliderLabels')}, node);
    //
    var sliderElem = new dijit.form.HorizontalSlider({
      // my added
      valuesArr: self.valuesArr,
      textsArr: self.textsArr,
      inputElemsArr: self.inputElemsArr,
      sliderValueElem: self.sliderValueElem,
      //
      //name: (self.inputElemsArr[0].name+'-slider'),
      value: self.checkedIndex,
      minimum: 0,
      maximum: self.valuesArr.length,
      discreteValues: (self.valuesArr.length+1),
      showButtons: false,
      intermediateChanges: true,
      style: 'width: 300px;',
      onChange: function(value) {
        this.sliderValueElem.innerHTML = this.textsArr[value];
        if (value==0) {
          dojo.forEach(this.inputElemsArr,function(node,index){
            node.checked = false;
          });
        } else {
          this.inputElemsArr[value-1].checked = true;
        }
      }
    }, node);
    //
    var rulesElem = new dijit.form.HorizontalRule({
      count: (self.valuesArr.length+1),
      style: 'height: 5px;'
    }, self.rulesContainerElem);
    //
    var labelsElem = new dijit.form.HorizontalRuleLabels({
      labels: self.textsArr
    }, self.labelsContainerElem);
  };
  //
  this.transformInput = function(node,index) {
    dojo.style(node.parentNode, 'display', 'none');
    self.valuesArr[self.valuesArr.length] = node.value;
    dojo.query('span',node.parentNode).forEach(function(node,index){
      self.textsArr[self.textsArr.length] = node.innerHTML;
    });
    if (node.checked) {
      self.checkedIndex = index+1;
    }
  };
  //
  return self.init();
}

//  end of document