Skip to content

Commit

Permalink
Merge branch 'widget-delegation'
Browse files Browse the repository at this point in the history
  • Loading branch information
@jzaefferer
jzaefferer committed Jul 29, 2011
2 parents 61caba7 + 0ff3396 commit 982b752
Show file tree
Hide file tree
Showing 3 changed files with 80 additions and 53 deletions.
53 changes: 43 additions & 10 deletions tests/unit/widget/widget_core.js
View file
Expand Up @@ -89,7 +89,7 @@ test( "jQuery usage", function() {
"parameter passed via .pluginName(methodName, param)" );
equals( param2, "value2",
"multiple parameters passed via .pluginName(methodName, param, param)" );

return this;
},
getterSetterMethod: function( val ) {
Expand Down Expand Up @@ -153,17 +153,17 @@ test( "direct usage", function() {
}
}
});

var elem = $( "<div>" )[ 0 ];

shouldCreate = true;
var instance = new $.ui.testWidget( {}, elem );
shouldCreate = false;

equals( $( elem ).data( "testWidget" ), instance,
"instance stored in .data(pluginName)" );
equals( instance.element[ 0 ], elem, "element stored on widget" );

var ret = instance.methodWithParams( "value1", "value2" );
equals( ret, instance, "plugin returned from method call" );

Expand Down Expand Up @@ -193,7 +193,7 @@ test( "error handling", function() {
equal( msg, "no such method '_privateMethod' for testWidget widget instance",
"invalid method call on widget instance" );
};
$( "<div>" ).testWidget().testWidget( "_privateMethod" );
$( "<div>" ).testWidget().testWidget( "_privateMethod" );
$.error = error;
});

