From 131cc10846a704812ea2ab41d88d1bb87ac4d30d Mon Sep 17 00:00:00 2001 From: unknown Date: Tue, 1 Feb 2011 23:28:40 -0600 Subject: [PATCH 01/40] Added ability to control if $.mobile will automatically load first page/pages on dom ready using $.mobile.autoInitialize. --- js/jquery.mobile.core.js | 62 +++++++++++++++++++++++----------------- tests/unit/core/core.js | 14 ++++++++- 2 files changed, 49 insertions(+), 27 deletions(-) diff --git a/js/jquery.mobile.core.js b/js/jquery.mobile.core.js index 28c174cef31..2ae74555962 100644 --- a/js/jquery.mobile.core.js +++ b/js/jquery.mobile.core.js @@ -57,6 +57,9 @@ gradeA: function(){ return $.support.mediaquery; }, + + //automatically initialize first pages or not. + autoInitialize: true, //TODO might be useful upstream in jquery itself ? keyCode: { @@ -167,37 +170,44 @@ setTimeout(function() { $.event.special.scrollstart.enabled = true; }, 150 ); + }, + + // find and enhance the pages in the dom and transition to the first page. + initializePage: function(){ + //find present pages + var $pages = $( "[data-role='page']" ); + + //add dialogs, set data-url attrs + $pages.add( "[data-role='dialog']" ).each(function(){ + $(this).attr( "data-url", $(this).attr( "id" )); + }); + + //define first page in dom case one backs out to the directory root (not always the first page visited, but defined as fallback) + $.mobile.firstPage = $pages.first(); + + //define page container + $.mobile.pageContainer = $pages.first().parent().addClass( "ui-mobile-viewport" ); + + //cue page loading message + $.mobile.pageLoading(); + + // if hashchange listening is disabled or there's no hash deeplink, change to the first page in the DOM + if( !$.mobile.hashListeningEnabled || !$.mobile.path.stripHash( location.hash ) ){ + $.mobile.changePage( $.mobile.firstPage, false, true, false, true ); + } + // otherwise, trigger a hashchange to load a deeplink + else { + $window.trigger( "hashchange", [ true ] ); + } } }); //dom-ready inits - $(function(){ - //find present pages - var $pages = $( "[data-role='page']" ); - - //add dialogs, set data-url attrs - $pages.add( "[data-role='dialog']" ).each(function(){ - $(this).attr( "data-url", $(this).attr( "id" )); + if($.mobile.autoInitialize){ + $(function(){ + $.mobile.initializePage(); }); - - //define first page in dom case one backs out to the directory root (not always the first page visited, but defined as fallback) - $.mobile.firstPage = $pages.first(); - - //define page container - $.mobile.pageContainer = $pages.first().parent().addClass( "ui-mobile-viewport" ); - - //cue page loading message - $.mobile.pageLoading(); - - // if hashchange listening is disabled or there's no hash deeplink, change to the first page in the DOM - if( !$.mobile.hashListeningEnabled || !$.mobile.path.stripHash( location.hash ) ){ - $.mobile.changePage( $.mobile.firstPage, false, true, false, true ); - } - // otherwise, trigger a hashchange to load a deeplink - else { - $window.trigger( "hashchange", [ true ] ); - } - }); + } //window load event diff --git a/tests/unit/core/core.js b/tests/unit/core/core.js index 2a4d3a44802..a0b4ef09aa4 100644 --- a/tests/unit/core/core.js +++ b/tests/unit/core/core.js @@ -34,7 +34,7 @@ test( "loading the core library triggers mobilinit on the document", function(){ expect( 1 ); - $(window.document).bind('mobileinit', function(event){ + $(window.document).one('mobileinit', function(event){ ok(true); }); @@ -145,5 +145,17 @@ stop(); $.testHelper.reloadLib(libName); }); + + test( "auto initialization does not occur when set to false", function(){ + $(window.document).one('mobileinit', function(event){ + $.mobile.autoInitialize = false; + }); + + $.testHelper.reloadLib(libName); + + ok($("html").hasClass("ui-mobile-rendering"), "Still in rendering state after library load."); + $.mobile.initializePage(); + ok(!$("html").hasClass("ui-mobile-rendering"), "Rendered ok after call to initializePage"); + }); }); })(jQuery); \ No newline at end of file From d7e2d40f8ee15c2653f47bed530bf6d0e27de1af Mon Sep 17 00:00:00 2001 From: toreym Date: Wed, 2 Feb 2011 12:32:01 -0600 Subject: [PATCH 02/40] When autoInitialize is false continue to call pageLoading. --- js/jquery.mobile.core.js | 15 +++++++++++---- tests/unit/core/core.js | 4 +++- 2 files changed, 14 insertions(+), 5 deletions(-) diff --git a/js/jquery.mobile.core.js b/js/jquery.mobile.core.js index 7bc8faa5dc4..d08290e700a 100644 --- a/js/jquery.mobile.core.js +++ b/js/jquery.mobile.core.js @@ -190,8 +190,10 @@ //define page container $.mobile.pageContainer = $pages.first().parent().addClass( "ui-mobile-viewport" ); - //cue page loading message - $.mobile.pageLoading(); + //cue page loading message. pageLoading is already called on dom-ready when autoInitialize is false. + if( $.mobile.autoInitialize ){ + $.mobile.pageLoading(); + } // if hashchange listening is disabled or there's no hash deeplink, change to the first page in the DOM if( !$.mobile.hashListeningEnabled || !$.mobile.path.stripHash( location.hash ) ){ @@ -205,8 +207,13 @@ }); //dom-ready inits - if($.mobile.autoInitialize){ - $($.mobile.initializePage); + if( $.mobile.autoInitialize ){ + $( $.mobile.initializePage ); + } else { + // make sure pageLoading is called with false (not done) + $(function(){ + $.mobile.pageLoading(false); + }); } diff --git a/tests/unit/core/core.js b/tests/unit/core/core.js index a0b4ef09aa4..b313f67c2e6 100644 --- a/tests/unit/core/core.js +++ b/tests/unit/core/core.js @@ -152,10 +152,12 @@ }); $.testHelper.reloadLib(libName); - + ok($("html").hasClass("ui-mobile-rendering"), "Still in rendering state after library load."); + ok($("html").hasClass("ui-loading"), "pageLoading executed successfully"); $.mobile.initializePage(); ok(!$("html").hasClass("ui-mobile-rendering"), "Rendered ok after call to initializePage"); + ok(!$("html").hasClass("ui-loading"), "pageLoading removed loading class"); }); }); })(jQuery); \ No newline at end of file From d3f2fe03847596e6dc8c300685b2a07fd814f2e1 Mon Sep 17 00:00:00 2001 From: toreym Date: Wed, 2 Feb 2011 14:37:11 -0600 Subject: [PATCH 03/40] pageLoading should work without pageContainer set. Append loader to body instead of pageContainer. added internal dom-ready for initializePage. --- js/jquery.mobile.core.js | 57 +++++++++++++++++++--------------------- tests/unit/core/core.js | 1 + 2 files changed, 28 insertions(+), 30 deletions(-) diff --git a/js/jquery.mobile.core.js b/js/jquery.mobile.core.js index d08290e700a..0b5b3cd88aa 100644 --- a/js/jquery.mobile.core.js +++ b/js/jquery.mobile.core.js @@ -146,7 +146,7 @@ var activeBtn =$( "." + $.mobile.activeBtnClass ).first(); $loader - .appendTo( $.mobile.pageContainer ) + .appendTo( 'body' ) //position at y center (if scrollTop supported), above the activeBtn (if defined), or just 100px from top .css( { top: $.support.scrollTop && $(window).scrollTop() + $(window).height() / 2 || @@ -176,44 +176,41 @@ // find and enhance the pages in the dom and transition to the first page. initializePage: function(){ - //find present pages - var $pages = $( "[data-role='page']" ); + // when dom-ready + $(function(){ + //find present pages + var $pages = $( "[data-role='page']" ); - //add dialogs, set data-url attrs - $pages.add( "[data-role='dialog']" ).each(function(){ - $(this).attr( "data-url", $(this).attr( "id" )); - }); - - //define first page in dom case one backs out to the directory root (not always the first page visited, but defined as fallback) - $.mobile.firstPage = $pages.first(); + //add dialogs, set data-url attrs + $pages.add( "[data-role='dialog']" ).each(function(){ + $(this).attr( "data-url", $(this).attr( "id" )); + }); - //define page container - $.mobile.pageContainer = $pages.first().parent().addClass( "ui-mobile-viewport" ); + //define first page in dom case one backs out to the directory root (not always the first page visited, but defined as fallback) + $.mobile.firstPage = $pages.first(); - //cue page loading message. pageLoading is already called on dom-ready when autoInitialize is false. - if( $.mobile.autoInitialize ){ - $.mobile.pageLoading(); - } + //define page container + $.mobile.pageContainer = $pages.first().parent().addClass( "ui-mobile-viewport" ); - // if hashchange listening is disabled or there's no hash deeplink, change to the first page in the DOM - if( !$.mobile.hashListeningEnabled || !$.mobile.path.stripHash( location.hash ) ){ - $.mobile.changePage( $.mobile.firstPage, false, true, false, true ); - } - // otherwise, trigger a hashchange to load a deeplink - else { - $window.trigger( "hashchange", [ true ] ); - } + // if hashchange listening is disabled or there's no hash deeplink, change to the first page in the DOM + if( !$.mobile.hashListeningEnabled || !$.mobile.path.stripHash( location.hash ) ){ + $.mobile.changePage( $.mobile.firstPage, false, true, false, true ); + } + // otherwise, trigger a hashchange to load a deeplink + else { + $window.trigger( "hashchange", [ true ] ); + } + }); } }); //dom-ready inits + // make sure pageLoading is called with false (not done) + $(function(){ + $.mobile.pageLoading(false); + }); if( $.mobile.autoInitialize ){ - $( $.mobile.initializePage ); - } else { - // make sure pageLoading is called with false (not done) - $(function(){ - $.mobile.pageLoading(false); - }); + $.mobile.initializePage(); } diff --git a/tests/unit/core/core.js b/tests/unit/core/core.js index b313f67c2e6..58ea64619ec 100644 --- a/tests/unit/core/core.js +++ b/tests/unit/core/core.js @@ -155,6 +155,7 @@ ok($("html").hasClass("ui-mobile-rendering"), "Still in rendering state after library load."); ok($("html").hasClass("ui-loading"), "pageLoading executed successfully"); + ok($(".ui-loader").length, "loader is present"); $.mobile.initializePage(); ok(!$("html").hasClass("ui-mobile-rendering"), "Rendered ok after call to initializePage"); ok(!$("html").hasClass("ui-loading"), "pageLoading removed loading class"); From db88c4fb93f6d7d901dde3c26d219428967f66af Mon Sep 17 00:00:00 2001 From: Alex Kovar Date: Wed, 2 Feb 2011 12:46:04 -0600 Subject: [PATCH 04/40] externalize $.mobile.urlHistory.clear function --- js/jquery.mobile.navigation.js | 6 ------ tests/unit/navigation/navigation_transitions.js | 8 +++++++- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/js/jquery.mobile.navigation.js b/js/jquery.mobile.navigation.js index 179d0b81722..4297851a4ad 100644 --- a/js/jquery.mobile.navigation.js +++ b/js/jquery.mobile.navigation.js @@ -117,12 +117,6 @@ urlHistory.stack = urlHistory.stack.slice( 0, urlHistory.activeIndex + 1 ); }, - //wipe all urls - clear: function(){ - urlHistory.stack = []; - urlHistory.activeIndex = 0; - }, - //disable hashchange event listener internally to ignore one change //toggled internally when location.hash is updated to match the url of a successful page load ignoreNextHashChange: true diff --git a/tests/unit/navigation/navigation_transitions.js b/tests/unit/navigation/navigation_transitions.js index 80951f86733..7f914dd0f47 100644 --- a/tests/unit/navigation/navigation_transitions.js +++ b/tests/unit/navigation/navigation_transitions.js @@ -40,6 +40,12 @@ } }; checkTransitionStack(); + }, + + //wipe all urls + clearUrlHistory = function(){ + $.mobile.urlHistory.stack = []; + $.mobile.urlHistory.activeIndex = 0; }; @@ -60,7 +66,7 @@ QUnit.testStart = function (name) { clearPageTransitionStack(); - $.mobile.urlHistory.clear(); + clearUrlHistory(); }; test( "changePage applys perspective class to mobile viewport for flip", function(){ From 49d2344fc8e956365ff1c9a4c411d7a03b7c74d2 Mon Sep 17 00:00:00 2001 From: Alex Kovar Date: Wed, 2 Feb 2011 12:47:50 -0600 Subject: [PATCH 05/40] remove extra timeout --- tests/unit/navigation/navigation_transitions.js | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/tests/unit/navigation/navigation_transitions.js b/tests/unit/navigation/navigation_transitions.js index 7f914dd0f47..249ed887787 100644 --- a/tests/unit/navigation/navigation_transitions.js +++ b/tests/unit/navigation/navigation_transitions.js @@ -125,14 +125,12 @@ ok(isTransitioningIn(firstPage), "first page begins transition"); ok(!isTransitioningIn(secondPage), "second page doesn't transition yet"); + finishPageTransition(); + setTimeout(function(){ - finishPageTransition(); - - setTimeout(function(){ - ok(!isTransitioningIn(firstPage), "first page transition should be complete"); - ok(isTransitioningIn(secondPage), "second page should begin transitioning"); - start(); - },0); + ok(!isTransitioningIn(firstPage), "first page transition should be complete"); + ok(isTransitioningIn(secondPage), "second page should begin transitioning"); + start(); },0); },0); }); From a61ade5316f472b2a4813e23631acd02560393b7 Mon Sep 17 00:00:00 2001 From: Alex Kovar Date: Wed, 2 Feb 2011 13:10:40 -0600 Subject: [PATCH 06/40] fixed base undefined error in firefox --- js/jquery.mobile.navigation.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/js/jquery.mobile.navigation.js b/js/jquery.mobile.navigation.js index 4297851a4ad..729e4e647cd 100644 --- a/js/jquery.mobile.navigation.js +++ b/js/jquery.mobile.navigation.js @@ -556,7 +556,9 @@ error: function() { $.mobile.pageLoading( true ); removeActiveLinkClass(true); - base.set(path.get()); + if(base){ + base.set(path.get()); + } $("

