/*
* Qusion UI Popover 2.0
*
* Copyright 2011, AUTHORS.txt (http://qusion.net/about)
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://qusion.net/license
*
* http://docs.qusion.net/ui/input
*
* Depends:
*	jquery.ui.widget.js
*/

(function($) {
    $.widget("qusion.input", {
        options: {
            checboxNormal: 'qusion-checkbox',
            checboxHover: 'qusion-checkbox-hover',
            checboxChecked: 'qusion-checkbox-checked',
            radioNormal: 'qusion-radio',
            radioHover: 'qusion-radio-hover',
            radioChecked: 'qusion-radio-checked'
        },
        _create: function() {
            var self = this, element = self.element;

            if (element.is(':checkbox'))
                self._checbox();
            else if (element.is(':radio'))
                self._radio();
        },
        _checbox: function() {
            var self = this, element = this.element, options = this.options;

            var cbspan = $('<span />')
                .addClass(options.checboxNormal);

            element.after(cbspan);

            //events
            cbspan.on({
                "click": function(e) {
                    element.trigger('change');
                },
                "mouseover": function(e) {
                    cbspan.addClass(options.checboxHover);
                },
                "mouseout": function(e) {
                    cbspan.removeClass(options.checboxHover);
                }
            });
            self._on(element, {
                "change": function(e) {
                    self._cbchange(element.is(':checked'), cbspan);
                }
            });

            self._cbchange(element.is(':checked'), cbspan);

            element.hide();
        },
        _radio: function() {
            var self = this, element = this.element, options = this.options;

            var rbspan = $('<span />')
                .uniqueId()
                .attr("name", element.attr("name"))
                .addClass(options.radioNormal);

            //events
            rbspan.on({
                "click": function(e) {
                    element.trigger('click');
                },
                "mouseover": function(e) {
                    rbspan.addClass(options.radioHover);
                },
                "mouseout": function(e) {
                    rbspan.removeClass(options.radioHover);
                }
            });

            element.after(rbspan);

            self._on(element, {
                "change": function(e) {
                    var name = this.element.attr("name");
                    $('span[name="' + name + '"]').removeClass(options.radioChecked);
                    self._radiochange(element.is(':checked'), rbspan);
                }
            });
            
            self._radiochange(element.is(':checked'), rbspan);

            element.hide();
        },
        _cbchange: function(flag, span) {
            var options = this.options;
            if (flag === true)
                span.addClass(options.checboxChecked);
            else
                span.removeClass(options.checboxChecked);

        },
        _radiochange: function(flag, span) {
            var options = this.options;

            if (flag === true)
                span.addClass(options.radioChecked);
            else
                span.removeClass(options.radioChecked);
        }
    });
})(jQuery);