README

domjs-site-tree

Domjs based SiteTree

DomjsSiteTree allows configuration of SiteTree's with domjs style templates.

Basic example:

Let's say we have follwing domjs view files:

base.js

exports.title = "SitTree test page";

exports.head = function () {
  link({ rel: 'icon', href: '/favicon.png' });
  link({ rel: 'stylesheet', href: '/style.css' });
}

exports.body = function () {
  header(nav(ul(
    li(a({ href: '/' }, "Main page"))
  )));
  main();
  footer(p('© footer example'));
}

homepage.js

exports._parent = require('./base');
exports.main = function () {
  h1("Homepage of SiteTree demo");
  p("Homepage content ...");
}

subpage.js

exports._parent = require('./base');
exports.main = function () {
  h1("Subpage of SiteTree demo");
  p("Subpage content ...");
}

SiteTree configuration may look as:

var DomjsSiteTree = require('domjs-site-tree');
var Domjs = require('domjs');
var domjs = new Domjs(document);

// Initialize SiteTree instance:
var siteTree = new DomjsSiteTree(domjs);

// Retrieve view nodes:
var homepageView = require('./homepage');
var subpageView = require('./subpage');


// Switch between views in document:
// Present homepage
siteTree.load(homepageView);

// Switch to subpage
siteTree.load(subpageView);

// Switch back to homepage
siteTree.load(homepageView)

Installation

$ npm install domjs-site-tree

API

new DomjsSiteTree(domjs)

var DomjsSiteTree = require('domjs-site-tree');
var Domjs = require('domjs');

var domjs = new Domjs(document);

var siteTree = new DomjsSiteTree(domjs);

On initialization Domjs instance needs to be provided.

Templates format

DomjsSiteTree templates can be provided in a form of:

functions, where content should be built using domjs element constructors (DocumentFragment will automatically be resolved via domjs)
strings, which will be treated as plain text (not HTML) content for addressed elements.

For detailed documentation of configuration of SiteTree, please refer to SiteTree documentation

Tests

$ npm test

Usage no npm install needed!