linse/seweb
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pushbutton changed to link in left column

Browse Source
This commit is contained in:
Daniel
2025-05-01 14:32:31 +02:00
parent 0542f41ec0
commit 715381c088
4 changed files with 95 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

163
client/jsFiles/SEAWebClientGroup.js
View File

@ -88,6 +88,19 @@ function createLeftColumnForModules(component) {
let modules_title = document.createElement('span');
modules_title.classList.add('modules-title');
modules_title.innerHTML = component.title;
if (component.type == 'pushbutton') {
modules_title.classList.add('push-button');
if (writePermission == true) {
modules_title.classList.add('push-button-active');
}
modules_title.onclick = function () {
if (writePermission == true) {
let row = button.closest('div');
row.classList.add('row-waiting-for-answer');
sendCommand(s, component.command);
}
}
}
left.appendChild(modules_title);
if (component.statusname) {
let status_info = document.createElement('span');
@ -135,8 +148,29 @@ function createLeftColumnForModules(component) {
function createLeftColumnForParameters(component) {
let left = document.createElement('span');
left.classList.add('col-left');
left.innerHTML = component.title;
if (component.type == 'pushbutton') {
left.appendChild(createPushButton (component));
} else {
left.innerHTML = component.title;
}
return left;
function createPushButton (component) {
let button = document.createElement('span');
button.classList.add('push-button');
if (writePermission == true) {
button.classList.add('push-button-active');
}
button.innerHTML = component.title;
button.onclick = function () {
if (writePermission == true) {
let row = button.closest('div');
row.classList.add('row-waiting-for-answer');
sendCommand(s, component.command);
}
}
return button;
}
}
/* %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */
@ -151,15 +185,12 @@ function createRightColumnForModules(component) {
if (component.targetname) {
if (component.type == 'input' ||
component.type == 'pushbutton' ||
component.type == 'checkbox' ||
component.type == 'enum'
) {
let input_element = createType(component);
if (component.type != 'pushbutton') {
let icon_edit = createIconEdit(input_element);
right.appendChild(icon_edit);
}
let icon_edit = createIconEdit(input_element);
right.appendChild(icon_edit);
right.appendChild(input_element);
}
}
@ -174,15 +205,12 @@ function createRightColumnForParameters(component) {
right.appendChild(createValue(component));
if (component.type == 'input' ||
component.type == 'pushbutton' ||
component.type == 'checkbox' ||
component.type == 'enum'
) {
let input_element = createType(component);
if (component.type != 'pushbutton') {
let icon_edit = createIconEdit(input_element);
right.appendChild(icon_edit);
}
let icon_edit = createIconEdit(input_element);
right.appendChild(icon_edit);
right.appendChild(input_element);
}
return right;
@ -226,14 +254,7 @@ function createType (component) {
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');
if (writePermission == false) {
input_element.classList.add('input-element-button-hidden');
}
break;
break;
case 'input':
input_element = createInputText(component);
input_element.classList.add('input-element', 'input-element-hidden');
@ -249,20 +270,6 @@ function createType (component) {
/* ---------------------------------------------------------------------------------- */
// input elements
function createPushbutton(component) {
// Creates row-element containing a push button
var button = createInputElement(component, 'button', 'push-button');
button.setAttribute('type', 'button');
button.onclick = function () {
let row = button.closest('div');
// row.classList.add('row-waiting-for-answer');
sendCommand(s, component.command);
}
let elem = document.createElement('span');
elem.appendChild(button);
return elem;
}
function createInputText(component) {
// Creates row-element containing input-item.
@ -270,19 +277,15 @@ function createInputText(component) {
var input = createInputElement(component, 'input', 'input-text');
input.type = "text";
input.style.width = "100px";
input.onclick = function (e) {
e.stopPropagation();
}
// Prevent updates, while user is changing textfield
input.addEventListener("focus", function(evt) {
let elm = evt.target;
setTimeout(function(){elm.setSelectionRange(0, elm.value.length);},0);
});
let submit_btn = document.createElement('input');
submit_btn.setAttribute('type', 'image');
submit_btn.classList.add('icon-modules', 'icon-okay');
submit_btn.setAttribute('src', 'res/icon_okay.png');
submit_btn
input.onkeydown = function (e) {
if (e.key == "Escape") {
// User decided to cancel
@ -303,52 +306,6 @@ function createInputText(component) {
}, 1);
}
// input.onclick = function (e) {
// e.stopPropagation();
// }
// input.onblur = function () {
// if (prompt) {
// 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;
// if (value == actualValue || value == oldValue ||
// parseFloat(value) == parseFloat(actualValue) || parseFloat(value) == parseFloat(oldValue)) {
// input.value = actualValue;
// // nothing to do.
// row.classList.remove('row-waiting-for-answer');
// return false;
// }
// // User changed value and moved focus to other object.
// alertify.confirm("", "You changed a field without pressing the return key.<br>"
// + "Hint: press ESC for leaving a field unchanged.<b>"
// + "You are connected with <b>" + clientTitle + "</b>.<br>"
// + "Are you sure you want to change the value of<br><b>"
// + component.name + "</b> from <b>" + actualValue
// + "</b> to <b>" + value + "</b>?",
// function () {
// // User decided to proceed.
// row.classList.add('row-waiting-for-answer');
// // Request for command
// sendCommand(s, component.command + " " + value);
// resizeTextfield(input);
// prompt = false;
// hideInputElements();
// }, function () {
// // User decided to cancel
// input.value = input.actualValue;
// resizeTextfield(input);
// row.classList.remove('row-waiting-for-answer');
// prompt = false;
// hideInputElements();
// });
// }
var form = document.createElement('form');
form.onsubmit = function (e) {
e.preventDefault();
@ -361,11 +318,12 @@ function createInputText(component) {
} else {
sendCommand(s, component.name + " " + input.value);
}
row.classList.add('row-waiting-for-answer');
input.blur();
hideInputElements();
};
form.appendChild(input);
form.appendChild(submit_btn);
form.appendChild(createSubmitButton());
return form;
}
@ -373,21 +331,21 @@ function createCheckbox(component) {
// Creates row-element containing checkbox-item
var input = createInputElement(component, 'input', 'parameter-checkbox');
input.type = "checkbox";
input.onclick = function () {
handleCheckbox();
input.onclick = function (e) {
e.stopPropagation;
}
function handleCheckbox() {
let row = input.closest('div');
var form = document.createElement('form');
form.onsubmit = function (e) {
e.preventDefault();
var row = form.closest('div');
row.classList.add('row-waiting-for-answer');
sendCommand(s, component.command + " " + input.checked);
// hideInputElements();
hideInputElements();
};
let right = document.createElement('span');
right.appendChild(input);
return right;
form.appendChild(input);
form.appendChild(createSubmitButton());
return form;
}
function createEnum(component) {
@ -438,6 +396,17 @@ function createInputElement(component, tag='span', cls='col-right-modules') {
return input_element;
}
function createSubmitButton () {
let submit_btn = document.createElement('input');
submit_btn.setAttribute('type', 'image');
submit_btn.classList.add('icon-modules', 'icon-okay');
submit_btn.setAttribute('src', 'res/icon_okay.png');
submit_btn.onclick = function (e) {
e.stopPropagation();
}
return submit_btn;
}
/* ---------------------------------------------------------------------------------- */
// Hides all input elements (input text, pushbotton, enum, checkbox)