Some bugfixes for input elements

This commit is contained in:
Daniel
2025-04-24 18:12:38 +02:00
parent 0d5ffd72a8
commit ff0c00cabb
4 changed files with 151 additions and 124 deletions

View File

@ -34,8 +34,6 @@
<!-- CSS-Files --> <!-- CSS-Files -->
<link rel="stylesheet" href="externalFiles/alertify.css"> <link rel="stylesheet" href="externalFiles/alertify.css">
<!-- <link rel="stylesheet" href="externalFiles/swiper-bundle.min.css"> -->
<!-- <link rel="stylesheet" href="cssFiles/SEAWebClientSwiper.css"> -->
<link rel="stylesheet" href="cssFiles/SEAWebClientGroup.css"> <link rel="stylesheet" href="cssFiles/SEAWebClientGroup.css">
<link rel="stylesheet" href="cssFiles/SEAWebClientConsole.css"> <link rel="stylesheet" href="cssFiles/SEAWebClientConsole.css">
<link rel="stylesheet" href="cssFiles/SEAWebClientGraphics.css"> <link rel="stylesheet" href="cssFiles/SEAWebClientGraphics.css">
@ -43,8 +41,6 @@
<!-- JS-Files --> <!-- JS-Files -->
<script src="externalFiles/alertify.js"></script> <script src="externalFiles/alertify.js"></script>
<script src="externalFiles/eventsource.js"></script> <script src="externalFiles/eventsource.js"></script>
<!-- <script src="externalFiles/d3.min.js"></script> -->
<!-- <script src="externalFiles/swiper-bundle.min.js"></script> -->
<!-- <script src="externalFiles/Chart.bundle.min.js"></script> --> <!-- <script src="externalFiles/Chart.bundle.min.js"></script> -->
<script src="externalFiles/chart.umd.min.js"></script> <script src="externalFiles/chart.umd.min.js"></script>
<script src="externalFiles/luxon.min.js"></script> <script src="externalFiles/luxon.min.js"></script>
@ -55,7 +51,6 @@
<!-- <script src="externalFiles/chartjs-zoom.js"></script> --> <!-- <script src="externalFiles/chartjs-zoom.js"></script> -->
<script src="jsFiles/SEAWebClientLocalStorage.js"></script> <script src="jsFiles/SEAWebClientLocalStorage.js"></script>
<script src="jsFiles/SEAWebClientResponsivity.js"></script> <script src="jsFiles/SEAWebClientResponsivity.js"></script>
<!-- <script src="jsFiles/SEAWebClientSwiper.js"></script> -->
<script src="jsFiles/SEAWebClientGroup.js"></script> <script src="jsFiles/SEAWebClientGroup.js"></script>
<script src="jsFiles/SEAWebClientConsole.js"></script> <script src="jsFiles/SEAWebClientConsole.js"></script>
<script src="jsFiles/SEAWebClientGraphics.js"></script> <script src="jsFiles/SEAWebClientGraphics.js"></script>

View File

