Settle down on initialization API

[yyx990803]

General Thoughts

• Allow component encapsulation and easy reuse.
• Flexible while not being too confusing
• a defined VM constructor should not be able to use a different template for consistency. (i.e. when you new something, it should always look the same) If you want the same logic but a different template, you should extend it as a new VM constructor. Therefore, no more sd-template
• If you want to inline a template you should use sd-partial.
• add seed.vm('id', VM) so it can be used inline via sd-vm, id should be no longer an init option.
• add seed.partial('id', 'partial')

Options Spec for seed.ViewModel.extend

• el
  • if present
    • if string: querySelector
    • if node: use as is
  • if not
    • create per tagName
  • apply elProps/className etc
• template
  • if present
    • if starts with '#': getElementById
    • else: use as is
    • replace current el innerHTML
• id, className, attributes: stuff to add to el (same as Backbone)
• init: init function to call when instantiating
• props: stuff that will be put onto the constructor's prototype
• data: stuff that will be copied to each instance

Tentative

How can we allow access to nested component VMs in code, while allowing declarative compositing in markup?

• directives: hash of directives to register
• filters: hash of filter functions to register
• vms: hash of VM constructors to register
• partials: private partials that can be used in the template

References

Currently I'm torn on how the final API should look like. There are three main references: Angular, Backbone & Ractive.

Angular

Markup everything, define everything, bootstrap() once
Declarative

Backbone

Creates .el if not exist using options like tagName, properties, etc...

Ractive

Takes a string template, also allows inline by treating it as an ID if it starts with '#'