penjs

penjs

Mobile-web small development framework.

API

constructer

function penjs(element, options) {}

Example

<div id="app">
  <script type="text/jhtmls">
    var info = {
      createCount: 0,
      destroyCount: 0,
    }
    <h1>jhtmls -- #{title} -- #{time}</h1>
    <h3 :bind="info">create #{info.createCount} destroy: #{info.destroyCount}</h3>
    var asc = 1;
    <button @tap="now()">now</button>
    <button @tap="ajax()">ajax</button>
    <button @tap="sort(items, asc = -asc)">sort</button>
    <button @tap="push(items)">push</button>
    <ul :bind="items">
      items.forEach(function (item) {
      <li :bind="item" @create="info.createCount++" @destroy="info.destroyCount++">
        if (item.editing === 'jhtmls') {
          <input type="text"
            :value="item.title"
            @create="this.focus();"
            @keydown.enter="this.blur();"
            @focusout="item.title = this.value; item.editing = false;">
        } else {
          <span @dblclick="item.editing = 'jhtmls'">#{item.title}</span>
          <button @tap="remove(items, item)">remove</button>
        }
      </li>
      });
    </ul>
  </script> 
</div>

License

MIT © zswang