From 0f16699323c90f33aee00595f7fcc9be4212a0b8 Mon Sep 17 00:00:00 2001 From: Markus Zolliker Date: Fri, 2 May 2025 10:11:02 +0200 Subject: [PATCH 1/2] change value of input element only when opening the edit updates do not need to update them (not yet done for enum and checkbox) --- client/jsFiles/SEAWebClientCommunication.js | 11 +---------- client/jsFiles/SEAWebClientGroup.js | 5 +++++ 2 files changed, 6 insertions(+), 10 deletions(-) diff --git a/client/jsFiles/SEAWebClientCommunication.js b/client/jsFiles/SEAWebClientCommunication.js index 6f6233a..3c89899 100644 --- a/client/jsFiles/SEAWebClientCommunication.js +++ b/client/jsFiles/SEAWebClientCommunication.js @@ -282,19 +282,10 @@ function updateValue(component) { if (text) { elem.innerHTML = text; } - } + } else if (type == "input") { let row = elem.closest('div'); row.classList.remove('row-waiting-for-answer'); - - let oldValue = ('oldValue' in elem) ? elem.oldValue : elem.value; - if (component.value != elem.value && parseFloat(component.value) != parseFloat(elem.value) && component.value != oldValue) { - if (elem == document.activeElement || oldValue != elem.value) { - row.classList.add('row-waiting-for-answer'); - } else { - elem.value = component.value; - } - } elem.actualValue = component.value; resizeTextfield(elem); } else if (type == "checkbox") { diff --git a/client/jsFiles/SEAWebClientGroup.js b/client/jsFiles/SEAWebClientGroup.js index dcb54c7..560b68d 100644 --- a/client/jsFiles/SEAWebClientGroup.js +++ b/client/jsFiles/SEAWebClientGroup.js @@ -242,6 +242,10 @@ function createIconEdit (input_element) { hideInputElements(); if (is_hidden) { input_element.classList.remove('input-element-hidden'); + if (input_element.inputChild) { + // update input value before edit + input_element.inputChild.value = input_element.inputChild.actualValue; + } icon_edit.setAttribute('src', 'res/icon_edit_close.png'); } else { icon_edit.setAttribute('src', 'res/icon_edit.png'); @@ -327,6 +331,7 @@ function createInputText(component) { }; form.appendChild(input); form.appendChild(createSubmitButton()); + form.inputChild = input; return form; } From 5c18791c138a7cde0d635a55aab881f0ff6d583c Mon Sep 17 00:00:00 2001 From: Daniel Date: Mon, 5 May 2025 10:17:35 +0200 Subject: [PATCH 2/2] Prepare radio-button-group --- client/cssFiles/SEAWebClientGroup.css | 16 +++++-- client/jsFiles/SEAWebClientCommunication.js | 14 +++--- client/jsFiles/SEAWebClientGroup.js | 48 ++++++++++++++++++--- 3 files changed, 62 insertions(+), 16 deletions(-) diff --git a/client/cssFiles/SEAWebClientGroup.css b/client/cssFiles/SEAWebClientGroup.css index 706ab9e..5b5c8eb 100644 --- a/client/cssFiles/SEAWebClientGroup.css +++ b/client/cssFiles/SEAWebClientGroup.css @@ -48,7 +48,7 @@ } .row-waiting-for-answer { - background-color: LightGoldenrodYellow; + background-color: orangered; } /* ------------------------------ icon-modules ------------------------------ */ @@ -143,12 +143,22 @@ /* ------------------------------ pushbutton ------------------------------ */ .push-button-active { - text-decoration: underline; + display: inline-block; + height: 20px; + padding: 0 4px 0 4px; + border-radius: 6px; cursor: pointer; + text-align: center; + /* border: 1px solid #303030; */ + color: #303030; + background: #dddddd; + + /* box-shadow: 2px 4px 4px lightgray; */ } .push-button-active:hover { - color: blue; + background: whitesmoke; + /* box-shadow: 1px 2px 2px dimgray; */ } /* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ diff --git a/client/jsFiles/SEAWebClientCommunication.js b/client/jsFiles/SEAWebClientCommunication.js index 6f6233a..dbb2d3f 100644 --- a/client/jsFiles/SEAWebClientCommunication.js +++ b/client/jsFiles/SEAWebClientCommunication.js @@ -309,13 +309,13 @@ function updateValue(component) { let row = elem.closest('div'); row.classList.remove('row-waiting-for-answer'); - let options = elem.childNodes; - for (var j = 0; j < options.length; j++) { - if (options[j].label == component.value) { - elem.value = j + 1; - } - } - } else if (type == "pushbutton") { + // let options = elem.childNodes; + // for (var j = 0; j < options.length; j++) { + // if (options[j].label == component.value) { + // elem.value = j + 1; + // } + // } + elem.value = component.value; console.log('update pushbutton'); console.log('component.name:', component.name); console.log('element', elem); diff --git a/client/jsFiles/SEAWebClientGroup.js b/client/jsFiles/SEAWebClientGroup.js index dcb54c7..a09e0d0 100644 --- a/client/jsFiles/SEAWebClientGroup.js +++ b/client/jsFiles/SEAWebClientGroup.js @@ -1,4 +1,4 @@ -var writePermission = false; +var writePermission = true; var showParams = false; var showConsole = false; var prompt = false // True while a prompt is opened. @@ -188,7 +188,7 @@ function createRightColumnForModules(component) { component.type == 'checkbox' || component.type == 'enum' ) { - let input_element = createType(component); + let input_element = chooseTypeOfInput(component); let icon_edit = createIconEdit(input_element); right.appendChild(icon_edit); right.appendChild(input_element); @@ -208,7 +208,7 @@ function createRightColumnForParameters(component) { component.type == 'checkbox' || component.type == 'enum' ) { - let input_element = createType(component); + let input_element = chooseTypeOfInput(component); let icon_edit = createIconEdit(input_element); right.appendChild(icon_edit); right.appendChild(input_element); @@ -251,7 +251,7 @@ function createIconEdit (input_element) { return icon_edit; } -function createType (component) { +function chooseTypeOfInput (component) { let input_element; switch (component.type) { case 'enum': @@ -332,13 +332,13 @@ function createInputText(component) { function createCheckbox(component) { // Creates row-element containing checkbox-item - var input = createInputElement(component, 'input', 'parameter-checkbox'); + let input = createInputElement(component, 'input', 'parameter-checkbox'); input.type = "checkbox"; input.onclick = function (e) { e.stopPropagation; } - var form = document.createElement('form'); + let form = document.createElement('form'); form.onsubmit = function (e) { e.preventDefault(); var row = form.closest('div'); @@ -384,6 +384,42 @@ function createEnum(component) { return right; } +function createRadio(component) { + + console.log(component); + let array_names = component.enum_names; + + let form = createInputElement(component, 'form', 'radio-button-group'); + form.onsubmit = function (e) { + e.preventDefault(); + var row = form.closest('div'); + row.classList.add('row-waiting-for-answer'); + sendCommand(s, component.command + " " + 'on'); + hideInputElements(); + }; + + for (var i = 0; i < array_names.length; i++) { + let label = document.createElement('label'); + label.setAttribute('for', array_names[i].title); + label.innerHTML = array_names[i].title; + + let radio = document.createElement('input'); + radio.setAttribute('type', 'radio'); + radio.classList.add("radio"); + radio.setAttribute('id', array_names[i].title); + radio.setAttribute('name', component.name); + radio.onclick = function(e) { + e.stopPropagation(); + } + + form.appendChild(label); + form.appendChild(radio); + } + + form.appendChild(createSubmitButton()); + return form; +} + function createInputElement(component, tag='span', cls='col-right-modules') { var input_element = document.createElement(tag); input_element.classList.add('col-right');