Thanood · June 26, 2017 18:31 · Jun 26, 2017 · Jun 26, 2017 · Jun 26, 2017 · Jun 26, 2017
diff --git a/_tips.md b/_tips.md
@@ -1,12 +0,0 @@
-#### tab targetting
-
-To enable the datepicker to become a valid tab target (as in: responds to the correct tab order),
-set the container to be the parent of the datepicker input. Like this:
-
-```js
-  <div ref="dpWrapper">
-    <input md-datepicker="container.bind: dpWrapper; value.two-way: selectedDate;" type="date" placeholder="pick a date" />
-  </div>
-
-```
-

diff --git a/app.html b/app.html
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <input md-timepicker value.two-way="time" placeholder="pick a date" />
+    <input md-timepicker="value.bind: time;" placeholder="pick a date" />
   </div>
   <div>
     <button md-button click.delegate="setTime()">set time</button>

diff --git a/app.html b/app.html
@@ -1,11 +1,11 @@
 <template>
   <div>
-    <input md-timepicker value.bind="time" placeholder="pick a date" />
+    <input md-timepicker value.two-way="time" placeholder="pick a date" />
   </div>
   <div>
     <button md-button click.delegate="setTime()">set time</button>
   </div>
   <div>
-    <span if.bind="time">You selected (UTC time): ${time | stringify}</span>
+    <span if.bind="time">You selected: ${time | stringify}</span>
   </div>
 </template>
diff --git a/app.html b/app.html
@@ -6,6 +6,6 @@
     <button md-button click.delegate="setTime()">set time</button>
   </div>
   <div>
-    <span if.bind="selectedTime">You selected (UTC time): ${selectedTime | stringify}</span>
+    <span if.bind="time">You selected (UTC time): ${time | stringify}</span>
   </div>
 </template>
diff --git a/app.html b/app.html
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <input md-timepicker placeholder="pick a date" />
+    <input md-timepicker value.bind="time" placeholder="pick a date" />
   </div>
   <div>
     <button md-button click.delegate="setTime()">set time</button>

diff --git a/app.js b/app.js
@@ -1,8 +1,7 @@
 export class App {
-  selectedDate = null;
+  time = null;
 
-  setDate() {
-    let date = new Date();
-    this.selectedDate = date;
+  setTime() {
+    this.time = "07:13";
   }
 }
diff --git a/app.html b/app.html
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <input md-timepicker type="date" placeholder="pick a date" />
+    <input md-timepicker placeholder="pick a date" />
   </div>
   <div>
     <button md-button click.delegate="setTime()">set time</button>

diff --git a/_tips.md b/_tips.md
@@ -0,0 +1,12 @@
+#### tab targetting
+
+To enable the datepicker to become a valid tab target (as in: responds to the correct tab order),
+set the container to be the parent of the datepicker input. Like this:
+
+```js
+  <div ref="dpWrapper">
+    <input md-datepicker="container.bind: dpWrapper; value.two-way: selectedDate;" type="date" placeholder="pick a date" />
+  </div>
+
+```
+
diff --git a/app.html b/app.html
@@ -0,0 +1,11 @@
+<template>
+  <div>
+    <input md-timepicker type="date" placeholder="pick a date" />
+  </div>
+  <div>
+    <button md-button click.delegate="setTime()">set time</button>
+  </div>
+  <div>
+    <span if.bind="selectedTime">You selected (UTC time): ${selectedTime | stringify}</span>
+  </div>
+</template>
diff --git a/app.js b/app.js
@@ -0,0 +1,8 @@
+export class App {
+  selectedDate = null;
+
+  setDate() {
+    let date = new Date();
+    this.selectedDate = date;
+  }
+}
diff --git a/index.html b/index.html
@@ -0,0 +1,16 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Aurelia</title>
+    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+  </head>
+  <body aurelia-app="main">
+    <h1>Loading...</h1>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/systemjs/0.19.6/system.js"></script>
+    <script src="https://rawgit.com/aurelia-ui-toolkits/aurelia-materialize-bundles/0.20.2/config2.js"></script>
+    <script>
+      System.import('aurelia-bootstrapper');
+    </script>
+  </body>
+</html>
diff --git a/main.js b/main.js
@@ -0,0 +1,20 @@
+/*******************************************************************************
+ * The following two lines enable async/await without using babel's
+ * "runtime" transformer. Uncomment the lines if you intend to use async/await.
+ * 
+ * More info here:  https://github.com/jdanyow/aurelia-plunker/issues/2
+ */
+//import regeneratorRuntime from 'babel-runtime/regenerator';
+//window.regeneratorRuntime = regeneratorRuntime;
+/******************************************************************************/
+
+import 'materialize';
+
+export function configure(aurelia) {
+  aurelia.use
+    .standardConfiguration()
+    .developmentLogging()
+    .plugin('aurelia-materialize-bridge', bridge => bridge.useAll() );
+
+  aurelia.start().then(a => a.setRoot());
+}
No results found