Error Loading Page

") .css({ "display": "block", "opacity": 0.96, "top": $(window).scrollTop() + 100 }) .appendTo( $.mobile.pageContainer ) From 5a92146e3ca67fcd0567fc077903f8551914fde1 Mon Sep 17 00:00:00 2001 From: scottjehl Date: Wed, 2 Feb 2011 20:02:04 -0500 Subject: [PATCH 07/40] property should not be defined in $.mobile. --- js/jquery.mobile.core.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/js/jquery.mobile.core.js b/js/jquery.mobile.core.js index 0b5b3cd88aa..aff19ed2518 100644 --- a/js/jquery.mobile.core.js +++ b/js/jquery.mobile.core.js @@ -51,8 +51,6 @@ //configure meta viewport tag's content attr: metaViewportContent: "width=device-width, minimum-scale=1, maximum-scale=1", - nativeSelectMenus: false, - //support conditions that must be met in order to proceed gradeA: function(){ return $.support.mediaquery; From 87b3a52266e9700395f94b558796e25aa7292914 Mon Sep 17 00:00:00 2001 From: John Bender Date: Tue, 1 Feb 2011 22:17:07 -0800 Subject: [PATCH 08/40] whitespace in core tests --- tests/unit/core/core.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/tests/unit/core/core.js b/tests/unit/core/core.js index 58ea64619ec..0d0f4087ee3 100644 --- a/tests/unit/core/core.js +++ b/tests/unit/core/core.js @@ -119,12 +119,12 @@ ok(firstPage.parent().hasClass('ui-mobile-viewport')); }); - test( "mobile page container is the first page's parent", function(){ - var firstPage = findFirstPage(); - $.testHelper.reloadLib(libName); + test( "mobile page container is the first page's parent", function(){ + var firstPage = findFirstPage(); + $.testHelper.reloadLib(libName); - same($.mobile.pageContainer, firstPage.parent()); - }); + same($.mobile.pageContainer, firstPage.parent()); + }); test( "page loading is called on document ready", function(){ $.testHelper.alterExtend({ pageLoading: function(){ @@ -145,7 +145,7 @@ stop(); $.testHelper.reloadLib(libName); }); - + test( "auto initialization does not occur when set to false", function(){ $(window.document).one('mobileinit', function(event){ $.mobile.autoInitialize = false; From ae52fe71af4e0aaad39062c25cc008f6c7eab717 Mon Sep 17 00:00:00 2001 From: John Bender Date: Wed, 2 Feb 2011 23:03:07 -0800 Subject: [PATCH 09/40] added autoInitialize documentation --- docs/api/globalconfig.html | 77 ++++++++++++++++++++------------------ 1 file changed, 40 insertions(+), 37 deletions(-) diff --git a/docs/api/globalconfig.html b/docs/api/globalconfig.html index 361f8feb497..8b5a1d17a76 100755 --- a/docs/api/globalconfig.html +++ b/docs/api/globalconfig.html @@ -1,14 +1,14 @@ - - + + - - jQuery Mobile Docs - Configuring default settings - + + jQuery Mobile Docs - Configuring default settings + - - + +
@@ -19,10 +19,10 @@

