/* 
 Input Factory
 Skinnable Checkboxes and Radio buttons;
 @author: Lachezar Vladikov
 @requiers jquery

  HTML REQUIREMENTS: each input type checkbox/radio needs to have a uniquie ID specified, 
  a unique Name specified (obviously a radio group shares the same name),
  as well as Value matching the label (or at least the value that the backend expects)
  for checkboxes if no value is returned via GET/POST, this means they have not been selected
  and it should be treated/considered appropriately by the form handler/backend.
  the default checked state for both the input types of checkbox/radio should be specified
  in the HTML via checked="checked"
  
  Each group of input type radio/checkbox and a label should be wrapped as in the example:
  
 <div class="inpFctWrap styNor">              
    <input class="styled" type="radio" checked="checked" name="radio1nm" id="radio1id" value="yes" />
    <label for="radio1id" id="radio1label">Yes</label>
 </div>
 
  Note that the script below relies on the wrapper div class of 'inpFctWrap' and the class of 'styled'
  on the input type radio/checkbox. The additional classes of the wrapper define it's style/appearance
  controlled via CSS - styNor, styCon, stySparq, stySpeed, styAccuracy 
 
*/

//document.ready
JQ(function () {

/*nikefootball.training.*/inpFactoryStyleThemAll();
  
})


//Helper Functions for Input Factory
/*nikefootball.training.*/inpFactoryStyleThemAll = function() {
   //replace the styled checkboxes
   JQ("input[type=checkbox].styled").each(function(){
    var checkboxHeight = "25";
    var inp = JQ(this);  
    inp.css("display","none");
    if(inp.is(':checked')) {
      position_ = "0 -" + (checkboxHeight*2) + "px";
    }else{
      position_ = "0 0";
    }
    inp.before("<span class=\"checkbox\" style=\"background-position:"+ position_ +"\" name=\"styled_"+ inp.attr("name") +"\" id=\"styled_"+ inp.attr("id") +"\" ></span>");    
    var inpSpanReplacement = JQ("div.inpFctWrap span#styled_"+ inp.attr("id"));    
    inpSpanReplacement.mouseup(function(){
      if(inp.is(':checked')) {
        position_ = "0 0";
        inp.removeAttr("checked");
      }else{
        position_ = "0 -" + (checkboxHeight*2) + "px";
        inp.attr("checked","checked");
      }
      inpSpanReplacement.css("background-position",position_);    
    }).mousedown(function(){
      if(inp.is(':checked')) {
        position_ = "0 -" + checkboxHeight + "px";
      }else{
        position_ = "0 -" + (checkboxHeight*3) + "px";
      }
      inpSpanReplacement.css("background-position",position_);
    });
   })   
  //replace the styled radios
   JQ("input[type=radio].styled").each(function(){
    var radioHeight = "25";
    //build layout on initial radio values
    var inp = JQ(this);
    inp.css("display","none");
    if(inp.is(':checked')) {
      position_ = "0 -" + (radioHeight*2) + "px";
      chktest = "checked";
    }else{
      position_ = "0 0";
      chktest = "";
    }
    inp.before("<span class=\"radio\" style=\"background-position:"+ position_ +"\" name=\"styled_"+ inp.attr("name") +"\" id=\"styled_"+ inp.attr("id") +"\" chktest="+chktest+" ></span>"); 
    var inpSpanReplacement = JQ("div.inpFctWrap span#styled_"+ inp.attr("id"));
    //build layout on mouse events on the radios
    inpSpanReplacement.mouseup(function(){
      if(inp.is(':checked')) {
      //no additional handling at the moment 
      }else{
        //check all other radios with the same name and ammend/invert their value
        JQ(":input[name$='"+inp.attr("name")+"']").each(function(){
          var inpCurRadio = JQ(this);
          var inpCurRadioSpanRepl = JQ("div.inpFctWrap span#styled_"+ inpCurRadio.attr("id"));
          if (inpCurRadio.attr("id")!=inp.attr("id")) {
            JQ(":input[name$='"+inpCurRadio.attr("name")+"']#"+inpCurRadio.attr("id")).removeAttr("checked");
            position_ = "0 0";
            inpCurRadioSpanRepl.css("background-position",position_);
          }else{ 
            JQ(":input[name$='"+inpCurRadio.attr("name")+"']#"+inpCurRadio.attr("id")).attr("checked","checked");
            position_ = "0 -" + (radioHeight*2) + "px";
            inpCurRadioSpanRepl.css("background-position",position_);             
          }
        })//end each
      }    
    }).mousedown(function(){
      if(inp.is(':checked')) {
        //no additional handling at the moment     
      }else{
        position_ = "0 -" + (radioHeight*3) + "px";
        inpSpanReplacement.css("background-position",position_);
      }
    }); 
   })
} // END of /*nikefootball.training.*/inpFactoryStyleThemAll ()
