kwartz 3.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (169) hide show
  1. data/COPYING +340 -0
  2. data/ChangeLog +103 -0
  3. data/README.txt +37 -0
  4. data/bin/kwartz +12 -0
  5. data/doc-api/classes/Kwartz.html +218 -0
  6. data/doc-api/classes/Kwartz/Assertion.html +140 -0
  7. data/doc-api/classes/Kwartz/AssertionError.html +148 -0
  8. data/doc-api/classes/Kwartz/AttrInfo.html +320 -0
  9. data/doc-api/classes/Kwartz/BaseError.html +206 -0
  10. data/doc-api/classes/Kwartz/BaseTranslator.html +331 -0
  11. data/doc-api/classes/Kwartz/CharacterType.html +212 -0
  12. data/doc-api/classes/Kwartz/CommandOptionError.html +154 -0
  13. data/doc-api/classes/Kwartz/CommandOptions.html +374 -0
  14. data/doc-api/classes/Kwartz/Config.html +150 -0
  15. data/doc-api/classes/Kwartz/ConvertError.html +191 -0
  16. data/doc-api/classes/Kwartz/Converter.html +252 -0
  17. data/doc-api/classes/Kwartz/CssStyleParser.html +483 -0
  18. data/doc-api/classes/Kwartz/DocumentRuleset.html +369 -0
  19. data/doc-api/classes/Kwartz/ElementExpander.html +325 -0
  20. data/doc-api/classes/Kwartz/ElementInfo.html +312 -0
  21. data/doc-api/classes/Kwartz/ElementRuleset.html +582 -0
  22. data/doc-api/classes/Kwartz/EperlHandler.html +338 -0
  23. data/doc-api/classes/Kwartz/EperlTranslator.html +167 -0
  24. data/doc-api/classes/Kwartz/ErubisHandler.html +113 -0
  25. data/doc-api/classes/Kwartz/ErubisTranslator.html +168 -0
  26. data/doc-api/classes/Kwartz/ErubyHandler.html +337 -0
  27. data/doc-api/classes/Kwartz/ErubyTranslator.html +167 -0
  28. data/doc-api/classes/Kwartz/ExpandStatement.html +227 -0
  29. data/doc-api/classes/Kwartz/Expression.html +119 -0
  30. data/doc-api/classes/Kwartz/Handler.html +558 -0
  31. data/doc-api/classes/Kwartz/JstlHandler.html +657 -0
  32. data/doc-api/classes/Kwartz/JstlTranslator.html +226 -0
  33. data/doc-api/classes/Kwartz/KwartzError.html +146 -0
  34. data/doc-api/classes/Kwartz/Main.html +384 -0
  35. data/doc-api/classes/Kwartz/NativeExpression.html +236 -0
  36. data/doc-api/classes/Kwartz/NativeStatement.html +254 -0
  37. data/doc-api/classes/Kwartz/Node.html +156 -0
  38. data/doc-api/classes/Kwartz/ParseError.html +148 -0
  39. data/doc-api/classes/Kwartz/PhpHandler.html +333 -0
  40. data/doc-api/classes/Kwartz/PhpTranslator.html +194 -0
  41. data/doc-api/classes/Kwartz/PresentationLogicParser.html +830 -0
  42. data/doc-api/classes/Kwartz/PrintStatement.html +221 -0
  43. data/doc-api/classes/Kwartz/RailsHandler.html +587 -0
  44. data/doc-api/classes/Kwartz/RailsTranslator.html +167 -0
  45. data/doc-api/classes/Kwartz/RubyStyleParser.html +558 -0
  46. data/doc-api/classes/Kwartz/Ruleset.html +117 -0
  47. data/doc-api/classes/Kwartz/Statement.html +119 -0
  48. data/doc-api/classes/Kwartz/StrutsTranslator.html +190 -0
  49. data/doc-api/classes/Kwartz/TagInfo.html +314 -0
  50. data/doc-api/classes/Kwartz/TextConverter.html +270 -0
  51. data/doc-api/classes/Kwartz/Translator.html +318 -0
  52. data/doc-api/classes/Test.html +107 -0
  53. data/doc-api/classes/Test/Unit.html +101 -0
  54. data/doc-api/created.rid +1 -0
  55. data/doc-api/files/__/README_txt.html +150 -0
  56. data/doc-api/files/kwartz/assert_rb.html +114 -0
  57. data/doc-api/files/kwartz/binding/eperl_rb.html +116 -0
  58. data/doc-api/files/kwartz/binding/erubis_rb.html +116 -0
  59. data/doc-api/files/kwartz/binding/eruby_rb.html +115 -0
  60. data/doc-api/files/kwartz/binding/jstl_rb.html +116 -0
  61. data/doc-api/files/kwartz/binding/php_rb.html +116 -0
  62. data/doc-api/files/kwartz/binding/rails_rb.html +115 -0
  63. data/doc-api/files/kwartz/binding/struts_rb.html +117 -0
  64. data/doc-api/files/kwartz/config_rb.html +107 -0
  65. data/doc-api/files/kwartz/converter_rb.html +119 -0
  66. data/doc-api/files/kwartz/error_rb.html +107 -0
  67. data/doc-api/files/kwartz/main_rb.html +124 -0
  68. data/doc-api/files/kwartz/node_rb.html +114 -0
  69. data/doc-api/files/kwartz/parser_rb.html +117 -0
  70. data/doc-api/files/kwartz/translator_rb.html +115 -0
  71. data/doc-api/files/kwartz/util/assert-text-equal_rb.html +115 -0
  72. data/doc-api/files/kwartz/util/testcase-helper_rb.html +115 -0
  73. data/doc-api/files/kwartz_rb.html +120 -0
  74. data/doc-api/fr_class_index.html +75 -0
  75. data/doc-api/fr_file_index.html +45 -0
  76. data/doc-api/fr_method_index.html +216 -0
  77. data/doc-api/index.html +24 -0
  78. data/doc-api/rdoc-style.css +208 -0
  79. data/doc/docstyle.css +188 -0
  80. data/doc/p-pattern.html +1207 -0
  81. data/doc/reference.html +3396 -0
  82. data/doc/users-guide.html +1670 -0
  83. data/examples/breadcrumbs1/Makefile +15 -0
  84. data/examples/breadcrumbs1/breadcrumbs.eruby.plogic +27 -0
  85. data/examples/breadcrumbs1/breadcrumbs.html +12 -0
  86. data/examples/breadcrumbs1/breadcrumbs.jstl.plogic +28 -0
  87. data/examples/breadcrumbs1/breadcrumbs.php.plogic +26 -0
  88. data/examples/breadcrumbs1/main.php +12 -0
  89. data/examples/breadcrumbs1/main.rb +12 -0
  90. data/examples/breadcrumbs2/Makefile +15 -0
  91. data/examples/breadcrumbs2/breadcrumbs.eruby.plogic +22 -0
  92. data/examples/breadcrumbs2/breadcrumbs.html +14 -0
  93. data/examples/breadcrumbs2/breadcrumbs.jstl.plogic +24 -0
  94. data/examples/breadcrumbs2/breadcrumbs.php.plogic +23 -0
  95. data/examples/breadcrumbs2/main.php +12 -0
  96. data/examples/breadcrumbs2/main.rb +12 -0
  97. data/examples/pagelayout/Makefile +47 -0
  98. data/examples/pagelayout/content.eruby.plogic +44 -0
  99. data/examples/pagelayout/content.jstl.plogic +36 -0
  100. data/examples/pagelayout/content.php.plogic +37 -0
  101. data/examples/pagelayout/content1.html +36 -0
  102. data/examples/pagelayout/content2.html +29 -0
  103. data/examples/pagelayout/design.css +40 -0
  104. data/examples/pagelayout/layout.html +50 -0
  105. data/examples/pagelayout/main.php +55 -0
  106. data/examples/pagelayout/main.rb +77 -0
  107. data/examples/pagelayout/menu.eruby.plogic +14 -0
  108. data/examples/pagelayout/menu.html +13 -0
  109. data/examples/pagelayout/menu.jstl.plogic +14 -0
  110. data/examples/pagelayout/menu.php.plogic +14 -0
  111. data/examples/rails1/Makefile +36 -0
  112. data/examples/rails1/README +19 -0
  113. data/examples/rails1/application_helper.rb +31 -0
  114. data/examples/rails1/edit.html +28 -0
  115. data/examples/rails1/edit.plogic +10 -0
  116. data/examples/rails1/form.html +52 -0
  117. data/examples/rails1/form.plogic +33 -0
  118. data/examples/rails1/layout.plogic +15 -0
  119. data/examples/rails1/link_to.plogic +19 -0
  120. data/examples/rails1/list.html +48 -0
  121. data/examples/rails1/list.plogic +28 -0
  122. data/examples/rails1/new.html +27 -0
  123. data/examples/rails1/new.plogic +10 -0
  124. data/examples/rails1/reader.plogic +29 -0
  125. data/examples/rails1/show.html +40 -0
  126. data/examples/rails1/show.plogic +4 -0
  127. data/examples/rails1/writer.plogic +8 -0
  128. data/examples/table1/Makefile +15 -0
  129. data/examples/table1/main.php +11 -0
  130. data/examples/table1/main.rb +11 -0
  131. data/examples/table1/table1.eruby.plogic +21 -0
  132. data/examples/table1/table1.html +16 -0
  133. data/examples/table1/table1.jstl.plogic +21 -0
  134. data/examples/table1/table1.php.plogic +22 -0
  135. data/kwartz.gemspec +55 -0
  136. data/lib/kwartz.rb +13 -0
  137. data/lib/kwartz/assert.rb +31 -0
  138. data/lib/kwartz/binding/eperl.rb +166 -0
  139. data/lib/kwartz/binding/erubis.rb +61 -0
  140. data/lib/kwartz/binding/eruby.rb +164 -0
  141. data/lib/kwartz/binding/jstl.rb +334 -0
  142. data/lib/kwartz/binding/php.rb +167 -0
  143. data/lib/kwartz/binding/rails.rb +295 -0
  144. data/lib/kwartz/binding/struts.rb +109 -0
  145. data/lib/kwartz/config.rb +28 -0
  146. data/lib/kwartz/converter.rb +920 -0
  147. data/lib/kwartz/error.rb +41 -0
  148. data/lib/kwartz/main.rb +464 -0
  149. data/lib/kwartz/node.rb +454 -0
  150. data/lib/kwartz/parser.rb +903 -0
  151. data/lib/kwartz/translator.rb +153 -0
  152. data/lib/kwartz/util/assert-text-equal.rb +44 -0
  153. data/lib/kwartz/util/testcase-helper.rb +112 -0
  154. data/setup.rb +1331 -0
  155. data/test/test-compile.rb +36 -0
  156. data/test/test-compile.yaml +178 -0
  157. data/test/test-converter.rb +34 -0
  158. data/test/test-converter.yaml +127 -0
  159. data/test/test-directives.rb +32 -0
  160. data/test/test-directives.yaml +1411 -0
  161. data/test/test-main.rb +464 -0
  162. data/test/test-parser.rb +54 -0
  163. data/test/test-parser.yaml +394 -0
  164. data/test/test-rails.rb +28 -0
  165. data/test/test-rails.yaml +301 -0
  166. data/test/test-ruleset.rb +36 -0
  167. data/test/test-ruleset.yaml +804 -0
  168. data/test/test.rb +44 -0
  169. metadata +236 -0
