You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@wookie.apache.org by rg...@apache.org on 2012/09/07 11:02:26 UTC
svn commit: r1381940 - in /incubator/wookie/trunk/widgets/templates:
testWidgets/walkthroughTestWidget/ walkthrough/
walkthrough/lib/jqueryMobile/ walkthrough/scripts/ walkthrough/style/
Author: rgardler
Date: Fri Sep 7 09:02:26 2012
New Revision: 1381940
URL: http://svn.apache.org/viewvc?rev=1381940&view=rev
Log:
improved save action. Set question set from URL. Updated readme. Thanks to Steve Lee. Closes WOOKIE-366
Removed:
incubator/wookie/trunk/widgets/templates/walkthrough/lib/jqueryMobile/
Modified:
incubator/wookie/trunk/widgets/templates/testWidgets/walkthroughTestWidget/widget.properties
incubator/wookie/trunk/widgets/templates/walkthrough/README.txt
incubator/wookie/trunk/widgets/templates/walkthrough/actions.html
incubator/wookie/trunk/widgets/templates/walkthrough/content_footer.html
incubator/wookie/trunk/widgets/templates/walkthrough/content_header.html
incubator/wookie/trunk/widgets/templates/walkthrough/index.html
incubator/wookie/trunk/widgets/templates/walkthrough/noteviewer.html
incubator/wookie/trunk/widgets/templates/walkthrough/scripts/noteviewer.js
incubator/wookie/trunk/widgets/templates/walkthrough/scripts/walkthrough_controller.js
incubator/wookie/trunk/widgets/templates/walkthrough/style/screen.add.css
incubator/wookie/trunk/widgets/templates/walkthrough/template_build.xml
Modified: incubator/wookie/trunk/widgets/templates/testWidgets/walkthroughTestWidget/widget.properties
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/testWidgets/walkthroughTestWidget/widget.properties?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/testWidgets/walkthroughTestWidget/widget.properties (original)
+++ incubator/wookie/trunk/widgets/templates/testWidgets/walkthroughTestWidget/widget.properties Fri Sep 7 09:02:26 2012
@@ -1,6 +1,6 @@
template.name=walkthrough
widget.shortname=WalkthroughTestWidget
widget.name=Walkthrough Test
-widget.description=A simple widget that demonstrates the walkthrough test widget with simple question and answer set.
+widget.description=A simple widget that demonstrates the walkthrough template with simple test question and answer set.
widget.help=<p>Work through the questions clicking on links to create a customised task and reading list for your work.</p>
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/README.txt
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/README.txt?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/README.txt (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/README.txt Fri Sep 7 09:02:26 2012
@@ -1,4 +1,4 @@
-Walkthrough
+# Walkthrough
Walk through is a HTML app / widget that presents a series of linked questions.
Adiitional links in the question text are used to add items to a list of
@@ -11,14 +11,73 @@ Questions are in HTML (using suitable es
formated using the Creole wiki markup.
Walkthrough is a W3C widget and designed to be used with the Wookie widget
-server. Apart from the Save Actions feature (which required PHP) it is
-completely client side and so requires a modern browser with Javascript
-enabled.
+server. It is completely client side and so requires a modern browser with
+Javascript enabled. Becuase of current browser restricted access to local
+files the Save feature simply displays text to be copied by the operator.
-Notes:
+# Notes:
* Questions can be referenced by id in a URI such as index.html#q6
* Notes can be referenced by id in a URI such as noteviewer.html#n1
* WAI ARIA roles have been used but not HTML5 landmark elements
+# Creating a custom widget from the walkthrough template
+## Building a widget to be built by the template system
+
+See the wookie widget template system readme
+({wookie.root}/widgets/templates/readme.txt) for general notes. You'll need a
+minimum of the following (assuming we're creating a widget called 'walkabout')
+
++ workspace
+ + widgets
+ build.xml
+ + walkabout
+ widget.properties
+
+widget.properties contains something like
+ * template.name=walkthrough
+ * widget.shortname=Walkabout
+ * widget.name=Walkabout
+ * widget.description=Provides a way to explore information information
+ and track actions to be performed.
+
+To build the walkabout widget run "ant generate-all-widgets" from within your
+widgets directory
+
+# Defining and accessing question sets
+
+## Providing a set of questions to be baked into the widget
+
+Place your question set in 'widgets/walkabout/xml/questions.xml and build the
+widget. The DTD (format) and an example can be found in walkthrough template's
+xml folder
+
++ workspace
+ + widgets
+ build.xml
+ + walkabout
+ widget.properties
+ + xml
+ questions.xml
+
+You may like to add a comment header section to the questions that contains
+your copyright notice.
+
+## Accessing other questions
+
+It is possible to access other question sets by URL. This is done by specifying
+questions=URL in the querystring part of the URL used to invoke the widget. The
+URL can be relative for questions included in the widget or absolute for
+questions located anywhere.
+
+e.g. http://wookie.server/wookie/wservices/wookie.apache.org/widgets/walkabout/
+index.html?questions=xml/more_questions.xml
+
+# Using the widget
+
+You can use the widget .wgt file by deploying it to a Apache Wookie server or
+another environment like Opera that can use them. Alternatively you can unzip
+the archive (eg by renaming as *.zip or using 7Zip) and deploy the individual
+files to a web server.
+
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/actions.html
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/actions.html?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/actions.html (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/actions.html Fri Sep 7 09:02:26 2012
@@ -20,6 +20,13 @@
<meta http-equiv="pragma" content="no-cache"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
+
+ <link rel="stylesheet" href="lib/jquery.mobile-1.1.1/jquery.mobile-1.1.1.min.css" />
+ <link rel="stylesheet" href="style/all.css" />
+
+ <script type="text/javascript" src="lib/jquery.mobile-1.1.1/jquery-1.7.1.min.js"></script>
+ <script type="text/javascript" src="lib/jquery.mobile-1.1.1/jquery.mobile-1.1.1.min.js"></script>
+
<title>Actions list</title>
<!-- everything in this file so can be saved as a single file -->
@@ -29,8 +36,9 @@
<script type="text/javascript">
//<![CDATA[
- window.onload = function(e){
- var actions = opener.Controller.actions;
+ window.onload = function(e){
+ var controller = opener.${widget.shortname}_walkthrough_controller;
+ var actions = controller.actions;
var html='';
for (var i = 0; i < actions.length; ++i)
{
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/content_footer.html
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/content_footer.html?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/content_footer.html (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/content_footer.html Fri Sep 7 09:02:26 2012
@@ -14,4 +14,5 @@
See the License for the specific language governing permissions and
limitations under the License.
-->
-<a href='actions.php' data-role="button" data-theme="c" id="save">Save actions</a>
+<a href='actions.php' class="ui-btn-right" data-role="button" data-theme="c" id="save">Save actions</a>
+<h1> </h1>
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/content_header.html
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/content_header.html?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/content_header.html (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/content_header.html Fri Sep 7 09:02:26 2012
@@ -14,5 +14,5 @@
See the License for the specific language governing permissions and
limitations under the License.
-->
-<a href = '#' data-role="button" data-rel="back" data-icon="back" data-theme="c" >Back</a>
+<a href='#' class="ui-btn-left" data-rel="back" data-icon="back" data-theme="c" >Back</a>
<h1 id='title'>${widget.name}</h1>
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/index.html
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/index.html?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/index.html (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/index.html Fri Sep 7 09:02:26 2012
@@ -22,38 +22,36 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
- <link rel="stylesheet" href="lib/jqueryMobile/jquery.mobile-1.0rc1.min.css" />
- <link rel="stylesheet" href="style/all.css" />
+ <link rel="stylesheet" href="lib/jquery.mobile-1.1.1/jquery.mobile-1.1.1.min.css" />
+ <link rel="stylesheet" href="style/all.css" />
- <script type="text/javascript" src="lib/jqueryMobile/jquery-1.6.4.min.js"></script>
- <script type="text/javascript" src="lib/jqueryMobile/jquery.mobile-1.0rc1.min.js"></script>
+ <script type="text/javascript" src="lib/jquery.mobile-1.1.1/jquery-1.7.1.min.js"></script>
+ <script type="text/javascript" src="lib/jquery.mobile-1.1.1/jquery.mobile-1.1.1.min.js"></script>
<script type="text/javascript" src="scripts/controller.js"></script>
+ <script type="text/javascript" src="lib/creole.js" charset="utf-8"></script>
<title>${widget.name}</title>
</head>
<body>
- <div data-role="page" id='home' class="type-home">
- <div data-role="header" id='header' role="banner">
- ${content.header}
- </div> <!-- /header -->
-
- <div data-role="content" id='content'>
- <div class="content-primary" id="content-primary">
- ${content.primary}
- </div>
- <div class="content-secondary" id="content-secondary">
- ${content.secondary}
- </div>
- </div><!-- /content -->
-
- <div data-role="footer" id='footer' role="contentinfo">
- ${content.footer}
- </div> <!-- /footer -->
+ <div data-role="page" id='home' class="type-home" >
+ <div data-role="header" id='header' role="banner">
+ ${content.header}
+ </div> <!-- /header -->
+
+ <div data-role="content" id='content'>
+ <div class="content-primary" id="content-primary">
+ ${content.primary}
+ </div>
+ <div class="content-secondary" id="content-secondary">
+ ${content.secondary}
+ </div>
+ </div><!-- /content -->
+
+ <div data-role="footer" id='footer' role="contentinfo">
+ ${content.footer}
+ </div> <!-- /footer -->
</div><!-- /page -->
-
- <form id="actions_form" action="server/actions.php" method="post" target="q_actions">
- <input type='hidden' name='the_actions' id='the_actions' value='' />
- </form>
+
</body>
</html>
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/noteviewer.html
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/noteviewer.html?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/noteviewer.html (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/noteviewer.html Fri Sep 7 09:02:26 2012
@@ -20,12 +20,13 @@
<meta http-equiv="pragma" content="no-cache"/>
<meta http-equiv="Cache-control" content="no-cache">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <link rel="stylesheet" href="lib/jqueryMobile/jquery.mobile-1.0rc1.min.css" />
- <script type="text/javascript" src="lib/jqueryMobile/jquery-1.6.4.min.js"></script>
- <script type="text/javascript" src="lib/jqueryMobile/jquery.mobile-1.0rc1.min.js"></script>
+
+ <link rel="stylesheet" href="lib/jquery.mobile-1.1.1/jquery.mobile-1.1.1.min.css" />
+ <link rel="stylesheet" href="style/all.css" />
+
+ <script type="text/javascript" src="lib/jquery.mobile-1.1.1/jquery-1.7.1.min.js"></script>
+ <script type="text/javascript" src="lib/jquery.mobile-1.1.1/jquery.mobile-1.1.1.min.js"></script>
<script type="text/javascript" src="lib/creole.js" charset="utf-8"></script>
- <link rel="stylesheet" type="text/css" href="style/style.css" />
<script type="text/javascript" src="scripts/noteviewer.js" charset="utf-8"></script>
</head>
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/scripts/noteviewer.js
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/scripts/noteviewer.js?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/scripts/noteviewer.js (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/scripts/noteviewer.js Fri Sep 7 09:02:26 2012
@@ -43,7 +43,7 @@ var NoteViewer =
},
parseNote: function(id, node)
- {
+ { // TODO factor this so DRY - appears in 2 files
var note = this.model.find('note[id="'+id.slice(1)+'"]').first();
var text = (note.length != 0) ? note.text() : "Cannot find a note with an id of '"+id+"'";
var creole = new Parse.Simple.Creole( {
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/scripts/walkthrough_controller.js
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/scripts/walkthrough_controller.js?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/scripts/walkthrough_controller.js (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/scripts/walkthrough_controller.js Fri Sep 7 09:02:26 2012
@@ -17,13 +17,26 @@
var ${widget.shortname}_walkthrough_controller =
{
+ parseQueryString: function()
+ {
+ var nvpair = {};
+ var qs = window.location.search.replace('?', '');
+ var pairs = qs.split('&');
+ $.each(pairs, function(i, v)
+ {
+ var pair = v.split('=');
+ nvpair[pair[0]] = pair[1];
+ });
+ return nvpair;
+ },
+
initPage: function()
{
- var question_file = "xml/questions.xml";
+ var question_file = this.parseQueryString().questions || "xml/questions.xml";
var self = this;
if (self.model === undefined)
{
- $.get(question_file, function(xml){ // load XML - need error handling
+ $.get(question_file, function(xml){ // load XML - FIXME need error handling
self.model = $( xml );
self.setHeaderFooter();
var page = window.location.hash; // might be F5 on a URI with hash
@@ -68,14 +81,15 @@ var ${widget.shortname}_walkthrough_cont
//$("#question_body").find( ":jqmData(role=button)" )button();
//answers.listview('refresh');
- options.dataUrl = urlObj.href; // not page id
+ options.dataUrl = urlObj.href; // not current page id
options.allowSamePageTransition = true; // so hash get's updated in browser
+ options.changeHash = true; // Needed so back works in IE from 1st page change
$.mobile.changePage(page, options); // As per JQM example - doesn't recusive bomb
},
isNote: function(href)
{
- return (href.slice(0, 7).toLowerCase() != 'http://'.toLowerCase());
+ return href != '#' && (href.slice(0, 7).toLowerCase() != 'http://'.toLowerCase());
},
showQuestionText: function (question)
@@ -86,9 +100,11 @@ var ${widget.shortname}_walkthrough_cont
// create question with link to add actions
question.find("body").contents().each( function() {
var that = $(this);
- if (this.nodeType == 3) // text
+ if (this.nodeType == 8) // comment
+ ; // nothing
+ else if (this.nodeType == 3) // text
qhtml += that.text();
- else
+ else // todo_item
{
var type = that.attr('type');
if (type == 'TODO')
@@ -168,6 +184,21 @@ var ${widget.shortname}_walkthrough_cont
});
},
+ parseNote: function(id, node)
+ { // TODO factor this so DRY - appears in 2 files
+ var note = this.model.find('note[id="'+id.slice(1)+'"]').first();
+ var text = (note.length != 0) ? note.text() : "Cannot find a note with an id of '"+id+"'";
+ var creole = new Parse.Simple.Creole( {
+ forIE: document.all,
+ interwiki: {
+ WikiCreole: 'http://www.wikicreole.org/wiki/',
+ Wikipedia: 'http://en.wikipedia.org/wiki/'
+ },
+ linkFormat: ''
+ } );
+ creole.parse(node, text);
+ },
+
setupSave: function()
{
var self = this;
@@ -177,34 +208,37 @@ var ${widget.shortname}_walkthrough_cont
{
var todo = $("#todo_list");
var items = todo.find('li');
- var text = '';
+ var actions = [];
items.each( function(i, el)
{
- var that = $(this);
- text += '' + (i+1) + '. '+ that.text();
- text = text.replace(/\[X\]?/g, '');
- var href = that.find("a").first().attr('href');
- if (href != undefined && !self.isNote(href))
- text += ' - ' + href;
- if (self.isNote(href))
+ var jqthis = $(this);
+ var action = {};
+
+ action.text = jqthis.text().replace(/\[X\]?/g, ''); // lose those close links
+ var href = jqthis.find("a").first().attr('href');
+ if (href != undefined && href != '#' && !self.isNote(href))
+ action.href = href;
+ else if (self.isNote(href))
{
var id = $.mobile.path.parseUrl( href ).hash;
- var note = self.model.find('note[id="'+id.slice(1)+'"]').first();
- var notetext = (note.length != 0) ? note.text() : "Cannot find a note with an id of '"+id+"'";
- text += "\r\n" + notetext;
+ //var note = self.model.find('note[id="'+id.slice(1)+'"]').first();
+ //var notetext = (note.length != 0) ? note.text() : "Cannot find a note with an id of '"+id+"'";
+ var noteNode = $("<div/>");
+ self.parseNote(id, noteNode[0]);
+ action.notetext = noteNode.html();
}
- text += "\r\n\r\n";
+ actions.push(action);
i++;
});
- if (text != '')
- {
- //$('#the_actions').attr('value',text);
- //$('#actions_form').submit();
- alert('Actions to copy\r\n\r\n'+text+'\r\n'); // alt that doesn't use server side script but requires cut n paste
+ if (actions.length)
+ {
+ self.actions = actions; // so actions.html can access them
+ window.open("actions.html", "actions", "", false); // Use this so target page can use 'opener' to access this conext
+ // alternative is HTML5 session data with window.name hack fallback
}
return false;
});
- }
+ }
};
$("#home").live('pagebeforecreate',function(event)
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/style/screen.add.css
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/style/screen.add.css?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/style/screen.add.css (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/style/screen.add.css Fri Sep 7 09:02:26 2012
@@ -88,9 +88,9 @@
margin-top: 1em;
padding: 0.2em;
}
-#save {
+#sssssave {
margin-right: 2em;
- float: right;
+ /*float: right;*/
}
#content {
Modified: incubator/wookie/trunk/widgets/templates/walkthrough/template_build.xml
URL: http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/templates/walkthrough/template_build.xml?rev=1381940&r1=1381939&r2=1381940&view=diff
==============================================================================
--- incubator/wookie/trunk/widgets/templates/walkthrough/template_build.xml (original)
+++ incubator/wookie/trunk/widgets/templates/walkthrough/template_build.xml Fri Sep 7 09:02:26 2012
@@ -129,7 +129,7 @@
<echo message="+------------------------------------------"/>
<!-- Build from base template -->
- <ant antfile="../../build.xml"
+ <ant antfile="${wookie.template.dir}/build.xml"
target="_generate_widget">
<property name="template.name" value="base"/>
<property name="copyWidgetFiles" value="false"/>