diff --git a/demos/index.html b/demos/index.html index 69767febf..76ddcd3da 100644 --- a/demos/index.html +++ b/demos/index.html @@ -20,8 +20,6 @@ - - @@ -111,7 +109,7 @@ @@ -285,8 +283,6 @@
Datepicker
Dialog
Menu
-
Menubar
-
Popup
Progressbar
Slider
Spinner
@@ -307,7 +303,7 @@
Widget
About jQuery UI
Getting Started
-
Upgrade Guide
+
Upgrade Guide
Changelog
Roadmap
Subversion Access
@@ -328,7 +324,7 @@

These demos showcase some common uses of each jQuery UI plugin. Simply copy and paste code from the demos to get started. Have fun playing with them.

- + diff --git a/demos/menu/contextmenu.html b/demos/menu/contextmenu.html deleted file mode 100644 index 33e07f7ec..000000000 --- a/demos/menu/contextmenu.html +++ /dev/null @@ -1,65 +0,0 @@ - - - - - jQuery UI Menu - Contextmenu demo - - - - - - - - - - - - - - -
- - - - -
- -
- -
- -

A simple contextmenu: Click the button, or tab to it and hit space to open the menu. Use the mouse or cursor keys to select an item, click it or hit enter to select it.

- -

The keyboard handling is part of the menu. Using the input option to menu is configured to add the key event handlers to the button, as that button gets focused when clicked.

- -
- - - - - diff --git a/demos/menubar/default.html b/demos/menubar/default.html deleted file mode 100644 index ef39a7121..000000000 --- a/demos/menubar/default.html +++ /dev/null @@ -1,208 +0,0 @@ - - - - jQuery UI Menubar - Default demo - - - - - - - - - - - - - - -
- - - - - - -
- Log: -
-
-
- -
- -

TODO

- -
- - - - diff --git a/demos/menubar/index.html b/demos/menubar/index.html deleted file mode 100644 index 3eebda2d0..000000000 --- a/demos/menubar/index.html +++ /dev/null @@ -1,16 +0,0 @@ - - - - - jQuery UI Menubar Demos - - - -
-

Examples

- -
- - diff --git a/demos/popup/animation.html b/demos/popup/animation.html deleted file mode 100644 index 7df89d31b..000000000 --- a/demos/popup/animation.html +++ /dev/null @@ -1,84 +0,0 @@ - - - - jQuery UI Popup - Animation demo - - - - - - - - - - - - - - - - -
- Log In -
-
- - -
-
- - -
-
- -
-
-
- -
- -

A link to a login form that opens as a popup. Open and close animations have been used.

- -
- - - - diff --git a/demos/popup/default.html b/demos/popup/default.html deleted file mode 100644 index f0ff9a57e..000000000 --- a/demos/popup/default.html +++ /dev/null @@ -1,69 +0,0 @@ - - - - jQuery UI Popup - Default demo - - - - - - - - - - - - - -
- Log In -
-
- - -
-
- - -
-
- -
-
-
- -
- -

A link to a login form that opens as a popup.

- -
- - - - diff --git a/demos/popup/index.html b/demos/popup/index.html deleted file mode 100644 index 63636241b..000000000 --- a/demos/popup/index.html +++ /dev/null @@ -1,20 +0,0 @@ - - - - - jQuery UI Popup Demos - - - -
-

Examples

- -
- - diff --git a/demos/popup/popup-menu-table.html b/demos/popup/popup-menu-table.html deleted file mode 100644 index c79c30503..000000000 --- a/demos/popup/popup-menu-table.html +++ /dev/null @@ -1,108 +0,0 @@ - - - - jQuery UI Popup - Menu as Popup in table demo - - - - - - - - - - - - - - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
NameRelease YearAverage Rating
Red Hot Chili Peppers: Funky Monks19933.6 - -
Rod Stewart: Storyteller 1984-199119913.1
Stevie Ray Vaughan and Double Trouble: Live at the El Mocambo 198319913.9
Spike and Mike's Sick & Twisted Festival of Animation19972.6
- -
-
- - -
- -

Poup menu in a table. Works okay standalone, not so much in the scrolling demo view. For that to work better, position() would have to take the closest scrolled parent into account for collision detection.

