Merge branch 'master' into transitions

Author: jblas

.htaccess

@@ -60,6 +60,7 @@ JSFILES = 	  js/jquery.ui.widget.js \
 			  js/jquery.mobile.forms.button.js \
 			  js/jquery.mobile.forms.slider.js \
 			  js/jquery.mobile.forms.textinput.js \
+			  js/jquery.mobile.forms.select.custom.js \
 			  js/jquery.mobile.forms.select.js \
 			  js/jquery.mobile.buttonMarkup.js \
 			  js/jquery.mobile.controlGroup.js \
@@ -126,7 +127,7 @@ notify:
 	@@echo "The files have been built and are in " $$(pwd)/${OUTPUT}
 
 # Pull the latest commits. This is used for the nightly build but can be used to save some keystrokes
-pull: 
+pull:
 	@@git pull --quiet
 
 # Zip the 4 files and the theme images into one convenient package
@@ -161,7 +162,7 @@ nightly: pull zip
 	# Change the empty paths to the location of this nightly file
 	@@find ${VER} -type f -name '*.html' -exec sed -i 's|href="themes/default/"|href="${NIGHTLY_WEBPATH}/${DIR}.min.css"|g' {} \;
 	@@find ${VER} -type f -name '*.html' -exec sed -i 's|src="js/jquery.js"|src="http://code.jquery.com/jquery-${JQUERY}.min.js"|' {} \;
-	@@find ${VER} -type f -name '*.html' -exec sed -i 's|src="js/"|src="${NIGHTLY_WEBPATH}/${DIR}.min.js"|g' {} \;	
+	@@find ${VER} -type f -name '*.html' -exec sed -i 's|src="js/"|src="${NIGHTLY_WEBPATH}/${DIR}.min.js"|g' {} \;
 
 	# Move the demos into the output folder
 	@@mv ${VER} ${OUTPUT}/demos

Makefile

@@ -30,7 +30,7 @@
 		  js/jquery.mobile.core.js,
 		  js/jquery.mobile.navigation.js,
 		  js/jquery.mobile.transition.js,
-		  js/jquery.mobile.degradeInputs.js,		
+		  js/jquery.mobile.degradeInputs.js,
 		  js/jquery.mobile.dialog.js,
 		  js/jquery.mobile.page.sections.js,
 		  js/jquery.mobile.collapsible.js,
@@ -44,6 +44,7 @@
 		  js/jquery.mobile.forms.button.js,
 		  js/jquery.mobile.forms.slider.js,
 		  js/jquery.mobile.forms.textinput.js,
+		  js/jquery.mobile.forms.select.custom.js,
 		  js/jquery.mobile.forms.select.js,
 		  js/jquery.mobile.buttonMarkup.js,
 		  js/jquery.mobile.controlGroup.js,

build.xml

