File	Date	Author	Commit
in other languages	2013-03-19	Martin Insulander	[76eae1] Initial commit
lib.js	2013-03-19	Martin Insulander	[76eae1] Initial commit
readme.txt	2013-03-19	Martin Insulander	[48131a] lade över all hjälp till readme.txt-filen
tedo04.js	2013-04-21	Martin Insulander	[d0d695] fixed ticked #1 with html-order when adding alt...
tedo04.test.html	2013-04-21	Martin Insulander	[0308f8] Clearer test for adding mixed alternatives
tedo05.changelog	2013-04-23	Martin Insulander	[4a97d4] added new api

Read Me

TEDO
###################

template engine document oriented


Create a template
===================

A template has a data attribute and the class tedo. For example:
<div data-tedo=my_template_name class='tedo myclass'></div>

different data attributes can change the behavior of the template.
The ones available are:
 * data-tedo
 * data-tedo_show
 * data-tedos
 * data-tedos_alt

future planed attributes are
 * data-tedo_clone for reusing of templates
 * data-tedos_prefilled to let data be in the document from the beginning
 
data-tedo, data-tedo_show
----------------------------

Use this template type to get an easy way to access a node and it's
attributes. If the tedo_show version is used, the template is shown
(realized) at start (or when it's parent is realized), else it is not
added to the DOM.


data-tedos
----------------------------

This template type is used to create lists.
It holds a a list of realizations, meaning you can add multiple
elements of the same template after each other.


data-tedos_alt
----------------------------

By adding this to the normal list type you can create alternative
templates to use for different entries (realizations) in the same list
(in any order).
Use the data-tedos attribute for the name of the list and 
data-tedos_alt for the name of the alternative. The alternatives have
to have the same list name (data-tedos) and be sibblings (only whitespaces between).

An example:
<img class="tedo" data-tedos=entry data-tedos_alt=img>
<video class="tedo" data-tedos=entry data-tedos_alt=video></video>



Initiate tedo
===================

Call _init to initialize tedo. Then tedo will create templates for
all nodes with the tedo class.

For example:
   window.addEventListener('load',function(){
      tedo._init();
   },false);



Realize templates
===================

To add a new node from a template, use for example:
tedo.list_template.addLast();

If the list has alternatives use:
tedo.entry.img.addFirst();

To access an previously realized element:
tedo.list_template[0].set({'text':'text updated'});
first_img_video_entry = tedo.entry[0]



Functions
====================

Not all functions are implemented an tested yet!
'data' is used for adding data to the element, description below.

functions for a single template
tedo.single.show(data)
tedo.single.hide()
tedo.single.set(data)

functions for a list template (a realisator):
tedo.template.addFirst(data)
tedo.template.addLast(data)
tedo.template.addIndex(data)
tedo.template.addBefore(node,data) // node or template?
tedo.template.addAfter(node,data) // node or template?
tedo.template.removeFirst()
tedo.template.removeLast()
tedo.template.remove(i)
tedo.template.removeAll()
tedo.template[i]


functions for an entry (a realisation):
tedo.template[i].set(data)
tedo.template[i].remove()

if two templates are alternatives to each other
tedo.alt1, tedo.alt2,
all functions will act on a common list of objects
if tedo.alt1.addIndex(i) and tedo.alt2.addIndex(i)
then tedo[i] will be of type alt2
tedo.alt2.removeAll() empties both alt1 and alt2.


structure of data 
=========================

the 'data' object sets preferences for an realisation,
and optionally it's children
data={
   //any of the following settings
   'att':{ 'attribute name, ex src':'value' },
   'text':'replace content with this text',
   'add_classes':['classname'],
   'remove_classes':['classname'],
   'children':{ child_id:data, },
}


naming limitations
=================================

tedo object id has some limits:
string, not start with a number or underscore and
not be a predefined function, for example set or addFirst
or prototype or constructor