1 //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
2 //>>description: Displays a page as a modal dialog with inset appearance and overlay background
5 //>>css: ../css/themes/default/jquery.mobile.theme.css,../css/structure/jquery.mobile.dialog.css
7 define( [ "jquery", "./jquery.mobile.widget" ], function( $ ) {
8 //>>excludeEnd("jqmBuildExclude");
9 (function( $, window, undefined ) {
11 $.widget( "mobile.dialog", $.mobile.widget, {
13 closeBtnText : "Close",
15 initSelector : ":jqmData(role='dialog')"
20 headerCloseButton = $( "<a href='#' data-" + $.mobile.ns + "icon='delete' data-" + $.mobile.ns + "iconpos='notext'>"+ this.options.closeBtnText + "</a>" ),
21 dialogWrap = $("<div/>", {
23 "class" : "ui-dialog-contain ui-corner-all ui-overlay-shadow"
26 $el.addClass( "ui-dialog ui-overlay-" + this.options.overlayTheme );
28 // Class the markup for dialog styling
31 .wrapInner( dialogWrap )
33 .find( ":jqmData(role='header')" )
34 .prepend( headerCloseButton )
36 .children( ':first-child')
37 .addClass( "ui-corner-top" )
39 .children( ":last-child" )
40 .addClass( "ui-corner-bottom" );
42 // this must be an anonymous function so that select menu dialogs can replace
43 // the close method. This is a change from previously just defining data-rel=back
44 // on the button and letting nav handle it
46 // Use click rather than vclick in order to prevent the possibility of unintentionally
47 // reopening the dialog if the dialog opening item was directly under the close button.
48 headerCloseButton.bind( "click", function() {
53 - clicks and submits should use the closing transition that the dialog opened with
54 unless a data-transition is specified on the link/form
55 - if the click was on the close button, or the link has a data-rel="back" it'll go back in history naturally
57 $el.bind( "vclick submit", function( event ) {
58 var $target = $( event.target ).closest( event.type === "vclick" ? "a" : "form" ),
61 if ( $target.length && !$target.jqmData( "transition" ) ) {
63 active = $.mobile.urlHistory.getActive() || {};
65 $target.attr( "data-" + $.mobile.ns + "transition", ( active.transition || $.mobile.defaultDialogTransition ) )
66 .attr( "data-" + $.mobile.ns + "direction", "reverse" );
69 .bind( "pagehide", function( e, ui ) {
70 $( this ).find( "." + $.mobile.activeBtnClass ).removeClass( $.mobile.activeBtnClass );
72 // Override the theme set by the page plugin on pageshow
73 .bind( "pagebeforeshow", function(){
74 if( self.options.overlayTheme ){
76 .page( "removeContainerBackground" )
77 .page( "setContainerBackground", self.options.overlayTheme );
82 // Close method goes back in history
84 window.history.back();
88 //auto self-init widgets
89 $( document ).delegate( $.mobile.dialog.prototype.options.initSelector, "pagecreate", function(){
90 $.mobile.dialog.prototype.enhance( this );
94 //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
96 //>>excludeEnd("jqmBuildExclude");