kwartz 3.1.2 → 3.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (140) hide show
  1. data/CHANGES +444 -0
  2. data/README.txt +4 -1
  3. data/bin/kwartz +2 -2
  4. data/doc-api/classes/Kwartz.html +16 -7
  5. data/doc-api/classes/Kwartz/Assertion.html +6 -6
  6. data/doc-api/classes/Kwartz/AssertionError.html +6 -6
  7. data/doc-api/classes/Kwartz/AttrInfo.html +71 -61
  8. data/doc-api/classes/Kwartz/BaseError.html +12 -12
  9. data/doc-api/classes/Kwartz/BaseTranslator.html +104 -74
  10. data/doc-api/classes/Kwartz/CharacterType.html +24 -24
  11. data/doc-api/classes/Kwartz/CommandOptionError.html +7 -7
  12. data/doc-api/classes/Kwartz/CommandOptions.html +50 -50
  13. data/doc-api/classes/Kwartz/Config.html +5 -0
  14. data/doc-api/classes/Kwartz/ConvertError.html +12 -12
  15. data/doc-api/classes/Kwartz/Converter.html +31 -33
  16. data/doc-api/classes/Kwartz/CssStyleParser.html +207 -168
  17. data/doc-api/classes/Kwartz/Defun.html +32 -31
  18. data/doc-api/classes/Kwartz/{HandlerArgument.html → Directive.html} +27 -53
  19. data/doc-api/classes/Kwartz/ElementInfo.html +68 -53
  20. data/doc-api/classes/Kwartz/EperlExpressionParser.html +185 -0
  21. data/doc-api/classes/Kwartz/EperlHandler.html +65 -58
  22. data/doc-api/classes/Kwartz/EperlTranslator.html +14 -7
  23. data/doc-api/classes/Kwartz/ErubisTranslator.html +14 -7
  24. data/doc-api/classes/Kwartz/ErubyTranslator.html +14 -7
  25. data/doc-api/classes/Kwartz/ExpandStatement.html +20 -20
  26. data/doc-api/classes/Kwartz/Expander.html +358 -0
  27. data/doc-api/classes/Kwartz/Handler.html +287 -157
  28. data/doc-api/classes/Kwartz/{StatementHelper.html → HandlerHelper.html} +307 -112
  29. data/doc-api/classes/Kwartz/Helper/ActionViewHelper.html +23 -23
  30. data/doc-api/classes/Kwartz/Helper/RailsTemplate.html +96 -96
  31. data/doc-api/classes/Kwartz/JstlExpressionParser.html +181 -0
  32. data/doc-api/classes/Kwartz/JstlHandler.html +134 -126
  33. data/doc-api/classes/Kwartz/JstlTranslator.html +21 -14
  34. data/doc-api/classes/Kwartz/KwartzError.html +6 -6
  35. data/doc-api/classes/Kwartz/Main.html +4 -4
  36. data/doc-api/classes/Kwartz/NativeExpression.html +19 -19
  37. data/doc-api/classes/Kwartz/NativeStatement.html +24 -24
  38. data/doc-api/classes/Kwartz/Node.html +7 -7
  39. data/doc-api/classes/Kwartz/PIErubisTranslator.html +21 -14
  40. data/doc-api/classes/Kwartz/ParseError.html +6 -6
  41. data/doc-api/classes/Kwartz/PerlExpressionParser.html +185 -0
  42. data/doc-api/classes/Kwartz/PerlHandler.html +353 -0
  43. data/doc-api/classes/Kwartz/PerlTranslator.html +226 -0
  44. data/doc-api/classes/Kwartz/PhpExpressionParser.html +185 -0
  45. data/doc-api/classes/Kwartz/PhpHandler.html +63 -56
  46. data/doc-api/classes/Kwartz/PhpTranslator.html +21 -14
  47. data/doc-api/classes/Kwartz/PresentationLogicParser.html +126 -123
  48. data/doc-api/classes/Kwartz/PrintStatement.html +18 -18
  49. data/doc-api/classes/Kwartz/RailsHandler.html +84 -85
  50. data/doc-api/classes/Kwartz/RailsTranslator.html +13 -6
  51. data/doc-api/classes/Kwartz/RubyExpressionParser.html +180 -0
  52. data/doc-api/classes/Kwartz/RubyHandler.html +73 -69
  53. data/doc-api/classes/Kwartz/RubyStyleParser.html +86 -86
  54. data/doc-api/classes/Kwartz/RubyTranslator.html +28 -21
  55. data/doc-api/classes/Kwartz/Ruleset.html +622 -1
  56. data/doc-api/classes/Kwartz/StrutsTranslator.html +14 -14
  57. data/doc-api/classes/Kwartz/TagInfo.html +52 -27
  58. data/doc-api/classes/Kwartz/TextConverter.html +75 -37
  59. data/doc-api/classes/Kwartz/Translator.html +54 -53
  60. data/doc-api/classes/Kwartz/Util.html +25 -25
  61. data/doc-api/created.rid +1 -1
  62. data/doc-api/files/__/README_txt.html +7 -2
  63. data/doc-api/files/kwartz/assert_rb.html +2 -2
  64. data/doc-api/files/kwartz/binding/eperl_rb.html +2 -2
  65. data/doc-api/files/kwartz/binding/erubis_rb.html +2 -2
  66. data/doc-api/files/kwartz/binding/eruby_rb.html +2 -2
  67. data/doc-api/files/kwartz/binding/jstl_rb.html +2 -2
  68. data/doc-api/files/kwartz/binding/perl_rb.html +115 -0
  69. data/doc-api/files/kwartz/binding/php_rb.html +2 -2
  70. data/doc-api/files/kwartz/binding/pierubis_rb.html +2 -2
  71. data/doc-api/files/kwartz/binding/rails_rb.html +2 -2
  72. data/doc-api/files/kwartz/binding/ruby_rb.html +2 -2
  73. data/doc-api/files/kwartz/binding/struts_rb.html +2 -2
  74. data/doc-api/files/kwartz/config_rb.html +2 -2
  75. data/doc-api/files/kwartz/converter_rb.html +2 -2
  76. data/doc-api/files/kwartz/defun_rb.html +2 -2
  77. data/doc-api/files/kwartz/error_rb.html +2 -2
  78. data/doc-api/files/kwartz/helper/rails_rb.html +2 -2
  79. data/doc-api/files/kwartz/main_rb.html +3 -2
  80. data/doc-api/files/kwartz/node_rb.html +2 -2
  81. data/doc-api/files/kwartz/parser_rb.html +2 -2
  82. data/doc-api/files/kwartz/translator_rb.html +2 -2
  83. data/doc-api/files/kwartz/util/assert-text-equal_rb.html +2 -2
  84. data/doc-api/files/kwartz/util/testcase-helper_rb.html +2 -2
  85. data/doc-api/files/kwartz/util_rb.html +2 -2
  86. data/doc-api/files/kwartz_rb.html +2 -2
  87. data/doc-api/fr_class_index.html +10 -5
  88. data/doc-api/fr_file_index.html +1 -0
  89. data/doc-api/fr_method_index.html +268 -239
  90. data/doc/docstyle.css +9 -3
  91. data/doc/img/fig05.png +0 -0
  92. data/doc/introduction-to-kwartz.html +3040 -0
  93. data/doc/pattern-catalog.html +5 -3
  94. data/doc/reference.html +680 -26
  95. data/doc/users-guide.html +222 -67
  96. data/kwartz.gemspec +4 -4
  97. data/lib/kwartz.rb +3 -3
  98. data/lib/kwartz/assert.rb +2 -2
  99. data/lib/kwartz/binding/eperl.rb +71 -31
  100. data/lib/kwartz/binding/erubis.rb +3 -2
  101. data/lib/kwartz/binding/eruby.rb +3 -2
  102. data/lib/kwartz/binding/jstl.rb +66 -29
  103. data/lib/kwartz/binding/perl.rb +230 -0
  104. data/lib/kwartz/binding/php.rb +69 -29
  105. data/lib/kwartz/binding/pierubis.rb +3 -2
  106. data/lib/kwartz/binding/rails.rb +18 -18
  107. data/lib/kwartz/binding/ruby.rb +74 -42
  108. data/lib/kwartz/binding/struts.rb +22 -21
  109. data/lib/kwartz/config.rb +4 -4
  110. data/lib/kwartz/converter.rb +465 -345
  111. data/lib/kwartz/defun.rb +2 -2
  112. data/lib/kwartz/error.rb +2 -2
  113. data/lib/kwartz/helper/rails.rb +2 -2
  114. data/lib/kwartz/main.rb +5 -4
  115. data/lib/kwartz/node.rb +92 -144
  116. data/lib/kwartz/parser.rb +112 -103
  117. data/lib/kwartz/translator.rb +14 -6
  118. data/lib/kwartz/util.rb +2 -2
  119. data/lib/kwartz/util/assert-text-equal.rb +2 -2
  120. data/lib/kwartz/util/testcase-helper.rb +1 -1
  121. data/test/test-compile.rb +2 -2
  122. data/test/test-compile.yaml +81 -0
  123. data/test/test-converter.rb +4 -8
  124. data/test/test-converter.yaml +152 -3
  125. data/test/test-directives.rb +2 -2
  126. data/test/test-directives.yaml +222 -0
  127. data/test/test-main.rb +6 -4
  128. data/test/test-main.yaml +66 -1
  129. data/test/test-parser.rb +12 -3
  130. data/test/test-parser.yaml +64 -51
  131. data/test/test-rails.rb +2 -2
  132. data/test/test-ruleset.rb +2 -2
  133. data/test/test-ruleset.yaml +465 -4
  134. data/test/test.log +6 -0
  135. data/test/test.rb +2 -2
  136. metadata +116 -106
  137. data/ChangeLog +0 -156
  138. data/doc-api/classes/Kwartz/DocumentRuleset.html +0 -369
  139. data/doc-api/classes/Kwartz/ElementExpander.html +0 -325
  140. data/doc-api/classes/Kwartz/ElementRuleset.html +0 -612
@@ -27,7 +27,7 @@ pre {
27
27
  white-space:pre;
28
28
  }
29
29
 
