https://meteo.by/js/jquery.jNice.js

1/*� * jNice� * version: 1.0 (11.26.08)� * by Sean Mooney ([email protected]) � * Examples at: http://www.whitespace-creative.com/jquery/jnice/� * Dual licensed under the MIT and GPL licenses:� *   http://www.opensource.org/licenses/mit-license.php� *   http://www.gnu.org/licenses/gpl.html� *� * To Use: place in the head � *  <link href="inc/style/jNice.css" rel="stylesheet" type="text/css" />� *  <script type="text/javascript" src="inc/js/jquery.jNice.js"></script>� *� * And apply the jNice class to the form you want to style� *� * To Do: Add textareas, Add File upload� *� ******************************************** */�(function($){�    $.fn.jNice = function(options){�        var self = this;�        var safari = $.browser.safari; /* We need to check for safari to fix the input:text problem */�        /* Apply document listener */�        $(document).mousedown(checkExternalClick);�        /* each form */�        return this.each(function(){�            $('input:submit, input:reset, input:button', this).each(ButtonAdd);�            $('button').focus(function(){ $(this).addClass('jNiceFocus')}).blur(function(){ $(this).removeClass('jNiceFocus')});�            $('input:text:visible, input:password', this).each(TextAdd);�            /* If this is safari we need to add an extra class */�            if (safari){$('.jNiceInputWrapper').each(function(){$(this).addClass('jNiceSafari').find('input').css('width', $(this).width()+11);});}�            $('input:checkbox', this).each(CheckAdd);�            $('input:radio', this).each(RadioAdd);�            $('select', this).each(function(index){ SelectAdd(this, index); });�            /* Add a new handler for the reset action */�            $(this).bind('reset',function(){var action = function(){ Reset(this); }; window.setTimeout(action, 10); });�            $('.jNiceHidden').css({opacity:0});�        });     �    };/* End the Plugin */��    var Reset = function(form){�        var sel;�        $('.jNiceSelectWrapper select', form).each(function(){sel = (this.selectedIndex<0) ? 0 : this.selectedIndex; $('ul', $(this).parent()).each(function(){$('a:eq('+ sel +')', this).click();});});�        $('a.jNiceCheckbox, a.jNiceRadio', form).removeClass('jNiceChecked');�        $('input:checkbox, input:radio', form).each(function(){if(this.checked){$('a', $(this).parent()).addClass('jNiceChecked');}});�    };��    var RadioAdd = function(){�        var $input = $(this).addClass('jNiceHidden').wrap('<span class="jRadioWrapper jNiceWrapper"></span>');�        var $wrapper = $input.parent();�        var $a = $('<span class="jNiceRadio"></span>');�        $wrapper.prepend($a);�        /* Click Handler */�        $a.click(function(){�                var $input = $(this).addClass('jNiceChecked').siblings('input').attr('checked',true);�                /* uncheck all others of same name */�                $('input:radio[name="'+ $input.attr('name') +'"]').not($input).each(function(){�                    $(this).attr('checked',false).siblings('.jNiceRadio').removeClass('jNiceChecked');�                });�                return false;�        });�        $input.click(function(){�            if(this.checked){�                var $input = $(this).siblings('.jNiceRadio').addClass('jNiceChecked').end();�                /* uncheck all others of same name */�                $('input:radio[name="'+ $input.attr('name') +'"]').not($input).each(function(){�                    $(this).attr('checked',false).siblings('.jNiceRadio').removeClass('jNiceChecked');�                });�            }�        }).focus(function(){ $a.addClass('jNiceFocus'); }).blur(function(){ $a.removeClass('jNiceFocus'); });��        /* set the default state */�        if (this.checked){ $a.addClass('jNiceChecked'); }�    };��    var CheckAdd = function(){�        var $input = $(this).addClass('jNiceHidden').wrap('<span class="jNiceWrapper"></span>');�        var $wrapper = $input.parent().append('<span class="jNiceCheckbox"></span>');�        /* Click Handler */�        var $a = $wrapper.find('.jNiceCheckbox').click(function(){�                var $a = $(this);�                var input = $a.siblings('input')[0];�                if (input.checked===true){�                    input.checked = false;�                    $a.removeClass('jNiceChecked');�                }�                else {�                    input.checked = true;�                    $a.addClass('jNiceChecked');�                }�                return false;�        });�        $input.click(function(){�            if(this.checked){ $a.addClass('jNiceChecked');  }�            else { $a.removeClass('jNiceChecked'); }�        }).focus(function(){ $a.addClass('jNiceFocus'); }).blur(function(){ $a.removeClass('jNiceFocus'); });�        �        /* set the default state */�        if (this.checked){$('.jNiceCheckbox', $wrapper).addClass('jNiceChecked');}�    };��    var TextAdd = function(){�        var $input = $(this).addClass('jNiceInput').wrap('<div class="jNiceInputWrapper"><div class="jNiceInputInner"></div></div>');�        var $wrapper = $input.parents('.jNiceInputWrapper');�        $input.focus(function(){ �            $wrapper.addClass('jNiceInputWrapper_hover');�        }).blur(function(){�            $wrapper.removeClass('jNiceInputWrapper_hover');�        });�    };��    var ButtonAdd = function(){�        var value = $(this).attr('value');�        $(this).replaceWith('<button id="'+ this.id +'" name="'+ this.name +'" type="'+ this.type +'" class="'+ this.className +'" value="'+ value +'"><span><span>'+ value +'</span></span>');�    };��    /* Hide all open selects */�    var SelectHide = function(){�        $('.jNiceSelectWrapper ul:visible').hide();�        $('.jNiceSelectWrapper').removeClass('opened');�    };

1��    /* Check for an external click */�    var checkExternalClick = function(event) {�        if ($(event.target).parents('.jNiceSelectWrapper').length === 0) { SelectHide(); }�    };��    var SelectAdd = function(element, index){�        var $select = $(element);�        index = index || $select.css('zIndex')*1;�        index = (index) ? index : 0;�        /* First thing we do is Wrap it */�        $select.wrap($('<div class="jNiceWrapper"></div>').css({zIndex: 100-index}));�        var width = $select.width();�        $select.addClass('jNiceHidden').after('<div class="jNiceSelectWrapper"><div><span class="jNiceSelectText"></span><span class="jNiceSelectOpen"></span></div><p></p><ul></ul></div>');�        var $wrapper = $(element).siblings('.jNiceSelectWrapper').css({width: width +'px'});�        $('.jNiceSelectText, .jNiceSelectWrapper ul', $wrapper).width( width - $('.jNiceSelectOpen', $wrapper).width());�        /* IF IE 6 */�        if ($.browser.msie && jQuery.browser.version < 7) {�            $select.after($('<iframe src="javascript:\'\';" marginwidth="0" marginheight="0" align="bottom" scrolling="no" tabIndex="-1" frameborder="0"></iframe>').css({ height: $select.height()+4 +'px' }));�        }�        /* Now we add the options */�        SelectUpdate(element);�        /* Apply the click handler to the Open */�        $('div', $wrapper).click(function(){�            var $ul = $(this).siblings('ul');�            if ($ul.css('display')=='none'){ SelectHide(); } /* Check if box is already open to still allow toggle, but close all other selects */�            $ul.toggle();�            var offSet = ($('a.selected', $ul).offset().top - $ul.offset().top);�            $ul.attr({scrollTop: offSet});�            $wrapper.toggleClass('opened');�            return false;�        });�        /* Add the key listener */�        $select.keydown(function(e){�            var selectedIndex = this.selectedIndex;�            switch(e.keyCode){�                case 40: /* Down */�                    if (selectedIndex < this.options.length - 1){ selectedIndex+=1; }�                    break;�                case 38: /* Up */�                    if (selectedIndex > 0){ selectedIndex-=1; }�                    break;�                default:�                    return;�                    break;�            }�            $('ul a', $wrapper).removeClass('selected').eq(selectedIndex).addClass('selected');�            $('span:eq(0)', $wrapper).html($('option:eq('+ selectedIndex +')', $select).attr('selected', 'selected').text());�            return false;�        }).focus(function(){ $wrapper.addClass('jNiceFocus'); }).blur(function(){ $wrapper.removeClass('jNiceFocus'); });�    };��    var SelectUpdate = function(element){�        var $select = $(element);�        var $wrapper = $select.siblings('.jNiceSelectWrapper');�        var $ul = $wrapper.find('ul').find('li').remove().end().hide();�        $('option', $select).each(function(i){�            $ul.append('<li><a href="#" index="'+ i +'">'+ this.text +'</a></li>');�        });�        /* Add click handler to the a */�        $ul.find('a').click(function(){�            $('a.selected', $wrapper).removeClass('selected');�            $(this).addClass('selected');   �            /* Fire the onchange event */�            if ($select[0].selectedIndex != $(this).attr('index') && $select[0].onchange) { $select[0].selectedIndex = $(this).attr('index'); $select[0].onchange(); }�            $select[0].selectedIndex = $(this).attr('index');�            $('span:eq(0)', $wrapper).html($(this).html());�            $wrapper.removeClass('opened');�            $ul.hide();�            return false;�        });�        /* Set the defalut */�        $('a:eq('+ $select[0].selectedIndex +')', $ul).click();�    };��    var SelectRemove = function(element){�        var zIndex = $(element).siblings('.jNiceSelectWrapper').css('zIndex');�        $(element).css({zIndex: zIndex}).removeClass('jNiceHidden');�        $(element).siblings('.jNiceSelectWrapper').remove();�    };��    /* Utilities */�    $.jNice = {�            SelectAdd : function(element, index){   SelectAdd(element, index); },�            SelectRemove : function(element){ SelectRemove(element); },�            SelectUpdate : function(element){ SelectUpdate(element); }�    };/* End Utilities */��    /* Automatically apply to any forms with class jNice */�    $(function(){$('form.jNice').jNice();   });�})(jQuery);