/**
 * ezMark - A Simple Checkbox and Radio button Styling plugin. 
 * This plugin allows you to use a custom Image for Checkbox or Radio button. Its very simple, small and easy to use.
 * 
 * Copyright (c) Abdullah Rubiyath <http://www.itsalif.info/>.
 * Released under MIT License
 * 
 * Files with this plugin:
 * - jquery.ezmark.js
 * - ezmark.css
 * 
 * <usage>
 * At first, include both the css and js file at the top
 * 
 * Then, simply use: 
 * 	$('selector').ezMark([options]);
 *  
 * [options] accepts following JSON properties:
 *  checkboxCls - custom Checkbox Class
 *  checkedCls  - checkbox Checked State's Class
 *  radioCls    - custom radiobutton Class
 *  selectedCls - radiobutton's Selected State's Class
 *  
 * </usage>
 * 
 * View Documention/Demo here:
 * http://www.itsalif.info/content/ezmark-jquery-checkbox-radiobutton-plugin
 * 
 * @author Abdullah Rubiyath
 * @version 1.0
 * @date June 27, 2010
 */

(function($) {
  $.fn.ezMark = function(options) {
	options = options || {}; 
	var defaultOpt = { 
		checkboxCls   		: 'checkbox_unchecked' ,
		radioCls			: 'radio_unchecked' ,	
		checkboxcheckedCls	: 'checkbox_checked'  ,
		radiocheckedCls		: 'radio_checked' , 
		hideCls  	 		: 'crirHidden'
	};
    return this.each(function() {
    	var $this = $(this);
//    	var wrapTag = $this.attr('type') == 'checkbox' ? '<div class="'+defaultOpt.checkboxCls+'">' : '<div class="'+defaultOpt.radioCls+'">';
    	// for checkbox

    	if( $(this).attr('type') == 'checkbox') {
    		$(this).addClass(defaultOpt.hideCls);
			var $labelElement=$("label[for='"+$(this).attr('id')+"']");

			if($(this).is(':checked')) { 
				$labelElement.removeClass(defaultOpt.checkboxCls).addClass(defaultOpt.checkboxcheckedCls);
			} 
			else {
				$labelElement.removeClass(defaultOpt.checkboxcheckedCls).addClass(defaultOpt.checkboxCls);
			}

			$labelElement.click(function() {
				var input=$('#'+$(this).attr('for'));
				if(input.is(':checked')) {
					input.attr('checked', '');
					$(this).removeClass(defaultOpt.checkboxcheckedCls).addClass(defaultOpt.checkboxCls);
				}
				else {
					input.attr('checked', 'checked');
					$(this).removeClass(defaultOpt.checkboxCls).addClass(defaultOpt.checkboxcheckedCls);
				}
				input.change();	
				return false;
			})
    	} 
    	else if( $this.attr('type') == 'radio') {
    		$(this).addClass(defaultOpt.hideCls);
			var $labelElement=$("label[for='"+$(this).attr('id')+"']");

			if($(this).is(':checked')) { 
				$labelElement.removeClass(defaultOpt.radioCls).addClass(defaultOpt.radiocheckedCls);
			} 
			else {
				$labelElement.removeClass(defaultOpt.radiocheckedCls).addClass(defaultOpt.radioCls);
			}


			$labelElement.click(function() {
				var input=$('#'+$(this).attr('for'));
				var groupname='input[name="'+input.attr('name')+'"]';

				$(groupname).each(function() {
					$(this).attr('checked', '');
					$("label[for='"+$(this).attr('id')+"']").removeClass(defaultOpt.radiocheckedCls).addClass(defaultOpt.radioCls);
				});


				input.attr('checked', 'checked');
				$(this).removeClass(defaultOpt.radioCls).addClass(defaultOpt.radiocheckedCls);
				input.change();	
				return false;
			})




/*
    		$this.addClass(defaultOpt.hideCls).change(function() {
    			// radio button may contain groups! - so check for group
   				$('input[name="'+$(this).attr('name')+'"]').each(function() {
   	    			if( $(this).is(':checked') ) { 
   	    				$(this).parent().addClass(defaultOpt.selectedCls); 
   	    			} else {
   	    				$(this).parent().removeClass(defaultOpt.selectedCls);     	    			
   	    			}
   				});
    		});
    		
    		if( $this.is(':checked') ) {
				$this.parent().addClass(defaultOpt.selectedCls);    		
    		}   
			
*/


    	}
    });
  }
})(jQuery);