input element display:block instead of float -> displayed in the same row

This commit is contained in:
Daniel
2025-04-25 18:29:00 +02:00
parent 13e8570afd
commit bd9efaa3de
3 changed files with 37 additions and 30 deletions

View File

@ -78,18 +78,21 @@ function createRowForParameters(component) {
switch (component.type) {
case 'enum':
input_element = createEnum(component);
input_element.classList.add('input-element', 'input-element-hidden');
break;
case 'pushbutton':
input_element = createPushbutton(component);
input_element.classList.add('input-element-button');
break;
case 'input':
input_element = createInput(component);
input_element.classList.add('input-element', 'input-element-hidden');
break;
case 'checkbox':
input_element = createCheckbox(component);
input_element.classList.add('input-element', 'input-element-hidden');
break;
}
input_element.classList.add('input-element', 'input-element-hidden');
if (component.type != 'pushbutton') {
let icon_edit = createIconEdit();
right.appendChild(icon_edit);
@ -188,16 +191,14 @@ function createRightColumnForModules(component) {
let value = document.createElement('span');
value.classList.add('col-right-value');
value.setAttribute('name', component.name);
value.__ctype__ = component.type;
// value.__ctype__ = component.type;
value.__ctype__ = 'rdonly';
right.appendChild(value);
if (component.targetname) {
var input_element = createInput(component);
input_element.classList.add('input-element', 'input-element-hidden');
let icon_edit = createIconEdit();
right.appendChild(icon_edit);
right.appendChild(input_element);
}
return right;
@ -229,10 +230,13 @@ function createPushbutton(component) {
button.setAttribute('type', 'button');
button.onclick = function () {
console.log('click pushbutton');
let row = button.closest('div');
row.classList.add('row-waiting-for-answer');
sendCommand(s, component.command);
}
return button;
let elem = document.createElement('span');
elem.appendChild(button);
return elem;
}
function createInput(component) {
@ -253,7 +257,7 @@ function createInput(component) {
input.value = input.oldValue;
resizeTextfield(input);
var row = input.closest('div');
row.style.backgroundColor = "white";
row.classList.remove('row-waiting-for-answer');
hideInputElements();
}
}
@ -275,15 +279,16 @@ function createInput(component) {
return false;
}
var row = input.closest('div');
row.classList.add('row-waiting-for-answer');
var value = input.value;
let oldValue = 'oldValue' in input ? input.oldValue : value;
if (!('actualValue' in input)) input.actualValue = oldValue;
actualValue = input.actualValue;
actualValue = input.actualValue;
if (value == actualValue || value == oldValue ||
parseFloat(value) == parseFloat(actualValue) || parseFloat(value) == parseFloat(oldValue)) {
input.value = actualValue;
// nothing to do.
row.style.backgroundColor = "white";
row.classList.remove('row-waiting-for-answer');
return false;
}
// User changed value and moved focus to other object.
@ -295,7 +300,7 @@ function createInput(component) {
+ "</b> to <b>" + value + "</b>?",
function () {
// User decided to proceed.
row.style.backgroundColor = "orangered";
row.classList.add('row-waiting-for-answer');
// Request for command
sendCommand(s, command + " " + value);
resizeTextfield(input);
@ -305,7 +310,7 @@ function createInput(component) {
// User decided to cancel
input.value = input.actualValue;
resizeTextfield(input);
row.style.backgroundColor = "white";
row.classList.remove('row-waiting-for-answer');
prompt = false;
hideInputElements();
});
@ -315,7 +320,7 @@ function createInput(component) {
form.onsubmit = function (e) {
e.preventDefault();
var row = form.closest('div');
row.style.backgroundColor = "orangered";
row.classList.add('row-waiting-for-answer');
// Request for command
input.actualValue = input.value;
if (component.targetname) {
@ -354,7 +359,7 @@ function createCheckbox(component) {
function handleCheckbox() {
console.log('handle checkbox');
let row = input.closest('div');
row.style.backgroundColor = "orangered";
row.classList.add('row-waiting-for-answer');
console.log('send ', input.checked);
sendCommand(s, component.command + " " + input.checked);
// hideInputElements();
@ -381,7 +386,7 @@ function createEnum(component) {
select.oninput = function () {
let row = select.closest('div');
row.style.backgroundColor = "orangered";
row.classList.add('row-waiting-for-answer');
let index = select.value - 1;
console.log('send', buttons[index].title);
sendCommand(s, component.command + " " + select.value);