Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-04-21 06:40:59 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Added support for nested urls through the following additions:

Browse source 
1. added the $.mobile object, for storing public options used in core and other plugins that should be made configurable externally, somehow.

2. With this change comes the first property $.mobile: subPageUrlKey, which defaults to "ui-page" and becomes the URL parameter for denoting a generated sub-page of a particular URL. For example, you can now deep-link to sub-levels of a nested listview like this:
jquerymobile.com/test/#_listview.html&ui-page=listview-2

...in which "listview-2" refers to a generated page created by _listview.html when mobilize() runs on it.

Note that this &ui-page parameter is used for splitting the hash to find the right part to use for the ajax request for the real url (_listview.html), while the ID of the actual subpage div really uses the whole thing: "_listview.html&ui-page=listview-2".

The other idea is that after the "&ui-page=" part, plugins should use an ID that reflects their widget name. For example, &ui-page=listview-2 or &ui-page=globalnav.

Before this change, subpages would use the whole hash without mentioning their parent page url, so you'd end up with blank pages if you hit refresh while viewing a generated sub-page.
This commit is contained in:
scottjehl 2010-09-20 18:21:53 -04:00
parent 2484c41900
commit af585dc8c7
1 changed files with 17 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
js/jQuery.mobile.js
View file

@ -11,6 +11,14 @@
if ( !jQuery.support.display || !jQuery.support.position || !jQuery.support.overflow || !jQuery.support.floatclear ) {
return;
}
//these properties should be made easy to override externally
jQuery.mobile = {};
jQuery.extend(jQuery.mobile, {
subPageUrlKey: 'ui-page' //define the key used in urls for sub-pages. Defaults to &ui-page=
});
jQuery.mobile.subPageUrlKey = 'ui-page';
var $window = jQuery(window),
$html = jQuery('html'),
@ -125,7 +133,8 @@
// pageTransition only exists if the user clicked a link
back = !pageTransition && stackLength > 1 &&
urlStack[ stackLength - 2 ].url === url,
transition = pageTransition || "slide";
transition = pageTransition || "slide",
fileUrl = url;
pageTransition = undefined;
// if the new href is the same as the previous one
@ -157,9 +166,12 @@
changePage( jQuery( ".ui-page-active" ), localDiv, transition, back );
} else { //ajax it in
pageLoading();
if(url.match( '&' + jQuery.mobile.subPageUrlKey )){
fileUrl = url.split( '&' + jQuery.mobile.subPageUrlKey )[0];
}
var newPage = jQuery( "<div>" )
.appendTo( $body )
.load( url + ' [data-role="page"]', function() {
.load( fileUrl + ' [data-role="page"]', function() {
// TODO: test this (avoids querying the dom for new element):
// var newPage = jQuery( this ).find( ".ui-page" ).eq( 0 )
// .attr( "id", url );
@ -168,10 +180,11 @@
// mobilize( newPage );
// changePage( jQuery( ".ui-page-active" ), newPage, transition, back );
jQuery( this ).replaceWith(
jQuery( this ).find( '[data-role="page"]' ).eq( 0 ).attr( "id", url ) );
var newPage = jQuery( "[id='" + url + "']" );
jQuery( this ).find( '[data-role="page"]' ).eq( 0 ).attr( "id", fileUrl ) );
var newPage = jQuery( "[id='" + fileUrl + "']" );
setPageRole( newPage );
mobilize( newPage );
newPage = jQuery( "[id='" + url + "']" );
changePage( jQuery( ".ui-page-active" ), newPage, transition, back );
});
}