Configuring Defaults

Working with jQuery Mobile's Auto-initialization

Unlike other jQuery projects, such as jQuery and jQuery UI, jQuery Mobile automatically applies many markup enhancements as soon as it loads (long before document.ready event fires). These enhancements are applied based on jQuery Mobile's default configuration, which is designed to work with common scenarios, but may or may not match your particular needs. Fortunately, these settings are easy to configure.

- +

The mobileinit event

When the jQuery Mobile starts to execute, it triggers a mobileinit event on the document object, to which you can bind to apply overrides to jQuery Mobile's defaults.

- + 
 				
 $(document).bind("mobileinit", function(){
@@ -30,7 +30,7 @@ 
The mobileinit event

 });
- +

Because the mobileinit event is triggered immediately upon execution, you'll need to bind your event handler before jQuery Mobile is loaded. Thus, we recommend linking to your JavaScript files in the following order:

@@ -39,10 +39,10 @@ 
The mobileinit event

 <script src="custom-scripting.js"></script>
 <script src="jquery-mobile.js"></script>
 				
-
- + +

Within this event binding, you can configure defaults either by extending the $.mobile object using jQuery's $.extend method:

- + 
 				
 $(document).bind("mobileinit", function(){
@@ -52,7 +52,7 @@ 
The mobileinit event

 });
