/*
 * jTimepicker plugin 0.1
 *
 * http://www.radoslavdimov.com/jquery-plugins/jquery-plugin-jtimepicker/
 *
 * Copyright (c) 2009 Radoslav Dimov
 *
 * Dual licensed under the MIT and GPL licenses:
 * http://www.opensource.org/licenses/mit-license.php
 * http://www.gnu.org/licenses/gpl.html
 *
 * Depends:
 *      ui.core.js
 *      ui.slider.js
 */

(function($) {
    $.fn.extend({
		
        jtimepicker: function(options) {
            
            var defaults = {
                clockIcon: 'http://ruancarlos.com.br/Blog/wp-content/themes/CherryTruffle/post/jtimepicker/images/icon_clock_2.gif',
                // set hours
                hourCombo: 'hourcombo',
                hourMode: 24,
                hourInterval: 1,
                hourSlider: 'hourSlider',
                hourLabel: 'hour',
                // set minutes
                minCombo: 'mincombo',
                minLength: 60,
                minInterval: 5,
                minSlider: 'minSlider',
                minLabel: 'min'
            };

            var options = $.extend(defaults, options);
            
            return this.each(function() {
                var o = options;
                var $this = $(this);
                var html = '';

                html += $this.createCombo(o.hourCombo, o.hourMode, o.hourInterval);
                html += $this.createCombo(o.minCombo, o.minLength, o.minInterval);
                html += '<img src="' + o.clockIcon + '" class="clock" />';
                html += $this.createSliderWrap(o.hourLabel, o.hourSlider, o.minLabel, o.minSlider);
                $this.html(html);
                
                $this.createSlider(o.hourSlider, o.hourMode, o.hourCombo, o.hourInterval);
                $this.createSlider(o.minSlider, o.minLength, o.minCombo, o.minInterval);

                $this.find('.clock').click(function() {
                    $this.find('.sliderWrap').toggle(function() {
                        $(document).click(function(event) {
                            if (!($(event.target).is('.sliderWrap') || $(event.target).parents('.sliderWrap').length || $(event.target).is('.clock'))) {
                                $this.find('.sliderWrap').hide(500);
                            }
                        });
                    });  
                });              
            }); 
        }     
    });

    

    $.fn.createCombo = function(id, length, interval) {
        var html = '<select class="' + id + ' combo">';
        for(i = 0; i < length; i += interval) {
            var txt = i < 10 ? '0' + i : i;
            html += '<option value="' + i + '">' + txt + '</option>';
        }
        html += "</select>";

        return html;
    }

    $.fn.createSliderWrap = function(hourLabel, hourSlider, minLabel, minSlider) {
        var html = '<div class="sliderWrap">';
        html += '   <div><label>' + hourLabel + ':</label> <p class="' + hourSlider + '"></p></div>';
        html += '   <div><label>' + minLabel + ':</label> <p class="' + minSlider + '"></p></div>';
        html += '</div>';

        return html;
    }

    $.fn.createSlider = function(id, maxValue, combo, stepValue) {
        var $this = $(this);
        $this.find('.' + id).slider({
            //orientation: "vertical",
            range: "min",
            min: 0,
            max: maxValue - stepValue,
            value: 0,
            step: stepValue,
            animate: true ,
            slide: function(event, ui) {
                $this.find('.' + combo).val(ui.value);
            }
        });
    }


})(jQuery);