@ -57,7 +57,7 @@
height: 12px; height: 12px;
line-height: 16px; line-height: 16px;
opacity: .8; opacity: .8;
text-align: top; vertical-align: top;
margin-bottom: 4px; margin-bottom: 4px;
} }
@ -66,7 +66,8 @@
.col-left { .col-left {
display: inline-block; display: inline-block;
min-width: 140px; width: 155px;
vertical-align: top;
} }
/* ------------------------------ info ------------------------------ */ /* ------------------------------ info ------------------------------ */
@ -131,15 +132,18 @@
/* right */ /* right */
.col-right-modules { .col-right-modules {
float: right; display: inline-block;
width: 180px;
} }
.col-right-parameters { .col-right-parameters {
float: right; display: inline-block;
width: 180px;
} }
.col-right-value { .col-right-value {
padding-right: 4px; display: block;
text-align: right;
} }
.col-right-disabled { .col-right-disabled {
@ -149,7 +153,9 @@
/* ------------------------------ edit-icon ------------------------------ */ /* ------------------------------ edit-icon ------------------------------ */
.edit-icon { .edit-icon {
float: right; position: absolute;
top: 4px;
right: 2px;
cursor: pointer; cursor: pointer;
} }
@ -270,3 +276,27 @@ option {
border: 2px solid dimgray; border: 2px solid dimgray;
border-radius: 4px; border-radius: 4px;
} }
/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */
/* PANEL <- moved here from SEAWebClientSwiper.css */
.panel {
background-color: #303030;
/* position: absolute; */
z-index: 20;
width: 100%;
height: 30px;
}
.panel:not(.graphics) {
color: white;
text-align: center;
padding: 6px 6px 6px 6px;
}
.panel.graphics{
display: flex;
justify-content: flex-end;
}
.toggle-updates-graphics {
float: right;
}

View File

@ -192,7 +192,7 @@ function updateValues(message, src) {
// Handles changes of parameter-values // Handles changes of parameter-values
for (var i = 0; i < message.updates.length; i++) { for (var i = 0; i < message.updates.length; i++) {
let component = message.updates[i]; let component = message.updates[i];
let value = component.value; let comp_value = component.value;
let matches = document.getElementsByName(component.name); let matches = document.getElementsByName(component.name);
// Check for status updates // Check for status updates
@ -210,27 +210,25 @@ function updateValues(message, src) {
elem.innerHTML = text; elem.innerHTML = text;
} }
} else if (type == "input") { } else if (type == "input") {
let row = elem.parentNode.parentNode.parentNode; let row = elem.closest('div');
row.style.backgroundColor = "white"; row.style.backgroundColor = "white";
let mval = elem.value;
let oldValue = ('oldValue' in elem) ? elem.oldValue : mval; let oldValue = ('oldValue' in elem) ? elem.oldValue : elem.value;
if (value != mval && parseFloat(value) != parseFloat(mval) && value != oldValue) { if (comp_value != elem.value && parseFloat(comp_value) != parseFloat(elem.value) && comp_value != oldValue) {
if (elem == document.activeElement if (elem == document.activeElement || oldValue != elem.value) {
|| oldValue != mval) {
row.style.backgroundColor = "orange"; row.style.backgroundColor = "orange";
} else { } else {
elem.value = value; elem.value = comp_value;
} }
} }
elem.actualValue = value; elem.actualValue = comp_value;
resize_textfield(elem); resizeTextfield(elem);
} else if (type == "checkbox") { } else if (type == "checkbox") {
let row = elem.closest('div'); let row = elem.closest('div');
row.style.backgroundColor = "white"; row.style.backgroundColor = "white";
console.log('receive: ', value);
// console.log('CBX', elem.name, message, Boolean(value && value != 'false')); console.log('receive: ', comp_value);
// elem.checked = Boolean(value && value != 'false'); if (comp_value == 'False' || comp_value == 'false' || comp_value == 0) {
if (value === 'False') {
elem.checked = false; elem.checked = false;
} else { } else {
elem.checked = true; elem.checked = true;
@ -242,7 +240,7 @@ function updateValues(message, src) {
let options = elem.childNodes; let options = elem.childNodes;
for (var j = 0; j < options.length; j++) { for (var j = 0; j < options.length; j++) {
if (options[j].label == value) { if (options[j].label == comp_value) {
elem.value = j + 1; elem.value = j + 1;
} }
} }
@ -370,16 +368,8 @@ function successHandler(s, message) {
isl = appendToGridElement(2, message.title, 'parameters', createContent(message)); isl = appendToGridElement(2, message.title, 'parameters', createContent(message));
adjustGrid(); adjustGrid();
if (nColumns == 1 || nColumns == 2 || nColumns == 3) { if (nColumns == 1 || nColumns == 2 || nColumns == 3) {
// elements[1].style.display = "none"; // hide modules
// elements[2].style.display = "inline-block"; // show parameters
// style(2,"100vw","100vh");
document.getElementById('close-cross').innerHTML = '<img class = "icon-close" src="res/icon_close.png">'; document.getElementById('close-cross').innerHTML = '<img class = "icon-close" src="res/icon_close.png">';
} }
// else if (nColumns == 2 || nColumns == 3) {
// adjustGrid();
// } else {
// adjustGrid();
// }
} }
nextInitCommand(); nextInitCommand();
// Request for updates. // Request for updates.

View File

@ -29,10 +29,10 @@ function createContent(message) {
component.command = component.name; component.command = component.name;
if (message.title == 'modules') { if (message.title == 'modules') {
let row = create_row_for_modules(component); let row = createRowForModules(component);
content.appendChild(row); content.appendChild(row);
} else { } else {
let row = create_row_for_parameters(component); let row = createRowForParameters(component);
content.appendChild(row); content.appendChild(row);
} }
} }
@ -42,13 +42,13 @@ function createContent(message) {
/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */
// ROW // ROW
function create_row_for_modules(component) { function createRowForModules(component) {
let left = create_left_column(component, 1); let left = createLeftColumnForModules(component);
left.id = component.name; left.id = component.name;
left.setAttribute('name', 'component.title'); left.setAttribute('name', 'component.title');
let right = create_right_column_for_modules(component); let right = createRightColumnForModules(component);
let row = append_to_content(left, right); let row = appendToContent(left, right);
row.onclick = function () { row.onclick = function () {
getGroup(s, component.title); getGroup(s, component.title);
@ -57,8 +57,10 @@ function create_row_for_modules(component) {
return row; return row;
} }
function create_row_for_parameters(component) { function createRowForParameters(component) {
let left = create_left_column(component); let left = document.createElement('span');
left.classList.add('col-left');
left.innerHTML = component.title;
let right = document.createElement('span'); let right = document.createElement('span');
right.classList.add('col-right-parameters'); right.classList.add('col-right-parameters');
let value = document.createElement('span'); let value = document.createElement('span');
@ -72,26 +74,40 @@ function create_row_for_parameters(component) {
component.type == 'checkbox' || component.type == 'checkbox' ||
component.type == 'enum' component.type == 'enum'
) { ) {
let edit = document.createElement('img'); let input_element;
edit.setAttribute('src', 'res/icon_edit.png'); switch (component.type) {
edit.classList.add('modules-icon', 'edit-icon'); case 'enum':
createFunc = window['create_' + component.type] input_element = createEnum(component);
let input_element = createFunc(component); break;
case 'pushbutton':
input_element = createPushbutton(component);
break;
case 'input':
input_element = createInput(component);
break;
case 'checkbox':
input_element = createCheckbox(component);
break;
}
input_element.classList.add('input-element', 'input-element-hidden'); input_element.classList.add('input-element', 'input-element-hidden');
edit.onclick = function () {
let icon_edit = document.createElement('img');
icon_edit.setAttribute('src', 'res/icon_edit.png');
icon_edit.classList.add('modules-icon', 'edit-icon');
icon_edit.onclick = function () {
let is_hidden = input_element.classList.contains('input-element-hidden'); let is_hidden = input_element.classList.contains('input-element-hidden');
hide_input_elements(); hideInputElements();
if (is_hidden) { if (is_hidden) {
input_element.classList.remove('input-element-hidden'); input_element.classList.remove('input-element-hidden');
} }
} }
right.appendChild(edit); right.appendChild(icon_edit);
right.appendChild(input_element); right.appendChild(input_element);
} }
return append_to_content(left, right); return appendToContent(left, right);
} }
function append_to_content(left, right) { function appendToContent(left, right) {
let row = document.createElement('div'); let row = document.createElement('div');
row.classList.add("row"); row.classList.add("row");
row.appendChild(left); row.appendChild(left);
@ -102,32 +118,28 @@ function append_to_content(left, right) {
/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */
// LEFT COLUMN // LEFT COLUMN
function create_left_column(component, modules) { function createLeftColumnForModules(component) {
var left = document.createElement('span'); var left = document.createElement('span');
left.classList.add('col-left'); left.classList.add('col-left');
if (modules) { if (component.statusname) {
if (component.statusname) { left.appendChild(create_status_icon(component));
left.appendChild(create_status_icon(component)); }
} let modules_title = document.createElement('span');
let modules_title = document.createElement('span'); modules_title.classList.add('modules-title');
modules_title.classList.add('modules-title'); modules_title.innerHTML = component.title;
modules_title.innerHTML = component.title; left.appendChild(modules_title);
left.appendChild(modules_title); if (component.statusname) {
if (component.statusname) { let status_info = document.createElement('span');
let status_info = document.createElement('span'); status_info.classList.add('status-info');
status_info.classList.add('status-info'); status_info.setAttribute('name', component.title + '-info');
status_info.setAttribute('name', component.title + '-info'); left.appendChild(status_info);
left.appendChild(status_info); }
} if (component.info) {
if (component.info) { let btn_info = document.createElement('span');
let btn_info = document.createElement('span'); btn_info.innerHTML = '(i)';
btn_info.innerHTML = '(i)'; btn_info.classList.add('button-info');
btn_info.classList.add('button-info'); left.appendChild(btn_info);
left.appendChild(btn_info); left.appendChild(create_info(component));
left.appendChild(createInfo(component));
}
} else {
left.innerHTML = component.title;
} }
return left; return left;
@ -139,20 +151,20 @@ function create_left_column(component, modules) {
icon_status.classList.add('status-icon'); icon_status.classList.add('status-icon');
return icon_status; return icon_status;
} }
}
function createInfo(component) { function create_info(component) {
// Creates info-box, which isn't visible by default but can be displayed. // Creates info-box, which isn't visible by default but can be displayed.
let infoBox = document.createElement('span'); let infoBox = document.createElement('span');
infoBox.classList.add("info-box"); infoBox.classList.add("info-box");
infoBox.innerHTML = '<b>' + component.title + '</b>: ' + component.info; infoBox.innerHTML = '<b>' + component.title + '</b>: ' + component.info;
return infoBox; return infoBox;
}
} }
/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */
// RIGHT COLUMN // RIGHT COLUMN
function create_right_column_for_modules(component) { function createRightColumnForModules(component) {
var right = document.createElement('span'); var right = document.createElement('span');
right.classList.add('col-right', 'col-right-modules'); right.classList.add('col-right', 'col-right-modules');
let value = document.createElement('span'); let value = document.createElement('span');
@ -173,9 +185,9 @@ function create_right_column_for_modules(component) {
/* ---------------------------------------------------------------------------------- */ /* ---------------------------------------------------------------------------------- */
// input elements // input elements
function create_pushbutton(component) { function createPushbutton(component) {
// Creates row-element containing a push button // Creates row-element containing a push button
var elem = create_input_element(component); var elem = createInputElement(component);
elem.classList.add("push-button"); elem.classList.add("push-button");
elem.onclick = function (e) { elem.onclick = function (e) {
console.log('click pushbutton'); console.log('click pushbutton');
@ -188,10 +200,10 @@ function create_pushbutton(component) {
return elem; return elem;
} }
function create_input(component) { function createInput(component) {
// Creates row-element containing input-item. // Creates row-element containing input-item.
var command = component.command; var command = component.command;
var input = create_input_element(component, 'input', 'input-text'); var input = createInputElement(component, 'input', 'input-text');
input.type = "text"; input.type = "text";
input.style.width = "100px"; input.style.width = "100px";
input.addEventListener("focus", function(evt) { input.addEventListener("focus", function(evt) {
@ -204,10 +216,10 @@ function create_input(component) {
// User decided to cancel // User decided to cancel
let input = e.target; let input = e.target;
input.value = input.oldValue; input.value = input.oldValue;
resize_textfield(input); resizeTextfield(input);
var row = input.closest('div'); var row = input.closest('div');
row.style.backgroundColor = "white"; row.style.backgroundColor = "white";
hide_input_elements(); hideInputElements();
} }
} }
@ -247,16 +259,16 @@ function create_input(component) {
row.style.backgroundColor = "orangered"; row.style.backgroundColor = "orangered";
// Request for command // Request for command
sendCommand(s, command + " " + value); sendCommand(s, command + " " + value);
resize_textfield(input); resizeTextfield(input);
prompt = false; prompt = false;
hide_input_elements(); hideInputElements();
}, function () { }, function () {
// User decided to cancel // User decided to cancel
input.value = input.actualValue; input.value = input.actualValue;
resize_textfield(input); resizeTextfield(input);
row.style.backgroundColor = "white"; row.style.backgroundColor = "white";
prompt = false; prompt = false;
hide_input_elements(); hideInputElements();
}); });
} }
@ -269,7 +281,7 @@ function create_input(component) {
input.actualValue = input.value; input.actualValue = input.value;
sendCommand(s, component.name + " " + input.value); sendCommand(s, component.name + " " + input.value);
input.blur(); input.blur();
hide_input_elements(); hideInputElements();
}; };
form.appendChild(input); form.appendChild(input);
return form; return form;
@ -287,9 +299,9 @@ function create_input(component) {
} }
} }
function create_checkbox(component) { function createCheckbox(component) {
// Creates row-element containing checkbox-item // Creates row-element containing checkbox-item
var input = create_input_element(component, 'input', 'parameter-checkbox'); var input = createInputElement(component, 'input', 'parameter-checkbox');
input.type = "checkbox"; input.type = "checkbox";
input.onclick = function () { input.onclick = function () {
@ -302,7 +314,7 @@ function create_checkbox(component) {
row.style.backgroundColor = "orangered"; row.style.backgroundColor = "orangered";
console.log('send ', input.checked); console.log('send ', input.checked);
sendCommand(s, component.command + " " + input.checked); sendCommand(s, component.command + " " + input.checked);
// hide_input_elements(); // hideInputElements();
}; };
let right = document.createElement('span'); let right = document.createElement('span');
@ -310,10 +322,10 @@ function create_checkbox(component) {
return right; return right;
} }
function create_enum(component) { function createEnum(component) {
// Creates row-element containing dropdown-selection. // Creates row-element containing dropdown-selection.
var buttons = component.enum_names; var buttons = component.enum_names;
var select = create_input_element(component, 'select', 'select-params'); var select = createInputElement(component, 'select', 'select-params');
for (var i = 0; i < buttons.length; i++) { for (var i = 0; i < buttons.length; i++) {
var option = document.createElement('option'); var option = document.createElement('option');
@ -330,7 +342,7 @@ function create_enum(component) {
let index = select.value - 1; let index = select.value - 1;
console.log('send', buttons[index].title); console.log('send', buttons[index].title);
sendCommand(s, component.command + " " + select.value); sendCommand(s, component.command + " " + select.value);
// hide_input_elements(); // hideInputElements();
}; };
select.onfocus = function () { select.onfocus = function () {
@ -343,7 +355,7 @@ function create_enum(component) {
return right; return right;
} }
function create_input_element(component, tag='span', cls='col-right-modules') { function createInputElement(component, tag='span', cls='col-right-modules') {
var input_element = document.createElement(tag); var input_element = document.createElement(tag);
input_element.classList.add('col-right'); input_element.classList.add('col-right');
if (cls) if (cls)
@ -356,14 +368,14 @@ function create_input_element(component, tag='span', cls='col-right-modules') {
/* ---------------------------------------------------------------------------------- */ /* ---------------------------------------------------------------------------------- */
function hide_input_elements(){ function hideInputElements(){
let input_elements = document.getElementsByClassName('input-element'); let input_elements = document.getElementsByClassName('input-element');
for (let i = 0; i < input_elements.length; i++) { for (let i = 0; i < input_elements.length; i++) {
input_elements[i].classList.add('input-element-hidden'); input_elements[i].classList.add('input-element-hidden');
} }
} }
function resize_textfield(input) { function resizeTextfield(input) {
if (input.value.length > input.size * 12 / 20) { if (input.value.length > input.size * 12 / 20) {
var str0 = window.getComputedStyle(input).fontSize; var str0 = window.getComputedStyle(input).fontSize;
var str1 = str0.substring(0, str0.length - 2); var str1 = str0.substring(0, str0.length - 2);
@ -404,7 +416,7 @@ function appendToGridElement(s, title, type, content) {
/* ---------------------------------------------------------------------------------- */ /* ---------------------------------------------------------------------------------- */
// obsolete... // obsolete...
// function create_pushbutton_row(component) { // function createPushbutton_row(component) {
// // Creates row-element containing a push button // // Creates row-element containing a push button
// var name = component.name; // var name = component.name;
// var command = component.command; // var command = component.command;
@ -413,10 +425,10 @@ function appendToGridElement(s, title, type, content) {
// left.id = component.name; // left.id = component.name;
// left.name = component.title; // left.name = component.title;
// var right = create_input_element(component); // var right = createInputElement(component);
// right.classList.add("push-button"); // right.classList.add("push-button");
// row = append_to_content(left, right); // row = appendToContent(left, right);
// right.onclick = function () { // right.onclick = function () {
// if (writePermission) { // if (writePermission) {
// var row = left.parentNode; // var row = left.parentNode;
@ -456,7 +468,7 @@ function appendToGridElement(s, title, type, content) {
// var command = component.command; // var command = component.command;
// var left = createTitle(component); // var left = createTitle(component);
// var input = create_input_element(component, 'input', 'input-text'); // var input = createInputElement(component, 'input', 'input-text');
// input.type = "text"; // input.type = "text";
// input.style.width = "100px"; // input.style.width = "100px";
// input.addEventListener("focus", function(evt) { // input.addEventListener("focus", function(evt) {
@ -468,7 +480,7 @@ function appendToGridElement(s, title, type, content) {
// if (e.which === 27 || e.key == "Escape") { // if (e.which === 27 || e.key == "Escape") {
// // User decided to cancel // // User decided to cancel
// input.value = intput.oldValue; // input.value = intput.oldValue;
// resize_textfield(input); // resizeTextfield(input);
// var row = left.parentNode; // var row = left.parentNode;
// row.style.backgroundColor = "white"; // row.style.backgroundColor = "white";
// } // }
@ -514,12 +526,12 @@ function appendToGridElement(s, title, type, content) {
// row.style.backgroundColor = "orangered"; // row.style.backgroundColor = "orangered";
// // Request for command // // Request for command
// sendCommand(s, command + " " + value); // sendCommand(s, command + " " + value);
// resize_textfield(input); // resizeTextfield(input);
// prompt = false; // prompt = false;
// }, function () { // }, function () {
// // User decided to cancel // // User decided to cancel
// input.value = input.actualValue; // input.value = input.actualValue;
// resize_textfield(input); // resizeTextfield(input);
// row.style.backgroundColor = "white"; // row.style.backgroundColor = "white";
// prompt = false; // prompt = false;
// }); // });
@ -552,20 +564,20 @@ function appendToGridElement(s, title, type, content) {
// input.actualValue = value; // input.actualValue = value;
// // Request for command // // Request for command
// sendCommand(s, command + " " + value); // sendCommand(s, command + " " + value);
// resize_textfield(input); // resizeTextfield(input);
// prompt = false; // prompt = false;
// }, function () { // }, function () {
// // User decided to cancel // // User decided to cancel
// input.value = input.oldValue; // input.value = input.oldValue;
// resize_textfield(input); // resizeTextfield(input);
// prompt = false; // prompt = false;
// }); // });
// } // }
// }; // };
// form.appendChild(input); // form.appendChild(input);
// var right = create_input_element(component); // var right = createInputElement(component);
// right.appendChild(form); // right.appendChild(form);
// return append_to_content(left, right); // return appendToContent(left, right);
// function posTextfield(s, left) { // function posTextfield(s, left) {
// if (debug_group_daniel) { // if (debug_group_daniel) {
@ -580,11 +592,11 @@ function appendToGridElement(s, title, type, content) {
// } // }
// } // }
// function create_checkbox_row(component) { // function createCheckbox_row(component) {
// // Creates row-element containing checkbox-item // // Creates row-element containing checkbox-item
// var command = component.command; // var command = component.command;
// var left = createTitle(component); // var left = createTitle(component);
// var input = create_input_element(component, 'input', 'parameter-checkbox'); // var input = createInputElement(component, 'input', 'parameter-checkbox');
// input.type = "checkbox"; // input.type = "checkbox";
// input.onkeyup = function (e) { // input.onkeyup = function (e) {
// if (e.keyCode === 32) { // if (e.keyCode === 32) {
@ -644,16 +656,16 @@ function appendToGridElement(s, title, type, content) {
// right.classList.add("col-right"); // right.classList.add("col-right");
// right.appendChild(input); // right.appendChild(input);
// right.appendChild(label); // right.appendChild(label);
// return append_to_content(left, right); // return appendToContent(left, right);
// } // }
// function create_enum_row(component) { // function createEnum_row(component) {
// // Creates row-element containing dropdown-selection. // // Creates row-element containing dropdown-selection.
// var name = component.name; // var name = component.name;
// var command = component.command; // var command = component.command;
// var buttons = component.enum_names; // var buttons = component.enum_names;
// var left = createTitle(component); // var left = createTitle(component);
// var select = create_input_element(component, 'select', 'select-params'); // var select = createInputElement(component, 'select', 'select-params');
// select.onfocus = function () { // select.onfocus = function () {
// select.oldIndex = select.selectedIndex; // select.oldIndex = select.selectedIndex;
// } // }
@ -698,7 +710,7 @@ function appendToGridElement(s, title, type, content) {
// var right = document.createElement('span'); // var right = document.createElement('span');
// right.classList.add("col-right"); // right.classList.add("col-right");
// right.appendChild(select); // right.appendChild(select);
// return append_to_content(left, right); // return appendToContent(left, right);
// } // }
// ...obsolete // ...obsolete
@ -738,8 +750,8 @@ function appendToGridElement(s, title, type, content) {
// // Creates row-element containing link AND read-only-item. // // Creates row-element containing link AND read-only-item.
// var link = component.link; // var link = component.link;
// if (!link) // simple rdonly // if (!link) // simple rdonly
// return append_to_content(createTitle(component), // return appendToContent(createTitle(component),
// create_input_element(component)); // createInputElement(component));
// // with link // // with link
// var left = document.createElement('a'); // var left = document.createElement('a');
@ -749,7 +761,7 @@ function appendToGridElement(s, title, type, content) {
// left.id = component.name; // left.id = component.name;
// row = append_to_content(left, create_input_element(component)); // row = appendToContent(left, createInputElement(component));
// row.onclick = function () { // row.onclick = function () {
// this.style.backgroundColor = "orangered"; // this.style.backgroundColor = "orangered";
// left.click(); // left.click();