manveru-ramaze 2008.08 → 2008.09
Sign up to get free protection for your applications and to get access to all the features.
- data/Rakefile +1 -1
- data/bin/ramaze +1 -0
- data/doc/CHANGELOG +966 -0
- data/doc/tutorial/todolist.html +421 -313
- data/doc/tutorial/todolist.mkd +26 -9
- data/examples/helpers/paginate.rb +71 -0
- data/examples/misc/simple_auth.rb +20 -8
- data/lib/proto/controller/init.rb +10 -0
- data/lib/proto/controller/main.rb +1 -3
- data/lib/proto/model/init.rb +4 -0
- data/lib/proto/spec/main.rb +2 -1
- data/lib/proto/start.rb +3 -3
- data/lib/ramaze.rb +6 -1
- data/lib/ramaze/action.rb +2 -2
- data/lib/ramaze/adapter.rb +0 -5
- data/lib/ramaze/adapter/base.rb +24 -7
- data/lib/ramaze/contrib/gzip_filter.rb +22 -9
- data/lib/ramaze/contrib/maruku_uv.rb +59 -0
- data/lib/ramaze/contrib/profiling.rb +1 -1
- data/lib/ramaze/contrib/sequel/create_join.rb +25 -0
- data/lib/ramaze/contrib/sequel/form_field.rb +129 -0
- data/lib/ramaze/contrib/sequel/image.rb +198 -0
- data/lib/ramaze/contrib/sequel/relation.rb +82 -0
- data/lib/ramaze/controller/resolve.rb +1 -1
- data/lib/ramaze/current.rb +60 -20
- data/lib/ramaze/current/response.rb +15 -3
- data/lib/ramaze/dispatcher.rb +9 -3
- data/lib/ramaze/dispatcher/action.rb +2 -3
- data/lib/ramaze/dispatcher/directory.rb +1 -1
- data/lib/ramaze/dispatcher/error.rb +1 -1
- data/lib/ramaze/dispatcher/file.rb +1 -1
- data/lib/ramaze/helper/formatting.rb +33 -0
- data/lib/ramaze/helper/paginate.rb +234 -0
- data/lib/ramaze/option.rb +2 -2
- data/lib/ramaze/reloader.rb +2 -2
- data/lib/ramaze/snippets.rb +13 -0
- data/lib/ramaze/snippets/array/put_within.rb +31 -24
- data/lib/ramaze/snippets/binding/locals.rb +23 -11
- data/lib/ramaze/snippets/kernel/constant.rb +36 -21
- data/lib/ramaze/snippets/kernel/pretty_inspect.rb +12 -6
- data/lib/ramaze/snippets/numeric/filesize_format.rb +24 -17
- data/lib/ramaze/snippets/numeric/time.rb +63 -56
- data/lib/ramaze/snippets/object/__dir__.rb +29 -0
- data/lib/ramaze/snippets/object/acquire.rb +40 -0
- data/lib/ramaze/snippets/object/instance_variable_defined.rb +16 -5
- data/lib/ramaze/snippets/object/pretty.rb +14 -4
- data/lib/ramaze/snippets/object/scope.rb +14 -7
- data/lib/ramaze/snippets/ordered_set.rb +4 -0
- data/lib/ramaze/snippets/proc/locals.rb +17 -9
- data/lib/ramaze/snippets/ramaze/struct.rb +45 -0
- data/lib/ramaze/snippets/string/camel_case.rb +13 -8
- data/lib/ramaze/snippets/string/color.rb +24 -20
- data/lib/ramaze/snippets/string/each.rb +14 -3
- data/lib/ramaze/snippets/string/end_with.rb +17 -6
- data/lib/ramaze/snippets/string/esc.rb +26 -18
- data/lib/ramaze/snippets/string/ord.rb +12 -6
- data/lib/ramaze/snippets/string/snake_case.rb +13 -7
- data/lib/ramaze/snippets/string/start_with.rb +16 -6
- data/lib/ramaze/snippets/string/unindent.rb +23 -15
- data/lib/ramaze/snippets/thread/into.rb +3 -3
- data/lib/ramaze/spec/helper/snippets.rb +8 -0
- data/lib/ramaze/template/ezamar/textpow.syntax +34 -0
- data/lib/ramaze/tool/create.rb +27 -53
- data/lib/ramaze/tool/project_creator.rb +110 -0
- data/lib/ramaze/version.rb +1 -1
- data/rake_tasks/gem.rake +2 -1
- data/rake_tasks/maintenance.rake +38 -0
- data/rake_tasks/release.rake +6 -2
- data/rake_tasks/spec.rake +1 -2
- data/ramaze.gemspec +69 -78
- data/spec/examples/simple_auth.rb +2 -2
- data/spec/examples/templates/template_haml.rb +0 -2
- data/spec/ramaze/current/session.rb +1 -1
- data/spec/ramaze/dispatcher/file.rb +2 -2
- data/spec/ramaze/helper/formatting.rb +13 -0
- data/spec/ramaze/rewrite.rb +1 -1
- data/spec/ramaze/struct.rb +47 -0
- data/spec/ramaze/template/markaby.rb +1 -1
- data/spec/snippets/{kernel → object}/__dir__.rb +0 -0
- data/spec/snippets/{kernel → object}/acquire.rb +0 -0
- metadata +69 -78
- data/examples/app/rammit/spec/rammit.rb +0 -31
- data/examples/app/rammit/src/controller/main.rb +0 -3
- data/examples/app/rammit/src/controller/page.rb +0 -16
- data/examples/app/rammit/src/model.rb +0 -33
- data/examples/app/rammit/start.rb +0 -8
- data/examples/app/rammit/template/index.xhtml +0 -14
- data/examples/app/rammit/template/page/view.xhtml +0 -4
- data/lib/ramaze/snippets/kernel/__dir__.rb +0 -23
- data/lib/ramaze/snippets/kernel/acquire.rb +0 -34
- data/lib/ramaze/snippets/struct/fill.rb +0 -23
- data/lib/ramaze/snippets/struct/values_at.rb +0 -39
- data/lib/ramaze/snippets/symbol/to_proc.rb +0 -24
- data/lib/ramaze/sourcereload.rb +0 -183
- data/spec/snippets/struct/fill.rb +0 -26
- data/spec/snippets/struct/values_at.rb +0 -52
- data/spec/snippets/symbol/to_proc.rb +0 -13
data/doc/tutorial/todolist.html
CHANGED
|
@@ -2,26 +2,89 @@
|
|
|
2
2
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN" "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
|
|
3
3
|
<html xml:lang="en" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/1999/xhtml">
|
|
4
4
|
<head><meta content="application/xhtml+xml;charset=utf-8" http-equiv="Content-type" /><title>The official Ramaze todolist tutorial</title><style type="text/css">
|
|
5
|
-
|
|
6
|
-
.
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
.
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
.
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
.
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
.
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
5
|
+
pre { margin: 1em; padding: 1em; }
|
|
6
|
+
pre.iplastic .Constant {
|
|
7
|
+
color: #6782D3;
|
|
8
|
+
}
|
|
9
|
+
pre.iplastic .Support {
|
|
10
|
+
font-weight: bold;
|
|
11
|
+
color: #3333FF;
|
|
12
|
+
}
|
|
13
|
+
pre.iplastic .EmbeddedSource {
|
|
14
|
+
background-color: #F9F9F9;
|
|
15
|
+
color: #000000;
|
|
16
|
+
}
|
|
17
|
+
pre.iplastic .Arguments {
|
|
18
|
+
font-style: italic;
|
|
19
|
+
}
|
|
20
|
+
pre.iplastic .TypeName {
|
|
21
|
+
font-weight: bold;
|
|
22
|
+
}
|
|
23
|
+
pre.iplastic .Identifier {
|
|
24
|
+
color: #9700CC;
|
|
25
|
+
}
|
|
26
|
+
pre.iplastic .Number {
|
|
27
|
+
color: #0066FF;
|
|
28
|
+
}
|
|
29
|
+
pre.iplastic .SectionName {
|
|
30
|
+
font-weight: bold;
|
|
31
|
+
}
|
|
32
|
+
pre.iplastic .Storage {
|
|
33
|
+
font-weight: bold;
|
|
34
|
+
}
|
|
35
|
+
pre.iplastic .line-numbers {
|
|
36
|
+
background-color: #BAD6FD;
|
|
37
|
+
color: #000000;
|
|
38
|
+
}
|
|
39
|
+
pre.iplastic {
|
|
40
|
+
background-color: #EEEEEE;
|
|
41
|
+
color: #000000;
|
|
42
|
+
}
|
|
43
|
+
pre.iplastic .FrameTitle {
|
|
44
|
+
font-weight: bold;
|
|
45
|
+
color: #000000;
|
|
46
|
+
}
|
|
47
|
+
pre.iplastic .TagName {
|
|
48
|
+
font-weight: bold;
|
|
49
|
+
}
|
|
50
|
+
pre.iplastic .Tag {
|
|
51
|
+
color: #0033CC;
|
|
52
|
+
}
|
|
53
|
+
pre.iplastic .Exception {
|
|
54
|
+
color: #990000;
|
|
55
|
+
}
|
|
56
|
+
pre.iplastic .XmlDeclaration {
|
|
57
|
+
color: #333333;
|
|
58
|
+
}
|
|
59
|
+
pre.iplastic .TrailingWhitespace {
|
|
60
|
+
background-color: #EEEEEE;
|
|
61
|
+
}
|
|
62
|
+
pre.iplastic .TagAttribute {
|
|
63
|
+
color: #3366CC;
|
|
64
|
+
font-style: italic;
|
|
65
|
+
}
|
|
66
|
+
pre.iplastic .Invalid {
|
|
67
|
+
background-color: #E7342D;
|
|
68
|
+
color: #FF0000;
|
|
69
|
+
}
|
|
70
|
+
pre.iplastic .Keyword {
|
|
71
|
+
color: #0000FF;
|
|
72
|
+
}
|
|
73
|
+
pre.iplastic .String {
|
|
74
|
+
color: #009933;
|
|
75
|
+
}
|
|
76
|
+
pre.iplastic .Comment {
|
|
77
|
+
color: #0066FF;
|
|
78
|
+
font-style: italic;
|
|
79
|
+
}
|
|
80
|
+
pre.iplastic .FunctionName {
|
|
81
|
+
color: #FF8000;
|
|
82
|
+
}
|
|
83
|
+
pre.iplastic .RegularExpression {
|
|
84
|
+
color: #FF0080;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
</style></head>
|
|
25
88
|
<body>
|
|
26
89
|
<h1 id="todo_list_tutorial">To-do List Tutorial</h1>
|
|
27
90
|
<div class="maruku_toc"><ul style="list-style: none;"><li><a href="#step_zero_introduction">Step Zero, Introduction</a></li><li><a href="#first_step_create">First Step, Create</a></li><li><a href="#second_step_m_like_model">Second Step, M, like Model</a></li><li><a href="#third_step_v_like_view">Third Step, V, like View</a></li><li><a href="#fourth_step_c_like_controller">Fourth Step, C, like Controller</a></li><li><a href="#fifth_step_getting_dynamic">Fifth Step, getting dynamic</a></li><li><a href="#sixth_step_open_and_close_tasks">Sixth Step, open and close tasks</a></li><li><a href="#seventh_step_delete_tasks">Seventh Step, delete tasks</a></li><li><a href="#eighth_step_elements">Eighth Step, Elements</a></li><li><a href="#ninth_step_prettify">Ninth Step, Prettify</a></li><li><a href="#tenth_step_configuration">Tenth Step, Configuration</a></li><li><a href="#eleventh_step_refactor_with_aspecthelper">Eleventh Step, Refactor with AspectHelper</a></li><li><a href="#twelfth_step_validation_and_errors">Twelfth Step, Validation and Errors</a></li></ul></div>
|
|
@@ -49,7 +112,8 @@
|
|
|
49
112
|
|
|
50
113
|
<p>So run:</p>
|
|
51
114
|
|
|
52
|
-
<pre><code
|
|
115
|
+
<pre class="iplastic"><code class="shell-unix-generic" lang="shell-unix-generic">ramaze --create todolist
|
|
116
|
+
</code></pre>
|
|
53
117
|
|
|
54
118
|
<p>done.</p>
|
|
55
119
|
|
|
@@ -59,16 +123,18 @@
|
|
|
59
123
|
|
|
60
124
|
<p>So first, create a <code>model/todolist.rb</code> for our application:</p>
|
|
61
125
|
|
|
62
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
63
|
-
|
|
126
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">require</span> <span class="String"><span class="String">'</span>ramaze/store/default<span class="String">'</span></span>
|
|
127
|
+
TodoList <span class="Keyword">=</span> <span class="Support">Ramaze</span>::<span class="FunctionName">Store</span>::<span class="FunctionName">Default</span>.<span class="FunctionName">new</span>(<span class="String"><span class="String">'</span>todolist.yaml<span class="String">'</span></span>)
|
|
128
|
+
</code></pre>
|
|
64
129
|
|
|
65
130
|
<p>Let’s add some items as well to have a base to start from.</p>
|
|
66
131
|
|
|
67
|
-
<pre><code class="ruby" lang="ruby"
|
|
68
|
-
<span class="
|
|
69
|
-
|
|
70
|
-
<span class="
|
|
71
|
-
<span class="
|
|
132
|
+
<pre class="iplastic"><code class="ruby" lang="ruby">{ <span class="String"><span class="String">'</span>Laundry<span class="String">'</span></span> => {<span class="Constant"><span class="Constant">:</span>done</span> => <span class="Identifier">false</span>},
|
|
133
|
+
<span class="String"><span class="String">'</span>Wash dishes<span class="String">'</span></span> => {<span class="Constant"><span class="Constant">:</span>done</span> => <span class="Identifier">false</span>},
|
|
134
|
+
}.<span class="FunctionName">each</span> <span class="Keyword">do </span>|title, value|
|
|
135
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> value
|
|
136
|
+
<span class="Keyword">end</span>
|
|
137
|
+
</code></pre>
|
|
72
138
|
|
|
73
139
|
<h2 id="third_step_v_like_view">Third Step, V, like View</h2>
|
|
74
140
|
|
|
@@ -80,22 +146,23 @@
|
|
|
80
146
|
|
|
81
147
|
<p>Let’s put some things in there, I’ll explain the syntax as we go, it’s quite simple.</p>
|
|
82
148
|
|
|
83
|
-
<pre><code class="
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
TodoList
|
|
92
|
-
status = value[
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
149
|
+
<pre class="iplastic"><code class="html" lang="html"><span class="Tag"><span class="Tag"><</span><span class="TagName">html</span><span class="Tag">></span></span>
|
|
150
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
151
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">title</span><span class="Tag">></span></span>TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">title</span><span class="Tag">></span></span>
|
|
152
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
153
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
154
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">h1</span><span class="Tag">></span></span>TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">h1</span><span class="Tag">></span></span>
|
|
155
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
156
|
+
<span class="EmbeddedSource"> <span class="EmbeddedSource"><span class="EmbeddedSource"><?</span><span class="Constant">r</span></span></span>
|
|
157
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="Constant">TodoList</span><span class="Keyword">.</span><span class="Constant">each</span> <span class="Keyword">do</span> <span class="Keyword">|</span><span class="Constant">title</span>, <span class="Constant">value</span><span class="Keyword">|</span></span></span>
|
|
158
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="Constant">status</span> <span class="Keyword">=</span> <span class="Constant">value</span>[:<span class="Constant">done</span>] ? <span class="String"><span class="String">'</span><span class="String">done</span><span class="String">'</span></span> : <span class="String"><span class="String">'</span><span class="String">not done</span><span class="String">'</span></span></span></span>
|
|
159
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="EmbeddedSource"><span class="EmbeddedSource">?</span>></span></span></span>
|
|
160
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">li</span><span class="Tag">></span></span>#<span class="EmbeddedSource">{h title}</span>: #<span class="EmbeddedSource">{status}</span><span class="Tag"><span class="Tag"></</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
161
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
162
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
163
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
164
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">html</span><span class="Tag">></span></span>
|
|
165
|
+
</code></pre>
|
|
99
166
|
|
|
100
167
|
<p>I will assume that you are familiar with basic Ruby already, so we will concentrate on the things new here.</p>
|
|
101
168
|
|
|
@@ -103,10 +170,11 @@
|
|
|
103
170
|
|
|
104
171
|
<p>The whole Template would expand to something like this (only showing the interesting part)</p>
|
|
105
172
|
|
|
106
|
-
<pre><code class="
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
173
|
+
<pre class="iplastic"><code class="html" lang="html"><span class="Tag"><span class="Tag"><</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
174
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">li</span><span class="Tag">></span></span>Laundry: not done<span class="Tag"><span class="Tag"></</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
175
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">li</span><span class="Tag">></span></span>Wash dishes: not done<span class="Tag"><span class="Tag"></</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
176
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
177
|
+
</code></pre>
|
|
110
178
|
|
|
111
179
|
<p>That wasn’t too bad, huh?</p>
|
|
112
180
|
|
|
@@ -132,47 +200,50 @@
|
|
|
132
200
|
|
|
133
201
|
<p>The contents of it are like following:</p>
|
|
134
202
|
|
|
135
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
136
|
-
<span class="
|
|
137
|
-
<span class="
|
|
138
|
-
<span class="
|
|
203
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">class</span> <span class="TypeName">MainController<span class="TypeName"> <span class="TypeName"><</span> Controller</span></span>
|
|
204
|
+
<span class="Keyword">def</span> <span class="FunctionName">index</span>
|
|
205
|
+
@welcome <span class="Keyword">=</span> <span class="String"><span class="String">"</span>Welcome to Ramaze!<span class="String">"</span></span>
|
|
206
|
+
<span class="Keyword">end</span>
|
|
139
207
|
|
|
140
|
-
<span class="
|
|
141
|
-
<span class="
|
|
142
|
-
<span class="
|
|
143
|
-
<span class="
|
|
208
|
+
<span class="Keyword">def</span> <span class="FunctionName">notemplate</span>
|
|
209
|
+
<span class="String"><span class="String">"</span>there is no template associated with this action<span class="String">"</span></span>
|
|
210
|
+
<span class="Keyword">end</span>
|
|
211
|
+
<span class="Keyword">end</span>
|
|
212
|
+
</code></pre>
|
|
144
213
|
|
|
145
214
|
<p>The only methods right now are <code>#index</code> and <code>#notemplate</code>. The relationship between the methods on the controller and the templates is 1:1, so the method <code>#index</code> is combined with the template <code>index.xhtml</code>. This combination is called an <code>action</code>.</p>
|
|
146
215
|
|
|
147
216
|
<p>Let’s get back to editing and change the method <code>#index</code> to this:</p>
|
|
148
217
|
|
|
149
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
<span class="
|
|
155
|
-
<span class="
|
|
218
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">index</span>
|
|
219
|
+
@tasks <span class="Keyword">=</span> <span class="Support">TodoList</span>.<span class="FunctionName">original</span>
|
|
220
|
+
@tasks.<span class="FunctionName">each</span> <span class="Keyword">do </span>|title, value|
|
|
221
|
+
status <span class="Keyword">=</span> value[<span class="Constant"><span class="Constant">:</span>done</span>] <span class="Keyword">?</span> <span class="String"><span class="String">'</span>done<span class="String">'</span></span> : <span class="String"><span class="String">'</span>not done<span class="String">'</span></span>
|
|
222
|
+
@tasks[title] <span class="Keyword">=</span> status
|
|
223
|
+
<span class="Keyword">end</span>
|
|
224
|
+
<span class="Keyword">end</span>
|
|
225
|
+
</code></pre>
|
|
156
226
|
|
|
157
227
|
<p>This will take care of the logic inside the template, which now should be changed to do following:</p>
|
|
158
228
|
|
|
159
|
-
<pre><code class="
|
|
160
|
-
<span class="
|
|
161
|
-
<span class="
|
|
162
|
-
|
|
163
|
-
<span class="
|
|
164
|
-
<span class="
|
|
165
|
-
|
|
229
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">html</span><span class="Tag">></span></span>
|
|
230
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
231
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">title</span><span class="Tag">></span></span>TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">title</span><span class="Tag">></span></span>
|
|
232
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
233
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
234
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">h1</span><span class="Tag">></span></span>TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">h1</span><span class="Tag">></span></span>
|
|
235
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">if</span> <span class="EmbeddedSource"><span class="EmbeddedSource">@</span>tasks</span><span class="EmbeddedSource"><span class="EmbeddedSource">.</span><span class="FunctionName">empty?</span></span> <span class="EmbeddedSource">?></span></span>
|
|
166
236
|
No Tasks
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
<span class="
|
|
172
|
-
<span class="
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
<span class="
|
|
237
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">else</span> <span class="EmbeddedSource">?></span></span>
|
|
238
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
239
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="EmbeddedSource"><span class="EmbeddedSource">@</span>tasks</span><span class="EmbeddedSource"><span class="EmbeddedSource">.</span><span class="FunctionName">each</span></span> <span class="Keyword">do </span><span class="EmbeddedSource">|</span><span class="EmbeddedSource">title</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">status</span><span class="EmbeddedSource">|</span> <span class="EmbeddedSource">?></span></span>
|
|
240
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">li</span><span class="Tag">></span></span>#<span class="EmbeddedSource">{h title}</span>: #<span class="EmbeddedSource">{status}</span><span class="Tag"><span class="Tag"></</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
241
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
242
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
243
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
244
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
245
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">html</span><span class="Tag">></span></span>
|
|
246
|
+
</code></pre>
|
|
176
247
|
|
|
177
248
|
<p>The rest of the template can stay the same.</p>
|
|
178
249
|
|
|
@@ -192,24 +263,26 @@
|
|
|
192
263
|
|
|
193
264
|
<p>Add a link on the <code>view/index.xhtml</code> like this:</p>
|
|
194
265
|
|
|
195
|
-
<pre><code><
|
|
196
|
-
|
|
266
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">h1</span><span class="Tag">></span></span>TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">h1</span><span class="Tag">></span></span>
|
|
267
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">a</span> <span class="TagAttribute">href</span>=<span class="String"><span class="String">"</span>/new<span class="String">"</span></span><span class="Tag">></span></span>New Task<span class="Tag"><span class="Tag"></</span><span class="TagName">a</span><span class="Tag">></span></span>
|
|
268
|
+
</code></pre>
|
|
197
269
|
|
|
198
270
|
<p>Open a new file <code>view/new.xhtml</code> with a form to add a new task.</p>
|
|
199
271
|
|
|
200
|
-
<pre><code><
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
Task:
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
272
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">html</span><span class="Tag">></span></span>
|
|
273
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
274
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">title</span><span class="Tag">></span></span>TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">title</span><span class="Tag">></span></span>
|
|
275
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
276
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
277
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">h1</span><span class="Tag">></span></span>New Task<span class="Tag"><span class="Tag"></</span><span class="TagName">h1</span><span class="Tag">></span></span>
|
|
278
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">a</span> <span class="TagAttribute">href</span>=<span class="String"><span class="String">"</span>/<span class="String">"</span></span><span class="Tag">></span></span>Back to TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">a</span><span class="Tag">></span></span>
|
|
279
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">form</span> <span class="TagAttribute">method</span>=<span class="String"><span class="String">"</span>POST<span class="String">"</span></span> <span class="TagAttribute">action</span>=<span class="String"><span class="String">"</span>create<span class="String">"</span></span><span class="Tag">></span></span>
|
|
280
|
+
Task: <span class="Tag"><span class="Tag"><</span><span class="TagName">input</span> <span class="TagAttribute">type</span>=<span class="String"><span class="String">"</span>text<span class="String">"</span></span> <span class="TagAttribute">name</span>=<span class="String"><span class="String">"</span>title<span class="String">"</span></span> /<span class="Tag">></span></span><span class="Tag"><span class="Tag"><</span><span class="TagName">br</span> /<span class="Tag">></span></span>
|
|
281
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">input</span> <span class="TagAttribute">type</span>=<span class="String"><span class="String">"</span>submit<span class="String">"</span></span> /<span class="Tag">></span></span>
|
|
282
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">form</span><span class="Tag">></span></span>
|
|
283
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
284
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">html</span><span class="Tag">></span></span>
|
|
285
|
+
</code></pre>
|
|
213
286
|
|
|
214
287
|
<p>We will not need a method for this on our controller, in fact, actions can consist of either method and template or only one of them. The Controller can act as a View and the View can work like you may know it from PHP.</p>
|
|
215
288
|
|
|
@@ -221,11 +294,12 @@
|
|
|
221
294
|
|
|
222
295
|
<p>OK, let’s implement the action for <code>#create</code>, all we want to do is take the requests parameters and create a new task for it, this looks like following on your MainController.</p>
|
|
223
296
|
|
|
224
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
225
|
-
|
|
226
|
-
<span class="
|
|
227
|
-
|
|
228
|
-
<span class="
|
|
297
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">create</span>
|
|
298
|
+
title <span class="Keyword">=</span> request[<span class="String"><span class="String">'</span>title<span class="String">'</span></span>]
|
|
299
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> {<span class="Constant"><span class="Constant">:</span>done</span> => <span class="Identifier">false</span>}
|
|
300
|
+
redirect Rs()
|
|
301
|
+
<span class="Keyword">end</span>
|
|
302
|
+
</code></pre>
|
|
229
303
|
|
|
230
304
|
<p>That’s all folks!</p>
|
|
231
305
|
|
|
@@ -239,34 +313,37 @@
|
|
|
239
313
|
|
|
240
314
|
<p>Jump into <code>view/index.xhtml</code> and do the following:</p>
|
|
241
315
|
|
|
242
|
-
<pre><code class="
|
|
243
|
-
<span class="
|
|
244
|
-
|
|
245
|
-
<span class="
|
|
246
|
-
|
|
316
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="EmbeddedSource"><span class="EmbeddedSource">@</span>tasks</span><span class="EmbeddedSource"><span class="EmbeddedSource">.</span><span class="FunctionName">each</span></span> <span class="Keyword">do </span><span class="EmbeddedSource">|</span><span class="EmbeddedSource">title</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">status</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">toggle</span><span class="EmbeddedSource">|</span> <span class="EmbeddedSource">?></span></span>
|
|
317
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
318
|
+
#<span class="EmbeddedSource">{h title}</span>: #<span class="EmbeddedSource">{status}</span> - [ #<span class="EmbeddedSource">{toggle}</span> ]
|
|
319
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
320
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span></span>
|
|
321
|
+
</code></pre>
|
|
247
322
|
|
|
248
323
|
<p>We added a new element here, <code>toggle</code>, the Controller should give us a link to change the status corresponding to the status of the task, so off we go and change the index method on the controller once again:</p>
|
|
249
324
|
|
|
250
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
251
|
-
|
|
252
|
-
<span class="
|
|
253
|
-
<span class="
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
<span class="
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
<span class="
|
|
260
|
-
|
|
261
|
-
<span class="
|
|
262
|
-
|
|
263
|
-
<span class="
|
|
325
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">index</span>
|
|
326
|
+
@tasks <span class="Keyword">=</span> []
|
|
327
|
+
<span class="Support">TodoList</span>.<span class="FunctionName">original</span>.<span class="FunctionName">each</span> <span class="Keyword">do </span>|title, value|
|
|
328
|
+
<span class="Keyword">if</span> value[<span class="Constant"><span class="Constant">:</span>done</span>]
|
|
329
|
+
status <span class="Keyword">=</span> <span class="String"><span class="String">'</span>done<span class="String">'</span></span>
|
|
330
|
+
toggle <span class="Keyword">=</span> A(<span class="String"><span class="String">'</span>Open Task<span class="String">'</span></span>, <span class="Constant"><span class="Constant">:</span>href</span> => Rs(<span class="Constant"><span class="Constant">:</span>open</span>, title))
|
|
331
|
+
<span class="Keyword">else</span>
|
|
332
|
+
status <span class="Keyword">=</span> <span class="String"><span class="String">'</span>not done<span class="String">'</span></span>
|
|
333
|
+
toggle <span class="Keyword">=</span> A(<span class="String"><span class="String">'</span>Close Task<span class="String">'</span></span>, <span class="Constant"><span class="Constant">:</span>href</span> => Rs(<span class="Constant"><span class="Constant">:</span>close</span>, title))
|
|
334
|
+
<span class="Keyword">end</span>
|
|
335
|
+
@tasks <span class="Keyword"><<</span> [title, status, toggle]
|
|
336
|
+
<span class="Keyword">end</span>
|
|
337
|
+
@tasks.<span class="FunctionName">sort!</span>
|
|
338
|
+
<span class="Keyword">end</span>
|
|
339
|
+
</code></pre>
|
|
264
340
|
|
|
265
341
|
<p>Wow, quite some new stuff here. Let me explain that in detail.</p>
|
|
266
342
|
|
|
267
343
|
<p>We first decide whether a task is done or not, then go on and provide a link to toggle the status, A and Rs are both methods that help you do that. The result will be something like:</p>
|
|
268
344
|
|
|
269
|
-
<pre><code><
|
|
345
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">a</span> <span class="TagAttribute">href</span>=<span class="String"><span class="String">"</span>/open/Wash+dishes<span class="String">"</span></span><span class="Tag">></span></span>Close Task<span class="Tag"><span class="Tag"></</span><span class="TagName">a</span><span class="Tag">></span></span>
|
|
346
|
+
</code></pre>
|
|
270
347
|
|
|
271
348
|
<p>Rs actually is responsible to build the links href, for more information please take a look at the RDoc for LinkHelper.</p>
|
|
272
349
|
|
|
@@ -274,35 +351,41 @@
|
|
|
274
351
|
|
|
275
352
|
<p>As usual since the links for open and close don’t lead anywhere, add the corresponding methods to the Controller:</p>
|
|
276
353
|
|
|
277
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
<span class="
|
|
354
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">open</span> title
|
|
355
|
+
task_status title, <span class="Identifier">false</span>
|
|
356
|
+
redirect Rs()
|
|
357
|
+
<span class="Keyword">end</span>
|
|
281
358
|
|
|
282
|
-
<span class="
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
<span class="
|
|
359
|
+
<span class="Keyword">def</span> <span class="FunctionName">close</span> title
|
|
360
|
+
task_status title, <span class="Identifier">true</span>
|
|
361
|
+
redirect Rs()
|
|
362
|
+
<span class="Keyword">end</span>
|
|
286
363
|
|
|
287
|
-
<span class="
|
|
364
|
+
<span class="Keyword">private</span>
|
|
288
365
|
|
|
289
|
-
<span class="
|
|
290
|
-
|
|
291
|
-
<span class="
|
|
292
|
-
<span class="
|
|
293
|
-
<span class="
|
|
366
|
+
<span class="Keyword">def</span> <span class="FunctionName">task_status</span> title, status
|
|
367
|
+
task <span class="Keyword">=</span> <span class="Support">TodoList</span>[title]
|
|
368
|
+
task[<span class="Constant"><span class="Constant">:</span>done</span>] <span class="Keyword">=</span> status
|
|
369
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> task
|
|
370
|
+
<span class="Keyword">end</span>
|
|
371
|
+
</code></pre>
|
|
294
372
|
|
|
295
373
|
<p>Oh, now what have we got here? <code>private</code> declares that methods from here on are only to be used within the Controller itself, we define an <code>#task_status</code> method that takes the title and status to be set so we don’t have to repeat that code in <code>#open</code> and <code>#close</code> and follow the DRY (Don’t repeat yourself) paradigm.</p>
|
|
296
374
|
|
|
297
375
|
<p>Another thing we have not encountered so far is that you can define your public methods to take parameters on their own, they will be calculated from requests.</p>
|
|
298
376
|
|
|
299
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
377
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="String"><span class="String">'</span>/open/Wash+dishes<span class="String">'</span></span>
|
|
378
|
+
</code></pre>
|
|
300
379
|
|
|
301
380
|
<p>will translate into:</p>
|
|
302
381
|
|
|
303
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
382
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="FunctionName">open</span>(<span class="String"><span class="String">'</span>Wash dishes<span class="String">'</span></span>)
|
|
383
|
+
</code></pre>
|
|
304
384
|
|
|
305
|
-
<p>Which in turn will call
|
|
385
|
+
<p>Which in turn will call</p>
|
|
386
|
+
|
|
387
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="FunctionName">task_status</span>(<span class="String"><span class="String">'</span>Wash dishes<span class="String">'</span></span>, <span class="Identifier">false</span>)
|
|
388
|
+
</code></pre>
|
|
306
389
|
|
|
307
390
|
<p>That’s it, go on and try it :)</p>
|
|
308
391
|
|
|
@@ -312,23 +395,26 @@
|
|
|
312
395
|
|
|
313
396
|
<p>This is just two little changes away, so let’s add the link for deletion in our Controller:</p>
|
|
314
397
|
|
|
315
|
-
<pre><code class="ruby" lang="ruby"
|
|
316
|
-
|
|
398
|
+
<pre class="iplastic"><code class="ruby" lang="ruby">delete <span class="Keyword">=</span> A(<span class="String"><span class="String">'</span>Delete<span class="String">'</span></span>, <span class="Constant"><span class="Constant">:</span>href</span> => Rs(<span class="Constant"><span class="Constant">:</span>delete</span>, title))
|
|
399
|
+
@tasks <span class="Keyword"><<</span> [title, status, toggle, delete]
|
|
400
|
+
</code></pre>
|
|
317
401
|
|
|
318
402
|
<p>and an corresponding method while we’re at it:</p>
|
|
319
403
|
|
|
320
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
321
|
-
<span class="
|
|
322
|
-
|
|
323
|
-
<span class="
|
|
404
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">delete</span> title
|
|
405
|
+
<span class="Support">TodoList</span>.<span class="FunctionName">delete</span> title
|
|
406
|
+
redirect Rs()
|
|
407
|
+
<span class="Keyword">end</span>
|
|
408
|
+
</code></pre>
|
|
324
409
|
|
|
325
410
|
<p>Now jumping to <code>view/index.xhtml</code> again, change it so it shows the link:</p>
|
|
326
411
|
|
|
327
|
-
<pre><code><?r
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
412
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="EmbeddedSource"><span class="EmbeddedSource">@</span>tasks</span><span class="EmbeddedSource"><span class="EmbeddedSource">.</span><span class="FunctionName">each</span></span> <span class="Keyword">do </span><span class="EmbeddedSource">|</span><span class="EmbeddedSource">title</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">status</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">toggle</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">delete</span><span class="EmbeddedSource">|</span> <span class="EmbeddedSource">?></span></span>
|
|
413
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
414
|
+
#<span class="EmbeddedSource">{h title}</span>: #<span class="EmbeddedSource">{status}</span> [ #<span class="EmbeddedSource">{toggle}</span> | #<span class="EmbeddedSource">{delete}</span> ]
|
|
415
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
416
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
417
|
+
</code></pre>
|
|
332
418
|
|
|
333
419
|
<p>Voilà, you now have acquired the Certificate of Ramazeness.</p>
|
|
334
420
|
|
|
@@ -336,7 +422,8 @@
|
|
|
336
422
|
|
|
337
423
|
<h2 id="eighth_step_elements">Eighth Step, Elements</h2>
|
|
338
424
|
|
|
339
|
-
<pre><code><
|
|
425
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">Page</span><span class="Tag">><span class="Tag"><</span>/</span><span class="TagName">Page</span><span class="Tag">></span></span>
|
|
426
|
+
</code></pre>
|
|
340
427
|
|
|
341
428
|
<p>This is called an Element, Ramaze will go and search for a class that matches the name Page and responds to <code>#render</code>. Then it will go and hand the content in between to that Element.</p>
|
|
342
429
|
|
|
@@ -344,20 +431,22 @@
|
|
|
344
431
|
|
|
345
432
|
<p>Let us have a look at our templates, they got some repetitive stuff, like:</p>
|
|
346
433
|
|
|
347
|
-
<pre><code><
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
434
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">html</span><span class="Tag">></span></span>
|
|
435
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
436
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">title</span><span class="Tag">></span></span>TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">title</span><span class="Tag">></span></span>
|
|
437
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
438
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
439
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">h1</span><span class="Tag">></span></span>some title<span class="Tag"><span class="Tag"></</span><span class="TagName">h1</span><span class="Tag">></span></span>
|
|
440
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
441
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">html</span><span class="Tag">></span></span>
|
|
442
|
+
</code></pre>
|
|
355
443
|
|
|
356
444
|
<p>How about replacing that with something short and reusable:</p>
|
|
357
445
|
|
|
358
|
-
<pre><code><
|
|
446
|
+
<pre class="iplastic"><code class="html" lang="html"><span class="Tag"><span class="Tag"><</span><span class="TagName">Page</span> <span class="TagAttribute">title</span>=<span class="String"><span class="String">"</span>TodoList<span class="String">"</span></span><span class="Tag">></span></span>
|
|
359
447
|
your other content
|
|
360
|
-
|
|
448
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">Page</span><span class="Tag">></span></span>
|
|
449
|
+
</code></pre>
|
|
361
450
|
|
|
362
451
|
<p>Would be nice of course, and when you start having more templates it makes an awful lot of sense being able to change the enclosing stuff in one place.</p>
|
|
363
452
|
|
|
@@ -365,40 +454,42 @@
|
|
|
365
454
|
|
|
366
455
|
<p>Take a look at the <code>src/element/page.rb</code></p>
|
|
367
456
|
|
|
368
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
369
|
-
<span class="
|
|
370
|
-
<span class="
|
|
371
|
-
<html>
|
|
372
|
-
<head>
|
|
373
|
-
<title>Welcome to Ramaze</title>
|
|
374
|
-
</head>
|
|
375
|
-
<body>
|
|
376
|
-
<span class="
|
|
377
|
-
</body>
|
|
378
|
-
</html>
|
|
379
|
-
|
|
380
|
-
<span class="
|
|
381
|
-
<span class="
|
|
457
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">class</span> <span class="TypeName">Page<span class="TypeName"> <span class="TypeName"><</span> Ezamar::Element</span></span>
|
|
458
|
+
<span class="Keyword">def</span> <span class="FunctionName">render</span>
|
|
459
|
+
<span class="String"><span class="String">%{</span></span>
|
|
460
|
+
<span class="String"> <html></span>
|
|
461
|
+
<span class="String"> <head></span>
|
|
462
|
+
<span class="String"> <title>Welcome to Ramaze</title></span>
|
|
463
|
+
<span class="String"> </head></span>
|
|
464
|
+
<span class="String"> <body></span>
|
|
465
|
+
<span class="String"> <span class="String"><span class="String">#{</span>content<span class="String">}</span></span></span>
|
|
466
|
+
<span class="String"> </body></span>
|
|
467
|
+
<span class="String"> </html></span>
|
|
468
|
+
<span class="String"> <span class="String">}</span></span>
|
|
469
|
+
<span class="Keyword">end</span>
|
|
470
|
+
<span class="Keyword">end</span>
|
|
471
|
+
</code></pre>
|
|
382
472
|
|
|
383
473
|
<p>Alright, most things we need are in place already, the most important thing is the <code>#content</code> method that we call with <code>#{content}</code> inside the string in <code>#render</code>.</p>
|
|
384
474
|
|
|
385
475
|
<p>Just adopt it to your liking, I’ll just use the things we had in our templates so far:</p>
|
|
386
476
|
|
|
387
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
388
|
-
<span class="
|
|
389
|
-
<span class="
|
|
390
|
-
<html>
|
|
391
|
-
<head>
|
|
392
|
-
<title>TodoList</title>
|
|
393
|
-
</head>
|
|
394
|
-
<body>
|
|
395
|
-
<h1><span class="
|
|
396
|
-
<span class="
|
|
397
|
-
</body>
|
|
398
|
-
</html>
|
|
399
|
-
|
|
400
|
-
<span class="
|
|
401
|
-
<span class="
|
|
477
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">class</span> <span class="TypeName">Page<span class="TypeName"> <span class="TypeName"><</span> Ezamar::Element</span></span>
|
|
478
|
+
<span class="Keyword">def</span> <span class="FunctionName">render</span>
|
|
479
|
+
<span class="String"><span class="String">%{</span></span>
|
|
480
|
+
<span class="String"> <html></span>
|
|
481
|
+
<span class="String"> <head></span>
|
|
482
|
+
<span class="String"> <title>TodoList</title></span>
|
|
483
|
+
<span class="String"> </head></span>
|
|
484
|
+
<span class="String"> <body></span>
|
|
485
|
+
<span class="String"> <h1><span class="String"><span class="String">#{</span><span class="String"><span class="String">@</span>title</span><span class="String">}</span></span></h1></span>
|
|
486
|
+
<span class="String"> <span class="String"><span class="String">#{</span>content<span class="String">}</span></span></span>
|
|
487
|
+
<span class="String"> </body></span>
|
|
488
|
+
<span class="String"> </html></span>
|
|
489
|
+
<span class="String"> <span class="String">}</span></span>
|
|
490
|
+
<span class="Keyword">end</span>
|
|
491
|
+
<span class="Keyword">end</span>
|
|
492
|
+
</code></pre>
|
|
402
493
|
|
|
403
494
|
<p>Please note that instance variables reflecting the parameters are set.</p>
|
|
404
495
|
|
|
@@ -406,30 +497,32 @@
|
|
|
406
497
|
|
|
407
498
|
<p>First the <code>view/index.xhtml</code></p>
|
|
408
499
|
|
|
409
|
-
<pre><code><
|
|
410
|
-
|
|
411
|
-
|
|
500
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">Page</span> <span class="TagAttribute">title</span>=<span class="String"><span class="String">"</span>TodoList<span class="String">"</span></span><span class="Tag">></span></span>
|
|
501
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">a</span> <span class="TagAttribute">href</span>=<span class="String"><span class="String">"</span>/new<span class="String">"</span></span><span class="Tag">></span></span>New Task<span class="Tag"><span class="Tag"></</span><span class="TagName">a</span><span class="Tag">></span></span>
|
|
502
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">if</span> <span class="EmbeddedSource"><span class="EmbeddedSource">@</span>tasks</span><span class="EmbeddedSource"><span class="EmbeddedSource">.</span><span class="FunctionName">empty?</span></span> <span class="EmbeddedSource">?></span></span>
|
|
412
503
|
No Tasks
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
504
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">else</span> <span class="EmbeddedSource">?></span></span>
|
|
505
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
506
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="EmbeddedSource"><span class="EmbeddedSource">@</span>tasks</span><span class="EmbeddedSource"><span class="EmbeddedSource">.</span><span class="FunctionName">each</span></span> <span class="Keyword">do </span><span class="EmbeddedSource">|</span><span class="EmbeddedSource">title</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">status</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">toggle</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">delete</span><span class="EmbeddedSource">|</span> <span class="EmbeddedSource">?></span></span>
|
|
507
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
508
|
+
#<span class="EmbeddedSource">{h title}</span>: #<span class="EmbeddedSource">{status}</span> [ #<span class="EmbeddedSource">{toggle}</span> | #<span class="EmbeddedSource">{delete}</span> ]
|
|
509
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
510
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
511
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
512
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
513
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">Page</span><span class="Tag">></span></span>
|
|
514
|
+
</code></pre>
|
|
423
515
|
|
|
424
516
|
<p>and the <code>view/new.xhtml</code></p>
|
|
425
517
|
|
|
426
|
-
<pre><code><
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
Task:
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
518
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">Page</span> <span class="TagAttribute">title</span>=<span class="String"><span class="String">"</span>New Task<span class="String">"</span></span><span class="Tag">></span></span>
|
|
519
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">a</span> <span class="TagAttribute">href</span>=<span class="String"><span class="String">"</span>/<span class="String">"</span></span><span class="Tag">></span></span>Back to TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">a</span><span class="Tag">></span></span>
|
|
520
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">form</span> <span class="TagAttribute">method</span>=<span class="String"><span class="String">"</span>POST<span class="String">"</span></span> <span class="TagAttribute">action</span>=<span class="String"><span class="String">"</span>create<span class="String">"</span></span><span class="Tag">></span></span>
|
|
521
|
+
Task: <span class="Tag"><span class="Tag"><</span><span class="TagName">input</span> <span class="TagAttribute">type</span>=<span class="String"><span class="String">"</span>text<span class="String">"</span></span> <span class="TagAttribute">name</span>=<span class="String"><span class="String">"</span>title<span class="String">"</span></span> /<span class="Tag">></span></span><span class="Tag"><span class="Tag"><</span><span class="TagName">br</span> /<span class="Tag">></span></span>
|
|
522
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">input</span> <span class="TagAttribute">type</span>=<span class="String"><span class="String">"</span>submit<span class="String">"</span></span> /<span class="Tag">></span></span>
|
|
523
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">form</span><span class="Tag">></span></span>
|
|
524
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">Page</span><span class="Tag">></span></span>
|
|
525
|
+
</code></pre>
|
|
433
526
|
|
|
434
527
|
<p>Alright, now just go and look at the result in the browser, try changing the things inside the Element and look at how it behaves.</p>
|
|
435
528
|
|
|
@@ -439,40 +532,43 @@
|
|
|
439
532
|
|
|
440
533
|
<p>So, from what we have right now:</p>
|
|
441
534
|
|
|
442
|
-
<pre><code><
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
535
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
536
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="EmbeddedSource"><span class="EmbeddedSource">@</span>tasks</span><span class="EmbeddedSource"><span class="EmbeddedSource">.</span><span class="FunctionName">each</span></span> <span class="Keyword">do </span><span class="EmbeddedSource">|</span><span class="EmbeddedSource">title</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">status</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">toggle</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">delete</span><span class="EmbeddedSource">|</span> <span class="EmbeddedSource">?></span></span>
|
|
537
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
538
|
+
#<span class="EmbeddedSource">{h title}</span>: #<span class="EmbeddedSource">{status}</span> [ #<span class="EmbeddedSource">{toggle}</span> | #<span class="EmbeddedSource">{delete}</span> ]
|
|
539
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">li</span><span class="Tag">></span></span>
|
|
540
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
541
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">ul</span><span class="Tag">></span></span>
|
|
542
|
+
</code></pre>
|
|
449
543
|
|
|
450
544
|
<p>To something like this:</p>
|
|
451
545
|
|
|
452
|
-
<pre><code><
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
546
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">table</span><span class="Tag">></span></span>
|
|
547
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="EmbeddedSource"><span class="EmbeddedSource">@</span>tasks</span><span class="EmbeddedSource"><span class="EmbeddedSource">.</span><span class="FunctionName">each</span></span> <span class="Keyword">do </span><span class="EmbeddedSource">|</span><span class="EmbeddedSource">title</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">status</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">toggle</span><span class="EmbeddedSource">,</span> <span class="EmbeddedSource">delete</span><span class="EmbeddedSource">|</span> <span class="EmbeddedSource">?></span></span>
|
|
548
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">tr</span><span class="Tag">></span></span>
|
|
549
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">td</span> <span class="TagAttribute">class</span>=<span class="String"><span class="String">"</span>title<span class="String">"</span></span><span class="Tag">></span></span> #<span class="EmbeddedSource">{h title}</span> <span class="Tag"><span class="Tag"></</span><span class="TagName">td</span><span class="Tag">></span></span>
|
|
550
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">td</span> <span class="TagAttribute">class</span>=<span class="String"><span class="String">"</span>status<span class="String">"</span></span><span class="Tag">></span></span> #<span class="EmbeddedSource">{status}</span> <span class="Tag"><span class="Tag"></</span><span class="TagName">td</span><span class="Tag">></span></span>
|
|
551
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">td</span> <span class="TagAttribute">class</span>=<span class="String"><span class="String">"</span>toggle<span class="String">"</span></span><span class="Tag">></span></span> #<span class="EmbeddedSource">{toggle}</span> <span class="Tag"><span class="Tag"></</span><span class="TagName">td</span><span class="Tag">></span></span>
|
|
552
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">td</span> <span class="TagAttribute">class</span>=<span class="String"><span class="String">"</span>delete<span class="String">"</span></span><span class="Tag">></span></span> #<span class="EmbeddedSource">{delete}</span> <span class="Tag"><span class="Tag"></</span><span class="TagName">td</span><span class="Tag">></span></span>
|
|
553
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">tr</span><span class="Tag">></span></span>
|
|
554
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
555
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">table</span><span class="Tag">></span></span>
|
|
556
|
+
</code></pre>
|
|
462
557
|
|
|
463
558
|
<p>And, since we have proper classes to address some style sheets, jump into the Page element and add some style sheet:</p>
|
|
464
559
|
|
|
465
|
-
<pre><code><
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
table { width: 100%; }
|
|
469
|
-
tr { background: #efe; width: 100%; }
|
|
470
|
-
tr
|
|
471
|
-
td
|
|
472
|
-
td
|
|
473
|
-
a { color: #3a3; }
|
|
474
|
-
|
|
475
|
-
|
|
560
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
561
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">title</span><span class="Tag">></span></span>TodoList<span class="Tag"><span class="Tag"></</span><span class="TagName">title</span><span class="Tag">></span></span>
|
|
562
|
+
<span class="EmbeddedSource"> <span class="EmbeddedSource"><</span><span class="TagName">style</span><span class="EmbeddedSource">></span></span>
|
|
563
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="TagName">table</span> </span><span class="EmbeddedSource">{ width: 100%; }</span></span>
|
|
564
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="TagName">tr</span> </span><span class="EmbeddedSource">{ background: #efe; width: 100%; }</span></span>
|
|
565
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="TagName">tr</span><span class="TagAttribute"><span class="TagAttribute">:</span>hover</span> </span><span class="EmbeddedSource">{ background: #dfd; }</span></span>
|
|
566
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="TagName">td</span><span class="TagAttribute"><span class="TagAttribute">.</span>title</span> </span><span class="EmbeddedSource">{ font-weight: bold; width: 60%; }</span></span>
|
|
567
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="TagName">td</span><span class="TagAttribute"><span class="TagAttribute">.</span>status</span> </span><span class="EmbeddedSource">{ margin: 1em; }</span></span>
|
|
568
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"> <span class="TagName">a</span> </span><span class="EmbeddedSource">{ color: #3a3; }</span></span>
|
|
569
|
+
<span class="EmbeddedSource"> <span class="EmbeddedSource"></</span><span class="TagName">style</span><span class="EmbeddedSource">></span></span>
|
|
570
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">head</span><span class="Tag">></span></span>
|
|
571
|
+
</code></pre>
|
|
476
572
|
|
|
477
573
|
<p>That looks quite a bit nicer, right? And yes, if you don’t like tables (though this is an entirely legit use in my opinion) you can just do it like you want, using nested lists or divs/spans, replacing the open/close and delete links with nice images and changing the style according to the status.</p>
|
|
478
574
|
|
|
@@ -484,22 +580,26 @@
|
|
|
484
580
|
|
|
485
581
|
<p>First of all, the default port Ramaze runs on is 7000, but to make it a usual webserver it has to run on port 80. So, let’s add following line in your start.rb right after the lines of require you added before:</p>
|
|
486
582
|
|
|
487
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
583
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Support">Ramaze</span>::<span class="FunctionName">Global</span>.<span class="FunctionName">port</span> <span class="Keyword">=</span> <span class="Number">80</span>
|
|
584
|
+
</code></pre>
|
|
488
585
|
|
|
489
586
|
<p>Alright, that wasn’t that hard. Let’s say now you also want to run Mongrel instead of WEBrick, to get nice a bit of performance:</p>
|
|
490
587
|
|
|
491
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
588
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Support">Ramaze</span>::<span class="FunctionName">Global</span>.<span class="FunctionName">adapter</span> <span class="Keyword">=</span> <span class="Constant"><span class="Constant">:</span>mongrel</span>
|
|
589
|
+
</code></pre>
|
|
492
590
|
|
|
493
591
|
<p>To do this in a DRY way you could also do following:</p>
|
|
494
592
|
|
|
495
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
<span class="
|
|
593
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Support">Ramaze</span>::<span class="FunctionName">Global</span>.<span class="FunctionName">setup</span> <span class="Keyword">do </span>|g|
|
|
594
|
+
g.<span class="FunctionName">port</span> <span class="Keyword">=</span> <span class="Number">80</span>
|
|
595
|
+
g.<span class="FunctionName">adapter</span> <span class="Keyword">=</span> <span class="Constant"><span class="Constant">:</span>mongrel</span>
|
|
596
|
+
<span class="Keyword">end</span>
|
|
597
|
+
</code></pre>
|
|
499
598
|
|
|
500
599
|
<p>It seems to be quite common to put this configuration into separate files so you can just require it on demand. There are other, slightly stronger way to set options, which is either using flags on the ramaze executable, or like this:</p>
|
|
501
600
|
|
|
502
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
601
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Support">Ramaze</span>.<span class="FunctionName">start</span> <span class="Constant"><span class="Constant">:</span>port</span> => <span class="Number">80</span>, <span class="Constant"><span class="Constant">:</span>adapter</span> => <span class="Constant"><span class="Constant">:</span>mongrel</span>
|
|
602
|
+
</code></pre>
|
|
503
603
|
|
|
504
604
|
<p>We haven’t started Ramaze directly as of yet, but this allows you to ignore the ramaze executable and just run your application by <code>ruby start.rb</code>.</p>
|
|
505
605
|
|
|
@@ -507,26 +607,27 @@
|
|
|
507
607
|
|
|
508
608
|
<p>Now, if you take a closer look at the Controller you will see:</p>
|
|
509
609
|
|
|
510
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
511
|
-
|
|
512
|
-
<span class="
|
|
513
|
-
|
|
514
|
-
<span class="
|
|
610
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">create</span>
|
|
611
|
+
title <span class="Keyword">=</span> request[<span class="String"><span class="String">'</span>title<span class="String">'</span></span>]
|
|
612
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> {<span class="Constant"><span class="Constant">:</span>done</span> => <span class="Identifier">false</span>}
|
|
613
|
+
redirect R(self)
|
|
614
|
+
<span class="Keyword">end</span>
|
|
515
615
|
|
|
516
|
-
<span class="
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
<span class="
|
|
616
|
+
<span class="Keyword">def</span> <span class="FunctionName">open</span> title
|
|
617
|
+
task_status title, <span class="Identifier">false</span>
|
|
618
|
+
redirect R(self)
|
|
619
|
+
<span class="Keyword">end</span>
|
|
520
620
|
|
|
521
|
-
<span class="
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
<span class="
|
|
621
|
+
<span class="Keyword">def</span> <span class="FunctionName">close</span> title
|
|
622
|
+
task_status title, <span class="Identifier">true</span>
|
|
623
|
+
redirect R(self)
|
|
624
|
+
<span class="Keyword">end</span>
|
|
525
625
|
|
|
526
|
-
<span class="
|
|
527
|
-
<span class="
|
|
528
|
-
|
|
529
|
-
<span class="
|
|
626
|
+
<span class="Keyword">def</span> <span class="FunctionName">delete</span> title
|
|
627
|
+
<span class="Support">TodoList</span>.<span class="FunctionName">delete</span> title
|
|
628
|
+
redirect R(self)
|
|
629
|
+
<span class="Keyword">end</span>
|
|
630
|
+
</code></pre>
|
|
530
631
|
|
|
531
632
|
<p>We did some refactoring before, by introducing <code>#task_status</code>, but here we have repetition again: <code>redirect Rs()</code> <em>after</em> each method did its job.</p>
|
|
532
633
|
|
|
@@ -534,25 +635,26 @@
|
|
|
534
635
|
|
|
535
636
|
<p>In your Controller, replace the previous chunk with following:</p>
|
|
536
637
|
|
|
537
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
538
|
-
|
|
539
|
-
<span class="
|
|
540
|
-
<span class="
|
|
638
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">create</span>
|
|
639
|
+
title <span class="Keyword">=</span> request[<span class="String"><span class="String">'</span>title<span class="String">'</span></span>]
|
|
640
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> {<span class="Constant"><span class="Constant">:</span>done</span> => <span class="Identifier">false</span>}
|
|
641
|
+
<span class="Keyword">end</span>
|
|
541
642
|
|
|
542
|
-
<span class="
|
|
543
|
-
|
|
544
|
-
<span class="
|
|
643
|
+
<span class="Keyword">def</span> <span class="FunctionName">open</span> title
|
|
644
|
+
task_status title, <span class="Identifier">false</span>
|
|
645
|
+
<span class="Keyword">end</span>
|
|
545
646
|
|
|
546
|
-
<span class="
|
|
547
|
-
|
|
548
|
-
<span class="
|
|
647
|
+
<span class="Keyword">def</span> <span class="FunctionName">close</span> title
|
|
648
|
+
task_status title, <span class="Identifier">true</span>
|
|
649
|
+
<span class="Keyword">end</span>
|
|
549
650
|
|
|
550
|
-
<span class="
|
|
551
|
-
<span class="
|
|
552
|
-
<span class="
|
|
651
|
+
<span class="Keyword">def</span> <span class="FunctionName">delete</span> title
|
|
652
|
+
<span class="Support">TodoList</span>.<span class="FunctionName">delete</span> title
|
|
653
|
+
<span class="Keyword">end</span>
|
|
553
654
|
|
|
554
|
-
<span class="
|
|
555
|
-
<span class="
|
|
655
|
+
helper <span class="Constant"><span class="Constant">:</span>aspect</span>
|
|
656
|
+
<span class="FunctionName">after</span>(<span class="Constant"><span class="Constant">:</span>create</span>, <span class="Constant"><span class="Constant">:</span>open</span>, <span class="Constant"><span class="Constant">:</span>close</span>, <span class="Constant"><span class="Constant">:</span>delete</span>){ <span class="FunctionName">redirect</span>(Rs()) }
|
|
657
|
+
</code></pre>
|
|
556
658
|
|
|
557
659
|
<p>Alright, that looks a lot nicer already and is definitely easier to maintain.</p>
|
|
558
660
|
|
|
@@ -564,23 +666,25 @@
|
|
|
564
666
|
|
|
565
667
|
<p>First we head over to the Controller again and take a look at <code>#create</code>:</p>
|
|
566
668
|
|
|
567
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
568
|
-
|
|
569
|
-
<span class="
|
|
570
|
-
<span class="
|
|
669
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">create</span>
|
|
670
|
+
title <span class="Keyword">=</span> request[<span class="String"><span class="String">'</span>title<span class="String">'</span></span>]
|
|
671
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> {<span class="Constant"><span class="Constant">:</span>done</span> => <span class="Identifier">false</span>}
|
|
672
|
+
<span class="Keyword">end</span>
|
|
673
|
+
</code></pre>
|
|
571
674
|
|
|
572
675
|
<p>Here we just create a new task, no matter what we get. Every seasoned web-developer would advise you to be suspicious about all the input you receive from your users, so let’s apply this advice.</p>
|
|
573
676
|
|
|
574
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
575
|
-
<span class="
|
|
576
|
-
|
|
577
|
-
<span class="
|
|
578
|
-
<span class="
|
|
579
|
-
|
|
580
|
-
<span class="
|
|
581
|
-
<span class="
|
|
582
|
-
<span class="
|
|
583
|
-
<span class="
|
|
677
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">create</span>
|
|
678
|
+
<span class="Keyword">if</span> title <span class="Keyword">=</span> request[<span class="String"><span class="String">'</span>title<span class="String">'</span></span>]
|
|
679
|
+
title.<span class="FunctionName">strip!</span>
|
|
680
|
+
<span class="Keyword">if</span> title.<span class="FunctionName">empty?</span>
|
|
681
|
+
<span class="FunctionName">failed</span>(<span class="String"><span class="String">"</span>Please enter a title<span class="String">"</span></span>)
|
|
682
|
+
redirect <span class="String"><span class="String">'</span>/new<span class="String">'</span></span>
|
|
683
|
+
<span class="Keyword">end</span>
|
|
684
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> {<span class="Constant"><span class="Constant">:</span>done</span> => <span class="Identifier">false</span>}
|
|
685
|
+
<span class="Keyword">end</span>
|
|
686
|
+
<span class="Keyword">end</span>
|
|
687
|
+
</code></pre>
|
|
584
688
|
|
|
585
689
|
<p>First of all we check if we got a request with a value for ‘title’, if we get none we just let the aspect kick in that will redirect the browser to the index. Next we strip the title of all spaces around it so we can check if it is empty. We will talk about the specifics of our error-handling now.</p>
|
|
586
690
|
|
|
@@ -588,45 +692,49 @@
|
|
|
588
692
|
|
|
589
693
|
<p>Let me show you our <code>#failed</code> method (it goes in the private section to <code>#task_status</code>):</p>
|
|
590
694
|
|
|
591
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
592
|
-
<span class="
|
|
593
|
-
<span class="
|
|
695
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">failed</span>(<span class="Arguments">message</span>)
|
|
696
|
+
flash[<span class="Constant"><span class="Constant">:</span>error</span>] <span class="Keyword">=</span> message
|
|
697
|
+
<span class="Keyword">end</span>
|
|
698
|
+
</code></pre>
|
|
594
699
|
|
|
595
700
|
<p>Duh, you may say, wouldn’t that fit in the one line instead of the call to <code>#failed</code>? Indeed, it would, but let me remind you, we have no checks for changing the status of a task yet. We will need error-handling there as well, so we just keep our code DRY and maintainable by collecting shared behaviour in small pieces.</p>
|
|
596
701
|
|
|
597
702
|
<p>Now on to the <code>#task_status</code>:</p>
|
|
598
703
|
|
|
599
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
600
|
-
<span class="
|
|
601
|
-
<span class="
|
|
602
|
-
|
|
603
|
-
<span class="
|
|
704
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">task_status</span> title, status
|
|
705
|
+
<span class="Keyword">unless</span> task <span class="Keyword">=</span> <span class="Support">TodoList</span>[title]
|
|
706
|
+
failed <span class="String"><span class="String">"</span>No such Task: `<span class="String"><span class="String">#{</span>title<span class="String">}</span></span>'<span class="String">"</span></span>
|
|
707
|
+
redirect_referer
|
|
708
|
+
<span class="Keyword">end</span>
|
|
604
709
|
|
|
605
|
-
<span class="
|
|
606
|
-
<span class="
|
|
607
|
-
<span class="
|
|
710
|
+
task[<span class="Constant"><span class="Constant">:</span>done</span>] <span class="Keyword">=</span> status
|
|
711
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> task
|
|
712
|
+
<span class="Keyword">end</span>
|
|
713
|
+
</code></pre>
|
|
608
714
|
|
|
609
715
|
<p>That used to look like this:</p>
|
|
610
716
|
|
|
611
|
-
<pre><code class="ruby" lang="ruby"><span class="
|
|
612
|
-
|
|
613
|
-
<span class="
|
|
614
|
-
<span class="
|
|
615
|
-
<span class="
|
|
717
|
+
<pre class="iplastic"><code class="ruby" lang="ruby"><span class="Keyword">def</span> <span class="FunctionName">task_status</span> title, status
|
|
718
|
+
task <span class="Keyword">=</span> <span class="Support">TodoList</span>[title]
|
|
719
|
+
task[<span class="Constant"><span class="Constant">:</span>done</span>] <span class="Keyword">=</span> status
|
|
720
|
+
<span class="Support">TodoList</span>[title] <span class="Keyword">=</span> task
|
|
721
|
+
<span class="Keyword">end</span>
|
|
722
|
+
</code></pre>
|
|
616
723
|
|
|
617
724
|
<p>So in fact all we added is a check whether a task already exists, set an error-message in case it doesn’t and redirect to wherever the browser came from.</p>
|
|
618
725
|
|
|
619
726
|
<p>But what about actually showing the error-messages we so carefully set? Well, where do we change the view? Right, in the templates. But both templates we have so far (index and new) share this behaviour, so we head over to the Element and add in the right place:</p>
|
|
620
727
|
|
|
621
|
-
<pre><code><
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
728
|
+
<pre class="iplastic"><code class="ezamar" lang="ezamar"><span class="Tag"><span class="Tag"><</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
729
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">h1</span><span class="Tag">></span></span>#<span class="EmbeddedSource">{@title}</span><span class="Tag"><span class="Tag"></</span><span class="TagName">h1</span><span class="Tag">></span></span>
|
|
730
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">if</span> flash<span class="EmbeddedSource">[</span><span class="Constant"><span class="Constant">:</span>error</span><span class="EmbeddedSource">]</span> <span class="EmbeddedSource">?></span></span>
|
|
731
|
+
<span class="Tag"><span class="Tag"><</span><span class="TagName">div</span> <span class="TagAttribute">class</span>=<span class="String"><span class="String">"</span>error<span class="String">"</span></span><span class="Tag">></span></span>
|
|
732
|
+
\\#<span class="EmbeddedSource">{flash[:error]}</span>
|
|
733
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">div</span><span class="Tag">></span></span>
|
|
734
|
+
<span class="EmbeddedSource"><span class="EmbeddedSource"><?r</span> <span class="Keyword">end</span> <span class="EmbeddedSource">?></span></span>
|
|
735
|
+
#<span class="EmbeddedSource">{content}</span>
|
|
736
|
+
<span class="Tag"><span class="Tag"></</span><span class="TagName">body</span><span class="Tag">></span></span>
|
|
737
|
+
</code></pre>
|
|
630
738
|
|
|
631
739
|
<p>The only thing special about it is the <code>\\#{flash[:error]}</code>, we have to escape the <code>#</code> so it won’t evaluate this immediately but wait until it is really rendered. As a note, If you read this as pure markaby, the double backslash is to output properly to HTML, just use one instead. Again, you can add some nifty style for that.</p>
|
|
632
740
|
|