/* * jQuery UI selectmenu dev version * * Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about) * Dual licensed under the MIT (MIT-LICENSE.txt) * and GPL (GPL-LICENSE.txt) licenses. * * http://docs.jquery.com/UI * https://github.com/fnagel/jquery-ui/wiki/Selectmenu */ (function($) { $.widget("ui.selectmenu", { getter: "value", version: "1.9", eventPrefix: "selectmenu", options: { transferClasses: true, appendTo: "body", typeAhead: 1000, style: 'dropdown', positionOptions: { my: "left top", at: "left bottom", offset: null }, width: null, menuWidth: null, handleWidth: 26, maxHeight: null, icons: null, format: null, escapeHtml: false, bgImage: function() {} }, _create: function() { var self = this, o = this.options; // set a default id value, generate a new random one if not set by developer var selectmenuId = (this.element.attr( 'id' ) || 'ui-selectmenu-' + Math.random().toString( 16 ).slice( 2, 10 )).replace(':', '\\:'); // quick array of button and menu id's this.ids = [ selectmenuId, selectmenuId + '-button', selectmenuId + '-menu' ]; // define safe mouseup for future toggling this._safemouseup = true; this.isOpen = false; // create menu button wrapper this.newelement = $( '', { 'class': this.widgetBaseClass + ' ui-widget ui-state-default ui-corner-all', 'id' : this.ids[ 1 ], 'role': 'button', 'href': '#nogo', 'tabindex': this.element.attr( 'disabled' ) ? 1 : 0, 'aria-haspopup': true, 'aria-owns': this.ids[ 2 ] }); this.newelementWrap = $( "" ) .append( this.newelement ) .insertAfter( this.element ); // transfer tabindex var tabindex = this.element.attr( 'tabindex' ); if ( tabindex ) { this.newelement.attr( 'tabindex', tabindex ); } // save reference to select in data for ease in calling methods this.newelement.data( 'selectelement', this.element ); // menu icon this.selectmenuIcon = $( '' ) .prependTo( this.newelement ); // append status span to button this.newelement.prepend( '' ); // make associated form label trigger focus this.element.bind({ 'click.selectmenu': function( event ) { self.newelement.focus(); event.preventDefault(); } }); // click toggle for menu visibility this.newelement .bind('mousedown.selectmenu', function(event) { self._toggle(event, true); // make sure a click won't open/close instantly if (o.style == "popup") { self._safemouseup = false; setTimeout(function() { self._safemouseup = true; }, 300); } return false; }) .bind('click.selectmenu', function() { return false; }) .bind("keydown.selectmenu", function(event) { var ret = false; switch (event.keyCode) { case $.ui.keyCode.ENTER: ret = true; break; case $.ui.keyCode.SPACE: self._toggle(event); break; case $.ui.keyCode.UP: if (event.altKey) { self.open(event); } else { self._moveSelection(-1); } break; case $.ui.keyCode.DOWN: if (event.altKey) { self.open(event); } else { self._moveSelection(1); } break; case $.ui.keyCode.LEFT: self._moveSelection(-1); break; case $.ui.keyCode.RIGHT: self._moveSelection(1); break; case $.ui.keyCode.TAB: ret = true; break; case $.ui.keyCode.PAGE_UP: case $.ui.keyCode.HOME: self.index(0); break; case $.ui.keyCode.PAGE_DOWN: case $.ui.keyCode.END: self.index(self._optionLis.length); break; default: ret = true; } return ret; }) .bind('keypress.selectmenu', function(event) { if (event.which > 0) { self._typeAhead(event.which, 'mouseup'); } return true; }) .bind('mouseover.selectmenu', function() { if (!o.disabled) $(this).addClass('ui-state-hover'); }) .bind('mouseout.selectmenu', function() { if (!o.disabled) $(this).removeClass('ui-state-hover'); }) .bind('focus.selectmenu', function() { if (!o.disabled) $(this).addClass('ui-state-focus'); }) .bind('blur.selectmenu', function() { if (!o.disabled) $(this).removeClass('ui-state-focus'); }); // document click closes menu $(document).bind("mousedown.selectmenu-" + this.ids[0], function(event) { if ( self.isOpen ) { self.close( event ); } }); // change event on original selectmenu this.element .bind("click.selectmenu", function() { self._refreshValue(); }) // FIXME: newelement can be null under unclear circumstances in IE8 // TODO not sure if this is still a problem (fnagel 20.03.11) .bind("focus.selectmenu", function() { if (self.newelement) { self.newelement[0].focus(); } }); // set width when not set via options if (!o.width) { o.width = this.element.outerWidth(); } // set menu button width this.newelement.width(o.width); // hide original selectmenu element this.element.hide(); // create menu portion, append to body this.list = $( '