Permalink
Browse files

Merge branch 'master' into selectmenu

  • Loading branch information...
2 parents c00b685 + a8d0e4c commit a53916b45427d1afa3507acbebb6f92a03bbcd84 @kborchers kborchers committed Dec 15, 2011
View
@@ -35,6 +35,15 @@
},
select: select
});
+
+ $("#bar3").menubar({
+ position: {
+ within: $("#demo-frame").add(window).first()
+ },
+ select: select,
+ items: ".menubarItem",
+ menuElement: ".menuElement"
+ });
});
</script>
<style>
@@ -136,6 +145,52 @@
</li>
</ul>
+<div id="bar3" class="menubar">
+ <div class="menubarItem">
+ <a href="#File">File</a>
+ <div class="menuElement">
+ <div><a href="#Open...">Open...</a></div>
+ <div class="ui-state-disabled">Open recent...</div>
+ <div><a href="#Save">Save</a></div>
+ <div><a href="#Save as...">Save as...</a></div>
+ <div><a href="#Close">Close</a></div>
+ <div><a href="#Quit">Quit</a></div>
+ </div>
+ </div>
+ <div class="menubarItem">
+ <a href="#Edit">Edit</a>
+ <div class="menuElement">
+ <div><a href="#Copy">Copy</a></div>
+ <div><a href="#Cut">Cut</a></div>
+ <div class="ui-state-disabled">Paste</div>
+ </div>
+ </div>
+ <div class="menubarItem">
+ <a href="#View">View</a>
+ <div class="menuElement">
+ <div><a href="#Fullscreen">Fullscreen</a></div>
+ <div><a href="#Fit into view">Fit into view</a></div>
+ <div>
+ <a href="#Encoding">Encoding</a>
+ <div class="menuElement">
+ <div class="ui-state-disabled">Auto-detect</div>
+ <div><a href="#UTF-8">UTF-8</a></div>
+ <div>
+ <a href="#UTF-16">UTF-16</a>
+ <div class="menuElement">
+ <div><a href="#Option 1">Option 1</a></div>
+ <div><a href="#Option 2">Option 2</a></div>
+ <div class="ui-state-disabled">Option 3</div>
+ <div><a href="#Option 4">Option 4</a></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div><a href="#Customize...">Customize...</a></div>
+ </div>
+ </div>
+</div>
+
<div class="ui-widget" style="margin-top:2em; font-family:Arial">
Log:
<div id="log" style="height: 100px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
@@ -5,7 +5,7 @@ commonWidgetTests( "menu", {
my: "left top",
at: "right top"
},
- items: "ul",
+ menus: "ul",
trigger: null,
// callbacks
@@ -27,7 +27,7 @@ test("handle click on custom item menu", function() {
select: function(event, ui) {
menu_log();
},
- items: "div"
+ menus: "div"
});
menu_log("click",true);
menu_click($('#menu5'),"1");
@@ -38,6 +38,8 @@ test("handle click on custom item menu", function() {
equals( $("#log").html(), "1,3,2,afterclick,1,click,", "Click order not valid.");
});
+/* Commenting out these tests until a way to handle the extra focus and blur events
+ fired by IE is found
test( "handle blur: click", function() {
expect( 4 );
var $menu = $( "#menu1" ).menu({
@@ -78,6 +80,7 @@ test( "handle blur on custom item menu: click", function() {
$("#remove").remove();
});
+*/
asyncTest( "handle submenu auto collapse: mouseleave", function() {
expect( 4 );
@@ -100,7 +103,7 @@ asyncTest( "handle submenu auto collapse: mouseleave", function() {
asyncTest( "handle custom menu item submenu auto collapse: mouseleave", function() {
expect( 5 );
- var $menu = $( "#menu5" ).menu( { items: "div" } );
+ var $menu = $( "#menu5" ).menu( { menus: "div" } );
$menu.children( ":nth-child(7)" ).trigger( "mouseover" );
setTimeout(function() {
@@ -28,14 +28,14 @@
select: function(event, ui) {
$("<div/>").text("Selected: " + ui.item.text()).appendTo("#log");
},
- items: "div"
+ menus: "div"
});
$("#menu6").menu({
select: function(event, ui) {
$("<div/>").text("Selected: " + ui.item.text()).appendTo("#log");
},
- items: ".menuElement"
+ menus: ".menuElement"
});
}
@@ -14,7 +14,7 @@
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active { font-weight: normal; margin: -1px; }
-.ui-menu li.ui-state-disabled { font-weight: normal; padding: .0em .4em; margin: .4em 0 .2em; line-height: 1.5; }
+.ui-menu .ui-state-disabled { font-weight: normal; padding: .0em .4em; margin: .4em 0 .2em; line-height: 1.5; }
/* icon support */
.ui-menu-icons { position: relative; }
@@ -12,4 +12,4 @@
.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; }
+.ui-menubar .ui-menu { width: 200px; position: absolute; z-index: 9999; font-weight: normal; }
View
@@ -54,14 +54,13 @@ $.widget( "ui.menu", {
},
"click .ui-menu-item:has(a)": function( event ) {
event.stopImmediatePropagation();
- var target = $( event.currentTarget );
- // it's possible to click an item without hovering it (#7085)
- if ( !this.active || ( this.active[ 0 ] !== target[ 0 ] ) ) {
- this.focus( event, target );
- }
this.select( event );
- // Redirect focus to the menu.
- this.element.focus();
+ // Redirect focus to the menu with a delay for firefox
+ this._delay( function() {
+ if ( !this.element.is(":focus") ) {
+ this.element.focus();
+ }
+ }, 20);
},
"mouseover .ui-menu-item": function( event ) {
event.stopImmediatePropagation();
@@ -72,9 +71,21 @@ $.widget( "ui.menu", {
},
"mouseleave": "collapseAll",
"mouseleave .ui-menu": "collapseAll",
- "mouseout .ui-menu-item": "blur",
"focus": function( event ) {
- this.focus( event, $( event.target ).children( ".ui-menu-item:first" ) );
+ var firstItem = this.element.children( ".ui-menu-item" ).eq( 0 );
+ if ( this._hasScroll() && !this.active ) {
+ var menu = this.element;
+ menu.children().each( function() {
+ var currentItem = $( this );
+ if ( currentItem.offset().top - menu.offset().top >= 0 ) {
+ firstItem = currentItem;
+ return false;
+ }
+ });
+ } else if ( this.active ) {
+ firstItem = this.active;
+ }
+ this.focus( event, firstItem );
},
blur: function( event ) {
this._delay( function() {
@@ -283,21 +294,6 @@ $.widget( "ui.menu", {
focus: function( event, item ) {
this.blur( event );
- if ( this._hasScroll() ) {
- var borderTop = parseFloat( $.curCSS( this.activeMenu[0], "borderTopWidth", true ) ) || 0,
- paddingTop = parseFloat( $.curCSS( this.activeMenu[0], "paddingTop", true ) ) || 0,
- offset = item.offset().top - this.activeMenu.offset().top - borderTop - paddingTop,
- scroll = this.activeMenu.scrollTop(),
- elementHeight = this.activeMenu.height(),
- itemHeight = item.height();
-
- if ( offset < 0 ) {
- this.activeMenu.scrollTop( scroll + offset );
- } else if ( offset + itemHeight > elementHeight ) {
- this.activeMenu.scrollTop( scroll + offset - elementHeight + itemHeight );
- }
- }
-
this.active = item.first()
.children( "a" )
.addClass( "ui-state-focus" )
@@ -463,15 +459,14 @@ $.widget( "ui.menu", {
},
nextPage: function( event ) {
+ if ( !this.active ) {
+ this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() );
+ return;
+ }
+ if ( this.last() ) {
+ return;
+ }
if ( this._hasScroll() ) {
- if ( !this.active ) {
- this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() );
- return;
- }
- if ( this.last() ) {
- return;
- }
-
var base = this.active.offset().top,
height = this.element.height(),
result;
@@ -488,15 +483,14 @@ $.widget( "ui.menu", {
},
previousPage: function( event ) {
+ if ( !this.active ) {
+ this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() );
+ return;
+ }
+ if ( this.first() ) {
+ return;
+ }
if ( this._hasScroll() ) {
- if ( !this.active ) {
- this.focus( event, this.activeMenu.children( ".ui-menu-item" ).first() );
- return;
- }
- if ( this.first() ) {
- return;
- }
-
var base = this.active.offset().top,
height = this.element.height(),
result;
@@ -512,7 +506,7 @@ $.widget( "ui.menu", {
},
_hasScroll: function() {
- return this.element.height() < this.element.prop( "scrollHeight" );
+ return this.element.outerHeight() < this.element.prop( "scrollHeight" );
},
select: function( event ) {
Oops, something went wrong.

1 comment on commit a53916b

Owner

kborchers commented on a53916b Dec 15, 2011

@fnagel Please take a look at these changes and let me know how selectmenu works as far as the focus issues are concerned. I think this should take care of it.

Please sign in to comment.