You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@isis.apache.org by da...@apache.org on 2012/01/15 21:47:55 UTC
svn commit: r1231748 - in
/incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp:
jquery/jquery-1.7.1.js jquery/jquery-1.7.1.min.js mobile/app.js
mobile/index.html
Author: danhaywood
Date: Sun Jan 15 20:47:55 2012
New Revision: 1231748
URL: http://svn.apache.org/viewvc?rev=1231748&view=rev
Log:
ISIS-170: more progress on the custom jqmobile app for onlinedemo app
Removed:
incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/jquery/jquery-1.7.1.js
incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/jquery/jquery-1.7.1.min.js
Modified:
incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/app.js
incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/index.html
Modified: incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/app.js
URL: http://svn.apache.org/viewvc/incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/app.js?rev=1231748&r1=1231747&r2=1231748&view=diff
==============================================================================
--- incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/app.js (original)
+++ incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/app.js Sun Jan 15 20:47:55 2012
@@ -1,27 +1,59 @@
-refreshList = function(items, selector, templateSelector) {
+queryParamsFor = function (href) {
+ var vars = [], hash;
+ var hashes = href.slice(href.indexOf('?') + 1).split('&');
+ for(var i = 0; i < hashes.length; i++)
+ {
+ hash = hashes[i].split('=');
+ vars.push(hash[0]);
+ vars[hash[0]] = urldecode(hash[1]);
+ }
+ return vars;
+}
+
+// from http://phpjs.org/functions/urlencode:573
+urlencode = function(str) {
+ str = (str + '').toString();
+ return encodeURIComponent(str).replace(/!/g, '%21').replace(/'/g, '%27').replace(/\(/g, '%28').replace(/\)/g, '%29').replace(/\*/g, '%2A').replace(/%20/g, '+');
+};
+
+// from http://phpjs.org/functions/urldecode:572
+urldecode = function(str) {
+ return decodeURIComponent((str + '').replace(/\+/g, '%20'));
+};
+
+
+applyTemplate = function(data, selector, templateSelector) {
$(selector).empty();
$(templateSelector)
- .tmpl(items)
+ .tmpl(data)
.appendTo(selector);
+}
+
+refreshList = function(data, selector, templateSelector) {
+ applyTemplate(data, selector, templateSelector);
$(selector).listview("refresh");
}
+
login = function() {
var username = $("#username").val();
- if (!username) {
- $("#login label.error").text("username required").show()
- .fadeOut(1500);
- return false;
- //username = "sven";
- }
-
var password = $("#password").val();
- if (!password) {
- $("#login label.error").text("password required").show()
- .fadeOut(1500);
- return false;
- //password = "pass";
- }
+
+ username="sven";
+ password="pass";
+
+// if (!username) {
+// $("#login label.error").text("username required").show()
+// .fadeOut(1500);
+// return false;
+// }
+//
+// if (!password) {
+// $("#login label.error").text("password required").show()
+// .fadeOut(1500);
+// password = "pass";
+// return false;
+// }
$("#login").data("userCredentials", {
"username" : username,
@@ -30,32 +62,58 @@ login = function() {
return true;
}
-
-todaysTasks = function() {
+pageForTodaysTasks = function() {
var username = $("#login").data("userCredentials").username;
var password = $("#login").data("userCredentials").password;
//$("#todays-tasks .username").text(username)
$.ajax({
- url : "http://localhost:8080/services/toDoItems/actions/toDosForToday/invoke",
+ url : "/services/toDoItems/actions/toDosForToday/invoke",
dataType : 'json',
username : username,
password : password,
success : function(data) {
+ var items = $.map(data.result.value, function(value, i){
+ return {"href": urlencode(value.href), "title":value.title}
+ });
refreshList(
- data.result.value,
+ items,
"#todays-tasks ul.tasks",
"#todays-tasks .tasks-tmpl");
}
});
};
+pageForTask = function(e,f,g) {
+ var username = $("#login").data("userCredentials").username;
+ var password = $("#login").data("userCredentials").password;
+
+ var queryParams = queryParamsFor(window.location.href);
+ var href = queryParams.href;
+
+ $.ajax({
+ url : href,
+ dataType : 'json',
+ username : username,
+ password : password,
+ success : function(data) {
+ var items = data.members;
+ applyTemplate(
+ items,
+ "#task div.task",
+ "#task .task-tmpl");
+ $("#task").page("refresh");
+ }
+ });
+};
+
$(function() {
$(document).bind("mobileinit", function(){
$.mobile.ajaxEnabled=false;
});
$(document).delegate("#login a", "click", login);
- $(document).delegate("#todays-tasks", "pagebeforeshow", todaysTasks);
+ $(document).delegate("#todays-tasks", "pagebeforeshow", pageForTodaysTasks);
+ $(document).delegate("#task", "pagebeforeshow", pageForTask);
});
Modified: incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/index.html
URL: http://svn.apache.org/viewvc/incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/index.html?rev=1231748&r1=1231747&r2=1231748&view=diff
==============================================================================
--- incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/index.html (original)
+++ incubator/isis/trunk/examples/onlinedemo/webapp/src/main/webapp/mobile/index.html Sun Jan 15 20:47:55 2012
@@ -18,10 +18,9 @@
</head>
<body>
+ <div data-role="page" id="login">
- <div data-role="page" id="login" data-theme="b">
-
- <div data-role="header" data-theme="b">
+ <div data-role="header">
<h1>Login</h1>
</div>
<!-- /header -->
@@ -46,9 +45,9 @@
</div>
- <div data-role="page" id="todays-tasks" data-theme="b">
+ <div data-role="page" id="todays-tasks">
- <div data-role="header" data-theme="b">
+ <div data-role="header">
<a href="#login" data-icon="back" data-rel="back">Logout</a>
<h1>Today's tasks</h1>
</div>
@@ -56,16 +55,37 @@
<div data-role="content">
<br/>
- <ul data-role="listview" data-theme="b" class="tasks"></ul>
+ <ul data-role="listview" class="tasks"></ul>
</div>
<script class="tasks-tmpl" type="text/x-jquery-tmpl">
- <li data-theme="b">
- <a href="#">${title}</a>
+ <li>
+ <a href="#task?href=${href}">${title}</a>
</li>
</script>
</div>
+ <div data-role="page" id="task">
+
+ <div data-role="header">
+ <a href="#tasks" data-icon="back" data-rel="back">Back</a>
+ <h1>Task</h1>
+ </div>
+
+ <div data-role="content">
+ <br/>
+ <div class="task"></div>
+ </div>
+
+ <script class="task-tmpl" type="text/x-jquery-tmpl">
+
+ <label for="${id}">${id}:</label>
+ <input type="text"
+ name="${id}" id="${id}" value="${value}" placeholder="${id}"
+ class="required"/>
+
+ </script>
+ </div>
<div data-role="page" id="settings" data-add-back-btn="true">
@@ -83,11 +103,11 @@
<div data-role="page" id="popup">
- <div data-role="header" data-theme="e">
+ <div data-role="header">
<h1>Dialog</h1>
</div>
- <div data-role="content" data-theme="d">
+ <div data-role="content">
<h2>Popup</h2>
<p>
I have an id of "popup" on my page container and only look like a