@@ -29,7 +29,7 @@ $('div').live('pagecreate',function(event){
 
 //collapse page navs after use
 $(function(){
-	$('body').delegate('.content-secondary .ui-collapsible-content', 'vclick',  function(){
+	$('body').delegate('.content-secondary .ui-collapsible-content', 'click',  function(){
 		$(this).trigger("collapse")
 	});
 });
@@ -48,8 +48,8 @@ function setDefaultTransition(){
 	$.mobile.defaultPageTransition = trans;
 }
 
-//set default documentation 
-$( document ).bind( "mobileinit", setDefaultTransition );
+
 $(function(){
+	setDefaultTransition();
 	$( window ).bind( "throttledresize", setDefaultTransition );
 });

docs/_assets/images/version.png

@@ -27,14 +27,14 @@ <h1>Features</h1>
 				<h2>Key features:</h2>
 				<ul>
 					<li><strong>Built on jQuery core</strong> for familiar and consistent jQuery syntax and minimal learning curve</li>
-					<li><strong>Compatible with all major mobile  platforms</strong> - iOS, Android, Blackberry, Palm WebOS, Nokia/Symbian, Windows Mobile, bada, MeeGo with baseline support for all devices that understand HTML</li>
-					<li><strong>Lightweight size</strong> (12k compressed for all mobile functionality) and minimal image dependencies for speed.</li>
+					<li><strong>Compatible with all major mobile & desktop platforms</strong> - iOS, Android, Blackberry, Palm WebOS, Nokia/Symbian, Windows Mobile, Opera Mobile/Mini, Firefox Mobile and all modern desktop browsers.</li>
+					<li><strong>Lightweight size</strong> (~20k compressed for all mobile functionality) and minimal image dependencies for speed.</li>
 					<li><strong>HTML5 Markup-driven configuration</strong> of pages and behavior for fast development and minimal required scripting.</li>
 					<li><strong>Progressive enhancement</strong> approach brings core content and functionality to all mobile, tablet and desktop platforms and a rich, installed application-like experience on newer mobile platforms.</li>
 					<li><strong>Automatic initialization</strong> by using HTML5 <code> data-role</code> attributes in the HTML markup to act as the trigger to automatically initialize all jQuery Mobile widgets found on a page.</li>
 					<li><strong>Accessibility</strong> features such as WAI-ARIA are also included to ensure that the pages work for screen readers (e.g. VoiceOver in iOS) and other assistive technologies.</li>
-					<li><strong>New events</strong> streamline the process of supporting touch, mouse, and cursor focus-based user input methods with a simple API. </li>
-					<li><strong>New plugins</strong> enhance native controls with touch-optimized, themable controls. </li>
+					<li><strong>Touch and moust event support</strong> streamline the process of supporting touch, mouse, and cursor focus-based user input methods with a simple API. </li>
+					<li><strong>UI widgets</strong> enhance native controls with touch-optimized, themable controls. </li>
 					<li><strong>Powerful theming framework</strong> and ThemeRoller application make highly-branded experiences easy to build.</li>
 
 				</ul>

docs/_assets/js/jqm-docs.js

@@ -28,7 +28,7 @@ <h1>Introduction</h1>
 
 		<h2>jQuery Mobile Overview</h2>
 
-		<p>jQuery’s mobile strategy can be summarized simply: Delivering top-of-the-line JavaScript in a unified User Interface that works across the most-used smartphone web browsers and tablet form factors.</p>
+		<p>jQuery’s mobile strategy can be summarized simply: A unified user interface system that works seamlessly across all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation. Focused on a lightweight codebase built on progressive enhancement with a flexible, easily themeable design.</p>
 
 		<p>The critical difference with our approach is the <a href="platforms.html">wide variety of mobile platforms we’re targeting</a> with jQuery Mobile. We’ve been working hard at bringing jQuery support to all mobile browsers that are sufficiently-capable and have at least a nominal amount of market share. In this way, we’re treating mobile web browsers exactly how we treat desktop web browsers.</p>
 

docs/about/features.html

@@ -24,24 +24,24 @@ <h1>Supported platforms</h1>
 
 
 			<div class="content-primary">
-				<h2>Supported platforms in Beta 1</h2>
+				<h2>Supported platforms in Beta 2</h2>
 
-<p>jQuery Mobile is the most broadly compatible HTML5 library for building web sites and apps and we've very proud of our commitment to accessibility, universal access, and staying true to the principles of the web. For anyone who needs to reach the greatest number of people worldwide, our broad support for all popular platforms is a distinct advantage.In Beta 1, we've added support for both Blackberry 5 devices and Opera Mini in Beta 1 which dramatically increases the reach of the framework. Both of these platforms had issues with handling the Ajax-based navigation so they receive a B grade experience with all the enhancements <a href="http://jquerymobile.com/blog/2011/05/27/jquery-mobile-team-update-week-of-may-23/">except for Ajax navigation</a>.</p>
+<p>At this stage, jQuery Mobile works on the vast majority of all modern desktop, smartphone, tablet, and e-reader platforms. In addition, feature phones and older browsers are also supported because of our progressive enhancement approach. We're very proud of our commitment to universal accessibility through our broad support for all popular platforms.</p>
 
-<p>At this stage, jQuery Mobile works on the vast majority of all modern desktop, smartphone, tablet, and e-reader platforms. In addition, feature phones and older browsers are also supported because of our progressive enhancement approach. The only notable platform still in the works is Nokia’s Symbian S60 platform and we have this targeted for Beta 2.</p>
+<p>Our <a href="http://jquerymobile.com/gbs/">graded support matrix</a> was created over a year ago based on our goals as a project and since that time, we've been refining our grading system based on real-world device testing and the quickly evolving mobile landscape. To provide a quick summary of our browser support in Beta 1, we've created a simple A (full), B (full minus Ajax), C (basic) grade system with notes of the actual devices and versions we've been testing on in our lab.</p>
 
-<p>Our <a href="http://jquerymobile.com/gbs/">graded support matrix</a> was created over a year ago based on our goals as a project. Since that time, we've been refining our grading system based on real-world device testing and the quickly evolving mobile landscape. To provide a quick summary of our browser support in Beta 1, we've created a simple A (full), B (full minus Ajax), C (basic) grade system with notes of the actual devices and versions we've been testing on in our lab.</p>
+<p>The visual fidelity of the experience is highly dependent on CSS rendering capabilities of the device and platform so not all A grade experience will be pixel-perfect but that's the nature of the web. We'll be adding additional vendor-prefixed CSS rules to bring transitions, gradients and other visual improvements to non-WebKit browsers in future releases so look for even more added visual polish as we move towards 1.0.</p>
 
-<p>The visual fidelity of the experience is highly dependent on CSS rendering capabilities of the device and platform so not all A grade experience will be pixel-perfect but that’s the nature of the web. We’ll be adding additional vendor-prefixed CSS rules to bring transitions, gradients and other visual improvements to non-WebKit browsers in future releases so look for even more added visual polish as we move towards 1.0.</p>
-
-<h3 style="font-weight: normal; background: #fff; border-left: 7px solid #74B64A; padding: 5px 0 5px 8px;"><strong> A-grade</strong> - Full enhanced experience with Ajax-based animated page transitions.</h3>
+<h3 style="display: block; font-size: 15px !important; font-weight: normal; background: #f0f0f0; border-left: 7px solid #74B64A; padding: 5px 0 5px 8px;"><strong> A-grade</strong> - Full enhanced experience with Ajax-based animated page transitions.</h3>
 <ul>
 	<li><strong>Apple iOS 3.2-5.0 beta</strong>: Tested on the original iPad (3.2 / 4.3), iPad 2 (4.3), original iPhone (3.1), iPhone 3 (3.2), 3GS (4.3), and 4 (4.3 / 5.0 beta)</li>
-	<li><strong>Android 2.1-2.3</strong>: Tested on the HTC Incredible (2.2), original Droid (2.2), Nook Color (2.2), HTC Aria (2.1), emulator (2.3). Functional on 1.5 &amp; 1.6 but performance may be sluggish, tested on Google G1 (1.5)</li>
+	<li><strong>Android 2.1-2.3</strong>: Tested on the HTC Incredible (2.2), original Droid (2.2), Nook Color (2.2), HTC Aria (2.1), Google Nexus S (2.3)  <span style="background: yellow; padding: 2px 5px; font-size: 10px;">NEW</span>. Functional on 1.5 &amp; 1.6 but performance may be sluggish, tested on Google G1 (1.5)</li>
+	<li><strong>Android Honeycomb</strong> <span style="background: yellow; padding: 2px 5px; font-size: 10px;">NEW</span> - Tested on the Samsung Galaxy Tab 10.1</li>
 	<li><strong>Windows Phone 7</strong>: Tested on the HTC 7 Surround</li>
 	<li><strong>Blackberry 6.0</strong>: Tested on the Torch 9800 and Style 9670</li>
 	<li><strong>Blackberry Playbook</strong>: Tested on PlayBook version 1.0.1 / 1.0.5</li>
 	<li><strong>Palm WebOS (1.4-2.0)</strong>: Tested on the Palm Pixi (1.4), Pre (1.4), Pre 2 (2.0)</li>
+	<li><strong>Palm WebOS 3.0</strong> <span style="background: yellow; padding: 2px 5px; font-size: 10px;">NEW</span> - Tested on HP TouchPad</li>
 	<li><strong>Firebox Mobile (Beta)</strong>: Tested on Android 2.2</li>
 	<li><strong>Opera Mobile 11.0</strong>: Tested on the iPhone 3GS and 4 (5.0/6.0), Android 2.2 (5.0/6.0), Windows Mobile 6.5 (5.0)</li>
 	<li><strong>Kindle 3</strong>: Tested on the built-in WebKit browser included in the Kindle 3 device</li>
@@ -50,29 +50,24 @@ <h3 style="font-weight: normal; background: #fff; border-left: 7px solid #74B64A
 	<li><strong>Internet Explorer 7-9</strong> - Tested on Windows XP, Vista and 7 (minor CSS issues)</li>
 	<li><strong>Opera Desktop 10-11</strong> - Tested on OS X 10.6.7 and Windows 7</li>
 </ul>
-<h3 style="font-weight: normal; background: #fff; border-left: 7px solid #6699cc; padding: 5px 0 5px 8px;"><strong>B-grade</strong> - Enhanced experience except without Ajax navigation features.</h3>
+<h3 style="display: block; font-size: 15px !important; font-weight: normal; background: #f0f0f0; border-left: 7px solid #6699cc; padding: 5px 0 5px 8px;"><strong>B-grade</strong> - Enhanced experience except without Ajax navigation features.</h3>
 <ul>
 	<li><strong>Blackberry 5.0</strong>: Tested on the Storm 2 9550, Bold 9770</li>
 	<li><strong>Opera Mini (5.0-6.0)</strong> - Tested on iOS 3.2/4.3</li>
 	<li><strong>Windows Phone 6.5</strong> - Tested on the HTC</li>
+	<li><strong>Nokia Symbian^3</strong> <span style="background: yellow; padding: 2px 5px; font-size: 10px;">NEW</span> - Tested on Nokia N8 (Symbian^3), C7 (Symbian^3), also works on N97 (Symbian^1)</li>
 </ul>
-<h3 style="font-weight: normal; background: #fff; border-left: 7px solid #FFCC33; padding: 5px 0 5px 8px;"><strong>C<strong>-grade</strong></strong> - Basic, non-enhanced HTML experience that is still functional</h3>
+<h3 style="display: block; font-size: 15px !important; font-weight: normal; background: #f0f0f0; border-left: 7px solid #FFCC33; padding: 5px 0 5px 8px;"><strong>C<strong>-grade</strong></strong> - Basic, non-enhanced HTML experience that is still functional</h3>
 <ul>
 	<li><strong>Blackberry4.x</strong>: Tested on the Curve 8330</li>
 	<li><strong>All older smartphone platforms and featurephones</strong> - Any device that doesn't support media queries will receive the basic, C grade experience</li>
 </ul>
-<h3 style="font-weight: normal; background: #fff; border-left: 7px solid #aaaaaa; padding: 6px 0 8px 8px;"><strong>Not Currently Supported in Beta 1</strong></h3>
+<h3 style="display: block; font-size: 15px !important; font-weight: normal; background: #f0f0f0; border-left: 7px solid #aaaaaa; padding: 6px 0 8px 8px;"><strong>Not Officially Supported - </strong>May work, but haven't been thoroughly tested or debugged</h3>
 <ul>
-	<li><strong>Nokia S60</strong> - Targeted for Beta 2 release. A/B grade support will depend on results of device testing.</li>
 	<li><strong>Meego</strong> - Originally a target platform, but Nokia decision to relegate this platform to "experimental", we are considering dropping support.</li>
 	<li><strong>Samsung Bada</strong> - The project doesn't currently have test devices or emulators, but current support is known to be fairly good. Support level undecided for 1.0.</li>
-	<li><strong>Palm WebOS 3.0</strong> - We're hoping to get test devices from Palm soon to start testing but have heard that rendering is quite good in 3.0</li>
-</ul>
-				
-				
-				<p>Since jQuery Mobile is built on the jQuery core, all pages should also work great on most recent versions of desktop browsers too - Firefox, Chrome, Safari, Internet Explorer, Opera, etc.</p>
+</ul>				
 
-				<p>For more information about browser support, view the <a href="https://github.com/jquery/jquery-mobile/wiki/Current-development-status">current browser support status and known issues</a> and the project's target <a href="http://jquerymobile.com/gbs/" rel="external"><strong>graded browser matrix</strong></a>.</p>
 
 
 				</div>

docs/about/intro.html

@@ -38,7 +38,14 @@ <h2>Touch events</h2>
 			<dd>Triggers after a held complete touch event (close to one second).</dd>
 
 			<dt><code>swipe</code></dt>
-			<dd>Triggers when a horizontal drag of 30px or more (and less than 20px vertically) occurs within 1 second duration.</dd>
+			<dd><p>Triggers when a horizontal drag of 30px or more (and less than 20px vertically) occurs within 1 second duration but these can be configured:</p>
+			  <ul>
+			  	<li><code>scrollSupressionThreshold</code> (default: 10px) – More than this horizontal displacement, and we will suppress scrolling</li>
+			  	<li><code>durationThreshold</code> (default: 1000ms) – More time than this, and it isn’t a swipe</li>
+			  	<li><code>horizontalDistanceThreshold</code> (default: 30px) – Swipe horizontal displacement must be more than this.</li>
+			  	<li><code>verticalDistanceThreshold</code> (default: 75px) – Swipe vertical displacement must be less than this.</li>
+			  	</ul>
+			</dd>
 
 			<dt><code>swipeleft</code></dt>
 			<dd>Triggers when a swipe event occurred moving in the left direction.</dd>
@@ -128,6 +135,30 @@ <h2>Page initialization events</h2>
 
 
 
+		<h2>Virtual mouse events</h2>
+		<p>We provide a set of "virtual" click events that normalize mouse and touch events. This allows the developer to register listeners for the basic mouse events, such as mousedown, mousemove, mouseup, and click, and the plugin will take care of registering the correct listeners behind the scenes to invoke the listener at the fastest possible time for that device. This still retains the order of event firing in the traditional mouse environment, should multiple handlers be registered on the same element for different events.</p>
+		<dl>
+			<dt><code>vmouseover</code></dt>
+			<dd>Normalized event for handling touch or mouse <code>mouseover</code> events</dd>
+			
+			<dt><code>vmousedown</code></dt>
+			<dd>Normalized event for handling touch or mouse <code>mousedown</code> events</dd>
+			
+			<dt><code>vmousemove</code></dt>
+			<dd>Normalized event for handling touch or mouse <code>mousemove</code> events</dd>
+			
+			<dt><code>vmouseup</code></dt>
+			<dd>Normalized event for handling touch or mouse <code>mouseup</code> events</dd>
+			
+			<dt><code>vclick</code></dt>
+			<dd>Normalized event for handling touch or mouse <code>click</code> events</dd>
+			
+			<dt><code>vmousecancel</code></dt>
+			<dd>Normalized event for handling touch or mouse <code>mousecancel</code> events</dd>
+		</dl>
+		
+		
+		
 		<h2>Animation Events</h2>
 		<p>jQuery Mobile exposes the <code>animationComplete</code> plugin, which you can utilize after adding or removing a class that applies a CSS transition.</p>
 

docs/about/platforms.html

@@ -65,7 +65,7 @@ <h2>Two column grids</h2>
 	    </fieldset>
 
 
-	    <p>Theme classes (not data-theme attributes) from the <a href="../themes/index.html">theming system</a> can be added to an element, including grids. On the blocks below, we're adding two classes: <code>ui-bar</code> to add the default bar padding and <code>ui-bar-e</code> to apply the background gradient and font styling for the "e" toolbar theme swatch. For illustration purposes, an inline <code>style="height:120px"</code> attribute is also added to each grid to set each to a standard height. </p>
+	    <p>Theme classes (not data-theme attributes) from the <a href="../api/themes.html">theming system</a> can be added to an element, including grids. On the blocks below, we're adding two classes: <code>ui-bar</code> to add the default bar padding and <code>ui-bar-e</code> to apply the background gradient and font styling for the "e" toolbar theme swatch. For illustration purposes, an inline <code>style="height:120px"</code> attribute is also added to each grid to set each to a standard height. </p>
 
 		<div class="ui-grid-a">
 			<div class="ui-block-a"><div class="ui-bar ui-bar-e" style="height:120px">Block A</div></div>