/**
 * cust_checkbox_plugin.js
 * Copyright (c) 2009 myPocket technologies (www.mypocket-technologies.com)
 
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation, either version 3 of the License, or
 * (at your option) any later version.

 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.

 * View the GNU General Public License <http://www.gnu.org/licenses/>.

 * @author Darren Mason (djmason9@gmail.com)
 * @date 7/3/2009
 * @projectDescription  Replaces the standard HTML form checkbox or radio buttons. Allows for disable, and very customizable.
 * @version 1.0.6
 * 
 * @requires jquery.js (tested with 1.3.2)
 * 
 * @param disable_all:  false,
 * @param hover:  true,
 * @param wrapperclass:  "group"
 * @param callback:  function(){ * your code here * }
 */


$.fn.custCheckBox = function(options){   
  var defaults = {
      hover:  true,            //adds a hover state to the tag      
      getLabel : function(iput) {
          return $(iput).parent().find("label")
      }
    };
  //override defaults
  var 
  classPrefix = 'cust_',
  opts = $.extend(defaults, options),
  getOnClass = function(type, disabled) {
    return classPrefix + type + (disabled? '_disabled' : '') + "_on"  
  },
  getOffClass = function(type, disabled) {
    return classPrefix + type + (disabled? '_disabled' : '') + "_off"  
  },
  getHoverClass = function(type) {
    return classPrefix + type + "_hvr"  
  },  
  radioChange = function (span, iput) {
      var name = $(iput).attr('name');
      if (name) {
          $('input[type=radio]').not(iput).each(function(){
              var n = $(this).attr('name');
              if (n && n == name) {
                  $(this).prev().removeClass(getOnClass('radio')).addClass(getOffClass('radio'))
             }
          })
      }
  },    
  onClick = function (e) {
      if (!$(e.data.iput).attr("disabled")) {
          var type = $(e.data.iput).attr('type');
          var checked = $(e.data.iput).attr('checked');
          $(e.data.span).removeClass(getHoverClass('radio')).removeClass(getHoverClass('checkbox'));                      
          if (!checked) {
              $(e.data.span).removeClass(getOffClass(type)).addClass(getOnClass(type));
              $(e.data.iput).trigger('click');                                                        
          } else if (type == 'checkbox') {              
              $(e.data.span).removeClass(getOnClass(type)).addClass(getOffClass(type));
              $(e.data.iput).trigger('click');          
          } 
          if (type == 'radio')
              radioChange(e.data.span, e.data.iput)
//          $('input.' + type).each(function(){
//              console.log($(this).val(), $(this).attr('checked'))
//          });                    
      }   
  }, 
 
  onEnter = function (e) {
      var type = $(e.data.iput).attr('type');
      var checked = $(e.data.iput).attr('checked');        
      if(type == 'checkbox')
        $(e.data.span).addClass(getHoverClass(type));
      else if(!$(e.data.iput).attr('checked') && type == 'radio')
        $(e.data.span).addClass(getHoverClass(type));
  },  
  onLeave = function (e) {
      $(e.data.span).removeClass(getHoverClass('radio')).removeClass(getHoverClass('checkbox'));
  }   
  ;
  
  return this.each(function() { 
      var span = $("<span></span>");
      $(this).hide().before(span);      
      var boxtype = $(this).attr("type");
      if (boxtype != 'radio' && boxtype != 'checkbox')
          return;
      var c = $(this).attr("checked")? getOnClass(boxtype, $(this).attr("disabled")) : getOffClass(boxtype, $(this).attr("disabled"))
      c = c + ' ' + classPrefix + boxtype;
      span.attr('class', c).bind('click', {span : span, iput : $(this)}, onClick);
      var label = opts.getLabel(this).bind('click', {span : span, iput : $(this)}, onClick);
      if (opts.hover) {
          span.bind('mouseenter', {span : span, iput : $(this)}, onEnter)
              .bind('mouseleave', {span : span}, onLeave);      
          label.bind('mouseenter', {span : span, iput : $(this)}, onEnter)
              .bind('mouseleave', {span : span}, onLeave);
      }                                               
  });   
};