pikvm/pikvm#1405: Fixed behaviour on duplicating gpio leds

This commit is contained in:
Maxim Devaev 2024-10-02 03:35:57 +03:00
parent f4ba4210e1
commit 8ce27dca3f

View File

@ -23,7 +23,7 @@
"use strict"; "use strict";
import {tools, $, $$$} from "../tools.js"; import {tools, $, $$} from "../tools.js";
import {wm} from "../wm.js"; import {wm} from "../wm.js";
@ -39,29 +39,26 @@ export function Gpio(__recorder) {
self.setState = function(state) { self.setState = function(state) {
if (state) { if (state) {
for (let channel in state.inputs) { for (let channel in state.inputs) {
let el = $(`gpio-led-${channel}`); for (let el of $$(`gpio-led-${channel}`)) {
if (el) {
__setLedState(el, state.inputs[channel].state); __setLedState(el, state.inputs[channel].state);
} }
} }
for (let channel in state.outputs) { for (let channel in state.outputs) {
for (let type of ["switch", "button"]) { for (let type of ["switch", "button"]) {
let el = $(`gpio-${type}-${channel}`); for (let el of $$(`gpio-${type}-${channel}`)) {
if (el) {
tools.el.setEnabled(el, state.outputs[channel].online && !state.outputs[channel].busy); tools.el.setEnabled(el, state.outputs[channel].online && !state.outputs[channel].busy);
} }
} }
let el = $(`gpio-switch-${channel}`); for (let el of $$(`gpio-switch-${channel}`)) {
if (el) {
el.checked = state.outputs[channel].state; el.checked = state.outputs[channel].state;
} }
} }
} else { } else {
for (let el of $$$(".gpio-led")) { for (let el of $$("gpio-led")) {
__setLedState(el, false); __setLedState(el, false);
} }
for (let selector of [".gpio-switch", ".gpio-button"]) { for (let selector of ["gpio-switch", "gpio-button"]) {
for (let el of $$$(selector)) { for (let el of $$(selector)) {
tools.el.setEnabled(el, false); tools.el.setEnabled(el, false);
} }
} }
@ -103,13 +100,11 @@ export function Gpio(__recorder) {
$("gpio-menu").innerHTML = content; $("gpio-menu").innerHTML = content;
for (let channel in model.scheme.outputs) { for (let channel in model.scheme.outputs) {
let el = $(`gpio-switch-${channel}`); for (let el of $$(`gpio-switch-${channel}`)) {
if (el) { tools.el.setOnClick(el, tools.makeClosure(__switchChannel, el));
tools.el.setOnClick(el, __createAction(el, __switchChannel));
} }
el = $(`gpio-button-${channel}`); for (let el of $$(`gpio-button-${channel}`)) {
if (el) { tools.el.setOnClick(el, tools.makeClosure(__pulseChannel, el));
tools.el.setOnClick(el, __createAction(el, __pulseChannel));
} }
} }
@ -120,27 +115,33 @@ export function Gpio(__recorder) {
self.setState(__state); self.setState(__state);
}; };
var __createAction = function(el, action) {
return () => action(el);
};
var __createItem = function(item) { var __createItem = function(item) {
if (item.type === "label") { if (item.type === "label") {
return item.text; return item.text;
} else if (item.type === "input") { } else if (item.type === "input") {
return ` return `
<img id="gpio-led-${item.channel}" class="gpio-led inline-lamp-big led-gray" <img
src="/share/svg/led-circle.svg" data-color="${item.color}" /> class="gpio-led gpio-led-${item.channel} inline-lamp-big led-gray"
src="/share/svg/led-circle.svg"
data-color="${item.color}"
/>
`; `;
} else if (item.type === "output") { } else if (item.type === "output") {
let controls = []; let controls = [];
let confirm = (item.confirm ? "Are you sure you want to perform this action?" : ""); let confirm = (item.confirm ? "Are you sure you want to perform this action?" : "");
if (item.scheme["switch"]) { if (item.scheme["switch"]) {
let id = tools.makeId();
controls.push(` controls.push(`
<td><div class="switch-box"> <td><div class="switch-box">
<input disabled type="checkbox" id="gpio-switch-${item.channel}" class="gpio-switch" <input
data-channel="${item.channel}" data-confirm="${confirm}" /> disabled
<label for="gpio-switch-${item.channel}"> type="checkbox"
id="gpio-switch-${id}"
class="gpio-switch gpio-switch-${item.channel}"
data-channel="${item.channel}"
data-confirm="${confirm}"
/>
<label for="gpio-switch-${id}">
<span class="switch-inner"></span> <span class="switch-inner"></span>
<span class="switch"></span> <span class="switch"></span>
</label> </label>
@ -149,10 +150,14 @@ export function Gpio(__recorder) {
} }
if (item.scheme.pulse.delay) { if (item.scheme.pulse.delay) {
controls.push(` controls.push(`
<td><button disabled id="gpio-button-${item.channel}" class="gpio-button" <td><button
${item.hide ? "data-force-hide-menu" : ""} disabled
data-channel="${item.channel}" data-confirm="${confirm}"> class="gpio-button gpio-button-${item.channel}"
${(item.hide ? "&bull; " : "") + item.text} ${item.hide ? "data-force-hide-menu" : ""}
data-channel="${item.channel}"
data-confirm="${confirm}"
>
${(item.hide ? "&bull; " : "") + item.text}
</button></td> </button></td>
`); `);
} }
@ -176,7 +181,7 @@ export function Gpio(__recorder) {
var __switchChannel = function(el) { var __switchChannel = function(el) {
let channel = el.getAttribute("data-channel"); let channel = el.getAttribute("data-channel");
let confirm = el.getAttribute("data-confirm"); let confirm = el.getAttribute("data-confirm");
let to = ($(`gpio-switch-${channel}`).checked ? "1" : "0"); let to = (el.checked ? "1" : "0");
if (to === "0" && el.hasAttribute("data-confirm-off")) { if (to === "0" && el.hasAttribute("data-confirm-off")) {
confirm = el.getAttribute("data-confirm-off"); confirm = el.getAttribute("data-confirm-off");
} }