draft

gadget_json_generated_form.js

@@ -14,6 +14,28 @@
     return _str.replace(/~/g,'~0').replace(/\//g,'~1');
   }
 
+  function getDocumentType(doc) {
+    if (doc instanceof Array) {
+      return "array";
+    }
+    return typeof doc;
+  }
+
+  function getDocumentSchema(doc) {
+    var type = getDocumentType(doc),
+      schema = {
+        type: type
+      };
+    if (type === "array") {
+      schema.maxItems = 0;
+    } else if (type === "object") {
+      schema.additionalProperties = false;
+    } else {
+      schema.readOnly = true;
+    }
+    return schema;
+  }
+
   function render_selection(json_field, default_value) {
     var input = document.createElement("select"),
       option = document.createElement("option"),
@@ -58,15 +80,23 @@
       div_input,
       input,
       item_schema,
-      i;
-    if (json_field.items.type) {
-      item_schema = json_field.items;
-      div = document.createElement("div");
-      div.setAttribute("class", "subfield");
-      div.title = json_field.description;
+      i,
+      maxItems = json_field.maxItems;
+    div = document.createElement("div");
+    div.setAttribute("class", "subfield");
+    div.title = json_field.description;
 
-      div_input = document.createElement("div");
-      div_input.setAttribute("class", "input");
+    div_input = document.createElement("div");
+    div_input.setAttribute("class", "input");
+
+    function element_append(child) {
+      if (child) {
+        div_input.appendChild(child);
+      }
+    }
+
+    if (maxItems === undefined || default_array.length < maxItems) {
+      item_schema = json_field.items;
 
       input = document.createElement("button");
       input.setAttribute("class",
@@ -75,35 +105,48 @@
       input.type = "button";
       input.name = path;
       gadget.props.add_buttons.push({
-        parent_type: 'array',
         element: input,
-        schema_part: item_schema
+        event: function () {
+          return addSubForm({
+              gadget: gadget,
+              parent_type: 'array',
+              element: input,
+              schema_part: item_schema
+            })
+            .push(element_append);
+        }
       });
-      div_input.appendChild(input);
+    } else {
+      input = document.createElement("div");
+      input.setAttribute("class", "input");
+    }
 
-      div.appendChild(div_input);
-      if (default_array) {
-        for (i = 0; i < default_array.length; i++) {
-          queue
-            .push(
-              addSubForm.bind(gadget, gadget, {
-                parent_type: 'array',
-                path: path,
-                element: input,
-                schema_part: item_schema,
-                default_dict: default_array[i]
-              })
-            );
-        }
+    div_input.appendChild(input);
+    div.appendChild(div_input);
+
+    if (default_array) {
+      for (i = 0; i < default_array.length; i++) {
+        queue
+          .push(
+            addSubForm.bind(gadget, {
+              gadget: gadget,
+              parent_type: 'array',
+              path: path,
+              element: input,
+              schema_part: item_schema,
+              default_dict: default_array[i]
+            })
+          )
+          .push(element_append);
       }
-      root.appendChild(div);
     }
+    root.appendChild(div);
     // todo add failback rendering if default_array not array
     // input = render_textarea(json_field, default_value, "array");
     return queue;
   }
 
-  function render_field(gadget, key, path, json_field, default_value, root) {
+  function render_field(gadget, key, path, json_field, default_value, root, editable_label) {
     var div,
       label,
       div_input,
@@ -119,10 +162,18 @@
       first_path = "";
     }
 
+    if (json_field === undefined) {
+      json_field = getDocumentSchema(default_value);
+    } else if (json_field.type === undefined) {
+      json_field.type = getDocumentType(default_value);
+    }
+
     div = document.createElement("div");
     div.setAttribute("class", "subfield");
     div.title = json_field.description;
-    if (key && !first_path) {
+    // if (key && !first_path) {
+    if (false) {
+      // XXX;
       label = document.createElement("input");
       label.value = key;
       gadget.props.property_name_edit = label;
@@ -134,23 +185,25 @@
     div_input = document.createElement("div");
     div_input.setAttribute("class", "input");
 
-    if (json_field['enum'] !== undefined) {
+    if (json_field.enum !== undefined) {
       input = render_selection(json_field, default_value);
     }
 
     if (json_field.type === "boolean") {
-      json_field['enum'] = [true, false];
       if (default_value === "true") {
         default_value = true;
       }
       if (default_value === "false") {
         default_value = false;
       }
-      input = render_selection(json_field, default_value);
+      input = render_selection({
+        type: "boolean",
+        enum: [true, false]
+      }, default_value);
     }
 
-    if (["string", "integer", "number"].indexOf(json_field.type) >= 0) {
-      if (json_field.textarea === true) {
+    if (!input && ["string", "integer", "number"].indexOf(json_field.type) >= 0) {
+      if (json_field.contentMediaType === "text/plain") {
         input = render_textarea(json_field, default_value, "string");
       } else {
         input = document.createElement("input");
@@ -217,10 +270,19 @@
   }
 
   function render_object(g, json_field, default_dict, root, path) {
-    var key,
+    var additionalProperties,
+      key,
+      required = json_field.required || [],
       used_properties = {},
+      unused_properties = [],
       queue = RSVP.Queue();
 
+    g.props.objects[path] = used_properties;
+
+    function root_append(child) {
+      root.appendChild(child);
+    }
+
     function addAdditional(schema) {
       var div,
         div_input,
@@ -233,6 +295,12 @@
       div_input = document.createElement("div");
       div_input.setAttribute("class", "input");
 
+      function element_append(child) {
+        if (child) {
+          div_input.appendChild(child);
+        }
+      }
+
       input = document.createElement("input");
       input.type = "text";
       div_input.appendChild(input);
@@ -245,7 +313,14 @@
       input.name = path;
       g.props.add_buttons.push({
         element: input,
-        schema_part: schema
+        event: function () {
+          return addSubForm({
+            gadget: g,
+            element: input,
+            schema_part: schema
+          })
+            .push(element_append);
+        }
       });
       div_input.appendChild(input);
       div.appendChild(div_input);
@@ -256,14 +331,16 @@
           used_properties[key] = "";
           queue
             .push(
-              addSubForm.bind(g, g, {
+              addSubForm.bind(g, {
+                gadget: g,
                 property_name: key,
                 path: path,
                 element: input,
                 schema_part: schema,
                 default_dict: default_dict[key]
               })
-            );
+            )
+            .push(element_append);
         }
       }
       queue.push(function () {
@@ -275,39 +352,69 @@
       default_dict = {};
     }
 
+    function generate_property_selection(properties) {
+      var input;
+      if (properties.length > 0) {
+        input = render_selection({
+          enum: properties
+        });
+      }
+      if (input) {
+        root_append(input);
+      }
+    }
+
     for (key in json_field.properties) {
       if (json_field.properties.hasOwnProperty(key)) {
-        used_properties[key] = false;
-        if (json_field.properties[key].default !== undefined) {
-          json_field.properties[key].info = '(default = ' + json_field.properties[key].default + ')';
+        if (required.indexOf(key) >= 0) {
+          used_properties[key] = false;
+          if (json_field.properties[key].default !== undefined) {
+            json_field.properties[key].info = '(default = ' + json_field.properties[key].default + ')';
+          }
+          queue
+            .push(render_field.bind(g, g, key, path,
+              json_field.properties[key], default_dict[key], root)
+            );
+        } else if (default_dict.hasOwnProperty(key)) {
+          used_properties[key] = "";
+          queue
+            .push(
+              addSubForm.bind(g, {
+                gadget: g,
+                property_name: key,
+                path: path,
+                schema_part: json_field.properties[key],
+                default_dict: default_dict[key]
+              })
+            )
+            .push(root_append);
+        } else {
+          unused_properties.push(key);
         }
-        queue
-          .push(render_field.bind(g, g, key, path,
-            json_field.properties[key], default_dict[key], root)
-          );
       }
     }
+    generate_property_selection(unused_properties);
+
     if (json_field.patternProperties !== undefined) {
       if (json_field.patternProperties['.*'] !== undefined) {
         addAdditional(json_field.patternProperties['.*']);
       }
-      g.props.objects[path] = used_properties;
     }
 
-    if (json_field.additionalProperties !== undefined && json_field.additionalProperties.type) {
-      addAdditional(json_field.additionalProperties);
-      g.props.objects[path] = used_properties;
+    if (json_field.additionalProperties === undefined) {
+      additionalProperties = true;
+    } else {
+      additionalProperties = json_field.additionalProperties;
+    }
+    if (additionalProperties.type) {
+      addAdditional(additionalProperties);
     }
 
     for (key in default_dict) {
       if (default_dict.hasOwnProperty(key)) {
         if (!used_properties.hasOwnProperty(key)) {
           queue
-            .push(render_field.bind(g, g, key, path, {
-                "type": "string",
-                "info": "(Not part of the schema)"
-              }, default_dict[key], root)
-            );
+            .push(render_field.bind(g, g, key, path, undefined, default_dict[key], root));
         }
       }
     }
@@ -437,8 +544,9 @@
       });
   }
 
-  function addSubForm(g, options) {
+  function addSubForm(options) {
     var element = options.element,
+      g = options.gadget,
       property_name,
       parent_path = options.path || element.name,
       scope,
@@ -454,12 +562,12 @@
       if (!property_name) {
         // TODO notify user
         // you can't create property without property_name
-        return false;
+        return RSVP.Queue();
       }
       if (g.props.objects[parent_path].hasOwnProperty(property_name) && g.props.objects[parent_path][property_name] !== "") {
         // TODO notify user
         // you can't create property with existed property_name
-        return false;
+        return RSVP.Queue();
       }
       if (input_element) {
         input_element.value = "";
@@ -476,7 +584,7 @@
           form_gadget.element.setAttribute("data-json-property-name", property_name);
         }
         // add to end of list
-        element.parentNode.appendChild(form_gadget.element);
+        // element.parentNode.appendChild(form_gadget.element);
         return form_gadget.renderForm({
           schema: options.schema_part,
           document: options.default_dict,
@@ -651,9 +759,6 @@
       if (!property_name || !options.display_label) {
         property_name = "";
       }
-      if (schema.type === undefined) {
-        schema.type = "object";
-      }
       root = g.element.querySelector('[data-json-path="/"]');
       if (!root) {
         root = g.element;
@@ -749,7 +854,7 @@
           button_list[i].element,
           'click',
           false,
-          addSubForm.bind(g, g, button_list[i])
+          button_list[i].event
         ));
       }