/*!
 *	@description	MooTools based iPhone-like switch button, for replacing checkboxes
 *	@version		0.7
 *	@author			Marcel Miranda Ackerman < reaktivo.com >
 *	@license 		MIT Style License.
 *	@date			2008-04-06
 *	@updated		2009-08-06
 *	@dependencies	mootools 1.2
*/

(function ($) {
    
	this.MooSwitch = new Class({
		Extends: Drag.Move,
		Implements: [Options],

		options: {
			duration: 100,
			labels_outside: true,
			labels: {
				unchecked: 'No',
				checked: 'Yes'
			},
			hide_checkbox: true,
			drag_opacity: .6,
			mouse_over_handle: false
		},

		initialize: function(selector, options){

			this.setOptions(options);
			
			this.is_dragging = false;

			this.mvalue = 0;

			//Create Elements
			this.container = new Element('div', {'class':'switchbox ie_layout'});

			this.bg = new Element('div', {'class': 'background'}).inject(this.container);

			this.handle = new Element('div', {'class':'handle'}).inject(this.container);

			//Hide Radioboxes and their labels
			this.checkbox = $(selector);
			this.container.inject(this.checkbox, 'after');

                        this.bg.addEvent('click', function(){
                                if(!this.mouse_over_handle) {
                                        this.mvalue = !this.mvalue;
                                        this.goTo(this.mvalue);
                                }
                        }.bind(this));

                        this.container.setStyle('width', this.bg.getStyle('width').toInt());
                        this.container.setStyle('height', this.bg.getStyle('height').toInt());

                        this.max_scroll = this.bg.getStyle('width').toInt() - this.handle.getStyle('width').toInt();

			this.handle.setStyle('left', this.bg.getStyle('left'));

			if(this.options.hide_checkbox) this.checkbox.setStyle('display', 'none');
			
			if(this.checkbox.checked == true) this.goTo.bind(this, 1, 0)();

			this.parent(this.handle, {
				container: this.bg,
				onStart: function (){
					this.is_dragging = true;
					this.handle.morph({'opacity': this.options.drag_opacity});
				},
				onComplete: function (){
					if(this.handle.getStyle('left').toInt() + (this.handle.getStyle('width').toInt()/2) < this.container.getStyle('left').toInt() + this.container.getStyle('width').toInt()/2) {
						this.goTo(0);
					}else{
						this.goTo(1);
					}

				}
			});

			this.handle.addEvent('mouseover', function(){
				this.mouse_over_handle = true;
			}.bind(this));
                        
			this.handle.addEvent('mouseout', function(){
				this.mouse_over_handle = false;
			}.bind(this));

		},
		goTo: function(value, immediate){

			this.handle.set('morph', {duration: immediate ? 0 : this.options.duration});

            this.handle.morph({
				'left' : this.bg.getStyle('left').toInt() + (this.max_scroll*value),
				'opacity' : 1
			});

			this.mvalue = value;
                        if(this.checkbox.checked != value) this.checkbox.fireEvent('change');
			this.checkbox.checked = !!value;
                        
		}
	});

	$extend (MooSwitch, {
		all: function(els, options) {
			els.each(function(el) {
				new MooSwitch(el, options);
			});
		}
	});

})(document.id);