compass-jquery-plugin 0.3.0.beta.24 → 0.3.0.beta.25

data/templates/mobile/jquery.mobile.js

@@ -336,7 +336,7 @@ function baseTagTest(){
 $.extend( $.support, {
 	orientation: "orientation" in window,
 	touch: "ontouchend" in document,
-	WebKitAnimationEvent: typeof WebKitTransitionEvent === "object",
+	cssTransitions: "WebKitTransitionEvent" in window,
 	pushState: !!history.pushState,
 	mediaquery: $.media('only all'),
 	cssPseudoElement: !!propExists('content'),
@@ -418,11 +418,15 @@ $.event.special.tap = {
 				
 				var moved = false,
 					touching = true,
+					origPos = [ event.pageX, event.pageY ],
 					originalType,
 					timer;
 				
 				function moveHandler() {
-					moved = true;
+					if ((Math.abs(origPos[0] - event.pageX) > 10) ||
+					    (Math.abs(origPos[1] - event.pageY) > 10)) {
+					    moved = true;
+					}
 				}
 				
 				timer = setTimeout(function() {
@@ -508,34 +512,71 @@ $.event.special.swipe = {
 	}
 };
 
-$.event.special.orientationchange = {
-	orientation: function( elem ) {
-		return document.body && elem.width() / elem.height() < 1.1 ? "portrait" : "landscape";
-	},
+(function(jQuery){
+	// "Cowboy" Ben Alman
 	
-	setup: function() {
-		var thisObject = this,
-			$this = $( thisObject ),
-			orientation = $.event.special.orientationchange.orientation( $this );
-
-		function handler() {
-			var newOrientation = $.event.special.orientationchange.orientation( $this );
+	var win = jQuery(window),
+		special_event,
+		get_orientation,
+		last_orientation;
+	
+	jQuery.event.special.orientationchange = special_event = {
+		setup: function(){
+			// If the event is supported natively, return false so that jQuery
+			// will bind to the event using DOM methods.
+			if ( jQuery.support.orientation ) { return false; }
 			
-			if ( orientation !== newOrientation ) {
-				$.event.handle.call( thisObject, "orientationchange", {
-					orientation: newOrientation
-				} );
-				orientation = newOrientation;
-			}
+			// Get the current orientation to avoid initial double-triggering.
+			last_orientation = get_orientation();
+			
+			// Because the orientationchange event doesn't exist, simulate the
+			// event by testing window dimensions on resize.
+			win.bind( "resize", handler );
+		},
+		teardown: function(){
+			// If the event is not supported natively, return false so that
+			// jQuery will unbind the event using DOM methods.
+			if ( jQuery.support.orientation ) { return false; }
+			
+			// Because the orientationchange event doesn't exist, unbind the
+			// resize event handler.
+			win.unbind( "resize", handler );
+		},
+		add: function( handleObj ) {
+			// Save a reference to the bound event handler.
+			var old_handler = handleObj.handler;
+			
+			handleObj.handler = function( event ) {
+				// Modify event object, adding the .orientation property.
+				event.orientation = get_orientation();
+				
+				// Call the originally-bound event handler and return its result.
+				return old_handler.apply( this, arguments );
+			};
 		}
-
-		if ( $.support.orientation ) {
-			thisObject.addEventListener( "orientationchange", handler, false );
-		} else {
-			$this.bind( "resize", handler );
+	};
+	
+	// If the event is not supported natively, this handler will be bound to
+	// the window resize event to simulate the orientationchange event.
+	function handler() {
+		// Get the current orientation.
+		var orientation = get_orientation();
+		
+		if ( orientation !== last_orientation ) {
+			// The orientation has changed, so trigger the orientationchange event.
+			last_orientation = orientation;
+			win.trigger( "orientationchange" );
 		}
-	}
-};
+	};
+	
+	// Get the current page orientation. This method is exposed publicly, should it
+	// be needed, as jQuery.event.special.orientationchange.orientation()
+	special_event.orientation = get_orientation = function() {
+		var elem = document.documentElement;
+		return elem && elem.clientWidth / elem.clientHeight < 1.1 ? "portrait" : "landscape";
+	};
+	
+})(jQuery);
 
 $.each({
 	scrollstop: "scrollstart",
@@ -552,6 +593,7 @@ $.each({
 
 })( jQuery );
 
+
 /*!
  * jQuery hashchange event - v1.3 - 7/21/2010
  * http://benalman.com/projects/jquery-hashchange-plugin/
@@ -947,10 +989,29 @@ $.each({
 (function ( jQuery ) {
 
 jQuery.widget( "mobile.page", jQuery.mobile.widget, {
-	options: {},
+	options: {
+		backBtnText: "Back",
+		addBackBtn: true,
+		degradeInputs: {
+			color: true,
+			date: true,
+			datetime: true,
+			"datetime-local": true,
+			email: true,
+			month: true,
+			number: true,
+			range: true,
+			search: true,
+			tel: true,
+			time: true,
+			url: true,
+			week: true
+		}
+	},
 	
 	_create: function() {
-		var $elem = this.element;
+		var $elem = this.element,
+			o = this.options;
 
 		if ( this._trigger( "beforeCreate" ) === false ) {
 			return;
@@ -994,11 +1055,11 @@ jQuery.widget( "mobile.page", jQuery.mobile.widget, {
 				}
 				
 				// auto-add back btn on pages beyond first view
-				if ( jQuery.mobile.addBackBtn && role === "header" &&
+				if ( o.addBackBtn && role === "header" &&
 						(jQuery.mobile.urlStack.length > 1 || jQuery(".ui-page").length > 1) &&
 						!leftbtn && !$this.data( "noBackBtn" ) ) {
 
-					jQuery( "<a href='#' class='ui-btn-left' data-icon='arrow-l'>Back</a>" )
+					jQuery( "<a href='#' class='ui-btn-left' data-icon='arrow-l'>"+ o.backBtnText +"</a>" )
 						.click(function() {
 							history.back();
 							return false;
@@ -1059,10 +1120,11 @@ jQuery.widget( "mobile.page", jQuery.mobile.widget, {
 	},
 	
 	_enchanceControls: function() {
+		var o = this.options;
 		// degrade inputs to avoid poorly implemented native functionality
 		this.element.find( "input" ).each(function() {
 			var type = this.getAttribute( "type" );
-			if ( jQuery.mobile.degradeInputs[ type ] ) {
+			if ( o.degradeInputs[ type ] ) {
 				jQuery( this ).replaceWith(
 					jQuery( "<div>" ).html( jQuery(this).clone() ).html()
 						.replace( /type="([a-zA-Z]+)"/, "data-type='$1'" ) );
@@ -1082,7 +1144,7 @@ jQuery.widget( "mobile.page", jQuery.mobile.widget, {
 		this.element
 			.find( "input, textarea" )
 			.not( "[type='radio'], [type='checkbox'], button, [type='button'], [type='submit'], [type='reset'], [type='image']" )
-			.customTextInput();
+			.textinput();
 
 		this.element
 			.find( "input, select" )
@@ -1120,7 +1182,7 @@ $.fixedToolbars = (function(){
 	var currentstate = 'inline',
 		delayTimer,
 		ignoreTargets = 'a,input,textarea,select,button,label,.ui-header-fixed,.ui-footer-fixed',
-		toolbarSelector = '.ui-page-active .ui-header-fixed:first, .ui-page-active .ui-footer-fixed:not(.ui-footer-duplicate):last',
+		toolbarSelector = '.ui-header-fixed:first, .ui-footer-fixed:not(.ui-footer-duplicate):last',
 		stickyFooter, //for storing quick references to duplicate footers
 		supportTouch = $.support.touch,
 		touchStartEvent = supportTouch ? "touchstart" : "mousedown",
@@ -1209,7 +1271,8 @@ $.fixedToolbars = (function(){
 	return {
 		show: function(immediately){
 			currentstate = 'overlay';
-			return $( toolbarSelector ).each(function(){
+			var $ap = $.activePage ? $.activePage : $(".ui-page-active");
+			return $ap.children( toolbarSelector ).each(function(){
 				var el = $(this),
 					fromTop = $(window).scrollTop(),
 					thisTop = el.offset().top,
@@ -1230,7 +1293,8 @@ $.fixedToolbars = (function(){
 		},
 		hide: function(immediately){
 			currentstate = 'inline';
-			return $( toolbarSelector ).each(function(){
+			var $ap = $.activePage ? $.activePage : $(".ui-page-active");
+			return $ap.children( toolbarSelector ).each(function(){
 				var el = $(this);
 				
 				//add state class
@@ -1376,20 +1440,30 @@ $.widget( "mobile.checkboxradio", $.mobile.widget, {
 
 
 /*
-* jQuery Mobile Framework : "customTextInput" plugin for text inputs, textareas (based on code from Filament Group,Inc)
+* jQuery Mobile Framework : "textinput" plugin for text inputs, textareas (based on code from Filament Group,Inc)
 * Copyright (c) jQuery Project
 * Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
 * Note: Code is in draft form and is subject to change 
 */
-(function($){
-jQuery.fn.customTextInput = function(options){
-	return $(this).each(function(){	
-		var input = $(this);
+(function ( $ ) {
+$.widget( "mobile.textinput", $.mobile.widget, {
+	options: {
+		theme: undefined
+	},
+	_create: function(){
+		var input = this.element,
+			o = this.options,
+			theme = o.theme,
+			themeclass;
+			
+		if ( !theme ) {
+			var themedParent = this.element.closest("[class*='ui-bar-'],[class*='ui-body-']"); 
+				theme = themedParent.length ?
+					/ui-(bar|body)-([a-z])/.exec( themedParent.attr("class") )[2] :
+					"c";
+		}	
 		
-		var o = $.extend({
-			search: input.is('[type="search"],[data-type="search"]'), 
-			theme: input.data("theme") || "c"
-		}, options);
+		themeclass = " ui-body-" + theme;
 		
 		$('label[for='+input.attr('id')+']').addClass('ui-input-text');
 		
@@ -1398,8 +1472,8 @@ jQuery.fn.customTextInput = function(options){
 		var focusedEl = input;
 		
 		//"search" input widget
-		if(o.search){
-			focusedEl = input.wrap('<div class="ui-input-search ui-shadow-inset ui-btn-corner-all ui-body-c ui-btn-shadow ui-icon-search"></div>').parent();
+		if( input.is('[type="search"],[data-type="search"]') ){
+			focusedEl = input.wrap('<div class="ui-input-search ui-shadow-inset ui-btn-corner-all ui-btn-shadow ui-icon-search'+ themeclass +'"></div>').parent();
 			var clearbtn = $('<a href="#" class="ui-input-clear" title="clear text">clear text</a>')
 				.click(function(){
 					input.val('').focus();
@@ -1423,7 +1497,7 @@ jQuery.fn.customTextInput = function(options){
 			input.keyup(toggleClear);	
 		}
 		else{
-			input.addClass('ui-corner-all ui-shadow-inset');
+			input.addClass('ui-corner-all ui-shadow-inset' + themeclass);
 		}
 				
 		input
@@ -1451,9 +1525,17 @@ jQuery.fn.customTextInput = function(options){
 				keyupTimeout = setTimeout( keyup, keyupTimeoutBuffer );
 			});
 		}
-	});
-};
-})(jQuery);
+	},
+	
+	disable: function(){
+		( this.element.attr("disabled",true).is('[type="search"],[data-type="search"]') ? this.element.parent() : this.element ).addClass("ui-disabled");
+	},
+	
+	enable: function(){
+		( this.element.attr("disabled", false).is('[type="search"],[data-type="search"]') ? this.element.parent() : this.element ).removeClass("ui-disabled");
+	}
+});
+})( jQuery );
 
 
 /*
@@ -1982,23 +2064,24 @@ $.fn.slider = function(options){
 * Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
 * Note: Code is in draft form and is subject to change 
 */ 
-(function($){
-$.fn.collapsible = function(options){
-	return $(this).each(function(){
-		var o = $.extend({
-			expandCueText: ' click to expand contents',
-			collapseCueText: ' click to collapse contents',
-			collapsed: $(this).is('[data-state="collapsed"]'),
-			heading: '>h1,>h2,>h3,>h4,>h5,>h6,>legend',
-			theme: $(this).data('theme'),
-			iconTheme: $(this).data('icontheme') || 'd'
-		},options);
+(function ( $ ) {
+$.widget( "mobile.collapsible", $.mobile.widget, {
+	options: {
+		expandCueText: ' click to expand contents',
+		collapseCueText: ' click to collapse contents',
+		collapsed: false,
+		heading: '>:header,>legend',
+		theme: undefined,
+		iconTheme: 'd'
+	},
+	_create: function(){
 
-		//define
-		var collapsibleContain = $(this).addClass('ui-collapsible-contain'),
-			collapsibleHeading = $(this).find(o.heading).eq(0),
+		var $el = this.element,
+			o = this.options,
+			collapsibleContain = $el.addClass('ui-collapsible-contain'),
+			collapsibleHeading = $el.find(o.heading).eq(0),
 			collapsibleContent = collapsibleContain.wrapInner('<div class="ui-collapsible-content"></div>').find('.ui-collapsible-content'),
-			collapsibleParent = $(this).closest('[data-role=collapsible-set]').addClass('ui-collapsible-set');				
+			collapsibleParent = $el.closest('[data-role="collapsible-set"]').addClass('ui-collapsible-set');				
 		
 		//replace collapsibleHeading if it's a legend	
 		if(collapsibleHeading.is('legend')){
@@ -2119,9 +2202,9 @@ $.fn.collapsible = function(options){
 			return false;
 		});
 			
-	});	
-};	
-})(jQuery);
+	}
+});
+})( jQuery );
 
 /*
 * jQuery Mobile Framework : prototype for "controlgroup" plugin - corner-rounding for groups of buttons, checks, radios, etc
@@ -2364,7 +2447,7 @@ jQuery.widget( "mobile.listview", jQuery.mobile.widget, {
 						shadow: false,
 						corners: false,
 						iconpos: "right",
-						icon: item.data("icon") || "arrow-r",
+						icon: a.length > 1 ? false : item.data("icon") || "arrow-r",
 						theme: o.theme
 					});
 
@@ -2373,7 +2456,8 @@ jQuery.widget( "mobile.listview", jQuery.mobile.widget, {
 				if ( a.length > 1 ) {
 					itemClass += " ui-li-has-alt";
 
-					var last = a.last();
+					var last = a.last(),
+						splittheme = $list.data( "splittheme" ) || last.data( "theme" ) || o.splitTheme;
 					
 					last
 						.attr( "title", last.text() )
@@ -2390,7 +2474,7 @@ jQuery.widget( "mobile.listview", jQuery.mobile.widget, {
 							.append( jQuery( "<span>" ).buttonMarkup({
 								shadow: true,
 								corners: true,
-								theme: $list.data( "splittheme" ) || last.data( "theme" ) || o.splitTheme,
+								theme: splittheme,
 								iconpos: "notext",
 								icon: $list.data( "spliticon" ) || last.data( "icon" ) ||  o.splitIcon
 							} ) );
@@ -2410,8 +2494,6 @@ jQuery.widget( "mobile.listview", jQuery.mobile.widget, {
 			}
 				
 			if ( pos === 0 ) {
-				item.find( "img" ).addClass( "ui-corner-tl" );
-
 				if ( o.inset ) {
 					itemClass += " ui-corner-top";
 
@@ -2425,7 +2507,6 @@ jQuery.widget( "mobile.listview", jQuery.mobile.widget, {
 				}
 
 			} else if ( pos === li.length - 1 ) {
-				item.find( "img" ).addClass( "ui-corner-bl" );
 
 				if ( o.inset ) {
 					itemClass += " ui-corner-bottom";
@@ -2540,12 +2621,18 @@ $( "[data-role='listview']" ).live( "listviewcreate", function() {
 $.widget( "mobile.dialog", $.mobile.widget, {
 	options: {},
 	_create: function(){	
-		var $el = this.element,
-			$closeBtn = $('<a href="#" data-icon="delete" data-iconpos="notext">Close</a>')
-							.click(function(){
-								$.changePage([$el, $.activePage], undefined, true );
-								return false;
-							});
+		var self = this,
+			$el = self.element,
+			$closeBtn = $('<a href="#" data-icon="delete" data-iconpos="notext">Close</a>');
+			
+		$el.delegate("a, submit", "click submit", function(e){
+			if( e.type == "click" && ( $(e.target).closest('[data-back]') || $(e.target).closest($closeBtn) ) ){
+				self.close();
+				return false;
+			}
+			//otherwise, assume we're headed somewhere new. set activepage to dialog so the transition will work
+			$.activePage = this.element;
+		});
 	
 		this.element
 			.bind("pageshow",function(){
@@ -2562,6 +2649,9 @@ $.widget( "mobile.dialog", $.mobile.widget, {
 				.last()
 				.addClass('ui-corner-bottom ui-overlay-shadow');
 
+	},
+	close: function(){
+		$.changePage([this.element, $.activePage], undefined, true );
 	}
 });
 })( jQuery );
@@ -2644,63 +2734,116 @@ $.fn.grid = function(options){
  * Dual licensed under the MIT or GPL Version 2 licenses.
  * http://jquery.org/license
  */
+
 (function( $, window, undefined ) {
-	//some critical feature tests should be placed here.
-	//if we're missing support for any of these, then we're a C-grade browser
-	//to-do: see if we need more qualifiers here.
-	if ( !jQuery.support.mediaquery ) {
-		return;
-	}	
 	
-	//these properties should be made easy to override externally
-	jQuery.mobile = {};
+	//jQuery.mobile obj extendable options
+	jQuery.mobile = jQuery.extend({
+		
+		//define the url parameter used for referencing widget-generated sub-pages. 
+		//Translates to to example.html&ui-page=subpageIdentifier
+		//hash segment before &ui-page= is used to make Ajax request
+		subPageUrlKey: 'ui-page',
+		
+		//anchor links that match these selectors will be untrackable in history 
+		//(no change in URL, not bookmarkable)
+		nonHistorySelectors: '[data-rel=dialog]',
+		
+		//class assigned to page currently in view, and during transitions
+		activePageClass: 'ui-page-active',
+		
+		//class used for "active" button state, from CSS framework
+		activeBtnClass: 'ui-btn-active',
+		
+		//available CSS transitions
+		transitions: ['slide', 'slideup', 'slidedown', 'pop', 'flip', 'fade'],
+		
+		//set default transition
+		defaultTransition: 'slide',
+		
+		//show loading message during Ajax requests
+		//if false, message will not appear, but loading classes will still be toggled on html el
+		loadingMessage: "loading",
+		
+		//configure meta viewport tag's content attr:
+		metaViewportContent: "width=device-width, minimum-scale=1, maximum-scale=1",
+		
+		//additional markup to prepend to head
+		headExtras: undefined,
+		
+		//support conditions that must be met in order to proceed
+		gradeA: function(){
+			return jQuery.support.mediaquery;
+		}
+		
+	}, jQuery.mobile );
 	
-	jQuery.extend(jQuery.mobile, {
-		subPageUrlKey: 'ui-page', //define the key used in urls for sub-pages. Defaults to &ui-page=
-		degradeInputs: {
-			color: true,
-			date: true,
-			datetime: true,
-			"datetime-local": true,
-			email: true,
-			month: true,
-			number: true,
-			range: true,
-			search: true,
-			tel: true,
-			time: true,
-			url: true,
-			week: true
-		},
-		addBackBtn: true
-	});
+	//if device support condition(s) aren't met, leave things as they are -> a basic, usable experience,
+	//otherwise, proceed with the enhancements
+	if ( !jQuery.mobile.gradeA() ) {
+		return;
+	}	
 
+	//define vars for interal use
 	var $window = jQuery(window),
 		$html = jQuery('html'),
 		$head = jQuery('head'),
+		
+		//to be populated at DOM ready
 		$body,
-		$loader = jQuery('<div class="ui-loader ui-body-a ui-corner-all"><span class="ui-icon ui-icon-loading spin"></span><h1>loading</h1></div>'),
+		
+		//loading div which appears during Ajax requests
+		//will not appear if $.mobile.loadingMessage is false
+		$loader = $.mobile.loadingMessage ? 
+			jQuery('<div class="ui-loader ui-body-a ui-corner-all">'+
+						'<span class="ui-icon ui-icon-loading spin"></span>'+
+						'<h1>'+ $.mobile.loadingMessage +'</h1>'+
+					'</div>')
+			: undefined,
+			
+		//define meta viewport tag, if content is defined	
+		$metaViewport = $.mobile.metaViewportContent ? $("<meta>", { name: "viewport", content: $.mobile.metaViewportContent}) : undefined,
+		
+		//define baseUrl for use in relative url management
+		baseUrl = getPathDir( location.protocol + '//' + location.host + location.pathname ),
+		
+		//define base element, for use in routing asset urls that are referenced in Ajax-requested markup
+		$base = $.support.dynamicBaseTag ? $("<base>", { href: baseUrl }) : undefined,
+		
+		//will be defined as first page element in DOM
 		$startPage,
+		
+		//will be defined as $startPage.parent(), which is usually the body element
+		//will receive ui-mobile-viewport class
 		$pageContainer,
-		startPageId = 'ui-page-start',
-		activePageClass = 'ui-page-active',
-		activeBtnClass = 'ui-btn-active',
+		
+		//will be defined when a link is clicked and given an active class
 		activeClickedLink = null,
-		pageTransition,
-		forceBack,
-		transitions = 'slide slideup slidedown pop flip fade',
-		transitionDuration = 350,
-		backBtnText = "Back",
+		
+		//array of pages that are visited during a single page load
+		//length will grow as pages are visited, and shrink as "back" link/button is clicked
+		//each item has a url (string matches ID), and transition (saved for reuse when "back" link/button is clicked)
 		urlStack = [ {
 			url: location.hash.replace( /^#/, "" ),
-			transition: "slide"
+			transition: undefined
 		} ],
+		
+		//define first selector to receive focus when a page is shown
 		focusable = "[tabindex],a,button:visible,select:visible,input",
+		
+		//contains role for next page, if defined on clicked link via data-rel
 		nextPageRole = null,
+		
+		//enable/disable hashchange event listener
+		//toggled internally when location.hash is updated to match the url of a successful page load
 		hashListener = true,
-		unHashedSelectors = '[data-rel=dialog]',
-		baseUrl = getPathDir( location.protocol + '//' + location.host + location.pathname ),
+		
+		//media-query-like width breakpoints, which are translated to classes on the html element 
 		resolutionBreakpoints = [320,480,768,1024];
+		
+		
+	//prepend head markup additions
+	$head.prepend( $.mobile.headExtras || {}, $metaViewport || {}, $base || {} );
 
 	// TODO: don't expose (temporary during code reorg)
 	$.mobile.urlStack = urlStack;
@@ -2736,13 +2879,16 @@ $.fn.grid = function(options){
 	
 	var setBaseURL = !$.support.dynamicBaseTag ? $.noop : function( nonHashPath ){
 		//set base url for new page assets
-		$('#ui-base').attr('href', baseUrl + getBaseURL( nonHashPath ));
+		$base.attr('href', baseUrl + getBaseURL( nonHashPath ));
 	}
 	
 	var resetBaseURL = !$.support.dynamicBaseTag ? $.noop : function(){
-		$('#ui-base').attr('href', baseUrl);
+		$base.attr('href', baseUrl);
 	}
 	
+	//set base href to pathname
+    resetBaseURL(); 
+	
 	//for form submission
 	$('form').live('submit', function(){
 		var type = $(this).attr("method"),
@@ -2783,7 +2929,7 @@ $.fn.grid = function(options){
 			return false;
 		}
 		
-		activeClickedLink = $this.closest( ".ui-btn" ).addClass( activeBtnClass );
+		activeClickedLink = $this.closest( ".ui-btn" ).addClass( $.mobile.activeBtnClass );
 		
 		if( external ){
 			//deliberately redirect, in case click was triggered
@@ -2791,9 +2937,9 @@ $.fn.grid = function(options){
 		}
 		else {	
 			//use ajax
-			var pageTransition = $this.data( "transition" ) || "slide",
-				forceBack = $this.data( "back" ) || undefined,
-				changeHashOnSuccess = !$this.is(unHashedSelectors);
+			var transition = $this.data( "transition" ),
+				back = $this.data( "back" ),
+				changeHashOnSuccess = !$this.is( $.mobile.nonHistorySelectors );
 				
 			nextPageRole = $this.attr( "data-rel" );	
 	
@@ -2804,7 +2950,7 @@ $.fn.grid = function(options){
 			
 			href.replace(/^#/,'');
 			
-			changePage(href, pageTransition, forceBack, changeHashOnSuccess);			
+			changePage(href, transition, back, changeHashOnSuccess);			
 		}
 		event.preventDefault();
 	});
@@ -2814,7 +2960,10 @@ $.fn.grid = function(options){
 		if ( done ) {
 			$html.removeClass( "ui-loading" );
 		} else {
-			$loader.appendTo($pageContainer).css({top: $(window).scrollTop() + 75});
+		
+			if( $.mobile.loadingMessage ){
+				$loader.appendTo($pageContainer).css({top: $(window).scrollTop() + 75});
+			}	
 			$html.addClass( "ui-loading" );
 		}
 	};
@@ -2854,12 +3003,12 @@ $.fn.grid = function(options){
 	
 	//remove active classes after page transition or error
 	function removeActiveLinkClass(forceRemoval){
-		if(activeClickedLink && (!activeClickedLink.closest( '.ui-page-active' ).length) || forceRemoval ){
-			activeClickedLink.removeClass( activeBtnClass );
+		if( !!activeClickedLink && (!activeClickedLink.closest( '.ui-page-active' ).length || forceRemoval )){
+			activeClickedLink.removeClass( $.mobile.activeBtnClass );
 		}
 		activeClickedLink = null;
 	}
-	
+
 
 	//for getting or creating a new page 
 	function changePage( to, transition, back, changeHash){
@@ -2871,23 +3020,22 @@ $.fn.grid = function(options){
 			url = fileUrl = $.type(to) === "string" ? to.replace( /^#/, "" ) : null,
 			data = undefined,
 			type = 'get',
+			isFormRequest = false,
+			duplicateCachedPage = null,
 			back = (back !== undefined) ? back : ( urlStack.length > 1 && urlStack[ urlStack.length - 2 ].url === url ),
-			transition = (transition !== undefined) ? transition :  ( pageTransition || "slide" );
+			transition = (transition !== undefined) ? transition : $.mobile.defaultTransition;
 		
-		if( $.type(to) === "object" ){
+		if( $.type(to) === "object" && to.url ){
 			url = to.url,
 			data = to.data,
-			type = to.type;
+			type = to.type,
+			isFormRequest = true;
 			//make get requests bookmarkable
 			if( data && type == 'get' ){
 				url += "?" + data;
 				data = undefined;
 			}
 		}
-		
-		//unset pageTransition, forceBack	
-		pageTransition = undefined;
-		forceBack = undefined;
 			
 		//reset base to pathname for new request
 		resetBaseURL();
@@ -2919,31 +3067,33 @@ $.fn.grid = function(options){
 				if( changeHash && url ){
 					hashListener = false;
 					location.hash = url;
-					setTimeout(function(){
-						hashListener = true;
-					}, 500);
 				}
 				removeActiveLinkClass();
+				
+				//if there's a duplicateCachedPage, remove it from the DOM now that it's hidden
+				if( duplicateCachedPage != null ){
+					duplicateCachedPage.remove();
+				}
 			}
 			
 			if(transition){		
 				$pageContainer.addClass('ui-mobile-viewport-transitioning');
 				// animate in / out
 				from.addClass( transition + " out " + ( back ? "reverse" : "" ) );
-				to.addClass( activePageClass + " " + transition +
+				to.addClass( $.mobile.activePageClass + " " + transition +
 					" in " + ( back ? "reverse" : "" ) );
 				
 				// callback - remove classes, etc
 				to.animationComplete(function() {
-					from.add( to ).removeClass(" out in reverse " + transitions );
-					from.removeClass( activePageClass );
+					from.add( to ).removeClass(" out in reverse " + $.mobile.transitions.join(' ') );
+					from.removeClass( $.mobile.activePageClass );
 					loadComplete();
 					$pageContainer.removeClass('ui-mobile-viewport-transitioning');
 				});
 			}
 			else{
-				from.removeClass( activePageClass );
-				to.addClass( activePageClass );
+				from.removeClass( $.mobile.activePageClass );
+				to.addClass( $.mobile.activePageClass );
 				loadComplete();
 			}
 		};
@@ -2974,13 +3124,18 @@ $.fn.grid = function(options){
 		}
 		
 		// find the "to" page, either locally existing in the dom or by creating it through ajax
-		if ( to.length ) {
+		if ( to.length && !isFormRequest ) {
 			if( fileUrl ){
 				setBaseURL(fileUrl);
 			}	
 			enhancePage();
 			transitionPages();
 		} else { 
+		
+			//if to exists in DOM, save a reference to it in duplicateCachedPage for removal after page change
+			if( to.length ){
+				duplicateCachedPage = to;
+			}
 			
 			pageLoading();
 
@@ -2998,7 +3153,7 @@ $.fn.grid = function(options){
 					//rewrite src and href attrs to use a base url
 					if( !$.support.dynamicBaseTag ){
 						var baseUrl = getBaseURL(fileUrl);
-						to.find('[src],[href]').each(function(){
+						to.find('[src],link[href]').each(function(){
 							var thisAttr = $(this).is('[href]') ? 'href' : 'src',
 								thisUrl = $(this).attr(thisAttr);
 							
@@ -3047,10 +3202,13 @@ $.fn.grid = function(options){
 		
 		// needs to be bound at domready (for IE6)
 		// find or load content, make it active
-		$window.bind( "hashchange", function(e, extras) {
-			if( !hashListener ){ return; } 
+		$window.bind( "hashchange", function(e, triggered) {
+			if( !hashListener ){ 
+				hashListener = true;
+				return; 
+			} 
 			var to = location.hash,
-				transition = (extras && extras.manuallyTriggered) ? false : undefined;
+				transition = triggered ? false : undefined;
 				
 			// either we've backed up to the root page url
 			// or it's the first page load with no hash present
@@ -3061,12 +3219,12 @@ $.fn.grid = function(options){
 			}
 			//there's no hash, the active page is not the start page, and it's not manually triggered hashchange
 			// > probably backed out to the first page visited
-			else if( $.activePage.length && !$startPage.is( $.activePage ) && !(extras && extras.manuallyTriggered) ) {
+			else if( $.activePage.length && !$startPage.is( $.activePage ) && !triggered ) {
 				changePage( $startPage, transition, true );
 			}
 			else{
 				$startPage.trigger("pagebeforeshow", {prevPage: $('')});
-				$startPage.addClass( activePageClass );
+				$startPage.addClass( $.mobile.activePageClass );
 				pageLoading( true );
 				
 				if( $startPage.trigger("pageshow", {prevPage: $('')}) !== false ){
@@ -3081,8 +3239,8 @@ $.fn.grid = function(options){
 	$html.addClass('ui-mobile');
 	
 	//add orientation class on flip/resize.
-	$window.bind( "orientationchange", function( event, data ) {
-		$html.removeClass( "portrait landscape" ).addClass( data.orientation );
+	$window.bind( "orientationchange.htmlclass", function( event ) {
+		$html.removeClass( "portrait landscape" ).addClass( event.orientation );
 	});
 	
 	//add breakpoint classes for faux media-q support
@@ -3126,27 +3284,17 @@ $.fn.grid = function(options){
 			resolutionBreakpoints.push( newbps );
 		}
 		detectResolutionBreakpoints();
-	}
-		
-	//insert mobile meta - these will need to be configurable somehow.
-	var headPrepends = 
-	$head.prepend(
-		'<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1" />' +
-		($.support.dynamicBaseTag ? '<base  href="" id="ui-base" />' : '')
-	);
-    
-    //set base href to pathname
-    resetBaseURL();    
+	} 
 	
-	//incomplete fallback to workaround lack of animation callbacks. 
-	//should this be extended into a full special event?
-	// note: Expects CSS animations use transitionDuration (350ms)
+	//animation complete callback
+	//TODO - update support test and create special event for transitions
+	//check out transitionEnd (opera per Paul's request)
 	jQuery.fn.animationComplete = function(callback){
-		if(jQuery.support.WebKitAnimationEvent){
-			return jQuery(this).one('webkitAnimationEnd', callback); //check out transitionEnd (opera per Paul's request)
+		if(jQuery.support.cssTransitions){
+			return jQuery(this).one('webkitAnimationEnd', callback);
 		}
 		else{
-			setTimeout(callback, transitionDuration);
+			callback();
 		}
 	};	
 	
@@ -3169,21 +3317,74 @@ $.fn.grid = function(options){
 			pageContainer: $pageContainer
 		});
 		
-		//make sure it has an ID - for finding it later
-		if(!$startPage.attr('id')){ 
-			$startPage.attr('id', startPageId); 
-		}
-		
 		//initialize all pages present
 		$pages.page();
 		
 		//trigger a new hashchange, hash or not
-		$window.trigger( "hashchange", { manuallyTriggered: true } );
+		$window.trigger( "hashchange", [ true ] );
 		
 		//update orientation 
-		$html.addClass( jQuery.event.special.orientationchange.orientation( $window ) );
+		$window.trigger( "orientationchange.htmlclass" );
 	});
 	
-	$window.load(hideBrowserChrome);
+	$window
+		.load(hideBrowserChrome)
+		.unload(removeActiveLinkClass);
 	
 })( jQuery, this );
+
+
+//quick & dirty theme switcher, written to potentially work as a bookmarklet
+(function($){
+  $.themeswitcher = function(){
+    var
+      themesDir = '/stylesheets/compiled/jquery/mobile/',
+      //themesDir = 'http://jquerymobile.com/test/themes/',
+      themes = ['default','valencia'],
+      currentPage = $.activePage,
+      menuPage = 
+        $( '<div data-role=\'dialog\' data-theme=\'a\'>' +
+           '<div data-role=\'header\' data-theme=\'b\'>' +
+           '<div class=\'ui-title\'>Switch Theme:</div>'+
+           '</div>'+
+           '<div data-role=\'content\' data-theme=\'c\'><ul data-role=\'listview\' data-inset=\'true\'></ul></div>'+
+           '</div>'
+        ).appendTo( $.pageContainer ),
+      menu = menuPage.find('ul');	
+    
+    //menu items	
+    $.each(themes, function( i ){
+      $('<li><a href=\'#\'>' + themes[ i ].charAt(0).toUpperCase() + themes[ i ].substr(1) + '</a></li>')
+      .click(function(){
+        addTheme( themes[i] );
+        done();
+        return false;
+      })
+      .appendTo(menu);
+    });	
+    
+    //remover, adder
+    function addTheme(theme){
+      $('head').append( '<link rel=\'stylesheet\' href=\''+ themesDir + theme +'.css\' />' );
+    }
+    
+    //finished with this
+    function done(){
+      $.changePage([menuPage, currentPage], 'pop', true);
+      menuPage.bind('pagehide',function(){
+        menuPage.remove();
+      });
+      return false;
+    }
+            
+    //destroy
+    menuPage.find('.ui-btn-left').click(done);
+    
+    //create page, listview
+    menuPage.page();
+    
+    //change page now	
+    $.changePage([currentPage, menuPage], 'pop', false);
+  };
+})(jQuery);
+