From c614889b30d6ddd8ddaed7d1da78336f2648056b Mon Sep 17 00:00:00 2001 From: =?utf8?q?Scott=20Gonz=C3=A1lez?= Date: Fri, 17 Dec 2010 19:53:22 -0500 Subject: [PATCH] Dialog: Coding standards. --- ui/jquery.ui.dialog.js | 553 ++++++++++++++++++++--------------------- 1 file changed, 276 insertions(+), 277 deletions(-) diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js index c4452368f..da57ae984 100644 --- a/ui/jquery.ui.dialog.js +++ b/ui/jquery.ui.dialog.js @@ -18,11 +18,7 @@ */ (function( $, undefined ) { -var uiDialogClasses = - 'ui-dialog ' + - 'ui-widget ' + - 'ui-widget-content ' + - 'ui-corner-all ', +var uiDialogClasses = "ui-dialog ui-widget ui-widget-content ui-corner-all ", sizeRelatedOptions = { buttons: true, height: true, @@ -44,39 +40,39 @@ $.widget("ui.dialog", { autoOpen: true, buttons: {}, closeOnEscape: true, - closeText: 'close', - dialogClass: '', + closeText: "close", + dialogClass: "", draggable: true, hide: null, - height: 'auto', + height: "auto", maxHeight: false, maxWidth: false, minHeight: 150, minWidth: 150, modal: false, position: { - my: 'center', - at: 'center', + my: "center", + at: "center", of: window, - collision: 'fit', + collision: "fit", // ensure that the titlebar is never outside the document - using: function(pos) { - var topOffset = $(this).css(pos).offset().top; - if (topOffset < 0) { - $(this).css('top', pos.top - topOffset); + using: function( pos ) { + var topOffset = $( this ).css( pos ).offset().top; + if ( topOffset < 0 ) { + $( this ).css( "top", pos.top - topOffset ); } } }, resizable: true, show: null, stack: true, - title: '', + title: "", width: 300, zIndex: 1000 }, _create: function() { - this.originalTitle = this.element.attr('title'); + this.originalTitle = this.element.attr( "title" ); // #5742 - .attr() might return a DOMElement if ( typeof this.originalTitle !== "string" ) { this.originalTitle = ""; @@ -86,104 +82,93 @@ $.widget("ui.dialog", { var self = this, options = self.options, - title = options.title || ' ', - titleId = $.ui.dialog.getTitleId(self.element), + title = options.title || " ", + titleId = $.ui.dialog.getTitleId( self.element ), - uiDialog = (self.uiDialog = $('
')) - .appendTo(document.body) + uiDialog = ( self.uiDialog = $( "
" ) ) + .appendTo( document.body ) .hide() - .addClass(uiDialogClasses + options.dialogClass) + .addClass( uiDialogClasses + options.dialogClass ) .css({ zIndex: options.zIndex }) // setting tabIndex makes the div focusable - // setting outline to 0 prevents a border on focus in Mozilla - .attr('tabIndex', -1).css('outline', 0).keydown(function(event) { - if (options.closeOnEscape && event.keyCode && - event.keyCode === $.ui.keyCode.ESCAPE) { - - self.close(event); + .attr( "tabIndex", -1) + // TODO: move to stylesheet + .css( "outline", 0 ) + .keydown(function( event ) { + if ( options.closeOnEscape && event.keyCode && + event.keyCode === $.ui.keyCode.ESCAPE ) { + self.close( event ); event.preventDefault(); } }) .attr({ - role: 'dialog', - 'aria-labelledby': titleId + role: "dialog", + "aria-labelledby": titleId }) - .mousedown(function(event) { - self.moveToTop(false, event); + .mousedown(function( event ) { + self.moveToTop( false, event ); }), uiDialogContent = self.element .show() - .removeAttr('title') - .addClass( - 'ui-dialog-content ' + - 'ui-widget-content') - .appendTo(uiDialog), - - uiDialogTitlebar = (self.uiDialogTitlebar = $('
')) - .addClass( - 'ui-dialog-titlebar ' + - 'ui-widget-header ' + - 'ui-corner-all ' + - 'ui-helper-clearfix' - ) - .prependTo(uiDialog), - - uiDialogTitlebarClose = $('') - .addClass( - 'ui-dialog-titlebar-close ' + - 'ui-corner-all' - ) - .attr('role', 'button') + .removeAttr( "title" ) + .addClass( "ui-dialog-content ui-widget-content" ) + .appendTo( uiDialog ), + + uiDialogTitlebar = ( self.uiDialogTitlebar = $( "
" ) ) + .addClass( "ui-dialog-titlebar ui-widget-header " + + "ui-corner-all ui-helper-clearfix" ) + .prependTo( uiDialog ), + + uiDialogTitlebarClose = $( "" ) + .addClass( "ui-dialog-titlebar-close ui-corner-all" ) + .attr( "role", "button" ) .hover( function() { - uiDialogTitlebarClose.addClass('ui-state-hover'); + uiDialogTitlebarClose.addClass( "ui-state-hover" ); }, function() { - uiDialogTitlebarClose.removeClass('ui-state-hover'); + uiDialogTitlebarClose.removeClass( "ui-state-hover" ); } ) .focus(function() { - uiDialogTitlebarClose.addClass('ui-state-focus'); + uiDialogTitlebarClose.addClass( "ui-state-focus" ); }) .blur(function() { - uiDialogTitlebarClose.removeClass('ui-state-focus'); + uiDialogTitlebarClose.removeClass( "ui-state-focus" ); }) - .click(function(event) { - self.close(event); + .click(function( event ) { + self.close( event ); return false; }) - .appendTo(uiDialogTitlebar), + .appendTo( uiDialogTitlebar ), - uiDialogTitlebarCloseText = (self.uiDialogTitlebarCloseText = $('')) - .addClass( - 'ui-icon ' + - 'ui-icon-closethick' - ) - .text(options.closeText) - .appendTo(uiDialogTitlebarClose), + uiDialogTitlebarCloseText = ( self.uiDialogTitlebarCloseText = $( "" ) ) + .addClass( "ui-icon ui-icon-closethick" ) + .text( options.closeText ) + .appendTo( uiDialogTitlebarClose ), - uiDialogTitle = $('') - .addClass('ui-dialog-title') - .attr('id', titleId) - .html(title) - .prependTo(uiDialogTitlebar); + uiDialogTitle = $( "" ) + .addClass( "ui-dialog-title" ) + .attr( "id", titleId ) + .html( title ) + .prependTo( uiDialogTitlebar ); - uiDialogTitlebar.find("*").add(uiDialogTitlebar).disableSelection(); + uiDialogTitlebar.find( "*" ).add( uiDialogTitlebar ).disableSelection(); - if (options.draggable && $.fn.draggable) { + if ( options.draggable && $.fn.draggable ) { self._makeDraggable(); } - if (options.resizable && $.fn.resizable) { + if ( options.resizable && $.fn.resizable ) { self._makeResizable(); } - self._createButtons(options.buttons); + self._createButtons( options.buttons ); self._isOpen = false; - if ($.fn.bgiframe) { + if ( $.fn.bgiframe ) { uiDialog.bgiframe(); } }, @@ -197,21 +182,21 @@ $.widget("ui.dialog", { destroy: function() { var self = this; - if (self.overlay) { + if ( self.overlay ) { self.overlay.destroy(); } self.uiDialog.hide(); self.element - .unbind('.dialog') - .removeData('dialog') - .removeClass('ui-dialog-content ui-widget-content') - .hide().appendTo('body'); + .removeClass( "ui-dialog-content ui-widget-content" ) + .hide() + .appendTo( "body" ); self.uiDialog.remove(); - if (self.originalTitle) { - self.element.attr('title', self.originalTitle); + if ( self.originalTitle ) { + self.element.attr( "title", self.originalTitle ); } + $.Widget.prototype.destroy.call( this ); return self; }, @@ -219,40 +204,40 @@ $.widget("ui.dialog", { return this.uiDialog; }, - close: function(event) { + close: function( event ) { var self = this, maxZ, thisZ; - if (false === self._trigger('beforeClose', event)) { + if ( false === self._trigger( "beforeClose", event ) ) { return; } - if (self.overlay) { + if ( self.overlay ) { self.overlay.destroy(); } - self.uiDialog.unbind('keypress.ui-dialog'); + self.uiDialog.unbind( "keypress.ui-dialog" ); self._isOpen = false; - if (self.options.hide) { - self.uiDialog.hide(self.options.hide, function() { - self._trigger('close', event); + if ( self.options.hide ) { + self.uiDialog.hide( self.options.hide, function() { + self._trigger( "close", event ); }); } else { self.uiDialog.hide(); - self._trigger('close', event); + self._trigger( "close", event ); } $.ui.dialog.overlay.resize(); // adjust the maxZ to allow other modal dialogs to continue to work (see #4309) - if (self.options.modal) { + if ( self.options.modal ) { maxZ = 0; - $('.ui-dialog').each(function() { - if (this !== self.uiDialog[0]) { - thisZ = $(this).css('z-index'); - if(!isNaN(thisZ)) { - maxZ = Math.max(maxZ, thisZ); + $( ".ui-dialog" ).each(function() { + if ( this !== self.uiDialog[0] ) { + thisZ = $( this ).css( "z-index" ); + if ( !isNaN( thisZ ) ) { + maxZ = Math.max( maxZ, thisZ ); } } }); @@ -268,64 +253,71 @@ $.widget("ui.dialog", { // the force parameter allows us to move modal dialogs to their correct // position on open - moveToTop: function(force, event) { + moveToTop: function( force, event ) { var self = this, options = self.options, saveScroll; - if ((options.modal && !force) || - (!options.stack && !options.modal)) { - return self._trigger('focus', event); + if ( ( options.modal && !force ) || + ( !options.stack && !options.modal ) ) { + return self._trigger( "focus", event ); } - if (options.zIndex > $.ui.dialog.maxZ) { + if ( options.zIndex > $.ui.dialog.maxZ ) { $.ui.dialog.maxZ = options.zIndex; } - if (self.overlay) { + if ( self.overlay ) { $.ui.dialog.maxZ += 1; - self.overlay.$el.css('z-index', $.ui.dialog.overlay.maxZ = $.ui.dialog.maxZ); + $.ui.dialog.overlay.maxZ = $.ui.dialog.maxZ; + self.overlay.$el.css( "z-index", $.ui.dialog.overlay.maxZ ); } - //Save and then restore scroll since Opera 9.5+ resets when parent z-Index is changed. - // http://ui.jquery.com/bugs/ticket/3193 - saveScroll = { scrollTop: self.element.attr('scrollTop'), scrollLeft: self.element.attr('scrollLeft') }; + // Save and then restore scroll + // Opera 9.5+ resets when parent z-index is changed. + // http://bugs.jqueryui.com/ticket/3193 + saveScroll = { + scrollTop: self.element.attr( "scrollTop" ), + scrollLeft: self.element.attr( "scrollLeft" ) + }; $.ui.dialog.maxZ += 1; - self.uiDialog.css('z-index', $.ui.dialog.maxZ); - self.element.attr(saveScroll); - self._trigger('focus', event); + self.uiDialog.css( "z-index", $.ui.dialog.maxZ ); + self.element.attr( saveScroll ); + self._trigger( "focus", event ); return self; }, open: function() { - if (this._isOpen) { return; } + if ( this._isOpen ) { + return; + } var self = this, options = self.options, uiDialog = self.uiDialog; - self.overlay = options.modal ? new $.ui.dialog.overlay(self) : null; + self.overlay = options.modal ? new $.ui.dialog.overlay( self ) : null; self._size(); - self._position(options.position); - uiDialog.show(options.show); - self.moveToTop(true); + self._position( options.position ); + uiDialog.show( options.show ); + self.moveToTop( true ); // prevent tabbing out of modal dialogs - if (options.modal) { - uiDialog.bind('keypress.ui-dialog', function(event) { - if (event.keyCode !== $.ui.keyCode.TAB) { + if ( options.modal ) { + uiDialog.bind( "keypress.ui-dialog", function( event ) { + if ( event.keyCode !== $.ui.keyCode.TAB ) { return; } - var tabbables = $(':tabbable', this), - first = tabbables.filter(':first'), - last = tabbables.filter(':last'); + var tabbables = $( ":tabbable", this ), + first = tabbables.filter( ":first" ), + last = tabbables.filter( ":last" ); - if (event.target === last[0] && !event.shiftKey) { - first.focus(1); + if ( event.target === last[0] && !event.shiftKey ) { + first.focus( 1 ); return false; - } else if (event.target === first[0] && event.shiftKey) { - last.focus(1); + } else if ( event.target === first[0] && event.shiftKey ) { + last.focus( 1 ); return false; } }); @@ -333,64 +325,60 @@ $.widget("ui.dialog", { // set focus to the first tabbable element in the content area or the first button // if there are no tabbable elements, set focus on the dialog itself - $(self.element.find(':tabbable').get().concat( - uiDialog.find('.ui-dialog-buttonpane :tabbable').get().concat( - uiDialog.get()))).eq(0).focus(); + $( self.element.find( ":tabbable" ).get().concat( + uiDialog.find( ".ui-dialog-buttonpane :tabbable" ).get().concat( + uiDialog.get() ) ) ).eq( 0 ).focus(); self._isOpen = true; - self._trigger('open'); + self._trigger( "open" ); return self; }, - _createButtons: function(buttons) { + _createButtons: function( buttons ) { var self = this, hasButtons = false, - uiDialogButtonPane = $('
') - .addClass( - 'ui-dialog-buttonpane ' + - 'ui-widget-content ' + - 'ui-helper-clearfix' - ), - uiButtonSet = $( "
" ) + uiDialogButtonPane = $( "
" ) + .addClass( "ui-dialog-buttonpane ui-widget-content ui-helper-clearfix" ), + uiButtonSet = $( "
" ) .addClass( "ui-dialog-buttonset" ) .appendTo( uiDialogButtonPane ); // if we already have a button pane, remove it - self.uiDialog.find('.ui-dialog-buttonpane').remove(); + self.uiDialog.find( ".ui-dialog-buttonpane" ).remove(); - if (typeof buttons === 'object' && buttons !== null) { - $.each(buttons, function() { + if ( typeof buttons === "object" && buttons !== null ) { + $.each( buttons, function() { return !(hasButtons = true); }); } - if (hasButtons) { - $.each(buttons, function(name, props) { + if ( hasButtons ) { + $.each( buttons, function( name, props ) { props = $.isFunction( props ) ? { click: props, text: name } : props; - var button = $('') + var button = $( "