// JavaScript Document


//  transformElements (2009-12-04)
//  this object add simple and form elements efects


function transformElements() {
  var self = this;
  //
  this.init = function(parentNode) {
    if (!parentNode) return false;
    // text inputs
    dojo.query(".formtext",parentNode).forEach(function(elem,index){
      if (!elem.transformedElement) {
        dojo.connect(elem,"onfocus",function(){
          dojo.addClass(this,'formtext-active');
          if (this.value==this.title) { this.value = ''; }
        });
        dojo.connect(elem,"onblur",function(){
          dojo.removeClass(this,'formtext-active');
          if (this.value=='') { this.value = this.title; }
        });
        elem.transformedElement = true;
      }
    });
    // buttons with mouseover
    var btnAddings = ['','-left','-right'];
    dojo.forEach(btnAddings,function(adding,indexA){
      dojo.query(".button"+adding,parentNode).forEach(function(elem,index){
        if (!elem.transformedElement) {
          dojo.connect(elem,"onmouseover",function(){
            dojo.addClass(this,'button'+adding+'-active');
          });
          dojo.connect(elem,"onmouseout",function(){
            dojo.removeClass(this,'button'+adding+'-active');
          });
          elem.transformedElement = true;
        }
      });
    });
    // images with mouseover
    dojo.query('img',parentNode).forEach(function(elem,index){
      if (elem.src.indexOf('_off.')>0) {
        if (!elem.transformedElement) {
          dojo.connect(elem,"onmouseover",function(){
            this.src = this.src.replace('_off.','_on.');
          });
          dojo.connect(elem,"onmouseout",function(){
            this.src = this.src.replace('_on.','_off.');
          });
          elem.transformedElement = true;
        }
      }
    });
    // graphic simulation of radio a checkbox
    dojo.query('input[type=checkbox], input[type=radio]',parentNode).forEach(function(elem,index){
      if (elem.transformedElement) {
        self.removeGraphicCheckbox(elem);
      }
      self.makeGraphicCheckbox(elem);
      elem.transformedElement = true;
    });
    // graphic simulation of select
    dojo.query('select',parentNode).forEach(function(elem,index){
      if (elem.options.length>0) {
        if (elem.transformedElement) {
          self.removeGraphicSelect(elem);
        }
        self.makeGraphicSelect(elem);
        elem.transformedElement = true;
      }
    });
  };
  //
  this.makeGraphicCheckbox = function(elem) {
    dojo.addClass(elem,'simulcheckbox');
    var img = document.createElement('img');
    img.src = '/images/simul_checkbox'+(elem.checked?'_checked':'')+'.gif';
    img.className = 'simulcheckbox';
    elem.parentNode.insertBefore(img,elem.nextSibling);
    dojo.connect(img,"onclick",function(){
      elem.click();
    });
    dojo.connect(elem,"onclick",function(){
      dojo.query('input[name='+this.name+']').forEach(function(elemIn,indexIn){
        elemIn.nextSibling.src = '/images/simul_checkbox.gif';
      });
      this.nextSibling.src = '/images/simul_checkbox'+(this.checked?'_checked':'')+'.gif';
    });
    dojo.connect(elem,"onfocus",function(){
      this.nextSibling.className = 'simulcheckbox-active';
    });
    dojo.connect(elem,"onblur",function(){
      this.nextSibling.className = 'simulcheckbox';
    });
  };
  //
  this.removeGraphicCheckbox = function(elem) {
    dojo.removeClass(elem,'simulcheckbox');
    if (elem.nextSibling && elem.nextSibling.className == 'simulcheckbox') {
      elem.parentNode.removeChild(elem.nextSibling);
    }
  };
  //
  this.makeGraphicSelect = function(elem) {
    var selectedIndex = elem.selectedIndex;
    if (selectedIndex==-1) selectedIndex=0;
    dojo.addClass(elem,'simulselect');
    // create main a element
    var link = document.createElement('a');
    link.href = '#';
    link.className = 'simulselect';
    dojo.connect(link,"onclick",function(evt){
      if (this.className=='simulselect') {
        this.className = 'simulselect-active';
      } else {
        this.className = 'simulselect';
      }
      dojo.stopEvent(evt);
      this.blur();
    });
    dojo.connect(link,"onkeypress",function(evt){
      // !!! not completed !!!
      //globalAlertObjectProperties(evt);
    });
    elem.parentNode.insertBefore(link,elem.nextSibling);
    // first stable item
    var elemIn = elem.options[selectedIndex];
    var span = document.createElement('span');
    span.innerHTML = elemIn.innerHTML;
    span.selectIndex = selectedIndex;
    dojo.addClass(span,'first');
    link.appendChild(span);
    // all option items
    dojo.forEach(elem.options,function(elemIn,indexIn){
      var span = document.createElement('span');
      span.innerHTML = elemIn.innerHTML;
      span.selectIndex = indexIn;
      dojo.addClass(span,'first');
      dojo.connect(span,"onmouseover",function(){
        dojo.addClass(this,'active');
      });
      dojo.connect(span,"onmouseout",function(){
        dojo.removeClass(this,'active');
      });
      dojo.connect(span,"onclick",function(){
        var originalElect = this.parentNode.previousSibling;
        var simulElem = this.parentNode.firstChild;
        if (!originalElect || !simulElem) return false;
        simulElem.innerHTML = this.innerHTML;
        simulElem.selectIndex = this.selectIndex;
        originalElect.selectedIndex = this.selectIndex;
        if (dojo.hasClass(originalElect,'submit')) {
          self.getFormElem(originalElect).submit();
        }
        return true;
      });
      link.appendChild(span);
    });
    link.style.width = link.offsetWidth+'px';
    dojo.forEach(link.childNodes,function(elemIn,indexIn){
      if (indexIn!=0) {
        dojo.removeClass(elemIn,'first');
      }
    });
  };
  //
  this.removeGraphicSelect = function(elem) {
    dojo.removeClass(elem,'simulselect');
    if (elem.nextSibling && elem.nextSibling.className == 'simulselect') {
      elem.parentNode.removeChild(elem.nextSibling);
    }
  };
  //
  this.getFormElem = function(thisNode) {
    var formElem = thisNode;
    while (formElem.nodeName != 'FORM' && formElem.nodeName != 'BODY') {
      formElem = formElem.parentNode;
    }
    if (formElem.nodeName!='FORM') return false;
    return formElem;
  };
  //
  //return self.init(dojo.body());
}


// end of document

