From e38a25de58e4d6ce8bfe628f16e44e34231fb196 Mon Sep 17 00:00:00 2001 From: scottjehl Date: Wed, 30 Mar 2011 20:52:13 -0400 Subject: [PATCH 01/10] make sure the sticky footer matching is only true if data-ids are specified. This makes "tap" work again when toggling fixed headers and footers. --- js/jquery.mobile.fixHeaderFooter.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/js/jquery.mobile.fixHeaderFooter.js b/js/jquery.mobile.fixHeaderFooter.js index 7c5ebccb..01e1e6a9 100644 --- a/js/jquery.mobile.fixHeaderFooter.js +++ b/js/jquery.mobile.fixHeaderFooter.js @@ -109,9 +109,9 @@ $.fixedToolbars = (function(){ prevFooter = prevPage && prevPage.find( ":jqmData(role='footer')" ); var prevFooterMatches = prevFooter.jqmData( "id" ) === id; - if( prevFooterMatches ){ + if( id && prevFooterMatches ){ stickyFooter = footer; - setTop( stickyFooter.removeClass("fade").appendTo( $.mobile.pageContainer ) ); + setTop( stickyFooter.removeClass( "fade in out" ).appendTo( $.mobile.pageContainer ) ); } }); @@ -122,9 +122,9 @@ $.fixedToolbars = (function(){ if( stickyFooter && stickyFooter.length ){ setTimeout(function(){ - setTop( stickyFooter.appendTo( $this ) ); + setTop( stickyFooter.appendTo( $this ).addClass("fade") ); stickyFooter = null; - },400); + }, 500); } $.fixedToolbars.show(true, this); From 93ddf9d984737234ae254b5c9b84a709d3318313 Mon Sep 17 00:00:00 2001 From: scottjehl Date: Wed, 30 Mar 2011 21:17:52 -0400 Subject: [PATCH 02/10] Syntax fix with data-ajax attr - also making sure [target] is included in the external link check, and that the pathname is removed properly in IE before prefixing. --- js/jquery.mobile.navigation.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/js/jquery.mobile.navigation.js b/js/jquery.mobile.navigation.js index 2be10917..b914f860 100644 --- a/js/jquery.mobile.navigation.js +++ b/js/jquery.mobile.navigation.js @@ -577,12 +577,13 @@ //rewrite src and href attrs to use a base url if( !$.support.dynamicBaseTag ){ var newPath = path.get( fileUrl ); - to.find('[src],link[href],a[rel="external"],a:jqmData(ajax="none")').each(function(){ + to.find( "[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]" ).each(function(){ var thisAttr = $(this).is('[href]') ? 'href' : 'src', thisUrl = $(this).attr(thisAttr); + //if full path exists and is same, chop it - helps IE out - thisUrl.replace( location.protocol + '//' + location.host + location.pathname, '' ); + thisUrl = thisUrl.replace( location.protocol + '//' + location.host + location.pathname, '' ); if( !/^(\w+:|#|\/)/.test(thisUrl) ){ $(this).attr(thisAttr, newPath + thisUrl); From cdccf8f2afbf75fdb6ff58293a3e0f9f5eb8bccd Mon Sep 17 00:00:00 2001 From: scottjehl Date: Wed, 30 Mar 2011 21:32:38 -0400 Subject: [PATCH 03/10] updated the fastclick comment --- js/jquery.mobile.vmouse.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/js/jquery.mobile.vmouse.js b/js/jquery.mobile.vmouse.js index fab2f238..145854a8 100644 --- a/js/jquery.mobile.vmouse.js +++ b/js/jquery.mobile.vmouse.js @@ -17,11 +17,8 @@ // the traditional mouse environment, should multiple handlers be registered // on the same element for different events. // -// The current version simply adds mBind and mUnbind to the $.fn space, -// but we're considering other methods for making this easier. One alternative -// would be to allow users to use virtual mouse event names, such as -// "vmousedown", "vmouseup", etc, to triggerVirtualEvent the traditional jQuery special/custom -// event api, which would then triggerVirtualEvent this same code. +// The current version exposes the following virtual events to jQuery bind methods: +// "vmouseover vmousedown vmousemove vmouseup vclick vmouseout vmousecancel" (function($, window, document, undefined) { From e9e7a78e99a570a25ef94ac527dbbb86246cc29a Mon Sep 17 00:00:00 2001 From: toddparker Date: Wed, 30 Mar 2011 22:31:18 -0400 Subject: [PATCH 04/10] Fixed a minor grammatical error in the pages docs. --- docs/pages/docs-pages.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/pages/docs-pages.html b/docs/pages/docs-pages.html index 393973d6..45098574 100755 --- a/docs/pages/docs-pages.html +++ b/docs/pages/docs-pages.html @@ -116,7 +116,7 @@

A single HTML document can contain multiple 'pages' that are loaded together by stacking multiple divs with a data-role of "page". Each 'page' block needs a unique ID (id="foo") that will be used to link internally between 'pages' (href="#foo"). When a link is clicked, the framework will look for an internal 'page' with the ID and transition it into view.

-

It's important to note if you are linking from a mobile page that was loaded via Ajax to a page with multiple internal pages, you need to add a rel="external" or data-ajax="false" to the link. This tells the framework to do a full page reload to clear out the Ajax hash in the URL. This is critical because Ajax pages use the hash (#) to track the Ajax history, while multiple internal pages use the hash to indicate internal pages so there will be a conflicts.

+

It's important to note if you are linking from a mobile page that was loaded via Ajax to a page that contains multiple internal pages, you need to add a rel="external" or data-ajax="false" to the link. This tells the framework to do a full page reload to clear out the Ajax hash in the URL. This is critical because Ajax pages use the hash (#) to track the Ajax history, while multiple internal pages use the hash to indicate internal pages so there will be conflicts in the hash between these two modes.

For example, a link to a page containing multiple internal pages would look like this:

<a href="multipage.html" rel="external">Multi-page link</a> From 5d93d53090863362fff3ec14ccec1d1313e5ad1f Mon Sep 17 00:00:00 2001 From: scottjehl Date: Wed, 30 Mar 2011 22:53:46 -0400 Subject: [PATCH 05/10] removed the cdn hotlinks - local is best for testing. Also added a link to test Bender's new fix - works fantastic. --- docs/pages/multipage-template.html | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/docs/pages/multipage-template.html b/docs/pages/multipage-template.html index 49463f44..28eabb66 100755 --- a/docs/pages/multipage-template.html +++ b/docs/pages/multipage-template.html @@ -4,9 +4,11 @@ Page Title - - - + + + + + @@ -40,6 +42,7 @@

Bar

I'm the bar page.

Back to foo

+

Or view an external page from here!

From 43ea8df11207a8c443c719892ac6acd0c0244202 Mon Sep 17 00:00:00 2001 From: toddparker Date: Wed, 30 Mar 2011 23:15:27 -0400 Subject: [PATCH 06/10] Fixed missing hyphens in listview theming data- attribues and re-coded some mangled list code examples. Everything is working right again. Closes #992 --- docs/lists/lists-themes.html | 68 +++++++++++++++++++----------------- 1 file changed, 36 insertions(+), 32 deletions(-) diff --git a/docs/lists/lists-themes.html b/docs/lists/lists-themes.html index 53f459ee..60ddcc70 100755 --- a/docs/lists/lists-themes.html +++ b/docs/lists/lists-themes.html @@ -60,13 +60,13 @@

Theming dividers

-

The theme for list dividers can be set by adding the data-dividertheme to the list and specifying a swatch letter. Here is an example of the same list above with swatch "d" set on the dividers.

+

The theme for list dividers can be set by adding the data-divider-theme to the list and specifying a swatch letter. Here is an example of the same list above with swatch "d" set on the dividers.

-<ul data-role="listview" data-inset="true" data-theme="d" data-dividertheme="c"> +<ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="e"> -
    +
    • Divider
    • Inbox 12
    • Outbox 0
      • @@ -75,13 +75,13 @@

      Theming count bubbles

      -

      The theme for count bubbles can be set by adding the data-counttheme to the list and specifying a swatch letter. Here is an example with swatch "e" set on the dividers.

      +

      The theme for count bubbles can be set by adding the data-count-theme to the list and specifying a swatch letter. Here is an example with swatch "e" set on the dividers.

      -<ul data-role="listview" data-inset="true" data-theme="a" data-dividertheme="d" data-counttheme="e"> +<ul data-role="listview" data-inset="true" data-theme="d" data-divider-theme="e" data-count-theme="b"> -
        +
        • Divider
        • Inbox 12
        • Outbox 0
          • @@ -95,15 +95,16 @@ <li data-icon="info"><a href="#">Notices</a></li> <li data-icon="alert"><a href="#">Alerts</a></li> -<li data-icon="false"><a href="#">All Notifications</a></li> +<li data-icon="false"><a href="#">No icon</a></li> -
            + +

            Theming split buttons

            @@ -125,14 +126,15 @@
          -<ul data-role="listview" data-inset="true" data-splittheme="a"> +<ul data-role="listview" data-inset="true" data-split-theme="a"> -

          To specify the color swatch for the icon button on the right, add the data-splittheme to the list and specify a swatch letter. This attribute can also be added to individual split inside list items by adding a data-theme attribute to specific links (see second list item).

          -
            +

            To specify the color swatch for the icon button on the right, add the data-split-theme to the list and specify a swatch letter. This attribute can also be added to individual split inside list items by adding a data-theme attribute to specific links (see second list item).

            + -

            The icon for the split theme can set at the list level by adding the data-spliticon to the list and specifying a standard icon. This attribute can also be added to individual split inside list items by adding a data-icon attribute to specific links (see second list item).

            +

            The icon for the split theme can set at the list level by adding the data-split-icon to the list and specifying a standard icon. This attribute can also be added to individual split inside list items by adding a data-icon attribute to specific links (see second list item).

            -<ul data-role="listview" data-inset="true" data-splittheme="a" data-spliticon="plus"> +<ul data-role="listview" data-inset="true" data-split-theme="d" data-split-icon="delete"> - - + +

            Examples of all basic list swatches

            From 51c79481fc3f61b25398aad74e5bb18deeee5e34 Mon Sep 17 00:00:00 2001 From: scottjehl Date: Wed, 30 Mar 2011 23:28:53 -0400 Subject: [PATCH 07/10] documented hashListeningEnabled. Fixes #1091 --- docs/api/globalconfig.html | 3 +++ 1 file changed, 3 insertions(+) diff --git a/docs/api/globalconfig.html b/docs/api/globalconfig.html index 211448b0..bcae5518 100755 --- a/docs/api/globalconfig.html +++ b/docs/api/globalconfig.html @@ -94,6 +94,9 @@ $(document).bind("mobileinit", function(){
            ajaxFormsEnabled (deprecated boolean, default: true):
            jQuery Mobile will automatically handle form submissions through Ajax, when possible.
            + +
            hashListeningEnabled (boolean, default: true):
            +
            jQuery Mobile will automatically listen and handle changes to the location.hash. Disabling this will prevent jQuery Mobile from handling hash changes, which allows you to handle them yourself, or simply to use simple deep-links within a document that scroll to a particular ID.
            defaultTransition (string, default: 'slide'):
            Set the default transition for page changes that use Ajax. The default transition for dialog presentation is 'pop'. Set to 'none' for no transitions by default.
            From 7ae63cb6cdbad84633cd9a3368126fb1c81e516c Mon Sep 17 00:00:00 2001 From: toddparker Date: Wed, 30 Mar 2011 23:41:29 -0400 Subject: [PATCH 08/10] Updated grid documentation to explain that we're using additional classes an styles, just for illustraiton purposes. --- docs/content/content-grids.html | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/docs/content/content-grids.html b/docs/content/content-grids.html index ee8d6746..8b7f1541 100755 --- a/docs/content/content-grids.html +++ b/docs/content/content-grids.html @@ -26,6 +26,7 @@

            Using multiple column layouts isn't generally recommended on a mobile device because of the narrow screen width, but there are times where you may need to place small elements side-by-side (like buttons or navigation tabs, for example).

            The jQuery Mobile framework provides a simple way to build CSS-based columns through a block style class convention called ui-grid.

            +

            There are two preset configurations layouts — two-column (using the class of ui-grid-a), and three-column (using the class of ui-grid-b) — that can be used in any situation that requires columns. Grids are 100% width, completely invisible (no borders or backgrounds) and don't have padding or margins, so they shouldn't interfere with the styles of elements placed inside them.

            Two column grids

            @@ -47,7 +48,7 @@
            I'm Block B and text inside will wrap.
-

As you see above, by default grid blocks have no styles for appearance; they simply present content side-by-side.

+

As you see above, by default grid blocks have no visual styling; they simply present content side-by-side.

Grid classes can be applied to any container. In this next example, we add ui-grid-a to a fieldset, and apply the ui-block classes to the two buttons inside to stretch them each to 50% of the screen width:

@@ -64,7 +65,7 @@ -

And, grid blocks can adopt presentation styles from the theming system — by adding a height and color swatch reference to the grid blocks, we can achieve this style appearance:

+

Theme classes (not data-theme attributes) from the theming system can be added to an element, including grids. On the blocks below, we're adding two classes: ui-bar to add the default bar padding and ui-bar-e to apply the background gradient and font styling for the "e" toolbar theme swatch. For illustration purposes, an inline style="height:120px" attribute is also added to each grid to set each to a standard height.

Block A
@@ -72,7 +73,7 @@

Three-column grids

-

The other grid layout configuration uses class=ui-grid-b on the parent, and 3 child container elements, each with its respective ui-block-a/b/c class, to create a three-column layout (33/33/33%).

+

The other grid layout configuration uses class=ui-grid-b on the parent, and 3 child container elements, each with its respective ui-block-a/b/c class, to create a three-column layout (33/33/33%). Note: These blocks are also styled with theme classes so the grid layout is clearly visible.


 <div class="ui-grid-b">
@@ -100,7 +101,7 @@
 		
 		
Four-column grids

 		
-		
A four-column, 25/25/25/25% grid is created by specifying class=ui-grid-c on the parent and adding a fourth block.

+		
A four-column, 25/25/25/25% grid is created by specifying class=ui-grid-c on the parent and adding a fourth block. Note: These blocks are also styled with theme classes so the grid layout is clearly visible.

 			
 		

 			
A

@@ -110,7 +111,7 @@
 		

 		
 		
Five-column grids

-		
A five-column, 20/20/20/20/20% grid is created by specifying class=ui-grid-d on the parent and adding a fourth block.

+		
A five-column, 20/20/20/20/20% grid is created by specifying class=ui-grid-d on the parent and adding a fourth block. Note: These blocks are also styled with theme classes so the grid layout is clearly visible.

 			
 		

 			
A


From 77b25a46ea107bcf9bb23fc397439d4478d8f7f7 Mon Sep 17 00:00:00 2001
From: scottjehl 
Date: Wed, 30 Mar 2011 23:52:36 -0400
Subject: [PATCH 09/10] docs typo. Fixes #1150

---
 docs/api/methods.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/api/methods.html b/docs/api/methods.html
index 9a6bf9a8..b87cf13d 100755
--- a/docs/api/methods.html
+++ b/docs/api/methods.html
@@ -37,7 +37,7 @@
 							
  • String, url to transition to ("about/us.html")
    • 
 							
  • jQuery object ($("#about"))
    • 
 							
  • Array specifying two page references [from,to] for transitioning from a known page. From is otherwise assumed to be the current page in view (or $.mobile.activePage ).
    • 
-							
  • Object for sending form data. ({to: url, data: serialized form data, type: "get" or "post"}
    •   
+							
  • Object for sending form data. ({url: url, data: serialized form data, type: "get" or "post"}
    •   
 							
 							
 						

From 612192011b4811f0808a9c420f706f445f77dc27 Mon Sep 17 00:00:00 2001
From: scottjehl 
Date: Thu, 31 Mar 2011 00:22:26 -0400
Subject: [PATCH 10/10] adjusted change event handling to fire change event on
 the selected radio, as Dave suggested, and which matches the native
 triggering. Also, checkboxes change events appear consistent with native
 implementation. Fixes #1206

---
 js/jquery.mobile.forms.checkboxradio.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/js/jquery.mobile.forms.checkboxradio.js b/js/jquery.mobile.forms.checkboxradio.js
index 57302388..9280fc4c 100644
--- a/js/jquery.mobile.forms.checkboxradio.js
+++ b/js/jquery.mobile.forms.checkboxradio.js
@@ -102,8 +102,7 @@ $.widget( "mobile.checkboxradio", $.mobile.widget, {
 
 	_updateAll: function(){
 		this._getInputSet().each(function(){
-			var dVal = $(this).jqmData("cacheVal");
-			if( dVal && dVal !== $(this).is(":checked") || this.inputtype === "checkbox" ){
+			if( $(this).is(":checked") || this.inputtype === "checkbox" ){
 				$(this).trigger("change");
 			}
 		})