Skip to content

Instantly share code, notes, and snippets.

@lazd

lazd/domly-example.html

Created February 25, 2014 06:42
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save lazd/9203956 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save lazd/9203956 to your computer and use it in GitHub Desktop.
Download ZIP
DOMly Example
Raw
domly-example.html
<div>
<h1>Category: {{data.category}}</h1>
<if data.items.length>
<ul>
<foreach data.items>
<li>
<h2>{{parent.category}}: {{data.name}}</h2>
<h3 if-data.sale='class="sale"'>{{data.rice}}</h3>
<h3>{{formatCount(data.stockCount)}} in stock</h3>
<button unless-data.stockCount='disabled="disabled"'>Buy now</button>
</li>
</foreach>
</ul>
<else>
<p>This category is empty.</p>
</if>
</div>
@nfroidure
Copy link

nfroidure commented Feb 25, 2014

It was my idea, but never implemented.

<!DOCTYPE html>
<html data-tpl-att-lang="{document.lang}">

    <head data-tpl-include="/head.tpl">
    </head>

    <!-- data-tpl-att-([a-Z0-9]+) : Set an attribute if value is defined -->
    <body data-att-class="document.class">
        <!-- data-tpl-scope : the template scope is set by a URI -->
        <!-- data-tpl-if : process the element instructions only if evaluate to true -->
        <!-- data-tpl-loop : the element itself is repeated -->
        <div data-tpl-scope="/db/blog/posts.dat" data-tpl-if="posts.length" data-tpl-loop="posts">
            <article>
         <!-- data-tpl-cdata : the value contains only character datas -->
                 <h1 data-tpl-cdata="posts:title"></h1>
                 <p data-tpl-cdata="posts:description"></p>
         <!-- data-tpl-pcdata : the value can contain some HTML markup -->
                 <p data-tpl-pcdata="posts:content"></p>
                 <p><a data-tpl-att-href="posts:href"
                    data-tpl-att-title="i18n.read_link_title"
                    data-tpl-cdata="i18n.read_link">
                </a></p>
            </article>
        </div>
        <!-- data-tpl-inloop : the element child nodes are repeated -->
        <!-- data-tpl-silent : the element is removed after processing -->
        <div data-tpl-inloop="document.scripts" data-tpl-silent="true">
            <script data-tpl-att-type="document.scripts:type" data-tpl-src="document.scripts:url"></script>
            <noscript data-tpl-cdata="@document.scripts:noscript@"></noscript>
        </div>
    </body>
</html>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment