Make all stateful components implement ObservableState interface

5 files changed, 76 insertions, 8 deletions

diff --git a/src/main/kotlin/pl/treksoft/kvision/form/check/CheckBox.kt b/src/main/kotlin/pl/treksoft/kvision/form/check/CheckBox.kt
index 60147114..370f5ab1 100644
--- a/src/main/kotlin/pl/treksoft/kvision/form/check/CheckBox.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/form/check/CheckBox.kt
@@ -30,6 +30,7 @@ import pl.treksoft.kvision.form.FieldLabel
 import pl.treksoft.kvision.form.FormHorizontalRatio
 import pl.treksoft.kvision.form.InvalidFeedback
 import pl.treksoft.kvision.panel.SimplePanel
+import pl.treksoft.kvision.state.ObservableState
 import pl.treksoft.kvision.utils.SnOn
 
 /**
@@ -55,7 +56,7 @@ enum class CheckBoxStyle(internal val className: String) {
 open class CheckBox(
     value: Boolean = false, name: String? = null, label: String? = null,
     rich: Boolean = false
-) : SimplePanel(setOf("form-check", "abc-checkbox")), BoolFormControl {
+) : SimplePanel(setOf("form-check", "abc-checkbox")), BoolFormControl, ObservableState<Boolean> {
 
     /**
      * The selection state of the checkbox.
@@ -65,6 +66,7 @@ open class CheckBox(
         set(value) {
             input.value = value
         }
+
     /**
      * The value attribute of the generated HTML input element.
      *
@@ -76,6 +78,7 @@ open class CheckBox(
         set(value) {
             input.startValue = value
         }
+
     /**
      * The label text bound to the input element.
      */