Expand Down Expand Up @@ -463,7 +463,7 @@ test( ".option() - delegate to ._setOptions()", function() {
calls = [];
div.testWidget( "option", "foo", "bar" );
same( calls, [{ foo: "bar" }], "_setOptions called for single option" );

calls = [];
div.testWidget( "option", {
bar: "qux",
Expand All @@ -490,7 +490,7 @@ test( ".option() - delegate to ._setOption()", function() {
div.testWidget( "option", "foo", "bar" );
same( calls, [{ key: "foo", val: "bar" }],
"_setOption called for single option" );

calls = [];
div.testWidget( "option", {
bar: "qux",
Expand Down Expand Up @@ -666,6 +666,39 @@ test( "._bind() to descendent", function() {
.trigger( "keydown" );
});

test( "_bind() with delegate", function() {
expect( 8 );
$.widget( "ui.testWidget", {
_create: function() {
this.element = {
bind: function( event, handler ) {
equal( event, "click.testWidget" );
ok( $.isFunction(handler) );
},
delegate: function( selector, event, handler ) {
equal( selector, "a" );
equal( event, "click.testWidget" );
ok( $.isFunction(handler) );
},
trigger: $.noop
};
this._bind({
"click": "handler",
"click a": "handler",
});
this.element.delegate = function( selector, event, handler ) {
equal( selector, "form fieldset > input" );
equal( event, "change.testWidget" );
ok( $.isFunction(handler) );
};
this._bind({
"change form fieldset > input": "handler"
});
}
});
$.ui.testWidget();
});

test( "._hoverable()", function() {
$.widget( "ui.testWidget", {
_create: function() {
Expand Down Expand Up @@ -703,14 +736,14 @@ test( "._focusable()", function() {
this._focusable( this.element.children() );
}
});

var div = $( "#widget" ).testWidget().children();
ok( !div.hasClass( "ui-state-focus" ), "not focused on init" );
div.trigger( "focusin" );
ok( div.hasClass( "ui-state-focus" ), "focused after explicit focus" );
div.trigger( "focusout" );
ok( !div.hasClass( "ui-state-focus" ), "not focused after blur" );

div.trigger( "focusin" );
ok( div.hasClass( "ui-state-focus" ), "focused after explicit focus" );
$( "#widget" ).testWidget( "disable" );
Expand All @@ -719,7 +752,7 @@ test( "._focusable()", function() {
ok( !div.hasClass( "ui-state-focus" ), "can't focus while disabled" );
$( "#widget" ).testWidget( "enable" );
ok( !div.hasClass( "ui-state-focus" ), "enabling doesn't reset focus" );

div.trigger( "focusin" );
ok( div.hasClass( "ui-state-focus" ), "focused after explicit focus" );
$( "#widget" ).testWidget( "destroy" );
Expand Down
67 changes: 26 additions & 41 deletions ui/jquery.ui.menu.js
View file
Expand Up @@ -38,52 +38,37 @@ $.widget( "ui.menu", {
id: this.menuId,
role: "menu"
})
// need to catch all clicks on disabled menu
// not possible through _bind
.bind( "click.menu", function( event ) {
var item = $( event.target ).closest( ".ui-menu-item:has(a)" );
if ( self.options.disabled ) {
return false;
}
if ( !item.length ) {
return;
event.preventDefault();
}
});
this._bind({
"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 ( !self.active || ( self.active[ 0 ] !== item[ 0 ] ) ) {
self.focus( event, item );
}
self.select( event );
})
.bind( "mouseover.menu", function( event ) {
if ( self.options.disabled ) {
return;
}
var target = $( event.target ).closest( ".ui-menu-item" );
if ( target.length ) {
//Remove ui-state-active class from siblings of the newly focused menu item to avoid a jump caused by adjacent elements both having a class with a border
target.siblings().children( ".ui-state-active" ).removeClass( "ui-state-active" );
self.focus( event, target );
}
})
.bind( "mouseout.menu", function( event ) {
if ( self.options.disabled ) {
return;
}
var target = $( event.target ).closest( ".ui-menu-item" );
if ( target.length ) {
self.blur( event );
if ( !this.active || ( this.active[ 0 ] !== target[ 0 ] ) ) {
this.focus( event, target );
}
})
.bind( "focus.menu", function( event ) {
if ( self.options.disabled ) {
return;
}
self.focus( event, $( event.target ).children( ".ui-menu-item:first" ) );
})
.bind( "blur.menu", function( event ) {
if ( self.options.disabled ) {
return;
}
self.collapseAll( event );
});
this.select( event );
},
"mouseover .ui-menu-item": function( event ) {
event.stopImmediatePropagation();
var target = $( event.currentTarget );
// Remove ui-state-active class from siblings of the newly focused menu item to avoid a jump caused by adjacent elements both having a class with a border
target.siblings().children( ".ui-state-active" ).removeClass( "ui-state-active" );
this.focus( event, target );
},
"mouseout .ui-menu-item": "blur",
"focus": function( event ) {
this.focus( event, $( event.target ).children( ".ui-menu-item:first" ) );
},
"blur": "collapseAll"
});

this.refresh();

this.element.attr( "tabIndex", 0 ).bind( "keydown.menu", function( event ) {
Expand Down
13 changes: 11 additions & 2 deletions ui/jquery.ui.widget.js
View file
Expand Up @@ -305,9 +305,10 @@ $.Widget.prototype = {
element = $( element );
this.bindings = this.bindings.add( element );
}

var instance = this;
$.each( handlers, function( event, handler ) {
element.bind( event + "." + instance.widgetName, function() {
function handlerProxy() {
// allow widgets to customize the disabled handling
// - disabled as an array instead of boolean
// - disabled class as method for disabling individual parts
Expand All @@ -317,7 +318,15 @@ $.Widget.prototype = {
}
return ( typeof handler === "string" ? instance[ handler ] : handler )
.apply( instance, arguments );
});
}
var match = event.match( /^(\w+)\s*(.*)$/ ),
eventName = match[1] + "." + instance.widgetName,
selector = match[2];
if ( selector ) {
element.delegate( selector, eventName, handlerProxy );
} else {
element.bind( eventName, handlerProxy );
}
});
},

Expand Down

0 comments on commit 982b752

Please sign in to comment.