yonote/yjs
19
0
Fork 0
Code Pull Requests 1 Releases Activity
yjs/doc/class/Haml.html
Kevin Jahns 28b48de454 switched to Gulp
2014-08-12 19:18:56 +02:00

738 lines
20 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>CoffeeScript API Documentation</title>
<script src='../javascript/application.js'></script>
<script src='../javascript/search.js'></script>
<link rel='stylesheet' href='../stylesheets/application.css' type='text/css'>
</head>
<body>
<div id='base' data-path='../'></div>
<div id='header'>
<div id='menu'>
<a href='../extra/README.md.html' title='Yatta'>
Yatta
</a>
&raquo;
<a href='../alphabetical_index.html' title='Index'>
Index
</a>
&raquo;
<span class='title'>Haml</span>
</div>
</div>
<div id='content'>
<h1>
Class:
Haml
</h1>
<table class='box'>
<tr>
<td>Defined in:</td>
<td>node_modules&#47;grunt-codo&#47;node_modules&#47;codo&#47;node_modules&#47;haml-coffee&#47;src&#47;nodes&#47;haml.coffee</td>
</tr>
<tr>
<td>Inherits:</td>
<td>
<a href='../class/Node.html'>Node</a>
</td>
</tr>
</table>
<h2>Overview</h2>
<div class='docstring'>
<p>HAML node that contains Haml a haml tag that can have attributes
and a text or code assignment. There are shortcuts for id and class
generation and some special logic for merging attributes into existing
ids and classes.</p><p>Haml HTML attributes are very limited and allows only simple string
(with interpolation) or variable assignment to an attribute.</p><p>Ruby HTML attributes are more powerful and allows in addition to the
HTML attributes function calls:</p>
<div class='examples'>
<h3>Examples:</h3>
<h4>
Haml tag
</h4>
<pre><code class='coffeescript'>%footer =&gt; &lt;footer&gt;&lt;&#47;footer&gt;</code></pre>
<h4>
Haml id
</h4>
<pre><code class='coffeescript'>#content =&gt; &lt;div id=&#39;content&#39;&gt;&lt;&#47;div&gt;
%span#status{ :id =&gt; @user.status } =&gt; &lt;span id=&#39;status_#{ @user.status }&#39;&gt;&lt;&#47;span&gt;</code></pre>
<h4>
Haml classes
</h4>
<pre><code class='coffeescript'>.hidden =&gt; &lt;div class=&#39;hidden&#39;&gt;&lt;&#47;div&gt;
%span.large.hidden =&gt; &lt;span class=&#39;large hidden&#39;&gt;&lt;&#47;span&gt;
.large{ :class =&gt; @user.role } =&gt; &lt;div class=&#39;large #{ @user.role }&#39;&gt;&lt;&#47;div&gt;</code></pre>
<h4>
Haml HTML attributes
</h4>
<pre><code class='coffeescript'>%p(class=&#39;hidden&#39;) =&gt; &lt;p class=&#39;hidden&#39;&gt;&lt;p&gt;
#account(class=@status) =&gt; &lt;div id=&#39;account&#39; class=&#39;#{ status }&#39;&gt;&lt;&#47;div&gt;
.logout(title=&quot;Logout #{ user.name }&quot;) =&gt; &lt;div class=&#39;logout&#39; title=&#39;Logout #{ user.name }&#39;&gt;&lt;&#47;div&gt;</code></pre>
<h4>
Haml Ruby attributes
</h4>
<pre><code class='coffeescript'>%p{ :class =&gt; App.user.get(&#39;role&#39;) } =&gt; &lt;p class=&#39;#{ App.user.get(&#39;role&#39;) }&#39;&gt;&lt;&#47;p&gt;</code></pre>
</div>
</div>
<div class='tags'>
</div>
<h2>Variables Summary</h2>
<h3 class='inherited'>
Variable inherited from
<a href='../class/Node.html'>Node</a>
</h3>
<p class='inherited'>
<a href='../class/Node.html#CLEAR_WHITESPACE_LEFT-variable'>CLEAR_WHITESPACE_LEFT</a>
<a href='../class/Node.html#CLEAR_WHITESPACE_RIGHT-variable'>CLEAR_WHITESPACE_RIGHT</a>
</p>
<h2>Instance Method Summary</h2>
<ul class='summary'>
<li>
<span class='signature'>
<a href='#evaluate-dynamic'>
#
(void)
<b>evaluate</b><span>()</span>
</a>
</span>
<span class='desc'>
Evaluate the node content and store the opener tag and the closer tag if applicable.
</span>
</li>
<li>
<span class='signature'>
<a href='#parseExpression-dynamic'>
#
(Object)
<b>parseExpression</b><span>(exp)</span>
</a>
</span>
<span class='desc'>
Parses the expression and detect the tag, attributes and any assignment.
</span>
</li>
<li>
<span class='signature'>
<a href='#parseTag-dynamic'>
#
(Object)
<b>parseTag</b><span>(exp)</span>
</a>
</span>
<span class='desc'>
Parse a tag line.
</span>
</li>
<li>
<span class='signature'>
<a href='#parseAttributes-dynamic'>
#
(Object)
<b>parseAttributes</b><span>(exp)</span>
</a>
</span>
<span class='desc'>
Parse attributes either in Ruby style <code>%tag{ :attr =&gt; &#39;value&#39; }</code> or HTML style <code>%tag(attr=&#39;value)</code>.
</span>
</li>
<li>
<span class='signature'>
<a href='#buildHtmlTagPrefix-dynamic'>
#
(String)
<b>buildHtmlTagPrefix</b><span>(tokens)</span>
</a>
</span>
<span class='desc'>
Build the HTML tag prefix by concatenating all the tag information together.
</span>
</li>
<li>
<span class='signature'>
<a href='#interpolateCodeAttribute-dynamic'>
#
(String)
<b>interpolateCodeAttribute</b><span>(text, unwrap = false)</span>
</a>
</span>
<span class='desc'>
Wrap plain attributes into an interpolation for execution.
</span>
</li>
<li>
<span class='signature'>
<a href='#quoteAndEscapeAttributeValue-dynamic'>
#
(String)
<b>quoteAndEscapeAttributeValue</b><span>(value, code = false)</span>
</a>
</span>
<span class='desc'>
Quote the attribute value, depending on its content.
</span>
</li>
<li>
<span class='signature'>
<a href='#splitInterpolations-dynamic'>
#
(Array&lt;String&gt;)
<b>splitInterpolations</b><span>(value)</span>
</a>
</span>
<span class='desc'>
Split expression by its interpolations.
</span>
</li>
<li>
<span class='signature'>
<a href='#buildDocType-dynamic'>
#
(String)
<b>buildDocType</b><span>(doctype)</span>
</a>
</span>
<span class='desc'>
Build the DocType string depending on the <code>!!!</code> token and the currently used HTML format.
</span>
</li>
<li>
<span class='signature'>
<a href='#isNotSelfClosing-dynamic'>
#
(Boolean)
<b>isNotSelfClosing</b><span>(tag)</span>
</a>
</span>
<span class='desc'>
<p>Test if the given tag is a non-self enclosing tag, by matching against a fixed tag list or parse for the self
closing slash <code>/</code> at the end.</p>
</span>
</li>
</ul>
<h2>
<small>Inherited Method Summary</small>
<h3 class='inherited'>
Methods inherited from
<a href='../class/Node.html'>Node</a>
</h3>
<p class='inherited'>
<a href='../class/Node.html#addChild-dynamic'>#addChild</a>
<a href='../class/Node.html#getOpener-dynamic'>#getOpener</a>
<a href='../class/Node.html#getCloser-dynamic'>#getCloser</a>
<a href='../class/Node.html#isPreserved-dynamic'>#isPreserved</a>
<a href='../class/Node.html#isCommented-dynamic'>#isCommented</a>
<a href='../class/Node.html#markText-dynamic'>#markText</a>
<a href='../class/Node.html#markRunningCode-dynamic'>#markRunningCode</a>
<a href='../class/Node.html#markInsertingCode-dynamic'>#markInsertingCode</a>
<a href='../class/Node.html#evaluate-dynamic'>#evaluate</a>
<a href='../class/Node.html#render-dynamic'>#render</a>
</p>
</h2>
<h2>Instance Method Details</h2>
<div class='methods'>
<div class='method_details'>
<p class='signature' id='evaluate-dynamic'>
#
(void)
<b>evaluate</b><span>()</span>
<br>
</p>
<div class='docstring'>
<p>Evaluate the node content and store the opener tag
and the closer tag if applicable.</p>
</div>
<div class='tags'>
</div>
</div>
<div class='method_details'>
<p class='signature' id='parseExpression-dynamic'>
#
(Object)
<b>parseExpression</b><span>(exp)</span>
<br>
</p>
<div class='docstring'>
<p>Parses the expression and detect the tag, attributes
and any assignment. In addition class and id cleanup
is performed according the the Haml spec:</p><ul>
<li>Classes are merged together</li>
<li>When multiple ids are provided, the last one is taken, except they are defined in shortcut notation and attribute notation. In this case, they will be combined, separated by underscore.</li>
</ul>
<div class='examples'>
<h3>Examples:</h3>
<h4>
Id merging
</h4>
<pre><code class='coffeescript'>#user{ :id =&gt; @user.id } =&gt; &lt;div id=&#39;user_#{ @user.id }&#39;&gt;&lt;&#47;div&gt;</code></pre>
</div>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>exp</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>the HAML expression </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>Object</tt>
)
&mdash;
<span class='desc'>the parsed tag and options tokens </span>
</li>
</ul>
</div>
</div>
<div class='method_details'>
<p class='signature' id='parseTag-dynamic'>
#
(Object)
<b>parseTag</b><span>(exp)</span>
<br>
</p>
<div class='docstring'>
<p>Parse a tag line. This recognizes DocType tags <code>!!!</code> and
HAML tags like <code>#id.class text</code>.</p><p>It also parses the code assignment <code>=</code>, <code>}=</code> and <code>)=</code> or
inline text and the whitespace removal markers <code>&lt;</code> and <code>&gt;</code>.</p><p>It detects an object reference <code>[</code> and attributes <code>(</code> / <code>{</code>.</p>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>exp</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>the HAML expression </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>Object</tt>
)
&mdash;
<span class='desc'>the parsed tag tokens </span>
</li>
</ul>
</div>
</div>
<div class='method_details'>
<p class='signature' id='parseAttributes-dynamic'>
#
(Object)
<b>parseAttributes</b><span>(exp)</span>
<br>
</p>
<div class='docstring'>
<p>Parse attributes either in Ruby style <code>%tag{ :attr =&gt; &#39;value&#39; }</code>
or HTML style <code>%tag(attr=&#39;value)</code>. Both styles can be mixed:
<code>%tag(attr=&#39;value){ :attr =&gt; &#39;value&#39; }</code>.</p><p>This takes also care of proper attribute interpolation, unwrapping
quoted keys and value, e.g. <code>&#39;a&#39; =&gt; &#39;hello&#39;</code> becomes <code>a =&gt; hello</code>.</p>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>exp</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>the HAML expression </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>Object</tt>
)
&mdash;
<span class='desc'>the parsed attributes </span>
</li>
</ul>
</div>
</div>
<div class='method_details'>
<p class='signature' id='buildHtmlTagPrefix-dynamic'>
#
(String)
<b>buildHtmlTagPrefix</b><span>(tokens)</span>
<br>
</p>
<div class='docstring'>
<p>Build the HTML tag prefix by concatenating all the
tag information together. The result is an unfinished
html tag that must be further processed:</p><p>The Haml spec sorts the <code>class</code> names, even when they
contain interpolated classes. This is supported by
sorting classes at template render time.</p><p>If both an object reference and an id or class attribute is defined,
then the attribute will be ignored.</p>
<div class='examples'>
<h3>Examples:</h3>
<h4>
Prefix tag
</h4>
<pre><code class='coffeescript'>&lt;a id=&#39;id&#39; class=&#39;class&#39; attr=&#39;value&#39;</code></pre>
<h4>
Template render time sorting
</h4>
<pre><code class='coffeescript'>&lt;p class=&#39;#{ [@user.name(), &#39;show&#39;].sort().join(&#39; &#39;) }&#39;&gt;</code></pre>
</div>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>tokens</span>
<span class='type'>
(
<tt>Object</tt>
)
</span>
&mdash;
<span class='desc'>all parsed tag tokens </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>String</tt>
)
&mdash;
<span class='desc'>the tag prefix </span>
</li>
</ul>
</div>
</div>
<div class='method_details'>
<p class='signature' id='interpolateCodeAttribute-dynamic'>
#
(String)
<b>interpolateCodeAttribute</b><span>(text, unwrap = false)</span>
<br>
</p>
<div class='docstring'>
<p>Wrap plain attributes into an interpolation for execution.
In addition wrap it into escaping and cleaning function,
depending on the options.</p>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>text</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>the possible code </span>
</li>
<li>
<span class='name'>unwrap</span>
<span class='type'>
(
<tt>Boolean</tt>
)
</span>
&mdash;
<span class='desc'>unwrap static text from quotes </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>String</tt>
)
&mdash;
<span class='desc'>the text of the wrapped code </span>
</li>
</ul>
</div>
</div>
<div class='method_details'>
<p class='signature' id='quoteAndEscapeAttributeValue-dynamic'>
#
(String)
<b>quoteAndEscapeAttributeValue</b><span>(value, code = false)</span>
<br>
</p>
<div class='docstring'>
<p>Quote the attribute value, depending on its
content. If the attribute contains an interpolation,
each interpolation will be cleaned and/or escaped,
depending on the compiler options.</p>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>value</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>the without start and end quote </span>
</li>
<li>
<span class='name'>code</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>if we are in a code block </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>String</tt>
)
&mdash;
<span class='desc'>the quoted value </span>
</li>
</ul>
</div>
</div>
<div class='method_details'>
<p class='signature' id='splitInterpolations-dynamic'>
#
(Array&lt;String&gt;)
<b>splitInterpolations</b><span>(value)</span>
<br>
</p>
<div class='docstring'>
<p>Split expression by its interpolations.</p>
<div class='examples'>
<h3>Examples:</h3>
<h4>
</h4>
<pre><code class='coffeescript'>&#39;Hello #{ &quot;#{ soso({}) }&quot; } Interpol&#39;) =&gt; [&quot;Hello &quot;, &quot;#{ &quot;#{ soso({}) }&quot; }&quot;, &quot; Interpol&quot;]
&#39;Hello #{ &quot;#{ soso }&quot; } Interpol&#39;) =&gt; [&quot;Hello &quot;, &quot;#{ &quot;#{ soso }&quot; }&quot;, &quot; Interpol&quot;]
&#39;Hello #{ int } Interpol&#39;) =&gt; [&quot;Hello &quot;, &quot;#{ int }&quot;, &quot; Interpol&quot;]
&#39;Hello Interpol&#39;) =&gt; [&quot;Hello Interpol&quot;]
&#39;#{ int } Interpol&#39;) =&gt; [&quot;#{ int }&quot;, &quot; Interpol&quot;]
&#39;Hello #{ int }&#39;) =&gt; [&quot;Hello &quot;, &quot;#{ int }&quot;]
&#39;#{ int }&#39;) =&gt; [&quot;#{ int }&quot;]</code></pre>
</div>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>value</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>the attribute value </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>Array&lt;String&gt;</tt>
)
&mdash;
<span class='desc'>the splitted string </span>
</li>
</ul>
</div>
</div>
<div class='method_details'>
<p class='signature' id='buildDocType-dynamic'>
#
(String)
<b>buildDocType</b><span>(doctype)</span>
<br>
</p>
<div class='docstring'>
<p>Build the DocType string depending on the <code>!!!</code> token
and the currently used HTML format.</p>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>doctype</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>the HAML doctype </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>String</tt>
)
&mdash;
<span class='desc'>the HTML doctype </span>
</li>
</ul>
</div>
</div>
<div class='method_details'>
<p class='signature' id='isNotSelfClosing-dynamic'>
#
(Boolean)
<b>isNotSelfClosing</b><span>(tag)</span>
<br>
</p>
<div class='docstring'>
<p>Test if the given tag is a non-self enclosing tag, by
matching against a fixed tag list or parse for the self
closing slash <code>/</code> at the end.</p>
</div>
<div class='tags'>
<h3>Parameters:</h3>
<ul class='param'>
<li>
<span class='name'>tag</span>
<span class='type'>
(
<tt>String</tt>
)
</span>
&mdash;
<span class='desc'>the tag name without brackets </span>
</li>
</ul>
<h3>Returns:</h3>
<ul class='return'>
<li>
<span class='type'></span>
(
<tt>Boolean</tt>
)
&mdash;
<span class='desc'>true when a non self closing tag </span>
</li>
</ul>
</div>
</div>
</div>
</div>
<div id='footer'>
August 12, 14 06:33:02 by
<a href='https://github.com/coffeedoc/codo' title='CoffeeScript API documentation generator'>
Codo
</a>
2.0.9
&#10034;
Press H to see the keyboard shortcuts
&#10034;
<a href='http://twitter.com/netzpirat' target='_parent'>@netzpirat</a>
&#10034;
<a href='http://twitter.com/_inossidabile' target='_parent'>@_inossidabile</a>
</div>
<iframe id='search_frame'></iframe>
<div id='fuzzySearch'>
<input type='text'>
<ol></ol>
</div>
<div id='help'>
<p>
Quickly fuzzy find classes, mixins, methods, file:
</p>
<ul>
<li>
<span>T</span>
Open fuzzy finder dialog
</li>
</ul>
<p>
Control the navigation frame:
</p>
<ul>
<li>
<span>L</span>
Toggle list view
</li>
<li>
<span>C</span>
Show class list
</li>
<li>
<span>I</span>
Show mixin list
</li>
<li>
<span>F</span>
Show file list
</li>
<li>
<span>M</span>
Show method list
</li>
<li>
<span>E</span>
Show extras list
</li>
</ul>
<p>
You can focus and blur the search input:
</p>
<ul>
<li>
<span>S</span>
Focus search input
</li>
<li>
<span>Esc</span>
Blur search input
</li>
</ul>
</div>
</body>
</html>
View Git Blame Copy Permalink