-
Notifications
You must be signed in to change notification settings - Fork 186
/
Copy pathtest_Declaration_1.x.html
131 lines (107 loc) · 4.69 KB
/
test_Declaration_1.x.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Dojo Toolkit - Declaration test</title>
<style type="text/css">
@import "../themes/claro/document.css";
@import "css/dijitTests.css";
</style>
<!-- required: a default dijit theme: -->
<link id="themeStyles" rel="stylesheet" href="../../dijit/themes/claro/claro.css"/>
<!-- required: dojo.js -->
<script type="text/javascript" src="../../dojo/dojo.js"
djConfig="isDebug: true"></script>
<!-- not needed, for testing alternate themes -->
<script type="text/javascript" src="_testCommon.js"></script>
<script type="text/javascript">
dojo.require("dijit.dijit"); // optimize: load dijit layer
dojo.require("dijit.Declaration");
dojo.require("dijit.ProgressBar");
dojo.require("dojo.parser"); // scan page for widgets and instantiate them
dojo.require("doh.runner");
dojo.ready(function(){
doh.register("dijit.Declaration_1.x", [
function parse(){
// run parser inside of DOH so we can tell if there are any exceptions
dojo.parser.parse();
// test instantiation of dojo.Declaration widgets
doh.t(hideButtonA, "hideButtonA instantiated");
doh.t(hideButtonB, "hideButtonB instantiated");
doh.t(hideButton2A, "hideButton2A instantiated");
doh.t(hideButton2B, "hideButton2B instantiated");
},
function basicTests(){
// test <script type="dojo/method">
doh.t(HideButton.prototype.myHandler, "myHandler method added to HideButton prototype");
doh.t(HideButton2.prototype.myHandler, "myHandler method added to HideButton2 prototype");
// test prototype extension
doh.t(mPrototypeExecuted, "m prototype executed");
// test parameters
doh.is("blah", m1.foo, "m1.foo");
doh.is(73, m2.progress, "m2.progress");
// test <script type="dojo/connect">
doh.t(foo1, "foo1 exists");
doh.t(/modified by dojo\/connect event=startup/.test(foo1.domNode.innerHTML), "dojo/connect fired");
}
]);
doh.run();
});
</script>
</head>
<body class="claro">
<h3>Simple macro:</h3>
<p>(Check to make sure that links contain employee number)
<div dojoType="dijit.Declaration" widgetClass="Employee" defaults="{ empid: 123, name: '' }">
<span>${name}</span>
<a href="update.php?id=${empid}">update</a>
<a href="delete.php?id=${empid}">delete</a>
</div>
<div dojoType="Employee" empid="100" name="Alan Allen"></div>
<div dojoType="Employee" empid="101" name="Bob Brown"></div>
<div dojoType="Employee" empid="102" name="Cathy Cameron"></div>
<h3>Using dojoAttachEvent, dojoAttachPoint</h3>
<div dojoType="dijit.Declaration" widgetClass="HideButton">
XXX<button dojoAttachEvent="onclick: myHandler" dojoAttachPoint="containerNode"></button>XXX
<script type='dojo/method' event='myHandler'>
this.domNode.style.display="none";
</script>
</div>
<button dojoType="HideButton" jsId="hideButtonA">Click to hide</button>
<button dojoType="HideButton" jsId="hideButtonB">Click to hide #2</button>
<h3>Extending another widget</h3>
<p>HideButton2 extends HideButton (above) and changes the template (but keeps the onclick handler).</p>
<span dojoType="dijit.Declaration" widgetClass="HideButton2" mixins="HideButton">
YYY<button dojoAttachEvent="onclick: myHandler" dojoAttachPoint="containerNode"></button>YYY
</span>
<button dojoType="HideButton2" jsId="hideButton2A">Hide me extended</button>
<button dojoType="HideButton2" jsId="hideButton2B">Hide me extended #2</button>
<h3>Using dojo/method:</h3>
<div dojoType="dijit.Declaration" widgetClass="m" defaults="{ foo: 'thud', progress: 10 }">
<script type='dojo/method' event='postCreate'>
console.log("in postCreate ", this, arguments);
mPrototypeExecuted = true;
this.inherited(arguments);
this.baz.innerHTML += " (created via custom postCreate) ";
</script>
<p>thinger blah stuff ${foo}</p>
<div style="width:400px" maximum="200"
progress="${progress}" dojoType="dijit.ProgressBar"></div>
<p dojoAttachPoint='baz'>baz thud</p>
</div>
<div dojoType="m" jsId="m1" foo="blah" progress="50"></div>
<div dojoType="m" jsId="m2" foo="thinger" progress="73"></div>
<h3>Using dojo/connect:</h3>
<div dojoType="dijit.Declaration" widgetClass="foo" defaults="{ foo: 'thud', progress: 10 }">
<script type='dojo/connect' event='startup'>
this.baz.innerHTML += " (modified by dojo/connect event=startup) ";
</script>
<p>thinger blah stuff ${foo}</p>
<div style="width:400px" maximum="200"
progress="${progress}" dojoType="dijit.ProgressBar"></div>
<p dojoAttachPoint='baz'>baz thud</p>
</div>
<div dojoType="foo" jsId="foo1" foo="blah" progress="50"></div>
<div dojoType="foo" jsId="foo2" foo="thinger" progress="73"></div>
</body>
</html>