slim 2.0.3 → 2.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/.travis.yml +7 -8
- data/.yardopts +1 -1
- data/CHANGES +23 -0
- data/Gemfile +2 -1
- data/LICENSE +1 -1
- data/README.jp.md +497 -268
- data/README.md +505 -278
- data/Rakefile +14 -2
- data/benchmarks/view.haml +2 -2
- data/doc/include.md +20 -0
- data/doc/jp/include.md +20 -0
- data/doc/jp/logic_less.md +137 -0
- data/doc/jp/smart.md +102 -0
- data/doc/jp/translator.md +28 -0
- data/doc/smart.md +102 -0
- data/lib/slim/command.rb +8 -2
- data/lib/slim/controls.rb +4 -3
- data/lib/slim/do_inserter.rb +1 -1
- data/lib/slim/embedded.rb +26 -22
- data/lib/slim/end_inserter.rb +1 -1
- data/lib/slim/engine.rb +3 -2
- data/lib/slim/filter.rb +2 -2
- data/lib/slim/grammar.rb +3 -1
- data/lib/slim/include.rb +54 -0
- data/lib/slim/interpolation.rb +1 -1
- data/lib/slim/parser.rb +61 -46
- data/lib/slim/smart.rb +8 -0
- data/lib/slim/smart/escaper.rb +42 -0
- data/lib/slim/smart/filter.rb +96 -0
- data/lib/slim/smart/parser.rb +33 -0
- data/lib/slim/splat/builder.rb +3 -3
- data/lib/slim/splat/filter.rb +2 -2
- data/lib/slim/translator.rb +2 -2
- data/lib/slim/version.rb +1 -1
- data/slim.gemspec +1 -1
- data/test/core/helper.rb +5 -3
- data/test/core/test_code_blocks.rb +11 -0
- data/test/core/test_code_escaping.rb +14 -4
- data/test/core/test_embedded_engines.rb +26 -0
- data/test/core/test_html_structure.rb +39 -0
- data/test/core/test_parser_errors.rb +8 -25
- data/test/core/test_pretty.rb +15 -0
- data/test/core/test_ruby_errors.rb +0 -10
- data/test/include/files/recursive.slim +1 -0
- data/test/include/files/slimfile.slim +3 -0
- data/test/include/files/subdir/test.slim +1 -0
- data/test/include/files/textfile +1 -0
- data/test/include/test_include.rb +23 -0
- data/test/literate/TESTS.md +17 -2
- data/test/rails/test/test_slim.rb +1 -1
- data/test/smart/test_smart_text.rb +300 -0
- data/test/translator/test_translator.rb +7 -6
- metadata +22 -4
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: c3e6e5e0191a26434040102229ea08970f481344
|
4
|
+
data.tar.gz: 4b8485efd9294318590d5472336ed7f6aef1f319
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 4dc486456eb27e9a02ce53ea211490222e9cc04f8c13ee4204688dcaceed5a3618c06815ba409863437138e30e73d0c6dcd53838998026b37fa314fad7c52362
|
7
|
+
data.tar.gz: 4768df1dd287abaf00154fb0346fba824602642956dd4116084069398a7a584ee6b352dc906f82c1f0ab825c8678c1579afd490b076248c119044e79ad31cfd6
|
data/.travis.yml
CHANGED
@@ -5,7 +5,6 @@ rvm:
|
|
5
5
|
- 2.0.0
|
6
6
|
- 2.1.0
|
7
7
|
- ruby-head
|
8
|
-
- jruby-18mode
|
9
8
|
- jruby-19mode
|
10
9
|
- rbx-2
|
11
10
|
env:
|
@@ -16,9 +15,9 @@ env:
|
|
16
15
|
- "TASK=test:rails RAILS=master"
|
17
16
|
- "TASK=test:rails RAILS=3.0.20"
|
18
17
|
- "TASK=test:rails RAILS=3.1.12 TILT=1.3.4"
|
19
|
-
- "TASK=test:rails RAILS=3.2.
|
20
|
-
- "TASK=test:rails RAILS=4.0.
|
21
|
-
- "TASK=test:rails RAILS=4.1.
|
18
|
+
- "TASK=test:rails RAILS=3.2.19 TILT=1.3.4"
|
19
|
+
- "TASK=test:rails RAILS=4.0.9"
|
20
|
+
- "TASK=test:rails RAILS=4.1.5"
|
22
21
|
- "TASK=test:sinatra SINATRA=master"
|
23
22
|
- "TASK=test:sinatra SINATRA=1.3.6"
|
24
23
|
- "TASK=test:sinatra SINATRA=1.4.5"
|
@@ -34,13 +33,13 @@ matrix:
|
|
34
33
|
- rvm: rbx-2
|
35
34
|
env: "TASK=test:rails RAILS=master"
|
36
35
|
- rvm: 1.8.7
|
37
|
-
env: "TASK=test:rails RAILS=4.0.
|
36
|
+
env: "TASK=test:rails RAILS=4.0.9"
|
38
37
|
- rvm: 1.8.7
|
39
|
-
env: "TASK=test:rails RAILS=4.1.
|
38
|
+
env: "TASK=test:rails RAILS=4.1.5"
|
40
39
|
- rvm: jruby-18mode
|
41
|
-
env: "TASK=test:rails RAILS=4.0.
|
40
|
+
env: "TASK=test:rails RAILS=4.0.9"
|
42
41
|
- rvm: jruby-18mode
|
43
|
-
env: "TASK=test:rails RAILS=4.1.
|
42
|
+
env: "TASK=test:rails RAILS=4.1.5"
|
44
43
|
allow_failures:
|
45
44
|
- env: "TASK=test:core_and_plugins TILT=master"
|
46
45
|
- env: "TASK=test:rails RAILS=master"
|
data/.yardopts
CHANGED
data/CHANGES
CHANGED
@@ -1,3 +1,26 @@
|
|
1
|
+
2.1.0
|
2
|
+
|
3
|
+
* Parser: Require pairwise braces in quoted attributes
|
4
|
+
* Parser: add :attr_list_delims and :code_attr_delims
|
5
|
+
* Parser: deprecate :attr_delims
|
6
|
+
* Parser: relax text indentation requirements:
|
7
|
+
| line
|
8
|
+
next line
|
9
|
+
tag some text
|
10
|
+
more text
|
11
|
+
* Parser: allow first line to be indented
|
12
|
+
* Parser: allow inline embedded languages:
|
13
|
+
.content: markdown: This is **important**
|
14
|
+
* Parser: allow line breaks in quoted attributes
|
15
|
+
* Added Opal as embedded engine
|
16
|
+
* slimrb: Change meaning of -r, deprecate -t and -l
|
17
|
+
* Fix issue with inserted end (#485)
|
18
|
+
* Add experimental 'slim/include' plugin (Might change in the future)
|
19
|
+
* Add experimental 'slim/smart' plugin (Might change in the future)
|
20
|
+
* Drop jruby18 support
|
21
|
+
* Fix rails error reporting #587 (Manipulate stacktrace)
|
22
|
+
* Splat: handle html_safe
|
23
|
+
|
1
24
|
2.0.3
|
2
25
|
|
3
26
|
* slimrb: Don't update HTML output on exceptions
|
data/Gemfile
CHANGED
@@ -10,6 +10,7 @@ end
|
|
10
10
|
|
11
11
|
if ENV['TILT']
|
12
12
|
if ENV['TILT'] == 'master'
|
13
|
+
gem 'opal', :github => 'opal/opal' if RUBY_VERSION > '1.9'
|
13
14
|
gem 'tilt', :github => 'rtomayko/tilt'
|
14
15
|
else
|
15
16
|
gem 'tilt', "= #{ENV['TILT']}"
|
@@ -51,4 +52,4 @@ gem 'org-ruby'
|
|
51
52
|
if ENV['TASK'] == 'bench'
|
52
53
|
gem 'erubis'
|
53
54
|
gem 'haml'
|
54
|
-
end
|
55
|
+
end
|
data/LICENSE
CHANGED
data/README.jp.md
CHANGED
@@ -14,9 +14,11 @@ Slim は 不可解にならないように view の構文を本質的な部品
|
|
14
14
|
* 安全性
|
15
15
|
* デフォルトで自動 HTML エスケープ
|
16
16
|
* Rails の `html_safe?` に対応
|
17
|
-
*
|
18
|
-
|
19
|
-
*
|
17
|
+
* 柔軟な設定
|
18
|
+
* プラグインを用いた拡張性:
|
19
|
+
* Mustache と同様のロジックレスモード
|
20
|
+
* インクルード
|
21
|
+
* 多言語化/I18n
|
20
22
|
* 高性能
|
21
23
|
* ERB/Erubis に匹敵するスピード
|
22
24
|
* Rails のストリーミングに対応
|
@@ -26,6 +28,7 @@ Slim は 不可解にならないように view の構文を本質的な部品
|
|
26
28
|
|
27
29
|
## リンク
|
28
30
|
|
31
|
+
* ホームページ: <http://slim-lang.com>
|
29
32
|
* ソース: <http://github.com/slim-template/slim>
|
30
33
|
* バグ: <http://github.com/slim-template/slim/issues>
|
31
34
|
* リスト: <http://groups.google.com/group/slim-template>
|
@@ -47,24 +50,27 @@ Slim の核となる構文は1つの考えによって導かれます: "この
|
|
47
50
|
Slim は 構文解析/コンパイルに [Temple](https://github.com/judofyr/temple) を使い [Tilt](https://github.com/rtomayko/tilt) に組み込まれます。これにより [Sinatra](https://github.com/sinatra/sinatra) やプレーンな [Rack](https://github.com/rack/rack) とも一緒に使えます。
|
48
51
|
|
49
52
|
Temple のアーキテクチャはとても柔軟でモンキーパッチなしで構文解析とコンパイルのプロセスの拡張を可能にします。これはロジックレスのプラグインや I18n が提供する翻訳プラグインに
|
50
|
-
|
53
|
+
使用されます。ロジックレスモードでは HTML をビルドするために Slim の構文を使いたいが, テンプレートの中で Ruby を書きたくない場合にも Slim を使うことができます。
|
51
54
|
|
52
55
|
### なぜ Slim を使うのか?
|
53
56
|
|
54
|
-
|
57
|
+
* Slim によって メンテナンスが容易な限りなく最小限のテンプレートを作成でき, 正しい文法の HTML や XML が書けることを保証します。
|
58
|
+
* Slim の構文は美的であり, テンプレートを書くのを楽しくしてくれると思います。Slim は主要なフレームワークで互換性があるので簡単に始めることができます。
|
59
|
+
* Slim のアーキテクチャは非常に柔軟なので構文の拡張やプラグインを書くことができます。
|
55
60
|
|
56
|
-
|
57
|
-
|
58
|
-
Slim は 最小限の構文とスピードをもたらすために生まれました。 もし Slim を選択しない場合, その理由はスピード以外の理由によるものでしょう。
|
59
|
-
|
60
|
-
___そう, Slim は速い!___ ベンチマークはコミット毎に <http://travis-ci.org/slim-template/slim> で取られています。
|
61
|
+
___そう, Slim は速い!___ Slim は開発当初からパフォーマンスに注意して開発されました。
|
62
|
+
ベンチマークはコミット毎に <http://travis-ci.org/slim-template/slim> で取られています。
|
61
63
|
この数字が信じられませんか? それは仕方ないことです。是非 rake タスクを使って自分でベンチマークを取ってみてください!
|
62
64
|
|
65
|
+
私たちの考えでは, あなたは Slim の機能と構文を使うべきです。Slim はあなたのアプリケーションのパフォーマンスに悪影響を与えないことを保証します。
|
66
|
+
|
63
67
|
### どう始めるの?
|
64
68
|
|
65
69
|
Slim を gem としてインストール:
|
66
70
|
|
67
|
-
|
71
|
+
~~~
|
72
|
+
gem install slim
|
73
|
+
~~~
|
68
74
|
|
69
75
|
あなたの Gemfile に `gem 'slim'` と書いてインクルードするか, ファイルに `require 'slim'` と書く必要があります。これだけです! 後は拡張子に .slim を使うだけで準備はできています。
|
70
76
|
|
@@ -72,37 +78,39 @@ Slim を gem としてインストール:
|
|
72
78
|
|
73
79
|
Slim テンプレートがどのようなものか簡単な例を示します:
|
74
80
|
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
81
|
+
~~~ slim
|
82
|
+
doctype html
|
83
|
+
html
|
84
|
+
head
|
85
|
+
title Slim のファイル例
|
86
|
+
meta name="keywords" content="template language"
|
87
|
+
meta name="author" content=author
|
88
|
+
link rel="icon" type="image/png" href=file_path("favicon.png")
|
89
|
+
javascript:
|
90
|
+
alert('Slim は javascript の埋め込みに対応します!')
|
91
|
+
|
92
|
+
body
|
93
|
+
h1 マークアップ例
|
94
|
+
|
95
|
+
#content
|
96
|
+
p このマークアップ例は Slim の典型的なファイルがどのようなものか示します。
|
97
|
+
|
98
|
+
== yield
|
99
|
+
|
100
|
+
- if items.any?
|
101
|
+
table#items
|
102
|
+
- for item in items
|
103
|
+
tr
|
104
|
+
td.name = item.name
|
105
|
+
td.price = item.price
|
106
|
+
- else
|
107
|
+
p アイテムが見つかりませんでした。いくつか目録を追加してください。
|
108
|
+
ありがとう!
|
109
|
+
|
110
|
+
div id="footer"
|
111
|
+
== render 'footer'
|
112
|
+
| Copyright © #{@year} #{@author}
|
113
|
+
~~~
|
106
114
|
|
107
115
|
インデントについて, インデントの深さはあなたの好みで選択できます。もし最初のインデントをスペース2つ, その次に5スペースを使いたい場合, それはあなたの選択次第です。マークアップを入れ子にするにはスペース1つのインデントが必要なだけです。
|
108
116
|
|
@@ -113,29 +121,37 @@ Slim テンプレートがどのようなものか簡単な例を示します:
|
|
113
121
|
パイプは Slim に行をコピーしろと命じます。基本的にどのような処理でもエスケープします。
|
114
122
|
パイプよりも深くインデントされた各行がコピーされます。
|
115
123
|
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
124
|
+
~~~ slim
|
125
|
+
body
|
126
|
+
p
|
127
|
+
|
|
128
|
+
これはテキストブロックのテストです。
|
129
|
+
~~~
|
120
130
|
|
121
131
|
構文解析結果は以下:
|
122
132
|
|
123
|
-
|
133
|
+
~~~ html
|
134
|
+
<body><p>これはテキストブロックのテストです。</p></body>
|
135
|
+
~~~
|
124
136
|
|
125
137
|
ブロックの左端はパイプ +1 スペースのインデントに設定されています。
|
126
138
|
追加のスペースはコピーされます。
|
127
139
|
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
140
|
+
~~~ slim
|
141
|
+
body
|
142
|
+
p
|
143
|
+
| この行は左端になります。
|
144
|
+
この行はスペース 1 つを持つことになります。
|
145
|
+
この行はスペース 2 つを持つことになります。
|
146
|
+
以下同様に...
|
147
|
+
~~~
|
134
148
|
|
135
149
|
テキスト行に HTML を埋め込むこともできます。
|
136
150
|
|
137
|
-
|
138
|
-
|
151
|
+
~~~ slim
|
152
|
+
- articles.each do |a|
|
153
|
+
| <tr><td>#{a.name}</td><td>#{a.description}</td></tr>
|
154
|
+
~~~
|
139
155
|
|
140
156
|
### テキスト行のスペースをたどる `'`
|
141
157
|
|
@@ -144,35 +160,42 @@ Slim テンプレートがどのようなものか簡単な例を示します:
|
|
144
160
|
### インライン html `<` (HTML 形式)
|
145
161
|
|
146
162
|
あなたは html タグを直接 Slim の中に書くことができます。Slim は閉じタグを使った html タグ形式や html と Slim を混ぜてテンプレートの中に書くことができます。
|
163
|
+
行頭が '<' の場合, 暗黙の `|` があるものとして動作します:
|
147
164
|
|
148
|
-
|
149
|
-
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
165
|
+
~~~ slim
|
166
|
+
<html>
|
167
|
+
head
|
168
|
+
title Example
|
169
|
+
<body>
|
170
|
+
- if articles.empty?
|
171
|
+
- else
|
172
|
+
table
|
173
|
+
- articles.each do |a|
|
174
|
+
<tr><td>#{a.name}</td><td>#{a.description}</td></tr>
|
175
|
+
</body>
|
176
|
+
</html>
|
177
|
+
~~~
|
159
178
|
|
160
179
|
### 制御コード `-`
|
161
180
|
|
162
181
|
ダッシュは制御コードを意味します。制御コードの例としてループと条件文があります。`end` は `-` の後ろに置くことができません。ブロックはインデントによってのみ定義されます。
|
163
182
|
複数行にわたる Ruby のコードが必要な場合, 行末にバックスラッシュ `\` を追加します。行末がカンマ `,` で終わる場合 (例 関数呼び出し) には行末にバックスラッシュを追加する必要はありません。
|
164
183
|
|
165
|
-
|
166
|
-
|
167
|
-
|
184
|
+
~~~ slim
|
185
|
+
body
|
186
|
+
- if articles.empty?
|
187
|
+
| 在庫なし
|
188
|
+
~~~
|
168
189
|
|
169
190
|
### 出力 `=`
|
170
191
|
|
171
192
|
イコールはバッファに追加する出力を生成する Ruby 呼び出しを Slim に命令します。Ruby のコードが複数行にわたる場合, 例のように行末にバックスラッシュを追加します。
|
172
193
|
|
173
|
-
|
174
|
-
|
175
|
-
|
194
|
+
~~~ slim
|
195
|
+
= javascript_include_tag \
|
196
|
+
"jquery",
|
197
|
+
"application"
|
198
|
+
~~~
|
176
199
|
|
177
200
|
行末がカンマ `,` で終わる場合 (例 関数呼び出し) には行末にバックスラッシュを追加する必要はありません。行末スペースを追加するために修飾子の `>` や `<` もサポートします。
|
178
201
|
|
@@ -190,15 +213,19 @@ Slim テンプレートがどのようなものか簡単な例を示します:
|
|
190
213
|
|
191
214
|
コードコメントにはスラッシュを使います。スラッシュ以降は最終的なレンダリング結果に表示されません。コードコメントには `/` を, html コメントには `/!` を使います。
|
192
215
|
|
193
|
-
|
194
|
-
|
195
|
-
|
196
|
-
|
197
|
-
|
216
|
+
~~~ slim
|
217
|
+
body
|
218
|
+
p
|
219
|
+
/ この行は表示されません。
|
220
|
+
この行も表示されません。
|
221
|
+
/! html コメントとして表示されます。
|
222
|
+
~~~
|
198
223
|
|
199
224
|
構文解析結果は以下:
|
200
225
|
|
201
|
-
|
226
|
+
~~~ html
|
227
|
+
<body><p><!--html コメントとして表示されます。--></p></body>
|
228
|
+
~~~
|
202
229
|
|
203
230
|
### HTML コメント `/!`
|
204
231
|
|
@@ -206,12 +233,16 @@ html コメントにはスラッシュの直後にエクスクラメーション
|
|
206
233
|
|
207
234
|
### IE コンディショナルコメント `/[...]`
|
208
235
|
|
209
|
-
|
210
|
-
|
236
|
+
~~~ slim
|
237
|
+
/[if IE]
|
238
|
+
p もっといいブラウザを使ってください。
|
239
|
+
~~~
|
211
240
|
|
212
241
|
レンダリング結果
|
213
242
|
|
214
|
-
|
243
|
+
~~~ html
|
244
|
+
<!--[if IE]><p>もっといいブラウザを使ってください。</p><![endif]-->
|
245
|
+
~~~
|
215
246
|
|
216
247
|
## HTML タグ
|
217
248
|
|
@@ -221,63 +252,71 @@ html コメントにはスラッシュの直後にエクスクラメーション
|
|
221
252
|
|
222
253
|
XML 宣言
|
223
254
|
|
224
|
-
|
225
|
-
|
255
|
+
~~~ slim
|
256
|
+
doctype xml
|
257
|
+
<?xml version="1.0" encoding="utf-8" ?>
|
226
258
|
|
227
|
-
|
228
|
-
|
259
|
+
doctype xml ISO-8859-1
|
260
|
+
<?xml version="1.0" encoding="iso-8859-1" ?>
|
261
|
+
~~~
|
229
262
|
|
230
263
|
XHTML ドキュメントタイプ
|
231
264
|
|
232
|
-
|
233
|
-
|
265
|
+
~~~ slim
|
266
|
+
doctype html
|
267
|
+
<!DOCTYPE html>
|
234
268
|
|
235
|
-
|
236
|
-
|
269
|
+
doctype 5
|
270
|
+
<!DOCTYPE html>
|
237
271
|
|
238
|
-
|
239
|
-
|
240
|
-
|
272
|
+
doctype 1.1
|
273
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
|
274
|
+
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
|
241
275
|
|
242
|
-
|
243
|
-
|
244
|
-
|
276
|
+
doctype strict
|
277
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
278
|
+
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
245
279
|
|
246
|
-
|
247
|
-
|
248
|
-
|
280
|
+
doctype frameset
|
281
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
|
282
|
+
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
|
249
283
|
|
250
|
-
|
251
|
-
|
252
|
-
|
284
|
+
doctype mobile
|
285
|
+
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN"
|
286
|
+
"http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">
|
253
287
|
|
254
|
-
|
255
|
-
|
256
|
-
|
288
|
+
doctype basic
|
289
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN"
|
290
|
+
"http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">
|
257
291
|
|
258
|
-
|
259
|
-
|
260
|
-
|
292
|
+
doctype transitional
|
293
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
294
|
+
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
295
|
+
~~~
|
261
296
|
|
262
297
|
HTML 4 ドキュメントタイプ
|
263
298
|
|
264
|
-
|
265
|
-
|
266
|
-
|
299
|
+
~~~ slim
|
300
|
+
doctype strict
|
301
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
|
302
|
+
"http://www.w3.org/TR/html4/strict.dtd">
|
267
303
|
|
268
|
-
|
269
|
-
|
270
|
-
|
304
|
+
doctype frameset
|
305
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
|
306
|
+
"http://www.w3.org/TR/html4/frameset.dtd">
|
271
307
|
|
272
|
-
|
273
|
-
|
274
|
-
|
308
|
+
doctype transitional
|
309
|
+
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
|
310
|
+
"http://www.w3.org/TR/html4/loose.dtd">
|
311
|
+
~~~
|
275
312
|
|
276
313
|
### 閉じタグ (末尾 `/`)
|
277
314
|
|
278
315
|
末尾に `/` を付けることで明示的にタグを閉じることができます。
|
279
316
|
|
280
|
-
|
317
|
+
~~~ slim
|
318
|
+
img src="image.png"/
|
319
|
+
~~~
|
281
320
|
|
282
321
|
(注) 標準的な html タグ (img, br, ...) は自動的にタグを閉じるので,
|
283
322
|
通常必要ありません。
|
@@ -286,63 +325,92 @@ HTML 4 ドキュメントタイプ
|
|
286
325
|
|
287
326
|
a タグの後に > を追加することで末尾にスペースを追加するよう Slim に強制することができます。
|
288
327
|
|
289
|
-
|
290
|
-
|
328
|
+
~~~ slim
|
329
|
+
a> href='url1' リンク1
|
330
|
+
a> href='url2' リンク2
|
331
|
+
~~~
|
291
332
|
|
292
333
|
< を追加することで先頭のスペースを追加できます。
|
293
334
|
|
294
|
-
|
295
|
-
|
335
|
+
~~~ slim
|
336
|
+
a< href='url1' リンク1
|
337
|
+
a< href='url2' リンク2
|
338
|
+
~~~
|
296
339
|
|
297
340
|
これらを組み合わせて使うこともできます。
|
298
341
|
|
299
|
-
|
342
|
+
~~~ slim
|
343
|
+
a<> href='url1' リンク1
|
344
|
+
~~~
|
300
345
|
|
301
346
|
### インラインタグ
|
302
347
|
|
303
348
|
時々タグをよりコンパクトにインラインにしたくなるかもしれません。
|
304
349
|
|
305
|
-
|
306
|
-
|
307
|
-
|
350
|
+
~~~ slim
|
351
|
+
ul
|
352
|
+
li.first: a href="/a" A リンク
|
353
|
+
li: a href="/b" B リンク
|
354
|
+
~~~
|
308
355
|
|
309
356
|
読みやすくするために, 属性を囲むことができるのを忘れないでください。
|
310
357
|
|
311
|
-
|
312
|
-
|
313
|
-
|
358
|
+
~~~ slim
|
359
|
+
ul
|
360
|
+
li.first: a[href="/a"] A リンク
|
361
|
+
li: a[href="/b"] B リンク
|
362
|
+
~~~
|
314
363
|
|
315
364
|
### テキストコンテンツ
|
316
365
|
|
317
366
|
タグと同じ行で開始するか
|
318
367
|
|
319
|
-
|
320
|
-
|
368
|
+
~~~ slim
|
369
|
+
body
|
370
|
+
h1 id="headline" 私のサイトへようこそ。
|
371
|
+
~~~
|
321
372
|
|
322
373
|
入れ子にするのかどちらかです。エスケープ処理を行うためにはパイプかバッククォートを使わなければなりません。
|
323
374
|
|
324
|
-
|
325
|
-
|
326
|
-
|
375
|
+
|
376
|
+
~~~ slim
|
377
|
+
body
|
378
|
+
h1 id="headline"
|
379
|
+
| 私のサイトへようこそ。
|
380
|
+
~~~
|
381
|
+
|
382
|
+
スマートテキストモードを有効化して利用する場合
|
383
|
+
|
384
|
+
~~~ slim
|
385
|
+
body
|
386
|
+
h1 id="headline"
|
387
|
+
私のサイトへようこそ。
|
388
|
+
~~~
|
327
389
|
|
328
390
|
### 動的コンテンツ (`=` と `==`)
|
329
391
|
|
330
392
|
同じ行で呼び出すか
|
331
393
|
|
332
|
-
|
333
|
-
|
394
|
+
~~~ slim
|
395
|
+
body
|
396
|
+
h1 id="headline" = page_headline
|
397
|
+
~~~
|
334
398
|
|
335
399
|
入れ子にすることができます。
|
336
400
|
|
337
|
-
|
338
|
-
|
339
|
-
|
401
|
+
~~~ slim
|
402
|
+
body
|
403
|
+
h1 id="headline"
|
404
|
+
= page_headline
|
405
|
+
~~~
|
340
406
|
|
341
407
|
### 属性
|
342
408
|
|
343
409
|
タグの後に直接属性を書きます。属性のテキストにはダブルクォート `"` か シングルクォート `'` を使わなければなりません (引用符で囲まれた属性)。
|
344
410
|
|
345
|
-
|
411
|
+
~~~ slim
|
412
|
+
a href="http://slim-lang.com" title='Slim のホームページ' Slim のホームページへ
|
413
|
+
~~~
|
346
414
|
|
347
415
|
引用符で囲まれたテキストを属性として使えます。
|
348
416
|
|
@@ -350,56 +418,74 @@ a タグの後に > を追加することで末尾にスペースを追加する
|
|
350
418
|
|
351
419
|
区切り文字が構文を読みやすくするのであれば,
|
352
420
|
`{...}`, `(...)`, `[...]` が属性の囲みに使えます。
|
353
|
-
これらの記号は設定できます (`:
|
421
|
+
これらの記号は設定できます (`:attr_list_delims` オプション参照)。
|
354
422
|
|
355
|
-
|
356
|
-
|
357
|
-
|
423
|
+
~~~ slim
|
424
|
+
body
|
425
|
+
h1(id="logo") = page_logo
|
426
|
+
h2[id="tagline" class="small tagline"] = page_tagline
|
427
|
+
~~~
|
358
428
|
|
359
429
|
属性を囲んだ場合, 属性を複数行にわたって書くことができます:
|
360
430
|
|
361
|
-
|
362
|
-
|
431
|
+
~~~ slim
|
432
|
+
h2[id="tagline"
|
433
|
+
class="small tagline"] = page_tagline
|
434
|
+
~~~
|
363
435
|
|
364
436
|
属性の囲みや変数まわりにスペースを使うことができます:
|
365
437
|
|
366
|
-
|
367
|
-
|
438
|
+
~~~ slim
|
439
|
+
h1 id = "logo" = page_logo
|
440
|
+
h2 [ id = "tagline" ] = page_tagline
|
441
|
+
~~~
|
368
442
|
|
369
443
|
#### 引用符で囲まれた属性
|
370
444
|
|
371
445
|
例:
|
372
446
|
|
373
|
-
|
447
|
+
~~~ slim
|
448
|
+
a href="http://slim-lang.com" title='Slim のホームページ' Slim のホームページへ
|
449
|
+
~~~
|
374
450
|
|
375
451
|
引用符で囲まれたテキストを属性として使えます:
|
376
452
|
|
377
|
-
|
453
|
+
~~~ slim
|
454
|
+
a href="http://#{url}" #{url} へ
|
455
|
+
~~~
|
378
456
|
|
379
457
|
属性値はデフォルトでエスケープされます。属性のエスケープを無効にしたい場合 == を使います。
|
380
458
|
|
381
|
-
|
459
|
+
~~~ slim
|
460
|
+
a href=="&"
|
461
|
+
~~~
|
382
462
|
|
383
463
|
引用符で囲まれた属性をバックスラッシュ `\` で改行できます。
|
384
464
|
|
385
|
-
|
386
|
-
|
465
|
+
~~~ slim
|
466
|
+
a data-title="help" data-content="極めて長い長い長いヘルプテキストで\
|
467
|
+
1つずつ1つずつその後はまたやり直して繰り返し...."
|
468
|
+
~~~
|
387
469
|
|
388
470
|
#### Ruby コードを用いた属性
|
389
471
|
|
390
472
|
`=` の後に直接 Ruby コードを書きます。コードにスペースが含まれる場合,
|
391
473
|
`(...)` の括弧でコードを囲まなければなりません。ハッシュを `{...}` に, 配列を `[...]` に書くこともできます。
|
392
474
|
|
393
|
-
|
394
|
-
|
395
|
-
|
396
|
-
|
397
|
-
|
398
|
-
|
475
|
+
~~~ slim
|
476
|
+
body
|
477
|
+
table
|
478
|
+
- for user in users
|
479
|
+
td id="user_#{user.id}" class=user.role
|
480
|
+
a href=user_action(user, :edit) Edit #{user.name}
|
481
|
+
a href=(path_to_user user) = user.name
|
482
|
+
~~~
|
399
483
|
|
400
484
|
属性値はデフォルトでエスケープされます。属性のエスケープを無効にしたい場合 == を使います。
|
401
485
|
|
402
|
-
|
486
|
+
~~~ slim
|
487
|
+
a href==action_path(:start)
|
488
|
+
~~~
|
403
489
|
|
404
490
|
Ruby コードの属性は, コントロールセクションにあるようにバックスラッシュ `\` や `,` を用いて改行できます。
|
405
491
|
|
@@ -408,70 +494,92 @@ Ruby コードの属性は, コントロールセクションにあるように
|
|
408
494
|
属性値の `true`, `false` や `nil` は真偽値として
|
409
495
|
評価されます。属性を括弧で囲む場合, 属性値の指定を省略することができます。
|
410
496
|
|
411
|
-
|
412
|
-
|
413
|
-
|
497
|
+
~~~ slim
|
498
|
+
input type="text" disabled="disabled"
|
499
|
+
input type="text" disabled=true
|
500
|
+
input(type="text" disabled)
|
414
501
|
|
415
|
-
|
416
|
-
|
417
|
-
|
502
|
+
input type="text"
|
503
|
+
input type="text" disabled=false
|
504
|
+
input type="text" disabled=nil
|
505
|
+
~~~
|
418
506
|
|
419
507
|
#### 属性の結合
|
420
508
|
|
421
509
|
複数の属性が与えられた場合に属性をまとめるように設定することができます (`:merge_attrs` 参照)。デフォルト設定では
|
422
510
|
class 属性は空白区切りで結合されます。
|
423
511
|
|
424
|
-
|
512
|
+
~~~ slim
|
513
|
+
a.menu class="highlight" href="http://slim-lang.com/" Slim-lang.com
|
514
|
+
~~~
|
425
515
|
|
426
516
|
レンダリング結果
|
427
517
|
|
428
|
-
|
518
|
+
~~~ html
|
519
|
+
<a class="menu highlight" href="http://slim-lang.com/">Slim-lang.com</a>
|
520
|
+
~~~
|
429
521
|
|
430
522
|
また, `Array` や配列要素を属性値として区切り文字で結合し使うこともできます。
|
431
523
|
|
432
|
-
|
433
|
-
|
524
|
+
~~~ slim
|
525
|
+
a class=["menu","highlight"]
|
526
|
+
a class=:menu,:highlight
|
527
|
+
~~~
|
434
528
|
|
435
529
|
#### アスタリスク属性 `*`
|
436
530
|
|
437
531
|
アスタリスクによってハッシュを属性/値のペアとして使うことができます。
|
438
532
|
|
439
|
-
|
533
|
+
~~~ slim
|
534
|
+
.card*{'data-url'=>place_path(place), 'data-id'=>place.id} = place.name
|
535
|
+
~~~
|
440
536
|
|
441
537
|
レンダリング結果
|
442
538
|
|
443
|
-
|
539
|
+
~~~ html
|
540
|
+
<div class="card" data-id="1234" data-url="/place/1234">Slim の家</div>
|
541
|
+
~~~
|
444
542
|
|
445
543
|
次のようにハッシュを返すメソッドやインスタンス変数を使うこともできます"
|
446
544
|
|
447
|
-
|
448
|
-
|
545
|
+
~~~ slim
|
546
|
+
.card *method_which_returns_hash = place.name
|
547
|
+
.card *@hash_instance_variable = place.name
|
548
|
+
~~~
|
449
549
|
|
450
550
|
属性の結合 (Slim オプション `:merge_attrs` 参照) に対応するハッシュ属性には `Array` を与えることもできます。
|
451
551
|
|
452
|
-
|
552
|
+
~~~ slim
|
553
|
+
.first *{:class => [:second, :third]} テキスト
|
554
|
+
~~~
|
453
555
|
|
454
556
|
レンダリング結果
|
455
557
|
|
456
|
-
|
558
|
+
~~~ slim
|
559
|
+
div class="first second third"
|
560
|
+
~~~
|
457
561
|
|
458
562
|
#### 動的タグ `*`
|
459
563
|
|
460
564
|
アスタリスク属性を使用することで完全に動的なタグを作ることができます。:tag をキーにもつハッシュを返すメソッドを
|
461
565
|
作るだけです。
|
462
566
|
|
463
|
-
|
464
|
-
|
465
|
-
|
466
|
-
|
467
|
-
|
468
|
-
|
469
|
-
|
470
|
-
|
567
|
+
~~~ slim
|
568
|
+
ruby:
|
569
|
+
def a_unless_current
|
570
|
+
@page_current ? {:tag => 'span'} : {:tag => 'a', :href => 'http://slim-lang.com/'}
|
571
|
+
end
|
572
|
+
- @page_current = true
|
573
|
+
*a_unless_current リンク
|
574
|
+
- @page_current = false
|
575
|
+
*a_unless_current リンク
|
576
|
+
~~~
|
471
577
|
|
472
578
|
レンダリング結果
|
473
579
|
|
474
|
-
|
580
|
+
~~~ html
|
581
|
+
<span>リンク</span><a href="http://slim-lang.com/">リンク</a>
|
582
|
+
~~~
|
475
583
|
|
476
584
|
### ショートカット
|
477
585
|
|
@@ -479,15 +587,21 @@ Ruby コードの属性は, コントロールセクションにあるように
|
|
479
587
|
|
480
588
|
`:shortcut` オプションを設定することで独自のタグショートカットを定義できます。
|
481
589
|
|
482
|
-
|
590
|
+
~~~ ruby
|
591
|
+
Slim::Engine.set_default_options :shortcut => {'c' => {:tag => 'container'}, '#' => {:attr => 'id'}, '.' => {:attr => 'class'} }
|
592
|
+
~~~
|
483
593
|
|
484
594
|
Slim コードの中でこの様に使用できます。
|
485
595
|
|
486
|
-
|
596
|
+
~~~ slim
|
597
|
+
c.content テキスト
|
598
|
+
~~~
|
487
599
|
|
488
600
|
レンダリング結果
|
489
601
|
|
490
|
-
|
602
|
+
~~~ html
|
603
|
+
<container class="content">テキスト</container>
|
604
|
+
~~~
|
491
605
|
|
492
606
|
#### 属性のショートカット
|
493
607
|
|
@@ -495,65 +609,87 @@ Slim コードの中でこの様に使用できます。
|
|
495
609
|
|
496
610
|
例として `&` で作った type 属性付きの input 要素のショートカットを作成し追加します。
|
497
611
|
|
498
|
-
|
612
|
+
~~~ ruby
|
613
|
+
Slim::Engine.set_default_options :shortcut => {'&' => {:tag => 'input', :attr => 'type'}, '#' => {:attr => 'id'}, '.' => {:attr => 'class'}}
|
614
|
+
~~~
|
499
615
|
|
500
616
|
Slim コードの中でこの様に使用できます。
|
501
617
|
|
502
|
-
|
503
|
-
|
504
|
-
|
618
|
+
~~~ slim
|
619
|
+
&text name="user"
|
620
|
+
&password name="pw"
|
621
|
+
&submit
|
622
|
+
~~~
|
505
623
|
|
506
624
|
レンダリング結果
|
507
625
|
|
508
|
-
|
509
|
-
|
510
|
-
|
626
|
+
~~~ html
|
627
|
+
<input type="text" name="user" />
|
628
|
+
<input type="password" name="pw" />
|
629
|
+
<input type="submit" />
|
630
|
+
~~~
|
511
631
|
|
512
632
|
別の例として `@` で作った role 属性のショートカットを作成し追加します。
|
513
633
|
|
514
|
-
|
634
|
+
~~~ ruby
|
635
|
+
Slim::Engine.set_default_options :shortcut => {'@' => 'role', '#' => 'id', '.' => 'class'}
|
636
|
+
~~~
|
515
637
|
|
516
638
|
Slim コードの中でこの様に使用できます。
|
517
639
|
|
518
|
-
|
640
|
+
~~~ slim
|
641
|
+
.person@admin = person.name
|
642
|
+
~~~
|
519
643
|
|
520
644
|
レンダリング結果
|
521
645
|
|
522
|
-
|
646
|
+
~~~ html
|
647
|
+
<div class="person" role="admin">Daniel</div>
|
648
|
+
~~~
|
523
649
|
|
524
650
|
1つのショートカットを使って複数の属性を設定することもできます。
|
525
651
|
|
526
|
-
|
652
|
+
~~~ ruby
|
653
|
+
Slim::Engine.set_default_options :shortcut => {'@' => {:attr => %w(data-role role)}}
|
654
|
+
~~~
|
527
655
|
|
528
656
|
Slim の中で次のように使用し
|
529
657
|
|
530
|
-
|
658
|
+
~~~ slim
|
659
|
+
.person@admin = person.name
|
660
|
+
~~~
|
531
661
|
|
532
662
|
このようのレンダリングされます。
|
533
663
|
|
534
|
-
|
664
|
+
~~~ html
|
665
|
+
<div class="person" role="admin" data-role="admin">Daniel</div>
|
666
|
+
~~~
|
535
667
|
|
536
668
|
#### ID ショートカット `#` と class ショートカット `.`
|
537
669
|
|
538
|
-
|
670
|
+
`id` と `class` の属性を次のショートカットで指定できます。
|
539
671
|
|
540
|
-
|
541
|
-
|
542
|
-
|
543
|
-
|
544
|
-
|
545
|
-
|
546
|
-
|
672
|
+
~~~ slim
|
673
|
+
body
|
674
|
+
h1#headline
|
675
|
+
= page_headline
|
676
|
+
h2#tagline.small.tagline
|
677
|
+
= page_tagline
|
678
|
+
.content
|
679
|
+
= show_content
|
680
|
+
~~~
|
547
681
|
|
548
682
|
これは次に同じです
|
549
683
|
|
550
|
-
|
551
|
-
|
552
|
-
|
553
|
-
|
554
|
-
|
555
|
-
|
556
|
-
|
684
|
+
~~~ slim
|
685
|
+
body
|
686
|
+
h1 id="headline"
|
687
|
+
= page_headline
|
688
|
+
h2 id="tagline" class="small tagline"
|
689
|
+
= page_tagline
|
690
|
+
div class="content"
|
691
|
+
= show_content
|
692
|
+
~~~
|
557
693
|
|
558
694
|
## ヘルパ, キャプチャとインクルード
|
559
695
|
|
@@ -576,23 +712,76 @@ end
|
|
576
712
|
|
577
713
|
このインクルードされたコードのスコープは実行される Slim のテンプレートコードです。Slim テンプレートの中では次のように使用することができます。
|
578
714
|
|
579
|
-
|
580
|
-
|
581
|
-
|
582
|
-
|
715
|
+
~~~ slim
|
716
|
+
p
|
717
|
+
= headline do
|
718
|
+
' Hello
|
719
|
+
= user.name
|
720
|
+
~~~
|
583
721
|
|
584
722
|
`do` ブロック内のコンテンツが自動的にキャプチャされ `yield` を通してヘルパに渡されます。糖衣構文として
|
585
723
|
`do` キーワードを省略して書くこともできます。
|
586
724
|
|
587
|
-
|
588
|
-
|
589
|
-
|
590
|
-
|
725
|
+
~~~ slim
|
726
|
+
p
|
727
|
+
= headline
|
728
|
+
' Hello
|
729
|
+
= user.name
|
730
|
+
~~~
|
731
|
+
|
732
|
+
### ローカル変数のキャプチャ
|
591
733
|
|
592
|
-
|
593
|
-
簡単に独自のヘルパを書いて使用することができます。このインクルードは実行時に行われます。
|
734
|
+
次のように `Binding` を使ってローカル変数をキャプチャすることができます:
|
594
735
|
|
595
736
|
~~~ruby
|
737
|
+
module Helpers
|
738
|
+
def capture_to_local(var, &block)
|
739
|
+
set_var = block.binding.eval("lambda {|x| #{var} = x }")
|
740
|
+
# Rails では capture! を使います
|
741
|
+
# Slim をフレームワークなしで使う場合 (Tilt のみを使う場合),
|
742
|
+
# キャプチャブロックを取得するには yield が利用できます
|
743
|
+
set_var.call(defined?(::Rails) ? capture(&block) : yield)
|
744
|
+
end
|
745
|
+
end
|
746
|
+
~~~
|
747
|
+
|
748
|
+
このヘルパは次のように使用できます
|
749
|
+
|
750
|
+
~~~ slim
|
751
|
+
/ captured_content 変数は Binding 前に定義されていなければいけません。
|
752
|
+
= capture_to_local captured_content=:captured_content
|
753
|
+
p この段落は captured_content 変数にキャプチャされます
|
754
|
+
= captured_content
|
755
|
+
~~~
|
756
|
+
|
757
|
+
Another interesting use case is to use an enumerable and capture for each element. The helper could look like this
|
758
|
+
|
759
|
+
~~~ ruby
|
760
|
+
module Capture
|
761
|
+
def capture(var, enumerable = nil, &block)
|
762
|
+
value = enumerable ? enumerable.map(&block) : yield
|
763
|
+
block.binding.eval("lambda {|x| #{var} = x }").call(value)
|
764
|
+
nil
|
765
|
+
end
|
766
|
+
end
|
767
|
+
~~~
|
768
|
+
|
769
|
+
and it would be used as follows
|
770
|
+
|
771
|
+
~~~ slim
|
772
|
+
- links = { 'http://slim-lang.com' => 'The Slim Template Language' }
|
773
|
+
= capture link_list=:link_list, links do |url, text|
|
774
|
+
a href=url = text
|
775
|
+
~~~
|
776
|
+
|
777
|
+
Afterwards, `link_list` contains the captured content.
|
778
|
+
|
779
|
+
### インクルードヘルパ
|
780
|
+
|
781
|
+
コンパイル時にインクルード機能を使いたい場合には, [パーシャルのインクルード](doc/jp/include.md) を見てください。
|
782
|
+
実行時にサブテンプレートを実行すること ( Rails の `#render` のように) もできます。インクルードヘルパを自分で用意する必要があります:
|
783
|
+
|
784
|
+
~~~ ruby
|
596
785
|
module Helpers
|
597
786
|
def include_slim(name, options = {}, &block)
|
598
787
|
Slim::Template.new("#{name}.slim", options).render(self, &block)
|
@@ -602,8 +791,10 @@ end
|
|
602
791
|
|
603
792
|
このヘルパは次のように使用できます
|
604
793
|
|
605
|
-
|
606
|
-
|
794
|
+
~~~ slim
|
795
|
+
nav= include_slim 'menu'
|
796
|
+
section= include_slim 'content'
|
797
|
+
~~~
|
607
798
|
|
608
799
|
しかし, このヘルパはキャッシュを行いません。その為, 目的にあったよりインテリジェントなバージョンを
|
609
800
|
実装する必要があります。また, ほとんどのフレームワークにはすでに同様のヘルパが含まれるので注意してください。(例: Rails の `render` メソッド)
|
@@ -612,14 +803,18 @@ end
|
|
612
803
|
|
613
804
|
Ruby の標準的な展開方法を使用します。テキストはデフォルトで html エスケープされます。
|
614
805
|
|
615
|
-
|
616
|
-
|
617
|
-
|
806
|
+
~~~ slim
|
807
|
+
body
|
808
|
+
h1 ようこそ #{current_user.name} ショーへ。
|
809
|
+
| エスケープしない #{{content}} こともできます。
|
810
|
+
~~~
|
618
811
|
|
619
812
|
展開したテキストのエスケープ方法 (言い換えればそのままのレンダリング)
|
620
813
|
|
621
|
-
|
622
|
-
|
814
|
+
~~~ slim
|
815
|
+
body
|
816
|
+
h1 ようこそ \#{current_user.name} ショーへ。
|
817
|
+
~~~
|
623
818
|
|
624
819
|
## 埋め込みエンジン (Markdown, ...)
|
625
820
|
|
@@ -627,6 +822,7 @@ Ruby の標準的な展開方法を使用します。テキストはデフォル
|
|
627
822
|
|
628
823
|
例:
|
629
824
|
|
825
|
+
~~~ slim
|
630
826
|
coffee:
|
631
827
|
square = (x) -> x * x
|
632
828
|
|
@@ -635,6 +831,9 @@ Ruby の標準的な展開方法を使用します。テキストはデフォル
|
|
635
831
|
#{"Markdown"} からこんにちわ!
|
636
832
|
2行目!
|
637
833
|
|
834
|
+
p: markdown: Tag with **inline** markdown!
|
835
|
+
~~~
|
836
|
+
|
638
837
|
対応エンジン:
|
639
838
|
|
640
839
|
| フィルタ | 必要な gems | 種類 | 説明 |
|
@@ -659,7 +858,9 @@ Ruby の標準的な展開方法を使用します。テキストはデフォル
|
|
659
858
|
|
660
859
|
埋め込みエンジンは Slim の `Slim::Embedded` フィルタのオプションで直接設定されます。例:
|
661
860
|
|
662
|
-
|
861
|
+
~~~ ruby
|
862
|
+
Slim::Embedded.default_options[:markdown] = {:auto_ids => false}
|
863
|
+
~~~
|
663
864
|
|
664
865
|
## Slim の設定
|
665
866
|
|
@@ -668,48 +869,59 @@ Slim を設定する方法はコンパイル機構に少し依存します。(Ra
|
|
668
869
|
|
669
870
|
### デフォルトオプション
|
670
871
|
|
671
|
-
|
672
|
-
|
872
|
+
~~~ ruby
|
873
|
+
# デバック用に html をきれいにインデントし属性をソートしない (Ruby 1.8)
|
874
|
+
Slim::Engine.set_default_options :pretty => true. :sort_attrs => false
|
673
875
|
|
674
|
-
|
675
|
-
|
876
|
+
# デバック用に html をきれいにインデントし属性をソートしない (Ruby 1.9)
|
877
|
+
Slim::Engine.set_default_options pretty: true, sort_attrs: false
|
878
|
+
~~~
|
676
879
|
|
677
880
|
ハッシュで直接オプションにアクセスすることもできます:
|
678
881
|
|
679
|
-
|
882
|
+
~~~ ruby
|
883
|
+
Slim::Engine.default_options[:pretty] = true
|
884
|
+
~~~
|
680
885
|
|
681
886
|
### 実行時のオプション設定
|
682
887
|
|
683
888
|
実行時のオプション設定の方法は2つあります。Tilt テンプレート (`Slim::Template`) の場合, テンプレートを
|
684
889
|
インスタンス化する時にオプションを設定できます。
|
685
890
|
|
686
|
-
|
891
|
+
~~~ ruby
|
892
|
+
Slim::Template.new('template.slim', optional_option_hash).render(scope)
|
893
|
+
~~~
|
687
894
|
|
688
895
|
他の方法は Rails に主に関係がありますがスレッド毎にオプション設定を行う方法です:
|
689
896
|
|
690
|
-
|
691
|
-
|
692
|
-
|
693
|
-
|
694
|
-
|
897
|
+
~~~ slim
|
898
|
+
Slim::Engine.with_options(option_hash) do
|
899
|
+
# ここで作成される Slim エンジンは option_hash を使用します
|
900
|
+
# Rails での使用例:
|
901
|
+
render :page, :layout => true
|
902
|
+
end
|
903
|
+
~~~
|
695
904
|
|
696
905
|
Rails ではコンパイルされたテンプレートエンジンのコードとオプションはテンプレート毎にキャッシュされ, 後でオプションを変更できないことに注意する必要があります。
|
697
906
|
|
698
|
-
|
699
|
-
|
700
|
-
|
701
|
-
|
907
|
+
~~~ slim
|
908
|
+
# 最初のレンダリング呼び出し
|
909
|
+
Slim::Engine.with_options(:pretty => true) do
|
910
|
+
render :page, :layout => true
|
911
|
+
end
|
702
912
|
|
703
|
-
|
704
|
-
|
705
|
-
|
706
|
-
|
913
|
+
# 2回目のレンダリング呼び出し
|
914
|
+
Slim::Engine.with_options(:pretty => false) do
|
915
|
+
render :page, :layout => true # :pretty is still true because it is cached
|
916
|
+
end
|
917
|
+
~~~
|
707
918
|
|
708
919
|
### 可能なオプション
|
709
920
|
|
710
921
|
次のオプションが `Slim::Engine` によって用意され `Slim::Engine.set_default_options` で設定することができます。
|
711
922
|
沢山ありますが良いことに, Slim はもし誤った設定キーを使用しようとした場合キーをチェックしエラーを報告します。
|
712
923
|
|
924
|
+
|
713
925
|
| 種類 | 名前 | デフォルト | 用途 |
|
714
926
|
| ---- | ---- | ---------- | ---- |
|
715
927
|
| 文字列 | :file | nil | 解析対象のファイル名ですが, Slim::Template によって自動的に設定されます |
|
@@ -717,7 +929,8 @@ Rails ではコンパイルされたテンプレートエンジンのコード
|
|
717
929
|
| 文字列 | :encoding | "utf-8" | テンプレートのエンコーディングを設定 |
|
718
930
|
| 文字列 | :default_tag | "div" | タグ名が省略されている場合デフォルトのタグとして使用される |
|
719
931
|
| ハッシュ | :shortcut | \{'.' => {:attr => 'class'}, '#' => {:attr => 'id'}} | 属性のショートカット |
|
720
|
-
|
|
932
|
+
| ハッシュ | :code_attr_delims | \{'(' => ')', '[' => ']', '{' => '}'} | Ruby コードの属性区切り文字 |
|
933
|
+
| ハッシュ | :attr_list_delims | \{'(' => ')', '[' => ']', '{' => '}'} | 属性リスト区切り文字 |
|
721
934
|
| 配列<シンボル,文字列> | :enable_engines | nil <i>(すべて可)</i> | 有効な埋め込みエンジンリスト (ホワイトリスト) |
|
722
935
|
| 配列<シンボル,文字列> | :disable_engines | nil <i>(無効なし)</i> | 無効な埋め込みエンジンリスト (ブラックリスト) |
|
723
936
|
| 真偽値 | :disable_capture | false (Rails では true) | ブロック内キャプチャ無効 (ブロックはデフォルトのバッファに書き込む) |
|
@@ -735,6 +948,7 @@ Rails ではコンパイルされたテンプレートエンジンのコード
|
|
735
948
|
| Class | :generator | Temple::Generators::ArrayBuffer/ RailsOutputBuffer | Temple コードジェネレータ (デフォルトのジェネレータは配列バッファを生成します) |
|
736
949
|
| 文字列 | :buffer | '_buf' (Rails では '@output_buffer') | バッファに使用される変数 |
|
737
950
|
|
951
|
+
|
738
952
|
Temple フィルタによってもっと多くのオプションがサポートされていますが一覧には載せず公式にはサポートしません。
|
739
953
|
Slim と Temple のコードを確認しなければなりません。
|
740
954
|
|
@@ -751,15 +965,19 @@ Slim や Temple のアーキテクチャについてよく知っている開発
|
|
751
965
|
|
752
966
|
`Temple::Engine` のようにスーパークラスのオプションを設定することも可能です。しかしこれはすべての Temple テンプレートエンジンに影響します。
|
753
967
|
|
754
|
-
|
755
|
-
|
968
|
+
~~~ ruby
|
969
|
+
Slim::Engine < Temple::Engine
|
970
|
+
Slim::Compiler < Temple::Filter
|
971
|
+
~~~
|
756
972
|
|
757
973
|
## プラグイン
|
758
974
|
|
759
|
-
Slim はロジックレスモードと I18n
|
975
|
+
Slim はロジックレスモードと I18n, インクルードプラグインを提供しています。プラグインのドキュメントを確認してください。
|
760
976
|
|
761
|
-
* [ロジックレスモード](doc/logic_less.md)
|
762
|
-
* [
|
977
|
+
* [ロジックレスモード](doc/jp/logic_less.md)
|
978
|
+
* [パーシャルのインクルード](doc/jp/include.md)
|
979
|
+
* [多言語化/I18n](doc/jp/translator.md)
|
980
|
+
* [スマートテキストモード](doc/jp/smart.md)
|
763
981
|
|
764
982
|
## フレームワークサポート
|
765
983
|
|
@@ -767,16 +985,19 @@ Slim はロジックレスモードと I18n プラグインを提供していま
|
|
767
985
|
|
768
986
|
Slim は生成されたコードをコンパイルするために [Tilt](https://github.com/rtomayko/tilt) を使用します。Slim テンプレートを直接使いたい場合, Tilt インターフェイスが使用できます。
|
769
987
|
|
770
|
-
|
771
|
-
|
772
|
-
|
988
|
+
~~~ ruby
|
989
|
+
Tilt.new['template.slim'].render(scope)
|
990
|
+
Slim::Template.new('template.slim', optional_option_hash).render(scope)
|
991
|
+
Slim::Template.new(optional_option_hash) { source }.render(scope)
|
992
|
+
~~~
|
773
993
|
|
774
994
|
optional_option_hash は前述のオプションを持つことができます。このオブジェクトのスコープは実行されるテンプレートの
|
775
995
|
コードです。
|
776
996
|
|
777
997
|
### Sinatra
|
778
998
|
|
779
|
-
|
999
|
+
~~~ ruby
|
1000
|
+
require 'sinatra'
|
780
1001
|
require 'slim'
|
781
1002
|
|
782
1003
|
get('/') { slim :index }
|
@@ -789,7 +1010,7 @@ html
|
|
789
1010
|
title Slim で Sinatra
|
790
1011
|
body
|
791
1012
|
h1 Slim は楽しい!
|
792
|
-
|
1013
|
+
~~~
|
793
1014
|
|
794
1015
|
### Rails
|
795
1016
|
|
@@ -814,11 +1035,12 @@ Usage: slimrb [options]
|
|
814
1035
|
--trace Show a full traceback on error
|
815
1036
|
-c, --compile Compile only but do not run
|
816
1037
|
-e, --erb Convert to ERB
|
817
|
-
|
1038
|
+
--rails Generate rails compatible code (Implies --compile)
|
1039
|
+
-r library Load library or plugin with -r slim/plugin
|
818
1040
|
-t, --translator Enable translator plugin
|
819
1041
|
-l, --logic-less Enable logic less plugin
|
820
1042
|
-p, --pretty Produce pretty html
|
821
|
-
-o, --option
|
1043
|
+
-o, --option name=code Set slim option
|
822
1044
|
-h, --help Show this message
|
823
1045
|
-v, --version Print version
|
824
1046
|
</pre>
|
@@ -876,7 +1098,9 @@ markdown:
|
|
876
1098
|
ベンチマークは `rake bench` で実行します。時間が余計にかかりますが遅い解析ベンチマークを
|
877
1099
|
実行したい場合 `slow` オプションを追加できます。
|
878
1100
|
|
879
|
-
|
1101
|
+
~~~
|
1102
|
+
rake bench slow=1 iterations=1000
|
1103
|
+
~~~
|
880
1104
|
|
881
1105
|
私たちはコミット毎に Travis-CI でベンチマークをとっています。最新のベンチマーク結果はリンク先を確認: <http://travis-ci.org/slim-template/slim>
|
882
1106
|
|
@@ -893,14 +1117,16 @@ Slim はすべての主要な Ruby 実装で動作します:
|
|
893
1117
|
|
894
1118
|
* Ruby 1.8.7, 1.9.3 および 2.0.0
|
895
1119
|
* Ruby EE
|
896
|
-
* JRuby
|
1120
|
+
* JRuby 1.9 mode
|
897
1121
|
* Rubinius 2.0
|
898
1122
|
|
899
1123
|
## 貢献
|
900
1124
|
|
901
1125
|
Slim の改良を支援したい場合, Git で管理されているプロジェクトを clone してください。
|
902
1126
|
|
903
|
-
|
1127
|
+
~~~
|
1128
|
+
$ git clone git://github.com/slim-template/slim
|
1129
|
+
~~~
|
904
1130
|
|
905
1131
|
魔法をかけた後 pull request を送ってください。私たちは pull request が大好きです!
|
906
1132
|
|
@@ -957,6 +1183,8 @@ Slim は [MIT license](http://www.opensource.org/licenses/MIT) に基づいて
|
|
957
1183
|
|
958
1184
|
移植言語/同様の言語:
|
959
1185
|
|
1186
|
+
* [Sliq (Slim/Liquid integration)](https://github.com/slim-template/sliq)
|
1187
|
+
* [Slm (Slim port to Javascript)](https://github.com/slm-lang/slm)
|
960
1188
|
* [Coffee script plugin for Slim](https://github.com/yury/coffee-views)
|
961
1189
|
* [Clojure port of Slim](https://github.com/chaslemley/slim.clj)
|
962
1190
|
* [Hamlet.rb (Similar template language)](https://github.com/gregwebs/hamlet.rb)
|
@@ -966,3 +1194,4 @@ Slim は [MIT license](http://www.opensource.org/licenses/MIT) に基づいて
|
|
966
1194
|
* [Haml (Older engine which inspired Slim)](https://github.com/haml/haml)
|
967
1195
|
* [Jade (Similar engine for javascript)](https://github.com/visionmedia/jade)
|
968
1196
|
* [Sweet (Similar engine which also allows to write classes and functions)](https://github.com/joaomdmoura/sweet)
|
1197
|
+
* [Amber (Similar engine for Go)](https://github.com/eknkc/amber)
|