" )
.appendTo( $body )
.load( url + " .ui-page", function() {
// TODO: test this (avoids querying the dom for new element):
// var newPage = $( this ).find( ".ui-page" ).eq( 0 )
// .attr( "id", url );
// $( this ).replaceWith( newPage );
// setPageRole( newPage );
// mobilize( newPage );
// changePage( $( ".ui-page-active" ), newPage, transition, back );
$( this ).replaceWith(
$( this ).find( ".ui-page" ).eq( 0 ).attr( "id", url ) );
var newPage = $( "[id='" + url + "']" );
setPageRole( newPage );
mobilize( newPage );
changePage( $( ".ui-page-active" ), newPage, transition, back );
});
}
} else {
// either we've backed up to the root page url
// or it's the first page load with no hash present
var currentPage = $( ".ui-page-active" );
if ( currentPage.length && !startPage.is( ".ui-page-active" ) ) {
changePage( currentPage, startPage, transition, back );
} else {
$.fixedToolbars.show();
startPage.addClass( activePageClass );
pageLoading( true );
}
}
});
hideBrowserChrome();
});
//add orientation class on flip/resize.
$window.bind( "orientationchange", function( event, data ) {
$html.removeClass( "portrait landscape" ).addClass( data.orientation );
});
//add mobile, loading classes to doc
$html.addClass('ui-mobile');
//insert mobile meta (any other metas needed? webapp? iPhone icon? etc)
$head.append('
');
//potential (probably incomplete) fallback to workaround lack of animation callbacks.
//should this be extended into a full special event?
// note: Expects CSS animations use transitionDuration (350ms)
$.fn.animationComplete = function(callback){
if($.support.WebKitAnimationEvent){
return $(this).one('webkitAnimationEnd', callback); //check out transitionEnd (opera per Paul's request)
}
else{
setTimeout(callback, transitionDuration);
}
};
//markup-driven enhancements, to be called on any ui-page upon loading
function mobilize($el){
//to-do: make sure this only runs one time on a page (or maybe per component)
return $el.each(function(){
//dialog
$el.filter('[data-role="dialog"]').dialog();
//checkboxes, radios
$el.find('input[type=radio],input[type=checkbox]').customCheckboxRadio();
//custom buttons
$el.find('button, input[type=submit]').customButton();
//custom text inputs
$el.find('input[type=text],input[type=password],textarea').customTextInput();
//collapsible groupings
$el.find('[data-role="collapsible"]').collapsible();
//single-field separators
$el.find('.field').fieldcontain();
//selects
$el.find('select').customSelect();
//fix toolbars
$el.fixHeaderFooter();
//buttons from links in headers,footers,bars, or with data-role
$el.find('.ui-header a, .ui-footer a, .ui-bar a, [data-role="button"]').not('.ui-btn').buttonMarkup();
//vertical controlgroups
$el.find('[data-role="controlgroup"]:not([data-type="horizontal"])').controlgroup();
//horizontal controlgroups
$el.find('[data-role="controlgroup"][data-type="horizontal"]').controlgroup({direction: 'horizontal'});
//listview from data role
$el.find('[data-role="listview"]').listview();
//links within content areas
$el.find('.ui-body a:not(.ui-btn):not(.ui-link-inherit)').addClass('ui-link');
//rewrite "home" links to mimic the back button (pre-js, these links are usually "home" links)
var backBtn = $el.find('.ui-header a.ui-back');
if(!backBtn.length){
backBtn = $('
').appendTo($el.find('.ui-header')).buttonMarkup();
}
backBtn
.click(function(){
history.go(-1);
return false;
})
.find('.ui-btn-text').text(backBtnText);
});
};
//dom-ready
$(function(){
//global nav
$('[data-role="globalnav"]').globalnav();
//mobilize all pages present
mobilize($('.ui-page'));
//set up active page - mobilize it!
startPage = $('body > .ui-page:first');
//make sure it has an ID - for finding it later
if(!startPage.attr('id')){
startPage.attr('id', startPageId);
}
//trigger a new hashchange, hash or not
$window.trigger( "hashchange" );
//update orientation
$html.addClass( $.event.special.orientationchange.orientation( $window ) );
//swipe right always triggers a back
$body.bind('swiperight.jqm',function(){
history.go(-1);
return false;
});
//some debug stuff for the events pages
$('body').bind('scrollstart scrollstop swipe swipeleft swiperight tap taphold turn',function(e){
$('#eventlogger').prepend('
Event fired: '+ e.type +'
');
});
});
})( jQuery, this );