| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); |
| //>>description: packaged loading message functionality |
| //>>label: loading message |
| //>>group: Navigation |
| |
| define( [ "jquery", "../jquery.mobile.core", "../jquery.mobile.widget" ], function( jQuery ) { |
| //>>excludeEnd("jqmBuildExclude"); |
| |
| (function( $, window ) { |
| // DEPRECATED |
| // NOTE global mobile object settings |
| $.extend( $.mobile, { |
| // DEPRECATED Should the text be visble in the loading message? |
| loadingMessageTextVisible: undefined, |
| |
| // DEPRECATED When the text is visible, what theme does the loading box use? |
| loadingMessageTheme: undefined, |
| |
| // DEPRECATED default message setting |
| loadingMessage: undefined, |
| |
| // DEPRECATED |
| // Turn on/off page loading message. Theme doubles as an object argument |
| // with the following shape: { theme: '', text: '', html: '', textVisible: '' } |
| // NOTE that the $.mobile.loading* settings and params past the first are deprecated |
| showPageLoadingMsg: function( theme, msgText, textonly ) { |
| $.mobile.loading( 'show', theme, msgText, textonly ); |
| }, |
| |
| // DEPRECATED |
| hidePageLoadingMsg: function() { |
| $.mobile.loading( 'hide' ); |
| }, |
| |
| loading: function() { |
| this.loaderWidget.loader.apply( this.loaderWidget, arguments ); |
| } |
| }); |
| |
| // TODO move loader class down into the widget settings |
| var loaderClass = "ui-loader", $html = $( "html" ), $window = $.mobile.$window; |
| |
| $.widget( "mobile.loader", { |
| // NOTE if the global config settings are defined they will override these |
| // options |
| options: { |
| // the theme for the loading message |
| theme: "a", |
| |
| // whether the text in the loading message is shown |
| textVisible: false, |
| |
| // custom html for the inner content of the loading message |
| html: "", |
| |
| // the text to be displayed when the popup is shown |
| text: "loading" |
| }, |
| |
| defaultHtml: "<div class='" + loaderClass + "'>" + |
| "<span class='ui-icon ui-icon-loading'></span>" + |
| "<h1></h1>" + |
| "</div>", |
| |
| // For non-fixed supportin browsers. Position at y center (if scrollTop supported), above the activeBtn (if defined), or just 100px from top |
| fakeFixLoader: function() { |
| var activeBtn = $( "." + $.mobile.activeBtnClass ).first(); |
| |
| this.element |
| .css({ |
| top: $.support.scrollTop && $window.scrollTop() + $window.height() / 2 || |
| activeBtn.length && activeBtn.offset().top || 100 |
| }); |
| }, |
| |
| // check position of loader to see if it appears to be "fixed" to center |
| // if not, use abs positioning |
| checkLoaderPosition: function() { |
| var offset = this.element.offset(), |
| scrollTop = $window.scrollTop(), |
| screenHeight = $.mobile.getScreenHeight(); |
| |
| if ( offset.top < scrollTop || ( offset.top - scrollTop ) > screenHeight ) { |
| this.element.addClass( "ui-loader-fakefix" ); |
| this.fakeFixLoader(); |
| $window |
| .unbind( "scroll", this.checkLoaderPosition ) |
| .bind( "scroll", this.fakeFixLoader ); |
| } |
| }, |
| |
| resetHtml: function() { |
| this.element.html( $( this.defaultHtml ).html() ); |
| }, |
| |
| // Turn on/off page loading message. Theme doubles as an object argument |
| // with the following shape: { theme: '', text: '', html: '', textVisible: '' } |
| // NOTE that the $.mobile.loading* settings and params past the first are deprecated |
| // TODO sweet jesus we need to break some of this out |
| show: function( theme, msgText, textonly ) { |
| var textVisible, message, $header, loadSettings; |
| |
| this.resetHtml(); |
| |
| // use the prototype options so that people can set them globally at |
| // mobile init. Consistency, it's what's for dinner |
| if ( $.type(theme) === "object" ) { |
| loadSettings = $.extend( {}, this.options, theme ); |
| |
| // prefer object property from the param then the old theme setting |
| theme = loadSettings.theme || $.mobile.loadingMessageTheme; |
| } else { |
| loadSettings = this.options; |
| |
| // here we prefer the them value passed as a string argument, then |
| // we prefer the global option because we can't use undefined default |
| // prototype options, then the prototype option |
| theme = theme || $.mobile.loadingMessageTheme || loadSettings.theme; |
| } |
| |
| // set the message text, prefer the param, then the settings object |
| // then loading message |
| message = msgText || $.mobile.loadingMessage || loadSettings.text; |
| |
| // prepare the dom |
| $html.addClass( "ui-loading" ); |
| |
| if ( $.mobile.loadingMessage !== false || loadSettings.html ) { |
| // boolean values require a bit more work :P, supports object properties |
| // and old settings |
| if ( $.mobile.loadingMessageTextVisible !== undefined ) { |
| textVisible = $.mobile.loadingMessageTextVisible; |
| } else { |
| textVisible = loadSettings.textVisible; |
| } |
| |
| // add the proper css given the options (theme, text, etc) |
| // Force text visibility if the second argument was supplied, or |
| // if the text was explicitly set in the object args |
| this.element.attr("class", loaderClass + |
| " ui-corner-all ui-body-" + theme + |
| " ui-loader-" + ( textVisible || msgText || theme.text ? "verbose" : "default" ) + |
| ( loadSettings.textonly || textonly ? " ui-loader-textonly" : "" ) ); |
| |
| // TODO verify that jquery.fn.html is ok to use in both cases here |
| // this might be overly defensive in preventing unknowing xss |
| // if the html attribute is defined on the loading settings, use that |
| // otherwise use the fallbacks from above |
| if ( loadSettings.html ) { |
| this.element.html( loadSettings.html ); |
| } else { |
| this.element.find( "h1" ).text( message ); |
| } |
| |
| // attach the loader to the DOM |
| this.element.appendTo( $.mobile.pageContainer ); |
| |
| // check that the loader is visible |
| this.checkLoaderPosition(); |
| |
| // on scroll check the loader position |
| $window.bind( "scroll", $.proxy( this.checkLoaderPosition, this ) ); |
| } |
| }, |
| |
| hide: function() { |
| $html.removeClass( "ui-loading" ); |
| |
| if ( $.mobile.loadingMessage ) { |
| this.element.removeClass( "ui-loader-fakefix" ); |
| } |
| |
| $.mobile.$window.unbind( "scroll", $.proxy( this.fakeFixLoader, this) ); |
| $.mobile.$window.unbind( "scroll", $.proxy( this.checkLoaderPosition, this ) ); |
| } |
| }); |
| |
| $window.bind( 'pagecontainercreate', function() { |
| $.mobile.loaderWidget = $.mobile.loaderWidget || $( $.mobile.loader.prototype.defaultHtml ).loader(); |
| }); |
| })(jQuery, this); |
| |
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); |
| }); |
| //>>excludeEnd("jqmBuildExclude"); |