- +

...or by setting them individually:

 				
@@ -61,53 +61,56 @@ 
The mobileinit event

 });
- - + +

Configurable options

The following defaults are configurable via the $.mobile object:

- +
subPageUrlKey (string, default: "ui-page"):
The url parameter used for referencing widget-generated sub-pages (such as those generated by nested listviews). Translates to to example.html&ui-page=subpageIdentifier. The hash segment before &ui-page= is used by the framework for making an Ajax request to the URL where the sub-page exists.
- +
nonHistorySelectors (string, default: "dialog"):
Anchor links with a data-rel attribute value, or pages with a data-role value, that match these selectors will not be trackable in history (they won't update the location.hash and won't be bookmarkable).
- - -
activePageClass (string, default: "ui-page-active"):
+ + +
activePageClass (string, default: "ui-page-active"):
The class assigned to page currently in view, and during transitions
- - -
activeBtnClass (string, default: "ui-page-active"):
+ + +
activeBtnClass (string, default: "ui-page-active"):
The class used for "active" button state, from CSS framework.
- -
ajaxEnabled (boolean, default: true):
+ +
ajaxEnabled (boolean, default: true):
jQuery Mobile will automatically handle link clicks and form submissions through Ajax, when possible. If false, url hash listening will be disabled as well, and urls will load as regular http requests.
-
ajaxLinksEnabled (deprecated boolean, default: true):
+
ajaxLinksEnabled (deprecated boolean, default: true):
jQuery Mobile will automatically handle link clicks through Ajax, when possible.
-
ajaxFormsEnabled (deprecated boolean, default: true):
+
ajaxFormsEnabled (deprecated boolean, default: true):
jQuery Mobile will automatically handle form submissions through Ajax, when possible.
-
defaultTransition (string, default: 'slide'):
+
autoInitialize (boolean, default: true):
+
Auto initialize, when set to false, will defer the enhancement of your embeded pages until 
 $.mobile.initializePage();
