Skip to content

R
rjs_json_form
Commit a4e3e8e4 authored by Boris Kocherov's avatar Boris Kocherov
Browse files
Options

fix generation of complex json schema which can have any type patternProperties 

before patternProperties could be only type 'object'
simplify for future html design changes
parent d9fed9dd
Show whitespace changes
Inline Side-by-side
Showing with 93 additions and 109 deletions
gadget_json_generated_form.js
View file @ a4e3e8e4
/*jslint nomen: true, maxlen: 200, indent: 2*/ /*jslint nomen: true, maxlen: 200, indent: 2*/
/*global rJS, console, window, document, RSVP, btoa, atob, $ */ /*global rJS, console, window, document, RSVP, btoa, atob, $, loopEventListener */
(function (window, document, rJS, $, loopEventListener) { (function (window, document, rJS, $, loopEventListener) {
"use strict"; "use strict";
...@@ -42,10 +42,27 @@ ...@@ -42,10 +42,27 @@
return input; return input;
} }
function render_field(json_field, default_value) { function render_field(gadget, key, path, json_field, default_value) {
var div,
label,
div_input,
span_info,
span_error,
input;
// var input = document.createElement("input");
div = document.createElement("div");
div.setAttribute("class", "subfield");
div.title = json_field.description;
label = document.createElement("label");
label.textContent = json_field.title || key;
div.appendChild(label);
div_input = document.createElement("div");
div_input.setAttribute("class", "input");
if (json_field['enum'] !== undefined) { if (json_field['enum'] !== undefined) {
return render_selection(json_field, default_value); input = render_selection(json_field, default_value);
} }
if (json_field.type === "boolean") { if (json_field.type === "boolean") {
...@@ -56,20 +73,20 @@ ...@@ -56,20 +73,20 @@
if (default_value === "false") { if (default_value === "false") {
default_value = false; default_value = false;
} }
return render_selection(json_field, default_value); input = render_selection(json_field, default_value);
} }
if (json_field.type === "array") { if (json_field.type === "array") {
return render_textarea(json_field, default_value, "array"); input = render_textarea(json_field, default_value, "array");
}
if (json_field.type === "string" && json_field.textarea === true) {
return render_textarea(json_field, default_value, "string");
} }
var input = document.createElement("input"); if (["string", "integer", "number"].indexOf(json_field.type) >= 0) {
if (json_field.textarea === true) {
input = render_textarea(json_field, default_value, "string");
} else {
input = document.createElement("input");
if (default_value !== undefined) { if (default_value !== undefined) {
console.log(default_value);
input.value = default_value; input.value = default_value;
} }
...@@ -78,30 +95,51 @@ ...@@ -78,30 +95,51 @@
} else { } else {
input.type = "text"; input.type = "text";
} }
}
}
return input; if (json_field.type === "object") {
render_subform(
gadget,
json_field,
default_value,
div_input,
path + "/" + key);
}
if (input) {
// object and array excluded from
// gadget.props.inputs not contain values
gadget.props.inputs.push(input);
input.name = path + "/" + key;
input.setAttribute("class", "slapos-parameter");
div_input.appendChild(input);
}
if (json_field.info !== undefined) {
span_info = document.createElement("span");
span_info.textContent = json_field.info;
div_input.appendChild(span_info);
}
span_error = document.createElement("span");
span_error.setAttribute("class", "error");
div_input.appendChild(span_error);
div.appendChild(div_input);
return div;
} }
function render_subform(gadget, json_field, default_dict, root, path) { function render_subform(gadget, json_field, default_dict, root, path) {
var div_input, var div_input,
key, key,
div, div,
label,
input, input,
default_value, default_used_list = [];
default_used_list = [],
default_div,
span_error,
span_info;
if (default_dict === undefined) { if (default_dict === undefined) {
default_dict = {}; default_dict = {};
} }
if (path === undefined) {
path = "/";
}
if (json_field.patternProperties !== undefined) { if (json_field.patternProperties !== undefined) {
if (json_field.patternProperties['.*'] !== undefined) { if (json_field.patternProperties['.*'] !== undefined) {
...@@ -131,91 +169,39 @@ ...@@ -131,91 +169,39 @@
div.appendChild(div_input); div.appendChild(div_input);
for (default_value in default_dict) { for (key in default_dict) {
if (default_dict.hasOwnProperty(default_value)) { if (default_dict.hasOwnProperty(key)) {
default_div = document.createElement("div"); default_used_list.push(key);
default_div.setAttribute("class", "slapos-parameter-dict-key");
label = document.createElement("label"); div_input = document.createElement("div");
label.textContent = default_value; div_input.setAttribute("class", "slapos-parameter-dict-key");
label.setAttribute("class", "slapos-parameter-dict-key"); div_input.appendChild(
default_div.appendChild(label); render_field(gadget, key, path, json_field.patternProperties['.*'], default_dict[key])
default_div = render_subform( );
gadget, div.appendChild(div_input);
json_field.patternProperties['.*'],
default_dict[default_value],
default_div,
path + "/" + default_value);
div.appendChild(default_div);
} }
} }
root.appendChild(div); root.appendChild(div);
return div;
} }
} }
for (key in json_field.properties) { for (key in json_field.properties) {
if (json_field.properties.hasOwnProperty(key)) { if (json_field.properties.hasOwnProperty(key)) {
div = document.createElement("div"); if (json_field.properties[key].default !== undefined) {
div.setAttribute("class", "subfield"); json_field.properties[key].info = '(default = ' + json_field.properties[key].default + ')';
div.title = json_field.properties[key].description;
/* console.log(key); */
label = document.createElement("label");
label.textContent = json_field.properties[key].title || key;
div.appendChild(label);
div_input = document.createElement("div");
div_input.setAttribute("class", "input");
if (json_field.properties[key].type === 'object') {
div_input = render_subform(
gadget,
json_field.properties[key],
default_dict[key],
div_input,
path + "/" + key);
} else {
input = render_field(json_field.properties[key], default_dict[key]);
input.name = path + "/" + key;
input.setAttribute("class", "slapos-parameter");
gadget.props.inputs.push(input);
div_input.appendChild(input);
} }
default_used_list.push(key); div = render_field(gadget, key, path, json_field.properties[key], default_dict[key]);
if (json_field.properties[key]['default'] !== undefined) {
span_info = document.createElement("span");
span_info.textContent = '(default = ' + json_field.properties[key]['default'] + ')';
div_input.appendChild(span_info);
}
span_error = document.createElement("span");
span_error.setAttribute("class", "error");
div_input.appendChild(span_error);
div.appendChild(div_input);
root.appendChild(div); root.appendChild(div);
default_used_list.push(key);
} }
} }
for (key in default_dict) { for (key in default_dict) {
if (default_dict.hasOwnProperty(key)) { if (default_dict.hasOwnProperty(key)) {
if (default_used_list.indexOf(key) < 0 ) { if (default_used_list.indexOf(key) < 0 ) {
div = document.createElement("div"); div = render_field(gadget, key, path, {
div.setAttribute("class", "subfield"); "type": "string",
div.title = key; "info": "(Not part of the schema)"
label = document.createElement("label"); }, default_dict[key]);
label.textContent = key;
div.appendChild(label);
div_input = document.createElement("div");
div_input.setAttribute("class", "input");
input = render_field({"type": "string"}, default_dict[key]);
input.name = path + "/" + key;
input.setAttribute("class", "slapos-parameter");
div_input.appendChild(input);
default_used_list.push(key);
span_info = document.createElement("span");
span_info.textContent = '(Not part of the schema)';
div_input.appendChild(span_info);
span_error = document.createElement("span");
span_error.setAttribute("class", "error");
div_input.appendChild(span_error);
div.appendChild(div_input);
root.appendChild(div); root.appendChild(div);
} }
} }
...@@ -309,20 +295,14 @@ ...@@ -309,20 +295,14 @@
return g.declareGadget('gadget_json_generated_form.html', {scope: scope}) return g.declareGadget('gadget_json_generated_form.html', {scope: scope})
.push(function (form_gadget) { .push(function (form_gadget) {
var div = document.createElement("div"), var div = document.createElement("div");
label;
g.props.subforms[scope] = form_gadget; g.props.subforms[scope] = form_gadget;
div.setAttribute("class", "slapos-parameter-dict-key"); div.setAttribute("class", "slapos-parameter-dict-key");
label = document.createElement("label");
label.textContent = key;
label.setAttribute("class", "slapos-parameter-dict-key");
div.appendChild(label);
div.appendChild(form_gadget.element); div.appendChild(form_gadget.element);
element.parentNode.parentNode.insertBefore(div, element.parentNode.parentNode.children[1]); element.parentNode.parentNode.insertBefore(div, element.parentNode.parentNode.children[1]);
return form_gadget.renderParameterForm(options.schema_part, {}, scope); return form_gadget.renderParameterForm(options.schema_part, {}, key, scope);
}); });
} }
...@@ -405,7 +385,7 @@ ...@@ -405,7 +385,7 @@
return RSVP.all([ return RSVP.all([
g.getDeclaredGadget('loadschema'), g.getDeclaredGadget('loadschema'),
json_dict json_dict
]) ]);
}) })
.push(function (ret) { .push(function (ret) {
var loadschema_gadget = ret[0], var loadschema_gadget = ret[0],
...@@ -451,18 +431,22 @@ ...@@ -451,18 +431,22 @@
}); });
}) })
.declareMethod('renderParameterForm', function (schema, default_dict, path) { .declareMethod('renderParameterForm', function (schema, default_dict, key, path) {
var g = this, var g = this;
parent_element = document.createDocumentFragment();
g.props.inputs = []; g.props.inputs = [];
g.props.add_buttons = []; g.props.add_buttons = [];
g.props.subforms = {}; g.props.subforms = {};
g.props.path = path; g.props.path = path;
render_subform(g, schema, default_dict, parent_element); if (key === undefined) {
key = "";
}
if (schema.type === undefined) {
schema.type = "object";
}
while (g.element.firstChild) { while (g.element.firstChild) {
g.element.removeChild(g.element.firstChild); g.element.removeChild(g.element.firstChild);
} }
g.element.appendChild(parent_element); g.element.appendChild(render_field(g, key, "", schema, default_dict));
g.listenEvents(); g.listenEvents();
return g.element; return g.element;
}) })
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7