[major] choo v4 (#352)

* location: change url on location:setLocation - [ ] don't break hashing - [ ] allow not changing the url fixup! move fns around fixup! add search string * app.start: clean * walk: add * location: update arg calls * fixup! location: update * uri-wrap: fix thunking * router: update to latest sheet-router (#239) * router: update to latest sheet-router * tests: fix for latest version * tests: fix SSR * tests: fix history * tests: spruce up * docs: update example * examples: update * deps: bump sheet-router * 4.0.0-0 * chore(changelog): 4.0.0 (#211) * feat(api:) arg order (#268) * s/data, state/state, data/ * feat(api): swap arguments * fix(href): fix routing (#271) * feat(http): remove (#269) * feat(router): enable hash routing (#273) * deps: fix mount * 4.0.0-1 * feat(mount): copy {script,link} tags * 4.0.0-2 * fix(mount): forEach -> for Lol can't use forEach * fix(router): use state.location.href (#282) * fix(mount): use deep node clone * 4.0.0-3 * fix(deps): remove hash-match * 4.0.0-4 * fix(mount): return node * 4.0.0-5 * fix(router): check if a hash is a valid selector (#339) * 4.0.0-6 * fix(router): pass params on newstate (#343) * 4.0.0-7 * feat(docs): update for 4.0.0 (#320) * feat(docs): update for 4.0.0 * docs: update router example in readme (#337) * chore(changelog): update for v4 (#351)
2016-12-11 19:35:29 +01:00
parent 54b6000800
commit a7916ec3f9
30 changed files with 569 additions and 503 deletions
@@ -1,43 +1,38 @@
 <html>
-    <head>
-        <title>Vanilla example</title>
-    </head>
-    <body>
-        <script src="../../dist/choo.min.js"></script>
-        <script src="../../dist/html.min.js"></script>
-        <script>
-            const app = choo()
+  <head>
+      <title>Vanilla example</title>
+  </head>
+  <body>
+    <script src="../../dist/choo.min.js"></script>
+    <script src="../../dist/html.min.js"></script>
+    <script>
+      const app = choo()

-            app.model({
-              namespace: 'counter',
-              state: {
-                  count: 0
-              },
-              reducers: {
-                increment: (data, state) => ({count: state.count + 1}),
-                decrement: (data, state) => ({count: state.count - 1})
-              }
-            })
+      app.model({
+        namespace: 'counter',
+        state: { count: 0 },
+        reducers: {
+          increment: (state, data) => ({count: state.count + 1}),
+          decrement: (state, data) => ({count: state.count - 1})
+        }
+      })

-            const mainView = (state, prev, send) => {
-              return html`
-                <main class="app">
-                  <h1>Counter example</h1>
-                  <div>
-                      Count: ${state.counter.count}
-                      <button onclick=${(e) => send('counter:increment')}>+</button>
-                      <button onclick=${(e) => send('counter:decrement')}>-</button>
-                  </div>
-                </main>
-              `
-            }
+      const mainView = (state, prev, send) => {
+        return html`
+          <main class="app">
+            <h1>Counter example</h1>
+            <div>
+                Count: ${state.counter.count}
+                <button onclick=${(e) => send('counter:increment')}>+</button>
+                <button onclick=${(e) => send('counter:decrement')}>-</button>
+            </div>
+          </main>
+        `
+      }

-            app.router((route) => [
-              route('/', mainView)
-            ])
-
-            const tree = app.start()
-            document.body.appendChild(tree)
-        </script>
-    </body>
+      app.router(['/', mainView])
+      const tree = app.start()
+      document.body.appendChild(tree)
+    </script>
+  </body>
 </html>