improved consistency between config changes and default value

ccp/js/inputwidgeteditorcontroller.js

@@ -165,7 +165,7 @@ class CCPInputWidgetEditorController extends HTMLElement{
                 <label>${this.getLabel("format")}</label>
                 <select value="${input.schema.format}" name="format" class="form-control">
                   <option value="select" ${this.isSelectedFormat('select') ? "selected" : ""}>${this.getLabel("choice")}</option>
-                  <option value="checklist" ${this.isSelectedFormat('checklist') ? "selected" : ""}>${this.getLabel("multi_choice")}e</option>
+                  <option value="checklist" ${this.isSelectedFormat('checklist') ? "selected" : ""}>${this.getLabel("multi_choice")}</option>
                 </select>
               </div>
             </div>
@@ -231,6 +231,7 @@ class CCPInputWidgetEditorController extends HTMLElement{
         display.innerHTML = this.renderDefaultByType()
       }
       else if (ename === "format") {
+        this.#input.schema.default = this.formatConversion(this.#input.schema.format, this.#input.schema.default, val)
         this.#input.schema.format = val
         display.innerHTML = this.renderDefaultByType()
       }
@@ -240,6 +241,9 @@ class CCPInputWidgetEditorController extends HTMLElement{
       }
       else if (ename === "options") {
         this.#input.schema.enum = val.split(",")
+        if (this.#input.schema.enum.indexOf(this.#input.schema.default) === -1) {
+          this.#input.schema.default = this.#input.schema.enum[0]
+        }
         display.innerHTML = this.renderDefaultByType()
       }
       else if (ename === "readonly") {
@@ -251,10 +255,16 @@ class CCPInputWidgetEditorController extends HTMLElement{
         if (this.#type === "enum") {
           this.querySelector("div[name=string-input]").classList.add("d-none")
           this.querySelector("div[name=enum-input]").classList.remove("d-none")
+          this.querySelector("div[name=enum-input] select[name=format]").value = "select"
+          this.#input.schema.format = "select"
           this.#input.schema.enum = this.querySelector("input[name=options]").value.split(",")
+          if (this.#input.schema.enum.indexOf(this.#input.schema.default) === -1) {
+            this.#input.schema.default = this.#input.schema.enum[0]
+          }
         } else if (this.#type === "string") {
           this.querySelector("div[name=enum-input]").classList.add("d-none")
           this.querySelector("div[name=string-input]").classList.remove("d-none")
+          this.#input.schema.format = "none"
           delete this.#input.schema['enum']
         }
         display.innerHTML = this.renderDefaultByType()
@@ -262,5 +272,58 @@ class CCPInputWidgetEditorController extends HTMLElement{
     })
   }
 
+  boolean2number(prev){
+    if(Array.isArray(prev)){
+      return prev.map(v=>(v === "true" || v === true ? "1" : "0"))
+    } else return prev === "true" || prev === true ? "1" : "0"
+  }
+
+  none2number(prev){
+    if(Array.isArray(prev)){
+      return prev.map(v=>(isNaN(Number(v)) ? "0" : v))
+    } else return isNaN(Number(prev)) ? "0" : prev
+  }
+
+  number2boolean(prev){
+    if(Array.isArray(prev)){
+      return prev.map(v=>(Number(v) !== 0 ? "true" : "false"))
+    } else return Number(prev) !== 0 ? "true" : "false"
+  }
+
+  none2boolean(prev){
+    if(Array.isArray(prev)){
+      return prev.map(v=>(["true", "false"].indexOf(v.toLowerCase()) !== -1 ? v.toLowerCase() : "false"))
+    } else return ["true", "false"].indexOf(prev.toLowerCase()) !== -1 ? prev.toLowerCase() : "false"
+  }
+
+  any2boolean(prev){
+    if(Array.isArray(prev)){
+      return prev.map(v=>String(!!v))
+    } else return String(!!v);
+  }
+
+  any2empty(prev){
+    if(Array.isArray(prev)){
+      return prev.map(v=>"")
+    } else return "";
+  }
+
+  formatConversion(prevformat, prevvalue, format){
+    if(format === "none"){
+      return prevvalue;
+    }
+    if(format === "number"){
+      if(prevformat === "boolean") return this.boolean2number(prevvalue);
+      if(!prevformat || prevformat === "none") return this.none2number(prevvalue);
+      return "0";
+    }
+    if(format === "boolean"){
+      if(prevformat === "number") return this.number2boolean(prevvalue)
+      if(!prevformat || prevformat === "none") return this.none2boolean(prevvalue)
+      return this.any2boolean(prevvalue)
+    }
+    return this.any2empty(prevvalue)
+  }
+
 }
 window.customElements.define('d4s-ccp-input-editor', CCPInputWidgetEditorController);