attain - npm Package Compare versions

Comparing version 0.0.50 to 0.0.51

docs/examples.js

@@ -37,2 +37,4 @@ import V from './lib/view.js'
 
+							const dontCache = '?'+Date.now()
+
 							route.fold({
@@ -42,5 +44,5 @@ // these won't exist at bundle time...
 								TapePlayer: () => 
-									v.request('/examples/tape-player.js', { extract: x => x.responseText }),
+									v.request('/examples/tape-player.js?'+dontCache, { extract: x => x.responseText }),
 								TodoMVC: () => 
-									v.request('/examples/todo-mvc.js', { extract: x => x.responseText }),
+									v.request('/examples/todo-mvc.js?'+dontCache, { extract: x => x.responseText }),
 								List: () => Promise.resolve('')
@@ -47,0 +49,0 @@ }) (route())

docs/examples/tape-player.js

 /* globals v */
-function render({ v }){
-    return v('h1', 'hi')
-}
-
-v(document.body, { render })
+function app({ v, route }){
+  
+    route=
+      // our state machine is a router
+      // might be a bad idea, we'll see...
+      route.subroute('TapePlayer', x => x.Stopped({ time: 0 }), {
+        Stopped: '/stopped/:time',
+        Playing: '/playing/:time',
+        Paused: '/paused/:time',
+        FF: '/ff/:time',
+        RW: '/rw/:time'
+      })
+      
+    // tell me that's not the coolest thing ever
+    const time = route.value.time
+    
+    return v('.app'
+      + v.css`
+        background-color rgba(0,0,0,0.05)
+        p 1em
+        ff Helvetica
+      `
+      , v('.player'
+        + v.css(`
+          bc white
+          br 0.25em
+          p 1em
+          min-height: 400px;
+          box-shadow 0px 0px 2px 1px rgba(0,0,0,0.1)
+          d grid
+        `)
+        , v('h1', time())
+        , v('.time'
+          + v.css`
+            d grid
+            bc #EEE
+            border-radius: 1em
+            padding 1em
+            display grid
+            gtc 1fr 1fr
+          `   
+          , v('.time-remaining'
+            + v.css`
+              border-radius: 100%;
+              width: 4em;
+              height: 4em;
+              bc rgba(170, 170, 180, 1); // close enough
+              justify-self center;  
+              align-self center;
+            `   
+          )
+          , v('.time-elapsed'
+            + v.css`
+              border-radius: 100%;
+              width: 4em;
+              height: 4em;
+              bc rgba(170, 170, 180, 1); // close enough
+              justify-self center;
+              align-self center;
+            `   
+          )
+          , v('.controls'
+            + v.css`
+              bc red
+            `
+            , v('h1', 'Scotty')
+          )
+        )
+      )
+    
+    )
+  }
+  
+v(document.body, { render: app })

package.json

 {
   "name": "attain",
-  "version": "0.0.50",
+  "version": "0.0.51",
   "description": "A library for modelling and accessing data.",
@@ -5,0 +5,0 @@ "main": "dist/attain.min.js",

No alert changes

Improved metrics

Total package byte prevSize

519393

increased by0.34%

Lines of code

3976

increased by1.69%

No dependency changes