Merge branch 'master' of https://github.com/hville/js-framework-benchmark into hville-master

Author: krausest

frameworks/keyed/attodom/index.js

@@ -1,20 +1,9 @@
 /*eslint indent: ["warn", 2, { "VariableDeclarator": 2 }]*/
 
-var el = require('attodom/el'),
-    core = require('attodom/core'),
-    Store = require('./src/store'),
-    menu = require('./src/menu'),
-    table = require('./src/table')
+var Store = require('./src/store'),
+    View = require('./src/view')
 
-core.store = new Store
-core.update()
+var view = View(new Store)
+view.update()
 
-document.body.appendChild(
-  el('div', {id: 'main'},
-    el('div', {class: 'container'},
-      menu,
-      table,
-      el('span', {class: 'preloadicon glyphicon glyphicon-remove', 'aria-hidden': ''})
-    )
-  )
-)
+document.body.appendChild(view)

frameworks/keyed/attodom/package.json

@@ -1,7 +1,7 @@
 {
-  "name": "js-framework-benchmark-attodom-v0.5.2",
-  "version": "0.1.0",
-  "description": "Benchmark for attoDom 0.5.2",
+  "name": "js-framework-benchmark-attodom-v0.9.0",
+  "version": "0.9.0",
+  "description": "Benchmark for attoDom 0.9.0",
   "js-framework-benchmark": {
     "frameworkVersionFromPackage": "attodom"
   },
@@ -22,6 +22,6 @@
     "uglify-js": "3.0.12"
   },
   "dependencies": {
-    "attodom": "0.6.1"
+    "attodom": "0.9.0"
   }
 }

frameworks/keyed/attodom/src/create-row.js

@@ -0,0 +1,79 @@
+/*eslint indent: ["warn", 2, { "VariableDeclarator": 2 }]*/
+var h = require('attodom/el'),
+    list = require('attodom/list'),
+    t = require('attodom/text')
+
+var TITLE = 'attodom v0.9.0'
+
+module.exports = function(store) {
+  function clickHandlerMenu(e) {
+    var key = e.target.id
+    if (key) {
+      e.preventDefault()
+      store[key === 'runlots' ? 'runLots' : key === 'swaprows' ? 'swapRows' : key]()
+      rows.update(store.data)
+    }
+  }
+  function updateRow(v) {
+    this.$label.data = v.label
+    this.className = (this.id === store.selected) ? 'danger' : ''
+  }
+  function clickHandlerSelect(e) {
+    e.preventDefault()
+    store.select(this.parentNode.id)
+    rows.update(store.data)
+  }
+  function clickHandlerDelete(e) {
+    e.preventDefault()
+    store.delete(+this.parentNode.id)
+    rows.update(store.data)
+  }
+
+  var rows = list('id', function(rec) {
+    var attr = {id: rec.id, update: updateRow, $label: t(rec.label)}
+    return h('tr', attr,
+      h('td', {class: 'col-md-1'}, rec.id),
+      h('td', {class: 'col-md-4', onclick: clickHandlerSelect},
+        h('a', {class: 'lbl'}, attr.$label)
+      ),
+      h('td', {class: 'col-md-1', onclick: clickHandlerDelete},
+        h('a', {class: 'remove'},
+          h('span', {class: 'glyphicon glyphicon-remove remove', 'aria-hidden': ''})
+        )
+      ),
+      h('td', {class: 'col-md-6'})
+    )
+  })
+
+  return h('div', {id: 'main', update: function() { rows.update(store.data) }},
+    h('div', {class: 'container'},
+      h('div', {class: 'jumbotron'},
+        h('div', {class: 'row'},
+          h('div', {class: 'col-md-6'},
+            h('h1', TITLE)
+          ),
+          h('div', {class: 'col-md-6'},
+            h('div', {class: 'row', onclick: clickHandlerMenu},
+              button('run', 'Create 1,000 rows'),
+              button('runlots', 'Create 10,000 rows'), //TODO error
+              button('add', 'Append 1,000 rows'),
+              button('update', 'Update every 10th row'),
+              button('clear', 'Clear'),
+              button('swaprows', 'Swap Rows')
+            )
+          )
+        )
+      ),
+      h('table', {class: 'table table-hover table-striped test-data'},
+        h('tbody', {id: 'tbody'}, rows)
+      ),
+      h('span', {class: 'preloadicon glyphicon glyphicon-remove', 'aria-hidden': ''})
+    )
+  )
+}
+
+function button(id, tx) {
+  return h('div', {class: 'col-sm-6 smallpad'},
+    h('button', {id: id, class: 'btn btn-primary btn-block', type: 'button'}, tx)
+  )
+}