is invoked explicitly. By default the page is enhanced when the dom is ready.
+ +
defaultTransition (string, default: 'slide'):
Set the default transition for page changes that use Ajax. Set to 'none' for no transitions by default.
- -
loadingMessage (string, default: "loading"):
+ +
loadingMessage (string, default: "loading"):
Set the text that appears when a page is loading. If set to false, the message will not appear at all.
- -
metaViewportContent (string, default: "width=device-width, minimum-scale=1, maximum-scale=1"):
+ +
metaViewportContent (string, default: "width=device-width, minimum-scale=1, maximum-scale=1"):
Configure the auto-generated meta viewport tag's content attribute. If false, no meta tag will be appended to the DOM.
-
gradeA (function that returns a boolean, default: a function returning the value of $.support.mediaquery):
+
gradeA (function that returns a boolean, default: a function returning the value of $.support.mediaquery):
Any support conditions that must be met in order to proceed.
- - + +
- \ No newline at end of file + From 5bc25f52ee4dd4e12173c7d72bc60239846afb6f Mon Sep 17 00:00:00 2001 From: John Bender Date: Wed, 2 Feb 2011 23:46:20 -0800 Subject: [PATCH 10/40] added step tests for keypress, removed data-step attribute check in favor of html5 range step attribute --- js/jquery.mobile.forms.slider.js | 2 +- tests/unit/slider/index.html | 4 ++++ tests/unit/slider/slider_events.js | 18 +++++++++++++++++- 3 files changed, 22 insertions(+), 2 deletions(-) diff --git a/js/jquery.mobile.forms.slider.js b/js/jquery.mobile.forms.slider.js index 9cac74b4bfa..61fac56f56e 100644 --- a/js/jquery.mobile.forms.slider.js +++ b/js/jquery.mobile.forms.slider.js @@ -34,7 +34,7 @@ $.widget( "mobile.slider", $.mobile.widget, { }, min = (cType == 'input') ? parseFloat(control.attr('min')) : 0, max = (cType == 'input') ? parseFloat(control.attr('max')) : control.find('option').length-1, - step = window.parseFloat(control.attr('data-step') || 1), + step = window.parseFloat(control.attr('step') || 1), slider = $('
'), handle = $('') .appendTo(slider) diff --git a/tests/unit/slider/index.html b/tests/unit/slider/index.html index 02787f98a8c..a8fc034d86b 100644 --- a/tests/unit/slider/index.html +++ b/tests/unit/slider/index.html @@ -77,6 +77,10 @@

+
+ +
+