doc/directives.html in masterview-0.2.5 vs doc/directives.html in masterview-0.3.0
- old
+ new
@@ -1,10 +1,10 @@
<?xml version="1.0" encoding="iso-8859-1"?>
-<!DOCTYPE html
+<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-
+
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>MasterView - Directives Reference</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
@@ -23,27 +23,31 @@
<div id="headerNav">
<div>
·
<a href="./index.html">Doc Home</a>
|
+<a href="./about.html">About</a>
+ |
<a href="./installation.html">Installation</a>
|
<a href="./configuration.html">Configuration</a>
|
<a href="./guide.html">Usage</a>
|
<a href="./directives.html">Directives</a>
-
-<a href="./media_list.html">Media (Videos/Illustrations)</a>
+ |
+<a href="./developer.html">Developers</a>
+ |
+<a href="./media_list.html">Screencasts</a>
·
</div>
</div>
<div id="pageBody">
<div id="bodyContent">
-<h1>MasterView - Directives Reference</h1>
+<h1>MasterView Directives Reference</h1>
<p>MasterView template processing directives are encoded in an (x)html template
using attribute markup. A MasterView directive is an element attribute
in the <span class="directiveName">mv:</span> namespace.
By convention, Masterview directive attribute names use lower-case letters with
@@ -79,23 +83,23 @@
</pre>
<p>A typical use would be to specify the generated output for the main content
of a template <code>one/two/foo.html</code> with the directive
<code>mv:generate="{template_path}"</code>.
-This keyword notation avoids the need to replicate the template's own file name or
-it's relative path within the Rails <code>app/views</code> directory in the
+This keyword notation avoids the need to replicate the template's own file name or
+it's relative path within the Rails <code>app/views</code> directory in the
directive markup in the template.
</p>
<h3>Default generation (output)</h3>
<p>
Typically MasterView template files will contain mv:generate or mv:gen_partial directives
to tell MasterView where to output the rendered rhtml. However if none are found in the template
file, MasterView will automatically add in a mv:generate="{template_path}" to the body tag
-if found otherwise the root element. Additionally if MasterView was adding this to the body tag,
-it will add in a mv:omit_tag="" which will prevent the body tag from being included in the generated
-output. If you wish to disable this default generate mechanism, set the
+if found otherwise the root element. Additionally if MasterView was adding this to the body tag,
+it will add in a mv:omit_tag="" which will prevent the body tag from being included in the generated
+output. If you wish to disable this default generate mechanism, set the
config.default_parser_options[:default_generate] = false in your masterview settings or
environments files.
</p>
@@ -152,10 +156,14 @@
<tr>
<td class="directive"><a href="#mv_block">mv:block</a></td>
<td>Expands to the equivalent rhtml (erb) block code around this element</td>
</tr>
<tr>
+<td class="directive"><a href="#mv_eval">mv:eval</a></td>
+<td>Inserts an rhtml evaluation expression for the attribute value prior to this element</td>
+</tr>
+<tr>
<td class="directive"><a href="#mv_if">mv:if</a></td>
<td>Wraps this element with an <code>if... end</code> block using the attribute contents for the condition</td>
</tr>
<tr>
<td class="directive"><a href="#mv_elsif">mv:elsif</a></td>
@@ -196,10 +204,18 @@
Used on <code><a></code> link elements
)</span>
</td>
</tr>
<tr>
+<td class="directive"><a href="#mv_link_to_function">mv:link_to_function</a></td>
+<td>Replaces this element using the Rails <code>link_to_function</code> helper which creates a link which calls a JavaScript function.
+<span class="explanation">(
+Used on <code><a></code> link elements
+)</span>
+</td>
+</tr>
+<tr>
<td class="directive"><a href="#mv_link_to_if">mv:link_to_if</a></td>
<td>Replaces this element using the Rails <code>link_to_if</code> helper
<span class="explanation">(
Used on <code><a></code> link elements
)</span>
@@ -237,13 +253,17 @@
)</span>
</td>
</tr>
<tr>
<td class="directive"><a href="#mv_form">mv:form</a></td>
-<td>Replaces the start and end tags of this element using the Rails <code>form_tag</code> and <code>form_tag</code> helpers</td>
+<td>Replaces the start and end tags of this element using the Rails <code>form_tag</code> helper and closing form tag</td>
</tr>
<tr>
+<td class="directive"><a href="#mv_form_remote">mv:form_remote</a></td>
+<td>Replaces the start and end tags of this element using the Rails <code>form_remote_tag</code> helper and a closing form tag for Ajax-enabled form submission using the Prototype library</td>
+</tr>
+<tr>
<td class="directive"><a href="#mv_hidden_field">mv:hidden_field</a></td>
<td>Replaces this element with a <code>hidden</code> input element using the Rails <code>hidden_tag</code> helper.
<span class="explanation">(
Used on <code><input></code> form elements
)</span>
@@ -582,10 +602,31 @@
<% } %>
Its all based on the ruby and rails syntax while keeping things xhtml and designer friendly.
</pre>
+<a name="mv_eval"></a>
+<h4>mv:eval</h4>
+<p>
+mv:eval="rubyExpression"
+</p>
+<pre>
+ At runtime this causes an rhtml evaluation expression for the attribute value
+ to be inserted into the output preceding this element, for example...
+
+ <table mv:eval="num_alerts = 0">
+ ... some table content here ...
+ </table>
+
+ becomes
+
+ <% num_alerts = 0 %>
+ <table>
+ ... some table content here ...
+ </table>
+</pre>
+
<a name="mv_if"></a>
<h4>mv:if</h4>
<p>
mv:if="yourIfConditionHere"
</p>
@@ -709,11 +750,11 @@
<p>
mv:image_tag="cat.jpg"
</p>
<pre>
Replaces the tag with a image_tag helper, size is determined by width and height, other html attributes
- are passed through. for example...
+ are passed through. for example...
<img src="../../../public/images/cat.jpg" mv:image_tag="cat.jpg"/>
becomes
@@ -724,12 +765,12 @@
becomes
<%= image_tag 'cat.jpg', :alt => 'my cat', :size => '20x10' %>
- Also if path isn't specified in the mv:image_tag attribute value then it will infer the path looking
- for what follows the public/images/ in the src atttribute, like so
+ Also if path isn't specified in the mv:image_tag attribute value then it will infer the path looking
+ for what follows the public/images/ in the src atttribute, like so
<img src="../../../public/images/cat.jpg" mv:image_tag=""/>
becomes
@@ -752,20 +793,20 @@
becomes
<%= javascript_include_tag 'prototype.js' %>
- You can also use a symbol
+ You can also use a symbol
<script type="text/javascript" src="../../../public/javascripts/prototype.js"
mv:javascript_include=":defaults"></script>
becomes
<%= javascript_include_tag :defaults %>
- And you can have the path inferred from the src path (uses the relative path to public/javascripts)
+ And you can have the path inferred from the src path (uses the relative path to public/javascripts)
<script type="text/javascript" src="../../../public/javascripts/prototype.js"
mv:javascript_include=""></script>
becomes
@@ -791,10 +832,25 @@
becomes
<%= link_to 'New product', :action => 'new' %>
</pre>
+<a name="mv_link_to_function"></a>
+<h4>mv:link_to_function</h4>
+<p>
+mv:link_to_function="mv:link_to_if="function, options""
+</p>
+<pre>
+ Replaces the tag with a link_to_function helper. The attribute values
+ contains the function to call, along with optional keyword arguments
+ to pass to the link_to_function helper. The content of the element
+ is used as the function name.
+
+ ### todo: add example here ###
+
+</pre>
+
<a name="mv_link_to_if"></a>
<h4>mv:link_to_if</h4>
<p>
mv:link_to_if="linkToIfConditionAndOption"
</p>
@@ -860,20 +916,20 @@
<h4>mv:check_box</h4>
<p>
mv:check_box="product, name"
</p>
<pre>
- Replaces this element with the check_box helper. It quotes the object and name if necessary, and merges any
- html attributes into options if supplied
+ Replaces this element with the check_box helper. It quotes the object and name if necessary, and merges any
+ html attributes into options if supplied
<input type="checkbox" mv:check_box="product, name"/>
becomes
<% check_box 'product', 'name' %>
- and
+ and
<input type="checkbox" class="green" id="cb1" mv:check_box="product, name, {:readonly => true}, 'yes,', 'no'"/>
becomes
@@ -886,31 +942,31 @@
<p>
mv:collection_select="product, category, Category.find_all, id, name"
</p>
<pre>
Replaces the tag with a select helper, it quotes the object and method if necessary, and
- merges any html attributes into the html_options
+ merges any html attributes into the html_options
- <select mv:collection_select="product, category, Category.find_all, id, name">
- <option&>One</option>
- <option&>One</option>
- </select>
-
+ <select mv:collection_select="product, category, Category.find_all, id, name">
+ <option>One</option>
+ <option>One</option>
+ </select>
+
becomes
<%= collection_select 'product', 'category', Category.find_all, 'id', 'name' %>
and
- <select size="3" mv:collection_select="product, category, Category.find_all, id, name, {}, :readonly => true ">
- <option&>One</option>
- <option&>One</option>
- </select>
-
+ <select size="3" mv:collection_select="product, category, Category.find_all, id, name, {}, :readonly => true ">
+ <option>One</option>
+ <option>One</option>
+ </select>
+
becomes
<%= collection_select 'product', 'category', Category.find_all, 'id', 'name', {}, :readonly => true, :size => 3 %>
@@ -920,30 +976,40 @@
<h4>mv:form</h4>
<p>
mv:form=":action => ‘new’"
</p>
<pre>
- Replaces this tag and closing tag with the form_tag and end_form_tag helpers. It also pulls the
+ Replaces this tag and closing tag with the form_tag helper and a closing form tag. It also pulls the
method and multipart attributes from the element and merges that into the form_tag options, for example...
<form mv:form=":action => 'new'">foobar</form>
becomes
- <% form_tag :action => 'new' %>
+ <%= form_tag( :action => 'new') %>
foobar
- <% end_form_tag %>
+ </form>
<form method="GET" mv:form=":action => 'new'">foobar</form>
becomes
- <% form_tag { :action => 'new' }, :method => 'GET' %>
+ <%= form_tag( { :action => 'new' }, :method => 'GET') %>
foobar
- <% end_form_tag %>
+ </form>
</pre>
+<a name="mv_form_remote"></a>
+<h4>mv:form_remote</h4>
+<p>
+mv:form_remote=":action => ‘ url_for(:controller => "some", :action => "place")’"
+</p>
+<pre>
+ Replaces this tag and closing tag with the form_remote_tag helper and a closing form tag
+ ### needs work - fix prototype and add example ###
+</pre>
+
<a name="mv_hidden_field"></a>
<h4>mv:hidden_field</h4>
<p>
mv:hidden_field="object, method"
</p>
@@ -987,11 +1053,11 @@
<p>
mv:radio_button="product, category, 'clothing'"
</p>
<pre>
Replaces the tag with a radio_button helper, it quotes the object and method if necessary, and
- merges any html attributes into the options
+ merges any html attributes into the options
<input type="radio" mv:radio_button="product, category, 'clothing'"/>
becomes
@@ -1013,31 +1079,31 @@
<p>
mv:select="product, category, Category.find_all.collect{|c| [c.name, c.id]}"
</p>
<pre>
Replaces the tag with a select helper, it quotes the object and method if necessary, and
- merges any html attributes into the html_options
+ merges any html attributes into the html_options
- <select mv:select="product, category, Category.find_all.collect{|c| [c.name, c.id]}">
- <option&>One</option>
- <option&>One</option>
- </select>
-
+ <select mv:select="product, category, Category.find_all.collect{|c| [c.name, c.id]}">
+ <option>One</option>
+ <option>One</option>
+ </select>
+
becomes
<%= select 'product', 'category', Category.find_all.collect{|c| [c.name, c.id]} %>
and
- <select size="3" mv:select="product, category, Category.find_all.collect{|c| [c.name, c.id]}, {}, :readonly => true ">
- <option&>One</option>
- <option&>One</option>
- </select>
-
+ <select size="3" mv:select="product, category, Category.find_all.collect{|c| [c.name, c.id]}, {}, :readonly => true ">
+ <option>One</option>
+ <option>One</option>
+ </select>
+
becomes
<%= select 'product', 'category', Category.find_all.collect{|c| [c.name, c.id]}, {}, :readonly => true, :size => 3 %>
@@ -1165,16 +1231,24 @@
</tr>
<tr>
<td class="directive"><a href="#mv_elsif">mv:elsif</a></td>
<td>Used in conjunction with the <span class="directiveName">mv:if</span> directive to allow you to create <code>if... elsif... end</code> blocks</td>
</tr>
+<tr>
+<td class="directive"><a href="#mv_eval">mv:eval</a></td>
+<td>Inserts an rhtml evaluation expression for the attribute value prior to this element</td>
+</tr>
<!-- f -->
<tr>
<td class="directive"><a href="#mv_form">mv:form</a></td>
-<td>Replaces the start and end tags of this element using the Rails <code>form_tag</code> and <code>form_tag</code> helpers</td>
+<td>Replaces the start and end tags of this element using the Rails <code>form_tag</code> block helper and a closing form tag</td>
</tr>
+<tr>
+<td class="directive"><a href="#mv_form_remote">mv:form_remote</a></td>
+<td>Replaces the start and end tags of this element using the Rails <code>form_remote_tag</code> helper and a closing form tag for Ajax-enabled form submission using the Prototype library</td>
+</tr>
<!-- g -->
<tr>
<td class="directive"><a href="#mv_generate">mv:generate</a></td>
<td>Generate output containing this element and its children</td>
@@ -1242,10 +1316,18 @@
Used on <code><a></code> link elements
)</span>
</td>
</tr>
<tr>
+<td class="directive"><a href="#mv_link_to_function">mv:link_to_function</a></td>
+<td>Replaces this element using the Rails <code>link_to_function</code> helper which creates a link which calls a JavaScript function.
+<span class="explanation">(
+Used on <code><a></code> link elements
+)</span>
+</td>
+</tr>
+<tr>
<td class="directive"><a href="#mv_link_to_if">mv:link_to_if</a></td>
<td>Replaces this element using the Rails <code>link_to_if</code> helper
<span class="explanation">(
Used on <code><a></code> link elements
)</span>
@@ -1334,26 +1416,32 @@
<div id="pageFooter">
<div>
·
<a href="./index.html">Doc Home</a>
|
+<a href="./about.html">About</a>
+ |
<a href="./installation.html">Installation</a>
|
<a href="./configuration.html">Configuration</a>
|
<a href="./guide.html">Usage</a>
|
<a href="./directives.html">Directives</a>
-
-<a href="./media_list.html">Media (Videos/Illustrations)</a>
+ |
+<a href="./developer.html">Developers</a>
+ |
+<a href="./media_list.html">Screencasts</a>
·
</div>
<table summary="layout area">
<tbody>
<tr>
<td class="copyright">© Copyright MasterView 2006</td>
<td class="validators">
- <a href="http://validator.w3.org/check/referer"><img src="http://www.w3.org/Icons/valid-xhtml10" title="Valid XHTML 1.0!" alt="Valid XHTML 1.0!" /></a>
+ <a href="http://validator.w3.org/check/referer"><img
+ src="http://www.w3.org/Icons/valid-xhtml10" class="w3c_validator"
+ title="Valid XHTML 1.0!" alt="Valid XHTML 1.0!" /></a>
</td>
</tr>
</tbody>
</table>
</div>
\ No newline at end of file