",
options: {
disabled: false,
// callbacks
create: null
},
_createWidget: function( options, element ) {
element = $( element || this.defaultElement || this )[ 0 ];
this.element = $( element );
this.uuid = uuid++;
this.eventNamespace = "." + this.widgetName + this.uuid;
this.options = $.widget.extend( {},
this.options,
this._getCreateOptions(),
options );
this.bindings = $();
this.hoverable = $();
this.focusable = $();
if ( element !== this ) {
$.data( element, this.widgetFullName, this );
this._on( true, this.element, {
remove: function( event ) {
if ( event.target === element ) {
this.destroy();
}
}
});
this.document = $( element.style ?
// element within the document
element.ownerDocument :
// element is window or document
element.document || element );
this.window = $( this.document[0].defaultView || this.document[0].parentWindow );
}
this._create();
this._trigger( "create", null, this._getCreateEventData() );
this._init();
},
_getCreateOptions: $.noop,
_getCreateEventData: $.noop,
_create: $.noop,
_init: $.noop,
destroy: function() {
this._destroy();
// we can probably remove the unbind calls in 2.0
// all event bindings should go through this._on()
this.element
.unbind( this.eventNamespace )
.removeData( this.widgetFullName )
// support: jquery <1.6.3
// http://bugs.jquery.com/ticket/9413
.removeData( $.camelCase( this.widgetFullName ) );
this.widget()
.unbind( this.eventNamespace )
.removeAttr( "aria-disabled" )
.removeClass(
this.widgetFullName + "-disabled " +
"ui-state-disabled" );
// clean up events and states
this.bindings.unbind( this.eventNamespace );
this.hoverable.removeClass( "ui-state-hover" );
this.focusable.removeClass( "ui-state-focus" );
},
_destroy: $.noop,
widget: function() {
return this.element;
},
option: function( key, value ) {
var options = key,
parts,
curOption,
i;
if ( arguments.length === 0 ) {
// don't return a reference to the internal hash
return $.widget.extend( {}, this.options );
}
if ( typeof key === "string" ) {
// handle nested keys, e.g., "foo.bar" => { foo: { bar: ___ } }
options = {};
parts = key.split( "." );
key = parts.shift();
if ( parts.length ) {
curOption = options[ key ] = $.widget.extend( {}, this.options[ key ] );
for ( i = 0; i < parts.length - 1; i++ ) {
curOption[ parts[ i ] ] = curOption[ parts[ i ] ] || {};
curOption = curOption[ parts[ i ] ];
}
key = parts.pop();
if ( value === undefined ) {
return curOption[ key ] === undefined ? null : curOption[ key ];
}
curOption[ key ] = value;
} else {
if ( value === undefined ) {
return this.options[ key ] === undefined ? null : this.options[ key ];
}
options[ key ] = value;
}
}
this._setOptions( options );
return this;
},
_setOptions: function( options ) {
var key;
for ( key in options ) {
this._setOption( key, options[ key ] );
}
return this;
},
_setOption: function( key, value ) {
this.options[ key ] = value;
if ( key === "disabled" ) {
this.widget()
.toggleClass( this.widgetFullName + "-disabled", !!value );
this.hoverable.removeClass( "ui-state-hover" );
this.focusable.removeClass( "ui-state-focus" );
}
return this;
},
enable: function() {
return this._setOptions({ disabled: false });
},
disable: function() {
return this._setOptions({ disabled: true });
},
_on: function( suppressDisabledCheck, element, handlers ) {
var delegateElement,
instance = this;
// no suppressDisabledCheck flag, shuffle arguments
if ( typeof suppressDisabledCheck !== "boolean" ) {
handlers = element;
element = suppressDisabledCheck;
suppressDisabledCheck = false;
}
// no element argument, shuffle and use this.element
if ( !handlers ) {
handlers = element;
element = this.element;
delegateElement = this.widget();
} else {
// accept selectors, DOM elements
element = delegateElement = $( element );
this.bindings = this.bindings.add( element );
}
$.each( handlers, function( event, handler ) {
function handlerProxy() {
// allow widgets to customize the disabled handling
// - disabled as an array instead of boolean
// - disabled class as method for disabling individual parts
if ( !suppressDisabledCheck &&
( instance.options.disabled === true ||
$( this ).hasClass( "ui-state-disabled" ) ) ) {
return;
}
return ( typeof handler === "string" ? instance[ handler ] : handler )
.apply( instance, arguments );
}
// copy the guid so direct unbinding works
if ( typeof handler !== "string" ) {
handlerProxy.guid = handler.guid =
handler.guid || handlerProxy.guid || $.guid++;
}
var match = event.match( /^(\w+)\s*(.*)$/ ),
eventName = match[1] + instance.eventNamespace,
selector = match[2];
if ( selector ) {
delegateElement.delegate( selector, eventName, handlerProxy );
} else {
element.bind( eventName, handlerProxy );
}
});
},
_off: function( element, eventName ) {
eventName = (eventName || "").split( " " ).join( this.eventNamespace + " " ) + this.eventNamespace;
element.unbind( eventName ).undelegate( eventName );
},
_delay: function( handler, delay ) {
function handlerProxy() {
return ( typeof handler === "string" ? instance[ handler ] : handler )
.apply( instance, arguments );
}
var instance = this;
return setTimeout( handlerProxy, delay || 0 );
},
_hoverable: function( element ) {
this.hoverable = this.hoverable.add( element );
this._on( element, {
mouseenter: function( event ) {
$( event.currentTarget ).addClass( "ui-state-hover" );
},
mouseleave: function( event ) {
$( event.currentTarget ).removeClass( "ui-state-hover" );
}
});
},
_focusable: function( element ) {
this.focusable = this.focusable.add( element );
this._on( element, {
focusin: function( event ) {
$( event.currentTarget ).addClass( "ui-state-focus" );
},
focusout: function( event ) {
$( event.currentTarget ).removeClass( "ui-state-focus" );
}
});
},
_trigger: function( type, event, data ) {
var prop, orig,
callback = this.options[ type ];
data = data || {};
event = $.Event( event );
event.type = ( type === this.widgetEventPrefix ?
type :
this.widgetEventPrefix + type ).toLowerCase();
// the original event may come from any element
// so we need to reset the target on the new event
event.target = this.element[ 0 ];
// copy original event properties over to the new event
orig = event.originalEvent;
if ( orig ) {
for ( prop in orig ) {
if ( !( prop in event ) ) {
event[ prop ] = orig[ prop ];
}
}
}
this.element.trigger( event, data );
return !( $.isFunction( callback ) &&
callback.apply( this.element[0], [ event ].concat( data ) ) === false ||
event.isDefaultPrevented() );
}
};
$.each( { show: "fadeIn", hide: "fadeOut" }, function( method, defaultEffect ) {
$.Widget.prototype[ "_" + method ] = function( element, options, callback ) {
if ( typeof options === "string" ) {
options = { effect: options };
}
var hasOptions,
effectName = !options ?
method :
options === true || typeof options === "number" ?
defaultEffect :
options.effect || defaultEffect;
options = options || {};
if ( typeof options === "number" ) {
options = { duration: options };
}
hasOptions = !$.isEmptyObject( options );
options.complete = callback;
if ( options.delay ) {
element.delay( options.delay );
}
if ( hasOptions && $.effects && $.effects.effect[ effectName ] ) {
element[ method ]( options );
} else if ( effectName !== method && element[ effectName ] ) {
element[ effectName ]( options.duration, options.easing, callback );
} else {
element.queue(function( next ) {
$( this )[ method ]();
if ( callback ) {
callback.call( element[ 0 ] );
}
next();
});
}
};
});
})( jQuery );
(function( $, undefined ) {
var rcapitals = /[A-Z]/g,
replaceFunction = function( c ) {
return "-" + c.toLowerCase();
};
$.extend( $.Widget.prototype, {
_getCreateOptions: function() {
var option, value,
elem = this.element[ 0 ],
options = {};
//
if ( !$.mobile.getAttribute( elem, "defaults" ) ) {
for ( option in this.options ) {
value = $.mobile.getAttribute( elem, option.replace( rcapitals, replaceFunction ) );
if ( value != null ) {
options[ option ] = value;
}
}
}
return options;
}
});
//TODO: Remove in 1.5 for backcompat only
$.mobile.widget = $.Widget;
})( jQuery );
(function( $, undefined ) {
$.mobile.widgets = {};
var originalWidget = $.widget,
// Record the original, non-mobileinit-modified version of $.mobile.keepNative
// so we can later determine whether someone has modified $.mobile.keepNative
keepNativeFactoryDefault = $.mobile.keepNative;
$.widget = (function( orig ) {
return function() {
var constructor = orig.apply( this, arguments ),
name = constructor.prototype.widgetName;
constructor.initSelector = ( ( constructor.prototype.initSelector !== undefined ) ?
constructor.prototype.initSelector : ":jqmData(role='" + name + "')" );
$.mobile.widgets[ name ] = constructor;
return constructor;
};
})( $.widget );
// Make sure $.widget still has bridge and extend methods
$.extend( $.widget, originalWidget );
// For backcompat remove in 1.5
$.mobile.document.on( "create", function( event ) {
$( event.target ).enhanceWithin();
});
$.widget( "mobile.page", {
options: {
theme: "a",
domCache: false,
// Deprecated in 1.4 remove in 1.5
keepNativeDefault: $.mobile.keepNative,
// Deprecated in 1.4 remove in 1.5
contentTheme: null,
enhanced: false
},
// DEPRECATED for > 1.4
// TODO remove at 1.5
_createWidget: function() {
$.Widget.prototype._createWidget.apply( this, arguments );
this._trigger( "init" );
},
_create: function() {
// If false is returned by the callbacks do not create the page
if ( this._trigger( "beforecreate" ) === false ) {
return false;
}
if ( !this.options.enhanced ) {
this._enhance();
}
this._on( this.element, {
pagebeforehide: "removeContainerBackground",
pagebeforeshow: "_handlePageBeforeShow"
});
this.element.enhanceWithin();
// Dialog widget is deprecated in 1.4 remove this in 1.5
if ( $.mobile.getAttribute( this.element[0], "role" ) === "dialog" && $.mobile.dialog ) {
this.element.dialog();
}
},
_enhance: function () {
var attrPrefix = "data-" + $.mobile.ns,
self = this;
if ( this.options.role ) {
this.element.attr( "data-" + $.mobile.ns + "role", this.options.role );
}
this.element
.attr( "tabindex", "0" )
.addClass( "ui-page ui-page-theme-" + this.options.theme );
// Manipulation of content os Deprecated as of 1.4 remove in 1.5
this.element.find( "[" + attrPrefix + "role='content']" ).each( function() {
var $this = $( this ),
theme = this.getAttribute( attrPrefix + "theme" ) || undefined;
self.options.contentTheme = theme || self.options.contentTheme || ( self.options.dialog && self.options.theme ) || ( self.element.jqmData("role") === "dialog" && self.options.theme );
$this.addClass( "ui-content" );
if ( self.options.contentTheme ) {
$this.addClass( "ui-body-" + ( self.options.contentTheme ) );
}
// Add ARIA role
$this.attr( "role", "main" ).addClass( "ui-content" );
});
},
bindRemove: function( callback ) {
var page = this.element;
// when dom caching is not enabled or the page is embedded bind to remove the page on hide
if ( !page.data( "mobile-page" ).options.domCache &&
page.is( ":jqmData(external-page='true')" ) ) {
// TODO use _on - that is, sort out why it doesn't work in this case
page.bind( "pagehide.remove", callback || function( e, data ) {
//check if this is a same page transition and if so don't remove the page
if( !data.samePage ){
var $this = $( this ),
prEvent = new $.Event( "pageremove" );
$this.trigger( prEvent );
if ( !prEvent.isDefaultPrevented() ) {
$this.removeWithDependents();
}
}
});
}
},
_setOptions: function( o ) {
},
_handlePageBeforeShow: function(/* e */) {
this.setContainerBackground();
},
// Deprecated in 1.4 remove in 1.5
removeContainerBackground: function() {
this.element.closest( ":mobile-pagecontainer" ).pagecontainer({ "theme": "none" });
},
// Deprecated in 1.4 remove in 1.5
// set the page container background to the page theme
setContainerBackground: function( theme ) {
this.element.parent().pagecontainer( { "theme": theme || this.options.theme } );
},
// Deprecated in 1.4 remove in 1.5
keepNativeSelector: function() {
var options = this.options,
keepNative = $.trim( options.keepNative || "" ),
globalValue = $.trim( $.mobile.keepNative ),
optionValue = $.trim( options.keepNativeDefault ),
// Check if $.mobile.keepNative has changed from the factory default
newDefault = ( keepNativeFactoryDefault === globalValue ?
"" : globalValue ),
// If $.mobile.keepNative has not changed, use options.keepNativeDefault
oldDefault = ( newDefault === "" ? optionValue : "" );
// Concatenate keepNative selectors from all sources where the value has
// changed or, if nothing has changed, return the default
return ( ( keepNative ? [ keepNative ] : [] )
.concat( newDefault ? [ newDefault ] : [] )
.concat( oldDefault ? [ oldDefault ] : [] )
.join( ", " ) );
}
});
})( jQuery );
(function( $, window, undefined ) {
// TODO remove direct references to $.mobile and properties, we should
// favor injection with params to the constructor
$.mobile.Transition = function() {
this.init.apply( this, arguments );
};
$.extend($.mobile.Transition.prototype, {
toPreClass: " ui-page-pre-in",
init: function( name, reverse, $to, $from ) {
$.extend(this, {
name: name,
reverse: reverse,
$to: $to,
$from: $from,
deferred: new $.Deferred()
});
},
cleanFrom: function() {
this.$from
.removeClass( $.mobile.activePageClass + " out in reverse " + this.name )
.height( "" );
},
// NOTE overridden by child object prototypes, noop'd here as defaults
beforeDoneIn: function() {},
beforeDoneOut: function() {},
beforeStartOut: function() {},
doneIn: function() {
this.beforeDoneIn();
this.$to.removeClass( "out in reverse " + this.name ).height( "" );
this.toggleViewportClass();
// In some browsers (iOS5), 3D transitions block the ability to scroll to the desired location during transition
// This ensures we jump to that spot after the fact, if we aren't there already.
if ( $.mobile.window.scrollTop() !== this.toScroll ) {
this.scrollPage();
}
if ( !this.sequential ) {
this.$to.addClass( $.mobile.activePageClass );
}
this.deferred.resolve( this.name, this.reverse, this.$to, this.$from, true );
},
doneOut: function( screenHeight, reverseClass, none, preventFocus ) {
this.beforeDoneOut();
this.startIn( screenHeight, reverseClass, none, preventFocus );
},
hideIn: function( callback ) {
// Prevent flickering in phonegap container: see comments at #4024 regarding iOS
this.$to.css( "z-index", -10 );
callback.call( this );
this.$to.css( "z-index", "" );
},
scrollPage: function() {
// By using scrollTo instead of silentScroll, we can keep things better in order
// Just to be precautios, disable scrollstart listening like silentScroll would
$.event.special.scrollstart.enabled = false;
//if we are hiding the url bar or the page was previously scrolled scroll to hide or return to position
if ( $.mobile.hideUrlBar || this.toScroll !== $.mobile.defaultHomeScroll ) {
window.scrollTo( 0, this.toScroll );
}
// reenable scrollstart listening like silentScroll would
setTimeout( function() {
$.event.special.scrollstart.enabled = true;
}, 150 );
},
startIn: function( screenHeight, reverseClass, none, preventFocus ) {
this.hideIn(function() {
this.$to.addClass( $.mobile.activePageClass + this.toPreClass );
// Send focus to page as it is now display: block
if ( !preventFocus ) {
$.mobile.focusPage( this.$to );
}
// Set to page height
this.$to.height( screenHeight + this.toScroll );
if ( !none ) {
this.scrollPage();
}
});
this.$to
.removeClass( this.toPreClass )
.addClass( this.name + " in " + reverseClass );
if ( !none ) {
this.$to.animationComplete( $.proxy(function() {
this.doneIn();
}, this ));
} else {
this.doneIn();
}
},
startOut: function( screenHeight, reverseClass, none ) {
this.beforeStartOut( screenHeight, reverseClass, none );
// Set the from page's height and start it transitioning out
// Note: setting an explicit height helps eliminate tiling in the transitions
this.$from
.height( screenHeight + $.mobile.window.scrollTop() )
.addClass( this.name + " out" + reverseClass );
},
toggleViewportClass: function() {
$.mobile.pageContainer.toggleClass(this.name );
},
transition: function() {
// NOTE many of these could be calculated/recorded in the constructor, it's my
// opinion that binding them as late as possible has value with regards to
// better transitions with fewer bugs. Ie, it's not guaranteed that the
// object will be created and transition will be run immediately after as
// it is today. So we wait until transition is invoked to gather the following
var none,
reverseClass = this.reverse ? " reverse" : "",
screenHeight = $.mobile.getScreenHeight(),
maxTransitionOverride = $.mobile.maxTransitionWidth !== false &&
$.mobile.window.width() > $.mobile.maxTransitionWidth;
this.toScroll = $.mobile.navigate.history.getActive().lastScroll || $.mobile.defaultHomeScroll;
none = !$.support.cssTransitions || !$.support.cssAnimations ||
maxTransitionOverride || !this.name || this.name === "none" ||
Math.max( $.mobile.window.scrollTop(), this.toScroll ) >
$.mobile.getMaxScrollForTransition();
this.toggleViewportClass();
if ( this.$from && !none ) {
this.startOut( screenHeight, reverseClass, none );
} else {
this.doneOut( screenHeight, reverseClass, none, true );
}
return this.deferred.promise();
}
});
})( jQuery, this );
(function( $ ) {
$.mobile.SerialTransition = function() {
this.init.apply(this, arguments);
};
$.extend($.mobile.SerialTransition.prototype, $.mobile.Transition.prototype, {
sequential: true,
beforeDoneOut: function() {
if ( this.$from ) {
this.cleanFrom();
}
},
beforeStartOut: function( screenHeight, reverseClass, none ) {
this.$from.animationComplete($.proxy(function() {
this.doneOut( screenHeight, reverseClass, none );
}, this ));
}
});
})( jQuery );
(function( $ ) {
$.mobile.ConcurrentTransition = function() {
this.init.apply(this, arguments);
};
$.extend($.mobile.ConcurrentTransition.prototype, $.mobile.Transition.prototype, {
sequential: false,
beforeDoneIn: function() {
if ( this.$from ) {
this.cleanFrom();
}
},
beforeStartOut: function( screenHeight, reverseClass, none ) {
this.doneOut( screenHeight, reverseClass, none );
}
});
})( jQuery );
(function( $ ) {
// generate the handlers from the above
var defaultGetMaxScrollForTransition = function() {
return $.mobile.getScreenHeight() * 3;
};
//transition handler dictionary for 3rd party transitions
$.mobile.transitionHandlers = {
"sequential": $.mobile.SerialTransition,
"simultaneous": $.mobile.ConcurrentTransition
};
// Make our transition handler the public default.
$.mobile.defaultTransitionHandler = $.mobile.transitionHandlers.sequential;
$.mobile.transitionFallbacks = {};
// If transition is defined, check if css 3D transforms are supported, and if not, if a fallback is specified
$.mobile._maybeDegradeTransition = function( transition ) {
if ( transition && !$.support.cssTransform3d && $.mobile.transitionFallbacks[ transition ] ) {
transition = $.mobile.transitionFallbacks[ transition ];
}
return transition;
};
// Set the getMaxScrollForTransition to default if no implementation was set by user
$.mobile.getMaxScrollForTransition = $.mobile.getMaxScrollForTransition || defaultGetMaxScrollForTransition;
})( jQuery );
(function( $, undefined ) {
$.widget( "mobile.pagecontainer", {
options: {
theme: "a"
},
initSelector: false,
_create: function() {
this.setLastScrollEnabled = true;
this._on( this.window, {
// disable an scroll setting when a hashchange has been fired,
// this only works because the recording of the scroll position
// is delayed for 100ms after the browser might have changed the
// position because of the hashchange
navigate: "_disableRecordScroll",
// bind to scrollstop for the first page, "pagechange" won't be
// fired in that case
scrollstop: "_delayedRecordScroll"
});
// TODO consider moving the navigation handler OUT of widget into
// some other object as glue between the navigate event and the
// content widget load and change methods
this._on( this.window, { navigate: "_filterNavigateEvents" });
// TODO move from page* events to content* events
this._on({ pagechange: "_afterContentChange" });
// handle initial hashchange from chrome :(
this.window.one( "navigate", $.proxy(function() {
this.setLastScrollEnabled = true;
}, this));
},
_setOptions: function( options ) {
this._super( options );
},
_disableRecordScroll: function() {
this.setLastScrollEnabled = false;
},
_enableRecordScroll: function() {
this.setLastScrollEnabled = true;
},
// TODO consider the name here, since it's purpose specific
_afterContentChange: function() {
// once the page has changed, re-enable the scroll recording
this.setLastScrollEnabled = true;
// remove any binding that previously existed on the get scroll
// which may or may not be different than the scroll element
// determined for this page previously
this._off( this.window, "scrollstop" );
// determine and bind to the current scoll element which may be the
// window or in the case of touch overflow the element touch overflow
this._on( this.window, { scrollstop: "_delayedRecordScroll" });
},
_recordScroll: function() {
// this barrier prevents setting the scroll value based on
// the browser scrolling the window based on a hashchange
if ( !this.setLastScrollEnabled ) {
return;
}
var active = this._getActiveHistory(),
currentScroll, minScroll, defaultScroll;
if ( active ) {
currentScroll = this._getScroll();
minScroll = this._getMinScroll();
defaultScroll = this._getDefaultScroll();
// Set active page's lastScroll prop. If the location we're
// scrolling to is less than minScrollBack, let it go.
active.lastScroll = currentScroll < minScroll ? defaultScroll : currentScroll;
}
},
_delayedRecordScroll: function() {
setTimeout( $.proxy(this, "_recordScroll"), 100 );
},
_getScroll: function() {
return this.window.scrollTop();
},
_getMinScroll: function() {
return $.mobile.minScrollBack;
},
_getDefaultScroll: function() {
return $.mobile.defaultHomeScroll;
},
_filterNavigateEvents: function( e, data ) {
var url;
if ( e.originalEvent && e.originalEvent.isDefaultPrevented() ) {
return;
}
url = e.originalEvent.type.indexOf( "hashchange" ) > -1 ? data.state.hash : data.state.url;
if ( !url ) {
url = this._getHash();
}
if ( !url || url === "#" || url.indexOf( "#" + $.mobile.path.uiStateKey ) === 0 ) {
url = location.href;
}
this._handleNavigate( url, data.state );
},
_getHash: function() {
return $.mobile.path.parseLocation().hash;
},
// TODO active page should be managed by the container (ie, it should be a property)
getActivePage: function() {
return this.activePage;
},
// TODO the first page should be a property set during _create using the logic
// that currently resides in init
_getInitialContent: function() {
return $.mobile.firstPage;
},
// TODO each content container should have a history object
_getHistory: function() {
return $.mobile.navigate.history;
},
// TODO use _getHistory
_getActiveHistory: function() {
return $.mobile.navigate.history.getActive();
},
// TODO the document base should be determined at creation
_getDocumentBase: function() {
return $.mobile.path.documentBase;
},
back: function() {
this.go( -1 );
},
forward: function() {
this.go( 1 );
},
go: function( steps ) {
//if hashlistening is enabled use native history method
if ( $.mobile.hashListeningEnabled ) {
window.history.go( steps );
} else {
//we are not listening to the hash so handle history internally
var activeIndex = $.mobile.navigate.history.activeIndex,
index = activeIndex + parseInt( steps, 10 ),
url = $.mobile.navigate.history.stack[ index ].url,
direction = ( steps >= 1 )? "forward" : "back";
//update the history object
$.mobile.navigate.history.activeIndex = index;
$.mobile.navigate.history.previousIndex = activeIndex;
//change to the new page
this.change( url, { direction: direction, changeHash: false, fromHashChange: true } );
}
},
// TODO rename _handleDestination
_handleDestination: function( to ) {
var history;
// clean the hash for comparison if it's a url
if ( $.type(to) === "string" ) {
to = $.mobile.path.stripHash( to );
}
if ( to ) {
history = this._getHistory();
// At this point, 'to' can be one of 3 things, a cached page
// element from a history stack entry, an id, or site-relative /
// absolute URL. If 'to' is an id, we need to resolve it against
// the documentBase, not the location.href, since the hashchange
// could've been the result of a forward/backward navigation
// that crosses from an external page/dialog to an internal
// page/dialog.
//
// TODO move check to history object or path object?
to = !$.mobile.path.isPath( to ) ? ( $.mobile.path.makeUrlAbsolute( "#" + to, this._getDocumentBase() ) ) : to;
// If we're about to go to an initial URL that contains a
// reference to a non-existent internal page, go to the first
// page instead. We know that the initial hash refers to a
// non-existent page, because the initial hash did not end
// up in the initial history entry
// TODO move check to history object?
if ( to === $.mobile.path.makeUrlAbsolute( "#" + history.initialDst, this._getDocumentBase() ) &&
history.stack.length &&
history.stack[0].url !== history.initialDst.replace( $.mobile.dialogHashKey, "" ) ) {
to = this._getInitialContent();
}
}
return to || this._getInitialContent();
},
_handleDialog: function( changePageOptions, data ) {
var to, active, activeContent = this.getActivePage();
// If current active page is not a dialog skip the dialog and continue
// in the same direction
if ( activeContent && !activeContent.hasClass( "ui-dialog" ) ) {
// determine if we're heading forward or backward and continue
// accordingly past the current dialog
if ( data.direction === "back" ) {
this.back();
} else {
this.forward();
}
// prevent changePage call
return false;
} else {
// if the current active page is a dialog and we're navigating
// to a dialog use the dialog objected saved in the stack
to = data.pageUrl;
active = this._getActiveHistory();
// make sure to set the role, transition and reversal
// as most of this is lost by the domCache cleaning
$.extend( changePageOptions, {
role: active.role,
transition: active.transition,
reverse: data.direction === "back"
});
}
return to;
},
_handleNavigate: function( url, data ) {
//find first page via hash
// TODO stripping the hash twice with handleUrl
var to = $.mobile.path.stripHash( url ), history = this._getHistory(),
// transition is false if it's the first page, undefined
// otherwise (and may be overridden by default)
transition = history.stack.length === 0 ? "none" : undefined,
// default options for the changPage calls made after examining
// the current state of the page and the hash, NOTE that the
// transition is derived from the previous history entry
changePageOptions = {
changeHash: false,
fromHashChange: true,
reverse: data.direction === "back"
};
$.extend( changePageOptions, data, {
transition: ( history.getLast() || {} ).transition || transition
});
// TODO move to _handleDestination ?
// If this isn't the first page, if the current url is a dialog hash
// key, and the initial destination isn't equal to the current target
// page, use the special dialog handling
if ( history.activeIndex > 0 &&
to.indexOf( $.mobile.dialogHashKey ) > -1 &&
history.initialDst !== to ) {
to = this._handleDialog( changePageOptions, data );
if ( to === false ) {
return;
}
}
this._changeContent( this._handleDestination( to ), changePageOptions );
},
_changeContent: function( to, opts ) {
$.mobile.changePage( to, opts );
},
_getBase: function() {
return $.mobile.base;
},
_getNs: function() {
return $.mobile.ns;
},
_enhance: function( content, role ) {
// TODO consider supporting a custom callback, and passing in
// the settings which includes the role
return content.page({ role: role });
},
_include: function( page, settings ) {
// append to page and enhance
page.appendTo( this.element );
// use the page widget to enhance
this._enhance( page, settings.role );
// remove page on hide
page.page( "bindRemove" );
},
_find: function( absUrl ) {
// TODO consider supporting a custom callback
var fileUrl = this._createFileUrl( absUrl ),
dataUrl = this._createDataUrl( absUrl ),
page, initialContent = this._getInitialContent();
// Check to see if the page already exists in the DOM.
// NOTE do _not_ use the :jqmData pseudo selector because parenthesis
// are a valid url char and it breaks on the first occurence
page = this.element
.children( "[data-" + this._getNs() +"url='" + dataUrl + "']" );
// If we failed to find the page, check to see if the url is a
// reference to an embedded page. If so, it may have been dynamically
// injected by a developer, in which case it would be lacking a
// data-url attribute and in need of enhancement.
if ( page.length === 0 && dataUrl && !$.mobile.path.isPath( dataUrl ) ) {
page = this.element.children( $.mobile.path.hashToSelector("#" + dataUrl) )
.attr( "data-" + this._getNs() + "url", dataUrl )
.jqmData( "url", dataUrl );
}
// If we failed to find a page in the DOM, check the URL to see if it
// refers to the first page in the application. Also check to make sure
// our cached-first-page is actually in the DOM. Some user deployed
// apps are pruning the first page from the DOM for various reasons.
// We check for this case here because we don't want a first-page with
// an id falling through to the non-existent embedded page error case.
if ( page.length === 0 &&
$.mobile.path.isFirstPageUrl( fileUrl ) &&
initialContent &&
initialContent.parent().length ) {
page = $( initialContent );
}
return page;
},
_getLoader: function() {
return $.mobile.loading();
},
_showLoading: function( delay, theme, msg, textonly ) {
// This configurable timeout allows cached pages a brief
// delay to load without showing a message
if ( this._loadMsg ) {
return;
}
this._loadMsg = setTimeout($.proxy(function() {
this._getLoader().loader( "show", theme, msg, textonly );
this._loadMsg = 0;
}, this), delay );
},
_hideLoading: function() {
// Stop message show timer
clearTimeout( this._loadMsg );
this._loadMsg = 0;
// Hide loading message
this._getLoader().loader( "hide" );
},
_showError: function() {
// make sure to remove the current loading message
this._hideLoading();
// show the error message
this._showLoading( 0, $.mobile.pageLoadErrorMessageTheme, $.mobile.pageLoadErrorMessage, true );
// hide the error message after a delay
// TODO configuration
setTimeout( $.proxy(this, "_hideLoading"), 1500 );
},
_parse: function( html, fileUrl ) {
// TODO consider allowing customization of this method. It's very JQM specific
var page, all = $( "
" );
//workaround to allow scripts to execute when included in page divs
all.get( 0 ).innerHTML = html;
page = all.find( ":jqmData(role='page'), :jqmData(role='dialog')" ).first();
//if page elem couldn't be found, create one and insert the body element's contents
if ( !page.length ) {
page = $( "
" +
( html.split( /<\/?body[^>]*>/gmi )[1] || "" ) +
"
" );
}
// TODO tagging a page with external to make sure that embedded pages aren't
// removed by the various page handling code is bad. Having page handling code
// in many places is bad. Solutions post 1.0
page.attr( "data-" + this._getNs() + "url", $.mobile.path.convertUrlToDataUrl(fileUrl) )
.attr( "data-" + this._getNs() + "external-page", true );
return page;
},
_setLoadedTitle: function( page, html ) {
//page title regexp
var newPageTitle = html.match( /
]*>([^<]*)/ ) && RegExp.$1;
if ( newPageTitle && !page.jqmData("title") ) {
newPageTitle = $( "" + newPageTitle + "
" ).text();
page.jqmData( "title", newPageTitle );
}
},
_isRewritableBaseTag: function() {
return $.mobile.dynamicBaseEnabled && !$.support.dynamicBaseTag;
},
_createDataUrl: function( absoluteUrl ) {
return $.mobile.path.convertUrlToDataUrl( absoluteUrl );
},
_createFileUrl: function( absoluteUrl ) {
return $.mobile.path.getFilePath( absoluteUrl );
},
_triggerWithDeprecated: function( name, data, page ) {
var deprecatedEvent = $.Event( "page" + name ),
newEvent = $.Event( this.widgetName + name );
// DEPRECATED
// trigger the old deprecated event on the page if it's provided
( page || this.element ).trigger( deprecatedEvent, data );
// use the widget trigger method for the new content* event
this.element.trigger( newEvent, data );
return {
deprecatedEvent: deprecatedEvent,
event: newEvent
};
},
// TODO it would be nice to split this up more but everything appears to be "one off"
// or require ordering such that other bits are sprinkled in between parts that
// could be abstracted out as a group
_loadSuccess: function( absUrl, triggerData, settings, deferred ) {
var fileUrl = this._createFileUrl( absUrl ),
dataUrl = this._createDataUrl( absUrl );
return $.proxy(function( html, textStatus, xhr ) {
//pre-parse html to check for a data-url,
//use it as the new fileUrl, base path, etc
var content,
// TODO handle dialogs again
pageElemRegex = new RegExp( "(<[^>]+\\bdata-" + this._getNs() + "role=[\"']?page[\"']?[^>]*>)" ),
dataUrlRegex = new RegExp( "\\bdata-" + this._getNs() + "url=[\"']?([^\"'>]*)[\"']?" );
// data-url must be provided for the base tag so resource requests
// can be directed to the correct url. loading into a temprorary
// element makes these requests immediately
if ( pageElemRegex.test( html ) &&
RegExp.$1 &&
dataUrlRegex.test( RegExp.$1 ) &&
RegExp.$1 ) {
fileUrl = $.mobile.path.getFilePath( $("" + RegExp.$1 + "
").text() );
}
//dont update the base tag if we are prefetching
if ( settings.prefetch === undefined ) {
this._getBase().set( fileUrl );
}
content = this._parse( html, fileUrl );
this._setLoadedTitle( content, html );
// Add the content reference and xhr to our triggerData.
triggerData.xhr = xhr;
triggerData.textStatus = textStatus;
// DEPRECATED
triggerData.page = content;
triggerData.content = content;
// If the default behavior is prevented, stop here!
// Note that it is the responsibility of the listener/handler
// that called preventDefault(), to resolve/reject the
// deferred object within the triggerData.
if ( !this._trigger( "load", undefined, triggerData ) ) {
return;
}
// rewrite src and href attrs to use a base url if the base tag won't work
if ( this._isRewritableBaseTag() && content ) {
this._getBase().rewrite( fileUrl, content );
}
this._include( content, settings );
// Enhancing the content may result in new dialogs/sub content being inserted
// into the DOM. If the original absUrl refers to a sub-content, that is the
// real content we are interested in.
if ( absUrl.indexOf( "&" + $.mobile.subPageUrlKey ) > -1 ) {
content = this.element.children( "[data-" + this._getNs() +"url='" + dataUrl + "']" );
}
// Remove loading message.
if ( settings.showLoadMsg ) {
this._hideLoading();
}
// BEGIN DEPRECATED ---------------------------------------------------
// Let listeners know the content loaded successfully.
this.element.trigger( "pageload" );
// END DEPRECATED -----------------------------------------------------
deferred.resolve( absUrl, settings, content );
}, this);
},
_loadDefaults: {
type: "get",
data: undefined,
// DEPRECATED
reloadPage: false,
reload: false,
// By default we rely on the role defined by the @data-role attribute.
role: undefined,
showLoadMsg: false,
// This delay allows loads that pull from browser cache to
// occur without showing the loading message.
loadMsgDelay: 50
},
load: function( url, options ) {
// This function uses deferred notifications to let callers
// know when the content is done loading, or if an error has occurred.
var deferred = ( options && options.deferred ) || $.Deferred(),
// The default load options with overrides specified by the caller.
settings = $.extend( {}, this._loadDefaults, options ),
// The DOM element for the content after it has been loaded.
content = null,
// The absolute version of the URL passed into the function. This
// version of the URL may contain dialog/subcontent params in it.
absUrl = $.mobile.path.makeUrlAbsolute( url, this._findBaseWithDefault() ),
fileUrl, dataUrl, pblEvent, triggerData;
// DEPRECATED reloadPage
settings.reload = settings.reloadPage;
// If the caller provided data, and we're using "get" request,
// append the data to the URL.
if ( settings.data && settings.type === "get" ) {
absUrl = $.mobile.path.addSearchParams( absUrl, settings.data );
settings.data = undefined;
}
// If the caller is using a "post" request, reload must be true
if ( settings.data && settings.type === "post" ) {
settings.reload = true;
}
// The absolute version of the URL minus any dialog/subcontent params.
// In otherwords the real URL of the content to be loaded.
fileUrl = this._createFileUrl( absUrl );
// The version of the Url actually stored in the data-url attribute of
// the content. For embedded content, it is just the id of the page. For
// content within the same domain as the document base, it is the site
// relative path. For cross-domain content (Phone Gap only) the entire
// absolute Url is used to load the content.
dataUrl = this._createDataUrl( absUrl );
content = this._find( absUrl );
// If it isn't a reference to the first content and refers to missing
// embedded content reject the deferred and return
if ( content.length === 0 &&
$.mobile.path.isEmbeddedPage(fileUrl) &&
!$.mobile.path.isFirstPageUrl(fileUrl) ) {
deferred.reject( absUrl, settings );
return;
}
// Reset base to the default document base
// TODO figure out why we doe this
this._getBase().reset();
// If the content we are interested in is already in the DOM,
// and the caller did not indicate that we should force a
// reload of the file, we are done. Resolve the deferrred so that
// users can bind to .done on the promise
if ( content.length && !settings.reload ) {
this._enhance( content, settings.role );
deferred.resolve( absUrl, settings, content );
//if we are reloading the content make sure we update
// the base if its not a prefetch
if ( !settings.prefetch ) {
this._getBase().set(url);
}
return;
}
triggerData = {
url: url,
absUrl: absUrl,
dataUrl: dataUrl,
deferred: deferred,
options: settings
};
// Let listeners know we're about to load content.
pblEvent = this._triggerWithDeprecated( "beforeload", triggerData );
// If the default behavior is prevented, stop here!
if ( pblEvent.deprecatedEvent.isDefaultPrevented() ||
pblEvent.event.isDefaultPrevented() ) {
return;
}
if ( settings.showLoadMsg ) {
this._showLoading( settings.loadMsgDelay );
}
// Reset base to the default document base.
// only reset if we are not prefetching
if ( settings.prefetch === undefined ) {
this._getBase().reset();
}
if ( !( $.mobile.allowCrossDomainPages ||
$.mobile.path.isSameDomain($.mobile.path.documentUrl, absUrl ) ) ) {
deferred.reject( absUrl, settings );
return;
}
// Load the new content.
$.ajax({
url: fileUrl,
type: settings.type,
data: settings.data,
contentType: settings.contentType,
dataType: "html",
success: this._loadSuccess( absUrl, triggerData, settings, deferred ),
error: this._loadError( absUrl, triggerData, settings, deferred )
});
},
_loadError: function( absUrl, triggerData, settings, deferred ) {
return $.proxy(function( xhr, textStatus, errorThrown ) {
//set base back to current path
this._getBase().set( $.mobile.path.get() );
// Add error info to our triggerData.
triggerData.xhr = xhr;
triggerData.textStatus = textStatus;
triggerData.errorThrown = errorThrown;
// Let listeners know the page load failed.
var plfEvent = this._triggerWithDeprecated( "loadfailed", triggerData );
// If the default behavior is prevented, stop here!
// Note that it is the responsibility of the listener/handler
// that called preventDefault(), to resolve/reject the
// deferred object within the triggerData.
if ( plfEvent.deprecatedEvent.isDefaultPrevented() ||
plfEvent.event.isDefaultPrevented() ) {
return;
}
// Remove loading message.
if ( settings.showLoadMsg ) {
this._showError();
}
deferred.reject( absUrl, settings );
}, this);
},
_getTransitionHandler: function( transition ) {
transition = $.mobile._maybeDegradeTransition( transition );
//find the transition handler for the specified transition. If there
//isn't one in our transitionHandlers dictionary, use the default one.
//call the handler immediately to kick-off the transition.
return $.mobile.transitionHandlers[ transition ] || $.mobile.defaultTransitionHandler;
},
// TODO move into transition handlers?
_triggerCssTransitionEvents: function( to, from, prefix ) {
var samePage = false;
prefix = prefix || "";
// TODO decide if these events should in fact be triggered on the container
if ( from ) {
//Check if this is a same page transition and tell the handler in page
if( to[0] === from[0] ){
samePage = true;
}
//trigger before show/hide events
// TODO deprecate nextPage in favor of next
this._triggerWithDeprecated( prefix + "hide", { nextPage: to, samePage: samePage }, from );
}
// TODO deprecate prevPage in favor of previous
this._triggerWithDeprecated( prefix + "show", { prevPage: from || $( "" ) }, to );
},
// TODO make private once change has been defined in the widget
_cssTransition: function( to, from, options ) {
var transition = options.transition,
reverse = options.reverse,
deferred = options.deferred,
TransitionHandler,
promise;
this._triggerCssTransitionEvents( to, from, "before" );
// TODO put this in a binding to events *outside* the widget
this._hideLoading();
TransitionHandler = this._getTransitionHandler( transition );
promise = ( new TransitionHandler( transition, reverse, to, from ) ).transition();
// TODO temporary accomodation of argument deferred
promise.done(function() {
deferred.resolve.apply( deferred, arguments );
});
promise.done($.proxy(function() {
this._triggerCssTransitionEvents( to, from );
}, this));
},
_releaseTransitionLock: function() {
//release transition lock so navigation is free again
isPageTransitioning = false;
if ( pageTransitionQueue.length > 0 ) {
$.mobile.changePage.apply( null, pageTransitionQueue.pop() );
}
},
_removeActiveLinkClass: function( force ) {
//clear out the active button state
$.mobile.removeActiveLinkClass( force );
},
_loadUrl: function( to, triggerData, settings ) {
// preserve the original target as the dataUrl value will be
// simplified eg, removing ui-state, and removing query params
// from the hash this is so that users who want to use query
// params have access to them in the event bindings for the page
// life cycle See issue #5085
settings.target = to;
settings.deferred = $.Deferred();
this.load( to, settings );
settings.deferred.done($.proxy(function( url, options, content ) {
isPageTransitioning = false;
// store the original absolute url so that it can be provided
// to events in the triggerData of the subsequent changePage call
options.absUrl = triggerData.absUrl;
this.transition( content, triggerData, options );
}, this));
settings.deferred.fail($.proxy(function(/* url, options */) {
this._removeActiveLinkClass( true );
this._releaseTransitionLock();
this._triggerWithDeprecated( "changefailed", triggerData );
}, this));
},
_triggerPageBeforeChange: function( to, triggerData, settings ) {
var pbcEvent = new $.Event( "pagebeforechange" );
$.extend(triggerData, { toPage: to, options: settings });
// NOTE: preserve the original target as the dataUrl value will be
// simplified eg, removing ui-state, and removing query params from
// the hash this is so that users who want to use query params have
// access to them in the event bindings for the page life cycle
// See issue #5085
if ( $.type(to) === "string" ) {
// if the toPage is a string simply convert it
triggerData.absUrl = $.mobile.path.makeUrlAbsolute( to, this._findBaseWithDefault() );
} else {
// if the toPage is a jQuery object grab the absolute url stored
// in the loadPage callback where it exists
triggerData.absUrl = settings.absUrl;
}
// Let listeners know we're about to change the current page.
this.element.trigger( pbcEvent, triggerData );
// If the default behavior is prevented, stop here!
if ( pbcEvent.isDefaultPrevented() ) {
return false;
}
return true;
},
change: function( to, options ) {
// If we are in the midst of a transition, queue the current request.
// We'll call changePage() once we're done with the current transition
// to service the request.
if ( isPageTransitioning ) {
pageTransitionQueue.unshift( arguments );
return;
}
var settings = $.extend( {}, $.mobile.changePage.defaults, options ),
triggerData = {};
// Make sure we have a fromPage.
settings.fromPage = settings.fromPage || this.activePage;
// if the page beforechange default is prevented return early
if ( !this._triggerPageBeforeChange(to, triggerData, settings) ) {
return;
}
// We allow "pagebeforechange" observers to modify the to in
// the trigger data to allow for redirects. Make sure our to is
// updated. We also need to re-evaluate whether it is a string,
// because an object can also be replaced by a string
to = triggerData.toPage;
// If the caller passed us a url, call loadPage()
// to make sure it is loaded into the DOM. We'll listen
// to the promise object it returns so we know when
// it is done loading or if an error ocurred.
if ( $.type(to) === "string" ) {
// Set the isPageTransitioning flag to prevent any requests from
// entering this method while we are in the midst of loading a page
// or transitioning.
isPageTransitioning = true;
this._loadUrl( to, triggerData, settings );
} else {
this.transition( to, triggerData, settings );
}
},
transition: function( toPage, triggerData, settings ) {
var fromPage, url, pageUrl, fileUrl,
active, activeIsInitialPage,
historyDir, pageTitle, isDialog,
alreadyThere, newPageTitle,
params, cssTransitionDeferred,
beforeTransition;
// If we are in the midst of a transition, queue the current request.
// We'll call changePage() once we're done with the current transition
// to service the request.
if ( isPageTransitioning ) {
// make sure to only queue the to and settings values so the arguments
// work with a call to the change method
pageTransitionQueue.unshift( [toPage, settings] );
return;
}
// DEPRECATED - this call only, in favor of the before transition
// if the page beforechange default is prevented return early
if ( !this._triggerPageBeforeChange(toPage, triggerData, settings) ) {
return;
}
// if the (content|page)beforetransition default is prevented return early
// Note, we have to check for both the deprecated and new events
beforeTransition = this._triggerWithDeprecated( "beforetransition", triggerData );
if (beforeTransition.deprecatedEvent.isDefaultPrevented() ||
beforeTransition.event.isDefaultPrevented() ) {
return;
}
// Set the isPageTransitioning flag to prevent any requests from
// entering this method while we are in the midst of loading a page
// or transitioning.
isPageTransitioning = true;
// If we are going to the first-page of the application, we need to make
// sure settings.dataUrl is set to the application document url. This allows
// us to avoid generating a document url with an id hash in the case where the
// first-page of the document has an id attribute specified.
if ( toPage[ 0 ] === $.mobile.firstPage[ 0 ] && !settings.dataUrl ) {
settings.dataUrl = $.mobile.path.documentUrl.hrefNoHash;
}
// The caller passed us a real page DOM element. Update our
// internal state and then trigger a transition to the page.
fromPage = settings.fromPage;
url = ( settings.dataUrl && $.mobile.path.convertUrlToDataUrl(settings.dataUrl) ) ||
toPage.jqmData( "url" );
// The pageUrl var is usually the same as url, except when url is obscured
// as a dialog url. pageUrl always contains the file path
pageUrl = url;
fileUrl = $.mobile.path.getFilePath( url );
active = $.mobile.navigate.history.getActive();
activeIsInitialPage = $.mobile.navigate.history.activeIndex === 0;
historyDir = 0;
pageTitle = document.title;
isDialog = ( settings.role === "dialog" ||
toPage.jqmData( "role" ) === "dialog" ) &&
toPage.jqmData( "dialog" ) !== true;
// By default, we prevent changePage requests when the fromPage and toPage
// are the same element, but folks that generate content
// manually/dynamically and reuse pages want to be able to transition to
// the same page. To allow this, they will need to change the default
// value of allowSamePageTransition to true, *OR*, pass it in as an
// option when they manually call changePage(). It should be noted that
// our default transition animations assume that the formPage and toPage
// are different elements, so they may behave unexpectedly. It is up to
// the developer that turns on the allowSamePageTransitiona option to
// either turn off transition animations, or make sure that an appropriate
// animation transition is used.
if ( fromPage && fromPage[0] === toPage[0] &&
!settings.allowSamePageTransition ) {
isPageTransitioning = false;
this._triggerWithDeprecated( "transition", triggerData );
this.element.trigger( "pagechange", triggerData );
// Even if there is no page change to be done, we should keep the
// urlHistory in sync with the hash changes
if ( settings.fromHashChange ) {
$.mobile.navigate.history.direct({ url: url });
}
return;
}
// We need to make sure the page we are given has already been enhanced.
toPage.page({ role: settings.role });
// If the changePage request was sent from a hashChange event, check to
// see if the page is already within the urlHistory stack. If so, we'll
// assume the user hit the forward/back button and will try to match the
// transition accordingly.
if ( settings.fromHashChange ) {
historyDir = settings.direction === "back" ? -1 : 1;
}
// Kill the keyboard.
// XXX_jblas: We need to stop crawling the entire document to kill focus.
// Instead, we should be tracking focus with a delegate()
// handler so we already have the element in hand at this
// point.
// Wrap this in a try/catch block since IE9 throw "Unspecified error" if
// document.activeElement is undefined when we are in an IFrame.
try {
if ( document.activeElement &&
document.activeElement.nodeName.toLowerCase() !== "body" ) {
$( document.activeElement ).blur();
} else {
$( "input:focus, textarea:focus, select:focus" ).blur();
}
} catch( e ) {}
// Record whether we are at a place in history where a dialog used to be -
// if so, do not add a new history entry and do not change the hash either
alreadyThere = false;
// If we're displaying the page as a dialog, we don't want the url
// for the dialog content to be used in the hash. Instead, we want
// to append the dialogHashKey to the url of the current page.
if ( isDialog && active ) {
// on the initial page load active.url is undefined and in that case
// should be an empty string. Moving the undefined -> empty string back
// into urlHistory.addNew seemed imprudent given undefined better
// represents the url state
// If we are at a place in history that once belonged to a dialog, reuse
// this state without adding to urlHistory and without modifying the
// hash. However, if a dialog is already displayed at this point, and
// we're about to display another dialog, then we must add another hash
// and history entry on top so that one may navigate back to the
// original dialog
if ( active.url &&
active.url.indexOf( $.mobile.dialogHashKey ) > -1 &&
this.activePage &&
!this.activePage.hasClass( "ui-dialog" ) &&
$.mobile.navigate.history.activeIndex > 0 ) {
settings.changeHash = false;
alreadyThere = true;
}
// Normally, we tack on a dialog hash key, but if this is the location
// of a stale dialog, we reuse the URL from the entry
url = ( active.url || "" );
// account for absolute urls instead of just relative urls use as hashes
if ( !alreadyThere && url.indexOf("#") > -1 ) {
url += $.mobile.dialogHashKey;
} else {
url += "#" + $.mobile.dialogHashKey;
}
// tack on another dialogHashKey if this is the same as the initial hash
// this makes sure that a history entry is created for this dialog
if ( $.mobile.navigate.history.activeIndex === 0 && url === $.mobile.navigate.history.initialDst ) {
url += $.mobile.dialogHashKey;
}
}
// if title element wasn't found, try the page div data attr too
// If this is a deep-link or a reload ( active === undefined ) then just
// use pageTitle
newPageTitle = ( !active ) ? pageTitle : toPage.jqmData( "title" ) ||
toPage.children( ":jqmData(role='header')" ).find( ".ui-title" ).text();
if ( !!newPageTitle && pageTitle === document.title ) {
pageTitle = newPageTitle;
}
if ( !toPage.jqmData( "title" ) ) {
toPage.jqmData( "title", pageTitle );
}
// Make sure we have a transition defined.
settings.transition = settings.transition ||
( ( historyDir && !activeIsInitialPage ) ? active.transition : undefined ) ||
( isDialog ? $.mobile.defaultDialogTransition : $.mobile.defaultPageTransition );
//add page to history stack if it's not back or forward
if ( !historyDir && alreadyThere ) {
$.mobile.navigate.history.getActive().pageUrl = pageUrl;
}
// Set the location hash.
if ( url && !settings.fromHashChange ) {
// rebuilding the hash here since we loose it earlier on
// TODO preserve the originally passed in path
if ( !$.mobile.path.isPath( url ) && url.indexOf( "#" ) < 0 ) {
url = "#" + url;
}
// TODO the property names here are just silly
params = {
transition: settings.transition,
title: pageTitle,
pageUrl: pageUrl,
role: settings.role
};
if ( settings.changeHash !== false && $.mobile.hashListeningEnabled ) {
$.mobile.navigate( url, params, true);
} else if ( toPage[ 0 ] !== $.mobile.firstPage[ 0 ] ) {
$.mobile.navigate.history.add( url, params );
}
}
//set page title
document.title = pageTitle;
//set "toPage" as activePage deprecated in 1.4 remove in 1.5
$.mobile.activePage = toPage;
//new way to handle activePage
this.activePage = toPage;
// If we're navigating back in the URL history, set reverse accordingly.
settings.reverse = settings.reverse || historyDir < 0;
cssTransitionDeferred = $.Deferred();
this._cssTransition(toPage, fromPage, {
transition: settings.transition,
reverse: settings.reverse,
deferred: cssTransitionDeferred
});
cssTransitionDeferred.done($.proxy(function( name, reverse, $to, $from, alreadyFocused ) {
$.mobile.removeActiveLinkClass();
//if there's a duplicateCachedPage, remove it from the DOM now that it's hidden
if ( settings.duplicateCachedPage ) {
settings.duplicateCachedPage.remove();
}
// despite visibility: hidden addresses issue #2965
// https://github.com/jquery/jquery-mobile/issues/2965
if ( !alreadyFocused ) {
$.mobile.focusPage( toPage );
}
this._releaseTransitionLock();
this.element.trigger( "pagechange", triggerData );
this._triggerWithDeprecated( "transition", triggerData );
}, this));
},
// determine the current base url
_findBaseWithDefault: function() {
var closestBase = ( this.activePage &&
$.mobile.getClosestBaseUrl( this.activePage ) );
return closestBase || $.mobile.path.documentBase.hrefNoHash;
}
});
// The following handlers should be bound after mobileinit has been triggered
// the following deferred is resolved in the init file
$.mobile.navreadyDeferred = $.Deferred();
//these variables make all page containers use the same queue and only navigate one at a time
// queue to hold simultanious page transitions
var pageTransitionQueue = [],
// indicates whether or not page is in process of transitioning
isPageTransitioning = false;
})( jQuery );
(function( $, undefined ) {
// resolved on domready
var domreadyDeferred = $.Deferred(),
// resolved and nulled on window.load()
loadDeferred = $.Deferred(),
documentUrl = $.mobile.path.documentUrl,
// used to track last vclicked element to make sure its value is added to form data
$lastVClicked = null;
/* Event Bindings - hashchange, submit, and click */
function findClosestLink( ele ) {
while ( ele ) {
// Look for the closest element with a nodeName of "a".
// Note that we are checking if we have a valid nodeName
// before attempting to access it. This is because the
// node we get called with could have originated from within
// an embedded SVG document where some symbol instance elements
// don't have nodeName defined on them, or strings are of type
// SVGAnimatedString.
if ( ( typeof ele.nodeName === "string" ) && ele.nodeName.toLowerCase() === "a" ) {
break;
}
ele = ele.parentNode;
}
return ele;
}
$.mobile.loadPage = function( url, opts ) {
var container;
opts = opts || {};
container = ( opts.pageContainer || $.mobile.pageContainer );
// create the deferred that will be supplied to loadPage callers
// and resolved by the content widget's load method
opts.deferred = $.Deferred();
// Preferring to allow exceptions for uninitialized opts.pageContainer
// widgets so we know if we need to force init here for users
container.pagecontainer( "load", url, opts );
// provide the deferred
return opts.deferred.promise();
};
//define vars for interal use
/* internal utility functions */
// NOTE Issue #4950 Android phonegap doesn't navigate back properly
// when a full page refresh has taken place. It appears that hashchange
// and replacestate history alterations work fine but we need to support
// both forms of history traversal in our code that uses backward history
// movement
$.mobile.back = function() {
var nav = window.navigator;
// if the setting is on and the navigator object is
// available use the phonegap navigation capability
if ( this.phonegapNavigationEnabled &&
nav &&
nav.app &&
nav.app.backHistory ) {
nav.app.backHistory();
} else {
$.mobile.pageContainer.pagecontainer( "back" );
}
};
// Direct focus to the page title, or otherwise first focusable element
$.mobile.focusPage = function ( page ) {
var autofocus = page.find( "[autofocus]" ),
pageTitle = page.find( ".ui-title:eq(0)" );
if ( autofocus.length ) {
autofocus.focus();
return;
}
if ( pageTitle.length ) {
pageTitle.focus();
} else{
page.focus();
}
};
// No-op implementation of transition degradation
$.mobile._maybeDegradeTransition = $.mobile._maybeDegradeTransition || function( transition ) {
return transition;
};
// Exposed $.mobile methods
$.mobile.changePage = function( to, options ) {
$.mobile.pageContainer.pagecontainer( "change", to, options );
};
$.mobile.changePage.defaults = {
transition: undefined,
reverse: false,
changeHash: false,
fromHashChange: false,
role: undefined, // By default we rely on the role defined by the @data-role attribute.
duplicateCachedPage: undefined,
pageContainer: undefined,
showLoadMsg: false, //loading message shows by default when pages are being fetched during changePage
dataUrl: undefined,
fromPage: undefined,
allowSamePageTransition: false
};
$.mobile._registerInternalEvents = function() {
var getAjaxFormData = function( $form, calculateOnly ) {
var url, ret = true, formData, vclickedName, method;
if ( !$.mobile.ajaxEnabled ||
// test that the form is, itself, ajax false
$form.is( ":jqmData(ajax='false')" ) ||
// test that $.mobile.ignoreContentEnabled is set and
// the form or one of it's parents is ajax=false
!$form.jqmHijackable().length ||
$form.attr( "target" ) ) {
return false;
}
url = ( $lastVClicked && $lastVClicked.attr( "formaction" ) ) ||
$form.attr( "action" );
method = ( $form.attr( "method" ) || "get" ).toLowerCase();
// If no action is specified, browsers default to using the
// URL of the document containing the form. Since we dynamically
// pull in pages from external documents, the form should submit
// to the URL for the source document of the page containing
// the form.
if ( !url ) {
// Get the @data-url for the page containing the form.
url = $.mobile.getClosestBaseUrl( $form );
// NOTE: If the method is "get", we need to strip off the query string
// because it will get replaced with the new form data. See issue #5710.
if ( method === "get" ) {
url = $.mobile.path.parseUrl( url ).hrefNoSearch;
}
if ( url === $.mobile.path.documentBase.hrefNoHash ) {
// The url we got back matches the document base,
// which means the page must be an internal/embedded page,
// so default to using the actual document url as a browser
// would.
url = documentUrl.hrefNoSearch;
}
}
url = $.mobile.path.makeUrlAbsolute( url, $.mobile.getClosestBaseUrl( $form ) );
if ( ( $.mobile.path.isExternal( url ) && !$.mobile.path.isPermittedCrossDomainRequest( documentUrl, url ) ) ) {
return false;
}
if ( !calculateOnly ) {
formData = $form.serializeArray();
if ( $lastVClicked && $lastVClicked[ 0 ].form === $form[ 0 ] ) {
vclickedName = $lastVClicked.attr( "name" );
if ( vclickedName ) {
// Make sure the last clicked element is included in the form
$.each( formData, function( key, value ) {
if ( value.name === vclickedName ) {
// Unset vclickedName - we've found it in the serialized data already
vclickedName = "";
return false;
}
});
if ( vclickedName ) {
formData.push( { name: vclickedName, value: $lastVClicked.attr( "value" ) } );
}
}
}
ret = {
url: url,
options: {
type: method,
data: $.param( formData ),
transition: $form.jqmData( "transition" ),
reverse: $form.jqmData( "direction" ) === "reverse",
reloadPage: true
}
};
}
return ret;
};
//bind to form submit events, handle with Ajax
$.mobile.document.delegate( "form", "submit", function( event ) {
var formData;
if ( !event.isDefaultPrevented() ) {
formData = getAjaxFormData( $( this ) );
if ( formData ) {
$.mobile.changePage( formData.url, formData.options );
}
}
});
//add active state on vclick
$.mobile.document.bind( "vclick", function( event ) {
var $btn, btnEls, target = event.target, needClosest = false;
// if this isn't a left click we don't care. Its important to note
// that when the virtual event is generated it will create the which attr
if ( event.which > 1 || !$.mobile.linkBindingEnabled ) {
return;
}
// Record that this element was clicked, in case we need it for correct
// form submission during the "submit" handler above
$lastVClicked = $( target );
// Try to find a target element to which the active class will be applied
if ( $.data( target, "mobile-button" ) ) {
// If the form will not be submitted via AJAX, do not add active class
if ( !getAjaxFormData( $( target ).closest( "form" ), true ) ) {
return;
}
// We will apply the active state to this button widget - the parent
// of the input that was clicked will have the associated data
if ( target.parentNode ) {
target = target.parentNode;
}
} else {
target = findClosestLink( target );
if ( !( target && $.mobile.path.parseUrl( target.getAttribute( "href" ) || "#" ).hash !== "#" ) ) {
return;
}
// TODO teach $.mobile.hijackable to operate on raw dom elements so the
// link wrapping can be avoided
if ( !$( target ).jqmHijackable().length ) {
return;
}
}
// Avoid calling .closest by using the data set during .buttonMarkup()
// List items have the button data in the parent of the element clicked
if ( !!~target.className.indexOf( "ui-link-inherit" ) ) {
if ( target.parentNode ) {
btnEls = $.data( target.parentNode, "buttonElements" );
}
// Otherwise, look for the data on the target itself
} else {
btnEls = $.data( target, "buttonElements" );
}
// If found, grab the button's outer element
if ( btnEls ) {
target = btnEls.outer;
} else {
needClosest = true;
}
$btn = $( target );
// If the outer element wasn't found by the our heuristics, use .closest()
if ( needClosest ) {
$btn = $btn.closest( ".ui-btn" );
}
if ( $btn.length > 0 &&
!( $btn.hasClass( "ui-state-disabled" ||
// DEPRECATED as of 1.4.0 - remove after 1.4.0 release
// only ui-state-disabled should be present thereafter
$btn.hasClass( "ui-disabled" ) ) ) ) {
$.mobile.removeActiveLinkClass( true );
$.mobile.activeClickedLink = $btn;
$.mobile.activeClickedLink.addClass( $.mobile.activeBtnClass );
}
});
// click routing - direct to HTTP or Ajax, accordingly
$.mobile.document.bind( "click", function( event ) {
if ( !$.mobile.linkBindingEnabled || event.isDefaultPrevented() ) {
return;
}
var link = findClosestLink( event.target ),
$link = $( link ),
//remove active link class if external (then it won't be there if you come back)
httpCleanup = function() {
window.setTimeout(function() { $.mobile.removeActiveLinkClass( true ); }, 200 );
},
baseUrl, href,
useDefaultUrlHandling, isExternal,
transition, reverse, role;
// If a button was clicked, clean up the active class added by vclick above
if ( $.mobile.activeClickedLink &&
$.mobile.activeClickedLink[ 0 ] === event.target.parentNode ) {
httpCleanup();
}
// If there is no link associated with the click or its not a left
// click we want to ignore the click
// TODO teach $.mobile.hijackable to operate on raw dom elements so the link wrapping
// can be avoided
if ( !link || event.which > 1 || !$link.jqmHijackable().length ) {
return;
}
//if there's a data-rel=back attr, go back in history
if ( $link.is( ":jqmData(rel='back')" ) ) {
$.mobile.back();
return false;
}
baseUrl = $.mobile.getClosestBaseUrl( $link );
//get href, if defined, otherwise default to empty hash
href = $.mobile.path.makeUrlAbsolute( $link.attr( "href" ) || "#", baseUrl );
//if ajax is disabled, exit early
if ( !$.mobile.ajaxEnabled && !$.mobile.path.isEmbeddedPage( href ) ) {
httpCleanup();
//use default click handling
return;
}
// XXX_jblas: Ideally links to application pages should be specified as
// an url to the application document with a hash that is either
// the site relative path or id to the page. But some of the
// internal code that dynamically generates sub-pages for nested
// lists and select dialogs, just write a hash in the link they
// create. This means the actual URL path is based on whatever
// the current value of the base tag is at the time this code
// is called. For now we are just assuming that any url with a
// hash in it is an application page reference.
if ( href.search( "#" ) !== -1 ) {
href = href.replace( /[^#]*#/, "" );
if ( !href ) {
//link was an empty hash meant purely
//for interaction, so we ignore it.
return;
} else if ( $.mobile.path.isPath( href ) ) {
//we have apath so make it the href we want to load.
href = $.mobile.path.makeUrlAbsolute( href, baseUrl );
} else {
//we have a simple id so use the documentUrl as its base.
href = $.mobile.path.makeUrlAbsolute( "#" + href, documentUrl.hrefNoHash );
}
}
// Should we handle this link, or let the browser deal with it?
useDefaultUrlHandling = $link.is( "[rel='external']" ) || $link.is( ":jqmData(ajax='false')" ) || $link.is( "[target]" );
// Some embedded browsers, like the web view in Phone Gap, allow cross-domain XHR
// requests if the document doing the request was loaded via the file:// protocol.
// This is usually to allow the application to "phone home" and fetch app specific
// data. We normally let the browser handle external/cross-domain urls, but if the
// allowCrossDomainPages option is true, we will allow cross-domain http/https
// requests to go through our page loading logic.
//check for protocol or rel and its not an embedded page
//TODO overlap in logic from isExternal, rel=external check should be
// moved into more comprehensive isExternalLink
isExternal = useDefaultUrlHandling || ( $.mobile.path.isExternal( href ) && !$.mobile.path.isPermittedCrossDomainRequest( documentUrl, href ) );
if ( isExternal ) {
httpCleanup();
//use default click handling
return;
}
//use ajax
transition = $link.jqmData( "transition" );
reverse = $link.jqmData( "direction" ) === "reverse" ||
// deprecated - remove by 1.0
$link.jqmData( "back" );
//this may need to be more specific as we use data-rel more
role = $link.attr( "data-" + $.mobile.ns + "rel" ) || undefined;
$.mobile.changePage( href, { transition: transition, reverse: reverse, role: role, link: $link } );
});
//prefetch pages when anchors with data-prefetch are encountered
// TODO ensure that the navigate binding in the content widget happens at the right time
$.mobile.pageContainer.pagecontainer();
//set page min-heights to be device specific
$.mobile.document.bind( "pageshow", function() {
// We need to wait for window.load to make sure that styles have already been rendered,
// otherwise heights of external toolbars will have the wrong value
if ( loadDeferred ) {
loadDeferred.done( $.mobile.resetActivePageHeight );
} else {
$.mobile.resetActivePageHeight();
}
});
$.mobile.window.bind( "throttledresize", $.mobile.resetActivePageHeight );
};//navreadyDeferred done callback
$( function() { domreadyDeferred.resolve(); } );
$.mobile.window.load( function() {
// Resolve and null the deferred
loadDeferred.resolve();
loadDeferred = null;
});
$.when( domreadyDeferred, $.mobile.navreadyDeferred ).done( function() { $.mobile._registerInternalEvents(); } );
})( jQuery );
(function( $ ) {
// TODO move loader class down into the widget settings
var loaderClass = "ui-loader", $html = $( "html" );
$.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: "",
// 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 && this.window.scrollTop() + this.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 = this.window.scrollTop(),
screenHeight = $.mobile.getScreenHeight();
if ( offset.top < scrollTop || ( offset.top - scrollTop ) > screenHeight ) {
this.element.addClass( "ui-loader-fakefix" );
this.fakeFixLoader();
this.window
.unbind( "scroll", this.checkLoaderPosition )
.bind( "scroll", $.proxy( this.fakeFixLoader, this ) );
}
},
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, 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 );
theme = loadSettings.theme;
} else {
loadSettings = this.options;
// here we prefer the theme 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 || loadSettings.theme;
}
// set the message text, prefer the param, then the settings object
// then loading message
message = msgText || ( loadSettings.text === false ? "" : loadSettings.text );
// prepare the dom
$html.addClass( "ui-loading" );
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
this.window.bind( "scroll", $.proxy( this.checkLoaderPosition, this ) );
},
hide: function() {
$html.removeClass( "ui-loading" );
if ( this.options.text ) {
this.element.removeClass( "ui-loader-fakefix" );
}
$.mobile.window.unbind( "scroll", this.fakeFixLoader );
$.mobile.window.unbind( "scroll", this.checkLoaderPosition );
}
});
})(jQuery, this);
(function( $, window, undefined ) {
var $html = $( "html" ),
$window = $.mobile.window;
//remove initial build class (only present on first pageshow)
function hideRenderingClass() {
$html.removeClass( "" );
}
// trigger mobileinit event - useful hook for configuring $.mobile settings before they're used
$( window.document ).trigger( "mobileinit" );
// support conditions
// if device support condition(s) aren't met, leave things as they are -> a basic, usable experience,
// otherwise, proceed with the enhancements
if ( !$.mobile.gradeA() ) {
return;
}
// override ajaxEnabled on platforms that have known conflicts with hash history updates
// or generally work better browsing in regular http for full page refreshes (BB5, Opera Mini)
if ( $.mobile.ajaxBlacklist ) {
$.mobile.ajaxEnabled = false;
}
// Add mobile, initial load "rendering" classes to docEl
$html.addClass( "" );
// This is a fallback. If anything goes wrong (JS errors, etc), or events don't fire,
// this ensures the rendering class is removed after 5 seconds, so content is visible and accessible
setTimeout( hideRenderingClass, 5000 );
$.extend( $.mobile, {
// find and enhance the pages in the dom and transition to the first page.
initializePage: function() {
// find present pages
var path = $.mobile.path,
$pages = $( ":jqmData(role='page'), :jqmData(role='dialog')" ),
hash = path.stripHash( path.stripQueryParams(path.parseLocation().hash) ),
hashPage = document.getElementById( hash );
// if no pages are found, create one with body's inner html
if ( !$pages.length ) {
$pages = $( "body" ).wrapInner( "" ).children( 0 );
}
// add dialogs, set data-url attrs
$pages.each(function() {
var $this = $( this );
// unless the data url is already set set it to the pathname
if ( !$this[ 0 ].getAttribute( "data-" + $.mobile.ns + "url" ) ) {
$this.attr( "data-" + $.mobile.ns + "url", $this.attr( "id" ) || location.pathname + location.search );
}
});
// define first page in dom case one backs out to the directory root (not always the first page visited, but defined as fallback)
$.mobile.firstPage = $pages.first();
// define page container
$.mobile.pageContainer = $.mobile.firstPage
.parent()
.addClass( "" )
.pagecontainer();
// initialize navigation events now, after mobileinit has occurred and the page container
// has been created but before the rest of the library is alerted to that fact
$.mobile.navreadyDeferred.resolve();
// alert listeners that the pagecontainer has been determined for binding
// to events triggered on it
$window.trigger( "pagecontainercreate" );
// cue page loading message
$.mobile.loading( "show" );
//remove initial build class (only present on first pageshow)
hideRenderingClass();
// if hashchange listening is disabled, there's no hash deeplink,
// the hash is not valid (contains more than one # or does not start with #)
// or there is no page with that hash, change to the first page in the DOM
// Remember, however, that the hash can also be a path!
if ( ! ( $.mobile.hashListeningEnabled &&
$.mobile.path.isHashValid( location.hash ) &&
( $( hashPage ).is( ":jqmData(role='page')" ) ||
$.mobile.path.isPath( hash ) ||
hash === $.mobile.dialogHashKey ) ) ) {
// Store the initial destination
if ( $.mobile.path.isHashValid( location.hash ) ) {
$.mobile.navigate.history.initialDst = hash.replace( "#", "" );
}
// make sure to set initial popstate state if it exists
// so that navigation back to the initial page works properly
if ( $.event.special.navigate.isPushStateEnabled() ) {
$.mobile.navigate.navigator.squash( path.parseLocation().href );
}
$.mobile.changePage( $.mobile.firstPage, {
transition: "none",
reverse: false,
changeHash: false,
fromHashChange: false
});
} else {
// trigger hashchange or navigate to squash and record the correct
// history entry for an initial hash path
if ( !$.event.special.navigate.isPushStateEnabled() ) {
$window.trigger( "hashchange", [true] );
} else {
// TODO figure out how to simplify this interaction with the initial history entry
// at the bottom js/navigate/navigate.js
$.mobile.navigate.history.stack = [];
$.mobile.navigate( $.mobile.path.isPath( location.hash ) ? location.hash : location.href );
}
}
}
});
$(function() {
//Run inlineSVG support test
$.support.inlineSVG();
// check which scrollTop value should be used by scrolling to 1 immediately at domready
// then check what the scroll top is. Android will report 0... others 1
// note that this initial scroll won't hide the address bar. It's just for the check.
// hide iOS browser chrome on load if hideUrlBar is true this is to try and do it as soon as possible
if ( $.mobile.hideUrlBar ) {
window.scrollTo( 0, 1 );
}
// if defaultHomeScroll hasn't been set yet, see if scrollTop is 1
// it should be 1 in most browsers, but android treats 1 as 0 (for hiding addr bar)
// so if it's 1, use 0 from now on
$.mobile.defaultHomeScroll = ( !$.support.scrollTop || $.mobile.window.scrollTop() === 1 ) ? 0 : 1;
//dom-ready inits
if ( $.mobile.autoInitializePage ) {
$.mobile.initializePage();
}
// window load event
// hide iOS browser chrome on load if hideUrlBar is true this is as fall back incase we were too early before
if ( $.mobile.hideUrlBar ) {
$window.load( $.mobile.silentScroll );
}
if ( !$.support.cssPointerEvents ) {
// IE and Opera don't support CSS pointer-events: none that we use to disable link-based buttons
// by adding the 'ui-disabled' class to them. Using a JavaScript workaround for those browser.
// https://github.com/jquery/jquery-mobile/issues/3558
// DEPRECATED as of 1.4.0 - remove ui-disabled after 1.4.0 release
// only ui-state-disabled should be present thereafter
$.mobile.document.delegate( ".ui-state-disabled,.ui-disabled", "vclick",
function( e ) {
e.preventDefault();
e.stopImmediatePropagation();
}
);
}
});
}( jQuery, this ));
(function( $, undefined ) {
$.mobile.behaviors.addFirstLastClasses = {
_getVisibles: function( $els, create ) {
var visibles;
if ( create ) {
visibles = $els.not( ".ui-screen-hidden" );
} else {
visibles = $els.filter( ":visible" );
if ( visibles.length === 0 ) {
visibles = $els.not( ".ui-screen-hidden" );
}
}
return visibles;
},
_addFirstLastClasses: function( $els, $visibles, create ) {
$els.removeClass( "ui-first-child ui-last-child" );
$visibles.eq( 0 ).addClass( "ui-first-child" ).end().last().addClass( "ui-last-child" );
if ( !create ) {
this.element.trigger( "updatelayout" );
}
},
_removeFirstLastClasses: function( $els ) {
$els.removeClass( "ui-first-child ui-last-child" );
}
};
})( jQuery );
(function( $, undefined ) {
$.widget( "mobile.controlgroup", $.extend( {
options: {
enhanced: false,
theme: null,
shadow: false,
corners: true,
excludeInvisible: true,
type: "vertical",
mini: false
},
_create: function() {
var elem = this.element,
opts = this.options;
// Run buttonmarkup
if ( $.fn.buttonMarkup ) {
this.element.find( $.fn.buttonMarkup.initSelector ).buttonMarkup();
}
// Enhance child widgets
$.each( this._childWidgets, $.proxy( function( number, widgetName ) {
if ( $.mobile[ widgetName ] ) {
this.element.find( $.mobile[ widgetName ].initSelector ).not( $.mobile.page.prototype.keepNativeSelector() )[ widgetName ]();
}
}, this ));
$.extend( this, {
_ui: null,
_initialRefresh: true
});
if ( opts.enhanced ) {
this._ui = {
groupLegend: elem.children( ".ui-controlgroup-label" ).children(),
childWrapper: elem.children( ".ui-controlgroup-controls" )
};
} else {
this._ui = this._enhance();
}
},
_childWidgets: [ "checkboxradio", "selectmenu", "button" ],
_themeClassFromOption: function( value ) {
return ( value ? ( value === "none" ? "" : "ui-group-theme-" + value ) : "" );
},
_enhance: function() {
var elem = this.element,
opts = this.options,
ui = {
groupLegend: elem.children( "legend" ),
childWrapper: elem
.addClass( "ui-controlgroup " +
"ui-controlgroup-" +
( opts.type === "horizontal" ? "horizontal" : "vertical" ) + " " +
this._themeClassFromOption( opts.theme ) + " " +
( opts.corners ? "ui-corner-all " : "" ) +
( opts.mini ? "ui-mini " : "" ) )
.wrapInner( "" )
.children()
};
if ( ui.groupLegend.length > 0 ) {
$( "" )
.append( ui.groupLegend )
.prependTo( elem );
}
return ui;
},
_init: function() {
this.refresh();
},
_setOptions: function( options ) {
var callRefresh, returnValue,
elem = this.element;
// Must have one of horizontal or vertical
if ( options.type !== undefined ) {
elem
.removeClass( "ui-controlgroup-horizontal ui-controlgroup-vertical" )
.addClass( "ui-controlgroup-" + ( options.type === "horizontal" ? "horizontal" : "vertical" ) );
callRefresh = true;
}
if ( options.theme !== undefined ) {
elem
.removeClass( this._themeClassFromOption( this.options.theme ) )
.addClass( this._themeClassFromOption( options.theme ) );
}
if ( options.corners !== undefined ) {
elem.toggleClass( "ui-corner-all", options.corners );
}
if ( options.mini !== undefined ) {
elem.toggleClass( "ui-mini", options.mini );
}
if ( options.shadow !== undefined ) {
this._ui.childWrapper.toggleClass( "ui-shadow", options.shadow );
}
if ( options.excludeInvisible !== undefined ) {
this.options.excludeInvisible = options.excludeInvisible;
callRefresh = true;
}
returnValue = this._super( options );
if ( callRefresh ) {
this.refresh();
}
return returnValue;
},
container: function() {
return this._ui.childWrapper;
},
refresh: function() {
var $el = this.container(),
els = $el.find( ".ui-btn" ).not( ".ui-slider-handle" ),
create = this._initialRefresh;
if ( $.mobile.checkboxradio ) {
$el.find( ":mobile-checkboxradio" ).checkboxradio( "refresh" );
}
this._addFirstLastClasses( els,
this.options.excludeInvisible ? this._getVisibles( els, create ) : els,
create );
this._initialRefresh = false;
},
// Caveat: If the legend is not the first child of the controlgroup at enhance
// time, it will be after _destroy().
_destroy: function() {
var ui, buttons,
opts = this.options;
if ( opts.enhanced ) {
return this;
}
ui = this._ui;
buttons = this.element
.removeClass( "ui-controlgroup " +
"ui-controlgroup-horizontal ui-controlgroup-vertical ui-corner-all ui-mini " +
this._themeClassFromOption( opts.theme ) )
.find( ".ui-btn" )
.not( ".ui-slider-handle" );
this._removeFirstLastClasses( buttons );
ui.groupLegend.unwrap();
ui.childWrapper.children().unwrap();
}
}, $.mobile.behaviors.addFirstLastClasses ) );
})(jQuery);
(function( $, undefined ) {
$.widget( "mobile.button", {
initSelector: "input[type='button'], input[type='submit'], input[type='reset']",
options: {
theme: null,
icon: null,
iconpos: "left",
iconshadow: false, /* TODO: Deprecated in 1.4, remove in 1.5. */
corners: true,
shadow: true,
inline: null,
mini: null,
wrapperClass: null,
enhanced: false
},
_create: function() {
if ( this.element.is( ":disabled" ) ) {
this.options.disabled = true;
}
if ( !this.options.enhanced ) {
this._enhance();
}
$.extend( this, {
wrapper: this.element.parent()
});
this._on( {
focus: function() {
this.widget().addClass( $.mobile.focusClass );
},
blur: function() {
this.widget().removeClass( $.mobile.focusClass );
}
});
this.refresh( true );
},
_enhance: function() {
this.element.wrap( this._button() );
},
_button: function() {
var options = this.options,
iconClasses = this._getIconClasses( this.options );
return $("" + this.element.val() + "
" );
},
widget: function() {
return this.wrapper;
},
_destroy: function() {
this.element.insertBefore( this.button );
this.button.remove();
},
_getIconClasses: function( options ) {
return ( options.icon ? ( "ui-icon-" + options.icon +
( options.iconshadow ? " ui-shadow-icon" : "" ) + /* TODO: Deprecated in 1.4, remove in 1.5. */
" ui-btn-icon-" + options.iconpos ) : "" );
},
_setOptions: function( options ) {
var outer = this.widget();
if ( options.theme !== undefined ) {
outer
.removeClass( this.options.theme )
.addClass( "ui-btn-" + options.theme );
}
if ( options.corners !== undefined ) {
outer.toggleClass( "ui-corner-all", options.corners );
}
if ( options.shadow !== undefined ) {
outer.toggleClass( "ui-shadow", options.shadow );
}
if ( options.inline !== undefined ) {
outer.toggleClass( "ui-btn-inline", options.inline );
}
if ( options.mini !== undefined ) {
outer.toggleClass( "ui-mini", options.mini );
}
if ( options.disabled !== undefined ) {
this.element.prop( "disabled", options.disabled );
outer.toggleClass( "ui-state-disabled", options.disabled );
}
if ( options.icon !== undefined ||
options.iconshadow !== undefined || /* TODO: Deprecated in 1.4, remove in 1.5. */
options.iconpos !== undefined ) {
outer
.removeClass( this._getIconClasses( this.options ) )
.addClass( this._getIconClasses(
$.extend( {}, this.options, options ) ) );
}
this._super( options );
},
refresh: function( create ) {
var originalElement,
isDisabled = this.element.prop( "disabled" );
if ( this.options.icon && this.options.iconpos === "notext" && this.element.attr( "title" ) ) {
this.element.attr( "title", this.element.val() );
}
if ( !create ) {
originalElement = this.element.detach();
$( this.wrapper ).text( this.element.val() ).append( originalElement );
}
if ( this.options.disabled !== isDisabled ) {
this._setOptions({ disabled: isDisabled });
}
}
});
})( jQuery );
(function( $, undefined ) {
$.mobile.behaviors.formReset = {
_handleFormReset: function() {
this._on( this.element.closest( "form" ), {
reset: function() {
this._delay( "_reset" );
}
});
}
};
})( jQuery );
/*
* "checkboxradio" plugin
*/
(function( $, undefined ) {
var escapeId = $.mobile.path.hashToSelector;
$.widget( "mobile.checkboxradio", $.extend( {
initSelector: "input:not( :jqmData(role='flipswitch' ) )[type='checkbox']:not('.switch'),input[type='radio']:not( :jqmData(role='flipswitch' ))",
options: {
theme: "inherit",
mini: false,
wrapperClass: null,
enhanced: false,
iconpos: "left"
},
_create: function() {
var input = this.element,
o = this.options,
inheritAttr = function( input, dataAttr ) {
return input.jqmData( dataAttr ) ||
input.closest( "form, fieldset" ).jqmData( dataAttr );
},
// NOTE: Windows Phone could not find the label through a selector
// filter works though.
parentLabel = input.closest( "label" ),
label = parentLabel.length ? parentLabel :
input
.closest( "form, fieldset, :jqmData(role='page'), :jqmData(role='dialog')" )
.find( "label" )
.filter( "[for='" + escapeId( input[0].id ) + "']" )
.first(),
inputtype = input[0].type,
checkedClass = "ui-" + inputtype + "-on",
uncheckedClass = "ui-" + inputtype + "-off";
if ( inputtype !== "checkbox" && inputtype !== "radio" ) {
return;
}
if ( this.element[0].disabled ) {
this.options.disabled = true;
}
o.iconpos = inheritAttr( input, "iconpos" ) || label.attr( "data-" + $.mobile.ns + "iconpos" ) || o.iconpos,
// Establish options
o.mini = inheritAttr( input, "mini" ) || o.mini;
// Expose for other methods
$.extend( this, {
input: input,
label: label,
parentLabel: parentLabel,
inputtype: inputtype,
checkedClass: checkedClass,
uncheckedClass: uncheckedClass
});
if ( !this.options.enhanced ) {
this._enhance();
}
this._on( label, {
vmouseover: "_handleLabelVMouseOver",
vclick: "_handleLabelVClick"
});
this._on( input, {
vmousedown: "_cacheVals",
vclick: "_handleInputVClick",
focus: "_handleInputFocus",
blur: "_handleInputBlur"
});
this._handleFormReset();
this.refresh();
},
_enhance: function() {
this.label.addClass( "ui-btn ui-corner-all");
if ( this.parentLabel.length > 0 ) {
this.input.add( this.label ).wrapAll( this._wrapper() );
} else {
//this.element.replaceWith( this.input.add( this.label ).wrapAll( this._wrapper() ) );
this.element.wrap( this._wrapper() );
this.element.parent().prepend( this.label );
}
// Wrap the input + label in a div
this._setOptions({
"theme": this.options.theme,
"iconpos": this.options.iconpos,
"mini": this.options.mini
});
},
_wrapper: function() {
return $( "" );
},
_handleInputFocus: function() {
this.label.addClass( $.mobile.focusClass );
},
_handleInputBlur: function() {
this.label.removeClass( $.mobile.focusClass );
},
_handleInputVClick: function() {
// Adds checked attribute to checked input when keyboard is used
this.element.prop( "checked", this.element.is( ":checked" ) );
this._getInputSet().not( this.element ).prop( "checked", false );
this._updateAll();
},
_handleLabelVMouseOver: function( event ) {
if ( this.label.parent().hasClass( "ui-state-disabled" ) ) {
event.stopPropagation();
}
},
_handleLabelVClick: function( event ) {
var input = this.element;
if ( input.is( ":disabled" ) ) {
event.preventDefault();
return;
}
this._cacheVals();
input.prop( "checked", this.inputtype === "radio" && true || !input.prop( "checked" ) );
// trigger click handler's bound directly to the input as a substitute for
// how label clicks behave normally in the browsers
// TODO: it would be nice to let the browser's handle the clicks and pass them
// through to the associate input. we can swallow that click at the parent
// wrapper element level
input.triggerHandler( "click" );
// Input set for common radio buttons will contain all the radio
// buttons, but will not for checkboxes. clearing the checked status
// of other radios ensures the active button state is applied properly
this._getInputSet().not( input ).prop( "checked", false );
this._updateAll();
return false;
},
_cacheVals: function() {
this._getInputSet().each( function() {
$( this ).attr("data-" + $.mobile.ns + "cacheVal", this.checked );
});
},
// Returns those radio buttons that are supposed to be in the same group as
// this radio button. In the case of a checkbox or a radio lacking a name
// attribute, it returns this.element.
_getInputSet: function() {
var selector, formId,
radio = this.element[ 0 ],
name = radio.name,
form = radio.form,
doc = this.element.parents().last().get( 0 ),
// A radio is always a member of its own group
radios = this.element;
// Only start running selectors if this is an attached radio button with a name
if ( name && this.inputtype === "radio" && doc ) {
selector = "input[type='radio'][name='" + escapeId( name ) + "']";
// If we're inside a form
if ( form ) {
formId = form.id;
// If the form has an ID, collect radios scattered throught the document which
// nevertheless are part of the form by way of the value of their form attribute
if ( formId ) {
radios = $( selector + "[form='" + escapeId( formId ) + "']", doc );
}
// Also add to those the radios in the form itself
radios = $( form ).find( selector ).filter( function() {
// Some radios inside the form may belong to some other form by virtue of
// having a form attribute defined on them, so we must filter them out here
return ( this.form === form );
}).add( radios );
// If we're outside a form
} else {
// Collect all those radios which are also outside of a form and match our name
radios = $( selector, doc ).filter( function() {
return !this.form;
});
}
}
return radios;
},
_updateAll: function() {
var self = this;
this._getInputSet().each( function() {
var $this = $( this );
if ( this.checked || self.inputtype === "checkbox" ) {
$this.trigger( "change" );
}
})
.checkboxradio( "refresh" );
},
_reset: function() {
this.refresh();
},
// Is the widget supposed to display an icon?
_hasIcon: function() {
var controlgroup, controlgroupWidget,
controlgroupConstructor = $.mobile.controlgroup;
// If the controlgroup widget is defined ...
if ( controlgroupConstructor ) {
controlgroup = this.element.closest(
":mobile-controlgroup," +
controlgroupConstructor.prototype.initSelector );
// ... and the checkbox is in a controlgroup ...
if ( controlgroup.length > 0 ) {
// ... look for a controlgroup widget instance, and ...
controlgroupWidget = $.data( controlgroup[ 0 ], "mobile-controlgroup" );
// ... if found, decide based on the option value, ...
return ( ( controlgroupWidget ? controlgroupWidget.options.type :
// ... otherwise decide based on the "type" data attribute.
controlgroup.attr( "data-" + $.mobile.ns + "type" ) ) !== "horizontal" );
}
}
// Normally, the widget displays an icon.
return true;
},
refresh: function() {
var hasIcon = this._hasIcon(),
isChecked = this.element[ 0 ].checked,
active = $.mobile.activeBtnClass,
iconposClass = "ui-btn-icon-" + this.options.iconpos,
addClasses = [],
removeClasses = [];
if ( hasIcon ) {
removeClasses.push( active );
addClasses.push( iconposClass );
} else {
removeClasses.push( iconposClass );
( isChecked ? addClasses : removeClasses ).push( active );
}
if ( isChecked ) {
addClasses.push( this.checkedClass );
removeClasses.push( this.uncheckedClass );
} else {
addClasses.push( this.uncheckedClass );
removeClasses.push( this.checkedClass );
}
this.label
.addClass( addClasses.join( " " ) )
.removeClass( removeClasses.join( " " ) );
},
widget: function() {
return this.label.parent();
},
_setOptions: function( options ) {
var label = this.label,
currentOptions = this.options,
outer = this.widget(),
hasIcon = this._hasIcon();
if ( options.disabled !== undefined ) {
this.input.prop( "disabled", !!options.disabled );
outer.toggleClass( "ui-state-disabled", !!options.disabled );
}
if ( options.mini !== undefined ) {
outer.toggleClass( "ui-mini", !!options.mini );
}
if ( options.theme !== undefined ) {
label
.removeClass( "ui-btn-" + currentOptions.theme )
.addClass( "ui-btn-" + options.theme );
}
if ( options.wrapperClass !== undefined ) {
outer
.removeClass( currentOptions.wrapperClass )
.addClass( options.wrapperClass );
}
if ( options.iconpos !== undefined && hasIcon ) {
label.removeClass( "ui-btn-icon-" + currentOptions.iconpos ).addClass( "ui-btn-icon-" + options.iconpos );
} else if ( !hasIcon ) {
label.removeClass( "ui-btn-icon-" + currentOptions.iconpos );
}
this._super( options );
}
}, $.mobile.behaviors.formReset ) );
})( jQuery );
(function( $, undefined ) {
var getAttr = $.mobile.getAttribute;
$.widget( "mobile.listview", $.extend( {
options: {
theme: null,
countTheme: null, /* Deprecated in 1.4 */
dividerTheme: null,
icon: "carat-r",
splitIcon: "carat-r",
splitTheme: null,
corners: true,
shadow: true,
inset: false
},
_create: function() {
var t = this,
listviewClasses = "";
listviewClasses += t.options.inset ? " ui-listview-inset" : "";
if ( !!t.options.inset ) {
listviewClasses += t.options.corners ? " ui-corner-all" : "";
listviewClasses += t.options.shadow ? " ui-shadow" : "";
}
// create listview markup
t.element.addClass( " ui-listview" + listviewClasses );
t.refresh( true );
},
// TODO: Remove in 1.5
_findFirstElementByTagName: function( ele, nextProp, lcName, ucName ) {
var dict = {};
dict[ lcName ] = dict[ ucName ] = true;
while ( ele ) {
if ( dict[ ele.nodeName ] ) {
return ele;
}
ele = ele[ nextProp ];
}
return null;
},
// TODO: Remove in 1.5
_addThumbClasses: function( containers ) {
var i, img, len = containers.length;
for ( i = 0; i < len; i++ ) {
img = $( this._findFirstElementByTagName( containers[ i ].firstChild, "nextSibling", "img", "IMG" ) );
if ( img.length ) {
$( this._findFirstElementByTagName( img[ 0 ].parentNode, "parentNode", "li", "LI" ) ).addClass( img.hasClass( "ui-li-icon" ) ? "ui-li-has-icon" : "ui-li-has-thumb" );
}
}
},
_getChildrenByTagName: function( ele, lcName, ucName ) {
var results = [],
dict = {};
dict[ lcName ] = dict[ ucName ] = true;
ele = ele.firstChild;
while ( ele ) {
if ( dict[ ele.nodeName ] ) {
results.push( ele );
}
ele = ele.nextSibling;
}
return $( results );
},
_beforeListviewRefresh: $.noop,
_afterListviewRefresh: $.noop,
refresh: function( create ) {
var buttonClass, pos, numli, item, itemClass, itemTheme, itemIcon, icon, a,
isDivider, startCount, newStartCount, value, last, splittheme, splitThemeClass, spliticon,
altButtonClass, dividerTheme, li,
o = this.options,
$list = this.element,
ol = !!$.nodeName( $list[ 0 ], "ol" ),
start = $list.attr( "start" ),
itemClassDict = {},
countBubbles = $list.find( ".ui-li-count" ),
countTheme = getAttr( $list[ 0 ], "counttheme" ) || this.options.countTheme,
countThemeClass = countTheme ? "ui-body-" + countTheme : "ui-body-inherit";
if ( o.theme ) {
$list.addClass( "ui-group-theme-" + o.theme );
}
// Check if a start attribute has been set while taking a value of 0 into account
if ( ol && ( start || start === 0 ) ) {
startCount = parseInt( start, 10 ) - 1;
$list.css( "counter-reset", "listnumbering " + startCount );
}
this._beforeListviewRefresh();
li = this._getChildrenByTagName( $list[ 0 ], "li", "LI" );
for ( pos = 0, numli = li.length; pos < numli; pos++ ) {
item = li.eq( pos );
itemClass = "";
if ( create || item[ 0 ].className.search( /\bui-li-static\b|\bui-li-divider\b/ ) < 0 ) {
a = this._getChildrenByTagName( item[ 0 ], "a", "A" );
isDivider = ( getAttr( item[ 0 ], "role" ) === "list-divider" );
value = item.attr( "value" );
itemTheme = getAttr( item[ 0 ], "theme" );
if ( a.length && a[ 0 ].className.search( /\bui-btn\b/ ) < 0 && !isDivider ) {
itemIcon = getAttr( item[ 0 ], "icon" );
icon = ( itemIcon === false ) ? false : ( itemIcon || o.icon );
// TODO: Remove in 1.5 together with links.js (links.js / .ui-link deprecated in 1.4)
a.removeClass( "ui-link" );
buttonClass = "ui-btn";
if ( itemTheme ) {
buttonClass += " ui-btn-" + itemTheme;
}
if ( a.length > 1 ) {
itemClass = "ui-li-has-alt";
last = a.last();
splittheme = getAttr( last[ 0 ], "theme" ) || o.splitTheme || getAttr( item[ 0 ], "theme", true );
splitThemeClass = splittheme ? " ui-btn-" + splittheme : "";
spliticon = getAttr( last[ 0 ], "icon" ) || getAttr( item[ 0 ], "icon" ) || o.splitIcon;
altButtonClass = "ui-btn ui-btn-icon-notext ui-icon-" + spliticon + splitThemeClass;
last
.attr( "title", $.trim( last.getEncodedText() ) )
.addClass( altButtonClass )
.empty();
} else if ( icon ) {
buttonClass += " ui-btn-icon-right ui-icon-" + icon;
}
a.first().addClass( buttonClass );
} else if ( isDivider ) {
dividerTheme = ( getAttr( item[ 0 ], "theme" ) || o.dividerTheme || o.theme );
itemClass = "ui-li-divider ui-bar-" + ( dividerTheme ? dividerTheme : "inherit" );
item.attr( "role", "heading" );
} else if ( a.length <= 0 ) {
itemClass = "ui-li-static ui-body-" + ( itemTheme ? itemTheme : "inherit" );
}
if ( ol && value ) {
newStartCount = parseInt( value , 10 ) - 1;
item.css( "counter-reset", "listnumbering " + newStartCount );
}
}
// Instead of setting item class directly on the list item
// at this point in time, push the item into a dictionary
// that tells us what class to set on it so we can do this after this
// processing loop is finished.
if ( !itemClassDict[ itemClass ] ) {
itemClassDict[ itemClass ] = [];
}
itemClassDict[ itemClass ].push( item[ 0 ] );
}
// Set the appropriate listview item classes on each list item.
// The main reason we didn't do this
// in the for-loop above is because we can eliminate per-item function overhead
// by calling addClass() and children() once or twice afterwards. This
// can give us a significant boost on platforms like WP7.5.
for ( itemClass in itemClassDict ) {
$( itemClassDict[ itemClass ] ).addClass( itemClass );
}
countBubbles.each( function() {
$( this ).closest( "li" ).addClass( "ui-li-has-count" );
});
if ( countThemeClass ) {
countBubbles.addClass( countThemeClass );
}
// Deprecated in 1.4. From 1.5 you have to add class ui-li-has-thumb or ui-li-has-icon to the LI.
this._addThumbClasses( li );
this._addThumbClasses( li.find( ".ui-btn" ) );
this._afterListviewRefresh();
this._addFirstLastClasses( li, this._getVisibles( li, create ), create );
}
}, $.mobile.behaviors.addFirstLastClasses ) );
})( jQuery );
}));
}