Author: scottbw
Date: Mon Mar 14 20:58:10 2011
New Revision: 1081558
URL: http://svn.apache.org/viewvc?rev=1081558&view=rev
Log:
Quite a few changes: I've made the Settings page into a modal dialog, made a
single Detail page rather than spawn new pages on viewing entries, got the
Properties working more reliably, and fixed a weird refresh bug
Modified:
incubator/wookie/trunk/widgets/freeder/index.html
incubator/wookie/trunk/widgets/freeder/scripts/controller.js
incubator/wookie/trunk/widgets/freeder/scripts/properties.js
Modified: incubator/wookie/trunk/widgets/freeder/index.html
URL:
http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/freeder/index.html?rev=1081558&r1=1081557&r2=1081558&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/freeder/index.html (original)
+++ incubator/wookie/trunk/widgets/freeder/index.html Mon Mar 14 20:58:10 2011
@@ -25,47 +25,40 @@
<title>Freeder</title>
</head>
<body onLoad="Controller.init()">
- <div data-role="page" id="storiesIndex">
-
- <div data-role="header" data-position="fixed">
- <h4 id="storiesIndex-title">Freeder</h4>
+ <div data-role="page" id="home">
+ <div data-role="header">
+ <h4 id="story-index-title">Freeder</h4>
<a onClick="Controller.update()"
data-role="button" data-icon="refresh" data-iconpos="notext">Refresh</a>
- <a href="#settings" data-role="button"
data-icon="gear" data-iconpos="notext">Settings</a>
+ <a href="#settings" data-role="button"
data-rel="dialog" data-transition="pop" data-icon="gear"
data-iconpos="notext">Settings</a>
</div> <!-- /header -->
- <div data-role="content">
+ <div data-role="content" class="ui-content">
<ul data-role="listview" id="stories-listview">
</ul>
</div><!-- /content -->
-
- <!--
- <div data-role="footer" data-position="fixed">
- <h4>Footer</h4>
- </div> /footer -->
</div><!-- /page -->
-
- <div data-role="page" id="settings">
-
- <div data-role="header" data-position="fixed">
- <h4>Settings</h4>
+
+ <div data-role="page" id="story-detail">
+ <div data-role="header">
+ <h4 id="story-detail-title">Story Title</h4>
</div> <!-- /header -->
+ <div id="story-detail-content" data-role="content">
+ </div><!-- /content -->
+ </div><!-- /page -->
+
+ <!-- Settings Dialog -->
+ <div data-role="dialog" id="settings">
<div data-role="content" id="settings-content">
- <form action="" method="post">
<div data-role="fieldcontain">
- <label for="feedURL">Feed
URL:</label>
- <input type="url"
name="feedURL" id="feedURL" />
+ <label for="input-url">Feed
URL:</label>
+ <input type="url"
name="input-url" id="input-url" />
</div>
<div data-role="fieldcontain">
- <button type="submit"
onClick="Properties.submitForm(this.form)" value="save-settings"
name="save-settings">Save</button>
+ <div id="button"
data-role="button" onClick="Properties.submitForm()">Save</div>
+ <a href="#home"
data-transition="pop" data-direction="reverse" data-role="button">Cancel</div>
</div>
- </form>
</div><!-- /content -->
-
- <!--
- <div data-role="footer" data-position="fixed">
- <h4>Footer</h4>
- </div> /footer -->
</div><!-- /page -->
</body>
</html>
\ No newline at end of file
Modified: incubator/wookie/trunk/widgets/freeder/scripts/controller.js
URL:
http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/freeder/scripts/controller.js?rev=1081558&r1=1081557&r2=1081558&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/freeder/scripts/controller.js (original)
+++ incubator/wookie/trunk/widgets/freeder/scripts/controller.js Mon Mar 14
20:58:10 2011
@@ -20,53 +20,57 @@
* This is used to wire up the view and model with actions
*/
var Controller = {
- init:function() {
+ init:function() {
+ // Populate the feed settings form
+ $("#input-url").val(Properties.getFeedURL());
+
+ // Load the feed
Controller.update();
},
/**
- * Update the hello world message, and the updated time
+ * Load the feed
*/
- items: [],
update:function() {
- $.mobile.pageLoading();
- jQuery.getFeed({
- url: Widget.proxify(Properties.getFeedURL()),
- success: function(feed) {
- Controller.items = feed.items;
- var index = $('#stories-listview');
- index.empty();
- $.each(Controller.items, function(key, item) {
- index.append($("<li/>")
- .append($("<a/>")
-
.attr("onClick", "Controller.gotoStory(" + key + ")")
-
.text(item.title)));
- })
- index.listview("refresh");
- }
- });
- $.mobile.pageLoading(true);
- },
+ $.mobile.pageLoading();
+ var feedUrl = Widget.proxify(Properties.getFeedURL());
+ $.getFeed({
+ url: feedUrl,
+ success: Controller.updateFeed
+ });
+ },
+
+ /*
+ * Refresh the feed list
+ */
+ updateFeed: function(feed){
+ $.mobile.pageLoading(true);
+ var index = $('#stories-listview');
+ index.empty();
+ var items = feed.items
+ Controller.items = items;
+ $.each(items, function(key, item) {
+ index.append($("<li/>")
+ .append($("<a/>")
+ .text(item.title || "Untitled" )
+ .attr("onClick", "Controller.gotoStory(" + key
+ ")")
+ )
+ )
+ });
+ index.listview("refresh");
+ },
/**
- * Create the page for a given story and navigate to it.
+ * Update the story details page for a given story and navigate to it.
*/
gotoStory:function(key) {
- item = Controller.items[key];
- var header = $('<div data-role="header"
data-position="fixed"></div>')
- .append("<h4>" + item.title + "</h4>")
- //var footer = $('<div data-role="footer"
data-position="fixed"><h4>Footer<h4></div>');
- var content = $("<div data-role='content'/>")
- .append($('<h2>' + item.title + '</h2>'))
- .append($('<div>' + item.description + '</div>')
- .append($('<div><a href="' + item.link + '">Read original</a>')))
-
- $.mobile.pageContainer.append($("<div data-role='page'/>")
- .attr("id", key)
- .attr("data-url", key)
- .append(header)
- .append(content));
- $('#' + key).page();
- $.mobile.changePage("#" + key);
+ item = Controller.items[key];
+ $("#story-detail-title").text(item.title);
+ $("#story-detail-content").empty();
+ $("#story-detail-content")
+ .append($('<h2>' + item.title + '</h2>'))
+ .append($('<div>' + item.description + '</div>')
+ .append($('<div><a href="' + item.link + '">Read original</a>')))
+ $.mobile.changePage("#story-detail");
}
}
\ No newline at end of file
Modified: incubator/wookie/trunk/widgets/freeder/scripts/properties.js
URL:
http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/freeder/scripts/properties.js?rev=1081558&r1=1081557&r2=1081558&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/freeder/scripts/properties.js (original)
+++ incubator/wookie/trunk/widgets/freeder/scripts/properties.js Mon Mar 14
20:58:10 2011
@@ -21,20 +21,15 @@
var Properties = {
submitForm: function() {
- var url = $("#feedURL").val();
- Widget.preferences.setItem("feedURL", url);
- Controller.update();
- $.mobile.changePage("#storiesIndex");
+ Widget.preferences.setItem("feedURL", $("#input-url").val());
+ Controller.update();
+ $.mobile.changePage("#home", "pop", true);
},
/**
* Get the base URL for the Simal REST interface.
*/
getFeedURL: function() {
- var url = Widget.preferences.getItem("feedURL");
- if (url == undefined) {
- url = "http://osswatch.jiscinvolve.org/feed";;
- }
- return url;
+ return Widget.preferences.getItem("feedURL") ||
"http://osswatch.jiscinvolve.org/feed";;
}
}
\ No newline at end of file
