Skip to content

0.2.3 usage elements

Jump to bottom
Ivan S Glazunov edited this page Feb 20, 2015 · 4 revisions

OSWS Templates 0.2.3

Elements?

Elements are called heirs extensions of Prototype.

We recommend the following elements:

content

[new] (...arguments: Array<TData>) => this;

Data management without the container tag.

var content = Templates.content;

content('content').render(console.log); // content
singles

[new] (...arguments: Array<IAttributes|TSelector>) => this;

Collection of single tags.

var singles = Templates.singles;
var img = singles.img;

img('.radius').render(console.log); // <img class="radius"/>
img('.radius[src=image.jpg]').render(console.log); // <img class="radius" src="image.jpg"/>
img('.radius', { src: 'image.jpg' }).render(console.log); // <img class="radius" src="image.jpg"/>
content(img).render(console.log); // <img/>
content(img('.radius')).render(console.log); // <img class="radius"/>
doubles

[new] (...arguments: Array<IAttributes|TSelector>) => .content => this;

Collection of double tags.

var doubles = Templates.doubles;
var div = doubles.div;

div('.container')('content').render(console.log); // <div class="container">content</div>
content(div('.container')).render(console.log); // <div class="container"></div>
content(div).render(console.log); // <div></div>
doctypes

[new] (...arguments: Array<IAttributes|TSelector>) => this;

Collection doctype tag.

var doctype = Templates.doctypes;

content(doctype.html).render(console.log); // <!DOCTYPE html>
doctype.html().render(console.log); // <!DOCTYPE html>
doctype.html('[PUBLIC]').render(console.log); // <!DOCTYPE html PUBLIC>
doctype.html({ PUBLIC: null }).render(console.log); // <!DOCTYPE html PUBLIC>

JavaScript:

var w = Templates.with;
var content = w.content, doctype = w.doctype, html = w.html, head = w.head, title = w.title, body = w.body, div = w.div;

content(
    doctype.html,
    html()(
        head()(title()('Example')),
        body()(div('.container')(div()('Example'))
    )
).render(console.log);

CoffeeScript:

{content, doctype, html, head, title, body, div} = Templates.with

content(
    doctype.html
    html()(
        head() title() 'Example'
        body() div('.container') div() 'Example'
    )
).render console.log

HTML:

<!DOCTYPE html>
<html>
    <head>
        <title>Example</title>
    </head>
    <body>
        <div class="container">
            <div>Example</div>
        </div>
    </body>
</html>

< 0.2.3 | Attributes? >

Latest Stable Release

Versions

0.3.0

Types

API

Node.js:

var T = require('oswst');

Require.js:

define(['oswst'], function(T) {});

window:

var T = window.oswst(_, async);
Clone this wiki locally