Merge branch 'master' into fastclick

This commit is contained in:
Kin Blas 2011-02-17 13:51:02 -08:00
commit 0850558a31
17 changed files with 137 additions and 62 deletions

View file

@ -92,7 +92,7 @@ $(document).bind("mobileinit", function(){
<dd>jQuery Mobile will automatically handle form submissions through Ajax, when possible.</dd>
<dt>defaultTransition (<em>string</em>, default: 'slide'):</dt>
<dd>Set the default transition for page changes that use Ajax. Set to 'none' for no transitions by default.</dd>
<dd>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.</dd>
<dt>loadingMessage (<em>string</em>, default: "loading"):</dt>
<dd>Set the text that appears when a page is loading. If set to false, the message will not appear at all.</dd>

View file

@ -96,7 +96,7 @@
<label for="radio-choice-2">Dog</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
<label for="radio-choice-3">Hampster</label>
<label for="radio-choice-3">Hamster</label>
<input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4" />
<label for="radio-choice-4">Lizard</label>

View file

@ -46,7 +46,7 @@
&lt;label for=&quot;radio-choice-2&quot;&gt;Dog&lt;/label&gt;
&lt;input type=&quot;radio&quot; name=&quot;radio-choice-1&quot; id=&quot;radio-choice-3&quot; value=&quot;choice-3&quot; /&gt;
&lt;label for=&quot;radio-choice-3&quot;&gt;Hampster&lt;/label&gt;
&lt;label for=&quot;radio-choice-3&quot;&gt;Hamster&lt;/label&gt;
&lt;input type=&quot;radio&quot; name=&quot;radio-choice-1&quot; id=&quot;radio-choice-4&quot; value=&quot;choice-4&quot; /&gt;
&lt;label for=&quot;radio-choice-4&quot;&gt;Lizard&lt;/label&gt;
@ -66,7 +66,7 @@
<label for="radio-pet-2">Dog</label>
<input type="radio" name="radio-pet-1" id="radio-pet-3" value="choice-3" />
<label for="radio-pet-3">Hampster</label>
<label for="radio-pet-3">Hamster</label>
<input type="radio" name="radio-pet-1" id="radio-pet-4" value="choice-4" />
<label for="radio-pet-4">Lizard</label>

View file

@ -72,7 +72,7 @@
<label for="radio-choice-2a">Dog</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3a" value="choice-3" />
<label for="radio-choice-3a">Hampster</label>
<label for="radio-choice-3a">Hamster</label>
<input type="radio" name="radio-choice-1" id="radio-choice-4a" value="choice-4" />
<label for="radio-choice-4a">Lizard</label>
@ -137,7 +137,7 @@
<label for="radio-choice-2b">Dog</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3b" value="choice-3" />
<label for="radio-choice-3b">Hampster</label>
<label for="radio-choice-3b">Hamster</label>
<input type="radio" name="radio-choice-1" id="radio-choice-4b" value="choice-4" />
<label for="radio-choice-4b">Lizard</label>
@ -204,7 +204,7 @@
<label for="radio-choice-2c">Dog</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3c" value="choice-3" />
<label for="radio-choice-3c">Hampster</label>
<label for="radio-choice-3c">Hamster</label>
<input type="radio" name="radio-choice-1" id="radio-choice-4c" value="choice-4" />
<label for="radio-choice-4c">Lizard</label>
@ -272,7 +272,7 @@
<label for="radio-choice-2d">Dog</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3d" value="choice-3" />
<label for="radio-choice-3d">Hampster</label>
<label for="radio-choice-3d">Hamster</label>
<input type="radio" name="radio-choice-1" id="radio-choice-4d" value="choice-4" />
<label for="radio-choice-4d">Lizard</label>
@ -339,7 +339,7 @@
<label for="radio-choice-2e">Dog</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3e" value="choice-3" />
<label for="radio-choice-3e">Hampster</label>
<label for="radio-choice-3e">Hamster</label>
<input type="radio" name="radio-choice-1" id="radio-choice-4e" value="choice-4" />
<label for="radio-choice-4e">Lizard</label>

View file

@ -32,7 +32,7 @@
<h2>Transitions</h2>
<p>Since the dialog is a standard "page", it will open with the standard slide transition that's applied to all pages. And like all pages, you can specify any page transition you want on the dialog by adding the <code>data-transition</code> attribute to the link. To make it feel more dialog-like, we recommend specifying a transition of "pop", "slideup" or "flip".</p>
<p>By default, the dialog will open with a 'pop' transition. Like all pages, you can specify any page transition you want on the dialog by adding the <code>data-transition</code> attribute to the link. To make it feel more dialog-like, we recommend specifying a transition of "pop", "slideup" or "flip".</p>
<code>
&lt;a href=&quot;foo.html&quot; data-rel=&quot;dialog&quot; data-transition=&quot;pop&quot;&gt;Open dialog&lt;/a&gt;

View file

@ -120,7 +120,7 @@ $(function(){
<input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2" />
<label for="radio-choice-2">Dog</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
<label for="radio-choice-3">Hampster</label>
<label for="radio-choice-3">Hamster</label>
<input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4" />
<label for="radio-choice-4">Lizard</label>
</fieldset>

View file

@ -127,7 +127,7 @@ $.widget( "mobile.listview", $.mobile.widget, {
item.find( "p, dl" ).addClass( "ui-li-desc" );
item.find( "li" ).find( "img:eq(0)" ).addClass( "ui-li-thumb" ).each(function() {
$list.find( "li" ).find( "img:eq(0)" ).addClass( "ui-li-thumb" ).each(function() {
$( this ).closest( "li" )
.addClass( $(this).is( ".ui-li-icon" ) ? "ui-li-has-icon" : "ui-li-has-thumb" );
});

View file

@ -135,13 +135,13 @@
isPageTransitioning = false,
//nonsense hash change key for dialogs, so they create a history entry
dialogHashKey = "&ui-state=dialog";
dialogHashKey = "&ui-state=dialog",
//existing base tag?
var $base = $head.children("base"),
hostURL = location.protocol + '//' + location.host,
docLocation = path.get( hostURL + location.pathname ),
docBase = docLocation;
$base = $head.children("base"),
hostURL = location.protocol + '//' + location.host,
docLocation = path.get( hostURL + location.pathname ),
docBase = docLocation;
if ($base.length){
var href = $base.attr("href");
@ -171,7 +171,7 @@
}
//base element management, defined depending on dynamic base tag support
base = $.support.dynamicBaseTag ? {
var base = $.support.dynamicBaseTag ? {
//define base element, for use in routing asset urls that are referenced in Ajax-requested markup
element: ($base.length ? $base : $("<base>", { href: docBase }).prependTo( $head )),
@ -336,7 +336,7 @@
function defaultTransition(){
if(transition === undefined){
transition = $.mobile.defaultTransition;
transition = ( nextPageRole && nextPageRole === 'dialog' ) ? 'pop' : $.mobile.defaultTransition;
}
}
@ -517,12 +517,16 @@
//pre-parse html to check for a data-url,
//use it as the new fileUrl, base path, etc
var all = $("<div></div>"),
redirectLoc;
redirectLoc,
// TODO handle dialogs again
pageElemRegex = /.*(<[^>]*\bdata-role=["']?page["']?[^>]*>).*/,
dataUrlRegex = /\bdata-url=["']?([^"'>]*)["']?/;
//workaround to allow scripts to execute when included in page divs
all.get(0).innerHTML = html;
to = all.find('[data-role="page"], [data-role="dialog"]').first();
redirectLoc = all.find('[data-url]').data('url');
// data-url must be provided for the base tag so resource requests can be directed to the
// correct url. loading into a temprorary element makes these requests immediately
if(pageElemRegex.test(html) && RegExp.$1 && dataUrlRegex.test(RegExp.$1) && RegExp.$1) {
redirectLoc = RegExp.$1;
}
if( redirectLoc ){
if(base){
@ -536,6 +540,10 @@
}
}
//workaround to allow scripts to execute when included in page divs
all.get(0).innerHTML = html;
to = all.find('[data-role="page"], [data-role="dialog"]').first();
//rewrite src and href attrs to use a base url
if( !$.support.dynamicBaseTag ){
var newPath = path.get( fileUrl );

View file

@ -207,4 +207,13 @@
start();
}, 1000);
});
test( "Refresh applys thumb styling", function(){
var ul = $('.ui-page-active ul');
ul.append("<li id='fiz'><img/></li>");
ok(!ul.find("#fiz img").hasClass("ui-li-thumb"));
ul.listview('refresh');
ok(ul.find("#fiz img").hasClass("ui-li-thumb"));
});
})(jQuery);

View file

@ -0,0 +1,8 @@
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div data-role="page" data-url="foo/bar.html"></div>
</body>
</html>

View file

@ -0,0 +1,8 @@
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div data-url='foo/bar/reverse.html' data-role='page'></div>
</body>
</html>

View file

@ -0,0 +1,8 @@
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div data-role='page' data-url='foo/bar/single.html'></div>
</body>
</html>

View file

@ -80,11 +80,23 @@
</div>
<div id="data-url" data-role="page">
<a href="data-url.html"></a>
<a href="data-url-tests/data-url.html"></a>
</div>
<div id="non-data-url" data-role="page">
<a href="non-data-url.html"></a>
<a href="data-url-tests/non-data-url.html"></a>
</div>
<div id="nested-data-url" data-role="page">
<a href="data-url-tests/nested.html"></a>
</div>
<div id="single-quotes-data-url" data-role="page">
<a href="data-url-tests/single-quotes.html"></a>
</div>
<div id="reverse-attr-data-url" data-role="page">
<a href="data-url-tests/reverse-attr.html"></a>
</div>
<div id="ajax-diabled-form" data-role="page">
@ -97,5 +109,13 @@
<form method="POST" id="rand-ajax-form" action="/ajax-disabled-form" data-ajax="foo">
</form>
</div>
<div id="default-trans-dialog" data-role="page">
<a href="#no-trans-dialog" data-rel="dialog"></a>
</div>
<div id="no-trans-dialog" data-role="page">
</div>
</body>
</html>

View file

@ -55,9 +55,6 @@
}, 500);
});
test( "path.get method is working properly", function(){
window.location.hash = "foo"
same($.mobile.path.get(), "foo", "get method returns location.hash minus hash character");
@ -205,25 +202,31 @@
}, 500);
});
asyncTest( "when loading a page where data-url is defined on a sub element set the hash with that url", function(){
location.hash = "";
$("#data-url a").click();
var testDataUrlHash = function(linkSelector, hashRegex){
window.location.hash = "";
$(linkSelector).click();
setTimeout(function(){
ok(location.hash.indexOf("#foo/") >= 0);
ok(hashRegex.test(location.hash));
start();
}, 1000);
}, 600);
stop();
};
test( "when loading a page where data-url is not defined on a sub element hash defaults to the url", function(){
testDataUrlHash("#non-data-url a", /^#data-url-tests\/non-data-url.html$/);
});
asyncTest( "when loading a page where data-url is not defined on a sub element hash defaults to the url", function(){
location.hash = "";
$("#non-data-url a").click();
test( "data url works for nested paths", function(){
testDataUrlHash("#nested-data-url a", /^#foo\/bar.html$/);
});
setTimeout(function(){
ok(location.hash.indexOf("#non-data-url.html") >= 0);
start();
}, 1000);
stop();
test( "data url works for single quoted paths and roles", function(){
testDataUrlHash("#single-quotes-data-url a", /^#foo\/bar\/single.html$/);
});
test( "data url works when role and url are reversed on the page element", function(){
testDataUrlHash("#reverse-attr-data-url a", /^#foo\/bar\/reverse.html$/);
});
})(jQuery);

View file

@ -8,24 +8,24 @@
//TODO centralize class names?
transitionTypes = "in out fade slide flip reverse pop",
isTransitioning = function(page){
return $.grep(transitionTypes.split(" "), function(className, i){
return page.hasClass(className)
return page.hasClass(className);
}).length > 0;
},
isTransitioningIn = function(page){
return page.hasClass("in") && isTransitioning(page);
},
//animationComplete callback queue
callbackQueue = [],
finishPageTransition = function(){
callbackQueue.pop()();
},
clearPageTransitionStack = function(){
stop();
var checkTransitionStack = function(){
@ -33,7 +33,7 @@
setTimeout(function(){
finishPageTransition();
checkTransitionStack();
},0)
},0);
}
else {
start();
@ -41,13 +41,13 @@
};
checkTransitionStack();
},
//wipe all urls
clearUrlHistory = function(){
$.mobile.urlHistory.stack = [];
$.mobile.urlHistory.activeIndex = 0;
};
module('jquery.mobile.navigation.js', {
setup: function(){
@ -55,7 +55,7 @@
$.fn.animationComplete = function(callback){
callbackQueue.unshift(callback);
};
},
teardown: function(){
@ -63,15 +63,15 @@
$.fn.animationComplete = animationCompleteFn;
}
});
QUnit.testStart = function (name) {
clearPageTransitionStack();
clearUrlHistory();
};
test( "changePage applys perspective class to mobile viewport for flip", function(){
$("#foo > a").click();
ok($("body").hasClass(perspective), "has perspective class");
});
@ -83,7 +83,7 @@
test( "changePage applys transition class to mobile viewport for default transition", function(){
$("#baz > a").click();
ok($("body").hasClass(transitioning), "has transitioning class");
});
@ -112,21 +112,21 @@
start();
},0);
});
test( "changePage queues requests", function(){
var firstPage = $("#foo"),
secondPage = $("#bar");
$.mobile.changePage(firstPage);
$.mobile.changePage(secondPage);
stop();
setTimeout(function(){
ok(isTransitioningIn(firstPage), "first page begins transition");
ok(!isTransitioningIn(secondPage), "second page doesn't transition yet");
finishPageTransition();
setTimeout(function(){
ok(!isTransitioningIn(firstPage), "first page transition should be complete");
ok(isTransitioningIn(secondPage), "second page should begin transitioning");
@ -134,5 +134,16 @@
},0);
},0);
});
test( "default transition is pop for a dialog", function(){
expect( 1 );
stop();
setTimeout(function(){
$("#default-trans-dialog > a").click();
ok($("#no-trans-dialog").hasClass("pop"), "expected the pop class to be present but instead was " + $("#no-trans-dialog").attr('class'));
start();
}, 900);
});
})(jQuery);