Skip to content

Commit

Permalink
fixes #15721. Changes to mobileMvc demo and to its tests to remove us…
Browse files Browse the repository at this point in the history
…e of deprecated API also some few changes to purely doc API. No library code changes. Thanks Ed Chatelain & Akira Sudoh (IBM, CCLA). !strict.
  • Loading branch information
cjolif committed Jul 19, 2012
1 parent 15ca2e2 commit 11eb1f3
Show file tree
Hide file tree
Showing 5 changed files with 70 additions and 102 deletions.
26 changes: 13 additions & 13 deletions mvc/EditStoreRefController.js
Expand Up @@ -22,20 +22,20 @@ define([
// | <script src="/path/to/dojo-toolkit/dojo/dojo.js" type="text/javascript" data-dojo-config="parseOnLoad: 0"></script>
// | <script type="text/javascript">
// | require([
// | "dojo/dom", "dojo/parser", "dojo/store/Observable", "dojo/store/Memory", "dijit/registry",
// | "dijit/form/CheckBox", "dojox/mvc/EditStoreRefController", "dojox/mvc/ListController", "dojo/domReady!"
// | ], function(ddom, parser, Observable, Memory, registry){
// | "dojo/dom", "dojo/parser", "dojo/when", "dojo/store/Observable", "dojo/store/Memory", "dijit/registry", "dojo/domReady!"
// | ], function(ddom, parser, when, Observable, Memory, registry){
// | store = Observable(new Memory({data: [{id: "Foo", value: false}]}));
// | parser.parse();
// | registry.byId("ctrl").queryStore().observe(function(object, previousIndex, newIndex){
// | alert("ID: " + object.id + ", value: " + object.value);
// | }, true);
// | var count = 0;
// | var h = setInterval(function(){
// | ddom.byId("check").click();
// | registry.byId("ctrl").commit();
// | if(++count >= 2){ clearInterval(h); }
// | }, 2000);
// | when(parser.parse(), function(){
// | registry.byId("ctrl").queryStore().observe(function(object, previousIndex, newIndex){
// | alert("ID: " + object.id + ", value: " + object.value);
// | }, true);
// | var count = 0;
// | var h = setInterval(function(){
// | ddom.byId("check").click();
// | registry.byId("ctrl").commit();
// | if(++count >= 2){ clearInterval(h); }
// | }, 2000);
// | });
// | });
// | </script>
// | </head>
Expand Down
12 changes: 6 additions & 6 deletions mvc/StoreRefController.js
Expand Up @@ -29,13 +29,13 @@ define([
// | <script src="/path/to/dojo-toolkit/dojo/dojo.js" type="text/javascript" data-dojo-config="parseOnLoad: 0"></script>
// | <script type="text/javascript">
// | require([
// | "dojo/parser", "dojo/store/Memory", "dijit/registry",
// | "dijit/form/TextBox", "dojox/mvc/StoreRefController", "dojo/domReady!"
// | ], function(parser, Memory, registry){
// | "dojo/parser", "dojo/when", "dojo/store/Memory", "dijit/registry", "dojo/domReady!"
// | ], function(parser, when, Memory, registry){
// | store = new Memory({data: [{id: "Foo", value: "Foo"}, {id: "Bar", value: "Bar"}]});
// | parser.parse();
// | registry.byId("ctrl").getStore("Foo");
// | setTimeout(function(){ registry.byId("ctrl").getStore("Bar"); }, 2000);
// | when(parser.parse(), function(){
// | registry.byId("ctrl").getStore("Foo");
// | setTimeout(function(){ registry.byId("ctrl").getStore("Bar"); }, 2000);
// | });
// | });
// | </script>
// | </head>
Expand Down
4 changes: 2 additions & 2 deletions mvc/at.js
Expand Up @@ -9,15 +9,15 @@ define([

var at = function(/*dojo/Stateful|String*/ target, /*String*/ targetProp){
// summary:
// Returns a handle of data binding target (a dojo/Stateful property), which is used for start synchronization with data binding source (another dojo/Stateful property).
// Returns a pointer to data binding target (a dojo/Stateful property), called at handle, which is used for start synchronization with data binding source (another dojo/Stateful property).
// description:
// Typically used in data-dojo-props so that a widget can synchronize its attribute with another dojo/Stateful, like shown in the example.
// target: dojo/Stateful|String
// dojo/Stateful to be synchronized.
// targetProp: String
// The property name in target to be synchronized.
// returns:
// A handle of data binding target (a dojo/Stateful property), which is used for start synchronization with data binding source (another dojo/Stateful property).
// A pointer to data binding target (a dojo/Stateful property), called at handle, which is used for start synchronization with data binding source (another dojo/Stateful property).
// example:
// Two seconds later, the text box changes from "Foo" to "Bar" as the "value" property in model changes.
// | <html>
Expand Down
43 changes: 7 additions & 36 deletions mvc/tests/mobile/demo/demo.html
Expand Up @@ -67,23 +67,6 @@ <h1 id="home" data-dojo-type="dojox/mobile/Heading" data-dojo-props="back:'Back'
</tr>
</table>

<!--
<div class="field-row">
<span>Order #</span>
<input id="lastnameInput" data-dojo-type="dojox/mobile/TextBox"
data-dojo-props="value: at('rel:', 'Serial'), placeholder:'Order #'">
</div>
<div class="field-row">
<span>Last</span>
<input id="serialInput" data-dojo-type="dojox/mobile/TextBox"
data-dojo-props="value: at('rel:', 'Last'), placeholder:'Last'">
</div>
<div class="field-row">
<span>Email</span>
<input id="emailInput1" data-dojo-type="dojox/mobile/TextBox"
data-dojo-props="value: at('rel:', 'Email'), placeholder:'Email'">
</div>
-->
<div class="spacer"></div>
<button id="shipto" type="button" data-dojo-type="dojox/mobile/Button" class="mblBlueButton" onclick="setRef('addrGroup', 'rel:', 'ShipTo');">Ship To</button>
<button id="billto" type="button" data-dojo-type="dojox/mobile/Button" class="mblBlueButton" onclick="setRef('addrGroup', 'rel:', 'BillTo');">Bill To</button>
Expand Down Expand Up @@ -127,12 +110,9 @@ <h1 id="home" data-dojo-type="dojox/mobile/Heading" data-dojo-props="back:'Back'
<button id="reset1" type="button" data-dojo-type="dojox/mobile/Button" class="mblBlueButton" onclick="nameCtl.reset()">Reset</button>
</form>
</div>
<!--
<span id="listCtl" data-dojo-type="dojox/mvc/EditStoreRefListController"
data-dojo-props="model: repeatmodel, cursorIndex: 0"></span>
-->

<div id="repeat" data-dojo-type="dojox/mobile/ScrollableView">
<h1 data-dojo-type="dojox/mobile/Heading" data-dojo-props="back:'Back', moveTo:'foo', callback:function(){console.log('in callback function for repeat');}">Repeat Data
<h1 data-dojo-type="dojox/mobile/Heading" data-dojo-props="back:'Back', moveTo:'foo'">Repeat Data
<span id="addbutton" data-dojo-type="dojox/mobile/ToolBarButton"
data-dojo-props='icon:"mblDomButtonWhitePlus", onClick: function(){ addEmpty(); }'
style="float:right;"></span>
Expand Down Expand Up @@ -160,14 +140,11 @@ <h1 data-dojo-type="dojox/mobile/Heading" data-dojo-props="back:'Back', moveTo:'
</div>

<div id="repeatdetails" data-dojo-type="dojox/mobile/ScrollableView">
<h1 id="detailsHeading" data-dojo-type="dojox/mobile/Heading"
data-dojo-props='back:"Back", moveTo:"repeat",
callback:function(){console.log("in callback function for Details");}'>Details</h1>
<!--
data-dojo-props="target: at('widget:listCtl', 'cursor')">
data-dojo-props="value: at('widget:listCtl', 'cursorIndex')"></span>
-->

<h1 id="detailsHeading" data-dojo-type="dojox/mobile/Heading" data-dojo-props="label: 'Details'" data-app-region="top">
<div id="detail_back" data-dojo-type="dojox/mobile/ToolBarButton"
data-dojo-props="onClick: function(e){forceFocus();}, moveTo:'repeat', arrow: 'left', label: 'Back'" style="float:left"></div>
</h1>

<div id="detailsGroup" class="fieldset" data-dojo-type="dojox/mvc/Group"
data-dojo-props="target: at(listCtl, 'cursor')">
<div class="row">
Expand Down Expand Up @@ -247,12 +224,6 @@ <h1 data-dojo-type="dojox/mobile/Heading" data-dojo-props='back:"Back", moveTo:"
<div id="viewArea" style="display:none">
<div id="generateView">Generated View</div>
<div class="fieldset">
<!--
<div id="view" data-dojo-type="dojox/mvc/Generate"
data-dojo-props="widgetMapping:{'String' : 'dojox/mobile/TextBox'},
idNameMapping:{'String' : 'TB'}">
</div>
-->
<div id="view" data-dojo-type="dojox/mvc/Generate"
data-dojo-props="widgetMapping:{'String' : 'dojox/mobile/TextBox'},
idNameMapping: {String: 'TB'},
Expand Down
87 changes: 42 additions & 45 deletions mvc/tests/mobile/demo/src.js
@@ -1,16 +1,14 @@
var listCtl, repeatModel, setRef, nextIndexToAdd, selectedIndex, nameCtl;
var setRef, setDetailsContext, insertResult, updateView, updateModel, addEmpty, remove;
var listCtl, repeatModel, setRef, nextIndexToAdd, selectedIndex, nameCtl, genmodel;
var setDetailsContext, updateView, updateModel, addEmpty, remove, forceFocus;

require(['dojo/has',
'dojox/mobile/parser',
//'dojo/parser',
'dojo/ready',
'dijit/registry',
'dojox/mvc/at',
'dojox/mvc',
'dojox/mvc/getStateful',
'dojox/mvc/EditStoreRefListController',
'dojox/mvc/EditStoreRefController',
"dojo/store/Memory",
"dojo/when",
'dojox/mobile',
Expand All @@ -22,21 +20,13 @@ require(['dojo/has',
'dojox/mvc/Generate',
'dojox/mvc/Repeat',
'dojox/mobile/TextBox',
'dojox/mobile/CheckBox',
'dojox/mobile/ViewController',
'dojox/mobile/FixedSplitter',
'dojox/mobile/EdgeToEdgeList',
'dojox/mobile/EdgeToEdgeCategory',
'dojox/mobile/deviceTheme',
'dojox/mobile/RoundRectCategory',
'dojox/mobile/Heading',
'dojo/_base/json',
'dojo/dom'
], function(has, parser, ready, registry, at, mvc, getStateful, EditStoreRefListController,
EditStoreRefController, Memory, when, mobile, ScrollableView, Button,
TextArea, Group, Output, Generate, Repeat, TextBox, CheckBox, ViewController,
FixedSplitter, EdgeToEdgeList, EdgeToEdgeCategory, deviceTheme, RoundRectCategory,
Heading, json, dom){
], function(has, parser, ready, registry, at, getStateful, EditStoreRefListController,
Memory, when, mobile, ScrollableView, Button, TextArea, Group, Output, Generate,
Repeat, TextBox, deviceTheme, Heading, json, dom){

if(!has("webkit")){
require(["dojox/mobile/compat"]);
Expand Down Expand Up @@ -97,32 +87,33 @@ var repeatData = [

selectedIndex = 0;

//model = getStateful(names );
//nameCtl = new EditStoreRefController({store: new Memory({data: names})});
nameCtl = new EditStoreRefListController({store: new Memory({data: names})});
//nameCtl.queryStore();
nameCtl.getStore("360324");
model = nameCtl.model;

//listCtl = new EditStoreRefListController({model: getStateful(repeatData ), cursorIndex: 0});
listCtl = new EditStoreRefListController({store: new Memory({data: repeatData}), cursorIndex: 0});
when(listCtl.queryStore(), function(model){
//repeatmodel = listCtl.model;
repeatmodel = model;
nextIndexToAdd = repeatmodel.length;
});




// used in the Repeat Data binding demo
setDetailsContext=function(index){
// summary:
// Called to move to the repeatdetails page when an item is selected on the Repeat Data Binding page.
//
// index: string
// The index of the item to show in the repeatdetails page.
//
listCtl.set("cursorIndex", index);
registry.byId("firstInput").focus();
};


addEmpty = function(){
// summary:
// Called to add an empty item when the white plus icon is pressed on the Repeat Data Binding page.
//
var data = {id:Math.random(), "First": "", "Last": "", "Location": "CA", "Office": "", "Email": "",
"Tel": "", "Fax": ""};
repeatmodel.push(new getStateful(data));
Expand All @@ -132,36 +123,29 @@ var repeatData = [
},

remove = function(idx){
// summary:
// Called to remove an item when the red circle minus icon is pressed on the Repeat Data Binding page.
//
// idx: string
// The index of the item to remove.
//
repeatmodel.splice(idx, 1);
if(listCtl.get("cursorIndex") > repeatmodel.length-1){
listCtl.set("cursorIndex", repeatmodel.length - 1);
}
},

forceFocus = function(){
// summary:
// Called to set the focus to force the update of the field when going back to the repeat list Repeat Data Binding page.
//
registry.byId("telInput").focus();
},

// used in the Repeat Data binding demo
insertResult = function(index){
if (repeatmodel[index-1].First.value !== ""){ // TODO: figure out why we are getting called twice for each click
var insert = mvc.newStatefulModel({ "data" : {
"First" : "",
"Last" : "",
"Location": "CA",
"Office" : "",
"Email" : "",
"Tel" : "",
"Fax" : ""}
});
repeatmodel.add(index, insert);
setDetailsContext(index);
nextIndexToAdd++;
}else{
setDetailsContext(index-1);
}
};

// used in the Generate View demo
var genmodel;
updateView = function() {
// summary:
// Called when the "Update View" button is pressed on the Generate Simple Form.
//
try {
registry.byId("view").set("children", at('widget:modelArea', 'value').direction(at.from).transform({format: dojo.fromJson}));
dom.byId("outerModelArea").style.display = "none";
Expand All @@ -173,6 +157,9 @@ var repeatData = [

// used in the Generate View demo
updateModel = function() {
// summary:
// Called when the "Update Model" button is pressed on the Generate View page.
//
dom.byId("outerModelArea").style.display = "";
try {
dom.byId("modelArea").focus(); // hack: do this to force focus off of the textbox, bug on mobile?
Expand All @@ -198,6 +185,16 @@ var repeatData = [
}); // end function

function setRef(id, model, attr) {
// summary:
// Called when the "Ship To" or "Bill To" button is pressed on the Simple Data binding.
//
// id: string
// The id of the widget, in our test it will be 'addrGroup'
// model: string
// The name of the "model", in our test it will be 'rel:' since it is a relative binding
// attr: string
// The attr to bind, in our test it will be 'ShipTo' or 'BillTo'
//
require([
"dijit/registry",
"dojox/mvc/at"
Expand Down

0 comments on commit 11eb1f3

Please sign in to comment.