plastiq-router/test.js

model driven router for plastiq

var plastiq = require('plastiq');
var h = plastiq.html;
var router = require('./index2');
var routes = require('./routes');

router.start(router.hash);

var model = {};

function render() {
  return h('div',
    routes.root(function () {
      return [
        h('h1', 'hi'),
        h('a', {href: routes.report({reportId: '5'}).href, onclick: routes.report({reportId: '5'}).push}, 'report 5'),
        ' ', 
        routes.map({x: 5, y: 6}).a({class: 'box'}, 'map', ' 5,6'),
        ' ', 
        h('a', {href: '/404', onclick: function (ev) {
          ev.preventDefault();
          history.pushState(undefined, undefined, '/404');
        }}, '404'),
        ' ',
        routes.school({school: 'abc'}).a('school abc')
      ];
    }),
    routes.report(function (params) {
      return [
        h('h1', 'report: ', params.reportId),
        h('button', {onclick: function () {}}, 'refresh')
      ];
    }),
    routes.map({x: [model, 'x'], y: [model, 'y']}, function () {
      return h('div',
        h('input', {type: 'text', binding: [model, 'x']}),
        h('input', {type: 'text', binding: [model, 'y']}),
        h('button', {onclick: function () {}}, 'refresh'),
        routes.root().a('root')
      );
    }),
    routes.student(function (params) {
      return [
        h('h1', 'school: ' + params.school),
        h('h1', 'student: ' + params.student)
      ];
    }),
    routes.school(function (params) {
      return [
        h('h1', 'school: ' + params.school),
        routes.student({school: params.school, student: 'blash'}).a('blash')
      ];
    }),
    router.notFound(function (url) {
      return [
        h('h1', '404'),
        h('code', url)
      ];
    })
  );
}

plastiq.append(document.body, render, model);