@@ -84,6 +87,7 @@ open class CheckBox(
         set(value) {
             flabel.content = value
         }
+
     /**
      * Determines if [label] can contain HTML code.
      */
@@ -92,14 +96,17 @@ open class CheckBox(
         set(value) {
             flabel.rich = value
         }
+
     /**
      * The style (one of Bootstrap standard colors) of the input.
      */
     var style: CheckBoxStyle? by refreshOnUpdate()
+
     /**
      * Determines if the checkbox is rendered as a circle.
      */
     var circled by refreshOnUpdate(false)
+
     /**
      * Determines if the checkbox is rendered inline.
      */
@@ -189,6 +196,12 @@ open class CheckBox(
         addCssClass("form-group")
     }
 
+    override fun getState(): Boolean = input.getState()
+
+    override fun subscribe(observer: (Boolean) -> Unit): () -> Unit {
+        return input.subscribe(observer)
+    }
+
     companion object {
         internal var counter = 0
     }
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/check/CheckInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/check/CheckInput.kt
index f93fd436..70d57c51 100644
--- a/src/main/kotlin/pl/treksoft/kvision/form/check/CheckInput.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/form/check/CheckInput.kt
@@ -29,6 +29,7 @@ import pl.treksoft.kvision.core.Widget
 import pl.treksoft.kvision.form.FormInput
 import pl.treksoft.kvision.form.InputSize
 import pl.treksoft.kvision.form.ValidationStatus
+import pl.treksoft.kvision.state.ObservableState
 
 /**
  * Type of the check input control (checkbox or radio).
@@ -49,7 +50,9 @@ enum class CheckInputType(internal val type: String) {
 abstract class CheckInput(
     type: CheckInputType = CheckInputType.CHECKBOX, value: Boolean = false,
     classes: Set<String> = setOf()
-) : Widget(classes), FormInput {
+) : Widget(classes), FormInput, ObservableState<Boolean> {
+
+    protected val observers = mutableListOf<(Boolean) -> Unit>()
 
     init {
         this.setInternalEventListener<CheckInput> {
@@ -67,7 +70,8 @@ abstract class CheckInput(
     /**
      * The selection state of the input.
      */
-    var value by refreshOnUpdate(value) { refreshState() }
+    var value by refreshOnUpdate(value) { refreshState(); observers.forEach { ob -> ob(it) } }
+
     /**
      * The value attribute of the generated HTML input element.
      *
@@ -75,26 +79,32 @@ abstract class CheckInput(
      * bound to the input selection state.
      */
     var startValue by refreshOnUpdate(value) { this.value = it; refresh() }
+
     /**
      * The type of the generated HTML input element.
      */
     var type by refreshOnUpdate(type)
+
     /**
      * The name attribute of the generated HTML input element.
      */
     override var name: String? by refreshOnUpdate()
+
     /**
      * Determines if the field is disabled.
      */
     override var disabled by refreshOnUpdate(false)
+
     /**
      * The additional String value used for the radio button group.
      */
     var extraValue: String? by refreshOnUpdate()
+
     /**
      * The size of the input.
      */
     override var size: InputSize? by refreshOnUpdate()
+
     /**
      * The validation status of the input.
      */
@@ -169,4 +179,14 @@ abstract class CheckInput(
     override fun blur() {
         getElementJQuery()?.blur()
     }
+
+    override fun getState(): Boolean = value
+
+    override fun subscribe(observer: (Boolean) -> Unit): () -> Unit {
+        observers += observer
+        observer(value)
+        return {
+            observers -= observer
+        }
+    }
 }
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/check/Radio.kt b/src/main/kotlin/pl/treksoft/kvision/form/check/Radio.kt
index b8757da2..03ae8595 100644
--- a/src/main/kotlin/pl/treksoft/kvision/form/check/Radio.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/form/check/Radio.kt
@@ -30,6 +30,7 @@ import pl.treksoft.kvision.form.FieldLabel
 import pl.treksoft.kvision.form.FormHorizontalRatio
 import pl.treksoft.kvision.form.InvalidFeedback
 import pl.treksoft.kvision.panel.SimplePanel
+import pl.treksoft.kvision.state.ObservableState
 import pl.treksoft.kvision.utils.SnOn
 
 /**
@@ -56,7 +57,7 @@ enum class RadioStyle(internal val className: String) {
 open class Radio(
     value: Boolean = false, extraValue: String? = null, name: String? = null, label: String? = null,
     rich: Boolean = false
-) : SimplePanel(classes = setOf("form-check")), BoolFormControl {
+) : SimplePanel(classes = setOf("form-check")), BoolFormControl, ObservableState<Boolean> {
 
     /**
      * The selection state of the radio button.
@@ -204,6 +205,12 @@ open class Radio(
         addCssClass("form-group")
     }
 
+    override fun getState(): Boolean = input.getState()
+
+    override fun subscribe(observer: (Boolean) -> Unit): () -> Unit {
+        return input.subscribe(observer)
+    }
+
     companion object {
         internal var counter = 0
     }
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroup.kt b/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroup.kt
index 234f5327..6433d708 100644
--- a/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroup.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroup.kt
@@ -31,6 +31,7 @@ import pl.treksoft.kvision.form.InvalidFeedback
 import pl.treksoft.kvision.form.StringFormControl
 import pl.treksoft.kvision.form.ValidationStatus
 import pl.treksoft.kvision.panel.SimplePanel
+import pl.treksoft.kvision.state.ObservableState
 
 /**
  * The form field component rendered as a group of HTML *input type="radio"* elements with the same name attribute.
@@ -51,7 +52,9 @@ open class RadioGroup(
     options: List<StringPair>? = null, value: String? = null, name: String? = null, inline: Boolean = false,
     label: String? = null,
     rich: Boolean = false
-) : SimplePanel(setOf("form-group")), StringFormControl {
+) : SimplePanel(setOf("form-group")), StringFormControl, ObservableState<String?> {
+
+    protected val observers = mutableListOf<(String?) -> Unit>()
 
     /**
      * A list of options (label to value pairs) for the group.
@@ -61,7 +64,7 @@ open class RadioGroup(
     /**
      * A value of the selected option.
      */
-    override var value by refreshOnUpdate(value) { setValueToChildren(it) }
+    override var value by refreshOnUpdate(value) { setValueToChildren(it); observers.forEach { ob -> ob(it) } }
 
     /**
      * Determines if the options are rendered inline.
@@ -73,6 +76,7 @@ open class RadioGroup(
         set(value) {
             setDisabledToChildren(value)
         }
+
     /**
      * The label text of the options group.
      */
@@ -81,6 +85,7 @@ open class RadioGroup(
         set(value) {
             flabel.content = value
         }
+
     /**
      * Determines if [label] can contain HTML code.
      */
@@ -226,6 +231,16 @@ open class RadioGroup(
         invalidFeedback.addCssClass("col-sm-${horizontalRatio.fields}")
     }
 
+    override fun getState(): String? = value
+
+    override fun subscribe(observer: (String?) -> Unit): () -> Unit {
+        observers += observer
+        observer(value)
+        return {
+            observers -= observer
+        }
+    }
+
     companion object {
         internal var counter = 0
     }
diff --git a/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroupInput.kt b/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroupInput.kt
index 5a47c3ce..3e9f0def 100644
--- a/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroupInput.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/form/check/RadioGroupInput.kt
@@ -28,6 +28,7 @@ import pl.treksoft.kvision.form.FormInput
 import pl.treksoft.kvision.form.InputSize
 import pl.treksoft.kvision.form.ValidationStatus
 import pl.treksoft.kvision.panel.SimplePanel
+import pl.treksoft.kvision.state.ObservableState
 
 /**
  * The input component rendered as a group of HTML *input type="radio"* elements with the same name attribute.
@@ -44,7 +45,9 @@ import pl.treksoft.kvision.panel.SimplePanel
 @Suppress("TooManyFunctions")
 open class RadioGroupInput(
     options: List<StringPair>? = null, value: String? = null, name: String? = null, inline: Boolean = false
-) : SimplePanel(setOf("form-group")), FormInput {
+) : SimplePanel(setOf("form-group")), FormInput, ObservableState<String?> {
+
+    protected val observers = mutableListOf<(String?) -> Unit>()
 
     /**
      * A list of options (label to value pairs) for the group.
@@ -54,7 +57,7 @@ open class RadioGroupInput(
     /**
      * A value of the selected option.
      */
-    var value by refreshOnUpdate(value) { setValueToChildren(it) }
+    var value by refreshOnUpdate(value) { setValueToChildren(it); observers.forEach { ob -> ob(it) } }
 
     /**
      * Determines if the options are rendered inline.
@@ -172,6 +175,16 @@ open class RadioGroupInput(
         getChildren().filterIsInstance<Radio>().firstOrNull()?.blur()
     }
 
+    override fun getState(): String? = value
+
+    override fun subscribe(observer: (String?) -> Unit): () -> Unit {
+        observers += observer
+        observer(value)
+        return {
+            observers -= observer
+        }
+    }
+
     companion object {
         internal var counter = 0
     }