30
- .program {
30
+ pre.program {
31
31
  border-style:solid;
32
32
  border-width:1px;
33
33
  border-color:#6699FF;
@@ -38,7 +38,7 @@ pre {
38
38
  word-break:break-all;
39
39
  }
40
40
 
41
- .terminal {
41
+ pre.terminal {
42
42
  border-style:solid;
43
43
  border-width:1;
44
44
  border-color:#999999;
@@ -49,7 +49,7 @@ pre {
49
49
  word-break:break-all;
50
50
  }
51
51
 
52
- .output {
52
+ pre.output {
53
53
  border-style:solid;
54
54
  border-width:1px;
55
55
  border-color:#CCCCCC;
@@ -61,6 +61,12 @@ pre {
61
61
  }
62
62
 
63
63
 
64
+ pre strong {
65
+ color: #990000;
66
+ font-weight: bold;
67
+ }
68
+
69
+
64
70
  .program_caption {
65
71
  margin-top: 20px;
66
72
  }
Binary file
@@ -0,0 +1,3040 @@
1
+ <?xml version="1.0" encoding="EUC-JP"?>
2
+ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3
+ <html>
4
+ <head>
5
+ <title>Kwartz�ƥ�ץ졼�ȥ����ƥ����� �� �ǥ����ʡ��ȥץ�����ޡ������˶��Ȥ�����ˡ ��</title>
6
+ <meta http-equiv="Content-Type" content="text/xhtml; charset=EUC-JP" />
7
+ <meta name="revision" content="$Rev$" />
8
+ <meta name="release" content="$Release: 3.2.0 $" />
9
+ <meta name="lastupdate" content="$Date$" />
10
+ <style type="text/css">
11
+ <!--
12
+
13
+ * {
14
+ margin: 0;
15
+ padding: 0;
16
+ }
17
+
18
+ body {
19
+ }
20
+
21
+ div.slide {
22
+ display: none;
23
+ position: absolute;
24
+ top: 0;
25
+ left: 0;
26
+ width: 100%;
27
+ height: 100%;
28
+ color: #000;
29
+ font-size: 18pt;
30
+ background-color: #F3F3F3;
31
+ }
32
+
33
+ #slide-title {
34
+ display: block;
35
+ }
36
+
37
+ div.slide:target {
38
+ display: block;
39
+ /*z-index: 1;*/
40
+ }
41
+
42
+ .slide-body {
43
+ padding: 20px;
44
+ line-height: 130%;
45
+ }
46
+
47
+ ul, ol {
48
+ padding: 5px 0px;
49
+ }
50
+ ul li {
51
+ margin-left: 1em;
52
+ }
53
+ ol li {
54
+ margin-left: 1em;
55
+ }
56
+ ul.author {
57
+ list-style-type: none;
58
+ text-align: right;
59
+ padding-top: 70px;
60
+ }
61
+
62
+ li li {
63
+ font-size: 16pt;
64
+ }
65
+
66
+ li li li {
67
+ font-size: 15pt;
68
+ }
69
+
70
+ ul.descr {
71
+ margin-top: 15px;
72
+ font-size: 16pt;
73
+ }
74
+
75
+ a:link, a:visited {
76
+ color: #00F;
77
+ }
78
+
79
+ h1 {
80
+ font-size: 36pt;
81
+ text-align: center;
82
+ padding: 150px 0 10px 0;
83
+ }
84
+
85
+ h2 {
86
+ color: #333;
87
+ font-size: 30pt;
88
+ padding: 10px 10px 5px 20px;
89
+ border-bottom: solid 3px #99C;
90
+ }
91
+
92
+ h4 {
93
+ font-size: 20pt;
94
+ text-align: center;
95
+ padding: 0 0 30px 0;
96
+ border-bottom: solid 3px #99C;
97
+ }
98
+
99
+ pre {
100
+ line-height: 110%;
101
+ }
102
+ pre.code, pre.code2 {
103
+ background-color: #CCF;
104
+ border: solid 1px #66F;
105
+ padding: 5px 15px;
106
+ }
107
+ pre.code {
108
+ font-size: 17pt;
109
+ }
110
+ pre.code2 {
111
+ font-size: 16pt;
112
+ line-height: 115%;
113
+ }
114
+
115
+ pre.console {
116
+ background-color: #CCC;
117
+ border: solid 1px #666;
118
+ padding: 5px 15px;
119
+ font-size: 17pt;
120
+ }
121
+
122
+ pre .small {
123
+ font-size: 15pt;
124
+ }
125
+
126
+
127
+ ol.toc {
128
+ color: #666;
129
+ }
130
+
131
+ .toc .current {
132
+ color: #000;
133
+ font-weight: bold;
134
+ }
135
+
136
+ .toc ul {
137
+ font-weight: normal;
138
+ }
139
+
140
+
141
+ strong {
142
+ font-weight: bold;
143
+ color: #660000;
144
+ }
145
+
146
+ .caption {
147
+ display: block;
148
+ /*border: solid 1px;*/
149
+ margin-top: 10px;
150
+ padding: 0px;
151
+ font-size: 16pt;
152
+ }
153
+
154
+ table.matrix {
155
+ border: solid 1px #999;
156
+ margin: 10px 10px 15px 10px;
157
+ border-collapse: collapse;
158
+ font-size: 16pt;
159
+ }
160
+ .matrix th {
161
+ background-color: #CCC;
162
+ font-weight: normal;
163
+ border: solid 1px;
164
+ padding: 3px;
165
+ }
166
+ .matrix td {
167
+ text-align: center;
168
+ border: solid 1px;
169
+ padding: 3px;
170
+ }
171
+
172
+ table.n-up2 {
173
+ /*width: 100%;*/
174
+ }
175
+ .n-up2 td {
176
+ padding: 5px;
177
+ width: 45%;
178
+ vertical-align: top;
179
+ }
180
+
181
+ .footer {
182
+ background: #99C;
183
+ position: fixed;
184
+ width: 100%;
185
+ /*
186
+ height: 1em;
187
+ */
188
+ bottom: 0;
189
+ font-size: 11pt;
190
+ padding: 5px 0;
191
+ color: #FFF
192
+ }
193
+
194
+ .footer-left {
195
+ float: left;
196
+ /*
197
+ position: absolute;
198
+ left: 0%;
199
+ bottom: 0;
200
+ */
201
+ width: 10%;
202
+ text-align: left;
203
+ }
204
+
205
+ .footer-right {
206
+ float: right;
207
+ /*
208
+ position: absolute;
209
+ left: 90%;
210
+ bottom: 0;
211
+ */
212
+ width: 10%;
213
+ text-align: right;
214
+ }
215
+
216
+ .footer-center {
217
+ /*
218
+ position: absolute;
219
+ left: 10%;
220
+ bottom: 0;
221
+ width:80%;
222
+ */
223
+ text-align:center;
224
+ }
225
+
226
+ .pagenum {
227
+ padding-right: 20px;
228
+ }
229
+ /*
230
+ .pagenum:before {
231
+ padding-right: 20px;
232
+ counter-increment: pagenum;
233
+ content: '1/50';
234
+ }
235
+ */
236
+
237
+ /*
238
+ .copyright:before {
239
+ content: 'copyright(c)2006 kuwata-lab.com all rights reserved';
240
+ }
241
+ */
242
+
243
+ div.note {
244
+ margin: 20px 0 0 0;
245
+ padding: 5px;
246
+ background-color: #FC9;
247
+ /*font-size: 14pt;*/
248
+ }
249
+
250
+ .centerize {
251
+ text-align: center;
252
+ }
253
+ -->
254
+ </style>
255
+ <script type="text/javascript">//<!--
256
+
257
+ function keys(obj) {
258
+ var list = [];
259
+ for (key in obj) {
260
+ list.push(key);
261
+ }
262
+ return list;
263
+ }
264
+
265
+ function dp(obj) {
266
+ var list = keys(obj);
267
+ alert(list.sort().join(', '));
268
+ }
269
+
270
+
271
+ var slide_list = [];
272
+ var slide_table = {};
273
+ var slide_classname = 'slide';
274
+ var slide_id_prefix = '#slide';
275
+ //var z_index = 1;
276
+
277
+
278
+ function find_slide_by_id(slide_id) { /// string or object
279
+ //alert(slide_id);
280
+ if (! slide_id)
281
+ return undefined;
282
+ if (slide_id.substring(0,1) == '#')
283
+ slide_id = slide_id.substring(1); /// ex. '#slide1' => 'slide1'
284
+ //for (var i = 0, n = slide_list.length; i < n; i++) {
285
+ // if (slide_list[i].id == slide_id)
286
+ // return slide_list[i]; /// found
287
+ //}
288
+ //return undefiend; /// not found
289
+ return slide_table[slide_id];
290
+ }
291
+
292
+
293
+ function find_slide(slide_or_id) {
294
+ var arg = slide_or_id;
295
+ var t = typeof(arg);
296
+ if (t == 'object') {
297
+ return arg;
298
+ }
299
+ if (t == 'string') {
300
+ slide = find_slide_by_id(arg);
301
+ if (! slide) {
302
+ alert("slide '"+arg+"' not found.");
303
+ }
304
+ return slide;
305
+ }
306
+ alert("find_slide(): '"+arg+"': invalid argument.");
307
+ return undefined;
308
+ }
309
+
310
+
311
+ function show_slide(slide_or_id) {
312
+ slide = find_slide(slide_or_id);
313
+ //z_index++;
314
+ //dp(slides[i].style);
315
+ slide.style.display = 'block';
316
+ //slide.style.zIndex = z_index;
317
+ }
318
+
319
+
320
+ function hide_slide(slide_or_id) {
321
+ slide = find_slide(slide_or_id);
322
+ slide.style.display = 'none';
323
+ }
324
+
325
+
326
+ function current_slide(node) {
327
+ var tagname = 'DIV';
328
+ while (typeof(node) == 'object') {
329
+ //alert("tagname="+node.tagName+",class="+node.className);
330
+ if (tagname == node.tagName && slide_classname == node.className)
331
+ return node;
332
+ node = node.parentNode;
333
+ }
334
+ return undefined;
335
+ }
336
+
337
+
338
+ function create_anchor_onclick_listener(anchor) {
339
+ return function() {
340
+ //alert("anchor.hash="+anchor.hash+", anchor.text="+anchor.childNodes[0].nodeValue);
341
+ var slide = current_slide(anchor);
342
+ if (slide)
343
+ hide_slide(slide);
344
+ var target_slide_id = anchor.hash;
345
+ show_slide(target_slide_id);
346
+ }
347
+ }
348
+
349
+
350
+ function init_slide_list() {
351
+ var children = document.body.childNodes;
352
+ for (var i = 0, n = children.length; i < n; i++) {
353
+ var child = children[i];
354
+ if (typeof(child) == 'object' && child.className == slide_classname) {
355
+ slide_list.push(child);
356
+ slide_table[child.id] = child;
357
+ }
358
+ }
359
+ }
360
+
361
+
362
+ function init_slide_anchors() {
363
+ var anchors = document.getElementsByTagName('A');
364
+ var len = slide_id_prefix.length;
365
+ for (var i = 0, n = anchors.length; i < n; i++) {
366
+ var anchor = anchors[i];
367
+ if (anchor.hash && anchor.hash.substring(0,len) == slide_id_prefix) {
368
+ anchor.onclick = create_anchor_onclick_listener(anchor);
369
+ }
370
+ }
371
+ }
372
+
373
+
374
+ function init_document() {
375
+ init_slide_list();
376
+ init_slide_anchors();
377
+ //
378
+ var slide_id = document.location.hash;
379
+ if (slide_id) {
380
+ alert("** deubg: slide_id="+slide_id+",location="+document.location);
381
+ hide_slide(slide_list[0]);
382
+ show_slide(slide_id);
383
+ }
384
+ }
385
+
386
+
387
+ //document.onload = init_document;
388
+ if (window.attachEvent) window.attachEvent("onload", init_document);
389
+
390
+ //--></script>
391
+
392
+ </head>
393
+ <body>
394
+
395
+
396
+ <div id="slide-title" class="slide">
397
+ <h1>Kwartz�ƥ�ץ졼�ȥ����ƥ�����</h1>
398
+ <h4>�� �ǥ����ʡ��ȥץ�����ޡ������˶��Ȥ�����ˡ ��</h4>
399
+ <div class="slide-body">
400
+ <ul class="author">
401
+ <li>Makoto Kuwata</li>
402
+ <li>kwa@kuwata-lab.com</li>
403
+ <li><a href="http://www.kuwata-lab.com">http://www.kuwata-lab.com</a></li>
404
+ </ul>
405
+ </div>
406
+ <div class="footer">
407
+ <div class="footer-left">
408
+ &nbsp;<a href="#slide-last" class="navi-prev">&lt;&lt;</a>
409
+ <a href="#slide-toc" class="navi-toc">^</a>
410
+ </div>
411
+ <div class="footer-right">
412
+ <span class="pagenum">1/50</span>
413
+ <a href="#slide-toc" class="navi-next">&gt;&gt;</a>&nbsp;
414
+ </div>
415
+ <div class="footer-center">
416
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
417
+ </div>
418
+ </div>
419
+ </div>
420
+
421
+
422
+ <div id="slide-toc" class="slide">
423
+ <h2>�ܼ�</h2>
424
+ <div class="slide-body">
425
+ <ol>
426
+ <li>�Ϥ���� <a href="#slide1-toc">_</a>
427
+ </li>
428
+ <li>Kwartz���� <a href="#slide2-toc">_</a>
429
+ </li>
430
+ <li>���٤ʥȥԥå� <a href="#slide3-toc">_</a>
431
+ </li>
432
+ <li>�ǥ��쥯�ƥ��� <a href="#slide4-toc">_</a>
433
+ </li>
434
+ <li>�ץ쥼��ơ������ѥ����� <a href="#slide5-toc">_</a>
435
+ </li>
436
+ </ol>
437
+ </div>
438
+ <div class="footer">
439
+ <div class="footer-left">
440
+ &nbsp;<a href="#slide-title" class="navi-prev">&lt;&lt;</a>
441
+ <a href="#slide-title" class="navi-toc">^</a>
442
+ </div>
443
+ <div class="footer-right">
444
+ <span class="pagenum">2/50</span>
445
+ <a href="#slide1-toc" class="navi-next">&gt;&gt;</a>&nbsp;
446
+ </div>
447
+ <div class="footer-center">
448
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
449
+ </div>
450
+ </div>
451
+ </div>
452
+
453
+
454
+ <div id="slide1-toc" class="slide">
455
+ <h2>�ܼ�</h2>
456
+ <div class="slide-body">
457
+ <ol class="toc">
458
+ <li class="current">�Ϥ����
459
+ <ul class="subtoc">
460
+ <li><a href="#slide1-1">�ƥ�ץ졼�ȥ����ƥ�Ȥϡ�</a></li>
461
+ <li><a href="#slide1-2">�ƥ�ץ졼�ȥ����ƥ�μ���(1)</a>,
462
+ <a href="#slide1-3">(2)</a></li>
463
+ <li><a href="#slide1-4">�ӥ��ͥ��ؤȥץ쥼��ơ��������(1)</a>,
464
+ <a href="#slide1-5">(2)</a></li>
465
+ <li><a href="#slide1-6">�������Ȳ���(1)</a>,
466
+ <a href="#slide1-7">(2)</a>,
467
+ <a href="#slide1-8">(3)</a></li>
468
+ </ul>
469
+ </li>
470
+ <li>Kwartz���� <a href="#slide2-toc">_</a>
471
+ </li>
472
+ <li>���٤ʥȥԥå� <a href="#slide3-toc">_</a>
473
+ </li>
474
+ <li>�ǥ��쥯�ƥ��� <a href="#slide4-toc">_</a>
475
+ </li>
476
+ <li>�ץ쥼��ơ������ѥ����� <a href="#slide5-toc">_</a>
477
+ </li>
478
+ </ol>
479
+ </div>
480
+ <div class="footer">
481
+ <div class="footer-left">
482
+ &nbsp;<a href="#slide-toc" class="navi-prev">&lt;&lt;</a>
483
+ <a href="#slide-toc" class="navi-toc">^</a>
484
+ </div>
485
+ <div class="footer-right">
486
+ <span class="pagenum">3/50</span>
487
+ <a href="#slide1-1" class="navi-next">&gt;&gt;</a>&nbsp;
488
+ </div>
489
+ <div class="footer-center">
490
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
491
+ </div>
492
+ </div>
493
+ </div>
494
+
495
+
496
+ <div id="slide1-1" class="slide">
497
+ <h2>�ƥ�ץ졼�ȥ����ƥ�Ȥϡ�</h2>
498
+ <div class="slide-body">
499
+ <ul>
500
+ <li>ưŪ��Web�ڡ���������������ȤߤΤҤȤ�
501
+ <ul>
502
+ <li>�ƥ�ץ졼�ȤȤʤ�HTML�ե�������ɤ߹��ߡ�ɬ�פʲս��񤭴����ƽ���</li>
503
+ <li>�񤭴�����ս�˲��餫�Ρ��ܰ��פ�ɬ�ס�<strong>�ޡ�����</strong>��</li>
504
+ </ul>
505
+ </li>
506
+ <li>������
507
+ <ul>
508
+ <li>HTML�ǥ�������ѹ������䤹��</li>
509
+ <li>�ǥ����ʡ��ȥץ�����ޡ��Ȥ����Ȥ��䤹��</li>
510
+ </ul>
511
+ </li>
512
+ </ul>
513
+ <table class="n-up2" summary="">
514
+ <tr>
515
+ <td class="n-up2">
516
+ <span class="caption">�ƥ�ץ졼�ȡ�</span>
517
+ <pre class="code">
518
+ &lt;ul&gt;
519
+ <strong>#foreach(item in list)</strong>
520
+ &lt;li&gt;<strong>${item}</strong>&lt;/li&gt;
521
+ <strong>#end</strong>
522
+ &lt;/ul&gt;
523
+ </pre>
524
+ </td>
525
+ <td class="n-up2">
526
+ <span class="caption">���Ϸ�̡�</span>
527
+ <pre class="code">
528
+ &lt;ul&gt;
529
+ &lt;li&gt;foo&lt;/li&gt;
530
+ &lt;li&gt;bar&lt;/li&gt;
531
+ &lt;li&gt;baz&lt;/li&gt;
532
+ &lt;/ul&gt;
533
+ </pre>
534
+ </td>
535
+ </tr>
536
+ </table>
537
+ </div>
538
+ <div class="footer">
539
+ <div class="footer-left">
540
+ &nbsp;<a href="#slide1-toc" class="navi-prev">&lt;&lt;</a>
541
+ <a href="#slide1-toc" class="navi-toc">^</a>
542
+ </div>
543
+ <div class="footer-right">
544
+ <span class="pagenum">4/50</span>
545
+ <a href="#slide1-2" class="navi-next">&gt;&gt;</a>&nbsp;
546
+ </div>
547
+ <div class="footer-center">
548
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
549
+ </div>
550
+ </div>
551
+ </div>
552
+
553
+
554
+ <div id="slide1-2" class="slide">
555
+ <h2>�ƥ�ץ졼�ȥ����ƥ�μ���(1)</h2>
556
+ <div class="slide-body">
557
+ <ul>
558
+ <li>�ƥ��������ѷ�
559
+ <ul>
560
+ <li>�ȼ��ѡ�������� �� Ǥ�դΥƥ����ȥե����뤬���Ѳ�ǽ</li>
561
+ <li>�ޡ����󥰤��ȼ����� �� HTML�ǥ���������롢HTML�Х�ǡ������Ȥ��ʤ�
562
+ <sup><a href="#" onclick="return false;" title="�ޡ����󥰤ν񼰤�HTML��Ʊ���ˤ����HTML�ǥ�������������˺Ѥब�����Τ褦�ʥƥ�ץ졼�ȥ����ƥ�Ϥʤ������ʤ���">*</a></sup></li>
563
+ <li>�����å��ʷ����֤�����ʬ���ˤϥƥ�ץ졼����˵���</li>
564
+ <li>��ɽ�㡧Velocity(Java), Smarty(PHP), HTML::Template(Perl)</li>
565
+ </ul>
566
+ </li>
567
+ </ul>
568
+ <table class="n-up2" summary="">
569
+ <tr>
570
+ <td class="n-up2">
571
+ <span class="caption">�㡧Velocity�ƥ�ץ졼��</span>
572
+ <pre class="code">
573
+ &lt;table&gt;
574
+ <strong>#foreach(item in list)</strong>
575
+ &lt;tr&gt;
576
+ &lt;td&gt;<strong>${item}</strong>&lt;/td&gt;
577
+ &lt;/tr&gt;
578
+ <strong>#end</strong>
579
+ &lt;/table&gt;
580
+ </pre>
581
+ </td>
582
+ <td class="n-up2" style="width: 45%">
583
+ <!--
584
+ <span class="caption">�㡧Template-Toolkit�ƥ�ץ졼��</span>
585
+ <pre class="code">
586
+ &lt;table&gt;
587
+ <strong>[% FOREACH item = list %]</strong>
588
+ &lt;tr&gt;
589
+ &lt;td&gt;<strong>[% item %]</strong>&lt;/td&gt;
590
+ &lt;/tr&gt;
591
+ <strong>[% END %]</strong>
592
+ &lt;/table&gt;
593
+ </pre>
594
+ -->
595
+ <span class="caption">�㡧HTML::Template�ƥ�ץ졼��</span>
596
+ <pre class="code">
597
+ &lt;table&gt;
598
+ <strong>&lt;TMPL_LOOP NAME=list&gt;</strong>
599
+ &lt;tr&gt;
600
+ &lt;td&gt;<strong>&lt;TMPL_VAR NAME=name&gt;</strong>&lt;/td&gt;
601
+ &lt;/tr&gt;
602
+ <strong>&lt;/TMPL_LOOP&gt;</strong>
603
+ &lt;/table&gt;
604
+ </pre>
605
+ </td>
606
+ </tr>
607
+ </table>
608
+ </div>
609
+ <div class="footer">
610
+ <div class="footer-left">
611
+ &nbsp;<a href="#slide1-1" class="navi-prev">&lt;&lt;</a>
612
+ <a href="#slide1-toc" class="navi-toc">^</a>
613
+ </div>
614
+ <div class="footer-right">
615
+ <span class="pagenum">5/50</span>
616
+ <a href="#slide1-3" class="navi-next">&gt;&gt;</a>&nbsp;
617
+ </div>
618
+ <div class="footer-center">
619
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
620
+ </div>
621
+ </div>
622
+ </div>
623
+
624
+
625
+ <div id="slide1-3" class="slide">
626
+ <h2>�ƥ�ץ졼�ȥ����ƥ�μ���(2)</h2>
627
+ <div class="slide-body">
628
+ <ul>
629
+ <li>HTML��
630
+ <ul>
631
+ <li>HTML/XML�ѡ�������� �� HTML/XML�Ǥ������ѤǤ��ʤ�</li>
632
+ <li>�ޡ����󥰤˥�����°������� �� HTML�ǥ���������ʤ�</li>
633
+ <li>�����å��ʷ����֤�����ʬ���ˤϥᥤ��ץ��������̥ե�����˵���</li>
634
+ <li>��ɽ�㡧XMLC(Java), Amrita(Ruby), Tapestry(Java)</li>
635
+ </ul>
636
+ </li>
637
+ </ul>
638
+ <table class="n-up2" summary="">
639
+ <tr>
640
+ <td class="n-up2">
641
+ <span class="caption">�㡧XMLC�ƥ�ץ졼��</span>
642
+ <pre class="code">
643
+ &lt;table&gt;
644
+ &lt;tr <strong>id="list"</strong>&gt;
645
+ &lt;td <strong>id="item"</strong>&gt;foo&lt;/td&gt;
646
+ &lt;/tr&gt;
647
+ &lt;/table&gt;
648
+ </pre>
649
+ </td>
650
+ <td class="n-up2" style="width: 45%">
651
+ <span class="caption">�㡧XMLC�ᥤ��ץ������ʳ��ס�</span>
652
+ <pre class="code">
653
+ 1. <span class="small">�ƥ�ץ졼�Ȥ��ɤ��DOM�ĥ꡼�����</span>
654
+ 2. id<span class="small">°����Ĥ������Ǥ����</span>
655
+ 2-1. id="item"<span class="small">�����Ǥ˥ƥ����Ȥ�����</span>
656
+ 2-2. id="list"<span class="small">�����Ǥ򥳥ԡ�</span>
657
+ 2-3. <span class="small">���ԡ��������Ǥ���</span>id<span class="small">°������</span>
658
+ 2-4. <span class="small">�ꥹ����Υǡ������Ȥ˷����֤�</span>
659
+ 3. <span class="small">DOM�ĥ꡼��HTML�ե�������Ѵ����ƽ���</span>
660
+ </pre>
661
+ </td>
662
+ </tr>
663
+ </table>
664
+ </div>
665
+ <div class="footer">
666
+ <div class="footer-left">
667
+ &nbsp;<a href="#slide1-2" class="navi-prev">&lt;&lt;</a>
668
+ <a href="#slide1-toc" class="navi-toc">^</a>
669
+ </div>
670
+ <div class="footer-right">
671
+ <span class="pagenum">6/50</span>
672
+ <a href="#slide1-4" class="navi-next">&gt;&gt;</a>&nbsp;
673
+ </div>
674
+ <div class="footer-center">
675
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
676
+ </div>
677
+ </div>
678
+ </div>
679
+
680
+
681
+ <div id="slide1-4" class="slide">
682
+ <h2>�ӥ��ͥ��ؤȥץ쥼��ơ��������(1)</h2>
683
+ <div class="slide-body">
684
+ <ul>
685
+ <li>���ץꥱ���������礭��2�Ĥ��ؤ�ʬ��Ǥ���
686
+ <sup><a href="#" onclick="return false;" title="ʬ����ˡ��¾�ˤ�MVC�ʤ��͡������������뤬�������Ǥϥƥ�ץ졼�ȥ����ƥफ�鸫��ʬ����ˡ�Ȥ������ȤǤ����������������롣">*</a></sup>
687
+ <ul>
688
+ <li>�ӥ��ͥ��� �� �ֲ���ɽ�����뤫(What)�פ�ô��</li>
689
+ <li>�ץ쥼��ơ�������� �� �֤ɤΤ褦��ɽ�����뤫(How)�פ�ô��</li>
690
+ </ul>
691
+ </li>
692
+ <li>���ؤ��줾��ˡ��ǡ����ȥ����å���¸�ߤ���
693
+ <table class="matrix" summary="">
694
+ <tr>
695
+ <th></th><th>�ǡ���</th><th>�����å�</th>
696
+ </tr>
697
+ <tr>
698
+ <th>�ӥ��ͥ���</th><td>�ӥ��ͥ��ǡ���</td><td>�ӥ��ͥ������å�</td>
699
+ </tr>
700
+ <tr>
701
+ <th>�ץ쥼��ơ��������</th><td>�ץ쥼��ơ������ǡ���</td><td>�ץ쥼��ơ����������å�</td>
702
+ </tr>
703
+ </table>
704
+ </li>
705
+ <li>�㡧
706
+ <ul>
707
+ <li>�Ķ�����ν��Ȱ��ǡ������顢�ʥӥ��ͥ��ǡ�����</li>
708
+ <li>�Ķ����Ӿ��10̾����Ф����ʥӥ��ͥ������å���</li>
709
+ <li>�طʿ��������Ĥ��֤�Ȥäơ��ʥץ쥼��ơ������ǡ�����</li>
710
+ <li>����Ԥȶ����Ԥǿ�ʬ������ɽ�����롣�ʥץ쥼��ơ����������å���</li>
711
+ </ul>
712
+ </li>
713
+ </ul>
714
+ </div>
715
+ <div class="footer">
716
+ <div class="footer-left">
717
+ &nbsp;<a href="#slide1-3" class="navi-prev">&lt;&lt;</a>
718
+ <a href="#slide1-toc" class="navi-toc">^</a>
719
+ </div>
720
+ <div class="footer-right">
721
+ <span class="pagenum">7/50</span>
722
+ <a href="#slide1-5" class="navi-next">&gt;&gt;</a>&nbsp;
723
+ </div>
724
+ <div class="footer-center">
725
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
726
+ </div>
727
+ </div>
728
+ </div>
729
+
730
+
731
+ <div id="slide1-5" class="slide">
732
+ <h2>�ӥ��ͥ��ؤȥץ쥼��ơ��������(2)</h2>
733
+ <div class="slide-body">
734
+ <ul>
735
+ <li>�ӥ��ͥ��ؤȥץ쥼��ơ�������ؤ�ô��
736
+ <ul>
737
+ <li>�⥸�塼��δ����ʲ���ô������Τ���(What)��
738
+ <!--
739
+ <ul>
740
+ <li>�ӥ��ͥ��� �� �ᥤ��ץ������</li>
741
+ <li>�ץ쥼��ơ�������� �� �ƥ�ץ졼��</li>
742
+ </ul>
743
+ -->
744
+ </li>
745
+ <li>ô���Ԥδ�����ï��ô������Τ���(Who)��
746
+ <!--
747
+ <ul>
748
+ <li>�ӥ��ͥ��� �� �ץ�����ޡ�</li>
749
+ <li>�ץ쥼��ơ�������� �� �ǥ����ʡ�</li>
750
+ </ul>
751
+ -->
752
+ </li>
753
+ </ul>
754
+ <!--div align="center"-->
755
+ <table class="matrix" summary="">
756
+ <tr>
757
+ <th></th><th>�⥸�塼��</th><th>ô����</th>
758
+ </tr>
759
+ <tr>
760
+ <th>�ӥ��ͥ���</th><td>�ᥤ��ץ������</td><td>�ץ�����ޡ�</td>
761
+ </tr>
762
+ <tr>
763
+ <th>�ץ쥼��ơ��������</th><td>�ƥ�ץ졼��</td><td>�ǥ����ʡ�</td>
764
+ </tr>
765
+ </table>
766
+ <!--/div-->
767
+ </li>
768
+ <li>���ƤϤ����ʤ�����
769
+ <ul>
770
+ <li>�ӥ��ͥ��ؤ˥ץ쥼��ơ�������ؤ����Ǥ�������ʤޤ��Ϥ��εա�
771
+ <ul>
772
+ <li>�㡧�ᥤ��ץ���������HTML������°��̾�����Ҥ���Ƥ���</li>
773
+ </ul>
774
+ </li>
775
+ <li>��ʬ��ô���ʳ��Υ⥸�塼��򿨤�
776
+ <ul>
777
+ <li>�㡧HTML�ǥ������ѹ�����뤿�Ӥ˥ץ�����ޡ����ƥ�ץ졼�Ȥ򹹿�����</li>
778
+ <!--
779
+ <li>�㡧�ץ쥼��ơ����������å���ʣ���ˤʤ�ȥץ�����ޡ����������ॿ�����������</li>
780
+ -->
781
+ </ul>
782
+ </li>
783
+ </ul>
784
+ </li>
785
+ </ul>
786
+ </div>
787
+ <div class="footer">
788
+ <div class="footer-left">
789
+ &nbsp;<a href="#slide1-4" class="navi-prev">&lt;&lt;</a>
790
+ <a href="#slide1-toc" class="navi-toc">^</a>
791
+ </div>
792
+ <div class="footer-right">
793
+ <span class="pagenum">8/50</span>
794
+ <a href="#slide1-6" class="navi-next">&gt;&gt;</a>&nbsp;
795
+ </div>
796
+ <div class="footer-center">
797
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
798
+ </div>
799
+ </div>
800
+ </div>
801
+
802
+
803
+ <div id="slide1-6" class="slide">
804
+ <h2>�������Ȳ���(1)</h2>
805
+ <div class="slide-body">
806
+ <ul>
807
+ <li>��������
808
+ <ul>
809
+ <li>�ƥ�ץ졼�Ȥ�HTML�ǥ����������ʥƥ��������ѷ���
810
+ <ul>
811
+ <li>�������ޡ����󥰤ν񼰤�HTML�Ȥϰۤʤ�</li>
812
+ </ul>
813
+ </li>
814
+ <!--
815
+ <li>HTML�ǥ����󤬽�������뤿�Ӥ˥ץ�����ޡ����ƥ�ץ졼�Ȥ򹹿����ʤ���Фʤ�ʤ��ʥƥ��������ѷ���
816
+ -->
817
+ <li>�ǥ����ʡ������������Ǥ�HTML�ե������ƥ�ץ졼�ȤȤ������ѤǤ��ʤ��Τǡ�<br />
818
+ �ץ�����ޡ����ƥ�ץ졼�Ȥ򹹿����ʤ���Фʤ�ʤ��ʥƥ��������ѷ���
819
+ <ul>
820
+ <li>�������ޡ����󥰤ν񼰤�HTML�Ȥϰۤʤ�</li>
821
+ <li>������HTML�ƥ�ץ졼�Ȥ���˥ץ쥼��ơ����������å���������Ǥ���</li>
822
+ </ul>
823
+ </li>
824
+ <li>�ӥ��ͥ��ؤȥץ쥼��ơ�������ؤ�ʬΥ�Ǥ��Ƥ��ʤ���HTML�ò�����
825
+ <ul>
826
+ <li>�������ᥤ��ץ���������˥ץ쥼��ơ����������å���������Ǥ���</li>
827
+ </ul>
828
+ </li>
829
+ </ul>
830
+ </li>
831
+ </ul>
832
+ </div>
833
+ <div class="footer">
834
+ <div class="footer-left">
835
+ &nbsp;<a href="#slide1-5" class="navi-prev">&lt;&lt;</a>
836
+ <a href="#slide1-toc" class="navi-toc">^</a>
837
+ </div>
838
+ <div class="footer-right">
839
+ <span class="pagenum">9/50</span>
840
+ <a href="#slide1-7" class="navi-next">&gt;&gt;</a>&nbsp;
841
+ </div>
842
+ <div class="footer-center">
843
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
844
+ </div>
845
+ </div>
846
+ </div>
847
+
848
+
849
+ <div id="slide1-7" class="slide">
850
+ <h2>�������Ȳ���(2)</h2>
851
+ <div class="slide-body">
852
+ <ul>
853
+ <li>������
854
+ <ul>
855
+ <li>�ޡ����󥰤ν񼰤�HTML��Ʊ���ˤ���
856
+ <ul>
857
+ <li>���̡� �ƥ�ץ졼�Ȥ�HTML�ǥ���������ʤ� <br />
858
+ �������ʥޡ����󥰤Ȥ��ƥ�����°���䥳���Ȥ����̿���Ȥ������
859
+ </li>
860
+ </ul>
861
+ </li>
862
+ <li>�ץ쥼��ơ����������å���������Ω������
863
+ <ul>
864
+ <li>���̡� �ץ�����ޡ����ƥ�ץ졼�Ȥ򹹿����ʤ��ƺѤ� <br />
865
+ ������ ���Ǥ�HTML�ե������ƥ�ץ졼�ȤȤ������ѤǤ��뤿���
866
+ </li>
867
+ <li>���̡� �ӥ��ͥ��ؤȥץ쥼��ơ�������ؤ�����ʬΥ�Ǥ��� <br />
868
+ ������ �ʥᥤ��ץ��������˥ץ쥼��ơ����������å��򵭽Ҥ��ʤ��ƺѤि���
869
+ </li>
870
+ </ul>
871
+ </li>
872
+ </ul>
873
+ </li>
874
+ </ul>
875
+ </div>
876
+ <div class="footer">
877
+ <div class="footer-left">
878
+ &nbsp;<a href="#slide1-6" class="navi-prev">&lt;&lt;</a>
879
+ <a href="#slide1-toc" class="navi-toc">^</a>
880
+ </div>
881
+ <div class="footer-right">
882
+ <span class="pagenum">10/50</span>
883
+ <a href="#slide1-8" class="navi-next">&gt;&gt;</a>&nbsp;
884
+ </div>
885
+ <div class="footer-center">
886
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
887
+ </div>
888
+ </div>
889
+ </div>
890
+
891
+
892
+ <div id="slide1-8" class="slide">
893
+ <h2>�������Ȳ���(3)</h2>
894
+ <div class="slide-body">
895
+ <ul>
896
+ <li>�ְ�ä���ˡ��
897
+ <ul>
898
+ <li>�ƥ�ץ졼�Ȥι�����ǥ����ʡ��˲����դ���
899
+ <ul>
900
+ <li>�ץ��������Ȥ��ۤʤ�С��ġ���Ⳬȯ�����ۤʤ롣
901
+ �ʤ��ǥ����ʡ���ʣ���Υƥ�ץ졼�ȥ����ƥ���ٶ����ʤ���Фʤ�ʤ��Τ���
902
+ </li>
903
+ <!--
904
+ <li>�ǥ����ʡ���˻�������ƥ�ץ졼�ȥ����ƥ�������륳���Ȥʤ�ʧ���ʤ���</li>
905
+ -->
906
+ </ul>
907
+ </li>
908
+ <li>����Υġ����Ȥ��褦�ǥ����ʡ��˲����դ���
909
+ <ul>
910
+ <li>�ץ��ˤϥץ���ƻ�񤬤��롣
911
+ �ǥ����ʡ����Ȥ��Τ�Dreamweaver�Ǥ��ꡢSun��IBM�Τ������ġ���ǤϤʤ���
912
+ </li>
913
+ </ul>
914
+ </li>
915
+ </ul>
916
+ <p>
917
+ <br />
918
+ <strong>�ץ�����ޡ����Թ��ǥ����ʡ��˲����դ���٤��ǤϤʤ�</strong>
919
+ <sup><a href="#" onclick="return false;" title="�ץ�����ޡ���HTML�ǥ������ô������ʤ餳�θ¤�ǤϤʤ���">*</a></sup>
920
+ </p>
921
+ </li>
922
+ </ul>
923
+ </div>
924
+ <div class="footer">
925
+ <div class="footer-left">
926
+ &nbsp;<a href="#slide1-7" class="navi-prev">&lt;&lt;</a>
927
+ <a href="#slide1-toc" class="navi-toc">^</a>
928
+ </div>
929
+ <div class="footer-right">
930
+ <span class="pagenum">11/50</span>
931
+ <a href="#slide2-toc" class="navi-next">&gt;&gt;</a>&nbsp;
932
+ </div>
933
+ <div class="footer-center">
934
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
935
+ </div>
936
+ </div>
937
+ </div>
938
+
939
+
940
+ <div id="slide2-toc" class="slide">
941
+ <h2>�ܼ�</h2>
942
+ <div class="slide-body">
943
+ <ol class="toc">
944
+ <li>�Ϥ���� <a href="#slide1-toc">_</a>
945
+ </li>
946
+ <li class="current">Kwartz����
947
+ <ul class="subtoc">
948
+ <li><a href="#slide2-1">Kwartz�Ȥϡ�</a></li>
949
+ <li><a href="#slide2-2">����ץ롧�ƥ�ץ졼��</a></li>
950
+ <li><a href="#slide2-3">����ץ롧����ѥ���������ѥ�����ץ�</a></li>
951
+ <li><a href="#slide2-4">������(1)</a>,
952
+ <a href="#slide2-5">(2)</a>,
953
+ <a href="#slide2-6">(3)</a>,
954
+ <a href="#slide2-7">(4)</a></li>
955
+ <li><a href="#slide2-8">��ħ����Ĺ</a></li>
956
+ <li><a href="#slide2-9">�ץ쥼��ơ�������ؤι���</a></li>
957
+ </ul>
958
+ </li>
959
+ <li>���٤ʥȥԥå� <a href="#slide3-toc">_</a>
960
+ </li>
961
+ <li>�ǥ��쥯�ƥ��� <a href="#slide4-toc">_</a>
962
+ </li>
963
+ <li>�ץ쥼��ơ������ѥ����� <a href="#slide5-toc">_</a>
964
+ </li>
965
+ </ol>
966
+ </div>
967
+ <div class="footer">
968
+ <div class="footer-left">
969
+ &nbsp;<a href="#slide1-8" class="navi-prev">&lt;&lt;</a>
970
+ <a href="#slide-toc" class="navi-toc">^</a>
971
+ </div>
972
+ <div class="footer-right">
973
+ <span class="pagenum">12/50</span>
974
+ <a href="#slide2-1" class="navi-next">&gt;&gt;</a>&nbsp;
975
+ </div>
976
+ <div class="footer-center">
977
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
978
+ </div>
979
+ </div>
980
+ </div>
981
+
982
+
983
+ <div id="slide2-1" class="slide">
984
+ <h2>Kwartz�Ȥϡ�</h2>
985
+ <div class="slide-body">
986
+ <ul>
987
+ <li>�ǥ����ʡ���ͥ�����ƥ�ץ졼�ȥ����ƥ�</li>
988
+ <li><a href="http://www.kuwata-lab.com/kwartz">http://www.kuwata-lab.com/kwartz</a></li>
989
+ <li>��ħ��
990
+ <ul>
991
+ <li>HTML�ƥ�ץ졼�Ȥ���ץ쥼��ơ����������å���ʬΥ����Ω</li>
992
+ <li>�ޡ����󥰤�id°����Ȥ����ᡢ�ƥ�ץ졼�Ȥ�HTML�ǥ���������ʤ�</li>
993
+ <li>��®������</li>
994
+ <li>ʣ���Υץ�����ߥ󥰸�����б�(Ruby, PHP, Java, Perl)</li>
995
+ <li>��ư���˥���������ʬ���˥�����</li>
996
+ <li>�ƥ��������ѷ�</li>
997
+ <li>Ruby on Rails���ݡ���</li>
998
+ </ul>
999
+ </li>
1000
+ <li>2004ǯ��̤Ƨ���եȥ��������Ⱥ���ץ���������</li>
1001
+ </ul>
1002
+ </div>
1003
+ <div class="footer">
1004
+ <div class="footer-left">
1005
+ &nbsp;<a href="#slide2-toc" class="navi-prev">&lt;&lt;</a>
1006
+ <a href="#slide2-toc" class="navi-toc">^</a>
1007
+ </div>
1008
+ <div class="footer-right">
1009
+ <span class="pagenum">13/50</span>
1010
+ <a href="#slide2-2" class="navi-next">&gt;&gt;</a>&nbsp;
1011
+ </div>
1012
+ <div class="footer-center">
1013
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1014
+ </div>
1015
+ </div>
1016
+ </div>
1017
+
1018
+
1019
+ <div id="slide2-2" class="slide">
1020
+ <h2>����ץ롧�ƥ�ץ졼��</h2>
1021
+ <div class="slide-body">
1022
+ <table class="n-up2" summary="">
1023
+ <tr>
1024
+ <td class="n-up2">
1025
+ <span class="caption">�ץ쥼��ơ������ǡ���(ex1.html)</span>
1026
+ <pre class="code">
1027
+ &lt;table&gt;
1028
+ &lt;tr <strong>id="mark:list"</strong>&gt;
1029
+ &lt;td <strong>id="mark:item"</strong>&gt;foo&lt;/td&gt;
1030
+ &lt;/tr&gt;
1031
+ &lt;/table&gt;
1032
+ </pre>
1033
+ <ul class="descr">
1034
+ <li>�ޡ����󥰤ˤ�id°�������
1035
+ <ul>
1036
+ <li>��id="<em>xxx</em>"�פޤ��ϡ�id="mark:<em>xxx</em>"��</li>
1037
+ <li>�ޡ����󥰤��줿���Ǥ��ץ쥼��ơ����������å��Ǥ�����о�</li>
1038
+ <li>��id="mark:<em>xxx</em>"�פϼ�ưŪ�˾ä���ʡ�id="<em>xxx</em>"�פʤ�Ĥ��</li>
1039
+ </ul>
1040
+ </li>
1041
+ </ul>
1042
+ </td>
1043
+ <td class="n-up2">
1044
+ <span class="caption">�ץ쥼��ơ����������å�(ex1.plogic)</span>
1045
+ <pre class="code">
1046
+ <strong>#list</strong> {
1047
+ logic: {
1048
+ for user in @users
1049
+ <strong>_stag</strong> # start-tag
1050
+ <strong>_cont</strong> # content
1051
+ <strong>_etag</strong> # end-tag
1052
+ end
1053
+ }
1054
+ }
1055
+ <strong>#item</strong> {
1056
+ value: user;
1057
+ }
1058
+ </pre>
1059
+ <ul class="descr">
1060
+ <li>CSS��Ʊ������<!--�ʥ��쥯�����ץ��ѥƥ���-->
1061
+ <!--
1062
+ <ul>
1063
+ <li>���쥯�������Ǥ����</li>
1064
+ <li>�ץ��ѥƥ������Ǥ����</li>
1065
+ </ul>
1066
+ -->
1067
+ </li>
1068
+ <li>����ʸ�ϥ������åȸ���(Ruby, PHP, ...)�ǵ���
1069
+ <!--
1070
+ <ul>
1071
+ <li>�������åȸ���ε�ǽ�򤹤٤����Ѳ�ǽ</li>
1072
+ </ul>
1073
+ -->
1074
+ </li>
1075
+ </ul>
1076
+ </td>
1077
+ </tr>
1078
+ </table>
1079
+ </div>
1080
+ <div class="footer">
1081
+ <div class="footer-left">
1082
+ &nbsp;<a href="#slide2-1" class="navi-prev">&lt;&lt;</a>
1083
+ <a href="#slide2-toc" class="navi-toc">^</a>
1084
+ </div>
1085
+ <div class="footer-right">
1086
+ <span class="pagenum">14/50</span>
1087
+ <a href="#slide2-3" class="navi-next">&gt;&gt;</a>&nbsp;
1088
+ </div>
1089
+ <div class="footer-center">
1090
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1091
+ </div>
1092
+ </div>
1093
+ </div>
1094
+
1095
+
1096
+ <div id="slide2-3" class="slide">
1097
+ <h2>����ץ롧����ѥ���������ѥ�����ץ�</h2>
1098
+ <div class="slide-body">
1099
+ <table class="n-up2" summary="">
1100
+ <tr>
1101
+ <td class="n-up2">
1102
+ <span class="caption">����ѥ���</span>
1103
+ <pre class="console">
1104
+ $ kwartz -l eruby -p ex1.plogic ex1.html > ex1.rhtml
1105
+ </pre>
1106
+ <span class="caption">�����ѥ�����ץ�(ex1.rhtml)</span>
1107
+ <pre class="code">
1108
+ &lt;table&gt;
1109
+ <strong>&lt;% for user in @users %&gt;</strong>
1110
+ &lt;tr&gt;
1111
+ &lt;td&gt;<strong>&lt;%= user %&gt;</strong>&lt;/td&gt;
1112
+ &lt;/tr&gt;
1113
+ <strong>&lt;% end %&gt;</strong>
1114
+ &lt;/table&gt;
1115
+ </pre>
1116
+ </td>
1117
+ <td class="n-up2">
1118
+ </td>
1119
+ </tr>
1120
+ </table>
1121
+ <ul class="descr">
1122
+ <li>����ѥ��뤷�ƽ����ѥ�����ץȡ�eRuby, PHP, JSP�ʤɡˤ�����</li>
1123
+ <li>�¹Ի��ϥᥤ��ץ�����फ������ѥ�����ץȤ�ƤӤ�������
1124
+ <ul>
1125
+ <li>��®������</li>
1126
+ </ul>
1127
+ </li>
1128
+ </ul>
1129
+ </div>
1130
+ <div class="footer">
1131
+ <div class="footer-left">
1132
+ &nbsp;<a href="#slide2-2" class="navi-prev">&lt;&lt;</a>
1133
+ <a href="#slide2-toc" class="navi-toc">^</a>
1134
+ </div>
1135
+ <div class="footer-right">
1136
+ <span class="pagenum">15/50</span>
1137
+ <a href="#slide2-4" class="navi-next">&gt;&gt;</a>&nbsp;
1138
+ </div>
1139
+ <div class="footer-center">
1140
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1141
+ </div>
1142
+ </div>
1143
+ </div>
1144
+
1145
+
1146
+ <div id="slide2-4" class="slide">
1147
+ <h2>������(1)</h2>
1148
+ <div class="slide-body">
1149
+ <table class="n-up2" summary="">
1150
+ <tr>
1151
+ <td class="n-up2">
1152
+ <span class="caption">�������Τ򷫤��֤�</span>
1153
+ <pre class="code">
1154
+ #list {
1155
+ logic: {
1156
+ <strong>for user in @users</strong>
1157
+ _stag
1158
+ _cont
1159
+ _etag
1160
+ <strong>end</strong>
1161
+ }
1162
+ }
1163
+ </pre>
1164
+ </td>
1165
+ <td class="n-up2">
1166
+ <span class="caption">���Ƥ����򷫤��֤�</span>
1167
+ <pre class="code">
1168
+ #list {
1169
+ logic: {
1170
+ _stag
1171
+ <strong>for user in @users</strong>
1172
+ _cont
1173
+ <strong>end</strong>
1174
+ _etag
1175
+ }
1176
+ }
1177
+ </pre>
1178
+ </td>
1179
+ </tr>
1180
+ </table>
1181
+ </div>
1182
+ <div class="footer">
1183
+ <div class="footer-left">
1184
+ &nbsp;<a href="#slide2-3" class="navi-prev">&lt;&lt;</a>
1185
+ <a href="#slide2-toc" class="navi-toc">^</a>
1186
+ </div>
1187
+ <div class="footer-right">
1188
+ <span class="pagenum">16/50</span>
1189
+ <a href="#slide2-5" class="navi-next">&gt;&gt;</a>&nbsp;
1190
+ </div>
1191
+ <div class="footer-center">
1192
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1193
+ </div>
1194
+ </div>
1195
+ </div>
1196
+
1197
+
1198
+ <div id="slide2-5" class="slide">
1199
+ <h2>������(2)</h2>
1200
+ <div class="slide-body">
1201
+ <table class="n-up2" summary="">
1202
+ <tr>
1203
+ <td class="n-up2">
1204
+ <span class="caption">������ΤȤ��������Ǥ�ɽ��</span>
1205
+ <pre class="code">
1206
+ #list {
1207
+ logic: {
1208
+ <strong>if condition</strong>
1209
+ _stag
1210
+ _cont
1211
+ _etag
1212
+ <strong>end</strong>
1213
+ }
1214
+ }
1215
+ </pre>
1216
+ </td>
1217
+ <td class="n-up2">
1218
+ <span class="caption">������ΤȤ��ϥ����򳰤�</span>
1219
+ <pre class="code">
1220
+ #list {
1221
+ logic: {
1222
+ <strong>if condition</strong>
1223
+ _cont
1224
+ <strong>else</strong>
1225
+ _stag
1226
+ _cont
1227
+ _etag
1228
+ <strong>end</strong>
1229
+ }
1230
+ }
1231
+ </pre>
1232
+ </td>
1233
+ </tr>
1234
+ </table>
1235
+ </div>
1236
+ <div class="footer">
1237
+ <div class="footer-left">
1238
+ &nbsp;<a href="#slide2-4" class="navi-prev">&lt;&lt;</a>
1239
+ <a href="#slide2-toc" class="navi-toc">^</a>
1240
+ </div>
1241
+ <div class="footer-right">
1242
+ <span class="pagenum">17/50</span>
1243
+ <a href="#slide2-6" class="navi-next">&gt;&gt;</a>&nbsp;
1244
+ </div>
1245
+ <div class="footer-center">
1246
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1247
+ </div>
1248
+ </div>
1249
+ </div>
1250
+
1251
+
1252
+ <div id="slide2-6" class="slide">
1253
+ <h2>������(3)</h2>
1254
+ <div class="slide-body">
1255
+ <table class="n-up2" summary="">
1256
+ <tr>
1257
+ <td class="n-up2">
1258
+ <span class="caption">���ƤΤ����˼����ͤ����
1259
+ <sup><a href="#" onclick="return false;" title="������ʤ�'value:'�ץ��ѥƥ��Τۤ���Ŭ�ڡ�">*</a></sup>
1260
+ </span>
1261
+ <pre class="code">
1262
+ #list {
1263
+ logic: {
1264
+ _stag
1265
+ <strong>print value</strong>
1266
+ _etag
1267
+ }
1268
+ }
1269
+ </pre>
1270
+ <span class="caption">���ǤΤ����˼����ͤ����
1271
+ <sup><a href="#" onclick="return false;" title="������ʤ�'elem:'�ץ��ѥƥ��Τۤ���Ŭ�ڡ�">*</a></sup>
1272
+ </span>
1273
+ <pre class="code">
1274
+ #list {
1275
+ logic: {
1276
+ <strong>print value</strong>
1277
+ }
1278
+ }
1279
+ </pre>
1280
+ </td>
1281
+ <td class="n-up2">
1282
+ <span class="caption">�ͤ����ꤵ��Ƥ���Ȥ���������
1283
+ <sup><a href="#" onclick="return false;" title="default�ǥ��쥯�ƥ��֤Ǥ�褤���ܺ٤ϸ�ҡ�">*</a></sup>
1284
+
1285
+ </span>
1286
+ <pre class="code">
1287
+ #list {
1288
+ logic: {
1289
+ _stag
1290
+ <strong>if value &amp;&amp; !value.empty?</strong>
1291
+ <strong>print value</strong>
1292
+ <strong>else</strong>
1293
+ <strong>_cont</strong>
1294
+ <strong>end</strong>
1295
+ _etag
1296
+ }
1297
+ }
1298
+ </pre>
1299
+ </td>
1300
+ </tr>
1301
+ </table>
1302
+ </div>
1303
+ <div class="footer">
1304
+ <div class="footer-left">
1305
+ &nbsp;<a href="#slide2-5" class="navi-prev">&lt;&lt;</a>
1306
+ <a href="#slide2-toc" class="navi-toc">^</a>
1307
+ </div>
1308
+ <div class="footer-right">
1309
+ <span class="pagenum">18/50</span>
1310
+ <a href="#slide2-7" class="navi-next">&gt;&gt;</a>&nbsp;
1311
+ </div>
1312
+ <div class="footer-center">
1313
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1314
+ </div>
1315
+ </div>
1316
+ </div>
1317
+
1318
+
1319
+ <div id="slide2-7" class="slide">
1320
+ <h2>������(4)</h2>
1321
+ <div class="slide-body">
1322
+ <table class="n-up2" summary="">
1323
+ <tr>
1324
+ <td class="n-up2">
1325
+ <span class="caption">����Ԥȶ����Ԥ��طʿ����Ѥ���
1326
+ <sup><a href="#" onclick="return false;" title="�ֿ��פξ���ϥץ쥼��ơ������ǡ�����ʬ�व��뤿�ᡢ�Ǥ����CSS��Ȥäƥץ쥼��ơ����������å��ˡֿ��פξ����ޤ�ʤ��褦�ˤ��뤳�Ȥ�˾�ޤ�����">*</a></sup>
1327
+ </span>
1328
+ <pre class="code">
1329
+ #list {
1330
+ <strong>attrs: 'bgcolor' color;</strong>
1331
+ logic: {
1332
+ i = 0
1333
+ for user in @users
1334
+ i += 1
1335
+ <strong>color = i%2==0 ? '#CCF':'#FCC'</strong>
1336
+ _stag
1337
+ _cont
1338
+ _etag
1339
+ end
1340
+ }
1341
+ }
1342
+ </pre>
1343
+ </td>
1344
+ <td class="n-up2">
1345
+ <span class="caption">���ߡ������Ǥ���
1346
+ <sup><a href="#" onclick="return false;" title="dummy�ǥ��쥯�ƥ��֤Ǥ�褤���ܺ٤ϸ�ҡ�">*</a></sup>
1347
+
1348
+ </span>
1349
+ <pre class="code">
1350
+ #list {
1351
+ logic: { }
1352
+ }
1353
+ </pre>
1354
+ <div class="note">
1355
+ <p><em>!!����!!</em></p>
1356
+ <p>�ץ쥼��ơ����������å����ѹ����Ƥ⡢�ץ쥼��ơ������ǡ������ѹ�����ɬ�פ��ʤ�</p>
1357
+ <p class="centerize">��</p>
1358
+ <p><em>�ץ쥼��ơ������ǡ�������ץ쥼��ơ����������å���������ʬΥ����Ω</em></p>
1359
+ </div>
1360
+ </td>
1361
+ </tr>
1362
+ </table>
1363
+ </div>
1364
+ <div class="footer">
1365
+ <div class="footer-left">
1366
+ &nbsp;<a href="#slide2-6" class="navi-prev">&lt;&lt;</a>
1367
+ <a href="#slide2-toc" class="navi-toc">^</a>
1368
+ </div>
1369
+ <div class="footer-right">
1370
+ <span class="pagenum">19/50</span>
1371
+ <a href="#slide2-8" class="navi-next">&gt;&gt;</a>&nbsp;
1372
+ </div>
1373
+ <div class="footer-center">
1374
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1375
+ </div>
1376
+ </div>
1377
+ </div>
1378
+
1379
+
1380
+ <div id="slide2-8" class="slide">
1381
+ <h2>��ħ����Ĺ</h2>
1382
+ <div class="slide-body">
1383
+ <ul>
1384
+ <li>�ޡ����󥰤�id°�������
1385
+ <ul>
1386
+ <li>�� �ƥ�ץ졼�Ȥ�HTML�ǥ���������ʤ�</li>
1387
+ </ul>
1388
+ </li>
1389
+ <li>�ץ쥼��ơ����������å����̥ե������ʬΥ����Ω
1390
+ <ul>
1391
+ <!--
1392
+ <li>�ץ쥼��ơ����������å���ʣ���ˤʤäƤ�HTML�ƥ�ץ졼�Ȥˤϱƶ����ʤ�</li>
1393
+ -->
1394
+ <li>�� �ץ�����ޡ����ƥ�ץ졼�Ȥ�������ɬ�פ��ʤ�<br />
1395
+ �ʥǥ����ʡ������������Ǥ�HTML�ե������ƥ�ץ졼�ȤȤ������ѤǤ��뤿���
1396
+ </li>
1397
+ <li>�� �ӥ��ͥ��ؤȥץ쥼��ơ�������ؤ����줤��ʬΥ�Ǥ���<br />
1398
+ �ʥᥤ��ץ������˥ץ쥼��ơ������ǡ���/�����å��������뤳�Ȥ��ʤ������
1399
+ </li>
1400
+ </ul>
1401
+ </li>
1402
+ <li>����ʸ�ϥ������åȸ���ǵ���
1403
+ <sup><a href="#" onclick="return false;" title="Kwartz��Java�����Ǥϡ�JavaScript�˻����ȼ��������Ѥ��������Ƹ��������������ȤߤˤʤäƤ��롣������ͳ��Java��JSTL���ȤƤ�񤭤ˤ������ᡣ">*</a></sup>
1404
+ <ul>
1405
+ <li>�� �������åȸ���ε�ǽ��ޤ뤴�����ѤǤ����;�פ����¤��ʤ���</li>
1406
+ </ul>
1407
+ </li>
1408
+ <li>����ѥ��뤷�ƽ����ѥ�����ץȤ�����
1409
+ <sup><a href="#" onclick="return false;" title="Kwartz��Java�����Ǥϡ��ȼ��Υ��󥿥ץ꥿�¹ԥ��󥸥����¢���������ѥ�����ץȤ���������ľ�ܼ¹Ԥ��롣������ͳ��JSTL��Velocity�ε�ǽ���㤤���ᡣ">*</a></sup>
1410
+ <ul>
1411
+ <li>�� �¹Ԥ���®���ķ���</li>
1412
+ <li>�� ���Ȥߤ�ñ������򤷤䤹��</li>
1413
+ <li>�� �͡��ʸ�����б����䤹��</li>
1414
+ </ul>
1415
+ </li>
1416
+ <!--
1417
+ <li>�ǥ����ʡ����鸫������
1418
+ <ul>
1419
+ <li>�Ǥ�HTML�ե������ƥ�ץ졼�ȤȤ��ƻ��ѤǤ���</li>
1420
+ <li>HTML�ǥ���������ʤ�</li>
1421
+ <li>CSS�ˤ褯���������ǥץ쥼��ơ����������å��򵭽ҤǤ���</li>
1422
+ </ul>
1423
+ </li>
1424
+ <li>�ץ�����ޡ����鸫������
1425
+ <ul>
1426
+ <li>HTML�ǥ������ѹ��Τ��Ӥ˥ƥ�ץ졼�Ȥ�������ɬ�פ��ʤ�</li>
1427
+ <li>�������åȸ���ε�ǽ��ޤ뤴�Ȼ��ѤǤ����;�פ����¤��ʤ���</li>
1428
+ <li>���Ȥߤ�ñ������򤷤䤹��</li>
1429
+ <li>�������ॿ���ʤɤ򿷤����ٶ�����ɬ�פ��ʤ�</li>
1430
+ </ul>
1431
+ </li>
1432
+ -->
1433
+ </ul>
1434
+ </div>
1435
+ <div class="footer">
1436
+ <div class="footer-left">
1437
+ &nbsp;<a href="#slide2-7" class="navi-prev">&lt;&lt;</a>
1438
+ <a href="#slide2-toc" class="navi-toc">^</a>
1439
+ </div>
1440
+ <div class="footer-right">
1441
+ <span class="pagenum">20/50</span>
1442
+ <a href="#slide2-9" class="navi-next">&gt;&gt;</a>&nbsp;
1443
+ </div>
1444
+ <div class="footer-center">
1445
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1446
+ </div>
1447
+ </div>
1448
+ </div>
1449
+
1450
+
1451
+ <div id="slide2-9" class="slide">
1452
+ <h2>�ץ쥼��ơ�������ؤι���</h2>
1453
+ <div class="slide-body">
1454
+ <table class="n-up2" summary="">
1455
+ <tr>
1456
+ <td class="n-up2">
1457
+ <ul>
1458
+ <li>���ʬô
1459
+ <ul>
1460
+ <li>HTML �� �ɥ�����ȹ�¤</li>
1461
+ <li>CSS �� �ɥ�����ȥǥ�����</li>
1462
+ <li>JavaScript �� ���饤�����¦�����å�</li>
1463
+ <li>Kwartz �� ������¦�����å�
1464
+ <sup><a href="#" onclick="return false;" title="Kwartz��ô������Τϥ�����¦�Υץ쥼��ơ����������å������Ǥ��ꡢ�ӥ��ͥ������å���ô�����ʤ����Ȥ����ա�">*</a></sup>
1465
+ </li>
1466
+ </ul>
1467
+ </li>
1468
+ <li>1�ĤΥե����뤬1�Ĥ���������ô��
1469
+ </li>
1470
+ </ul>
1471
+ </td>
1472
+ <td class="n-up2">
1473
+ <div style="text-align:center">
1474
+ <img src="img/fig05.png" alt="position of Kwartz in presentation layer"
1475
+ style="border: solid 2px #999"/>
1476
+ <br />
1477
+ </div>
1478
+ </td>
1479
+ </tr>
1480
+ </table>
1481
+ </div>
1482
+ <div class="footer">
1483
+ <div class="footer-left">
1484
+ &nbsp;<a href="#slide2-8" class="navi-prev">&lt;&lt;</a>
1485
+ <a href="#slide2-toc" class="navi-toc">^</a>
1486
+ </div>
1487
+ <div class="footer-right">
1488
+ <span class="pagenum">21/50</span>
1489
+ <a href="#slide3-toc" class="navi-next">&gt;&gt;</a>&nbsp;
1490
+ </div>
1491
+ <div class="footer-center">
1492
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1493
+ </div>
1494
+ </div>
1495
+ </div>
1496
+
1497
+
1498
+ <div id="slide3-toc" class="slide">
1499
+ <h2>�ܼ�</h2>
1500
+ <div class="slide-body">
1501
+ <ol class="toc">
1502
+ <li>�Ϥ���� <a href="#slide1-toc">_</a>
1503
+ </li>
1504
+ <li>Kwartz���� <a href="#slide2-toc">_</a>
1505
+ </li>
1506
+ <li class="current">���٤ʥȥԥå�
1507
+ <ul class="subtoc">
1508
+ <li><a href="#slide3-1">�ץ��ѥƥ�</a></li>
1509
+ <li><a href="#slide3-2">��ư����������</a></li>
1510
+ <li><a href="#slide3-3">�ޥ�����쥵�ݡ���</a></li>
1511
+ <li><a href="#slide3-4">�ƥ���������</a></li>
1512
+ <li><a href="#slide3-5">Ruby on Rails���ݡ���</a></li>
1513
+ </ul>
1514
+ </li>
1515
+ <li>�ǥ��쥯�ƥ��� <a href="#slide4-toc">_</a>
1516
+ </li>
1517
+ <li>�ץ쥼��ơ������ѥ����� <a href="#slide5-toc">_</a>
1518
+ </li>
1519
+ </ol>
1520
+ </div>
1521
+ <div class="footer">
1522
+ <div class="footer-left">
1523
+ &nbsp;<a href="#slide2-9" class="navi-prev">&lt;&lt;</a>
1524
+ <a href="#slide-toc" class="navi-toc">^</a>
1525
+ </div>
1526
+ <div class="footer-right">
1527
+ <span class="pagenum">22/50</span>
1528
+ <a href="#slide3-1" class="navi-next">&gt;&gt;</a>&nbsp;
1529
+ </div>
1530
+ <div class="footer-center">
1531
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1532
+ </div>
1533
+ </div>
1534
+ </div>
1535
+
1536
+
1537
+ <div id="slide3-1" class="slide">
1538
+ <h2>�ץ��ѥƥ�</h2>
1539
+ <div class="slide-body">
1540
+ <span class="caption">�ץ��ѥƥ��ΰ���</span>
1541
+ <pre class="code">
1542
+ #id {
1543
+ <strong>value:</strong> username; // <span class="small">���Ǥ�����</span>('cont:'<span class="small">��Ʊ��</span>)
1544
+ <strong>attrs:</strong> 'class' klass, // <span class="small">°���ͤ��ѹ�</span>
1545
+ 'bgcolor' color;
1546
+ <strong>logic:</strong> { ... } // <span class="small">���Ǥ���������å�</span>
1547
+ <strong>remove:</strong> 'id'; // <span class="small">°���κ��</span>
1548
+ <strong>append:</strong> cond ? ' checked="checked"':''; // <span class="small">°�����ɲ�</span>
1549
+ <!--
1550
+ before: { ... } // ľ���˼¹Ԥ�������å�
1551
+ after: { ... } // ľ��˼¹Ԥ�������å�
1552
+ -->
1553
+ <strong>stag:</strong> start_form_tag :action=>'update'; // <span class="small">���ϥ���</span>
1554
+ <strong>cont:</strong> render :partial=>'form'; // <span class="small">���Ǥ�����</span>
1555
+ <strong>etag:</strong> "&lt;/form&gt;"; // <span class="small">�����</span>
1556
+ <strong>elem:</strong> link_to 'List' :action=>'list'; // <span class="small">��������</span>
1557
+ }
1558
+ </pre>
1559
+ </div>
1560
+ <div class="footer">
1561
+ <div class="footer-left">
1562
+ &nbsp;<a href="#slide3-toc" class="navi-prev">&lt;&lt;</a>
1563
+ <a href="#slide3-toc" class="navi-toc">^</a>
1564
+ </div>
1565
+ <div class="footer-right">
1566
+ <span class="pagenum">23/50</span>
1567
+ <a href="#slide3-2" class="navi-next">&gt;&gt;</a>&nbsp;
1568
+ </div>
1569
+ <div class="footer-center">
1570
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1571
+ </div>
1572
+ </div>
1573
+ </div>
1574
+
1575
+
1576
+ <div id="slide3-2" class="slide">
1577
+ <h2>��ư����������</h2>
1578
+ <div class="slide-body">
1579
+ <ul>
1580
+ <li>���ޥ�ɥ��ץ�����-e�פǼ�ư���������ס�����ե�����Ǥ����ġ�</li>
1581
+ <li>��-e�ץ��ץ����˴ط��ʤ������������פ��롦���ʤ��������ǽ</li>
1582
+ </ul>
1583
+ <table class="n-up2" summary="">
1584
+ <tr>
1585
+ <td class="n-up2">
1586
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
1587
+ <pre class="code">
1588
+ &lt;p id="mark:p1"&gt;foo&lt;/p&gt;
1589
+ &lt;p id="mark:p2"&gt;bar&lt;/p&gt;
1590
+ &lt;p id="mark:p3"&gt;baz&lt;/p&gt;
1591
+ </pre>
1592
+ <span class="caption">�ץ쥼��ơ����������å�</span>
1593
+ <pre class="code">
1594
+ #p1 {
1595
+ value: text;
1596
+ }
1597
+ #p2 {
1598
+ <strong>Value:</strong> text;
1599
+ }
1600
+ #p3 {
1601
+ <strong>VALUE:</strong> text;
1602
+ }
1603
+ </pre>
1604
+ </td>
1605
+ <td class="n-up2">
1606
+ <span class="caption">����ѥ����̡�-e���ץ����ʤ���</span>
1607
+ <pre class="code">
1608
+ &lt;p&gt;&lt;%= text %&gt;&lt;/p&gt;
1609
+ &lt;p&gt;&lt;%=<strong>h</strong> text %&gt;&lt;/p&gt;
1610
+ &lt;p&gt;&lt;%= text %&gt;&lt;/p&gt;
1611
+ </pre>
1612
+ <span class="caption">����ѥ����̡�-e���ץ���󤢤��</span>
1613
+ <pre class="code">
1614
+ &lt;p&gt;&lt;%=<strong>h</strong> text %&gt;&lt;/p&gt;
1615
+ &lt;p&gt;&lt;%=<strong>h</strong> text %&gt;&lt;/p&gt;
1616
+ &lt;p&gt;&lt;%= text %&gt;&lt;/p&gt;
1617
+ </pre>
1618
+ </td>
1619
+ </tr>
1620
+ </table>
1621
+ </div>
1622
+ <div class="footer">
1623
+ <div class="footer-left">
1624
+ &nbsp;<a href="#slide3-1" class="navi-prev">&lt;&lt;</a>
1625
+ <a href="#slide3-toc" class="navi-toc">^</a>
1626
+ </div>
1627
+ <div class="footer-right">
1628
+ <span class="pagenum">24/50</span>
1629
+ <a href="#slide3-3" class="navi-next">&gt;&gt;</a>&nbsp;
1630
+ </div>
1631
+ <div class="footer-center">
1632
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1633
+ </div>
1634
+ </div>
1635
+ </div>
1636
+
1637
+
1638
+ <div id="slide3-3" class="slide">
1639
+ <h2>�ޥ�����쥵�ݡ���</h2>
1640
+ <div class="slide-body">
1641
+ <ul>
1642
+ <li>Ruby, eRuby, PHP, JSP, ePerl���б�
1643
+ <sup><a href="#" title="�����ġ����Ȥ����Ȥǡ�JavaScript��C��Scheme�ˤ��б���ǽ��">*</a></sup>
1644
+ <!--
1645
+ <ul>
1646
+ <li>�����ġ����Ȥ���JavaScript, C, Scheme�ˤ��б�</li>
1647
+ </ul>
1648
+ -->
1649
+ </li>
1650
+ <li>Ruby, PHP, Java�μ��������ꡢ���ijƼ�����ʣ��������б�
1651
+ <ul>
1652
+ <li>Java�����Ǥϡ�JavaScript�˻����ȼ�����ǥץ쥼��ơ����������å��򵭽Ҥ���С������Ƹ�����������Ƥ����</li>
1653
+ </ul>
1654
+ </li>
1655
+ <!--
1656
+ <li>�ץ쥼��ơ����������å��򥿡����åȸ���ǵ��Ҥ���<br />
1657
+ ���ޥ�ɥ��ץ�����-l <em>lang</em>�פ���ꤷ�ƥ���ѥ���</li>
1658
+ -->
1659
+ </ul>
1660
+ <table class="n-up2" summary="">
1661
+ <tr>
1662
+ <td class="n-up2">
1663
+ <span class="caption">�ץ쥼��ơ����������å�</span>
1664
+ <pre class="code">
1665
+ #name {
1666
+ logic: {
1667
+ _stag;
1668
+ <strong>if (user != null) {</strong>
1669
+ <strong>print(user);</strong>
1670
+ <strong>} else {</strong>
1671
+ <strong>_cont;</strong>
1672
+ <strong>}</strong>
1673
+ _etag;
1674
+ }
1675
+ }
1676
+ </pre>
1677
+ </td>
1678
+ <td class="n-up2">
1679
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
1680
+ <pre class="code">
1681
+ Hello &lt;span id="name"&gt;guest&lt;/span&gt;!
1682
+ </pre>
1683
+ <span class="caption">Java������JSP�إ���ѥ���</span>
1684
+ <pre class="code">
1685
+ Hello &lt;span id="name"&gt;
1686
+ <strong>&lt;c:choose&gt;&lt;c:when test="${user ne null}"&gt;</strong>
1687
+ <strong>&lt;c:out value="${user}"/&gt;</strong>
1688
+ <strong>&lt;/c:when&gt;&lt;c:otherwise&gt;</strong>
1689
+ <strong>guest&lt;/c:otherwise&gt;&lt;/c:choose&gt;</strong>
1690
+ &lt;/span&gt;!
1691
+ </pre>
1692
+ </td>
1693
+ </tr>
1694
+ </table>
1695
+ </div>
1696
+ <div class="footer">
1697
+ <div class="footer-left">
1698
+ &nbsp;<a href="#slide3-2" class="navi-prev">&lt;&lt;</a>
1699
+ <a href="#slide3-toc" class="navi-toc">^</a>
1700
+ </div>
1701
+ <div class="footer-right">
1702
+ <span class="pagenum">25/50</span>
1703
+ <a href="#slide3-4" class="navi-next">&gt;&gt;</a>&nbsp;
1704
+ </div>
1705
+ <div class="footer-center">
1706
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1707
+ </div>
1708
+ </div>
1709
+ </div>
1710
+
1711
+
1712
+ <div id="slide3-4" class="slide">
1713
+ <h2>�ƥ���������</h2>
1714
+ <div class="slide-body">
1715
+ <ul>
1716
+ <li>HTML/XML�ѡ�������Ѥ��ʤ����ᡢǤ�դΥƥ����ȥե���������Ѳ�ǽ
1717
+ <ul>
1718
+ <li>�㡧�᡼�롢CSV�ե����롢�����������ɡ�LaTeX��PostScript��...</li>
1719
+ <li>Well-formed�Ǥʤ�XML�ե�����Ǥ�OK</li>
1720
+ </ul>
1721
+ </li>
1722
+ </ul>
1723
+ <table class="n-up2" summary="">
1724
+ <tr>
1725
+ <td class="n-up2">
1726
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
1727
+ <pre class="code">
1728
+ &lt;span id="mark:m1"&gt;
1729
+ <strong>&lt;foo&gt; &amp; &lt;bar&gt;</strong>
1730
+ &lt;/span&gt;
1731
+ </pre>
1732
+ <span class="caption">�ץ쥼��ơ����������å�</span>
1733
+ <pre class="code">
1734
+ #m1 {
1735
+ logic: {
1736
+ for i in 0..3 do
1737
+ _cont
1738
+ end
1739
+ }
1740
+ }
1741
+ </pre>
1742
+ </td>
1743
+ <td class="n-up2">
1744
+ <span class="caption">����ѥ���</span>
1745
+ <pre class="code">
1746
+ &lt;% for i in 1..3 do %&gt;
1747
+ <strong>&lt;foo&gt; &amp; &lt;bar&gt;</strong>
1748
+ &lt;% end %&gt;
1749
+ </pre>
1750
+ <span class="caption">�¹Է��</span>
1751
+ <pre class="code">
1752
+ <strong>&lt;foo&gt; &amp; &lt;bar&gt;</strong>
1753
+ <strong>&lt;foo&gt; &amp; &lt;bar&gt;</strong>
1754
+ <strong>&lt;foo&gt; &amp; &lt;bar&gt;</strong>
1755
+ </pre>
1756
+ </td>
1757
+ </tr>
1758
+ </table>
1759
+ </div>
1760
+ <div class="footer">
1761
+ <div class="footer-left">
1762
+ &nbsp;<a href="#slide3-3" class="navi-prev">&lt;&lt;</a>
1763
+ <a href="#slide3-toc" class="navi-toc">^</a>
1764
+ </div>
1765
+ <div class="footer-right">
1766
+ <span class="pagenum">26/50</span>
1767
+ <a href="#slide3-5" class="navi-next">&gt;&gt;</a>&nbsp;
1768
+ </div>
1769
+ <div class="footer-center">
1770
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1771
+ </div>
1772
+ </div>
1773
+ </div>
1774
+
1775
+
1776
+ <div id="slide3-5" class="slide">
1777
+ <h2>Ruby on Rails���ݡ���</h2>
1778
+ <div class="slide-body">
1779
+ <ul>
1780
+ <li>Kwartz�ѥƥ�ץ졼�ȥϥ�ɥ�
1781
+ <ul>
1782
+ <li>��ư����ѥ���</li>
1783
+ <li>�ե����륭��å��塢���ꥭ��å���</li>
1784
+ </ul>
1785
+ </li>
1786
+ <li>layouts��render :partial��Ʊ���ε�ǽ����
1787
+ <sup><a href="#" onclick="return false;" title="scaffold��̤���ݡ���">*</a></sup>
1788
+ <!--
1789
+ <ul>
1790
+ <li>scaffold��̤���ݡ���</li>
1791
+ </ul>
1792
+ -->
1793
+ </li>
1794
+ <!--
1795
+ <li>
1796
+ �ܺ٤ϥ���ץ�ȥ桼�����������ɤ򻲾�
1797
+ </li>
1798
+ -->
1799
+ </ul>
1800
+ <table class="n-up2" summary="">
1801
+ <tr>
1802
+ <td class="n-up2">
1803
+ <span class="caption">�ץ쥼��ơ����������å�</span>
1804
+ <pre class="code" style="font-size: 15pt; line-height: 120%;">
1805
+ #form {
1806
+ stag: <strong>start_form_tag :action=>'create'</strong>;
1807
+ }
1808
+ #user_name {
1809
+ elem: <strong>text_field 'user', 'name'</strong>;
1810
+ }
1811
+ #submit {
1812
+ elem: <strong>submit_tag 'Create'</strong>;
1813
+ }
1814
+ </pre>
1815
+ </td>
1816
+ <td class="n-up2">
1817
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
1818
+ <pre class="code" style="font-size: 15pt; line-height: 120%;">
1819
+ <strong>&lt;form id="mark:form"&gt;</strong>
1820
+ Name: <strong>&lt;input type="text" id="user_name"&gt;</strong>
1821
+ <strong>&lt;input type="submit" id="submit"&gt;</strong>
1822
+ &lt;/form&gt;
1823
+ </pre>
1824
+ <span class="caption">����ѥ�����</span>
1825
+ <pre class="code" style="font-size: 15pt; line-height: 120%;">
1826
+ <strong>&lt;%= start_form_tag :action=&gt;'create' %&gt;</strong>
1827
+ Name: <strong>&lt;%= text_field 'user', 'name' %&gt;</strong>
1828
+ <strong>&lt;%= submit_tag 'Create' %&gt;</strong>
1829
+ &lt;/form&gt;
1830
+ </pre>
1831
+ </td>
1832
+ </tr>
1833
+ </table>
1834
+ </div>
1835
+ <div class="footer">
1836
+ <div class="footer-left">
1837
+ &nbsp;<a href="#slide3-4" class="navi-prev">&lt;&lt;</a>
1838
+ <a href="#slide3-toc" class="navi-toc">^</a>
1839
+ </div>
1840
+ <div class="footer-right">
1841
+ <span class="pagenum">27/50</span>
1842
+ <a href="#slide4-toc" class="navi-next">&gt;&gt;</a>&nbsp;
1843
+ </div>
1844
+ <div class="footer-center">
1845
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1846
+ </div>
1847
+ </div>
1848
+ </div>
1849
+
1850
+
1851
+ <div id="slide4-toc" class="slide">
1852
+ <h2>�ܼ�</h2>
1853
+ <div class="slide-body">
1854
+ <ol class="toc">
1855
+ <li>�Ϥ���� <a href="#slide1-toc">_</a>
1856
+ </li>
1857
+ <li>Kwartz���� <a href="#slide2-toc">_</a>
1858
+ </li>
1859
+ <li>���٤ʥȥԥå� <a href="#slide3-toc">_</a>
1860
+ </li>
1861
+ <li class="current">�ǥ��쥯�ƥ���
1862
+ <ul class="subtoc">
1863
+ <li><a href="#slide4-1">�ǥ��쥯�ƥ��֤ˤĤ���</a></li>
1864
+ <li><a href="#slide4-2">�ޡ�����</a></li>
1865
+ <li><a href="#slide4-3">�ͤν���(1)</a>,
1866
+ <a href="#slide4-4">(2)</a>,
1867
+ <a href="#slide4-5">(3)</a></li>
1868
+ <li><a href="#slide4-6">�����֤�(1)</a>,
1869
+ <a href="#slide4-7">(2)</a>,
1870
+ <a href="#slide4-8">(3)</a>,
1871
+ <a href="#slide4-9">(4)</a></li>
1872
+ <li><a href="#slide4-10">���ʬ��</a></li>
1873
+ <li><a href="#slide4-11">���ߡ�����</a></li>
1874
+ <li><a href="#slide4-12">°����</a></li>
1875
+ <li><a href="#slide4-13">°�����ɲ�</a></li>
1876
+ <li><a href="#slide4-14">�ǥե������</a></li>
1877
+ <li><a href="#slide4-15">���Ƥ����Ǥ��ִ�</a></li>
1878
+ </ul>
1879
+ </li>
1880
+ <li>�ץ쥼��ơ������ѥ����� <a href="#slide5-toc">_</a>
1881
+ </li>
1882
+ </ol>
1883
+ </div>
1884
+ <div class="footer">
1885
+ <div class="footer-left">
1886
+ &nbsp;<a href="#slide3-5" class="navi-prev">&lt;&lt;</a>
1887
+ <a href="#slide-toc" class="navi-toc">^</a>
1888
+ </div>
1889
+ <div class="footer-right">
1890
+ <span class="pagenum">28/50</span>
1891
+ <a href="#slide4-1" class="navi-next">&gt;&gt;</a>&nbsp;
1892
+ </div>
1893
+ <div class="footer-center">
1894
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1895
+ </div>
1896
+ </div>
1897
+ </div>
1898
+
1899
+
1900
+ <div id="slide4-1" class="slide">
1901
+ <h2>�ǥ��쥯�ƥ��֤ˤĤ���</h2>
1902
+ <div class="slide-body">
1903
+ <ul>
1904
+ <li>�ǥ��쥯�ƥ��֤Ȥϡ�
1905
+ <ul>
1906
+ <li>�ץ쥼��ơ������ǡ�����HTML�ե�����ˤ���˥ץ쥼��ơ����������å��������ि���̿��</li>
1907
+ <li>�ͤ�ɽ���������֤������ʬ���ʤɤ����Ѳ�ǽ</li>
1908
+ <li>id°���ޤ���kw:d°������ѡ����Ԥϥ������åȸ������¸�ε�ǽ�Τߡ�</li>
1909
+ </ul>
1910
+ </li>
1911
+ <li>�ʤ�����ʵ�ǽ����
1912
+ <ul>
1913
+ <li>���ѼԤ����������䤹�����<strong>Choosability</strong>��
1914
+ <ul>
1915
+ <li>�ץ쥼��ơ����������å���ʬΥ�������ͤ⤤��С�ʬΥ�������ʤ��ͤ⤤�롣<br />
1916
+ �ɤ�������֤��ϥġ�������ѼԤ�����٤��Ǥ��ꡢ�ġ�����󶡼Ԥ�����٤��ǤϤʤ���
1917
+ </li>
1918
+ </ul>
1919
+ </li>
1920
+ </ul>
1921
+ </li>
1922
+ </ul>
1923
+ </div>
1924
+ <div class="footer">
1925
+ <div class="footer-left">
1926
+ &nbsp;<a href="#slide4-toc" class="navi-prev">&lt;&lt;</a>
1927
+ <a href="#slide4-toc" class="navi-toc">^</a>
1928
+ </div>
1929
+ <div class="footer-right">
1930
+ <span class="pagenum">29/50</span>
1931
+ <a href="#slide4-2" class="navi-next">&gt;&gt;</a>&nbsp;
1932
+ </div>
1933
+ <div class="footer-center">
1934
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1935
+ </div>
1936
+ </div>
1937
+ </div>
1938
+
1939
+
1940
+ <div id="slide4-2" class="slide">
1941
+ <h2>�ޡ�����</h2>
1942
+ <div class="slide-body">
1943
+ <table class="n-up2" summary="">
1944
+ <tr>
1945
+ <td class="n-up2">
1946
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
1947
+ <pre class="code">
1948
+ &lt;table <strong>id="table"</strong>&gt;
1949
+ &lt;tr <strong>id="mark:list"</strong>&gt;
1950
+ &lt;td <strong>kw:d="mark list"</strong>&gt;foo&lt;/td&gt;
1951
+ &lt;/tr&gt;
1952
+ &lt;/table&gt;
1953
+ </pre>
1954
+ <span class="caption">����ѥ�����</span>
1955
+ <pre class="code">
1956
+ &lt;table <strong>id="table"</strong>&gt;
1957
+ &lt;tr&gt;
1958
+ &lt;td&gt;foo&lt;/td&gt;
1959
+ &lt;/tr&gt;
1960
+ &lt;/table&gt;
1961
+ </pre>
1962
+ </td>
1963
+ <td class="n-up2">
1964
+ </td>
1965
+ </tr>
1966
+ </table>
1967
+ <ul class="descr">
1968
+ <li>id°���ǻ����ǽ�ʥ������åȸ������¸�ʵ�ǽ�Τ����</li>
1969
+ <li>��id="<em>xxx</em>"�פ�ޡ����󥰤Ȥ��ư����뤬�����ϻ��˺������ʤ�</li>
1970
+ </ul>
1971
+ </div>
1972
+ <div class="footer">
1973
+ <div class="footer-left">
1974
+ &nbsp;<a href="#slide4-1" class="navi-prev">&lt;&lt;</a>
1975
+ <a href="#slide4-toc" class="navi-toc">^</a>
1976
+ </div>
1977
+ <div class="footer-right">
1978
+ <span class="pagenum">30/50</span>
1979
+ <a href="#slide4-3" class="navi-next">&gt;&gt;</a>&nbsp;
1980
+ </div>
1981
+ <div class="footer-center">
1982
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
1983
+ </div>
1984
+ </div>
1985
+ </div>
1986
+
1987
+
1988
+ <div id="slide4-3" class="slide">
1989
+ <h2>�ͤν���(1)</h2>
1990
+ <div class="slide-body">
1991
+ <table class="n-up2" summary="">
1992
+ <tr>
1993
+ <td class="n-up2">
1994
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
1995
+ <pre class="code">
1996
+ Hello &lt;span <strong>kw:d="value name"</strong>&gt;world&lt;/span&gt;!
1997
+
1998
+ &lt;a href="mailto:<strong>@!{user.email}@</strong>"&gt;<strong>@{user.name}@</strong>&lt;/a&gt;
1999
+ </pre>
2000
+ <span class="caption">����ѥ�����</span>
2001
+ <pre class="code">
2002
+ Hello &lt;span&gt;<strong>&lt;%= name %&gt;</strong>&lt;/span&gt;!
2003
+
2004
+ &lt;a href="mailto:<strong>&lt;%= user.email %&gt;</strong>"&gt;<strong>&lt;%=h user.name %&gt;</strong>&lt;/a&gt;
2005
+ </pre>
2006
+ </td>
2007
+ <td class="n-up2">
2008
+ </td>
2009
+ </tr>
2010
+ </table>
2011
+ <ul class="descr">
2012
+ <li>��kw:d="value <em>expr</em>"�פϡ����ޥ�ɥ��ץ�����-e�פǥ��������פ��롦���ʤ�������Ǥ���</li>
2013
+ <li>��-e�פ˴ؤ�餺����kw:d="Value <em>expr</em>"�פȡ�@{<em>expr</em>}@�פ�ɬ�����������פ�����kw:d="VALUE <em>expr</em>"�פȡ�@!{<em>expr</em>}@�פ�ɬ�����������פ��ʤ�</li>
2014
+ </ul>
2015
+ </div>
2016
+ <div class="footer">
2017
+ <div class="footer-left">
2018
+ &nbsp;<a href="#slide4-2" class="navi-prev">&lt;&lt;</a>
2019
+ <a href="#slide4-toc" class="navi-toc">^</a>
2020
+ </div>
2021
+ <div class="footer-right">
2022
+ <span class="pagenum">31/50</span>
2023
+ <a href="#slide4-4" class="navi-next">&gt;&gt;</a>&nbsp;
2024
+ </div>
2025
+ <div class="footer-center">
2026
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2027
+ </div>
2028
+ </div>
2029
+ </div>
2030
+
2031
+
2032
+ <div id="slide4-4" class="slide">
2033
+ <h2>�ͤν���(2)</h2>
2034
+ <div class="slide-body">
2035
+ <table class="n-up2" summary="">
2036
+ <tr>
2037
+ <td class="n-up2">
2038
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2039
+ <pre class="code">
2040
+ &lt;form <strong>kw:d="stag start_form_tag :action=&gt;'create'"</strong>&gt;
2041
+ &lt;a href="#" <strong>kw:d="elem link_to 'List' :action=&gt;'list'"</strong>&gt;List&lt;/a&gt;
2042
+ &lt;/form&gt;
2043
+ </pre>
2044
+ <span class="caption">����ѥ�����</span>
2045
+ <pre class="code">
2046
+ <strong>&lt;%= start_form_tag :action=&gt;'create' %&gt;</strong>
2047
+ <strong>&lt;%= link_to 'List' :action=&gt;'list' %&gt;</strong>
2048
+ &lt;/form&gt;
2049
+ </pre>
2050
+ </td>
2051
+ <td class="n-up2">
2052
+ </td>
2053
+ </tr>
2054
+ </table>
2055
+ <ul class="descr">
2056
+ <li>��stag�ס�cont�ס�etag�ס�elem�פ����Ѳ�ǽ
2057
+ <!--
2058
+ <ul>
2059
+ <li>kw:d="stag <em>expr</em>" �� ���ϥ����򼰤��ͤ��֤�����</li>
2060
+ <li>kw:d="cont <em>expr</em>" �� ���Ƥ򼰤��ͤ��֤�����</li>
2061
+ <li>kw:d="etag <em>expr</em>" �� ��λ�����򼰤��ͤ��֤�����</li>
2062
+ <li>kw:d="elem <em>expr</em>" �� ���Ǥ򼰤��ͤ��֤�����</li>
2063
+ </ul>
2064
+ -->
2065
+ </li>
2066
+ <li>��Stag�ס�ɬ�����������פ���ˤ��STAG�ס�ɬ�����������פ��ʤ��ˤ����Ѳ�ǽ
2067
+ </li>
2068
+ </ul>
2069
+ </div>
2070
+ <div class="footer">
2071
+ <div class="footer-left">
2072
+ &nbsp;<a href="#slide4-3" class="navi-prev">&lt;&lt;</a>
2073
+ <a href="#slide4-toc" class="navi-toc">^</a>
2074
+ </div>
2075
+ <div class="footer-right">
2076
+ <span class="pagenum">32/50</span>
2077
+ <a href="#slide4-5" class="navi-next">&gt;&gt;</a>&nbsp;
2078
+ </div>
2079
+ <div class="footer-center">
2080
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2081
+ </div>
2082
+ </div>
2083
+ </div>
2084
+
2085
+
2086
+ <div id="slide4-5" class="slide">
2087
+ <h2>�ͤν���(3) �ǥե������</h2>
2088
+ <div class="slide-body">
2089
+ <table class="n-up2" summary="">
2090
+ <tr>
2091
+ <td class="n-up2">
2092
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2093
+ <pre class="code">
2094
+ Hello &lt;span <strong>kw:d="default user"</strong>&gt;guest&lt;/span&gt;
2095
+ </pre>
2096
+ <span class="caption">����ѥ����̡ʼºݤˤ�1�ԡ�</span>
2097
+ <pre class="code">
2098
+ Hello <strong>&lt;% if (user) &amp;&amp; !(user).to_s.empty? then %&gt;
2099
+ &lt;%= user %&gt;&lt;% else %&gt;</strong>guest<strong>&lt;% end %&gt;</strong>
2100
+ </pre>
2101
+ </td>
2102
+ <td class="n-up2">
2103
+ </td>
2104
+ </tr>
2105
+ </table>
2106
+ <ul class="descr">
2107
+ <li>��Default�ס�ɬ�����������פ���ˤȡ�DEFAULT�ס�ɬ�����������פ��ʤ��ˤ����Ѳ�ǽ</li>
2108
+ </ul>
2109
+ </div>
2110
+ <div class="footer">
2111
+ <div class="footer-left">
2112
+ &nbsp;<a href="#slide4-4" class="navi-prev">&lt;&lt;</a>
2113
+ <a href="#slide4-toc" class="navi-toc">^</a>
2114
+ </div>
2115
+ <div class="footer-right">
2116
+ <span class="pagenum">33/50</span>
2117
+ <a href="#slide4-6" class="navi-next">&gt;&gt;</a>&nbsp;
2118
+ </div>
2119
+ <div class="footer-center">
2120
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2121
+ </div>
2122
+ </div>
2123
+ </div>
2124
+
2125
+
2126
+ <div id="slide4-6" class="slide">
2127
+ <h2>�����֤�(1) foreach, list</h2>
2128
+ <div class="slide-body">
2129
+ <table class="n-up2" summary="">
2130
+ <tr>
2131
+ <td>
2132
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2133
+ <pre class="code">
2134
+ &lt;ul <strong>kw:d="for item in list"</strong>&gt;
2135
+ &lt;li&gt;@{item}@&lt;/li&gt;
2136
+ &lt;/ul&gt;
2137
+ </pre>
2138
+ <span class="caption">����ѥ�����</span>
2139
+ <pre class="code">
2140
+ <strong>&lt;% for item in list do %&gt;</strong>
2141
+ &lt;ul&gt;
2142
+ &lt;li&gt;&lt;%=h item %&gt;&lt;/li&gt;
2143
+ &lt;/ul&gt;
2144
+ <strong>&lt;% end %&gt;</strong>
2145
+ </pre>
2146
+ </td>
2147
+ <td>
2148
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2149
+ <pre class="code">
2150
+ &lt;ul <strong>kw:d="list item in list"</strong>&gt;
2151
+ &lt;li&gt;@{item}@&lt;/li&gt;
2152
+ &lt;/ul&gt;
2153
+ </pre>
2154
+ <span class="caption">����ѥ�����</span>
2155
+ <pre class="code">
2156
+ &lt;ul&gt;
2157
+ <strong>&lt;% for item in list do %&gt;</strong>
2158
+ &lt;li&gt;&lt;%=h item %&gt;&lt;/li&gt;
2159
+ <strong>&lt;% end %&gt;</strong>
2160
+ &lt;/ul&gt;
2161
+ </pre>
2162
+ </td>
2163
+ </tr>
2164
+ </table>
2165
+ <ul class="descr">
2166
+ <li>�������Τޤ������Ƥ����򷫤��֤�</li>
2167
+ </ul>
2168
+ </div>
2169
+ <div class="footer">
2170
+ <div class="footer-left">
2171
+ &nbsp;<a href="#slide4-5" class="navi-prev">&lt;&lt;</a>
2172
+ <a href="#slide4-toc" class="navi-toc">^</a>
2173
+ </div>
2174
+ <div class="footer-right">
2175
+ <span class="pagenum">34/50</span>
2176
+ <a href="#slide4-7" class="navi-next">&gt;&gt;</a>&nbsp;
2177
+ </div>
2178
+ <div class="footer-center">
2179
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2180
+ </div>
2181
+ </div>
2182
+ </div>
2183
+
2184
+
2185
+ <div id="slide4-7" class="slide">
2186
+ <h2>�����֤�(2) Foreach, List</h2>
2187
+ <div class="slide-body">
2188
+ <table class="n-up2" summary="">
2189
+ <tr>
2190
+ <td>
2191
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2192
+ <pre class="code">
2193
+ &lt;ul <strong>kw:d="For item in list"</strong>&gt;
2194
+ &lt;li&gt;@{item}@&lt;/li&gt;
2195
+ &lt;/ul&gt;
2196
+ </pre>
2197
+ <span class="caption">����ѥ�����</span>
2198
+ <pre class="code">
2199
+ <strong>&lt;% item_ctr = 0 %&gt;</strong>
2200
+ <strong>&lt;% for item in list do %&gt;</strong>
2201
+ <strong>&lt;% item_ctr += 1 %&gt;</strong>
2202
+ &lt;ul&gt;
2203
+ &lt;li&gt;&lt;%=h item %&gt;&lt;/li&gt;
2204
+ &lt;/ul&gt;
2205
+ <strong>&lt;% end %&gt;</strong>
2206
+ </pre>
2207
+ </td>
2208
+ <td>
2209
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2210
+ <pre class="code">
2211
+ &lt;ul <strong>kw:d="List item in list"</strong>&gt;
2212
+ &lt;li&gt;@{item}@&lt;/li&gt;
2213
+ &lt;/ul&gt;
2214
+ </pre>
2215
+ <span class="caption">����ѥ�����</span>
2216
+ <pre class="code">
2217
+ &lt;ul&gt;
2218
+ <strong>&lt;% item_ctr = 0 %&gt;</strong>
2219
+ <strong>&lt;% for item in list do %&gt;</strong>
2220
+ <strong>&lt;% item_ctr += 1 %&gt;</strong>
2221
+ &lt;li&gt;&lt;%=h item %&gt;&lt;/li&gt;
2222
+ <strong>&lt;% end %&gt;</strong>
2223
+ &lt;/ul&gt;
2224
+ </pre>
2225
+ </td>
2226
+ </tr>
2227
+ </table>
2228
+ <ul class="descr">
2229
+ <li>�롼�ץ����󥿤�ưŪ�˺������Ʒ����֤�</li>
2230
+ </ul>
2231
+ </div>
2232
+ <div class="footer">
2233
+ <div class="footer-left">
2234
+ &nbsp;<a href="#slide4-6" class="navi-prev">&lt;&lt;</a>
2235
+ <a href="#slide4-toc" class="navi-toc">^</a>
2236
+ </div>
2237
+ <div class="footer-right">
2238
+ <span class="pagenum">35/50</span>
2239
+ <a href="#slide4-8" class="navi-next">&gt;&gt;</a>&nbsp;
2240
+ </div>
2241
+ <div class="footer-center">
2242
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2243
+ </div>
2244
+ </div>
2245
+ </div>
2246
+
2247
+
2248
+ <div id="slide4-8" class="slide">
2249
+ <h2>�����֤�(3) FOREACH, LIST</h2>
2250
+ <div class="slide-body">
2251
+ <table class="n-up2" summary="">
2252
+ <tr>
2253
+ <td class="n-up2">
2254
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2255
+ <pre class="code">
2256
+ &lt;tr class="@!{item_tgl}@" <strong>kw:d="FOR item in list"</strong>&gt;
2257
+ &lt;td&gt;@{item}@&lt;/td&gt;
2258
+ &lt;/tr&gt;
2259
+ </pre>
2260
+ <span class="caption">����ѥ�����</span>
2261
+ <pre class="code">
2262
+ <strong>&lt;% item_ctr = 0 %&gt;</strong>
2263
+ <strong>&lt;% for item in list do %&gt;</strong>
2264
+ <strong>&lt;% item_ctr += 1 %&gt;</strong>
2265
+ <strong>&lt;% item_tgl = item_ctr%2==0 ? 'even' : 'odd' %&gt;</strong>
2266
+ &lt;tr class="&lt;%= item_tgl %&gt;"&gt;
2267
+ &lt;td&gt;&lt;%=h item %&gt;&lt;/td&gt;
2268
+ &lt;/tr&gt;
2269
+ <strong>&lt;% end %&gt;</strong>
2270
+ </pre>
2271
+ </td>
2272
+ <td class="n-up2">
2273
+ </td>
2274
+ </tr>
2275
+ </table>
2276
+ <ul class="descr">
2277
+ <li>�롼�ץ����󥿤ȥȥ����ѿ���ưŪ�˺������Ʒ����֤�</li>
2278
+ </ul>
2279
+ </div>
2280
+ <div class="footer">
2281
+ <div class="footer-left">
2282
+ &nbsp;<a href="#slide4-7" class="navi-prev">&lt;&lt;</a>
2283
+ <a href="#slide4-toc" class="navi-toc">^</a>
2284
+ </div>
2285
+ <div class="footer-right">
2286
+ <span class="pagenum">36/50</span>
2287
+ <a href="#slide4-9" class="navi-next">&gt;&gt;</a>&nbsp;
2288
+ </div>
2289
+ <div class="footer-center">
2290
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2291
+ </div>
2292
+ </div>
2293
+ </div>
2294
+
2295
+
2296
+ <div id="slide4-9" class="slide">
2297
+ <h2>�����֤�(4) while, loop</h2>
2298
+ <div class="slide-body">
2299
+ <table class="n-up2" summary="">
2300
+ <tr>
2301
+ <td>
2302
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2303
+ <pre class="code">
2304
+ &lt;ul <strong>kw:d="while r = h.fetch()"</strong>&gt;
2305
+ &lt;li&gt;@{r['name']}@&lt;/li&gt;
2306
+ &lt;/ul&gt;
2307
+ </pre>
2308
+ <span class="caption">����ѥ�����</span>
2309
+ <pre class="code">
2310
+ <strong>&lt;% while r = h.fetch() do %&gt;</strong>
2311
+ &lt;ul&gt;
2312
+ &lt;li&gt;&lt;%=h r['name'] %&gt;&lt;/li&gt;
2313
+ &lt;/ul&gt;
2314
+ <strong>&lt;% end %&gt;</strong>
2315
+ </pre>
2316
+ </td>
2317
+ <td>
2318
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2319
+ <pre class="code">
2320
+ &lt;ul <strong>kw:d="loop r = h.fetch()"</strong>&gt;
2321
+ &lt;li&gt;@{r['name']}@&lt;/li&gt;
2322
+ &lt;/ul&gt;
2323
+ </pre>
2324
+ <span class="caption">����ѥ�����</span>
2325
+ <pre class="code">
2326
+ &lt;ul&gt;
2327
+ <strong>&lt;% while r = h.fetch() do %&gt;</strong>
2328
+ &lt;li&gt;&lt;%=h r['name'] %&gt;&lt;/li&gt;
2329
+ <strong>&lt;% end %&gt;</strong>
2330
+ &lt;/ul&gt;
2331
+ </pre>
2332
+ </td>
2333
+ </tr>
2334
+ </table>
2335
+ <ul class="descr">
2336
+ <li>�������Τޤ������Ƥ����򷫤��֤�</li>
2337
+ </ul>
2338
+ </div>
2339
+ <div class="footer">
2340
+ <div class="footer-left">
2341
+ &nbsp;<a href="#slide4-8" class="navi-prev">&lt;&lt;</a>
2342
+ <a href="#slide4-toc" class="navi-toc">^</a>
2343
+ </div>
2344
+ <div class="footer-right">
2345
+ <span class="pagenum">37/50</span>
2346
+ <a href="#slide4-10" class="navi-next">&gt;&gt;</a>&nbsp;
2347
+ </div>
2348
+ <div class="footer-center">
2349
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2350
+ </div>
2351
+ </div>
2352
+ </div>
2353
+
2354
+
2355
+ <div id="slide4-10" class="slide">
2356
+ <h2>���ʬ��</h2>
2357
+ <div class="slide-body">
2358
+ <table class="n-up2" summary="">
2359
+ <tr>
2360
+ <td class="n-up2">
2361
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2362
+ <pre class="code">
2363
+ &lt;p <strong>kw:d="if val > 0"</strong>&gt;
2364
+ val is positive.
2365
+ &lt;/p&gt;
2366
+ &lt;p <strong>kw:d="elsif val < 0"</strong>&gt;
2367
+ val is negative.
2368
+ &lt;/p&gt;
2369
+ &lt;p <strong>kw:d="else "</strong>&gt;
2370
+ val is zero.
2371
+ &lt;/p&gt;
2372
+ </pre>
2373
+ </td>
2374
+ <td class="n-up2">
2375
+ <span class="caption">����ѥ�����</span>
2376
+ <pre class="code">
2377
+ <strong>&lt;% if val > 0 %&gt;</strong>
2378
+ &lt;p&gt;
2379
+ val is positive.
2380
+ &lt;/p&gt;
2381
+ <strong>&lt;% elsif val < 0 %&gt;</strong>
2382
+ &lt;p&gt;
2383
+ val is negative.
2384
+ &lt;/p&gt;
2385
+ <strong>&lt;% else %&gt;</strong>
2386
+ &lt;p&gt;
2387
+ val is zero.
2388
+ &lt;/p&gt;
2389
+ <strong>&lt;% end %&gt;</strong>
2390
+ </pre>
2391
+ </td>
2392
+ </tr>
2393
+ </table>
2394
+ <ul class="descr">
2395
+ <!--
2396
+ <li>if�����Ǥʤ�elsif��else����Ѳ�ǽ</li>
2397
+ -->
2398
+ <li>if��elsif��else�����ꤵ�줿���������ܤ��Ƥ���ɬ�פ�����ʴ֤˶��Ԥ����äƤϤ����ʤ���</li>
2399
+ </ul>
2400
+ </div>
2401
+ <div class="footer">
2402
+ <div class="footer-left">
2403
+ &nbsp;<a href="#slide4-9" class="navi-prev">&lt;&lt;</a>
2404
+ <a href="#slide4-toc" class="navi-toc">^</a>
2405
+ </div>
2406
+ <div class="footer-right">
2407
+ <span class="pagenum">38/50</span>
2408
+ <a href="#slide4-11" class="navi-next">&gt;&gt;</a>&nbsp;
2409
+ </div>
2410
+ <div class="footer-center">
2411
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2412
+ </div>
2413
+ </div>
2414
+ </div>
2415
+
2416
+
2417
+ <div id="slide4-11" class="slide">
2418
+ <h2>����</h2>
2419
+ <div class="slide-body">
2420
+ <table class="n-up2" summary="">
2421
+ <tr>
2422
+ <td class="n-up2">
2423
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2424
+ <pre class="code">
2425
+ &lt;table <strong>kw:d="set i=0"</strong>&gt;
2426
+ &lt;tbody kw:d="list item in items"&gt;
2427
+ &lt;tr <strong>kw:d="set i+=1"</strong>&gt;
2428
+ &lt;td&gt;@!{i}@&lt;/td&gt;
2429
+ &lt;td&gt;@{item}@&lt;/td&gt;
2430
+ &lt;/tr&gt;
2431
+ &lt;/tbody&gt;
2432
+ &lt;/table&gt;
2433
+ </pre>
2434
+ </td>
2435
+ <td class="n-up2">
2436
+ <span class="caption">����ѥ�����</span>
2437
+ <pre class="code">
2438
+ <strong>&lt;% i=0 %&gt;</strong>
2439
+ &lt;table&gt;
2440
+ &lt;tbody&gt;
2441
+ &lt;% for item in items do %&gt;
2442
+ <strong>&lt;% i+=1 %&gt;</strong>
2443
+ &lt;tr&gt;
2444
+ &lt;td&gt;&lt;%= i %&gt;&lt;/td&gt;
2445
+ &lt;td&gt;&lt;%=h item %&gt;&lt;/td&gt;
2446
+ &lt;/tr&gt;
2447
+ &lt;% end %&gt;
2448
+ &lt;/tbody&gt;
2449
+ &lt;/table&gt;
2450
+ </pre>
2451
+ </td>
2452
+ </tr>
2453
+ </table>
2454
+ <ul class="descr">
2455
+ <li>�����������������������</li>
2456
+ </ul>
2457
+ </div>
2458
+ <div class="footer">
2459
+ <div class="footer-left">
2460
+ &nbsp;<a href="#slide4-10" class="navi-prev">&lt;&lt;</a>
2461
+ <a href="#slide4-toc" class="navi-toc">^</a>
2462
+ </div>
2463
+ <div class="footer-right">
2464
+ <span class="pagenum">39/50</span>
2465
+ <a href="#slide4-12" class="navi-next">&gt;&gt;</a>&nbsp;
2466
+ </div>
2467
+ <div class="footer-center">
2468
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2469
+ </div>
2470
+ </div>
2471
+ </div>
2472
+
2473
+
2474
+ <div id="slide4-12" class="slide">
2475
+ <h2>���ߡ�����</h2>
2476
+ <div class="slide-body">
2477
+ <table class="n-up2" summary="">
2478
+ <tr>
2479
+ <td>
2480
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2481
+ <pre class="code">
2482
+ &lt;table&gt;
2483
+ &lt;tr bgcolor="#FCC"&gt;
2484
+ &lt;td&gt;foo&lt;/td&gt;
2485
+ &lt;/tr&gt;
2486
+ &lt;tr bgcolor="#CCF" <strong>id="dummy:d1"</strong>&gt;
2487
+ &lt;td&gt;bar&lt;/td&gt;
2488
+ &lt;/tr&gt;
2489
+ &lt;tr bgcolor="#FCC" <strong>kw:d="dummy "</strong>&gt;
2490
+ &lt;td&gt;baz&lt;/td&gt;
2491
+ &lt;/tr&gt;
2492
+ &lt;/table&gt;
2493
+ </pre>
2494
+ </td>
2495
+ <td>
2496
+ <span class="caption">����ѥ�����</span>
2497
+ <pre class="code">
2498
+ &lt;table&gt;
2499
+ &lt;tr bgcolor="#FCC"&gt;
2500
+ &lt;td&gt;foo&lt;/td&gt;
2501
+ &lt;/tr&gt;
2502
+ &lt;/table&gt;
2503
+ </pre>
2504
+ </td>
2505
+ </tr>
2506
+ </table>
2507
+ <ul class="descr">
2508
+ <li>id°���ǻ����ǽ�ʥ������åȸ������¸�ʵ�ǽ�Τ����</li>
2509
+ <li>id°�����ͤ��Ťʤ�ʤ��褦����id="dummy:<strong><em>xxx</em></strong>"�פˤ�Ŭ����ʸ��������</li>
2510
+ </ul>
2511
+ </div>
2512
+ <div class="footer">
2513
+ <div class="footer-left">
2514
+ &nbsp;<a href="#slide4-11" class="navi-prev">&lt;&lt;</a>
2515
+ <a href="#slide4-toc" class="navi-toc">^</a>
2516
+ </div>
2517
+ <div class="footer-right">
2518
+ <span class="pagenum">40/50</span>
2519
+ <a href="#slide4-13" class="navi-next">&gt;&gt;</a>&nbsp;
2520
+ </div>
2521
+ <div class="footer-center">
2522
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2523
+ </div>
2524
+ </div>
2525
+ </div>
2526
+
2527
+
2528
+ <div id="slide4-13" class="slide">
2529
+ <h2>°����</h2>
2530
+ <div class="slide-body">
2531
+ <table class="n-up2" summary="">
2532
+ <tr>
2533
+ <td class="n-up2">
2534
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2535
+ <pre class="code">
2536
+ &lt;p bgcolor="#FCC"
2537
+ <strong>kw:d="attr 'bgcolor' color; attr 'class' klass"</strong>&gt;
2538
+ Hello world
2539
+ &lt;/p&gt;
2540
+ </pre>
2541
+ <span class="caption">����ѥ�����</span>
2542
+ <pre class="code">
2543
+ &lt;p bgcolor="<strong>&lt;%= color %&gt;</strong>" <strong>class="&lt;%= klass %&gt;"</strong>&gt;
2544
+ Hello world
2545
+ &lt;/p&gt;
2546
+ </pre>
2547
+ </td>
2548
+ <td class="n-up2">
2549
+ </td>
2550
+ </tr>
2551
+ </table>
2552
+ <ul class="descr">
2553
+ <li>���ߥ�����Ƕ��ڤä�ʣ�������ǽ</li>
2554
+ <li>��Attr�ס�ɬ�����������פ���ˤȡ�ATTR�ס�ɬ�����������פ��ʤ��ˤ����Ѳ�ǽ</li>
2555
+ </ul>
2556
+ </div>
2557
+ <div class="footer">
2558
+ <div class="footer-left">
2559
+ &nbsp;<a href="#slide4-12" class="navi-prev">&lt;&lt;</a>
2560
+ <a href="#slide4-toc" class="navi-toc">^</a>
2561
+ </div>
2562
+ <div class="footer-right">
2563
+ <span class="pagenum">41/50</span>
2564
+ <a href="#slide4-14" class="navi-next">&gt;&gt;</a>&nbsp;
2565
+ </div>
2566
+ <div class="footer-center">
2567
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2568
+ </div>
2569
+ </div>
2570
+ </div>
2571
+
2572
+
2573
+ <div id="slide4-14" class="slide">
2574
+ <h2>°�����ɲ�</h2>
2575
+ <div class="slide-body">
2576
+ <table class="n-up2" summary="">
2577
+ <tr>
2578
+ <td class="n-up2">
2579
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2580
+ <pre class="code">
2581
+ &lt;input type="checkbox" <strong>kw:d="append cond ? ' checked' : ''"</strong>&gt;
2582
+ </pre>
2583
+ <span class="caption">����ѥ�����</span>
2584
+ <pre class="code">
2585
+ &lt;input type="checkbox"<strong>&lt;%= cond ? ' checked' : '' %&gt;</strong>&gt;
2586
+ </pre>
2587
+ </td>
2588
+ <td class="n-up2">
2589
+ </td>
2590
+ </tr>
2591
+ </table>
2592
+ <ul class="descr">
2593
+ <li>���ߥ�����Ƕ��ڤä�ʣ�������ǽ</li>
2594
+ <li>��Append�ס�ɬ�����������פ���ˤȡ�APPEND�ס�ɬ�����������פ��ʤ��ˤ����Ѳ�ǽ</li>
2595
+ </ul>
2596
+ </div>
2597
+ <div class="footer">
2598
+ <div class="footer-left">
2599
+ &nbsp;<a href="#slide4-13" class="navi-prev">&lt;&lt;</a>
2600
+ <a href="#slide4-toc" class="navi-toc">^</a>
2601
+ </div>
2602
+ <div class="footer-right">
2603
+ <span class="pagenum">42/50</span>
2604
+ <a href="#slide4-15" class="navi-next">&gt;&gt;</a>&nbsp;
2605
+ </div>
2606
+ <div class="footer-center">
2607
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2608
+ </div>
2609
+ </div>
2610
+ </div>
2611
+
2612
+
2613
+ <div id="slide4-15" class="slide">
2614
+ <h2>���Ǥ����Ƥ��ִ�</h2>
2615
+ <div class="slide-body">
2616
+ <table class="n-up2" summary="">
2617
+ <tr>
2618
+ <td class="n-up2">
2619
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2620
+ <pre class="code">
2621
+ &lt;div id="nav"&gt;
2622
+ &lt;a href="/"&gt;Top&lt;/a&gt; &amp;lt;
2623
+ Documents
2624
+ &lt;/div&gt;
2625
+ ...
2626
+ &lt;div
2627
+ <strong>id="replace_content_with_content:nav"</strong>&gt;
2628
+ Top &amp;lt; Documents
2629
+ &lt;/div&gt;
2630
+ </pre>
2631
+ </td>
2632
+ <td>
2633
+ <span class="caption">����ѥ�����</span>
2634
+ <pre class="code">
2635
+ &lt;div id="nav"&gt;
2636
+ &lt;a href="/"&gt;Top&lt;/a&gt; &amp;lt;
2637
+ Documents
2638
+ &lt;/div&gt;
2639
+ ...
2640
+ <strong>&lt;div&gt;
2641
+ &lt;a href="/"&gt;Top&lt;/a&gt; &amp;lt;
2642
+ Documents
2643
+ &lt;/div&gt;</strong>
2644
+ </pre>
2645
+ </td>
2646
+ </tr>
2647
+ </table>
2648
+ <ul class="descr">
2649
+ <li>escape_element_with_element �� �������Τ�¾�����Ǥ��ִ�</li>
2650
+ <li>escape_element_with_content �� �������Τ�¾�����Ǥ����Ƥ��ִ�</li>
2651
+ <li>escape_content_with_element �� ���Ǥ����Ƥ�¾�����Ǥ��ִ�</li>
2652
+ <li>escape_content_with_content �� ���Ǥ����Ƥ�¾�����Ǥ����Ƥ��ִ�</li>
2653
+ </ul>
2654
+ </div>
2655
+ <div class="footer">
2656
+ <div class="footer-left">
2657
+ &nbsp;<a href="#slide4-14" class="navi-prev">&lt;&lt;</a>
2658
+ <a href="#slide4-toc" class="navi-toc">^</a>
2659
+ </div>
2660
+ <div class="footer-right">
2661
+ <span class="pagenum">43/50</span>
2662
+ <a href="#slide5-toc" class="navi-next">&gt;&gt;</a>&nbsp;
2663
+ </div>
2664
+ <div class="footer-center">
2665
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2666
+ </div>
2667
+ </div>
2668
+ </div>
2669
+
2670
+
2671
+ <div id="slide5-toc" class="slide">
2672
+ <h2>�ܼ�</h2>
2673
+ <div class="slide-body">
2674
+ <ol class="toc">
2675
+ <li>�Ϥ���� <a href="#slide1-toc">_</a>
2676
+ </li>
2677
+ <li>Kwartz���� <a href="#slide2-toc">_</a>
2678
+ </li>
2679
+ <li>���٤ʥȥԥå� <a href="#slide3-toc">_</a>
2680
+ </li>
2681
+ <li>�ǥ��쥯�ƥ��� <a href="#slide4-toc">_</a>
2682
+ </li>
2683
+ <li class="current">�ץ쥼��ơ������ѥ�����
2684
+ <ul class="subtoc">
2685
+ <li><a href="#slide5-1">�ץ쥼��ơ������ѥ�����Ȥϡ�</a></li>
2686
+ <li><a href="#slide5-2">Replace Element/Content with Element/Content Pattern</a></li>
2687
+ <li><a href="#slide5-3">Select Element/Content Pattern</a></li>
2688
+ <li><a href="#slide5-4">Pick-up Element/Content Pattern</a></li>
2689
+ <li><a href="#slide5-5">Extract Element/Content Pattern</a></li>
2690
+ </ul>
2691
+ </li>
2692
+ </ol>
2693
+ </div>
2694
+ <div class="footer">
2695
+ <div class="footer-left">
2696
+ &nbsp;<a href="#slide4-15" class="navi-prev">&lt;&lt;</a>
2697
+ <a href="#slide-toc" class="navi-toc">^</a>
2698
+ </div>
2699
+ <div class="footer-right">
2700
+ <span class="pagenum">44/50</span>
2701
+ <a href="#slide5-1" class="navi-next">&gt;&gt;</a>&nbsp;
2702
+ </div>
2703
+ <div class="footer-center">
2704
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2705
+ </div>
2706
+ </div>
2707
+ </div>
2708
+
2709
+
2710
+ <div id="slide5-1" class="slide">
2711
+ <h2>�ץ쥼��ơ������ѥ�����Ȥϡ�</h2>
2712
+ <div class="slide-body">
2713
+ <ul>
2714
+ <li>�ץ쥼��ơ����������å��ˤ���������С�</li>
2715
+ <li>����
2716
+ <ul style="font-size: 14pt">
2717
+ <li>Replace Element/Content with Value/Element/Content Pattern</li>
2718
+ <li>Default Content Pattern</li>
2719
+ <li>Delete Element/Content/Tag Pattern</li>
2720
+ <li>Iterate Element/Content Pattern</li>
2721
+ <li>Select Element/Content Pattern</li>
2722
+ <li>Pick-up Element/Content Pattern</li>
2723
+ <li>Extract Element/Content Pattern</li>
2724
+ </ul>
2725
+ </li>
2726
+ <li>�ܺ٤�
2727
+ ��<a href="http://www.kuwata-lab.com/kwartz/kwartz3ruby-pattern-catalog.html">Presentation Pattern Catalog</a>��
2728
+ �򻲾ȤΤ���
2729
+ </li>
2730
+ </ul>
2731
+ </div>
2732
+ <div class="footer">
2733
+ <div class="footer-left">
2734
+ &nbsp;<a href="#slide5-toc" class="navi-prev">&lt;&lt;</a>
2735
+ <a href="#slide5-toc" class="navi-toc">^</a>
2736
+ </div>
2737
+ <div class="footer-right">
2738
+ <span class="pagenum">45/50</span>
2739
+ <a href="#slide5-2" class="navi-next">&gt;&gt;</a>&nbsp;
2740
+ </div>
2741
+ <div class="footer-center">
2742
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2743
+ </div>
2744
+ </div>
2745
+ </div>
2746
+
2747
+
2748
+ <div id="slide5-2" class="slide">
2749
+ <h2>Replace Elem/Cont with Elem/Cont Pattern</h2>
2750
+ <div class="slide-body">
2751
+ <ul>
2752
+ <li>�ޡ����󥰤������Ǥ����Ƥ��̤����Ǥ����Ƥ��֤���������̥ե�������Ǥ�ġ�</li>
2753
+ </ul>
2754
+ <table class="n-up2" summary="">
2755
+ <tr>
2756
+ <td class="n-up2">
2757
+ <span class="caption">�ץ쥼��ơ������ǡ����ʥ쥤�����ȡ�</span>
2758
+ <pre class="code2">
2759
+ &lt;html lang="en"&gt;
2760
+ &lt;body onload="init()"&gt;
2761
+ &lt;div <strong>id="placeholder"</strong>&gt;...&lt;/div&gt;
2762
+ &lt;/body&gt;
2763
+ &lt;/html&gt;
2764
+ </pre>
2765
+ <span class="caption">�ץ쥼��ơ������ǡ����ʥ���ƥ�ġ�</span>
2766
+ <pre class="code2">
2767
+ &lt;html&gt;&lt;body&gt;
2768
+ &lt;div <strong>id="mark:pagecontent"</strong>&gt;
2769
+ Hello Kwartz!
2770
+ &lt;/div&gt;
2771
+ &lt;/body&gt;&lt;/html&gt;
2772
+ </pre>
2773
+ </td>
2774
+ <td>
2775
+ <span class="caption">�ץ쥼��ơ����������å�</span>
2776
+ <pre class="code2">
2777
+ <strong>#placeholder</strong> {
2778
+ logic: {
2779
+ <strong>_element(pagecontent)</strong>
2780
+ }
2781
+ }
2782
+ </pre>
2783
+ <span class="caption">����ѥ�����</span>
2784
+ <pre class="code2">
2785
+ &lt;html lang="en"&gt;
2786
+ &lt;body onload="init()"&gt;
2787
+ <strong>&lt;div&gt;</strong>
2788
+ <strong>Hello Kwartz!</strong>
2789
+ <strong>&lt;/div&gt;</strong>
2790
+ &lt;/body&gt;
2791
+ &lt;/html&gt;
2792
+ </pre>
2793
+ </td>
2794
+ </tr>
2795
+ </table>
2796
+ </div>
2797
+ <div class="footer">
2798
+ <div class="footer-left">
2799
+ &nbsp;<a href="#slide5-1" class="navi-prev">&lt;&lt;</a>
2800
+ <a href="#slide5-toc" class="navi-toc">^</a>
2801
+ </div>
2802
+ <div class="footer-right">
2803
+ <span class="pagenum">46/50</span>
2804
+ <a href="#slide5-3" class="navi-next">&gt;&gt;</a>&nbsp;
2805
+ </div>
2806
+ <div class="footer-center">
2807
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2808
+ </div>
2809
+ </div>
2810
+ </div>
2811
+
2812
+
2813
+ <div id="slide5-3" class="slide">
2814
+ <h2>Select Element/Content Pattern</h2>
2815
+ <div class="slide-body">
2816
+ <ul>
2817
+ <li>�ޡ����󥰤��줿ʣ�������Ǥ���ҤȤĤ�������</li>
2818
+ </ul>
2819
+ <table class="n-up2" summary="">
2820
+ <tr>
2821
+ <td class="n-up2">
2822
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2823
+ <pre class="code2">
2824
+ &lt;div id="mark:message"&gt;
2825
+ &lt;p style="color:red"
2826
+ <strong>id="mark:error"</strong>&gt;ERROR!&lt;/p&gt;
2827
+ &lt;p style="color:blue"
2828
+ <strong>id="mark:warning"</strong>&gt;Warning:&lt;/p&gt;
2829
+ &lt;p <strong>id="mark:good"</strong>&gt;No error.&lt;/p&gt;
2830
+ &lt;/div&gt;
2831
+ </pre>
2832
+ <span class="caption">����ѥ�����</span>
2833
+ <pre class="code2">
2834
+ &lt;% if status == 'error' %&gt;
2835
+ <strong>&lt;p style="color:red"&gt;ERROR!&lt;/p&gt;</strong>
2836
+ &lt;% else if status == 'warning' %&gt;
2837
+ <strong>&lt;p style="color:blue"&gt;Warning:&lt;/p&gt;</strong>
2838
+ &lt;% else %&gt;
2839
+ <strong>&lt;p&gt;No error.&lt;/p&gt;</strong>
2840
+ &lt;% end %&gt;
2841
+ </pre>
2842
+ </td>
2843
+ <td>
2844
+ <span class="caption">�ץ쥼��ơ����������å�</span>
2845
+ <pre class="code2">
2846
+ #message {
2847
+ logic: {
2848
+ if status == 'error'
2849
+ <strong>_element(error)</strong>
2850
+ else if status == 'warning'
2851
+ <strong>_element(warning)</strong>
2852
+ else
2853
+ <strong>_element(good)</strong>
2854
+ end
2855
+ }
2856
+ }
2857
+ </pre>
2858
+ </td>
2859
+ </tr>
2860
+ </table>
2861
+ </div>
2862
+ <div class="footer">
2863
+ <div class="footer-left">
2864
+ &nbsp;<a href="#slide5-2" class="navi-prev">&lt;&lt;</a>
2865
+ <a href="#slide5-toc" class="navi-toc">^</a>
2866
+ </div>
2867
+ <div class="footer-right">
2868
+ <span class="pagenum">47/50</span>
2869
+ <a href="#slide5-4" class="navi-next">&gt;&gt;</a>&nbsp;
2870
+ </div>
2871
+ <div class="footer-center">
2872
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2873
+ </div>
2874
+ </div>
2875
+ </div>
2876
+
2877
+
2878
+ <div id="slide5-4" class="slide">
2879
+ <h2>Pick-up Element/Content Pattern</h2>
2880
+ <div class="slide-body">
2881
+ <ul>
2882
+ <li>��_stag�פ��_cont�פ�Ȥ鷺���ޡ����󥰤�������/���Ƥ�����Ȥ�</li>
2883
+ </ul>
2884
+ <table class="n-up2" summary="">
2885
+ <tr>
2886
+ <td class="n-up2">
2887
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2888
+ <pre class="code2">
2889
+ &lt;div <strong>id="breadcrumbs"</strong>&gt;
2890
+ &lt;a href="/" <strong>id="mark:crumb"</strong>&gt;Home&lt;/a&gt;
2891
+ &lt;span <strong>id="mark:separator"</strong>&gt;&amp;gt;&lt;/span&gt;
2892
+ &lt;a href="/aaa/"&gt;AAA&lt;/a&gt; &amp;gt;
2893
+ &lt;a href="/aaa/bbb/"&gt;BBB&lt;/a&gt; &amp;gt;
2894
+ &lt;a href="/aaa/bbb/ccc"&gt;CCC&lt;/a&gt; &amp;gt;
2895
+ &lt;strong <strong>id="mark:title"</strong>&gt;title&lt;/strong&gt;
2896
+ &lt;/div&gt;
2897
+ </pre>
2898
+ <span class="caption">����ѥ�����</span>
2899
+ <pre class="code2">
2900
+ &lt;% for item in list %&gt;
2901
+ <strong>&lt;a href="&lt;%=e.path%&gt;"&gt;&lt;%=e.name%&gt;&lt;/a&gt;</strong>
2902
+ <strong>&amp;gt;</strong>&lt;% end %&gt;
2903
+ <strong>&lt;strong&gt;&lt;%= doctitle %&gt;&lt;/strong&gt;</strong>
2904
+ </pre>
2905
+ </td>
2906
+ <td>
2907
+ <span class="caption">�ץ쥼��ơ����������å�</span>
2908
+ <pre class="code2">
2909
+ <strong>#breadcrumbs</strong> {
2910
+ logic: {
2911
+ for e in items
2912
+ <strong>_element(crumb)</strong>
2913
+ <strong>_content(separator)</strong>
2914
+ end
2915
+ <strong>_element(title)</strong>
2916
+ }
2917
+ }
2918
+ #crumb {
2919
+ value: e.name;
2920
+ attrs: 'href' e.path;
2921
+ }
2922
+ #title {
2923
+ value: doctitle;
2924
+ }
2925
+ </pre>
2926
+ </td>
2927
+ </tr>
2928
+ </table>
2929
+ </div>
2930
+ <div class="footer">
2931
+ <div class="footer-left">
2932
+ &nbsp;<a href="#slide5-3" class="navi-prev">&lt;&lt;</a>
2933
+ <a href="#slide5-toc" class="navi-toc">^</a>
2934
+ </div>
2935
+ <div class="footer-right">
2936
+ <span class="pagenum">48/50</span>
2937
+ <a href="#slide5-5" class="navi-next">&gt;&gt;</a>&nbsp;
2938
+ </div>
2939
+ <div class="footer-center">
2940
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
2941
+ </div>
2942
+ </div>
2943
+ </div>
2944
+
2945
+
2946
+ <div id="slide5-5" class="slide">
2947
+ <h2>Extract Element/Content Pattern</h2>
2948
+ <div class="slide-body">
2949
+ <ul>
2950
+ <li>�ޡ����󥰤������Ǥ�������Ф���HTML���Ǥ����ʲ���</li>
2951
+ </ul>
2952
+ <table class="n-up2" summary="">
2953
+ <tr>
2954
+ <td class="n-up2">
2955
+ <span class="caption">�ץ쥼��ơ������ǡ���</span>
2956
+ <pre class="code2">
2957
+ &lt;html <strong>id="mark:document"</strong>&gt;
2958
+ &lt;body&gt;
2959
+ &lt;div class="tabs" <strong>id="mark:tabs"</strong>&gt;
2960
+ &lt;a href="/" id="mark:tab"&gt;Home&lt;/a&gt;
2961
+ &lt;a href="/download/"&gt;Download&lt;/a&gt;
2962
+ &lt;a href="/support/"&gt;Support&lt;/a&gt;
2963
+ &lt;/div&gt;
2964
+ &lt;/body&gt;&lt;/html&gt;
2965
+ </pre>
2966
+ <span class="caption">����ѥ�����</span>
2967
+ <pre class="code2">
2968
+ <strong>&lt;div class="tabs"&gt;</strong>
2969
+ &lt;% for tab in tablist %&gt;
2970
+ &lt;a href="/"&gt;Home&lt;/a&gt;
2971
+ &lt;% end %&gt;
2972
+ <strong>&lt;/div&gt;</strong>
2973
+ </pre>
2974
+ </td>
2975
+ <td>
2976
+ <span class="caption">�ץ쥼��ơ����������å�</span>
2977
+ <pre class="code2">
2978
+ <strong>#document</strong> {
2979
+ logic: {
2980
+ <strong>_element(tabs)</strong>
2981
+ }
2982
+ }
2983
+ #tabs {
2984
+ logic: {
2985
+ _stag
2986
+ for tab in tablist
2987
+ _element(tab)
2988
+ end
2989
+ _etag
2990
+ }
2991
+ }
2992
+ </pre>
2993
+ </td>
2994
+ </tr>
2995
+ </table>
2996
+ </div>
2997
+ <div class="footer">
2998
+ <div class="footer-left">
2999
+ &nbsp;<a href="#slide5-4" class="navi-prev">&lt;&lt;</a>
3000
+ <a href="#slide5-toc" class="navi-toc">^</a>
3001
+ </div>
3002
+ <div class="footer-right">
3003
+ <span class="pagenum">49/50</span>
3004
+ <a href="#slide-last" class="navi-next">&gt;&gt;</a>&nbsp;
3005
+ </div>
3006
+ <div class="footer-center">
3007
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
3008
+ </div>
3009
+ </div>
3010
+ </div>
3011
+
3012
+
3013
+ <div id="slide-last" class="slide">
3014
+ <div class="slide-body">
3015
+ <div style="text-align:center; font-size:38pt; margin-top:130px; line-height:140%;">
3016
+ <p>
3017
+ Get Kwartz at<br />
3018
+ <a href="http://www.kuwata-lab.com/kwartz">http://www.kuwata-lab.com/kwartz</a><br />
3019
+ </p>
3020
+ <p style="margin-top:50px">Thank You</p>
3021
+ </div>
3022
+ </div>
3023
+ <div class="footer">
3024
+ <div class="footer-left">
3025
+ &nbsp;<a href="#slide5-5" class="navi-prev">&lt;&lt;</a>
3026
+ <a href="#slide-toc" class="navi-toc">^</a>
3027
+ </div>
3028
+ <div class="footer-right">
3029
+ <span class="pagenum">50/50</span>
3030
+ <a href="#slide-title" class="navi-next">&gt;&gt;</a>&nbsp;
3031
+ </div>
3032
+ <div class="footer-center">
3033
+ <span class="copyright">copyright&copy;2006 kuwata-lab.com all rights reserved</span>
3034
+ </div>
3035
+ </div>
3036
+ </div>
3037
+
3038
+
3039
+ </body>
3040
+ </html>