Dialog: Refactor the mousedown-bind call to use _on, removing the need for the uiDialog closure. Use this.uiDialog and remove the variable.

This commit is contained in:
Jörn Zaefferer 2012-11-15 23:10:22 +01:00
parent 1001504249
commit 7a0353500a

View File

@ -93,15 +93,13 @@ $.widget("ui.dialog", {
var that = this, var that = this,
options = this.options, options = this.options,
title = options.title || " ", title = options.title || " ",
// TODO should use this.uiDialog instead
uiDialog,
// TODO should use this.uiDialogTitlebar instead // TODO should use this.uiDialogTitlebar instead
uiDialogTitlebar, uiDialogTitlebar,
uiDialogTitle, uiDialogTitle,
uiDialogButtonPane; uiDialogButtonPane;
// TODO extract into _createWrapper // TODO extract into _createWrapper
uiDialog = ( this.uiDialog = $( "<div>" ) ) this.uiDialog = $( "<div>" )
.addClass( uiDialogClasses + options.dialogClass ) .addClass( uiDialogClasses + options.dialogClass )
.hide() .hide()
// setting tabIndex makes the div focusable // setting tabIndex makes the div focusable
@ -124,17 +122,19 @@ $.widget("ui.dialog", {
.show() .show()
.removeAttr( "title" ) .removeAttr( "title" )
.addClass( "ui-dialog-content ui-widget-content" ) .addClass( "ui-dialog-content ui-widget-content" )
.appendTo( uiDialog ); .appendTo( this.uiDialog );
// TODO extract this and the next three into a _createTitlebar method // TODO extract this and the next three into a _createTitlebar method
uiDialogTitlebar = ( this.uiDialogTitlebar = $( "<div>" ) ) uiDialogTitlebar = ( this.uiDialogTitlebar = $( "<div>" ) )
.addClass( "ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" ) .addClass( "ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix" )
// TODO use _on, call _focusTabbable or _keepFocus .prependTo( this.uiDialog );
.bind( "mousedown", function() { this._on( uiDialogTitlebar, {
mousedown: function() {
// TODO call _focusTabbable or _keepFocus
// Dialog isn't getting focus when dragging (#8063) // Dialog isn't getting focus when dragging (#8063)
uiDialog.focus(); this.uiDialog.focus();
}) }
.prependTo( uiDialog ); });
this.uiDialogTitlebarClose = $( "<button></button>" ) this.uiDialogTitlebarClose = $( "<button></button>" )
.button({ .button({
@ -166,7 +166,7 @@ $.widget("ui.dialog", {
.appendTo( uiDialogButtonPane ); .appendTo( uiDialogButtonPane );
// TODO move into _createWrapper // TODO move into _createWrapper
uiDialog.attr({ this.uiDialog.attr({
role: "dialog", role: "dialog",
"aria-labelledby": uiDialogTitle.attr( "id" ) "aria-labelledby": uiDialogTitle.attr( "id" )
}); });
@ -176,7 +176,7 @@ $.widget("ui.dialog", {
// that the dialog content is marked up properly // that the dialog content is marked up properly
// otherwise we brute force the content as the description // otherwise we brute force the content as the description
if ( !this.element.find( "[aria-describedby]" ).length ) { if ( !this.element.find( "[aria-describedby]" ).length ) {
uiDialog.attr({ this.uiDialog.attr({
"aria-describedby": this.element.uniqueId().attr( "id" ) "aria-describedby": this.element.uniqueId().attr( "id" )
}); });
} }
@ -196,19 +196,19 @@ $.widget("ui.dialog", {
// prevent tabbing out of dialogs // prevent tabbing out of dialogs
// TODO move into _createWrapper // TODO move into _createWrapper
// TODO fix formatting // TODO fix formatting
this._on( uiDialog, { keydown: function( event ) { this._on( this.uiDialog, { keydown: function( event ) {
if ( event.keyCode !== $.ui.keyCode.TAB ) { if ( event.keyCode !== $.ui.keyCode.TAB ) {
return; return;
} }
var tabbables = $( ":tabbable", uiDialog ), var tabbables = $( ":tabbable", this.uiDialog ),
first = tabbables.filter( ":first" ), first = tabbables.filter( ":first" ),
last = tabbables.filter( ":last" ); last = tabbables.filter( ":last" );
if ( ( event.target === last[ 0 ] || event.target === uiDialog[ 0 ] ) && !event.shiftKey ) { if ( ( event.target === last[ 0 ] || event.target === this.uiDialog[ 0 ] ) && !event.shiftKey ) {
first.focus( 1 ); first.focus( 1 );
return false; return false;
} else if ( ( event.target === first[ 0 ] || event.target === uiDialog[ 0 ] ) && event.shiftKey ) { } else if ( ( event.target === first[ 0 ] || event.target === this.uiDialog[ 0 ] ) && event.shiftKey ) {
last.focus( 1 ); last.focus( 1 );
return false; return false;
} }