small improvements to widget, add clock widget

web/static/src/ts/widgets/Counter.ts

@@ -21,6 +21,9 @@ export class Counter extends Widget<Env> {
     this.state.counter = props.initialState || 0;
   }
 
+  mounted() {
+    debugger;
+  }
   increment(delta: number) {
     this.updateState({ counter: this.state.counter + delta });
   }

web/static/src/ts/widgets/Discuss.ts

@@ -1,10 +1,11 @@
 import { Widget } from "../core/widget";
-import { Counter } from "./counter";
 import { Env } from "../env";
+import { Clock } from "./clock";
+import { Counter } from "./counter";
 
 const template = `
-    <div class="o_discuss">
-        <span>Root Widget</span>
+    <div class="o_discuss" t-debug="1">
+        <span>DISCUSS!!</span>
         <button t-on-click="resetCounter">Reset</button>
         <button t-on-click="resetCounterAsync">Reset in 3s</button>
         <button t-on-click="toggle">Toggle  Counter</button>
@@ -13,7 +14,7 @@ const template = `
             <t t-widget="Counter" t-ref="counter" t-props="{initialState:4}"/>
         </t>
         <t t-else="1">
-            <t t-widget="Counter" t-ref="counter" t-props="{initialState:7}"/>
+            <t t-widget="Clock"/>
         </t>
         <div ref="target"/>
     </div>
@@ -22,9 +23,12 @@ const template = `
 export class Discuss extends Widget<Env> {
   name = "discuss";
   template = template;
-  widgets = { Counter };
+  widgets = { Clock, Counter };
   state = { validcounter: true };
 
+  mounted() {
+    debugger;
+  }
   resetCounter(ev: MouseEvent) {
     this.refs.counter.updateState({ counter: 3 });
   }

web/static/src/ts/widgets/clock.ts

@@ -0,0 +1,27 @@
+import { Widget } from "../core/widget";
+import { Env } from "../env";
+
+const template = `<div class="o_clock"><t t-esc="state.currentTime"/></div>`;
+
+export class Clock extends Widget<Env> {
+  name = "clock";
+  template = template;
+  state = {
+    currentTime: ""
+  };
+
+  async willStart() {
+    this.updateTime();
+  }
+
+  mounted() {
+    setInterval(this.updateTime.bind(this), 500);
+  }
+
+  updateTime() {
+    debugger;
+    this.updateState({
+      currentTime: new Date().toLocaleTimeString()
+    });
+  }
+}