Commit 02dd4cc6 authored by Rafael Monnerat's avatar Rafael Monnerat

slapos_jio: Backport close buttom to remove subforms on parameter editor

This code was originally written by Alain Takoudjou, I'm just porting and updating to this new code base.
parent b08a0c36
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
border-radius: 2px; border-radius: 2px;
} }
.bt_close:hover { .bt_close:hover {
background: #81afab; background: #c9c9c9;
color: #fff; color: #fff;
} }
...@@ -175,12 +175,12 @@ label.slapos-parameter-dict-key ~ div.input label { ...@@ -175,12 +175,12 @@ label.slapos-parameter-dict-key ~ div.input label {
} }
.input .add-sub-form { .input .add-sub-form {
position: absolute; position: absolute;
right: 0; right: 10px;
top: 0; top: 0;
bottom: 0; bottom: 0;
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
color: #fff; color: #000;
margin: 0; margin: 0;
} }
.add-sub-form:before { .add-sub-form:before {
......
...@@ -261,7 +261,7 @@ ...@@ -261,7 +261,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>970.64989.39558.61508</string> </value> <value> <string>977.18105.11982.10410</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -279,7 +279,7 @@ ...@@ -279,7 +279,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1542806911.82</float> <float>1563920275.64</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -184,6 +184,7 @@ ...@@ -184,6 +184,7 @@
key, key,
div, div,
label, label,
close_span,
input, input,
default_value, default_value,
default_used_list = [], default_used_list = [],
...@@ -213,6 +214,8 @@ ...@@ -213,6 +214,8 @@
input = document.createElement("input"); input = document.createElement("input");
input.type = "text"; input.type = "text";
// Name is only meaningfull to automate tests
input.name = "ADD" + path;
div_input.appendChild(input); div_input.appendChild(input);
input = document.createElement("button"); input = document.createElement("button");
...@@ -220,7 +223,7 @@ ...@@ -220,7 +223,7 @@
input.setAttribute("class", "add-sub-form"); input.setAttribute("class", "add-sub-form");
input.type = "button"; input.type = "button";
input.name = path; input.name = path;
input.textContent = "Add"; input.textContent = "+";
div_input.appendChild(input); div_input.appendChild(input);
div.appendChild(div_input); div.appendChild(div_input);
...@@ -234,6 +237,11 @@ ...@@ -234,6 +237,11 @@
label = document.createElement("label"); label = document.createElement("label");
label.textContent = default_value; label.textContent = default_value;
label.setAttribute("class", "slapos-parameter-dict-key"); label.setAttribute("class", "slapos-parameter-dict-key");
close_span = document.createElement("span");
close_span.textContent = "×";
close_span.setAttribute("class", "bt_close");
close_span.setAttribute("title", "Remove this parameter section.");
label.appendChild(close_span);
default_div.appendChild(label); default_div.appendChild(label);
default_div = render_subform( default_div = render_subform(
json_field.patternProperties['.*'], json_field.patternProperties['.*'],
...@@ -262,7 +270,7 @@ ...@@ -262,7 +270,7 @@
div_input = document.createElement("div"); div_input = document.createElement("div");
div_input.setAttribute("class", "input"); div_input.setAttribute("class", "input");
if (json_field.properties[key].type === 'object') { if (json_field.properties[key].type === 'object') {
label.setAttribute("class", "slapos-parameter-dict-key"); label.setAttribute("class", "slapos-parameter-dict-key");
div_input = render_subform(json_field.properties[key], div_input = render_subform(json_field.properties[key],
default_dict[key], default_dict[key],
div_input, div_input,
...@@ -290,7 +298,7 @@ ...@@ -290,7 +298,7 @@
} }
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 = document.createElement("div");
div.title = key; div.title = key;
if (restricted === true) { if (restricted === true) {
...@@ -308,7 +316,7 @@ ...@@ -308,7 +316,7 @@
div.appendChild(label); div.appendChild(label);
div_input = document.createElement("div"); div_input = document.createElement("div");
div_input.setAttribute("class", "input"); div_input.setAttribute("class", "input");
input = render_field({"type": "string", "textarea": true}, default_dict[key]); input = render_field({"type": "string"}, default_dict[key]);
input.name = path + "/" + key; input.name = path + "/" + key;
input.setAttribute("class", "slapos-parameter"); input.setAttribute("class", "slapos-parameter");
input.setAttribute("placeholder", " "); input.setAttribute("placeholder", " ");
...@@ -395,6 +403,11 @@ ...@@ -395,6 +403,11 @@
return element; return element;
} }
function removeSubParameter(element) {
$(element).parent().parent().remove();
return false;
}
function addSubForm(element) { function addSubForm(element) {
var subform_json = JSON.parse(atob(element.value)), var subform_json = JSON.parse(atob(element.value)),
input_text = element.parentNode.querySelector("input[type='text']"), input_text = element.parentNode.querySelector("input[type='text']"),
...@@ -424,6 +437,7 @@ ...@@ -424,6 +437,7 @@
field_list = g.element.querySelectorAll(".slapos-parameter"), field_list = g.element.querySelectorAll(".slapos-parameter"),
button_list = g.element.querySelectorAll('button.add-sub-form'), button_list = g.element.querySelectorAll('button.add-sub-form'),
label_list = g.element.querySelectorAll('label.slapos-parameter-dict-key'), label_list = g.element.querySelectorAll('label.slapos-parameter-dict-key'),
close_list = g.element.querySelectorAll(".bt_close"),
i, i,
promise_list = []; promise_list = [];
...@@ -454,6 +468,15 @@ ...@@ -454,6 +468,15 @@
)); ));
} }
for (i = 0; i < close_list.length; i = i + 1) {
promise_list.push(loopEventListener(
close_list[i],
'click',
false,
removeSubParameter.bind(g, close_list [i])
));
}
return RSVP.all(promise_list); return RSVP.all(promise_list);
} }
......
...@@ -274,7 +274,7 @@ ...@@ -274,7 +274,7 @@
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>976.40089.29410.21896</string> </value> <value> <string>977.17940.31340.8669</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -292,7 +292,7 @@ ...@@ -292,7 +292,7 @@
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1561393541.64</float> <float>1563920050.33</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
...@@ -108,7 +108,7 @@ ...@@ -108,7 +108,7 @@
<value> <string encoding="cdata"><![CDATA[ <value> <string encoding="cdata"><![CDATA[
CACHE MANIFEST\n CACHE MANIFEST\n
# generated on Fri, 9 JuL 2019 10:00:07 GMT+0200\n # generated on Fri, 10 JuL 2019 11:00:11 GMT+0200\n
CACHE:\n CACHE:\n
favicon.ico\n favicon.ico\n
font-awesome/font-awesome-webfont.eot?v=4.6.3\n font-awesome/font-awesome-webfont.eot?v=4.6.3\n
...@@ -579,7 +579,7 @@ NETWORK:\n ...@@ -579,7 +579,7 @@ NETWORK:\n
</item> </item>
<item> <item>
<key> <string>serial</string> </key> <key> <string>serial</string> </key>
<value> <string>976.63583.28202.43076</string> </value> <value> <string>977.18103.707.375</string> </value>
</item> </item>
<item> <item>
<key> <string>state</string> </key> <key> <string>state</string> </key>
...@@ -597,7 +597,7 @@ NETWORK:\n ...@@ -597,7 +597,7 @@ NETWORK:\n
</tuple> </tuple>
<state> <state>
<tuple> <tuple>
<float>1562716840.37</float> <float>1563920292.41</float>
<string>UTC</string> <string>UTC</string>
</tuple> </tuple>
</state> </state>
......
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