Permalink
Browse files

implement #15: allow custom object to pass through jquery mobile chan…

…gePage
  • Loading branch information...
1 parent fcf7e81 commit 1633d5c212a29d6459c49f4d0487d503c494a24e Tobias Bosch committed Feb 1, 2012
Showing with 55 additions and 39 deletions.
  1. +7 −0 Changelog.md
  2. +4 −0 README.md
  3. +27 −18 src/main/webapp/jqmng/navigate.js
  4. +8 −18 src/test/webapp/devSnippetPage.html
  5. +9 −3 src/test/webapp/unit/navigateSpec.js
View
@@ -1,6 +1,13 @@
Changelog
=====================
+1.0.5
+------------
+- Allow an object to be passed to `$navigate` service as first argument to leverage the full power
+ of jqm `changePage` function.
+
+
+
1.0.4
------------
- Update to jQuery Mobile 1.0. The adapter itself was not changed,
View
@@ -172,6 +172,10 @@ Service to change the given page.
- To go back one page use `$navigate('back')`.
- If the `activateFn` function is given, it will be called after the navigation on the target page with
`activateFnParam1, ...` as arguments. The invocation is done before the `pagebeforeshow` event on the target page.
+- If you want to pass special options to the jquery mobile `changePage` function:
+ Pass in an object to the `$navigate` function instead of a pageId. This object will be forwarded
+ to jqm `changePage`. To define the new pageId, this object needs the additional property `target`.
+
### Service $waitDialog
The service `$waitDialog` allows the access to the jquery mobile wait dialog. It provides the following functions:
@@ -36,37 +36,46 @@ define(['jquery', 'angular'], function($, angular) {
*/
function navigate(target, activateFunctionName) {
var activateParams = Array.prototype.slice.call(arguments, 2);
- var parts = splitAtFirstColon(target);
- var animation, pageId;
+ var navigateOptions, pageId;
callActivateFnOnPageChange(activateFunctionName, activateParams);
- if (parts.length === 2 && parts[0] === 'back') {
- var pageId = parts[1];
- var relativeIndex = getIndexInStack(pageId);
- if (relativeIndex === undefined) {
- pageId = jqmChangePage(pageId, undefined);
+ if (typeof target === 'object') {
+ navigateOptions = target;
+ pageId = navigateOptions.target;
+ } else {
+ var parts = splitAtFirstColon(target);
+ if (parts.length === 2 && parts[0] === 'back') {
+ var pageId = parts[1];
+ var relativeIndex = getIndexInStack(pageId);
+ if (relativeIndex === undefined) {
+ pageId = jqmChangePage(pageId, undefined);
+ } else {
+ window.history.go(relativeIndex);
+ }
+ return;
+ } else if (parts.length === 2) {
+ navigateOptions = { transition: parts[0] };
+ pageId = parts[1];
} else {
- window.history.go(relativeIndex);
+ pageId = parts[0];
+ navigateOptions = undefined;
}
- return;
- } else if (parts.length === 2) {
- animation = parts[0];
- pageId = parts[1];
- } else {
- pageId = parts[0];
- animation = undefined;
}
if (pageId === 'back') {
window.history.go(-1);
} else {
- jqmChangePage(pageId, animation);
+ jqmChangePage(pageId, navigateOptions);
}
}
- function jqmChangePage(pageId, animation) {
+ function jqmChangePage(pageId, navigateOptions) {
if (pageId.charAt(0) !== '#') {
pageId = '#' + pageId;
}
- $.mobile.changePage.call($.mobile, pageId, animation);
+ var callArgs = [pageId];
+ if (navigateOptions) {
+ callArgs.push(navigateOptions);
+ }
+ $.mobile.changePage.apply($.mobile, callArgs);
return pageId;
}
@@ -21,28 +21,18 @@
</head>
<body>
-<script>
-
- function TestController($defer) {
- var self = this;
- self.cities = [{"id":1,"name":"Bergisch Gladbach"},{"id":2,"name":"Berlin"},{"id":4,"name":"Frankfurt"},{"id":3,"name":"Köln"},{"id":5,"name":"Leverkusen"},{"id":6,"name":"München"},{"id":7,"name":"Rosenheim"}];
- this.testIt = function() {
- var options = $("#start").find("option");
- console.log(options.eq(1).attr("selected"));
- }
- }
-
- TestController.$inject = ['$defer'];
-</script>
-
-<div data-role="page" id="start" ng:controller="TestController">
+<div data-role="page" id="start">
<div data-role="content">
- <input ng:repeat="item in [1]" name="mysel" id="mysel" type="text">
- {{myNumber}}
- <a href="" ngm:click="testIt()">Test</a>
+ <a href="" ngm:click="$navigate({target: 'page2', transition:'pop'})">Test</a>
+ </div>
+</div>
+<div data-role="page" id="page2">
+ <div data-role="content">
+ <a href="" ngm:click="$navigate('page2:pop','pop')">Test2</a>
</div>
</div>
+
</body>
</html>
@@ -13,12 +13,18 @@ define(['angular'], function(angular) {
});
it('should be able to change the page', function() {
navigate('somePage');
- expect(changePageSpy).toHaveBeenCalledWith('#somePage', undefined);
+ expect(changePageSpy).toHaveBeenCalledWith('#somePage');
+ });
+
+ it('should allow an object to pass through to changePage', function() {
+ var changePageObj = {target: 'somePage', transition: 'someTransition'};
+ navigate(changePageObj);
+ expect(changePageSpy).toHaveBeenCalledWith('#somePage', changePageObj);
});
it('should be able to change the page with a transition', function() {
navigate('someTransition:somePage');
- expect(changePageSpy).toHaveBeenCalledWith('#somePage', 'someTransition');
+ expect(changePageSpy).toHaveBeenCalledWith('#somePage', {transition: 'someTransition'});
});
it('should be able to go back', function() {
@@ -46,7 +52,7 @@ define(['angular'], function(angular) {
];
navigate('back:page4');
expect(goSpy).not.toHaveBeenCalled();
- expect(changePageSpy).toHaveBeenCalledWith('#page4', undefined);
+ expect(changePageSpy).toHaveBeenCalledWith('#page4');
});
});

0 comments on commit 1633d5c

Please sign in to comment.