dt-dom

Δt DOM Adapter

This is an DOM Adapter for Δt.

It listen on the template events and writes to the DOM.

→ Check out the demo!

Installation

$ npm install dt-dom

How this Adapter works:

<script src="dt-dom.browser.js"></script>
<scipt>
    var domify = window.dynamictemplate.domify; // get the dom adapter
</script>

Just throw your template in and add it to the DOM when it's ready:

var tpl = domify(template(mydata));
tpl.ready(function () {
    tpl.dom.forEach(function (child) {
        document.getElementById('#container').appendChild(child);
    });
});

Documentation

domify(tpl)

tpl = domify(new dynamictemplate.Template)

Expects a fresh Δt template instance (fresh means, instantiated in the same tick to prevent event loss).

It just simply listen for a bunch of events to manipulate the DOM.

Uses requestAnimationFrame for heavy DOM manipulation like node insertion and node deletion.

---

Overrides the query method of the async XML Builder.

For query type text it returns the result of textContent.

For query type attr it returns the result of getAttribute.

For query type tag it returns a dummy object that it will receive again on an add event.