Kwartz Examples
This document shows you examples of Kwartz, especially in Ruby.
- Bordered Table 1
- Bordered Table 2
- Bordered Table 3
- HTML Form
- Breadcrumbs
- Calendar
- Thumbnail
- Page Layout
- Rails
Bordered Table 1
border1.html (presentation data):
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody>
<tr bgcolor="#FFCCCC" id="user_list">
<td id="name">Foo</td>
<td><a href="mailto:foo@email.com" id="email">foo@email.com</a></td>
</tr>
<tr bgcolor="#CCCCFF" id="dummy">
<td>Foo</td>
<td><a href="mailto:bar@emai.net">bar@email.net</a></td>
</tr>
</tbody>
</table>
</body>
</html>
border1.plogic (presentation logic):
#user_list {
attrs: "bgcolor" color; // set bgcolor attribute value
remove: "id"; // remove id attribute
plogic: {
i = 0;
foreach (user in user_list) {
i += 1;
color = i%2==0 ? '#CCCCFF' : '#FFCCCC';
@stag; // start tag
@cont; // content
@etag; // end tag
}
}
}
#name {
value: user['name']; // replace content by expression value
remove: "id"; // remove id attribute
}
#email {
value: user['email']; // replace content by expression value
remove: "id"; // remove id attribute
attrs: "href" 'mailto:' .+ user['email']; // set href attribute value
}
#dummy {
plogic: { } // remove an element
}
border1.rb (main program):
#!/usr/bin/ruby
## set user list
user_list = [
{ "name" => "sumire", "email" => "voilet@mail.com" },
{ "name" => "nana", "email" => "seven@mail.com" },
{ "name" => "momoko", "email" => "peach@mail.com" },
{ "name" => "kasumi", "email" => "mist@mail.com" },
]
## display view
require 'erb'
filename = 'border1.view'
str = File.open(filename) { |f| f.read } ## or File.read(filename)
trim_mode = 1
erb = ERB.new(str, $SAFE, trim_mode)
print erb.result(binding())
Compile and execution:
### compile % kwartz -l eruby -p border1.plogic border1.html > border1.view ### execution % ruby border1.rb > result.html
border1.view (output script for Ruby):
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody>
<% i = 0 %>
<% for user in user_list do %>
<% i += 1 %>
<% color = i % 2 == 0 ? "#CCCCFF" : "#FFCCCC" %>
<tr bgcolor="<%= color %>">
<td><%= user["name"] %></td>
<td><a href="mailto:<%= user["email"] %>"><%= user["email"] %></a></td>
</tr>
<% end %>
</tbody>
</table>
</body>
</html>
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody>
<tr bgcolor="#FFCCCC">
<td>sumire</td>
<td><a href="mailto:voilet@mail.com">voilet@mail.com</a></td>
</tr>
<tr bgcolor="#CCCCFF">
<td>nana</td>
<td><a href="mailto:seven@mail.com">seven@mail.com</a></td>
</tr>
<tr bgcolor="#FFCCCC">
<td>momoko</td>
<td><a href="mailto:peach@mail.com">peach@mail.com</a></td>
</tr>
<tr bgcolor="#CCCCFF">
<td>kasumi</td>
<td><a href="mailto:mist@mail.com">mist@mail.com</a></td>
</tr>
</tbody>
</table>
</body>
</html>
Bordered Table 2
border2.html (presentation data):
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody>
<tr bgcolor="#FFCCCC" id="mark:user_list">
<td id="value:name">Foo</td>
<td><a href="mailto:@{email}@" id="value:email">foo@mail.com</a></td>
</tr>
<tr bgcolor="#CCCCFF" id="dummy:d1">
<td>Bar</td>
<td><a href="bar@mail.net">bar@mail.net</a></td>
</tr>
</tbody>
</table>
</body>
</html>
border2.plogic (presentation logic):
#user_list { // id attribute is removed automatically
attrs: "bgcolor" color; // set bgcolor attribute value
plogic: {
i = 0;
foreach (user in user_list) {
i += 1;
color = i%2==0 ? '#CCCCFF' : '#FFCCCC';
name = user['name'];
email = user['email'];
@stag; // start tag
@cont; // content
@etag; // end tag
}
}
}
border2.rb (main program):
#!/usr/bin/ruby
## set user list
user_list = [
{ "name" => "sumire", "email" => "voilet@mail.com" },
{ "name" => "nana", "email" => "seven@mail.com" },
{ "name" => "momoko", "email" => "peach@mail.com" },
{ "name" => "kasumi", "email" => "mist@mail.com" },
]
## display view
require 'erb'
filename = 'border2.view'
str = File.open(filename) { |f| f.read } ## or File.read(filename)
trim_mode = 1
erb = ERB.new(str, $SAFE, trim_mode)
print erb.result(binding())
Compile and execution:
### compile % kwartz -l eruby -p border2.plogic border2.html > border2.view ### execution % ruby border2.rb > result.html
border2.view (output script for Ruby):
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody>
<% i = 0 %>
<% for user in user_list do %>
<% i += 1 %>
<% color = i % 2 == 0 ? "#CCCCFF" : "#FFCCCC" %>
<% name = user["name"] %>
<% email = user["email"] %>
<tr bgcolor="<%= color %>">
<td><%= name %></td>
<td><a href="mailto:<%= email %>"><%= email %></a></td>
</tr>
<% end %>
</tbody>
</table>
</body>
</html>
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody>
<tr bgcolor="#FFCCCC">
<td>sumire</td>
<td><a href="mailto:voilet@mail.com">voilet@mail.com</a></td>
</tr>
<tr bgcolor="#CCCCFF">
<td>nana</td>
<td><a href="mailto:seven@mail.com">seven@mail.com</a></td>
</tr>
<tr bgcolor="#FFCCCC">
<td>momoko</td>
<td><a href="mailto:peach@mail.com">peach@mail.com</a></td>
</tr>
<tr bgcolor="#CCCCFF">
<td>kasumi</td>
<td><a href="mailto:mist@mail.com">mist@mail.com</a></td>
</tr>
</tbody>
</table>
</body>
</html>
Bordered Table 3
border3.html (presentation data):
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody id="mark:user_list">
<tr bgcolor="#FFCCCC" id="mark:odd">
<td id="value:name">Foo</td>
<td><a href="mailto:@{email}@" id="value:email">foo@mail.com</a></td>
</tr>
<tr bgcolor="#CCCCFF" id="mark:even">
<td id="value:name">Bar</td>
<td><a href="mailto:@{email}@" id="value:email">bar@mail.net</a></td>
</tr>
</tbody>
</table>
</body>
</html>
border3.plogic (presentation logic):
#user_list {
plogic: {
@stag; // start tag
i = 0;
foreach (user in user_list) {
i += 1;
name = user['name'];
email = user['email'];
if (i % 2 == 0) {
@element(even); // element marked as id="mark:even"
} else {
@element(odd); // element marked as id="mark:odd"
}
}
@etag; // end tag
}
}
border3.rb (main program):
#!/usr/bin/ruby
## set user list
user_list = [
{ "name" => "sumire", "email" => "voilet@mail.com" },
{ "name" => "nana", "email" => "seven@mail.com" },
{ "name" => "momoko", "email" => "peach@mail.com" },
{ "name" => "kasumi", "email" => "mist@mail.com" },
]
## display view
require 'erb'
filename = 'border3.view'
str = File.open(filename) { |f| f.read } ## or File.read(filename)
trim_mode = 1
erb = ERB.new(str, $SAFE, trim_mode)
print erb.result(binding())
Compile and execution:
### compile % kwartz -l eruby -p border3.plogic border3.html > border3.view ### execution % ruby border3.rb > result.html
border3.view (output script for Ruby):
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody>
<% i = 0 %>
<% for user in user_list do %>
<% i += 1 %>
<% name = user["name"] %>
<% email = user["email"] %>
<% if i % 2 == 0 then %>
<tr bgcolor="#CCCCFF">
<td><%= name %></td>
<td><a href="mailto:<%= email %>"><%= email %></a></td>
</tr>
<% else %>
<tr bgcolor="#FFCCCC">
<td><%= name %></td>
<td><a href="mailto:<%= email %>"><%= email %></a></td>
</tr>
<% end %>
<% end %>
</tbody>
</table>
</body>
</html>
<html>
<body>
<table>
<thead>
<th>Name</th><th>E-Mail</th>
</thead>
<tbody>
<tr bgcolor="#FFCCCC">
<td>sumire</td>
<td><a href="mailto:voilet@mail.com">voilet@mail.com</a></td>
</tr>
<tr bgcolor="#CCCCFF">
<td>nana</td>
<td><a href="mailto:seven@mail.com">seven@mail.com</a></td>
</tr>
<tr bgcolor="#FFCCCC">
<td>momoko</td>
<td><a href="mailto:peach@mail.com">peach@mail.com</a></td>
</tr>
<tr bgcolor="#CCCCFF">
<td>kasumi</td>
<td><a href="mailto:mist@mail.com">mist@mail.com</a></td>
</tr>
</tbody>
</table>
</body>
</html>
HTML Form
register.html (presentation data):
<html>
<head>
<style type="text/css">
<!--
.label {
/* font-weight:bold; */
background-color:#CCFFCC;
text-align:right;
}
-->
</style>
</head>
<body>
<form action="register.rbx" method="POST">
<span id="if:error_list!=null">
<font color="#FF0000" id="foreach:error=error_list">
<span id="value:error">Name is empty.</span><br>
</font>
</span>
<span id="else:">
Enter your personal information:
</span>
<table border="0" cellspacing="1" cellpadding="5">
<tr>
<td class="label">Name:</td>
<td>
<input type="text" name="name" size="20" id="name" />
</td>
</tr>
<tr>
<td class="label">Gender:</td>
<td>
<input type="radio" name="gender" value="M" id="mark:gender_m" />Man
<input type="radio" name="gender" value="W" id="mark:gender_w" />Woman
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value=" Register ">
<input type="reset" value="reset">
</td>
</tr>
</table>
</form>
</body>
</html>
register.plogic (presentation logic):
#name {
attrs: "value" name;
}
#gender_m {
//append: gender == 'M' ? ' checked="checked"' : '';
append: C(gender=='M');
}
#gender_w {
//append: gender == 'W' ? ' checked="checked"' : '';
append: C(gender=='W');
}
finish.html (presentation data):
<html> <body> Registration has finished with the following data:<br> <br> Name: <span id="value:name">Foo</span><br> Gender: <span id="if:gender=='M'">Man</span> <span id="else:">Woman</span> </body> </html>
register.rbx (main program):
#!/usr/bin/ruby
## get parameters
require 'cgi'
cgi = CGI.new
name = cgi.params['name'].first
gender = cgi.params['gender'].first
## check parameters
view_name = 'register.view'
error_list = nil
if cgi.params.length > 0
## check input data
error_list = []
unless name && !name.empty?
error_list << 'Name is empty.'
end
unless gender == 'M' || gender == 'W'
error_list << 'Gender is not selected.'
end
## if input parameter is valid then print the finished page.
## else print the registration page.
if error_list.empty?
error_list = nil
view_name = 'finish.view'
end
end
## print web page
require 'erb'
str = File.open(view_name) { |f| f.read }
str.untaint()
trim_mode = 1
print cgi.header
print ERB.new(str, $SAFE, trim_mode).result(binding())
Compile and execution:
### compile % kwartz -l eruby -e -p register.plogic register.html > register.view % kwartz -l eruby -e finish.html > finish.view ### execution % ruby form1.rb > result.html
register.view (output script for Ruby):
<html>
<head>
<style type="text/css">
<!--
.label {
/* font-weight:bold; */
background-color:#CCFFCC;
text-align:right;
}
-->
</style>
</head>
<body>
<form action="register.rbx" method="POST">
<% if error_list != nil then %>
<% for error in error_list do %>
<font color="#FF0000">
<%= CGI::escapeHTML((error).to_s) %><br>
</font>
<% end %>
<% else %>
Enter your personal information:
<% end %>
<table border="0" cellspacing="1" cellpadding="5">
<tr>
<td class="label">Name:</td>
<td>
<input type="text" name="name" size="20" id="name" value="<%= CGI::escapeHTML((name).to_s) %>" />
</td>
</tr>
<tr>
<td class="label">Gender:</td>
<td>
<input type="radio" name="gender" value="M"<%= gender == "M" ? " checked=\"checked\"" : "" %> />Man
<input type="radio" name="gender" value="W"<%= gender == "W" ? " checked=\"checked\"" : "" %> />Woman
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value=" Register ">
<input type="reset" value="reset">
</td>
</tr>
</table>
</form>
</body>
</html>
finish.view (output script for Ruby):
<html> <body> Registration has finished with the following data:<br> <br> Name: <%= CGI::escapeHTML((name).to_s) %><br> Gender: <% if gender == "M" then %> Man <% else %> Woman <% end %> </body> </html>
Breadcrumbs
breadcrumbs.html (presentation data):
<html>
<body>
<div id="breadcrumbs">
<a href="/" id="mark:crumb">Home</a>
<span id="mark:separator">></span>
<a href="/aaa/">AAA</a> <
<a href="/aaa/bbb/">BBB</a> &lgt;
<a href="/aaa/bbb/ccc">CCC</a> &lgt;
<span id="mark:title">Page Titlte</span>
</div>
</body>
</html>
breadcrumbs.plogic (presentation logic):
#breadcrumbs {
plogic: {
@stag;
foreach (crumb in breadcrumbs) {
@element(crumb); // print <a>...</a>
@element(separator); // print '>'
}
@element(title);
@etag;
}
}
#crumb {
value: crumb[:name];
attrs: "href" crumb[:path];
}
#title {
value: title;
}
breadcrumbs.rb (main program):
#!/usr/bin/ruby
## set breadcrumbs
breadcrumbs = [
{ :name => "HOME", :path => "/", },
{ :name => "Kwartz", :path => "/kwartz/", },
{ :name => "Examples", :path => "/kwartz/examples/", },
{ :name => "Breadcrumbs", :path => "/kwartz/examples/breadcrumbs/", },
]
## set title
title = 'Result';
## display view
require 'erb'
filename = 'breadcrumbs.view'
str = File.open(filename) { |f| f.read } ## or File.read(filename)
trim_mode = 2
ERB.new(str, $SAFE, trim_mode).run(binding())
Compile and execution:
### compile % kwartz -l eruby -p breadcrumbs.plogic breadcrumbs.html > breadcrumbs.view ### execution % ruby breadcrumbs.rb > result.html
breadcrumbs.view (output script for Ruby):
<html>
<body>
<div id="breadcrumbs">
<% for crumb in breadcrumbs do %>
<a href="<%= crumb[:path] %>"><%= crumb[:name] %></a>
>
<% end %>
<%= title %>
</div>
</body>
</html>
<html>
<body>
<div id="breadcrumbs">
<a href="/">HOME</a>
>
<a href="/kwartz/">Kwartz</a>
>
<a href="/kwartz/examples/">Examples</a>
>
<a href="/kwartz/examples/breadcrumbs/">Breadcrumbs</a>
>
Result
</div>
</body>
</html>
Calendar
calendar-month.html (presentation data):
<html id="mark:document">
<head>
<title>Calendar Month Template</title>
<style type="text/css">
<!--
.holiday {color:#FF0000;}
td {text-align:center;}
-->
</style>
</head>
<body>
<span id="mark:calendar_month">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of @{month}@, @{year}@">
<caption>
<em id="value:month">Jan</em> <em id="value:year">20XX</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr id="mark:week">
<td><span id="mark:day" class="holiday"> </span></td>
<td id="dummy:d1"> </td>
<td id="dummy:d2">1</td>
<td id="dummy:d3">2</td>
<td id="dummy:d4">3</td>
<td id="dummy:d5">4</td>
<td id="dummy:d6">5</td>
</tr>
<tr id="dummy:d7">
<td><span class="holiday">6</span></td>
<td>7</td><td>8</td><td>9</td>
<td>10</td><td>11</td><td>12</td>
</tr>
<tr id="dummy:d8">
<td><span class="holiday">13</span></td>
<td>14</td><td>15</td><td>16</td>
<td>17</td><td>18</td><td>19</td>
</tr>
<tr id="dummy:d9">
<td><span class="holiday">20</span></td>
<td>21</td><td>22</td><td>23</td>
<td>24</td><td>25</td><td>26</td>
</tr>
<tr id="dummy:d10">
<td><span class="holiday">27</span></td>
<td>28</td><td>29</td><td>30</td>
<td>31</td><td> </td><td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</span>
</body>
</html>
calendar-month.plogic (presentation logic):
#document {
// replace document element by calendar_month element
plogic: {
@element(calendar_month);
}
}
#calendar_month {
plogic: {
@cont; // remove start tag and end tag
}
}
#week {
plogic: {
day = ' ';
wday = 1;
while (wday < first_weekday) {
if (wday == 1) @stag;
@cont;
wday += 1;
}
day = 0;
wday -= 1;
while (day < num_days) {
day += 1;
wday = wday % 7 + 1;
if (wday == 1) @stag;
@cont;
if (wday == 7) @etag;
}
if (wday != 7) {
day = ' ';
while (wday != 6) {
@cont;
wday += 1;
}
@etag;
}
}
}
#day {
value: day;
plogic: {
if (wday == 1) {
@stag;
@cont;
@etag;
} else {
@cont;
}
}
}
calendar-page.html (presentation data):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Calendar&nbs; <span id="value:year">2004</span></title>
<style type="text/css">
<!--
.title {font-size:x-large; font-weight:bold;}
.holiday {color:#FF0000;}
td {text-align:center;}
-->
</style>
</head>
<body>
<div id="mark:navi" align="center">
<a href="@{prev_link}@"><<</a>
<span class="title">
Calendar <span id="value:year">2004</span>
</span>
<a href="@{next_link}@">>></a>
</div>
<br>
<div align="center">
<table border="0" summary="">
<tr id="mark:calendar_list">
<td id="mark:calendar" valign="top">
.... calendar here ...
</td>
</tr>
</table>
</div>
</body>
</html>
calendar-page.plogic (presentation logic):
#calendar_list {
plogic: {
calendar_ctr = 0;
foreach (calendar in calendar_list) {
calendar_ctr += 1;
if (calendar_ctr % column == 1) {
@stag;
}
@cont;
if (calendar_ctr % column == 0) {
@etag;
}
}
if (calendar_ctr % column != 0) {
calendar = '';
while (calendar_ctr % column != 0) {
@cont;
calendar_ctr += 1;
}
@etag;
}
}
}
#calendar {
value: calendar;
}
calendar.rbx (main program):
#!/usr/bin/ruby
require 'cgi'
require 'erb'
## set year
cgi = nil
if ENV['REQUEST_METHOD']
cgi = CGI.new
year = cgi.params['year'].first
if year && !year.empty?
year = year.to_i
else
year = Time.new.year
end
else
year = Time.new.year
end
## create erb
trim_mode = 1
str = File.open('calendar-month.view') { |f| f.read() }
str.untaint
erb_cal_month = ERB.new(str, $SAFE, trim_mode)
str = File.open('calendar-page.view') { |f| f.read() }
str.untaint
erb_cal_page = ERB.new(str, $SAFE, trim_mode)
## set calendar_list
calendar_list = []
(1..12).each do |i|
t = Time.local(year, i, 1)
month = t.strftime("%B")
next_month = i == 12 ? Time.local(year+1, 1, 1) : Time.local(year, i+1, 1)
last_day = next_month - 60*60*24
num_days = last_day.day
first_weekday = t.strftime("%w").to_i + 1
#puts "year=#{year}, month=#{month}, num_days=#{num_days}, first_weekday=#{first_weekday}"
calendar_list << erb_cal_month.result(binding())
end
#calendar_list.each do |s| print s end
## include main page, with $calendar_list[]
prev_link = "calendar.rbx?year=#{year-1}"
next_link = "calendar.rbx?year=#{year+1}"
column = 4
print cgi.header if cgi
print erb_cal_page.result(binding())
Compile and execution:
### compile % kwartz -l eruby -p calendar-month.plogic calendar-month.html > calendar-month.view % kwartz -l eruby -p calendar-page.plogic calendar-page.html > calendar-page.view ### execution % ruby calendar.rbx > result.html
calendar-month.view (output script for Ruby):
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of <%= month %>, <%= year %>">
<caption>
<em><%= month %></em> <em><%= year %></em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<% day = " " %>
<% wday = 1 %>
<% while wday < first_weekday do %>
<% if wday == 1 then %>
<tr>
<% end %>
<td><% if wday == 1 then %>
<span class="holiday"><%= day %></span><% else %>
<%= day %><% end %>
</td>
<% wday += 1 %>
<% end %>
<% day = 0 %>
<% wday -= 1 %>
<% while day < num_days do %>
<% day += 1 %>
<% wday = wday % 7 + 1 %>
<% if wday == 1 then %>
<tr>
<% end %>
<td><% if wday == 1 then %>
<span class="holiday"><%= day %></span><% else %>
<%= day %><% end %>
</td>
<% if wday == 7 then %>
</tr>
<% end %>
<% end %>
<% if wday != 7 then %>
<% day = " " %>
<% while wday != 6 do %>
<td><% if wday == 1 then %>
<span class="holiday"><%= day %></span><% else %>
<%= day %><% end %>
</td>
<% wday += 1 %>
<% end %>
</tr>
<% end %>
</tbody>
</table>
<!-- /calendar-month -->
calendar-page.view (output script for Ruby):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Calendar&nbs; <%= year %></title>
<style type="text/css">
<!--
.title {font-size:x-large; font-weight:bold;}
.holiday {color:#FF0000;}
td {text-align:center;}
-->
</style>
</head>
<body>
<div align="center">
<a href="<%= prev_link %>"><<</a>
<span class="title">
Calendar <%= year %>
</span>
<a href="<%= next_link %>">>></a>
</div>
<br>
<div align="center">
<table border="0" summary="">
<% calendar_ctr = 0 %>
<% for calendar in calendar_list do %>
<% calendar_ctr += 1 %>
<% if calendar_ctr % column == 1 then %>
<tr>
<% end %>
<td valign="top">
<%= calendar %> </td>
<% if calendar_ctr % column == 0 then %>
</tr>
<% end %>
<% end %>
<% if calendar_ctr % column != 0 then %>
<% calendar = "" %>
<% while calendar_ctr % column != 0 do %>
<td valign="top">
<%= calendar %> </td>
<% calendar_ctr += 1 %>
<% end %>
</tr>
<% end %>
</table>
</div>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Calendar&nbs; 2005</title>
<style type="text/css">
<!--
.title {font-size:x-large; font-weight:bold;}
.holiday {color:#FF0000;}
td {text-align:center;}
-->
</style>
</head>
<body>
<div align="center">
<a href="calendar.rbx?year=2004"><<</a>
<span class="title">
Calendar 2005 </span>
<a href="calendar.rbx?year=2006">>></a>
</div>
<br>
<div align="center">
<table border="0" summary="">
<tr>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of January, 2005">
<caption>
<em>January</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>1</td>
</tr>
<tr>
<td><span class="holiday">2</span></td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
</tr>
<tr>
<td><span class="holiday">9</span></td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
</tr>
<tr>
<td><span class="holiday">16</span></td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
<td>22</td>
</tr>
<tr>
<td><span class="holiday">23</span></td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
</tr>
<tr>
<td><span class="holiday">30</span></td>
<td>31</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of February, 2005">
<caption>
<em>February</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td><span class="holiday">6</span></td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td><span class="holiday">13</span></td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
</tr>
<tr>
<td><span class="holiday">20</span></td>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
</tr>
<tr>
<td><span class="holiday">27</span></td>
<td>28</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of March, 2005">
<caption>
<em>March</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td><span class="holiday">6</span></td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td><span class="holiday">13</span></td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
</tr>
<tr>
<td><span class="holiday">20</span></td>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
</tr>
<tr>
<td><span class="holiday">27</span></td>
<td>28</td>
<td>29</td>
<td>30</td>
<td>31</td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of April, 2005">
<caption>
<em>April</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td><span class="holiday">3</span></td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
<tr>
<td><span class="holiday">10</span></td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
</tr>
<tr>
<td><span class="holiday">17</span></td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
<td>22</td>
<td>23</td>
</tr>
<tr>
<td><span class="holiday">24</span></td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
<td>30</td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
</tr>
<tr>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of May, 2005">
<caption>
<em>May</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday">1</span></td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
<tr>
<td><span class="holiday">8</span></td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr>
<td><span class="holiday">15</span></td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
</tr>
<tr>
<td><span class="holiday">22</span></td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
<tr>
<td><span class="holiday">29</span></td>
<td>30</td>
<td>31</td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of June, 2005">
<caption>
<em>June</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td> </td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr>
<td><span class="holiday">5</span></td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
</tr>
<tr>
<td><span class="holiday">12</span></td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
</tr>
<tr>
<td><span class="holiday">19</span></td>
<td>20</td>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
</tr>
<tr>
<td><span class="holiday">26</span></td>
<td>27</td>
<td>28</td>
<td>29</td>
<td>30</td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of July, 2005">
<caption>
<em>July</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td><span class="holiday">3</span></td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
<tr>
<td><span class="holiday">10</span></td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
</tr>
<tr>
<td><span class="holiday">17</span></td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
<td>22</td>
<td>23</td>
</tr>
<tr>
<td><span class="holiday">24</span></td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
<td>30</td>
</tr>
<tr>
<td><span class="holiday">31</span></td>
<td><span class="holiday"> </span></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of August, 2005">
<caption>
<em>August</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td><span class="holiday">7</span></td>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
</tr>
<tr>
<td><span class="holiday">14</span></td>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
</tr>
<tr>
<td><span class="holiday">21</span></td>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
</tr>
<tr>
<td><span class="holiday">28</span></td>
<td>29</td>
<td>30</td>
<td>31</td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
</tr>
<tr>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of September, 2005">
<caption>
<em>September</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td> </td>
<td> </td>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td><span class="holiday">4</span></td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
</tr>
<tr>
<td><span class="holiday">11</span></td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
</tr>
<tr>
<td><span class="holiday">18</span></td>
<td>19</td>
<td>20</td>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
</tr>
<tr>
<td><span class="holiday">25</span></td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
<td>30</td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of October, 2005">
<caption>
<em>October</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td>1</td>
</tr>
<tr>
<td><span class="holiday">2</span></td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
</tr>
<tr>
<td><span class="holiday">9</span></td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
</tr>
<tr>
<td><span class="holiday">16</span></td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
<td>22</td>
</tr>
<tr>
<td><span class="holiday">23</span></td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
</tr>
<tr>
<td><span class="holiday">30</span></td>
<td>31</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of November, 2005">
<caption>
<em>November</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td><span class="holiday">6</span></td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
</tr>
<tr>
<td><span class="holiday">13</span></td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
</tr>
<tr>
<td><span class="holiday">20</span></td>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
</tr>
<tr>
<td><span class="holiday">27</span></td>
<td>28</td>
<td>29</td>
<td>30</td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
<td valign="top">
<!-- calendar-month -->
<table cellpadding="2" summary="calendar of December, 2005">
<caption>
<em>December</em> <em>2005</em>
</caption>
<thead>
<tr bgcolor="#CCCCCC">
<th><span class="holiday">S</span></th>
<th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th>
</tr>
</thead>
<tbody>
<tr>
<td><span class="holiday"> </span></td>
<td> </td>
<td> </td>
<td> </td>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td><span class="holiday">4</span></td>
<td>5</td>
<td>6</td>
<td>7</td>
<td>8</td>
<td>9</td>
<td>10</td>
</tr>
<tr>
<td><span class="holiday">11</span></td>
<td>12</td>
<td>13</td>
<td>14</td>
<td>15</td>
<td>16</td>
<td>17</td>
</tr>
<tr>
<td><span class="holiday">18</span></td>
<td>19</td>
<td>20</td>
<td>21</td>
<td>22</td>
<td>23</td>
<td>24</td>
</tr>
<tr>
<td><span class="holiday">25</span></td>
<td>26</td>
<td>27</td>
<td>28</td>
<td>29</td>
<td>30</td>
<td>31</td>
</tr>
</tbody>
</table>
<!-- /calendar-month -->
</td>
</tr>
</table>
</div>
</body>
</html>
Thumbnail
thumbnail.html (presentation data):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO8859-1">
<title>Kwartz - a template system for Ruby, PHP and Java (brief overview)</title>
</head>
<body style="background-color:#FFFFFF">
<div align="center" id="mark:navi">
<a id="mark:navi_first" href="...">|<< First</a>
<a id="mark:navi_prev" href="...">< Prev</a>
<a id="mark:navi_index" href="...">Index</a>
<a id="mark:navi_next" href="..."><strong>Next ></strong></a>
<a id="mark:navi_last" href="...">Last >>|</a>
</div>
<div id="mark:index">
<a id="mark:thumbnail_link" href="..."><!--
--><img width="200" height="150" src="dummy1.png" id="mark:thumbnail_image" ></a>
<a href="dummy2.png"><!--
--><img width="200" height="150" src="dummy2.png"></a>
<a href="dummy3.png"><!--
--><img width="200" height="150" src="dummy3.png"></a>
<br id="mark:br">
</div>
<div id="main_image" align="center">
<br>
<table border="1">
<tr>
<td>
<img src="dummy0.png" alt="presentaion image" id="mark:page_image" >
</td>
</tr>
</table>
<br>
</div>
<div id="mark:navi2">
|<< Fist < Pref List
<strong>Next</strong> > Last >>|
</div>
</body>
</html>
thumbnail.plogic (presentation logic):
#navi {
plogic: {
if (page > 0) { // remove element when page is 0
@stag;
@cont;
@etag;
}
}
}
#navi_first {
attrs: "href" first_url;
plogic: {
if (first_url != empty) {
@stag;
@cont;
@etag;
} else {
@cont; // remove start tag and end tag
}
}
}
#navi_last {
attr: "href" last_url;
plogic: {
if (last_url != empty) {
@stag;
@cont;
@etag;
} else {
@cont; // remove start tag and end tag
}
}
}
#navi_prev {
attr: "href" prev_url;
plogic: {
if (prev_url != empty) {
@stag;
@cont;
@etag;
} else {
@cont; // remove start tag and end tag
}
}
}
#navi_next {
attr: "href" next_url;
plogic: {
if (next_url != empty) {
@stag;
@cont;
@etag;
} else {
@cont; // remove start tag and end tag
}
}
}
#navi_index {
attr: "href" index_url;
plogic: {
if (index_url != empty) {
@stag;
@cont;
@etag;
} else {
@cont; // remove start tag and end tag
}
}
}
#index {
plogic: {
@stag;
if (page == 0) {
i = 0;
foreach (thumb in thumb_list) {
i += 1;
link_url = thumb[:link_url];
image_url = thumb[:image_url];
@element(thumbnail_link);
if (i % 3 == 0) {
@element(br);
}
}
}
@etag;
}
}
#thumbnail_link {
attr: "href" link_url;
}
#thumbnail_image {
attr: "src" image_url;
}
#main_image {
plogic: {
if (page != 0) { // remove element when page is 0
@stag;
@cont;
@etag;
}
}
}
#page_image {
attr: "src" image_url;
}
#navi2 {
plogic: {
@element(navi);
}
}
thumbnail.rbx (main program):
#!/usr/bin/ruby
## set url format of images
base_url = "http://www.kuwata-lab.com/kwartz/overview/img";
image_url_format = "#{base_url}/overview_%02d.png";
## get parameters
params = {}
cgi = nil
if ENV['REQUEST_METHOD']
require 'cgi'
cgi = CGI.new
cgi.params.each do |key, value|
params[key] = value.first
end
end
## get parameters
first = 1
last = 22
page = params['page']
if (!page || page.empty?)
page = 0
else
page = page.to_i
page = 0 unless first <= page && page <= last
end
## set URLs of previous, next, first, last, and index page
script = cgi ? cgi.script_name : File::basename(__FILE__)
prev_url = page > first ? "#{script}?page=#{page-1}" : nil
next_url = page < last ? "#{script}?page=#{page+1}" : nil
first_url = page > first ? "#{script}?page=#{first}" : nil
last_url = page < last ? "#{script}?page=#{last}" : nil
index_url = page != 0 ? "#{script}?page=0" : nil
##
if page > 0
image_url = image_url_format % page
elsif page == 0
thumb_list = []
(first..last).each do |i|
image_url = image_url_format % i
link_url = "#{script}?page=#{i}"
thumb_list << { :image_url => image_url, :link_url => link_url }
end
else
# internal error
end
## load view
require 'erb'
str = File.open('thumbnail.view') { |f| f.read() }
str.untaint
trim_mode = 2
print cgi.header if cgi
ERB.new(str, $SAFE, trim_mode).run(binding())
Compile and execution:
### compile % kwartz -l eruby -p thumbnail.plogic thumbnail.html > thumbnail.view ### execution % ruby thumbnail.rb > result.html
thumbnail.view (output script for Ruby):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO8859-1">
<title>Kwartz - a template system for Ruby, PHP and Java (brief overview)</title>
</head>
<body style="background-color:#FFFFFF">
<% if page > 0 then %>
<div align="center">
<% if first_url && !first_url.empty? then %>
<a href="<%= first_url %>">|<< First</a>
<% else %>
|<< First<% end %>
<% if prev_url && !prev_url.empty? then %>
<a href="<%= prev_url %>">< Prev</a>
<% else %>
< Prev<% end %>
<% if index_url && !index_url.empty? then %>
<a href="<%= index_url %>">Index</a>
<% else %>
Index<% end %>
<% if next_url && !next_url.empty? then %>
<a href="<%= next_url %>"><strong>Next ></strong></a>
<% else %>
<strong>Next ></strong><% end %>
<% if last_url && !last_url.empty? then %>
<a href="<%= last_url %>">Last >>|</a>
<% else %>
Last >>|<% end %>
</div>
<% end %>
<div>
<% if page == 0 then %>
<% i = 0 %>
<% for thumb in thumb_list do %>
<% i += 1 %>
<% link_url = thumb[:link_url] %>
<% image_url = thumb[:image_url] %>
<a href="<%= link_url %>"><!--
--><img width="200" height="150" src="<%= image_url %>"></a>
<% if i % 3 == 0 then %>
<br>
<% end %>
<% end %>
<% end %>
</div>
<% if page != 0 then %>
<div id="main_image" align="center">
<br>
<table border="1">
<tr>
<td>
<img src="<%= image_url %>" alt="presentaion image">
</td>
</tr>
</table>
<br>
</div>
<% end %>
<% if page > 0 then %>
<div align="center">
<% if first_url && !first_url.empty? then %>
<a href="<%= first_url %>">|<< First</a>
<% else %>
|<< First<% end %>
<% if prev_url && !prev_url.empty? then %>
<a href="<%= prev_url %>">< Prev</a>
<% else %>
< Prev<% end %>
<% if index_url && !index_url.empty? then %>
<a href="<%= index_url %>">Index</a>
<% else %>
Index<% end %>
<% if next_url && !next_url.empty? then %>
<a href="<%= next_url %>"><strong>Next ></strong></a>
<% else %>
<strong>Next ></strong><% end %>
<% if last_url && !last_url.empty? then %>
<a href="<%= last_url %>">Last >>|</a>
<% else %>
Last >>|<% end %>
</div>
<% end %>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO8859-1">
<title>Kwartz - a template system for Ruby, PHP and Java (brief overview)</title>
</head>
<body style="background-color:#FFFFFF">
<div>
<a href="thumbnail.rbx?page=1"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_01.png"></a>
<a href="thumbnail.rbx?page=2"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_02.png"></a>
<a href="thumbnail.rbx?page=3"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_03.png"></a>
<br>
<a href="thumbnail.rbx?page=4"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_04.png"></a>
<a href="thumbnail.rbx?page=5"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_05.png"></a>
<a href="thumbnail.rbx?page=6"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_06.png"></a>
<br>
<a href="thumbnail.rbx?page=7"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_07.png"></a>
<a href="thumbnail.rbx?page=8"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_08.png"></a>
<a href="thumbnail.rbx?page=9"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_09.png"></a>
<br>
<a href="thumbnail.rbx?page=10"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_10.png"></a>
<a href="thumbnail.rbx?page=11"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_11.png"></a>
<a href="thumbnail.rbx?page=12"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_12.png"></a>
<br>
<a href="thumbnail.rbx?page=13"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_13.png"></a>
<a href="thumbnail.rbx?page=14"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_14.png"></a>
<a href="thumbnail.rbx?page=15"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_15.png"></a>
<br>
<a href="thumbnail.rbx?page=16"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_16.png"></a>
<a href="thumbnail.rbx?page=17"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_17.png"></a>
<a href="thumbnail.rbx?page=18"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_18.png"></a>
<br>
<a href="thumbnail.rbx?page=19"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_19.png"></a>
<a href="thumbnail.rbx?page=20"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_20.png"></a>
<a href="thumbnail.rbx?page=21"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_21.png"></a>
<br>
<a href="thumbnail.rbx?page=22"><!--
--><img width="200" height="150" src="http://www.kuwata-lab.com/kwartz/overview/img/overview_22.png"></a>
</div>
</body>
</html>
Page Layout
layout.html (presentation data):
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>
<title id="placeholder:pagetitle:content">pagetitle</span></title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="design.css">
</head>
<body>
<table border="0" summary="">
<tr>
<!-- menu part -->
<td width="100" valign="top" class="menu_part">
<b>Menu:</b>
<div id="placeholder:menulist" class="menulist">
* menu1 <br>
* menu2 <br>
* menu3 <br>
* menu4 <br>
</div>
</td>
<!-- content part -->
<td width="400" valign="top" class="contents_part">
<h3 id="placeholder:pagetitle:content">...title...</h3>
<div id="placeholder:contents:content" class="contents">
content<br>
content<br>
content<br>
content<br>
</div>
</td>
</tr>
<!-- footer part -->
<tr>
<td colspan="2" class="copyright">
copyright© 2004-2005 kuwata-lab.com All Rights Reserverd
</td>
</tr>
</table>
</body>
</html>
menu.html (presentation data):
<html>
<body>
<h1>Menu</h1>
<ul id="mark:menulist">
<li><a href="..." id="mark:menu">menu0</a></li>
<li id="dummy:m1"><a href="...">menu1</a></li>
<li id="dummy:m2"><a href="...">menu2</a></li>
</ul>
</body>
</html>
menu.plogic (presentation logic):
#menulist {
plogic: {
foreach (menu in menulist) {
@stag;
@cont;
@etag;
}
}
}
#menu {
value: menu[:label];
attrs: "href" menu[:url];
}
page1.html (presentation data):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<body>
<h1 id="mark:pagetitle">Stock Quoting</h1>
<div id="mark:contents">
<table>
<thead>
<tr>
<th>Symbol</th><th>Company</th><th>Price</th><th>Change</th>
</tr>
</thead>
<tbody>
<tr id="mark:stocks">
<td id="mark:stock_symbol">AAAA</td>
<td id="mark:stock_company">AAAA Corp.</td>
<td id="mark:stock_price" align="right">11.11</td>
<td id="mark:stock_rate" align="right">1.11%</td>
</tr>
<tr id="dummy:s1">
<td>BBBB</td>
<td>BBBB Corp.</td>
<td align="right">22.22</td>
<td align="right">2.22%</td>
</tr>
<tr id="dummy:s2">
<td>CCCC</td>
<td>CCCC Corp.</td>
<td align="right">33.33</td>
<td align="right" style="color:red">3.33%</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
page2.html (presentation data):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<body>
<h1 id="mark:pagetitle">Quoting Detail</h1>
<div id="mark:contents">
<table id="mark:stock">
<tbody>
<tr>
<th>Symbol:</th><td id="mark:stock_symbol">AAAA</td>
</tr>
<tr>
<th>Company:</th><td id="mark:stock_company">AAAA Corp.</td>
</tr>
<tr>
<th>Price:</th><td id="mark:stock_price">11.11</td>
</tr>
<tr>
<th>Change:</th>
<td id="mark:stock_rate">1.11%</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
page.plogic (presentation logic):
#stocks {
plogic: {
foreach (stock in stocks) {
@stag;
@cont;
@etag;
}
}
}
#stock_symbol {
value: stock[:symbol];
}
#stock_company {
value: stock[:company];
}
#stock_price {
value: stock[:price];
}
#stock_rate {
append: style;
plogic: {
rate = stock[:rate];
style = '';
if (rate < 0) {
rate = - rate;
style = ' style="color:red"';
}
@stag;
print(rate, "%");
@etag;
}
}
main.rb (main program):
#!/usr/bin/env ruby
## menu
menulist = [
{ :label => 'Mail', :url => '/cgi-bin/mail.cgi' },
{ :label => 'Calnedar', :url => '/cgi-bin/calendar.cgi' },
{ :label => 'Todo', :url => '/cgi-bin/todo.cgi' },
{ :label => 'Stock', :url => '/cgi-bin/stock.cgi' },
]
## contents data
stocks = [
{ :symbol => "AAPL", :price => 36.49, :rate => -0.32,
:company => "Apple Computer, Inc."},
{ :symbol => "MSFT", :price => 26.53, :rate => 1.44,
:company => "Microsoft Corp."},
{ :symbol => "ORCL", :price => 12.59, :rate => -2.02,
:company => "Oracle Corporation"},
{ :symbol => "SUNW", :price => 3.62, :rate => 0.28,
:company => "Sun Microsystems, Inc." },
{ :symbol => "INTC", :price => 19.51, :rate => 2.90,
:company => "Interl Corporation" },
]
## page filename
cgi = nil
symbol = nil
if ENV['SCRIPT_NAME']
require 'cgi'
cgi = CGI.new
symbol = cgi.params['symbol'].first
elsif ARGV[0]
symbol = ARGV[0]
end
if symbol
stock = stocks.find { |hash| hash[:symbol] == symbol }
filename = 'page2.view'
else
filename = 'page1.view'
end
## output
require 'erb'
str = File.open(filename) { |f| f.read() }
trim_mode = 1
erb = ERB.new(str, $SAFE, trim_mode)
print cgi.header if cgi
print erb.result(binding())
Compile and execution:
### compile % kwartz -p menu.plogic,page.plogic -i menu.html,page1.html layout.html > page1.view % kwartz -p menu.plogic,page.plogic -i menu.html,page2.html layout.html > page2.view ### execution % ruby main.rb > result1.html % ruby main.rb AAPL > result2.html
page1.view (output script for Ruby):
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>
<title>Stock Quoting</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="design.css">
</head>
<body>
<table border="0" summary="">
<tr>
<!-- menu part -->
<td width="100" valign="top" class="menu_part">
<b>Menu:</b>
<div class="menulist">
<% for menu in menulist do %>
<ul>
<li><a href="<%= menu[:url] %>"><%= menu[:label] %></a></li>
</ul>
<% end %>
</div>
</td>
<!-- content part -->
<td width="400" valign="top" class="contents_part">
<h3>Stock Quoting</h3>
<div class="contents">
<table>
<thead>
<tr>
<th>Symbol</th><th>Company</th><th>Price</th><th>Change</th>
</tr>
</thead>
<tbody>
<% for stock in stocks do %>
<tr>
<td><%= stock[:symbol] %></td>
<td><%= stock[:company] %></td>
<td align="right"><%= stock[:price] %></td>
<% rate = stock[:rate] %>
<% style = "" %>
<% if rate < 0 then %>
<% rate = -rate %>
<% style = " style=\"color:red\"" %>
<% end %>
<td align="right"<%= style %>><%= rate %>%</td>
</tr>
<% end %>
</tbody>
</table>
</div>
</td>
</tr>
<!-- footer part -->
<tr>
<td colspan="2" class="copyright">
copyright© 2004-2005 kuwata-lab.com All Rights Reserverd
</td>
</tr>
</table>
</body>
</html>
page2.view (output script for Ruby):
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>
<title>Quoting Detail</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="design.css">
</head>
<body>
<table border="0" summary="">
<tr>
<!-- menu part -->
<td width="100" valign="top" class="menu_part">
<b>Menu:</b>
<div class="menulist">
<% for menu in menulist do %>
<ul>
<li><a href="<%= menu[:url] %>"><%= menu[:label] %></a></li>
</ul>
<% end %>
</div>
</td>
<!-- content part -->
<td width="400" valign="top" class="contents_part">
<h3>Quoting Detail</h3>
<div class="contents">
<table>
<tbody>
<tr>
<th>Symbol:</th><td><%= stock[:symbol] %></td>
</tr>
<tr>
<th>Company:</th><td><%= stock[:company] %></td>
</tr>
<tr>
<th>Price:</th><td><%= stock[:price] %></td>
</tr>
<tr>
<th>Change:</th>
<% rate = stock[:rate] %>
<% style = "" %>
<% if rate < 0 then %>
<% rate = -rate %>
<% style = " style=\"color:red\"" %>
<% end %>
<td<%= style %>><%= rate %>%</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<!-- footer part -->
<tr>
<td colspan="2" class="copyright">
copyright© 2004-2005 kuwata-lab.com All Rights Reserverd
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>
<title>Stock Quoting</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="design.css">
</head>
<body>
<table border="0" summary="">
<tr>
<!-- menu part -->
<td width="100" valign="top" class="menu_part">
<b>Menu:</b>
<div class="menulist">
<ul>
<li><a href="/cgi-bin/mail.cgi">Mail</a></li>
</ul>
<ul>
<li><a href="/cgi-bin/calendar.cgi">Calnedar</a></li>
</ul>
<ul>
<li><a href="/cgi-bin/todo.cgi">Todo</a></li>
</ul>
<ul>
<li><a href="/cgi-bin/stock.cgi">Stock</a></li>
</ul>
</div>
</td>
<!-- content part -->
<td width="400" valign="top" class="contents_part">
<h3>Stock Quoting</h3>
<div class="contents">
<table>
<thead>
<tr>
<th>Symbol</th><th>Company</th><th>Price</th><th>Change</th>
</tr>
</thead>
<tbody>
<tr>
<td>AAPL</td>
<td>Apple Computer, Inc.</td>
<td align="right">36.49</td>
<td align="right" style="color:red">0.32%</td>
</tr>
<tr>
<td>MSFT</td>
<td>Microsoft Corp.</td>
<td align="right">26.53</td>
<td align="right">1.44%</td>
</tr>
<tr>
<td>ORCL</td>
<td>Oracle Corporation</td>
<td align="right">12.59</td>
<td align="right" style="color:red">2.02%</td>
</tr>
<tr>
<td>SUNW</td>
<td>Sun Microsystems, Inc.</td>
<td align="right">3.62</td>
<td align="right">0.28%</td>
</tr>
<tr>
<td>INTC</td>
<td>Interl Corporation</td>
<td align="right">19.51</td>
<td align="right">2.9%</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<!-- footer part -->
<tr>
<td colspan="2" class="copyright">
copyright© 2004-2005 kuwata-lab.com All Rights Reserverd
</td>
</tr>
</table>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>
<title>Quoting Detail</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" type="text/css" href="design.css">
</head>
<body>
<table border="0" summary="">
<tr>
<!-- menu part -->
<td width="100" valign="top" class="menu_part">
<b>Menu:</b>
<div class="menulist">
<ul>
<li><a href="/cgi-bin/mail.cgi">Mail</a></li>
</ul>
<ul>
<li><a href="/cgi-bin/calendar.cgi">Calnedar</a></li>
</ul>
<ul>
<li><a href="/cgi-bin/todo.cgi">Todo</a></li>
</ul>
<ul>
<li><a href="/cgi-bin/stock.cgi">Stock</a></li>
</ul>
</div>
</td>
<!-- content part -->
<td width="400" valign="top" class="contents_part">
<h3>Quoting Detail</h3>
<div class="contents">
<table>
<tbody>
<tr>
<th>Symbol:</th><td>AAPL</td>
</tr>
<tr>
<th>Company:</th><td>Apple Computer, Inc.</td>
</tr>
<tr>
<th>Price:</th><td>36.49</td>
</tr>
<tr>
<th>Change:</th>
<td style="color:red">0.32%</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<!-- footer part -->
<tr>
<td colspan="2" class="copyright">
copyright© 2004-2005 kuwata-lab.com All Rights Reserverd
</td>
</tr>
</table>
</body>
</html>
Rails
recipes.html (presentation data):
<html>
<head>
<title>Recipes: <span id="mark:action_name">action</span></title>
<link id="mark:stylesheet_link" type="text/css" rel="stylesheet" href="scaffold.css" />
</head>
<body id="mark:content">
... contents ...
</body>
</html>
recipes.plogic (presentation logic):
#stylesheet_link {
// replace element with print statement
plogic: {
print(X(<%= stylesheet_link_tag 'scaffold' %>), "\n");
}
}
#action_name {
value: controller.action_name;
}
#content {
value: X(content_for_layout);
}
list.html (presentation data):
<html>
<body>
<div id="mark:content">
<h1>Online Cookbook - All Recipes</h1>
<table border="1">
<thead>
<tr>
<th width="40%">Recipe</th>
<th width="20%">Category</th>
<th width="20%">Date</th>
</tr>
</thead>
<tbody>
<tr bgcolor="#FFCCCC" id="mark:recipes">
<td><a href="..." id="mark:recipe_title">Hot Chips</a></td>
<td id="mark:recipe_category">Snacks</td>
<td id="mark:recipe_date">2004-11-11</td>
</tr>
<tr bgcolor="#CCCCFF" id="dummy:d1">
<td><a href="...">Ice Water</a></td>
<td>Beverages</td>
<td>2004-11-11</td>
</tr>
</tbody>
</table>
<p>
<a href="..." id="mark:new_recipe">Create new recipe</a>
</p>
</div>
</body>
</html>
list.plogic (presentation logic):
#recipes {
attrs: "bgcolor" X(color);
plogic: {
i = 0;
foreach (recipe in recipes) {
i += 1;
color = i % 2 == 0 ? '#CCCCFF' : '#FFCCCC';
@stag; // start tag
@cont; // content
@etag; // end tag
}
}
}
#recipe_title {
value: recipe.title;
attrs: "href" X(<%= url_for(:action=>'show', :id=>recipe.id) %>);
}
#recipe_category {
value: recipe.category.name;
}
#recipe_date {
value: recipe.date;
}
#new_recipe {
attrs: "href" X(<%= url_for(:action=>'new') %>);
}
show.html (presentation data):
<html>
<body>
<div id="mark:content">
<h1>Show Recipe</h1>
<table>
<tr>
<th>Title:</th>
<td id="value:recipe.title">Hot Chips</td>
</tr>
<tr>
<th>Description:</th>
<td id="value:recipe.description">Only for the brave!</td>
</tr>
<tr>
<th>Category:</th>
<td id="value:recipe.category.name">Snacks</td>
</tr>
<tr>
<th>Date:</th>
<td id="value:recipe.date">2004-11-11</td>
</tr>
<tr>
<th>Instructions:</th>
<td id="mark:recipe_instructions">Sprinkle hot-pepper sauce on corn chips.</td>
</tr>
</table>
<p>
<a href="..." id="mark:edit_recipe">Edit</a>
|
<a href="..." id="mark:list_recipes">Back</a>
</p>
</div>
</body>
</html>
show.plogic (presentation logic):
#recipe_instructions {
value: X(str_linebreak(escape_xml(recipe.instructions)));
}
#edit_recipe {
attrs: "href" X(<%= url_for(:action=>'edit', :id=>@recipe.id) %>);
}
// #recipe_title {
// value: recipe.title;
// }
//
// #recipe_description {
// value: recipe.description;
// }
//
// #recipe_category {
// value: recipe.category.name;
// }
//
// #recipe_date {
// value: recipe.date;
// }
new.html (presentation data):
<html>
<body>
<div id="mark:content">
<h1>New Recipe</h1>
<form id="new_form" action="..." method="post">
<table>
<tr>
<th>Title:</th>
<td>
<input id="recipe_title" name="recipe[title]" type="text" value="" />
</td>
</tr>
<tr>
<th>Description:</th>
<td>
<input id="recipe_description" name="recipe[description]" type="text" value=""/>
</td>
</tr>
<tr>
<th>Category:</th>
<td>
<select name="recipe[category_id]">
<option value="1" id="mark:recipe_category">Snacks</option>
<option value="2" id="dummy:o1">Drinks</option>
</select>
</td>
</tr>
<tr>
<th>Instructions:</th>
<td>
<textarea id="recipe_instructions" name="recipe[instructions]"
cols="40" rows="20" wrap="virtual"></textarea>
</td>
</tr>
</table>
<input type="submit" value="Submit" />
</form>
<p>
<a href="..." id="mark:list_recipes">Back</a>
</p>
</div>
</body>
</html>
new.plogic (presentation logic):
#new_form {
attrs: "action" X(<%= url_for(:action=>'create') %>);
}
#recipe_category {
value: category.name;
attrs: "value" category.id;
plogic: {
foreach (category in categories) {
@stag;
@cont;
@etag;
}
}
}
edit.html (presentation data):
<html>
<body>
<div id="mark:content">
<h1>Edit Recipe</h1>
<form id="mark:edit_form" action="..." method="post">
<input id="recipe_id" name="recipe[id]" type="hidden" value="1" />
<table>
<tr>
<th>Title:</th>
<td>
<input id="recipe_title" name="recipe[title]"
size="30" type="text" value="Hot Chips" />
</td>
</tr>
<tr>
<th>Description:</th>
<td>
<input id="recipe_description" name="recipe[description]"
size="30" type="text" value="Only for the brave!" />
</td>
</tr>
<tr>
<th>Category:</th>
<td>
<select name="recipe[category_id]">
<option value="1" id="mark:category_name">Snacks</option>
<option value="2" id="dummy:o1">Drinks</option>
</select>
</td>
</tr>
<tr>
<th>Instructions:</th>
<td>
<textarea id="recipe_instructions" name="recipe[instructions]" wrap="virtual"
cols="40" rows="20">Sprinkle hot-pepper sauce on corn chips.</textarea>
</td>
</tr>
</table>
<input type="submit" value="Update" />
</form>
<p>
<a href="..." id="mark:show_recipe">Show</a>
|
<a href="..." id="mark:list_recipes">Back</a>
</p>
</div>
</body>
</html>
edit.plogic (presentation logic):
#edit_form {
attrs: "action" X(<%= url_for(:action=>'update') %>);
}
#recipe_id {
attrs: "value" recipe.id;
}
#recipe_title {
attrs: "value" recipe.title;
}
#recipe_description {
attrs: "value" recipe.description;
}
#category_name {
value: category.name;
attrs: "value" category.id;
append: S(category.id==recipe.category.id);
plogic: {
foreach (category in categories) {
@stag;
@cont;
@etag;
}
}
}
#recipe_instructions {
value: recipe.instructions;
}
#show_recipe {
attrs: "href" X(<%= url_for(:action=>'show', :id=>@recipe.id) %>);
}
Compile:
### compile % kwartz -Rails -e -p recipes.plogic recipes.html > recipes.rhtml % kwartz -Rails -e -p list.plogic --extract=content list.html > list.rhtml % kwartz -Rails -e -p show.plogic --extract=content show.html > show.rhtml % kwartz -Rails -e -p new.plogic --extract=content new.html > new.rhtml % kwartz -Rails -e -p edit.plogic --extract=content edit.html > edit.rhtml
recipes.rhtml (output script for Ruby):
<html>
<head>
<title>Recipes: <%=h(@controller.action_name)%></title>
<%= stylesheet_link_tag 'scaffold' %>
</head>
<body>
<%= @content_for_layout %> </body>
</html>
list.rhtml (output script for Ruby):
<div>
<h1>Online Cookbook - All Recipes</h1>
<table border="1">
<thead>
<tr>
<th width="40%">Recipe</th>
<th width="20%">Category</th>
<th width="20%">Date</th>
</tr>
</thead>
<tbody>
<% i = 0 %>
<% for recipe in @recipes do %>
<% i += 1 %>
<% color = i % 2 == 0 ? "#CCCCFF" : "#FFCCCC" %>
<tr bgcolor="<%= color %>">
<td><a href="<%= url_for(:action=>'show', :id=>recipe.id) %>"><%=h(recipe.title)%></a></td>
<td><%=h(recipe.category.name)%></td>
<td><%=h(recipe.date)%></td>
</tr>
<% end %>
</tbody>
</table>
<p>
<a href="<%= url_for(:action=>'new') %>">Create new recipe</a>
</p>
</div>
show.rhtml (output script for Ruby):
<div>
<h1>Show Recipe</h1>
<table>
<tr>
<th>Title:</th>
<td><%=h(@recipe.title)%></td>
</tr>
<tr>
<th>Description:</th>
<td><%=h(@recipe.description)%></td>
</tr>
<tr>
<th>Category:</th>
<td><%=h(@recipe.category.name)%></td>
</tr>
<tr>
<th>Date:</th>
<td><%=h(@recipe.date)%></td>
</tr>
<tr>
<th>Instructions:</th>
<td><%= html_escape(@recipe.instructions).gsub(/\r?\n/,'<br />\&') %></td>
</tr>
</table>
<p>
<a href="<%= url_for(:action=>'edit', :id=>@recipe.id) %>">Edit</a>
|
<a href="...">Back</a>
</p>
</div>
new.rhtml (output script for Ruby):
<div>
<h1>New Recipe</h1>
<form id="new_form" action="<%= url_for(:action=>'create') %>" method="post">
<table>
<tr>
<th>Title:</th>
<td>
<input id="recipe_title" name="recipe[title]" type="text" value="" />
</td>
</tr>
<tr>
<th>Description:</th>
<td>
<input id="recipe_description" name="recipe[description]" type="text" value="" />
</td>
</tr>
<tr>
<th>Category:</th>
<td>
<select name="recipe[category_id]">
<% for category in @categories do %>
<option value="<%=h(category.id)%>"><%=h(category.name)%></option>
<% end %>
</select>
</td>
</tr>
<tr>
<th>Instructions:</th>
<td>
<textarea id="recipe_instructions" name="recipe[instructions]" cols="40" rows="20" wrap="virtual"></textarea>
</td>
</tr>
</table>
<input type="submit" value="Submit" />
</form>
<p>
<a href="...">Back</a>
</p>
</div>
edit.rhtml (output script for Ruby):
<div>
<h1>Edit Recipe</h1>
<form action="<%= url_for(:action=>'update') %>" method="post">
<input id="recipe_id" name="recipe[id]" type="hidden" value="<%=h(@recipe.id)%>" />
<table>
<tr>
<th>Title:</th>
<td>
<input id="recipe_title" name="recipe[title]" size="30" type="text" value="<%=h(@recipe.title)%>" />
</td>
</tr>
<tr>
<th>Description:</th>
<td>
<input id="recipe_description" name="recipe[description]" size="30" type="text" value="<%=h(@recipe.description)%>" />
</td>
</tr>
<tr>
<th>Category:</th>
<td>
<select name="recipe[category_id]">
<% for category in @categories do %>
<option value="<%=h(category.id)%>"<%= category.id == @recipe.category.id ? " selected=\"selected\"" : "" %>><%=h(category.name)%></option>
<% end %>
</select>
</td>
</tr>
<tr>
<th>Instructions:</th>
<td>
<textarea id="recipe_instructions" name="recipe[instructions]" wrap="virtual" cols="40" rows="20"><%=h(@recipe.instructions)%></textarea>
</td>
</tr>
</table>
<input type="submit" value="Update" />
</form>
<p>
<a href="<%= url_for(:action=>'show', :id=>@recipe.id) %>">Show</a>
|
<a href="...">Back</a>
</p>
</div>