@@ -0,0 +1,1670 @@
1
+ <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
2
+ <html>
3
+ <head>
4
+ <meta http-equiv="Content-Type" content="text/html">
5
+ <title>Kwartz 3.0 Users' Guide</title>
6
+ <meta name="author" content="Makoto Kuwata &lt;kwa(at)kuwata-lab.com&gt;">
7
+ <meta name="generator" content="kwaser">
8
+ <meta http-equiv="Content-Style-Type" content="text/css">
9
+ <link rel="stylesheet" href="docstyle.css" type="text/css">
10
+ </head>
11
+ <body>
12
+
13
+ <blockquote>
14
+ <div class="mainbody">
15
+
16
+ <div align="left"><h1>Kwartz 3.0 Users' Guide</h1></div>
17
+ <div align="left">
18
+ Makoto Kuwata &lt;kwa(at)kuwata-lab.com&gt;<br>
19
+ last update: $Date: 2006-05-22 22:25:43 +0900 (Mon, 22 May 2006) $<br>
20
+ </div>
21
+
22
+ <a name="preface"></a>
23
+ <h2 class="section1">Preface</h2>
24
+ <p>This is the users' guide of Kwartz<sup>(<a href="#fnref:1" name="fnlink:1">*1</a>)</sup>,
25
+ a template system which realized the concept of 'Independence of Presentation Logic'.
26
+ </p>
27
+ <div class="footnote">
28
+ <dl compact>
29
+ <dt>(<a name="fnref:1" href="#fnlink:1">*1</a>)</dt>
30
+ <dd>Development of Kwartz had subsidized by Exploratory Software Project of <a href="http://www.ipa.go.jp/about/english/index.html">IPA (Information-Technology Promotion Agency Japan)</a>.</dd>
31
+ </dl>
32
+ </div>
33
+ <a name="toc"></a>
34
+ <h3 class="section2">Table of Contents</h3>
35
+ <ul>
36
+ <li><a href="#preface">Preface</a>
37
+ <ul>
38
+ <li><a href="#toc">Table of Contents</a>
39
+ </li>
40
+ </ul>
41
+ </li>
42
+ <li><a href="#intro">Introduction to Kwartz</a>
43
+ <ul>
44
+ <li><a href="#whatis">What's Kwartz?</a>
45
+ </li>
46
+ <li><a href="#features">Features Overview</a>
47
+ </li>
48
+ <li><a href="#example1">Simple Example</a>
49
+ </li>
50
+ <li><a href="#example2">Complex Example</a>
51
+ </li>
52
+ <li><a href="#pattern">Other Examples of Presentation Logic</a>
53
+ </li>
54
+ </ul>
55
+ </li>
56
+ <li><a href="#detail">Features Detail</a>
57
+ <ul>
58
+ <li><a href="#ruleset">RuleSet and Properties</a>
59
+ </li>
60
+ <li><a href="#directives">Directives</a>
61
+ </li>
62
+ <li><a href="#escape">Escape</a>
63
+ </li>
64
+ <li><a href="#langs">Multi-language</a>
65
+ </li>
66
+ <li><a href="#span">Span Tag Deletion</a>
67
+ </li>
68
+ <li><a href="#import-plogic">Import Presentation Logic File</a>
69
+ </li>
70
+ <li><a href="#import-elem">Import Elements in Other Files</a>
71
+ </li>
72
+ <li><a href="#extract">Extract Element</a>
73
+ </li>
74
+ <li><a href="#print-statement">Print Statement</a>
75
+ </li>
76
+ <li><a href="#begin">Add Code at Beginning/End of Document</a>
77
+ </li>
78
+ </ul>
79
+ </li>
80
+ <li><a href="#topics">Other Topics</a>
81
+ <ul>
82
+ <li><a href="#restriction1">Restrictions around presentation logic</a>
83
+ </li>
84
+ <li><a href="#restriction2">Restrictions around presentation data</a>
85
+ </li>
86
+ <li><a href="#makefile">Makefile and Rakefile</a>
87
+ </li>
88
+ <li><a href="#kwartz-lib">Use Kwartz as Library</a>
89
+ </li>
90
+ <li><a href="#start_link_to"><code>link_to()</code> method in Ruby on Rails</a>
91
+ </li>
92
+ </ul>
93
+ </li>
94
+ </ul>
95
+ <br>
96
+
97
+
98
+ <br>
99
+
100
+
101
+ <a name="intro"></a>
102
+ <h2 class="section1">Introduction to Kwartz</h2>
103
+ <a name="whatis"></a>
104
+ <h3 class="section2">What's Kwartz?</h3>
105
+ <p>Kwartz<sup>(<a href="#fnref:2" name="fnlink:2">*2</a>)</sup> is a template system
106
+ which realized the concept of <b>'Independence of Presentation Logic'(IoPL)</b>.
107
+ It means that Kwartz separates presentaion logics from both presentation data (typically HTML document) and business logics.
108
+ </p>
109
+ <p>You know CSS (Cascading Style Sheet). CSS separates design from HTML file.
110
+ In the same way, Kwartz separates presentation logics from HTML template.
111
+ If you are familiar with CSS, you'll be also familiar with Kwartz.
112
+ </p>
113
+ <p>The following figure show the relation of HTML, CSS, JavaScript, and Kwartz.
114
+ </p>
115
+ <ul type="disc">
116
+ <li>HTML represents document structure.
117
+ </li>
118
+ <li>CSS represents document design.
119
+ </li>
120
+ <li>JavaScript represents client-side logics.
121
+ </li>
122
+ <li>Kwartz represents server-side presentation logics.<br>
123
+ (Notice that Kwartz represents only presentation logics and not business logics.)
124
+ </li>
125
+ </ul>
126
+ <div style="text-align: center">
127
+ <span>Figure1. Relation of HTML, CSS, JavaScript, and Kwartz.</span><br />
128
+ <img src="img/fig04.png" alt="relation of HTML, CSS, JavaScript, and Kwartz" />
129
+ </div>
130
+ <p>Kwartz-ruby is an implemenation of Kwartz in Ruby.
131
+ There is a plan to implement Kwartz in PHP or Java.
132
+ </p>
133
+ <p>In the following, the word 'Kwartz' means the specification of the template system
134
+ and the word 'Kwartz-ruby' means the implementation of it in Ruby language.
135
+ </p>
136
+ <div class="footnote">
137
+ <dl compact>
138
+ <dt>(<a name="fnref:2" href="#fnlink:2">*2</a>)</dt>
139
+ <dd>'Kwartz' is pronounced like 'Quartz'.</dd>
140
+ </dl>
141
+ </div>
142
+ <br>
143
+
144
+
145
+ <a name="features"></a>
146
+ <h3 class="section2">Features Overview</h3>
147
+ <p>Kwartz has the following features:
148
+ </p>
149
+ <dl class="dl2">
150
+ <dt class="dt2">
151
+ Separates presentation logic from presentation data.</dt>
152
+ <dd class="dd2">
153
+ <p> Using template systems such as Smarty, Velocity, XMLC, amrita, etc,
154
+ you can separate HTML design from business logic as a template.
155
+ With Kwartz, you can separate presentation logic from a template.
156
+ In other words, Kwartz divides a template into 'presentation data' and 'presentation logic'.
157
+ You need not mix presentation logic into HTML files nor main program.
158
+ </p>
159
+ </dd>
160
+ <dt class="dt2">
161
+ Very fast</dt>
162
+ <dd class="dd2">
163
+ <p> Kwartz creates a script from a template (= presentation data and presentaion logic).
164
+ All you have to do in main program is to call the output script.
165
+ Because Kwartz doesn't use DOM trees or the like, it is both fast and light-weight.
166
+ </p>
167
+ </dd>
168
+ <dt class="dt2">
169
+ Multi-languages support</dt>
170
+ <dd class="dd2">
171
+ <p> Kwartz can create output scripts for Ruby(eRuby), PHP, JSP(JSTL 1.2 &amp; 1.1).
172
+ Presentation logics are written in each language<sup>(<a href="#fnref:3" name="fnlink:3">*3</a>)</sup>.
173
+ This approach gives you the power of the target language fully.
174
+ For example, you can write Ruby on Rails helper method (such as <code>link_to</code>, <code>field_tag</code>, and so on) directly in your template file.
175
+ </p>
176
+ </dd>
177
+ <dt class="dt2">
178
+ Doesn't break HTML design at all</dt>
179
+ <dd class="dd2">
180
+ <p> You must use directives like
181
+ <code>{foreach ...}{/foreach}</code> in <a href="http://smarty.php.net/">Smarty</a> or
182
+ <code>#foreach(...)</code> in <a href="http://jakarta.apache.org/velocity/">Jakarta Velocity</a>.
183
+ These directives break the HTML design of template.
184
+ Kwartz doesn't break HTML design because Kwartz uses id or title attributes for marking in an HTML template.
185
+ </p>
186
+ </dd>
187
+ <dt class="dt2">
188
+ Able to handle any text file</dt>
189
+ <dd class="dd2">
190
+ <p> Kwartz uses an original template parser; not using an HTML or XML parser,
191
+ it is able to handle any type of text file (HTML, PostScript, CSV, and so on).
192
+ This also means that Kwartz can handle non-well-formed XML files, as well as well-formed XML files.
193
+ This is an advantage of Kwartz against <a href="http://xmlc.objectweb.org/">Enhydra XMLC</a> or
194
+ <a href="http://amrita.sourceforge.jp/">amrita</a>, which handle only XML/HTML files.
195
+ </p>
196
+ </dd>
197
+ <dt class="dt2">
198
+ Auto-escape and Partial-escape</dt>
199
+ <dd class="dd2">
200
+ <p> Kwartz can do sanitizing automatically.
201
+ You don't need to write '<code>CGI.escapeHTML(var)</code>' or '<code>htmlspecialchars($var)</code>'.
202
+ You are free to turn sanitizing on/off, as well specifying which parts of the template to sanitize.
203
+ </p>
204
+ </dd>
205
+ </dl>
206
+ <div class="footnote">
207
+ <dl compact>
208
+ <dt>(<a name="fnref:3" href="#fnlink:3">*3</a>)</dt>
209
+ <dd>Previous version of Kwartz adopt original language and convert it to each target language(Ruby, PHP, JSTL, and so on). From Current version, it is required to write presentation logic in target language.</dd>
210
+ </dl>
211
+ </div>
212
+ <br>
213
+
214
+
215
+ <a name="example1"></a>
216
+ <h3 class="section2">Simple Example</h3>
217
+ <p>In Kwartz, a template is defined as both presentation data and presentation logic.
218
+ They may be described in separate files.
219
+ </p>
220
+ <p>This is an example of a presentation data file.
221
+ </p>
222
+ <ul type="disc">
223
+ <li>'<b><code>id="list1"</code></b>' means "I'll operate this element in presentation logic" (called 'marking' in Kwartz).
224
+ </li>
225
+ <li>'<b><code>id="mark:item1"</code></b>' is also an marking.
226
+ Difference between <code>id="mark:item1"</code> and <code>id="item1"</code> is that id attribute in the former format is removed automatically and the latter format is leaved.
227
+ </li>
228
+ </ul>
229
+ <p>Presentation data file(example1.html):
230
+ </p>
231
+ <a name="example1.html"></a>
232
+ <pre class="program">&lt;table&gt;
233
+ &lt;tr <b>id="list1"</b>&gt;
234
+ &lt;td <b>id="mark:item1"</b>&gt;foo&lt;/td&gt;
235
+ &lt;/tr&gt;
236
+ &lt;/table&gt;
237
+ </pre>
238
+ <p>And the following is an example of presentation logic.
239
+ In presentation logic, you can operate on elements which are marked in presentation data.
240
+ </p>
241
+ <ul type="disc">
242
+ <li>'<b><code>#list1 { ... }</code></b>' represents an element marked with name 'list1' (= '&lt;tr&gt;...&lt;/tr&gt;')
243
+ <ul type="circle">
244
+ <li>'<b><code>logic: { ... }</code></b>' represents presentation logic of the element.
245
+ </li>
246
+ <li>'<b><code>_stag</code></b>' represents a start tag (= '&lt;tr&gt;').
247
+ </li>
248
+ <li>'<b><code>_cont</code></b>' represents content(= '&lt;td id="mark:item1"&gt;foo&lt;/td&gt;').
249
+ </li>
250
+ <li>'<b><code>_etag</code></b>' represents an end tag(= '&lt;/tr&gt;').
251
+ </li>
252
+ <li>'<b><code>for <i>var</i> in <i>list</i> ...</code></b>' is a Ruby code to loop.
253
+ In this case, the element(= start-tag + content + end-tag) is looped.
254
+ </li>
255
+ </ul>
256
+ </li>
257
+ <li>'<b><code>#item1 { ... }</code></b>' represents an element marked with name 'item1' (= '&lt;td&gt;...&lt;/td&gt;').
258
+ <ul type="circle">
259
+ <li>'<b><code>value: <i>expression</i>;</code></b>' represents that the content of the element is replaced by value of <code><i>expression</i></code>, which is value of a variable <code>member</code> in this case.
260
+ </li>
261
+ </ul>
262
+ </li>
263
+ </ul>
264
+ <a name="example1.plogic"></a>
265
+ <div class="program_caption">
266
+ Presentation logic file(example1.plogic):</div>
267
+ <pre class="program">/* The element which is marked by 'id="list1"' */
268
+ <b>#list1</b> {
269
+ logic: {
270
+ for member in @members
271
+ <b>_stag</b> # start tag
272
+ <b>_cont</b> # content
273
+ <b>_etag</b> # end tag
274
+ end
275
+ }
276
+ }
277
+
278
+ /* The element which is marked by 'id="mark:item1"' */
279
+ <b>#item1</b> {
280
+ /* replace the content with value of a variable 'member' */
281
+ value: member;
282
+ }
283
+ </pre>
284
+ <p>(Don't forget the semicolon at the end of line especially for Ruby user!)
285
+ </p>
286
+ <p>Kwartz generates eRuby script from the above files. This action is called 'compiling'.
287
+ </p>
288
+ <div class="terminal_caption">
289
+ how to compile eRuby script</div>
290
+ <pre class="terminal">$ kwartz -p example1.plogic example1.html &gt; example1.rhtml
291
+ </pre>
292
+ <p>The following is the compiled eRuby script.
293
+ Notice that <code>id="mark:item1"</code> is removed automatically while <code>id="list1"</code> is leaved.
294
+ </p>
295
+ <a name="example1.expected"></a>
296
+ <div class="program_caption">
297
+ generated eRuby script</div>
298
+ <pre class="program">&lt;table&gt;
299
+ &lt;% for member in @members %&gt;
300
+ &lt;tr id="list1"&gt;
301
+ &lt;td&gt;&lt;%= member %&gt;&lt;/td&gt;
302
+ &lt;/tr&gt;
303
+ &lt;% end %&gt;
304
+ &lt;/table&gt;
305
+ </pre>
306
+ <br>
307
+
308
+
309
+ <a name="example2"></a>
310
+ <h3 class="section2">Complex Example</h3>
311
+ <p>Next is bordered table example which is a little complex than previous.
312
+ </p>
313
+ <a name="example2.html"></a>
314
+ <div class="program_caption">
315
+ Presentation Data (example2.html):</div>
316
+ <pre class="program">&lt;table&gt;
317
+ &lt;tr bgcolor="#CCCCFF" <b>id="mark:list"</b>&gt;
318
+ &lt;td <b>id="mark:name"</b>&gt;foo&lt;/td&gt;
319
+ &lt;td&gt;
320
+ &lt;a href="mailto:foo@mail.com" <b>id="mark:email"</b>&gt;foo@mail.com&lt;/a&gt;
321
+ &lt;/td&gt;
322
+ &lt;/tr&gt;
323
+ &lt;/table&gt;
324
+ </pre>
325
+ <p>The following is the presentation logic file.
326
+ In the presentation logic, you should detect whether odd or even line in the iteration.
327
+ </p>
328
+ <p>Presentation Logic (example2.plogic):
329
+ </p>
330
+ <a name="example2.plogic"></a>
331
+ <pre class="program">/*
332
+ * an element which is marked by 'id="mark:list"'
333
+ * - print value of a variable 'color' as bgcolor attribute value.
334
+ */
335
+ <b>#list</b> {
336
+ attrs: "bgcolor" color;
337
+ logic: {
338
+ @members.each_with_index do |member, i|
339
+ color = i % 2 == 0 ? '#FFCCCC' : '#CCCCFF';
340
+ _stag # start tag
341
+ _cont # content
342
+ _etag # end tag
343
+ end
344
+ }
345
+ }
346
+
347
+ /*
348
+ * an element which is marked by 'id="mark:name"':
349
+ * - print value of member[:name] as content of the element.
350
+ */
351
+ <b>#name</b> {
352
+ value: member[:name];
353
+ }
354
+
355
+ /*
356
+ * an element marked by 'id="mark:email"':
357
+ * - print value of member[:email] as contentn of the element.
358
+ * - print "mailto:" and member[:email] as href attribute value.
359
+ */
360
+ <b>#email</b> {
361
+ value: member[:email];
362
+ attrs: "href" "mailto:#{member[:email]}";
363
+ }
364
+ </pre>
365
+ <p>(Don't forget the semicolon at the end of line especially for Ruby user!)
366
+ </p>
367
+ <p>You will find that there is no HTML tag in the presentation logic and no logic in the presentation data.
368
+ That is to say, Kwartz can separate presentation logic from presentation data.
369
+ </p>
370
+ <div class="terminal_caption">
371
+ compilation</div>
372
+ <pre class="terminal">$ kwartz -p example2.plogic example2.html &gt; example2.rhtml
373
+ </pre>
374
+ <a name="example2.expected"></a>
375
+ <div class="program_caption">
376
+ output script</div>
377
+ <pre class="program">&lt;table&gt;
378
+ <b>&lt;% @members.each_with_index do |member, i| %&gt;</b>
379
+ <b>&lt;% color = i % 2 == 0 ? '#FFCCCC' : '#CCCCFF'; %&gt;</b>
380
+ &lt;tr bgcolor="<b>&lt;%= color %&gt;</b>"&gt;
381
+ &lt;td&gt;<b>&lt;%= member[:name] %&gt;</b>&lt;/td&gt;
382
+ &lt;td&gt;
383
+ &lt;a href="<b>&lt;%= "mailto:#{member[:email]}" %&gt;</b>"&gt;<b>&lt;%= member[:email] %&gt;</b>&lt;/a&gt;
384
+ &lt;/td&gt;
385
+ &lt;/tr&gt;
386
+ <b>&lt;% end %&gt;</b>
387
+ &lt;/table&gt;
388
+ </pre>
389
+ <br>
390
+
391
+
392
+ <a name="pattern"></a>
393
+ <h3 class="section2">Other Examples of Presentation Logic</h3>
394
+ <p>Kwartz enables you to write complex presentation logic natulally.
395
+ This section shows some examples.
396
+ See <a href="p-pattern.html">Presentation Pattern Catalog</a> for details.
397
+ </p>
398
+ <ul type="disc">
399
+ <li>Iterate an element.
400
+ <pre class="program">#list {
401
+ logic: {
402
+ for member in @members
403
+ _stag
404
+ _cont
405
+ _etag
406
+ end
407
+ }
408
+ }
409
+ </pre>
410
+ Or
411
+ <pre class="program">#list {
412
+ logic: {
413
+ for member in @members
414
+ _elem # equivarent to _stag + _cont + _etag
415
+ end
416
+ }
417
+ }
418
+ </pre>
419
+ </li>
420
+ </ul>
421
+ <ul type="disc">
422
+ <li>Iterate only contents. This is useful for &lt;dl&gt;&lt;/dl&gt;.
423
+ <pre class="program">#list {
424
+ logic: {
425
+ _stag
426
+ for member in @members
427
+ _cont
428
+ end
429
+ _etag
430
+ }
431
+ }
432
+ </pre>
433
+ </li>
434
+ </ul>
435
+ <ul type="disc">
436
+ <li>Replace content of element by expression value.
437
+ <pre class="program">#list {
438
+ logic: {
439
+ _stag
440
+ print expr
441
+ _etag
442
+ }
443
+ }
444
+ </pre>
445
+ Or
446
+ <pre class="program">#list {
447
+ value: expr;
448
+ }
449
+ </pre>
450
+ </li>
451
+ </ul>
452
+ <ul type="disc">
453
+ <li>Replace element by exression value
454
+ <pre class="program">#list {
455
+ logic: {
456
+ print expr
457
+ }
458
+ }
459
+ </pre>
460
+ Or
461
+ <pre class="program">#list {
462
+ elem: expr;
463
+ }
464
+ </pre>
465
+ </li>
466
+ </ul>
467
+ <ul type="disc">
468
+ <li>Delete start-tag and end-tag, and leaves content only.
469
+ <pre class="program">#list {
470
+ logic: {
471
+ _cont
472
+ }
473
+ }
474
+ </pre>
475
+ </li>
476
+ </ul>
477
+ <ul type="disc">
478
+ <li>Delete elemnt. This is useful for delete dummy data.
479
+ <pre class="program">#list {
480
+ logic: {
481
+ }
482
+ }
483
+ </pre>
484
+ </li>
485
+ </ul>
486
+ <ul type="disc">
487
+ <li>Replace element with other element.
488
+ <pre class="program">#list {
489
+ logic: {
490
+ _element(foo) # expand other element marked with name 'foo'
491
+ }
492
+ }
493
+ </pre>
494
+ </li>
495
+ </ul>
496
+ <ul type="disc">
497
+ <li>Replace element with other element's content.
498
+ <pre class="program">#list {
499
+ logic: {
500
+ _content(foo) # expand content of other element
501
+ }
502
+ }
503
+ </pre>
504
+ </li>
505
+ </ul>
506
+ <ul type="disc">
507
+ <li>Include complex presentation logics.
508
+ <pre class="program">#list {
509
+ logic: {
510
+ i = 0
511
+ for member in @members
512
+ i += 1
513
+ if i % 2 == 0
514
+ color = '#FFCCCC'
515
+ else
516
+ color = '#CCCCFF'
517
+ end
518
+ _elem # '_elem' is equivarent to _stag + _cont + _etag
519
+ end
520
+ }
521
+ }
522
+ </pre>
523
+ </li>
524
+ </ul>
525
+ <p>It is very important that tag/attribute names don't appear in presentation logic at all.
526
+ This way, you don't need to change presentation logic files even if the tag/attribute names are changed in the presentation data.
527
+ </p>
528
+ <p>Kwartz separates presentation logic from presentation data and main program.
529
+ </p>
530
+ <br>
531
+
532
+
533
+ <br>
534
+
535
+
536
+ <a name="detail"></a>
537
+ <h2 class="section1">Features Detail</h2>
538
+ <a name="ruleset"></a>
539
+ <h3 class="section2">RuleSet and Properties</h3>
540
+ <p>Format of presentation logic in Kwartz is similar to CSS (Cascading Style Sheet).
541
+ </p>
542
+ <ul type="disc">
543
+ <li>Presentation logic file is a set of Ruleset.
544
+ </li>
545
+ <li>Ruleset is a pair of selector and declarations.
546
+ </li>
547
+ <li>Declaration is a pair of property name and value.
548
+ </li>
549
+ </ul>
550
+ <p>The following rules are available in presesntation logic file.
551
+ These are similar to CSS. If you are familiar with CSS, you'll be so with Kwartz.
552
+ </p>
553
+ <dl class="dl3">
554
+ <dt class="dt3"><b>
555
+ stag: <i>expr</i>; </b></dt>
556
+ <dd class="dd3">
557
+ Replace start-tag by expression value.
558
+ </dd>
559
+ </dl>
560
+ <dl class="dl3">
561
+ <dt class="dt3"><b>
562
+ etag: <i>expr</i>; </b></dt>
563
+ <dd class="dd3">
564
+ Replace end-tag by expression value.
565
+ </dd>
566
+ </dl>
567
+ <dl class="dl3">
568
+ <dt class="dt3"><b>
569
+ elem: <i>expr</i>; </b></dt>
570
+ <dd class="dd3">
571
+ Replace elemnt by expression value.
572
+ </dd>
573
+ </dl>
574
+ <dl class="dl3">
575
+ <dt class="dt3"><b>
576
+ cont: <i>expr</i>; </b></dt>
577
+ <dd class="dd3">
578
+ Replace content of element by expressin value.
579
+ </dd>
580
+ </dl>
581
+ <dl class="dl3">
582
+ <dt class="dt3"><b>
583
+ value: <i>expr</i>; </b></dt>
584
+ <dd class="dd3">
585
+ Equivarent to <code>cont: <i>expr</i></code>.
586
+ </dd>
587
+ </dl>
588
+ <dl class="dl3">
589
+ <dt class="dt3"><b>
590
+ attrs: 'attrname' <i>expr</i>; </b></dt>
591
+ <dd class="dd3">
592
+ Replace attribute value by expression.
593
+ The following is an example to specify some attributes.
594
+ <pre class="program">#foo {
595
+ attrs: 'href' item[:url],
596
+ 'id' item[:id],
597
+ 'class' classname;
598
+ }
599
+ </pre>
600
+ </dd>
601
+ </dl>
602
+ <dl class="dl3">
603
+ <dt class="dt3"><b>
604
+ append: <i>expr</i>; </b></dt>
605
+ <dd class="dd3">
606
+ Append expression value to tail of tag.
607
+ This is used especially to add 'checked="checked"', 'selected="selected"'
608
+ into the form control tag.
609
+ <pre class="program">#checkbox1 {
610
+ append: member[:age] &gt; 18 ? ' checked="checked"' : '';
611
+ }
612
+ #select_options {
613
+ append: option[:value] == current_val ? ' selected="selected"' : '';
614
+ }
615
+ </pre>
616
+ </dd>
617
+ </dl>
618
+ <dl class="dl3">
619
+ <dt class="dt3"><b>
620
+ remove: 'attr1', 'attr2', 'attr3'; </b></dt>
621
+ <dd class="dd3">
622
+ Remove the attributes from the element.
623
+ </dd>
624
+ </dl>
625
+ <dl class="dl3">
626
+ <dt class="dt3"><b>
627
+ logic: { ... } </b></dt>
628
+ <dd class="dd3">
629
+ Logic of the element.
630
+ </dd>
631
+ </dl>
632
+ <p>'stag:' and 'elem:' are useful especially for Ruby on Rails.
633
+ The following is an examle to use Kwartz in Ruby on Rails.
634
+ </p>
635
+ <a name="form1.html"></a>
636
+ <div class="program_caption">
637
+ presentation data (form1.html)</div>
638
+ <pre class="program">&lt;form <b>id="form"</b>&gt;
639
+ Name: &lt;input type="text" <b>id="member_name"</b>&gt;&lt;br&gt;
640
+ Birthday: &lt;select <b>id="member_birth"</b>&gt;
641
+ &lt;option&gt; - &lt;/option&gt;
642
+ &lt;/select&gt;&lt;br&gt;
643
+ &lt;input type="submit" <b>id="submit"</b>&gt;
644
+ &lt;/form&gt;
645
+ </pre>
646
+ <a name="form1.plogic"></a>
647
+ <div class="program_caption">
648
+ presentation logic (form1.plogic)</div>
649
+ <pre class="program"><b>#form</b> {
650
+ <b>stag:</b> start_form_tag :action=&gt;'new';
651
+ }
652
+ <b>#member_name</b> {
653
+ <b>elem:</b> text_field 'member', 'name';
654
+ }
655
+ <b>#member_birth</b> {
656
+ <b>elem:</b> date_select 'member', birth';
657
+ }
658
+ <b>#submit</b> {
659
+ <b>elem:</b> submit_to 'Submit';
660
+ }
661
+ </pre>
662
+ <a name="form1.expected"></a>
663
+ <div class="terminal_caption">
664
+ compile</div>
665
+ <pre class="terminal">$ kwartz -p form1.plogic form1.html
666
+ <b>&lt;%= start_form_tag :action=&gt;'new' %&gt;</b>
667
+ Name: <b>&lt;%= text_field 'member', 'name' %&gt;</b>&lt;br&gt;
668
+ Birthday: <b>&lt;%= date_select 'member', birth' %&gt;</b>&lt;br&gt;
669
+ <b>&lt;%= submit_to 'Submit' %&gt;</b>
670
+ &lt;/form&gt;
671
+ </pre>
672
+ <br>
673
+
674
+
675
+ <a name="directives"></a>
676
+ <h3 class="section2">Directives</h3>
677
+ <p>Presentation logic may be embedded into presentation data in Kwartz.
678
+ You can choose to separate or not to sepearate presentation logic from presentation data.
679
+ </p>
680
+ <p>The reason to provide both solutions (separate or not) is <b>choosability</b>.
681
+ Some preferes to separate presentation logic from presentaion data, and others may
682
+ prefere to mix them.
683
+ Both approaches have own advantages and disadvantages.
684
+ Thus it is the user who determine which solution to adopt.
685
+ Kwartz provides both approaches and you can select which to use.
686
+ Kwartz doesn't enforce you to adopt a solution.
687
+ </p>
688
+ <p>To embed presentation logic into presentation data, use directives.
689
+ Directive is a command to embed presentation logic into presentation data.
690
+ In Kwartz, 'title' attributes<sup>(<a href="#fnref:4" name="fnlink:4">*4</a>)</sup> are used to describe directives.
691
+ </p>
692
+ <p>The following is an example to use directives.
693
+ </p>
694
+ <ul type="disc">
695
+ <li>Directive <code>title="for <i>var</i> in <i>list</i>"</code> means to iterate the element.
696
+ </li>
697
+ <li>Directive <code>title="value: <i>expression</i>"</code> means to print value of expression as content of the element.
698
+ </li>
699
+ <li>Directive <code>title="dummy:"</code> means that the element is a dummy and is not printed out.
700
+ </li>
701
+ </ul>
702
+ <a name="directive1.html"></a>
703
+ <div class="program_caption">
704
+ Presentation Data(directive1.html):</div>
705
+ <pre class="program">&lt;table&gt;
706
+ &lt;tr <b>title="for member in @members"</b>&gt;
707
+ &lt;td <b>title="value: member.name"</b>&gt;foo&lt;/td&gt;
708
+ &lt;td&gt;
709
+ &lt;a href="mailto:&lt;%= member.email %&gt;"
710
+ title="<b>value: member.email</b>"&gt;foo@mai.com&lt;/a&gt;
711
+ &lt;/td&gt;
712
+ &lt;/tr&gt;
713
+ &lt;tr <b>title="dummy:"</b>&gt;
714
+ &lt;td&gt;bar&lt;/td&gt;
715
+ &lt;td&gt;&lt;a href="mailto:bar@mail.org"&gt;bar@mail.org&lt;/a&gt;&lt;/td&gt;
716
+ &lt;/tr&gt;
717
+ &lt;tr <b>title="dummy:"</b>&gt;
718
+ &lt;td&gt;baz&lt;/td&gt;
719
+ &lt;td&gt;&lt;a href="mailto:baz@mail.net"&gt;baz@mail.net&lt;/a&gt;&lt;/td&gt;
720
+ &lt;/tr&gt;
721
+ &lt;/table&gt;
722
+ </pre>
723
+ <div class="terminal_caption">
724
+ Compile:</div>
725
+ <pre class="terminal">$ kwartz -l eruby directive1.html &gt; directive1.rhtml
726
+ </pre>
727
+ <a name="directive1.expected"></a>
728
+ <div class="program_caption">
729
+ Output script:</div>
730
+ <pre class="program">&lt;table&gt;
731
+ <b>&lt;% for member in @members do %&gt;</b>
732
+ &lt;tr&gt;
733
+ &lt;td&gt;<b>&lt;%= member.name %&gt;</b>&lt;/td&gt;
734
+ &lt;td&gt;
735
+ &lt;a href="mailto:<b>&lt;%= member.email %&gt;</b>"&gt;<b>&lt;%= member.email %&gt;</b>&lt;/a&gt;
736
+ &lt;/td&gt;
737
+ &lt;/tr&gt;
738
+ <b>&lt;% end %&gt;</b>
739
+ &lt;/table&gt;
740
+ </pre>
741
+ <p>If the first character of target attribute is a space, Kwartz recognize it as non-directive<sup>(<a href="#fnref:5" name="fnlink:5">*5</a>)</sup>.
742
+ </p>
743
+ <a name="directive2.html"></a>
744
+ <div class="program_caption">
745
+ presentation data (directive2.html)</div>
746
+ <pre class="program">&lt;span <b>title="value: expr1"</b>&gt;foo&lt;/span&gt;
747
+ &lt;span <b>title=" value: expr2"</b>&gt;bar&lt;/span&gt;
748
+ </pre>
749
+ <a name="directive2.expected"></a>
750
+ <div class="terminal_caption">
751
+ compile</div>
752
+ <pre class="terminal">$ kwartz directive2.html
753
+ &lt;span&gt;<b>&lt;%= expr1 %&gt;</b>&lt;/span&gt;
754
+ &lt;span <b>title="value: expr2"</b>&gt;bar&lt;/span&gt;
755
+ </pre>
756
+ <p>Directives are different in each target language.
757
+ For example, foreach loop is 'for item in list' in eRuby, 'foreach($list as $item)' in PHP, 'forEach(item in list)' in JSTL.
758
+ See reference manual for details about directives.
759
+ </p>
760
+ <div class="footnote">
761
+ <dl compact>
762
+ <dt>(<a name="fnref:4" href="#fnlink:4">*4</a>)</dt>
763
+ <dd>It is able to change attribute name by command-line option '--dattr=name' or configuration option PROPRERTY_DATTR.</dd>
764
+ <dt>(<a name="fnref:5" href="#fnlink:5">*5</a>)</dt>
765
+ <dd>This spec may change in the future if I get have better idea.</dd>
766
+ </dl>
767
+ </div>
768
+ <br>
769
+
770
+
771
+ <a name="escape"></a>
772
+ <h3 class="section2">Escape</h3>
773
+ <p>Kwartz supports Automatic-escape and Partial-escape/unescape.
774
+ </p>
775
+ <ul type="disc">
776
+ <li>If command-line option '<code>-e</code>' is specified, values of '<code>value: <i>expr</i></code>'
777
+ are escaped. (Automatic-escape)
778
+ </li>
779
+ <li>'<code>Value: <i>expr</i></code>' always escapes value even when '<code>-e</code>' is not specified. (Partial-escape)
780
+ </li>
781
+ <li>'<code>VALUE: <i>expr</i></code>' always doesn't escapes value even when '<code>-e</code>' is specified. (Partial-unescape)
782
+ </li>
783
+ </ul>
784
+ <a name="escape1.html"></a>
785
+ <div class="program_caption">
786
+ presentation Data (escape1.html):</div>
787
+ <pre class="program">&lt;tr&gt;
788
+ &lt;td id="mark:val1"&gt;foo&lt;/td&gt;
789
+ &lt;td id="mark:val2"&gt;bar&lt;/td&gt;
790
+ &lt;td id="mark:val3"&gt;baz&lt;/td&gt;
791
+ &lt;/tr&gt;
792
+ </pre>
793
+ <a name="escape1.plogic"></a>
794
+ <div class="program_caption">
795
+ presentation logic (escape1.plogic)</div>
796
+ <pre class="program">#val1 {
797
+ <b>value:</b> expr;
798
+ }
799
+ #val2 {
800
+ <b>Value:</b> expr;
801
+ }
802
+ #val3 {
803
+ <b>VALUE:</b> expr;
804
+ }
805
+ </pre>
806
+ <a name="escape1.expected"></a>
807
+ <div class="terminal_caption">
808
+ compile without '<code>-e</code>' option.</div>
809
+ <pre class="terminal">$ kwartz -p escape1.plogic escape1.html
810
+ &lt;tr&gt;
811
+ &lt;td&gt;&lt;%= expr %&gt;&lt;/td&gt;
812
+ &lt;td&gt;&lt;%=h expr %&gt;&lt;/td&gt;
813
+ &lt;td&gt;&lt;%= expr %&gt;&lt;/td&gt;
814
+ &lt;/tr&gt;
815
+ </pre>
816
+ <a name="escape1e.expected"></a>
817
+ <div class="terminal_caption">
818
+ comple with '<code>-e</code>' option.</div>
819
+ <pre class="terminal">$ kwartz <b>-e</b> -p escape1.plogic escape1.html
820
+ &lt;tr&gt;
821
+ &lt;td&gt;<b>&lt;%=h expr %&gt;</b>&lt;/td&gt;
822
+ &lt;td&gt;<b>&lt;%=h expr %&gt;</b>&lt;/td&gt;
823
+ &lt;td&gt;<b>&lt;%= expr %&gt;</b>&lt;/td&gt;
824
+ &lt;/tr&gt;
825
+ </pre>
826
+ <p>In the same way, '<code>Stag:</code>', '<code>Etag:</code>', '<code>Elem:</code>',
827
+ '<code>Cont:</code>', '<code>Attrs:</code>', and '<code>Append:</code>' properties are
828
+ always escaped, '<code>STAG:</code>', '<code>ETAG:</code>', '<code>ELEM:</code>',
829
+ '<code>CONT:</code>', '<code>ATTRS:</code>', and '<code>APPEND:</code>' properties are
830
+ never escaped.
831
+ </p>
832
+ <p>Escape function or method is different for each tareget language.
833
+ 'h()' is used in eRuby and 'htmlspecialchars()' in PHP.
834
+ JSTL prints escaped value in default.
835
+ </p>
836
+ <p>Directives <code>title="Value: <i>expr</i>"</code>, <code>title="Attr: '<i>name</i>' <i>expr</i>"</code>, and <code>title="Append: <i>expr</i>"</code> always escape expression value even when the command-line option '<code>-e</code>' is not specified.
837
+ </p>
838
+ <p>Directives <code>title="VALUE: <i>expr</i>:"</code>, <code>title="ATTR: '<i>name</i>' <i>expr</i>"</code>, and <code>title="APPEND: <i>expr</i>"</code> doesn't escape expression value even when the command-line option '<code>-e</code>' is specified.
839
+ </p>
840
+ <p>Configuration option PROPERTY_ESCAPE in 'kwartz/config.rb' determines whether values are escaped or not in default.
841
+ If this is true then Kwartz will escape values in default.
842
+ </p>
843
+ <br>
844
+
845
+
846
+ <a name="langs"></a>
847
+ <h3 class="section2">Multi-language</h3>
848
+ <p>Kwartz-ruby now supports the following programming language.
849
+ </p>
850
+ <ul type="disc">
851
+ <li>Ruby (eRuby)
852
+ </li>
853
+ <li>PHP
854
+ </li>
855
+ <li>JSP (JSTL 1.1 and 1.2)
856
+ </li>
857
+ <li>Perl (ePerl) [experimental]
858
+ </li>
859
+ </ul>
860
+ <p>Presentation logics must be described in each target language.
861
+ It means that if you have wrote presentation logics in Ruby, they were not reusable
862
+ for PHP project (but you can get full-power of Ruby in presentation logic).
863
+ </p>
864
+ <p>The followings are examples of Ruby, PHP, JSP, and Perl.
865
+ </p>
866
+ <a name="table1.html"></a>
867
+ <div class="program_caption">
868
+ table1.html</div>
869
+ <pre class="program">&lt;html&gt;
870
+ &lt;body&gt;
871
+
872
+ &lt;table&gt;
873
+ &lt;tr bgcolor="#CCCCFF" <b>id="mark:row"</b>&gt;
874
+ &lt;td <b>id="mark:name"</b>&gt;Foo&lt;/td&gt;
875
+ &lt;td <b>id="mark:mail"</b>&gt;foo@mail.com&lt;/td&gt;
876
+ &lt;/tr&gt;
877
+ &lt;tr bgcolor="#FFCCCC" <b>id="dummy:row1"</b>&gt;
878
+ &lt;td&gt;Bar&lt;/td&gt;
879
+ &lt;td&gt;bar@mail.net&lt;/td&gt;
880
+ &lt;/tr&gt;
881
+ &lt;tr bgcolor="#CCCCFF" <b>id="dummy:row2"</b>&gt;
882
+ &lt;td&gt;Baz&lt;/td&gt;
883
+ &lt;td&gt;baz@mail.org&lt;/td&gt;
884
+ &lt;/tr&gt;
885
+ &lt;/table&gt;
886
+
887
+ &lt;/body&gt;
888
+ &lt;/html&gt;
889
+ </pre>
890
+ <a name="table1.eruby.plogic"></a>
891
+ <div class="program_caption">
892
+ table1.eruby.plogic</div>
893
+ <pre class="program">#row {
894
+ attrs: "bgcolor" color;
895
+ logic: {
896
+ @list.each_with_index do |user, i|
897
+ color = i % 2 == 1 ? '#FFCCCC' : '#CCCCFF';
898
+ _elem
899
+ }
900
+ }
901
+ }
902
+
903
+ #name {
904
+ Value: user[:name];
905
+ }
906
+
907
+ #mail {
908
+ value: user[:mail];
909
+ }
910
+ </pre>
911
+ <a name="table1.php.plogic"></a>
912
+ <div class="program_caption">
913
+ table1.php.plogic</div>
914
+ <pre class="program">#row {
915
+ attrs: "bgcolor" $color;
916
+ logic: {
917
+ $i = 0;
918
+ foreach ($list as $user) {
919
+ $color = ++$i % 2 == 0 ? '#FFCCCC' : '#CCCCFF';
920
+ _elem();
921
+ }
922
+ }
923
+ }
924
+
925
+ #name {
926
+ Value: $user['name'];
927
+ }
928
+
929
+ #mail {
930
+ value: $user['mail'];
931
+ }
932
+ </pre>
933
+ <a name="table1.jstl.plogic"></a>
934
+ <div class="program_caption">
935
+ table1.jstl.plogic</div>
936
+ <pre class="program">#row {
937
+ attrs: "bgcolor" color;
938
+ logic: {
939
+ &lt;c:forEach var="user" items="${list}" varStatus="loop"&gt;
940
+ &lt;c:set var="color" value="${loop.index % 2 == 0 ? '#FFCCCC' : '#CCCCFF'}"/&gt;
941
+ _elem
942
+ &lt;/c:forEach&gt;
943
+ }
944
+ }
945
+
946
+ #name {
947
+ Value: user.name;
948
+ }
949
+
950
+ #mail {
951
+ value: user.mail;
952
+ }
953
+ </pre>
954
+ <a name="table1.eperl.plogic"></a>
955
+ <div class="program_caption">
956
+ table1.eperl.plogic</div>
957
+ <pre class="program">#row {
958
+ attrs: "bgcolor" $color;
959
+ logic: {
960
+ $i = 0;
961
+ foreach ($user in @list) {
962
+ $color = ++$i % 2 == 0 ? '#FFCCCC' : '#CCCCFF';
963
+ _elem();
964
+ }
965
+ }
966
+ }
967
+
968
+ #name {
969
+ Value: $user{'name'};
970
+ }
971
+
972
+ #mail {
973
+ value: $user{'mail'};
974
+ }
975
+ </pre>
976
+ <div class="terminal_caption">
977
+ compile</div>
978
+ <pre class="terminal">$ kwartz -l eruby -p table1.eruby.plogic table1.html &gt; table1.rhtml
979
+ $ kwartz -l php -p table1.php.plogic table1.html &gt; table1.php
980
+ $ kwartz -l jstl -p table1.jstl.plogic table1.html &gt; table1.jsp
981
+ $ kwartz -l eperl -p table1.eperl.plogic table1.html &gt; table1.iphtml
982
+ </pre>
983
+ <a name="table1.rhtml"></a>
984
+ <div class="program_caption">
985
+ output script (table1.rhtml)</div>
986
+ <pre class="program">&lt;html&gt;
987
+ &lt;body&gt;
988
+
989
+ &lt;table&gt;
990
+ <b>&lt;% @list.each_with_index do |user, i| %&gt;</b>
991
+ <b>&lt;% color = i % 2 == 1 ? '#FFCCCC' : '#CCCCFF' %&gt;</b>
992
+ &lt;tr bgcolor="<b>&lt;%= color %&gt;</b>"&gt;
993
+ &lt;td&gt;<b>&lt;%=h user[:name] %&gt;</b>&lt;/td&gt;
994
+ &lt;td&gt;<b>&lt;%= user[:mail] %&gt;</b>&lt;/td&gt;
995
+ &lt;/tr&gt;
996
+ <b>&lt;% end %&gt;</b>
997
+ &lt;/table&gt;
998
+
999
+ &lt;/body&gt;
1000
+ &lt;/html&gt;
1001
+ </pre>
1002
+ <a name="table1.php"></a>
1003
+ <div class="program_caption">
1004
+ output script (table1.php)</div>
1005
+ <pre class="program">&lt;html&gt;
1006
+ &lt;body&gt;
1007
+
1008
+ &lt;table&gt;
1009
+ <b>&lt;?php $i = 0; ?&gt;</b>
1010
+ <b>&lt;?php foreach ($list as $user) { ?&gt;</b>
1011
+ <b>&lt;?php $color = ++$i % 2 == 0 ? '#FFCCCC' : '#CCCCFF'; ?&gt;</b>
1012
+ &lt;tr bgcolor="<b>&lt;?php echo $color; ?&gt;</b>"&gt;
1013
+ &lt;td&gt;<b>&lt;?php echo htmlspecialchars($user['name']); ?&gt;</b>&lt;/td&gt;
1014
+ &lt;td&gt;<b>&lt;?php echo $user['mail']; ?&gt;</b>&lt;/td&gt;
1015
+ &lt;/tr&gt;
1016
+ <b>&lt;?php } ?&gt;</b>
1017
+ &lt;/table&gt;
1018
+
1019
+ &lt;/body&gt;
1020
+ &lt;/html&gt;
1021
+ </pre>
1022
+ <a name="table1.jsp"></a>
1023
+ <div class="program_caption">
1024
+ output script (JSTL 1.2)</div>
1025
+ <pre class="program">&lt;%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %&gt;
1026
+ &lt;%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %&gt;
1027
+ &lt;html&gt;
1028
+ &lt;body&gt;
1029
+
1030
+ &lt;table&gt;
1031
+ <b>&lt;c:forEach var="user" items="${list}" varStatus="loop"&gt;</b>
1032
+ <b>&lt;c:set var="color" value="${loop.index % 2 == 0 ? '#FFCCCC' : '#CCCCFF'}"/&gt;</b>
1033
+ &lt;tr bgcolor="<b>${color}</b>"&gt;
1034
+ &lt;td&gt;<b>${user.name}</b>&lt;/td&gt;
1035
+ &lt;td&gt;<b>${user.mail}</b>&lt;/td&gt;
1036
+ &lt;/tr&gt;
1037
+ <b>&lt;/c:forEach&gt;</b>
1038
+ &lt;/table&gt;
1039
+
1040
+ &lt;/body&gt;
1041
+ &lt;/html&gt;
1042
+ </pre>
1043
+ <a name="table1.iphtml"></a>
1044
+ <div class="program_caption">
1045
+ output script (ePerl)</div>
1046
+ <pre class="program">&lt;html&gt;
1047
+ &lt;body&gt;
1048
+
1049
+ &lt;table&gt;
1050
+ <b>&lt;? $i = 0; !&gt;</b>
1051
+ <b>&lt;? foreach ($user in @list) { !&gt;</b>
1052
+ <b>&lt;? $color = ++$i % 2 == 0 ? '#FFCCCC' : '#CCCCFF'; !&gt;</b>
1053
+ &lt;tr bgcolor="<b>&lt;?= $color !&gt;</b>"&gt;
1054
+ &lt;td&gt;<b>&lt;?= encode_entities($user{'name'}) !&gt;</b>&lt;/td&gt;
1055
+ &lt;td&gt;<b>&lt;?= $user{'mail'} !&gt;</b>&lt;/td&gt;
1056
+ &lt;/tr&gt;
1057
+ <b>&lt;? } !&gt;</b>
1058
+ &lt;/table&gt;
1059
+
1060
+ &lt;/body&gt;
1061
+ &lt;/html&gt;
1062
+ </pre>
1063
+ <br>
1064
+
1065
+
1066
+ <a name="span"></a>
1067
+ <h3 class="section2">Span Tag Deletion</h3>
1068
+ <p>Kwartz regards span tags which contain only directives as dummy tags and delete them automatically when command-line option '--delspan' is specified.
1069
+ </p>
1070
+ <a name="delspan1.html"></a>
1071
+ <div class="program_caption">
1072
+ presentation data (delspan1.html)</div>
1073
+ <pre class="program">&lt;h1&gt;&lt;span <b>id="mark:title"</b>&gt;title&lt;/span&gt;&lt;/h1&gt;
1074
+
1075
+ Hello &lt;span <b>title="value: user"</b>&gt;World&lt;/span&gt;!
1076
+ </pre>
1077
+ <a name="delspan1.plogic"></a>
1078
+ <div class="program_caption">
1079
+ presentation logic (delspan1.plogic)</div>
1080
+ <pre class="program">#title {
1081
+ value: title;
1082
+ }
1083
+ </pre>
1084
+ <a name="delspan1.expected"></a>
1085
+ <div class="terminal_caption">
1086
+ compile</div>
1087
+ <pre class="terminal">$ kwartz -p delspan1.plogic <b>--delspan</b> delspan1.html
1088
+ &lt;h1&gt;<b>&lt;%= title %&gt;</b>&lt;/h1&gt;
1089
+
1090
+ Hello <b>&lt;%= user %&gt;</b>!
1091
+ </pre>
1092
+ <p>The span tags are not removed when they have other attributes.
1093
+ </p>
1094
+ <a name="delspan2.html"></a>
1095
+ <div class="program_caption">
1096
+ presentation data (delspan2.html)</div>
1097
+ <pre class="program">Hello &lt;span <b>title="value: user" style="color:black"</b>&gt;World&lt;/span&gt;!
1098
+ </pre>
1099
+ <a name="delspan2.expected"></a>
1100
+ <div class="terminal_caption">
1101
+ compile</div>
1102
+ <pre class="terminal">$ kwartz <b>--delspan</b> delspan2.html
1103
+ Hello <b>&lt;span style="color:black"&gt;</b>&lt;%= user %&gt;<b>&lt;/span&gt;</b>!
1104
+ </pre>
1105
+ <br>
1106
+
1107
+
1108
+ <a name="import-plogic"></a>
1109
+ <h3 class="section2">Import Presentation Logic File</h3>
1110
+ <p>'<code>@imort "filename.plogic"</code>' imports filename.plogic.
1111
+ This is useful to share common presentation logic in many files.
1112
+ </p>
1113
+ <a name="link_to2.plogic"></a>
1114
+ <div class="program_caption">
1115
+ link_to.plogic</div>
1116
+ <pre class="program"><b>#link_to_new</b> {
1117
+ elem: start_link_to :action=&gt;'new';
1118
+ }
1119
+ <b>#link_to_show</b> {
1120
+ elem: start_link_to :action=&gt;'show', :id=&gt;@member;
1121
+ }
1122
+ <b>#link_to_edit</b> {
1123
+ elem: start_link_to :action=&gt;'edit', :id=&gt;@member;
1124
+ }
1125
+ <b>#link_to_list</b> {
1126
+ elem: start_link_to :action=&gt;'list';
1127
+ }
1128
+ <b>#link_to_destroy</b> {
1129
+ stag: start_link_to({:action=&gt;'destroy', :id=&gt;@member}, :confirm=&gt;'Are you sure?');
1130
+ }
1131
+ </pre>
1132
+ <a name="show2.html"></a>
1133
+ <div class="program_caption">
1134
+ show.html</div>
1135
+ <pre class="program">&lt;p&gt;
1136
+ Name: &lt;span id="mark:name"&gt;foo&lt;/span&gt; &lt;br&gt;
1137
+ Email: &lt;span id="mark:email"&gt;foo@mail.com&lt;/span&gt; &lt;br&gt;
1138
+ &lt;/p&gt;
1139
+ &lt;a href="#" <b>id="link_to_edit"</b>&gt;Edit this member&lt;/a&gt; |
1140
+ &lt;a href="#" <b>id="link_to_new"</b>&gt;Create new member&lt;/a&gt; |
1141
+ &lt;a href="#" <b>id="link_to_list"</b>&gt;Return to list&lt;/a&gt;
1142
+ </pre>
1143
+ <div class="program_caption">
1144
+ show.plogic</div>
1145
+ <pre class="program"><b>@import 'link_to.plogic';</b>
1146
+
1147
+ #name {
1148
+ Value: @member.name;
1149
+ }
1150
+ #email {
1151
+ Value: @member.email;
1152
+ }
1153
+ </pre>
1154
+ <a name="show2.expected"></a>
1155
+ <div class="terminal_caption">
1156
+ compile</div>
1157
+ <pre class="terminal">$ kwartz -p show.plogic show.html
1158
+ &lt;p&gt;
1159
+ Name: &lt;span&gt;&lt;%=h @member.name %&gt;&lt;/span&gt; &lt;br&gt;
1160
+ Email: &lt;span&gt;&lt;%=h @member.email %&gt;&lt;/span&gt; &lt;br&gt;
1161
+ &lt;/p&gt;
1162
+ &lt;%= start_link_to :action=&gt;'edit', :id=&gt;@member %&gt; |
1163
+ &lt;%= start_link_to :action=&gt;'new' %&gt; |
1164
+ &lt;%= start_link_to :action=&gt;'list' %&gt;
1165
+ </pre>
1166
+ <br>
1167
+
1168
+
1169
+ <a name="import-elem"></a>
1170
+ <h3 class="section2">Import Elements in Other Files</h3>
1171
+ <p>Command-line option '-i <i>filename,...</i>' imports element definitions form other files.
1172
+ </p>
1173
+ <a name="form.html"></a>
1174
+ <div class="program_caption">
1175
+ form.html</div>
1176
+ <pre class="program">&lt;form&gt;
1177
+ &lt;div <b>id="mark:form_content"</b>&gt;
1178
+ <b>Name: &lt;input type="text"&gt;&lt;br&gt;</b>
1179
+ <b>Password: &lt;input type="password"&gt;&lt;br&gt;</b>
1180
+ &lt;/div&gt;
1181
+ &lt;input type="submit"&gt;
1182
+ &lt;/form&gt;
1183
+ </pre>
1184
+ <a name="new.html"></a>
1185
+ <div class="program_caption">
1186
+ new.html</div>
1187
+ <pre class="program">&lt;form action="/new"&gt;
1188
+ &lt;div <b>id="mark:placeholder"</b>&gt;&lt;/div&gt;
1189
+ &lt;input type="submit" value="Create"&gt;
1190
+ &lt;/form&gt;
1191
+ </pre>
1192
+ <a name="new.plogic"></a>
1193
+ <div class="program_caption">
1194
+ new.plogic</div>
1195
+ <pre class="program">/* use element which is defined other file */
1196
+ <b>#placeholder</b> {
1197
+ logic: {
1198
+ <b>_content(form_content)</b>
1199
+ }
1200
+ }
1201
+ </pre>
1202
+ <a name="new.expected"></a>
1203
+ <div class="terminal_caption">
1204
+ compile</div>
1205
+ <pre class="terminal">$ kwartz <b>-i form.html</b> -p new.plogic new.html
1206
+ &lt;form action="/new"&gt;
1207
+ <b>Name: &lt;input type="text"&gt;&lt;br&gt;</b>
1208
+ <b>Password: &lt;input type="password"&gt;&lt;br&gt;</b>
1209
+ &lt;input type="submit" value="Create"&gt;
1210
+ &lt;/form&gt;
1211
+ </pre>
1212
+ <br>
1213
+
1214
+
1215
+ <a name="extract"></a>
1216
+ <h3 class="section2">Extract Element</h3>
1217
+ <p>Command option '-X <i>name</i>' extracts element marked as <i>name</i>
1218
+ and command option '-x <i>name</i>' extracts content of element.
1219
+ </p>
1220
+ <a name="show.html"></a>
1221
+ <div class="program_caption">
1222
+ show.html</div>
1223
+ <pre class="program">&lt;html&gt;
1224
+ &lt;body&gt;
1225
+ &lt;div <b>id="mark:content"</b>&gt;
1226
+ &lt;h1&gt;Show&lt;/h1&gt;
1227
+ &lt;p&gt;Name: &lt;span id="mark:name"&gt;foo&lt;/span&gt;&lt;/p&gt;
1228
+ &lt;p&gt;Email: &lt;span id="mark:email"&gt;foo@mail.com&lt;/span&gt;&lt;/p&gt;
1229
+ &lt;/div&gt;
1230
+ &lt;/body&gt;
1231
+ &lt;/html&gt;
1232
+ </pre>
1233
+ <a name="show.plogic"></a>
1234
+ <div class="program_caption">
1235
+ show.plogic</div>
1236
+ <pre class="program">#name {
1237
+ value: user.name;
1238
+ }
1239
+ #email {
1240
+ value: user.email;
1241
+ }
1242
+ </pre>
1243
+ <div class="terminal_caption">
1244
+ compile with '-X'</div>
1245
+ <pre class="terminal">$ kwartz <b>-X content</b> -p show.plogic show.html
1246
+ &lt;div&gt;
1247
+ &lt;h1&gt;Show&lt;/h1&gt;
1248
+ &lt;p&gt;Name: &lt;span&gt;&lt;%= user.name %&gt;&lt;/span&gt;&lt;/p&gt;
1249
+ &lt;p&gt;Email: &lt;span&gt;&lt;%= user.email %&gt;&lt;/span&gt;&lt;/p&gt;
1250
+ &lt;/div&gt;
1251
+ </pre>
1252
+ <a name="test_show_cont.expected"></a>
1253
+ <div class="terminal_caption">
1254
+ compile with '-x'</div>
1255
+ <pre class="terminal">$ kwartz <b>-x content</b> -p show.plogic show.html
1256
+ &lt;h1&gt;Show&lt;/h1&gt;
1257
+ &lt;p&gt;Name: &lt;span&gt;&lt;%= user.name %&gt;&lt;/span&gt;&lt;/p&gt;
1258
+ &lt;p&gt;Email: &lt;span&gt;&lt;%= user.email %&gt;&lt;/span&gt;&lt;/p&gt;
1259
+ </pre>
1260
+ <br>
1261
+
1262
+
1263
+ <a name="print-statement"></a>
1264
+ <h3 class="section2">Print Statement</h3>
1265
+ <p>Print statement is available in 'logic:' property.
1266
+ </p>
1267
+ <a name="print-stmt.html"></a>
1268
+ <div class="program_caption">
1269
+ print-stmt.html</div>
1270
+ <pre class="program">&lt;ul&gt;
1271
+ &lt;li id="items"&gt;foo&lt;/li&gt;
1272
+ &lt;/ul&gt;
1273
+ </pre>
1274
+ <a name="print-stmt.eruby.plogic"></a>
1275
+ <div class="program_caption">
1276
+ print-stmt.eruby.plogic</div>
1277
+ <pre class="program">#items {
1278
+ logic: {
1279
+ for item in list
1280
+ _stag
1281
+ <b>print item</b>
1282
+ _etag
1283
+ end
1284
+ }
1285
+ }
1286
+ </pre>
1287
+ <a name="print-stmt.eruby.expected"></a>
1288
+ <div class="terminal_caption">
1289
+ compile</div>
1290
+ <pre class="terminal">$ kwartz -l eruby -p print-stmt.eruby.plogic print-stmt.html
1291
+ &lt;ul&gt;
1292
+ &lt;% for item in list %&gt;
1293
+ &lt;li id="items"&gt;<b>&lt;%= item %&gt;</b>&lt;/li&gt;
1294
+ &lt;% end %&gt;
1295
+ &lt;/ul&gt;
1296
+ </pre>
1297
+ <a name="print-stmt.php.plogic"></a>
1298
+ <div class="program_caption">
1299
+ print-stmt.php.plogic</div>
1300
+ <pre class="program">#items {
1301
+ logic: {
1302
+ foreach ($list as $item) {
1303
+ _stag();
1304
+ <b>print($item);</b>
1305
+ _etag();
1306
+ }
1307
+ }
1308
+ }
1309
+ </pre>
1310
+ <a name="print-stmt.php.expected"></a>
1311
+ <div class="terminal_caption">
1312
+ compile</div>
1313
+ <pre class="terminal">$ kwartz -l php -p print-stmt.php.plogic print-stmt.html
1314
+ &lt;ul&gt;
1315
+ &lt;?php foreach ($list as $item) { ?&gt;
1316
+ &lt;li id="items"&gt;<b>&lt;?php echo $item; ?&gt;</b>&lt;/li&gt;
1317
+ &lt;?php } ?&gt;
1318
+ &lt;/ul&gt;
1319
+ </pre>
1320
+ <a name="print-stmt.jstl.plogic"></a>
1321
+ <div class="program_caption">
1322
+ print-stmt.jstl.plogic</div>
1323
+ <pre class="program">#items {
1324
+ logic: {
1325
+ &lt;c:forEach var="item" items="${list}"&gt;
1326
+ _stag
1327
+ <b>print item</b>
1328
+ _etag
1329
+ &lt;/c:forEach&gt;
1330
+ }
1331
+ }
1332
+ </pre>
1333
+ <a name="print-stmt.jstl12.expected"></a>
1334
+ <div class="terminal_caption">
1335
+ compile (JSTL 1.2)</div>
1336
+ <pre class="terminal">$ kwartz -l jstl -p print-stmt.jstl.plogic print-stmt.html
1337
+ &lt;%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %&gt;
1338
+ &lt;%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %&gt;
1339
+ &lt;ul&gt;
1340
+ &lt;c:forEach var="item" items="${list}"&gt;
1341
+ &lt;li id="items"&gt;<b>${item}</b>&lt;/li&gt;
1342
+ &lt;/c:forEach&gt;
1343
+ &lt;/ul&gt;
1344
+ </pre>
1345
+ <a name="print-stmt.jstl11.expected"></a>
1346
+ <div class="terminal_caption">
1347
+ compile (JSTL 1.1)</div>
1348
+ <pre class="terminal">$ kwartz -l jstl -p print-stmt.jstl.plogic --jstl=1.1 print-stmt.html
1349
+ &lt;%@ taglib prefix="c" uri="http://java.sun.com/jstl/core" %&gt;
1350
+ &lt;ul&gt;
1351
+ &lt;c:forEach var="item" items="${list}"&gt;
1352
+ &lt;li id="items"&gt;<b>&lt;c:out value="${item}"/&gt;</b>&lt;/li&gt;
1353
+ &lt;/c:forEach&gt;
1354
+ &lt;/ul&gt;
1355
+ </pre>
1356
+ <p>It is recommended to use 'elem:', 'stag:', 'etag:', 'cont:', or 'value:' instead of
1357
+ print statement because they can escape or unescape exression value.
1358
+ </p>
1359
+ <br>
1360
+
1361
+
1362
+ <a name="begin"></a>
1363
+ <h3 class="section2">Add Code at Beginning/End of Document</h3>
1364
+ <p>'#DOCUMENT' is a special selector which represents the document.
1365
+ In '#DOCUMENT', properties 'begin:' and 'end:' are available to add codes at beginning/end of document.
1366
+ </p>
1367
+ <a name="document-test.html"></a>
1368
+ <div class="program_caption">
1369
+ document-test.html</div>
1370
+ <pre class="program">&lt;html&gt;
1371
+ &lt;body&gt;hello&lt;/body&gt;
1372
+ &lt;/html&gt;
1373
+ </pre>
1374
+ <a name="document-test.plogic"></a>
1375
+ <div class="program_caption">
1376
+ document-test.plogic</div>
1377
+ <pre class="program"><b>#DOCUMENT</b> {
1378
+ <b>begin:</b> {
1379
+ title = _context[:title]
1380
+ user = _context[:user]
1381
+ }
1382
+ <b>end:</b> {
1383
+ print "&lt;!--end--&gt;\n"
1384
+ }
1385
+ }
1386
+ </pre>
1387
+ <a name="document-test.expected"></a>
1388
+ <div class="terminal_caption">
1389
+ compile</div>
1390
+ <pre class="terminal">$ kwartz -p document-test.plogic document-test.html
1391
+ <b>&lt;% title = _context[:title] %&gt;</b>
1392
+ <b>&lt;% user = _context[:user] %&gt;</b>
1393
+ &lt;html&gt;
1394
+ &lt;body&gt;hello&lt;/body&gt;
1395
+ &lt;/html&gt;
1396
+ <b>&lt;%= "&lt;!--end--&gt;\n" %&gt;</b>
1397
+ </pre>
1398
+ <br>
1399
+
1400
+
1401
+ <br>
1402
+
1403
+
1404
+ <a name="topics"></a>
1405
+ <h2 class="section1">Other Topics</h2>
1406
+ <a name="restriction1"></a>
1407
+ <h3 class="section2">Restrictions around presentation logic</h3>
1408
+ <p>There are several restrictions in presentation logic file.
1409
+ </p>
1410
+ <ul type="disc">
1411
+ <li>Position in which comment '<code>/* ... */</code>' is available is limited.
1412
+ In the following example, 'value:' property will be error because
1413
+ string from 'expr;' to the end of comment is regared as argument of 'value:' property.
1414
+ <pre class="program"> /* this comment is ok */
1415
+ #foo {
1416
+ /* this comment is ok */
1417
+ value: expr; /* this comment is NG! */
1418
+ logic: { /* this comment will be Ruby syntax error! */
1419
+ for item in list # ruby comment is OK in 'logic:' property
1420
+ _stag
1421
+ _cont
1422
+ _etag
1423
+ end
1424
+ }
1425
+ }
1426
+ </pre>
1427
+ </li>
1428
+ </ul>
1429
+ <ul type="disc">
1430
+ <li>'_stag', '_cont', '_etag', '_elem', '_element()', and '_content()' must be placed
1431
+ one in per line, because Kwartz-ruby scans 'logic:' property with regular expression
1432
+ pattern such as '/^\s*_(stag|cont|etag|element|content)(\(.*\))\s*$/' or so.
1433
+ <pre class="program"> #foo {
1434
+ logic: {
1435
+ # OK
1436
+ if x &gt; 0
1437
+ _elem
1438
+ end
1439
+
1440
+ # NG (parse failed)
1441
+ _elem if x &gt; 0
1442
+ }
1443
+ }
1444
+ </pre>
1445
+ </li>
1446
+ </ul>
1447
+ <ul type="disc">
1448
+ <li>The number of '{' and '}' must be equal in 'logic:' property.
1449
+ <pre class="program">#foo {
1450
+ logic: {
1451
+ str = "{" # this will be parse error
1452
+ _elem
1453
+ }
1454
+ }
1455
+ #bar {
1456
+ logic: {
1457
+ str = "{" # add dummy '}' in comment!
1458
+ _elem
1459
+ }
1460
+ }
1461
+ </pre>
1462
+ </li>
1463
+ </ul>
1464
+ <ul type="disc">
1465
+ <li>'@import "file.plogic"' should be at the beginning of presentation logic file.
1466
+ <pre class="program"> /* OK */
1467
+ @import 'file1.plogic';
1468
+
1469
+ #foo {
1470
+ }
1471
+
1472
+ /* NG */
1473
+ @import 'file2.plogic';
1474
+ </pre>
1475
+ </li>
1476
+ </ul>
1477
+ <br>
1478
+
1479
+
1480
+ <a name="restriction2"></a>
1481
+ <h3 class="section2">Restrictions around presentation data</h3>
1482
+ <p>Kwartz parses presentation data file by regular expression pattern matching.
1483
+ It means that Kwartz doesn't use HTML parser nor XML parser for parsing presentation data.
1484
+ This approach enables Kwartz to handle any type of text file, and also brings the following restrictions to Kwartz.
1485
+ </p>
1486
+ <ul type="disc">
1487
+ <li>Cannot omit end tag if id attribute is specified.
1488
+ <pre class="program">&lt;!-- Kwartz cannot parse the following because &lt;/li&gt; is omitted. --&gt;
1489
+ &lt;ul&gt;
1490
+ &lt;li id="foo"&gt;foo
1491
+ &lt;/ul&gt;
1492
+ </pre>
1493
+ An Element which doesn't have any content is to be written as an empty tag such as <code>&lt;foo id="..."/&gt;</code>.
1494
+ </li>
1495
+ </ul>
1496
+ <ul type="disc">
1497
+ <li>However, <code>&lt;input&gt;</code>, <code>&lt;br&gt;</code>, <code>&lt;meta&gt;</code>, <code>&lt;img&gt;</code>, and <code>&lt;hr&gt;</code> are allowed to omit end tag.
1498
+ And these doesn't have to be written as an empty tag.
1499
+ <pre class="program">&lt;!-- &lt;/input/&gt; is omitted but Kwartz can parse correctly. --&gt;
1500
+ &lt;input type="text" name="user" id="user"&gt;
1501
+ </pre>
1502
+ Configuration option PROPERTY_NOEND lists these tag names in file 'kwartz/config.rb'.
1503
+ Upper-case and lower-case are distinguished.
1504
+ </li>
1505
+ </ul>
1506
+ <ul type="disc">
1507
+ <li>Attribute values should be surrounded with '<code>"</code>'.
1508
+ <pre class="program">&lt;!-- Kwartz fails parsing because attribute value is not surrounded with '"'. --&gt;
1509
+ &lt;h1 id="value:title" class=title&gt;title&lt;/h1&gt;
1510
+ </pre>
1511
+ </li>
1512
+ </ul>
1513
+ <br>
1514
+
1515
+
1516
+ <a name="makefile"></a>
1517
+ <h3 class="section2">Makefile and Rakefile</h3>
1518
+ <p>The followings are examples of Makefile, Rakefile, Rantfile, and Rookbook.
1519
+ </p>
1520
+ <div class="program_caption">
1521
+ example of Makefile</div>
1522
+ <pre class="program">.SUFFIXES: .rhtml .html .plogic
1523
+
1524
+ ALL = file1.rhtml file2.rhtml file3.rhtml
1525
+ LAYOUT = layout.html
1526
+
1527
+ default: $(ALL)
1528
+
1529
+ %.rhtml: %.html %.plogic
1530
+ kwartz -l eruby -p $*.plogic $*.html &gt; $@
1531
+
1532
+ file3.rhtml: file3.html file3.plogic $(LAYOUT)
1533
+ kwartz -p file3.plogic -L $(LAYOUT) file3.html &gt; file3.rhtml
1534
+ </pre>
1535
+ <div class="program_caption">
1536
+ example of Rakefile for <a href="http://rake.rubyforge.org/">Rake</a></div>
1537
+ <pre class="program">all = ["file1.rhtml", "file2.rhtml", "file3.rhtml"]
1538
+ layout = 'layout.html'
1539
+
1540
+ task :default =&gt; all
1541
+
1542
+ rule '.rhtml' =&gt; ['.html', '.plogic'] do |t|
1543
+ pdata, plogic = t.sources
1544
+ sh "kwartz -l eruby -p #{plogic} #{pdata} &gt; #{t.name}"
1545
+ end
1546
+
1547
+ file 'file3.rhtml' =&gt; ["file3.html", "file3.plogic", layout] do |t|
1548
+ pdata, plogic, layout = t.prerequisites
1549
+ sh "kwartz -p #{plogic} -L #{layout} #{pdata} &gt; #{t.name}"
1550
+ end
1551
+ </pre>
1552
+ <div class="program_caption">
1553
+ example of Rantfile for <a href="http://make.rubyforge.org/">Rant</a></div>
1554
+ <pre class="program">all = ["file1.rhtml", "file2.rhtml", "file3.rhtml"]
1555
+ layout = 'layout.html'
1556
+
1557
+ task :default =&gt; all
1558
+
1559
+ gen Rule, ".rhtml" =&gt; [".html", ".plogic"] do |t|
1560
+ pdata, plogic = t.prerequisites
1561
+ sys "kwartz -p #{plogic} #{pdata} &gt; #{t.name}"
1562
+ end
1563
+
1564
+ file "file3.rhtml" =&gt; ["file3.html", "file3.plogic", layout] do |t|
1565
+ pdata, plogic, layout = t.prerequisites
1566
+ sys "kwartz -p #{plogic} -L #{layout} #{pdata} &gt; #{t.name}"
1567
+ end
1568
+ </pre>
1569
+ <div class="program_caption">
1570
+ example of Rookbook for <a href="http://www.rubyforge.org/projects/rook">Rook</a></div>
1571
+ <pre class="program">properties:
1572
+ - layout : layout.html
1573
+
1574
+ variables:
1575
+ - all : [ file1.rhtml, 'file2.rhtml', file3.rhtml ]
1576
+ - rook_product: $(all)
1577
+
1578
+ recipes:
1579
+
1580
+ - product: *.rhtml
1581
+ ingreds: [ $(1).html, $(1).plogic ]
1582
+ method: |
1583
+ pdata, plogic = @ingreds
1584
+ sys "kwartz -p #{plogic} #{pdata} &gt; #{@product}"
1585
+
1586
+ - product: file3.rhtml
1587
+ ingres: [ file3.html, file3.plogic, $(layout) ]
1588
+ method: |
1589
+ pdata, plogic, layout = @ingreds
1590
+ sys "kwartz- p #{plogic} -L $(layout) #{pdata} &gt; #{@product}"
1591
+ </pre>
1592
+ <br>
1593
+
1594
+
1595
+ <a name="kwartz-lib"></a>
1596
+ <h3 class="section2">Use Kwartz as Library</h3>
1597
+ <p>If you want to use Kwartz library in your Ruby script, use Kwartz::Main class.
1598
+ </p>
1599
+ <div class="program_caption">
1600
+ usage of Kwartz::Main class</div>
1601
+ <pre class="program"><b>require 'kwartz'</b>
1602
+ <b>require 'kwartz/main'</b>
1603
+
1604
+ argv = %w[-p hello.plogic -L layout.html hello.html]
1605
+ <b>main = Kwartz::Main.new(argv)</b>
1606
+ <b>output = main.execute()</b>
1607
+ File.open('hello.rhtml', 'w') { |f| f.write(output) }
1608
+ </pre>
1609
+ <br>
1610
+
1611
+
1612
+ <a name="start_link_to"></a>
1613
+ <h3 class="section2"><code>link_to()</code> method in Ruby on Rails</h3>
1614
+ <p><code>link_to()</code> method in Ruby on Rails is a little incompatible with Kwartz
1615
+ because you must specify link label in both presentation data and presentation logic.
1616
+ It's not DRY.
1617
+ </p>
1618
+ <div class="program_caption">
1619
+ presentation data</div>
1620
+ <pre class="program">&lt;a href="#" id="mark:link_to_new"&gt;<b>Create new recipe</b>&lt;/a&gt;
1621
+ </pre>
1622
+ <div class="program_caption">
1623
+ presentation logic</div>
1624
+ <pre class="program">#link_to_new {
1625
+ elem: link_to <b>'Create new recipe'</b>, :action=&gt;'new';
1626
+ }
1627
+ </pre>
1628
+ <p>It is recommended to include the following helper method
1629
+ in your 'app/helpers/application_helper.rb'.
1630
+ </p>
1631
+ <pre class="program">module ApplicationHelper
1632
+
1633
+ def start_link_to(options = {}, html_options = nil, *parameters_for_method_reference)
1634
+ s = link_to('', options, html_options, *parameters_for_method_reference)
1635
+ s.sub!(/&lt;\/a&gt;\z/, '')
1636
+ end
1637
+ alias anchor start_link_to
1638
+
1639
+ def start_link_to_remote(options = {}, html_options = {})
1640
+ s = link_to_remote(options, html_options)
1641
+ s.sub!(/&lt;\/a&gt;\z/, '')
1642
+ end
1643
+ alias anchor_remote start_link_to_remote
1644
+
1645
+ end
1646
+ </pre>
1647
+ <p>The above methods prints only start tag. You don't need to write label twice.
1648
+ </p>
1649
+ <div class="program_caption">
1650
+ presentation data</div>
1651
+ <pre class="program">&lt;a href="#" id="mark:link_to_new"&gt;Create new recipe&lt;/a&gt;
1652
+ </pre>
1653
+ <div class="program_caption">
1654
+ presentation logic</div>
1655
+ <pre class="program">#link_to_new {
1656
+ stag: <b>start_link_to</b> :action=&gt;'new';
1657
+ }
1658
+ </pre>
1659
+ <br>
1660
+
1661
+
1662
+ <br>
1663
+
1664
+
1665
+
1666
+ </div>
1667
+ </blockquote>
1668
+
1669
+ </body>
1670
+ </html>