From e44a7e37b6c7b5961adaffc62b9042b8d442938e Mon Sep 17 00:00:00 2001 From: mensonge Date: Thu, 13 Nov 2008 09:49:11 +0000 Subject: New feature: basic Ajax suggestion for tags and implementation of Dojo toolkit git-svn-id: https://semanticscuttle.svn.sourceforge.net/svnroot/semanticscuttle/trunk@151 b3834d28-1941-0410-a4f8-b48e95affb8f --- includes/js/dojox/wire/demos/TableContainer.css | 25 ++ .../wire/demos/TableContainer.css.commented.css | 30 +++ includes/js/dojox/wire/demos/TableContainer.js | 68 +++++ includes/js/dojox/wire/demos/WidgetRepeater.js | 33 +++ includes/js/dojox/wire/demos/markup/countries.json | 43 ++++ .../wire/demos/markup/demo_ActionChaining.html | 108 ++++++++ .../dojox/wire/demos/markup/demo_ActionWiring.html | 142 +++++++++++ .../wire/demos/markup/demo_BasicChildWire.html | 78 ++++++ .../wire/demos/markup/demo_BasicColumnWiring.html | 90 +++++++ .../wire/demos/markup/demo_ConditionalActions.html | 221 ++++++++++++++++ .../wire/demos/markup/demo_FlickrStoreWire.html | 281 +++++++++++++++++++++ .../dojox/wire/demos/markup/demo_TopicWiring.html | 78 ++++++ includes/js/dojox/wire/demos/markup/flickrDemo.css | 29 +++ .../wire/demos/markup/flickrDemo.css.commented.css | 35 +++ includes/js/dojox/wire/demos/markup/states.json | 56 ++++ 15 files changed, 1317 insertions(+) create mode 100644 includes/js/dojox/wire/demos/TableContainer.css create mode 100644 includes/js/dojox/wire/demos/TableContainer.css.commented.css create mode 100644 includes/js/dojox/wire/demos/TableContainer.js create mode 100644 includes/js/dojox/wire/demos/WidgetRepeater.js create mode 100644 includes/js/dojox/wire/demos/markup/countries.json create mode 100644 includes/js/dojox/wire/demos/markup/demo_ActionChaining.html create mode 100644 includes/js/dojox/wire/demos/markup/demo_ActionWiring.html create mode 100644 includes/js/dojox/wire/demos/markup/demo_BasicChildWire.html create mode 100644 includes/js/dojox/wire/demos/markup/demo_BasicColumnWiring.html create mode 100644 includes/js/dojox/wire/demos/markup/demo_ConditionalActions.html create mode 100644 includes/js/dojox/wire/demos/markup/demo_FlickrStoreWire.html create mode 100644 includes/js/dojox/wire/demos/markup/demo_TopicWiring.html create mode 100644 includes/js/dojox/wire/demos/markup/flickrDemo.css create mode 100644 includes/js/dojox/wire/demos/markup/flickrDemo.css.commented.css create mode 100644 includes/js/dojox/wire/demos/markup/states.json (limited to 'includes/js/dojox/wire/demos') diff --git a/includes/js/dojox/wire/demos/TableContainer.css b/includes/js/dojox/wire/demos/TableContainer.css new file mode 100644 index 0000000..fded51f --- /dev/null +++ b/includes/js/dojox/wire/demos/TableContainer.css @@ -0,0 +1,25 @@ +.tablecontainer { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; + border-collapse: separate; +} +.tablecontainer th { + text-align: left; +} +.tablecontainer tr { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; +} +.tablecontainer tr td { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; +} +.alternate { + background-color: #EEEEEE; +} diff --git a/includes/js/dojox/wire/demos/TableContainer.css.commented.css b/includes/js/dojox/wire/demos/TableContainer.css.commented.css new file mode 100644 index 0000000..4ee2706 --- /dev/null +++ b/includes/js/dojox/wire/demos/TableContainer.css.commented.css @@ -0,0 +1,30 @@ +.tablecontainer { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; + border-collapse: separate; +} + +.tablecontainer th { + text-align: left; +} + +.tablecontainer tr { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; +} + +.tablecontainer tr td { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; +} + +.alternate { + background-color: #EEEEEE; +} + diff --git a/includes/js/dojox/wire/demos/TableContainer.js b/includes/js/dojox/wire/demos/TableContainer.js new file mode 100644 index 0000000..fd4ad73 --- /dev/null +++ b/includes/js/dojox/wire/demos/TableContainer.js @@ -0,0 +1,68 @@ +if(!dojo._hasResource["dojox.wire.demos.TableContainer"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dojox.wire.demos.TableContainer"] = true; +dojo.provide("dojox.wire.demos.TableContainer"); + +dojo.require("dojo.parser"); +dojo.require("dijit._Widget"); +dojo.require("dijit._Templated"); + +dojo.declare("dojox.wire.demos.TableContainer", [ dijit._Widget, dijit._Templated, dijit._Container ], { + // summary: + // Extremely simple 'widget' that is a table generator with an addRow function that takes an array + // as the row to add, where each entry is a cell in the row. This demo widget is for use with the + // wire demos. + + templateString: "
", + rowCount: 0, + headers: "", + addRow: function(array){ + // summary: + // Function to add in a new row from the elements in the array map to cells in the row. + // array: + // Array of row values to add. + try{ + var row = document.createElement("tr"); + if((this.rowCount%2) === 0){ + dojo.addClass(row, "alternate"); + } + this.rowCount++; + for(var i in array){ + var cell = document.createElement("td"); + var text = document.createTextNode(array[i]); + cell.appendChild(text); + row.appendChild(cell); + + } + this.tableContainer.appendChild(row); + }catch(e){ console.debug(e); } + }, + + clearTable: function(){ + // summary: + // Function to clear all the current rows in the table, except for the header. + + //Always leave the first row, which is the table header. + while(this.tableContainer.firstChild.nextSibling){ + this.tableContainer.removeChild(this.tableContainer.firstChild.nextSibling); + } + this.rowCount = 0; + }, + + postCreate: function(){ + // summary: + // Widget lifecycle function to handle generation of the header elements in the table. + var headers = this.headers.split(","); + var tr = document.createElement("tr"); + for(i in headers){ + + var header = headers[i]; + var th = document.createElement("th"); + var text = document.createTextNode(header); + th.appendChild(text); + tr.appendChild(th); + } + this.tableContainer.appendChild(tr); + } +}); + +} diff --git a/includes/js/dojox/wire/demos/WidgetRepeater.js b/includes/js/dojox/wire/demos/WidgetRepeater.js new file mode 100644 index 0000000..ad1b8b0 --- /dev/null +++ b/includes/js/dojox/wire/demos/WidgetRepeater.js @@ -0,0 +1,33 @@ +if(!dojo._hasResource["dojox.wire.demos.WidgetRepeater"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dojox.wire.demos.WidgetRepeater"] = true; +dojo.provide("dojox.wire.demos.WidgetRepeater") + +dojo.require("dojo.parser"); +dojo.require("dijit._Widget"); +dojo.require("dijit._Templated"); +dojo.require("dijit._Container"); + +dojo.declare("dojox.wire.demos.WidgetRepeater", [ dijit._Widget, dijit._Templated, dijit._Container ], { + // summary: + // Simple widget that does generation of widgets repetatively, based on calls to + // the createNew function and contains them as child widgets. + templateString: "
", + widget: null, + repeater: null, + createNew: function(obj){ + // summary: + // Function to handle the creation of a new widget and appending it into the widget tree. + // obj: + // The parameters to pass to the widget. + try{ + if(dojo.isString(this.widget)){ + dojo.require(this.widget); + this.widget = dojo.getObject(this.widget); + } + this.addChild(new this.widget(obj)); + this.repeaterNode.appendChild(document.createElement("br")); + }catch(e){ console.debug(e); } + } +}); + +} diff --git a/includes/js/dojox/wire/demos/markup/countries.json b/includes/js/dojox/wire/demos/markup/countries.json new file mode 100644 index 0000000..ad3a07a --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/countries.json @@ -0,0 +1,43 @@ +{ identifier: 'name', + items: [ + { name:'Africa', type:'continent', + children:[{_reference:'Egypt'}, {_reference:'Kenya'}, {_reference:'Sudan'}] }, + { name:'Egypt', type:'country' }, + { name:'Kenya', type:'country', + children:[{_reference:'Nairobi'}, {_reference:'Mombasa'}] }, + { name:'Nairobi', type:'city' }, + { name:'Mombasa', type:'city' }, + { name:'Sudan', type:'country', + children:{_reference:'Khartoum'} }, + { name:'Khartoum', type:'city' }, + { name:'Asia', type:'continent', + children:[{_reference:'China'}, {_reference:'India'}, {_reference:'Russia'}, {_reference:'Mongolia'}] }, + { name:'China', type:'country' }, + { name:'India', type:'country' }, + { name:'Russia', type:'country' }, + { name:'Mongolia', type:'country' }, + { name:'Australia', type:'continent', population:'21 million', + children:{_reference:'Commonwealth of Australia'}}, + { name:'Commonwealth of Australia', type:'country', population:'21 million'}, + { name:'Europe', type:'continent', + children:[{_reference:'Germany'}, {_reference:'France'}, {_reference:'Spain'}, {_reference:'Italy'}] }, + { name:'Germany', type:'country' }, + { name:'France', type:'country' }, + { name:'Spain', type:'country' }, + { name:'Italy', type:'country' }, + { name:'North America', type:'continent', + children:[{_reference:'Mexico'}, {_reference:'Canada'}, {_reference:'United States of America'}] }, + { name:'Mexico', type:'country', population:'108 million', area:'1,972,550 sq km', + children:[{_reference:'Mexico City'}, {_reference:'Guadalajara'}] }, + { name:'Mexico City', type:'city', population:'19 million', timezone:'-6 UTC'}, + { name:'Guadalajara', type:'city', population:'4 million', timezone:'-6 UTC' }, + { name:'Canada', type:'country', population:'33 million', area:'9,984,670 sq km', + children:[{_reference:'Ottawa'}, {_reference:'Toronto'}] }, + { name:'Ottawa', type:'city', population:'0.9 million', timezone:'-5 UTC'}, + { name:'Toronto', type:'city', population:'2.5 million', timezone:'-5 UTC' }, + { name:'United States of America', type:'country' }, + { name:'South America', type:'continent', + children:[{_reference:'Brazil'}, {_reference:'Argentina'}] }, + { name:'Brazil', type:'country', population:'186 million' }, + { name:'Argentina', type:'country', population:'40 million' } +]} diff --git a/includes/js/dojox/wire/demos/markup/demo_ActionChaining.html b/includes/js/dojox/wire/demos/markup/demo_ActionChaining.html new file mode 100644 index 0000000..596d6ec --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/demo_ActionChaining.html @@ -0,0 +1,108 @@ + + + + Sample Action Chaining + + + + + + + + + + Demo of Chaining Actions:

+ This demo shows how you can chain actions together to fire in a sequence. + Such as the completion of setting one value on a widget triggers the setting of another value on the widget +
+
+ + + + + + + + + + +
+
+
+
+
+
+
+ + + + + +
+
+
+
+ + +
+
+
+
+ + +
+ +
+
+ + diff --git a/includes/js/dojox/wire/demos/markup/demo_ActionWiring.html b/includes/js/dojox/wire/demos/markup/demo_ActionWiring.html new file mode 100644 index 0000000..995b67f --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/demo_ActionWiring.html @@ -0,0 +1,142 @@ + + + + Sample declarative data binding + + + + + + + + + +
+
+ Demo Searcher (Searches on Attribute 'name'):

+ Usage:
+ Enter the name you want to search the store for. Wildcards * (multiple character), and ? (single character), are allowed. +
+
+ + + + + +
+
Search Datastore
+
+
+
+
+
+
+
+
+ + + + + +
+
+ + +
+
+
+
+ + +
+
+ + +
+
+
+
+
+
+
+
+ + diff --git a/includes/js/dojox/wire/demos/markup/demo_BasicChildWire.html b/includes/js/dojox/wire/demos/markup/demo_BasicChildWire.html new file mode 100644 index 0000000..f5973e7 --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/demo_BasicChildWire.html @@ -0,0 +1,78 @@ + + + + Sample Composite (Child) Wire usage. + + + + + + + +
+
+ + +
+
+ + +
+
+ + +
+
+
+
+
+
+ + diff --git a/includes/js/dojox/wire/demos/markup/demo_BasicColumnWiring.html b/includes/js/dojox/wire/demos/markup/demo_BasicColumnWiring.html new file mode 100644 index 0000000..48c327e --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/demo_BasicColumnWiring.html @@ -0,0 +1,90 @@ + + + + Sample Declarative Data Binding using ColumnWire + + + + + + + + +
+
+ + +
+ + +
+ + +
+
+
+
+
+
+
+
+ + diff --git a/includes/js/dojox/wire/demos/markup/demo_ConditionalActions.html b/includes/js/dojox/wire/demos/markup/demo_ConditionalActions.html new file mode 100644 index 0000000..ea0ca64 --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/demo_ConditionalActions.html @@ -0,0 +1,221 @@ + + + + Conditional Actions Demo + + + + + + + + + + Demo of Conditional Actions:

+ This demo shows how you can use actions to read and set widget values, as well as have actions only occur if + if certain conditions are met, such as cloning values as they are typed from the billing address over to the + shipping address if the 'Use Same Address' checkbox is checked true. +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Use Same Address:
+
+ Billing Address + + Shipping Address +
+ Name:
+
+ Name:
+
+ Address 1:
+
+ Address 1:
+
+ Address 2:
+
+ Address 2:
+
+ City:
+
+ City:
+
+ State:
+
+ State:
+
+ Zip code:
+
+ Zip code:
+
+ + + + + +
+
+
+ + + +
+ +
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+ + + +
+
+ + +
+
+
+
+
+
+
+ + + diff --git a/includes/js/dojox/wire/demos/markup/demo_FlickrStoreWire.html b/includes/js/dojox/wire/demos/markup/demo_FlickrStoreWire.html new file mode 100644 index 0000000..54068a9 --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/demo_FlickrStoreWire.html @@ -0,0 +1,281 @@ + + + + Demo of FlickrStore + + + + + + + +

+ DEMO: FlickrStore Search +

+
+

+ Description: +

+

+ This simple demo shows how services, such as Flickr, can be wrapped by the datastore API. In this demo, you can search public + Flickr images through a simple FlickrStore by specifying a series of tags (separated by spaces) to search on. The results + will be displayed below the search box. This demo is the same as the example demo provided in dojox/data/demos/demo_FlickrStore.html, + except that all the interactions are implemented via Wire instead of a script that runs at dojo.addOnLoad(). +

+

+ For fun, search on the 3dny tag! +

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Status: + +
+
+ ID: + +
+
+ Tags: + +
+
+ Tagmode: + + +
+ Number of Pictures: + +
+
+ +
+
+
+ +
+
+ + + + + +
+
+
+
+
+
+ + + +
+ + +
+
+ + + +
+
+
+
+ +
+
+ +
+
+ + + +
+
+
+
+ + +
+
+
+ + + +
+
+ +
+
+
+
+
+
+
+
+ + diff --git a/includes/js/dojox/wire/demos/markup/demo_TopicWiring.html b/includes/js/dojox/wire/demos/markup/demo_TopicWiring.html new file mode 100644 index 0000000..e091e8b --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/demo_TopicWiring.html @@ -0,0 +1,78 @@ + + + + Sample Topic Wiring + + + + + + + + + + Demo of Topic Wiring

+ This demo shows how you can wire events to publish to a topic as well as recieve topic events +
+
+ + + + + + + +
+
+
+
+
+ + + + + +
+
+
+ + +
+ + diff --git a/includes/js/dojox/wire/demos/markup/flickrDemo.css b/includes/js/dojox/wire/demos/markup/flickrDemo.css new file mode 100644 index 0000000..793d1c6 --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/flickrDemo.css @@ -0,0 +1,29 @@ +.flickrView { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; + border-collapse: separate; + width: 100%; +} +.flickrView th { + text-align: left; +} +.flickrView tr { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; +} +.flickrView tr td { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; +} +.flickrView { + background-color: #EFEFEF; +} +.flickrTitle { + background-color: #CCCCCC; +} diff --git a/includes/js/dojox/wire/demos/markup/flickrDemo.css.commented.css b/includes/js/dojox/wire/demos/markup/flickrDemo.css.commented.css new file mode 100644 index 0000000..7e75a5d --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/flickrDemo.css.commented.css @@ -0,0 +1,35 @@ +.flickrView { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; + border-collapse: separate; + width: 100%; +} + +.flickrView th { + text-align: left; +} + +.flickrView tr { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; +} + +.flickrView tr td { + padding: 3 3 3 3; + border-width: 1px; + border-style: solid; + border-color: #000000; +} + +.flickrView { + background-color: #EFEFEF; +} + +.flickrTitle { + background-color: #CCCCCC; +} + diff --git a/includes/js/dojox/wire/demos/markup/states.json b/includes/js/dojox/wire/demos/markup/states.json new file mode 100644 index 0000000..bdaa609 --- /dev/null +++ b/includes/js/dojox/wire/demos/markup/states.json @@ -0,0 +1,56 @@ +{"identifier":"abbreviation", +"label": "label", +"items": [ + {"name":"Alabama", "label":"Alabama","abbreviation":"AL"}, + {"name":"Alaska", "label":"Alaska","abbreviation":"AK"}, + {"name":"American Samoa", "label":"American Samoa","abbreviation":"AS"}, + {"name":"Arizona", "label":"Arizona","abbreviation":"AZ"}, + {"name":"Arkansas", "label":"Arkansas","abbreviation":"AR"}, + {"name":"California", "label":"California","abbreviation":"CA"}, + {"name":"Colorado", "label":"Colorado","abbreviation":"CO"}, + {"name":"Connecticut", "label":"Connecticut","abbreviation":"CT"}, + {"name":"Delaware", "label":"Delaware","abbreviation":"DE"}, + {"name":"Florida", "label":"Florida","abbreviation":"FL"}, + {"name":"Georgia", "label":"Georgia","abbreviation":"GA"}, + {"name":"Hawaii", "label":"Hawaii","abbreviation":"HI"}, + {"name":"Idaho", "label":"Idaho","abbreviation":"ID"}, + {"name":"Illinois", "label":"Illinois","abbreviation":"IL"}, + {"name":"Indiana", "label":"Indiana","abbreviation":"IN"}, + {"name":"Iowa", "label":"Iowa","abbreviation":"IA"}, + {"name":"Kansas", "label":"Kansas","abbreviation":"KS"}, + {"name":"Kentucky", "label":"Kentucky","abbreviation":"KY"}, + {"name":"Louisiana", "label":"Louisiana","abbreviation":"LA"}, + {"name":"Maine", "label":"Maine","abbreviation":"ME"}, + {"name":"Marshall Islands", "label":"Marshall Islands","abbreviation":"MH"}, + {"name":"Maryland", "label":"Maryland","abbreviation":"MD"}, + {"name":"Massachusetts", "label":"Massachusetts","abbreviation":"MA"}, + {"name":"Michigan", "label":"Michigan","abbreviation":"MI"}, + {"name":"Minnesota", "label":"Minnesota","abbreviation":"MN"}, + {"name":"Mississippi", "label":"Mississippi","abbreviation":"MS"}, + {"name":"Missouri", "label":"Missouri","abbreviation":"MO"}, + {"name":"Montana", "label":"Montana","abbreviation":"MT"}, + {"name":"Nebraska", "label":"Nebraska","abbreviation":"NE"}, + {"name":"Nevada", "label":"Nevada","abbreviation":"NV"}, + {"name":"New Hampshire", "label":"New Hampshire","abbreviation":"NH"}, + {"name":"New Jersey", "label":"New Jersey","abbreviation":"NJ"}, + {"name":"New Mexico", "label":"New Mexico","abbreviation":"NM"}, + {"name":"New York", "label":"New York","abbreviation":"NY"}, + {"name":"North Carolina", "label":"North Carolina","abbreviation":"NC"}, + {"name":"North Dakota", "label":"North Dakota","abbreviation":"ND"}, + {"name":"Ohio", "label":"Ohio","abbreviation":"OH"}, + {"name":"Oklahoma", "label":"Oklahoma","abbreviation":"OK"}, + {"name":"Oregon", "label":"Oregon","abbreviation":"OR"}, + {"name":"Pennsylvania", "label":"Pennsylvania","abbreviation":"PA"}, + {"name":"Rhode Island", "label":"Rhode Island","abbreviation":"RI"}, + {"name":"South Carolina", "label":"South Carolina","abbreviation":"SC"}, + {"name":"South Dakota", "label":"South Dakota","abbreviation":"SD"}, + {"name":"Tennessee", "label":"Tennessee","abbreviation":"TN"}, + {"name":"Texas", "label":"Texas","abbreviation":"TX"}, + {"name":"Utah", "label":"Utah","abbreviation":"UT"}, + {"name":"Vermont", "label":"Vermont","abbreviation":"VT"}, + {"name":"Virginia", "label":"Virginia","abbreviation":"VA"}, + {"name":"Washington", "label":"Washington","abbreviation":"WA"}, + {"name":"West Virginia", "label":"West Virginia","abbreviation":"WV"}, + {"name":"Wisconsin", "label":"Wisconsin","abbreviation":"WI"}, + {"name":"Wyoming", "label":"Wyoming","abbreviation":"WY"} +]} \ No newline at end of file -- cgit v1.2.3