/**
 * Charter Toggle Switch
 *
 * @version 1.0
 * @category visual
 * @package jquery
 * 
 * @author Bryon Bean <bryon.bean@charter.com>
 */
 
(function($,undefined){
	$.widget( "charter.toggleSwitch", {

		options: {
			toggleClass: 'charter-toggle-switch',
			toggleStateOnClass: 'toggle-state-on',
			toggleStateOffClass: 'toggle-state-off',
			toggleStateButtonClass: 'toggle-slider-button',
			toggleDuration: 75,
			value: null
		},

		_create: function(){
			this._super();

			var initState = this.element.prop('checked'),
				position  = initState? 30 : 0,
				textRplce = '<div class="' + this.options.toggleClass + '">' +
								'<span class="' + this.options.toggleStateOnClass + '">on</span>' +
								'<span class="' + this.options.toggleStateOffClass + '">off</span>' +
								'<div class="' + this.options.toggleStateButtonClass + '">&nbsp;</div>' +
							'</div>';
			
			this.element.css('display','none');
			this.toggle = $( textRplce );
			
			this.toggle.data('charter-toggle-switch', this);
			this.toggle.click( this._click );
			
			this.element.after( this.toggle );
			this.refresh();
		},

		refresh: function(){
			var btnClass = '.' + this.options.toggleStateButtonClass,
				slider   = this.toggle.find(btnClass),
				checked  = this.element.prop('checked'),
				position = checked? parseInt(slider.css('width'),10) : -1;

			this.element.prop('checked',!checked);
			this.options.value = checked? 1 : 0

			slider.animate({
				left: position
			}, this.options.toggleDuration );
			
		},

		_click : function(e){
			e.preventDefault();
			$(this).data().charterToggleSwitch.refresh();
		},

		val: function(){
			return this.options.value
		},

		name: function(){
			return this.element.prop('name');
		}

	});

})( jQuery );