GH-47 Fix toggle not listening to target changes

creative-connections · Aug 18, 2019 · fefe96f · fefe96f
1 parent 50c64bf
commit fefe96f
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/src/runtime/builders/widgets/Toggle/template/Toggle.js b/src/runtime/builders/widgets/Toggle/template/Toggle.js
@@ -19,7 +19,7 @@ export default class Toggle extends Widget {
   }
 
   handleOnChange () {
-    this.dispatchEvent(new Event('change'))
+    if (this.constructed == null) { return }
     if (this.component.checked) {
       if (this.target.provider !== null) {
         this.target.provider.setValue(this.target.reference, this.onToggleOn.value)
@@ -31,10 +31,17 @@ export default class Toggle extends Widget {
       }
       this.dispatchEvent(new Event('toggleOff'))
     }
+    this.dispatchEvent(new Event('change'))
   }
 
   generateSetters () {
     this.setters = {
+      target: () => {
+        if (this.target.value != this.component.checked) {
+          this.component.checked = this.target.value
+          this.handleOnChange()
+        }
+      },
       enabled: () => {
         if (this.enabled.function === null) {
           this.component.disabled = !this.enabled.value
@@ -66,6 +73,7 @@ export default class Toggle extends Widget {
     if (attribute === 'target') {
       this.target.reference = target.registerValueSetter(this, id, attribute)
       this.target.provider = target
+      target.registerValueListener(this, id, attribute)
       return
     }
     super.setValueProvider(attribute, id, target)

diff --git a/src/runtime/builders/widgets/Widget/template/Widget.js b/src/runtime/builders/widgets/Widget/template/Widget.js
@@ -2,6 +2,7 @@ export default class Widget {
   constructor(configuration, typeIdentifier) {
     Object.assign(this, configuration)
     this.typeIdentifier = typeIdentifier
+    this.listeners = {}
 
     console.log(`Widget (${this.typeIdentifier}) instance ${this.name}`)
 
@@ -17,7 +18,6 @@ export default class Widget {
     this.updateComponent()
 
     // EventTarget listeners
-    this.listeners = {}
     this.loadEventListeners()
 
     this.constructed = true
@@ -131,4 +131,4 @@ export default class Widget {
     }
     return !event.defaultPrevented
   }
-}
+}