- -
- - - - diff --git a/demos/popup/popup-menu.html b/demos/popup/popup-menu.html deleted file mode 100644 index 89d17c0bc..000000000 --- a/demos/popup/popup-menu.html +++ /dev/null @@ -1,92 +0,0 @@ - - - - jQuery UI Popup - Popup Menu - - - - - - - - - - - - - - -
- - - - - -
-
- - - -
-
- -
-
- - -
- -

Make the popup a menu (or the menu a popup) and you get context menus.

- -
- - - - diff --git a/demos/popup/tooltip.html b/demos/popup/tooltip.html deleted file mode 100644 index c955a3c6a..000000000 --- a/demos/popup/tooltip.html +++ /dev/null @@ -1,61 +0,0 @@ - - - - jQuery UI Popup - Tooltip style demo - - - - - - - - - - - - - -
-
- -
This is some more info and there is even more info on this page.
-
-
- -
- -

A "more info" popup that works on mouseover (tooltip).

- -
- - - - diff --git a/demos/tooltip/video-player.html b/demos/tooltip/video-player.html index 365934f72..8ac0338fd 100644 --- a/demos/tooltip/video-player.html +++ b/demos/tooltip/video-player.html @@ -11,7 +11,6 @@ - @@ -69,14 +68,6 @@ $( this ).remove(); }); } - $( "ul" ).menu({ - select: function( event, ui ) { - // TODO should probably be handled by popup, see ESCAPE key handler - // affects key handling - $( this ).prev().focus(); - notify( ui.item ); - } - }).popup(); $( "button" ).each(function() { var button = $( this ).button({ @@ -85,15 +76,9 @@ }, text: !!$( this ).attr( "title" ) }); - if ( button.next().is( ":ui-popup" ) ) { - button.click(function( event ) { - $( ".demo" ).tooltip( "close", event ); - }); - } else { - button.click(function() { - notify( button ); - }); - } + button.click(function() { + notify( button ); + }); }); $( ".set" ).buttonset({ items: "button" @@ -127,17 +112,6 @@
-
diff --git a/themes/base/jquery.ui.base.css b/themes/base/jquery.ui.base.css index a359c2ba4..9a18856c1 100644 --- a/themes/base/jquery.ui.base.css +++ b/themes/base/jquery.ui.base.css @@ -15,7 +15,6 @@ @import url("jquery.ui.datepicker.css"); @import url("jquery.ui.dialog.css"); @import url("jquery.ui.menu.css"); -@import url("jquery.ui.menubar.css"); @import url("jquery.ui.progressbar.css"); @import url("jquery.ui.resizable.css"); @import url("jquery.ui.selectable.css"); diff --git a/themes/base/jquery.ui.menubar.css b/themes/base/jquery.ui.menubar.css deleted file mode 100644 index 8b175f28a..000000000 --- a/themes/base/jquery.ui.menubar.css +++ /dev/null @@ -1,15 +0,0 @@ -/* - * jQuery UI Menubar @VERSION - * - * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) - * Dual licensed under the MIT or GPL Version 2 licenses. - * http://jquery.org/license - */ -.ui-menubar { list-style: none; margin: 0; padding-left: 0; } - -.ui-menubar-item { float: left; } - -.ui-menubar .ui-button { float: left; font-weight: normal; border-top-width: 0 !important; border-bottom-width: 0 !important; margin: 0; outline: none; } -.ui-menubar .ui-menubar-link { border-right: 1px dashed transparent; border-left: 1px dashed transparent; } - -.ui-menubar .ui-menu { width: 200px; position: absolute; z-index: 9999; font-weight: normal; } diff --git a/ui/jquery.ui.menu.js b/ui/jquery.ui.menu.js index 4fac02d2a..06b7ec440 100644 --- a/ui/jquery.ui.menu.js +++ b/ui/jquery.ui.menu.js @@ -214,24 +214,10 @@ $.widget( "ui.menu", { } } }); - - if ( this.options.trigger ) { - this.element.popup({ - trigger: this.options.trigger, - managed: true, - focusPopup: $.proxy( function( event, ui ) { - this.focus( event, this.element.children( ".ui-menu-item" ).first() ); - this.element.focus( 1 ); - }, this) - }); - } }, _destroy: function() { //destroy (sub)menus - if ( this.options.trigger ) { - this.element.popup( "destroy" ); - } this.element .removeAttr( "aria-activedescendant" ) .find( ".ui-menu" ) @@ -533,10 +519,6 @@ $.widget( "ui.menu", { item: this.active }; this.collapseAll( event, true ); - if ( this.options.trigger ) { - $( this.options.trigger ).focus( 1 ); - this.element.popup( "close" ); - } this._trigger( "select", event, ui ); } }); diff --git a/ui/jquery.ui.menubar.js b/ui/jquery.ui.menubar.js deleted file mode 100644 index 6bc03ba4d..000000000 --- a/ui/jquery.ui.menubar.js +++ /dev/null @@ -1,296 +0,0 @@ -/* - * jQuery UI Menubar @VERSION - * - * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) - * Dual licensed under the MIT or GPL Version 2 licenses. - * http://jquery.org/license - * - * http://docs.jquery.com/UI/Menubar - * - * Depends: - * jquery.ui.core.js - * jquery.ui.widget.js - * jquery.ui.position.js - * jquery.ui.menu.js - */ -(function( $ ) { - -// TODO when mixing clicking menus and keyboard navigation, focus handling is broken -// there has to be just one item that has tabindex -$.widget( "ui.menubar", { - version: "@VERSION", - options: { - autoExpand: false, - buttons: false, - items: "li", - menuElement: "ul", - menuIcon: false, - position: { - my: "left top", - at: "left bottom" - } - }, - _create: function() { - var that = this; - this.menuItems = this.element.children( this.options.items ); - this.items = this.menuItems.children( "button, a" ); - - this.menuItems - .addClass( "ui-menubar-item" ) - .attr( "role", "presentation" ); - // let only the first item receive focus - this.items.slice(1).attr( "tabIndex", -1 ); - - this.element - .addClass( "ui-menubar ui-widget-header ui-helper-clearfix" ) - .attr( "role", "menubar" ); - this._focusable( this.items ); - this._hoverable( this.items ); - this.items.siblings( this.options.menuElement ) - .menu({ - position: { - within: this.options.position.within - }, - select: function( event, ui ) { - ui.item.parents( "ul.ui-menu:last" ).hide(); - that._close(); - // TODO what is this targetting? there's probably a better way to access it - $(event.target).prev().focus(); - that._trigger( "select", event, ui ); - }, - menus: that.options.menuElement - }) - .hide() - .attr({ - "aria-hidden": "true", - "aria-expanded": "false" - }) - .bind( "keydown.menubar", function( event ) { - var menu = $( this ); - if ( menu.is( ":hidden" ) ) - return; - switch ( event.keyCode ) { - case $.ui.keyCode.LEFT: - that.previous( event ); - event.preventDefault(); - break; - case $.ui.keyCode.RIGHT: - that.next( event ); - event.preventDefault(); - break; - }; - }); - this.items.each(function() { - var input = $(this), - // TODO menu var is only used on two places, doesn't quite justify the .each - menu = input.next( that.options.menuElement ); - - input.bind( "click.menubar focus.menubar mouseenter.menubar", function( event ) { - // ignore triggered focus event - if ( event.type == "focus" && !event.originalEvent ) { - return; - } - event.preventDefault(); - // TODO can we simplify or extractthis check? especially the last two expressions - // there's a similar active[0] == menu[0] check in _open - if ( event.type == "click" && menu.is( ":visible" ) && that.active && that.active[0] == menu[0] ) { - that._close(); - return; - } - if ( ( that.open && event.type == "mouseenter" ) || event.type == "click" || that.options.autoExpand ) { - if( that.options.autoExpand ) { - clearTimeout( that.closeTimer ); - } - - that._open( event, menu ); - } - }) - .bind( "keydown", function( event ) { - switch ( event.keyCode ) { - case $.ui.keyCode.SPACE: - case $.ui.keyCode.UP: - case $.ui.keyCode.DOWN: - that._open( event, $( this ).next() ); - event.preventDefault(); - break; - case $.ui.keyCode.LEFT: - that.previous( event ); - event.preventDefault(); - break; - case $.ui.keyCode.RIGHT: - that.next( event ); - event.preventDefault(); - break; - } - }) - .addClass( "ui-button ui-widget ui-button-text-only ui-menubar-link" ) - .attr( "role", "menuitem" ) - .attr( "aria-haspopup", "true" ) - .wrapInner( "" ); - - // TODO review if these options are a good choice, maybe they can be merged - if ( that.options.menuIcon ) { - input.addClass( "ui-state-default" ).append( "" ); - input.removeClass( "ui-button-text-only" ).addClass( "ui-button-text-icon-secondary" ); - } - - if ( !that.options.buttons ) { - // TODO ui-menubar-link is added above, not needed here? - input.addClass( "ui-menubar-link" ).removeClass( "ui-state-default" ); - }; - - }); - that._bind( { - keydown: function( event ) { - if ( event.keyCode == $.ui.keyCode.ESCAPE && that.active && that.active.menu( "collapse", event ) !== true ) { - var active = that.active; - that.active.blur(); - that._close( event ); - active.prev().focus(); - } - }, - focusin: function( event ) { - clearTimeout( that.closeTimer ); - }, - focusout: function( event ) { - that.closeTimer = setTimeout( function() { - that._close( event ); - }, 150); - }, - "mouseleave .ui-menubar-item": function( event ) { - if ( that.options.autoExpand ) { - that.closeTimer = setTimeout( function() { - that._close( event ); - }, 150); - } - }, - "mouseenter .ui-menubar-item": function( event ) { - clearTimeout( that.closeTimer ); - } - }); - }, - - _destroy : function() { - this.menuItems - .removeClass( "ui-menubar-item" ) - .removeAttr( "role" ); - - this.element - .removeClass( "ui-menubar ui-widget-header ui-helper-clearfix" ) - .removeAttr( "role" ) - .unbind( ".menubar" ); - - this.items - .unbind( ".menubar" ) - .removeClass( "ui-button ui-widget ui-button-text-only ui-menubar-link ui-state-default" ) - .removeAttr( "role" ) - .removeAttr( "aria-haspopup" ) - // TODO unwrap? - .children( "span.ui-button-text" ).each(function( i, e ) { - var item = $( this ); - item.parent().html( item.html() ); - }) - .end() - .children( ".ui-icon" ).remove(); - - this.element.find( ":ui-menu" ) - .menu( "destroy" ) - .show() - .removeAttr( "aria-hidden" ) - .removeAttr( "aria-expanded" ) - .removeAttr( "tabindex" ) - .unbind( ".menubar" ); - }, - - _close: function() { - if ( !this.active || !this.active.length ) - return; - this.active - .menu( "collapseAll" ) - .hide() - .attr({ - "aria-hidden": "true", - "aria-expanded": "false" - }); - this.active - .prev() - .removeClass( "ui-state-active" ) - .removeAttr( "tabIndex" ); - this.active = null; - this.open = false; - }, - - _open: function( event, menu ) { - // on a single-button menubar, ignore reopening the same menu - if ( this.active && this.active[0] == menu[0] ) { - return; - } - // TODO refactor, almost the same as _close above, but don't remove tabIndex - if ( this.active ) { - this.active - .menu( "collapseAll" ) - .hide() - .attr({ - "aria-hidden": "true", - "aria-expanded": "false" - }); - this.active - .prev() - .removeClass( "ui-state-active" ); - } - // set tabIndex -1 to have the button skipped on shift-tab when menu is open (it gets focus) - var button = menu.prev().addClass( "ui-state-active" ).attr( "tabIndex", -1 ); - this.active = menu - .show() - .position( $.extend({ - of: button - }, this.options.position ) ) - .removeAttr( "aria-hidden" ) - .attr( "aria-expanded", "true" ) - .menu("focus", event, menu.children( ".ui-menu-item" ).first() ) - // TODO need a comment here why both events are triggered - .focus() - .focusin(); - this.open = true; - }, - - next: function( event ) { - this._move( "next", "first", event ); - }, - - previous: function( event ) { - this._move( "prev", "last", event ); - }, - - _move: function( direction, filter, event ) { - var next, - wrapItem; - if ( this.open ) { - next = this.active.closest( ".ui-menubar-item" )[ direction + "All" ]( this.options.items ).first().children( ".ui-menu" ).eq( 0 ); - wrapItem = this.menuItems[ filter ]().children( ".ui-menu" ).eq( 0 ); - } else { - if ( event ) { - next = $( event.target ).closest( ".ui-menubar-item" )[ direction + "All" ]( this.options.items ).children( ".ui-menubar-link" ).eq( 0 ); - wrapItem = this.menuItems[ filter ]().children( ".ui-menubar-link" ).eq( 0 ); - } else { - next = wrapItem = this.menuItems.children( "a" ).eq( 0 ); - } - } - - if ( next.length ) { - if ( this.open ) { - this._open( event, next ); - } else { - next.removeAttr( "tabIndex")[0].focus(); - } - } else { - if ( this.open ) { - this._open( event, wrapItem ); - } else { - wrapItem.removeAttr( "tabIndex")[0].focus(); - } - } - } -}); - -}( jQuery )); diff --git a/ui/jquery.ui.popup.js b/ui/jquery.ui.popup.js deleted file mode 100644 index 128464cc2..000000000 --- a/ui/jquery.ui.popup.js +++ /dev/null @@ -1,279 +0,0 @@ -/* - * jQuery UI Popup @VERSION - * - * Copyright 2011, AUTHORS.txt (http://jqueryui.com/about) - * Dual licensed under the MIT or GPL Version 2 licenses. - * http://jquery.org/license - * - * http://docs.jquery.com/UI/Popup - * - * Depends: - * jquery.ui.core.js - * jquery.ui.widget.js - * jquery.ui.position.js - */ -(function($) { - -var idIncrement = 0, - suppressExpandOnFocus = false; - -$.widget( "ui.popup", { - version: "@VERSION", - options: { - position: { - my: "left top", - at: "left bottom" - }, - managed: false, - expandOnFocus: false, - show: { - effect: "slideDown", - duration: "fast" - }, - hide: { - effect: "fadeOut", - duration: "fast" - } - }, - _create: function() { - if ( !this.options.trigger ) { - this.options.trigger = this.element.prev(); - } - - if ( !this.element.attr( "id" ) ) { - this.element.attr( "id", "ui-popup-" + idIncrement++ ); - this.generatedId = true; - } - - if ( !this.element.attr( "role" ) ) { - if ( !this.options.managed ) { - this.element.attr( "role", "dialog" ); - this.generatedRole = true; - } - } - - this.options.trigger - .attr( "aria-haspopup", "true" ) - .attr( "aria-owns", this.element.attr( "id" ) ); - - this.element - .addClass( "ui-popup" ); - this._beforeClose(); - this.element.hide(); - - this._bind(this.options.trigger, { - keydown: function( event ) { - switch ( event.keyCode ) { - case $.ui.keyCode.TAB: - // Waiting for close() will make popup hide too late, which breaks tab key behavior - this.element.hide(); - this.close( event ); - break; - case $.ui.keyCode.ESCAPE: - if ( this.isOpen ) { - this.close( event ); - } - break; - case $.ui.keyCode.SPACE: - // prevent space-to-open to scroll the page, only happens for anchor ui.button - // TODO check for $.ui.button before using custom selector, once more below - if ( this.options.trigger.is( "a:ui-button" ) ) { - event.preventDefault(); - } - - else if (this.options.trigger.is( "a:not(:ui-button)" ) ) { - this.options.trigger.trigger( "click", event ); - } - break; - case $.ui.keyCode.DOWN: - case $.ui.keyCode.UP: - // prevent scrolling - event.preventDefault(); - clearTimeout( this.closeTimer ); - this._delay(function() { - this.open( event ); - this.focusPopup( event ); - }, 1); - break; - } - }, - click: function( event ) { - event.stopPropagation(); - event.preventDefault(); - }, - mousedown: function( event ) { - var noFocus = false; - /* TODO: Determine in which cases focus should stay on the trigger after the popup opens - (should apply for any trigger that has other interaction besides opening the popup, e.g. a text field) */ - if ( $( event.target ).is( "input" ) ) { - noFocus = true; - } - if (this.isOpen) { - suppressExpandOnFocus = true; - this.close(); - return; - } - this.open( event ); - clearTimeout( this.closeTimer ); - this._delay( function() { - if ( !noFocus ) { - this.focusPopup(); - } - }, 1 ); - } - }); - - if ( this.options.expandOnFocus ) { - this._bind( this.options.trigger, { - focus : function( event ) { - if ( !suppressExpandOnFocus ) { - this._delay( function() { - if ( !this.isOpen ) { - this.open( event ); - } - }, 1); - } - this._delay( function() { - suppressExpandOnFocus = false; - }, 100); - }, - blur: function( event ) { - suppressExpandOnFocus = false; - } - }); - } - if ( !this.options.managed ) { - //default use case, wrap tab order in popup - this._bind({ keydown : function( event ) { - if ( event.keyCode !== $.ui.keyCode.TAB ) { - return; - } - var tabbables = $( ":tabbable", this.element ), - first = tabbables.first(), - last = tabbables.last(); - if ( event.target === last[ 0 ] && !event.shiftKey ) { - first.focus( 1 ); - event.preventDefault(); - } else if ( event.target === first[ 0 ] && event.shiftKey ) { - last.focus( 1 ); - event.preventDefault(); - } - } - }); - } - - this._bind({ - focusout: function( event ) { - // use a timer to allow click to clear it and letting that - // handle the closing instead of opening again - this.closeTimer = this._delay( function() { - this.close( event ); - }, 150); - }, - focusin: function( event ) { - clearTimeout( this.closeTimer ); - }, - mouseup: function( event ) { - clearTimeout( this.closeTimer ); - } - }); - - this._bind({ - keyup: function( event ) { - if ( event.keyCode == $.ui.keyCode.ESCAPE && this.element.is( ":visible" ) ) { - this.close( event ); - this.focusTrigger(); - } - } - }); - - this._bind( this.document, { - click: function( event ) { - if ( this.isOpen && !$( event.target ).closest( this.element.add( this.options.trigger ) ).length ) { - this.close( event ); - } - } - }); - }, - - _destroy: function() { - this.element - .show() - .removeClass( "ui-popup" ) - .removeAttr( "aria-hidden" ) - .removeAttr( "aria-expanded" ) - .unbind( "keypress.ui-popup"); - - this.options.trigger - .removeAttr( "aria-haspopup" ) - .removeAttr( "aria-owns" ); - - if ( this.generatedId ) { - this.element.removeAttr( "id" ); - } - if ( this.generatedRole ) { - this.element.removeAttr( "role" ); - } - }, - - open: function( event ) { - var position = $.extend( {}, { - of: this.options.trigger - }, this.options.position ); - - this._show( this.element, this.options.show ); - this.element - .attr( "aria-hidden", "false" ) - .attr( "aria-expanded", "true" ) - .position( position ); - - // take trigger out of tab order to allow shift-tab to skip trigger - this.options.trigger.attr( "tabindex", -1 ); - this.isOpen = true; - this._trigger( "open", event ); - }, - - focusPopup: function( event ) { - if ( !this.options.managed ) { - // set focus to the first tabbable element in the popup container - // if there are no tabbable elements, set focus on the popup itself - var tabbables = this.element.find( ":tabbable" ); - this.removeTabIndex = false; - if ( !tabbables.length ) { - if ( !this.element.is(":tabbable") ) { - this.element.attr("tabindex", "0"); - this.removeTabIndex = true; - } - tabbables = tabbables.add( this.element[ 0 ] ); - } - tabbables.first().focus( 1 ); - } - this._trigger( "focusPopup", event ); - }, - - focusTrigger: function( event ) { - suppressExpandOnFocus = true; - this.options.trigger.focus(); - this._trigger( "focusTrigger", event ); - }, - - close: function( event ) { - this._beforeClose(); - this._hide( this.element, this.options.hide ); - - this.options.trigger.attr( "tabindex" , 0 ); - if ( this.removeTabIndex ) { - this.element.removeAttr( "tabindex" ); - } - this.isOpen = false; - this._trigger( "close", event ); - }, - - _beforeClose: function() { - this.element - .attr( "aria-hidden", "true" ) - .attr( "aria-expanded", "false" ); - } -}); - -}(jQuery));