Added delay button

webconfig/api.py

@@ -57,6 +57,10 @@ def api_add_button():
             "errorText": data.get("errorText", "Ошибка"),
             "fadeMs": int(data.get("fadeMs", 5000)),
         },
+        "trigger": {
+            "mode": "click" if data.get("triggerMode") == "click" else "hold",
+            "holdMs": int(data.get("holdMs", 800)),
+        },
         "color": data.get("color", "#7b007b"),
     }
     cfg.setdefault("buttons", []).append(btn)
@@ -84,6 +88,15 @@ def api_update_button(bid):
             feedback["successText"] = data.get("successText", feedback.get("successText", ""))
             feedback["errorText"] = data.get("errorText", feedback.get("errorText", "Ошибка"))
             feedback["fadeMs"] = int(data.get("fadeMs", feedback.get("fadeMs", 5000)))
+            trigger = b.setdefault("trigger", {})
+            if "triggerMode" in data:
+                trigger["mode"] = "click" if data["triggerMode"] == "click" else "hold"
+            else:
+                trigger.setdefault("mode", "hold")
+            if "holdMs" in data:
+                trigger["holdMs"] = int(data["holdMs"])
+            else:
+                trigger.setdefault("holdMs", 800)
             if "color" in data:
                 b["color"] = data["color"]
             save_config(cfg)

webconfig/static/app.js

@@ -151,6 +151,12 @@ if (list && window.Sortable) {
 const dlg = $("#btn-dialog");
 const form = $("#btn-form");
 
+function syncHoldRow() {
+    const mode = $("#b-trigger-mode").value;
+    $("#b-hold-row").style.display = mode === "click" ? "none" : "";
+    $("#b-hold-val").textContent = $("#b-hold").value;
+}
+
 function openDialogFor(btn) {
     $("#btn-dialog-title").textContent = btn ? "Редактирование" : "Новая кнопка";
     $("#b-id").value = btn?.id || "";
@@ -161,9 +167,15 @@ function openDialogFor(btn) {
     $("#b-success").value = btn?.feedback?.successText || "";
     $("#b-error").value = btn?.feedback?.errorText || "Ошибка";
     $("#b-color").value = btn?.color || "#7b007b";
+    $("#b-trigger-mode").value = btn?.trigger?.mode || "hold";
+    $("#b-hold").value = btn?.trigger?.holdMs || 800;
+    syncHoldRow();
     dlg.showModal();
 }
 
+$("#b-trigger-mode")?.addEventListener("change", syncHoldRow);
+$("#b-hold")?.addEventListener("input", syncHoldRow);
+
 $("#add-btn")?.addEventListener("click", () => openDialogFor(null));
 
 $$(".buttons-list .edit").forEach(btn => {
@@ -196,6 +208,8 @@ form?.addEventListener("submit", async (e) => {
         successText: $("#b-success").value,
         errorText: $("#b-error").value,
         color: $("#b-color").value,
+        triggerMode: $("#b-trigger-mode").value,
+        holdMs: parseInt($("#b-hold").value, 10),
     };
     if (id) await api("PUT", `/api/buttons/${encodeURIComponent(id)}`, payload);
     else await api("POST", "/api/buttons", payload);

webconfig/templates/index.html

@@ -255,6 +255,15 @@
         <label>Текст успеха <input type="text" id="b-success"></label>
         <label>Текст ошибки <input type="text" id="b-error" value="Ошибка"></label>
         <label>Цвет кнопки <input type="color" id="b-color" value="#7b007b"></label>
+        <label>Срабатывание
+            <select id="b-trigger-mode">
+                <option value="hold">Удержание</option>
+                <option value="click">Клик</option>
+            </select>
+        </label>
+        <label id="b-hold-row">Длительность удержания: <span id="b-hold-val">800</span> мс
+            <input type="range" id="b-hold" min="200" max="3000" step="50" value="800">
+        </label>
         <menu>
             <button value="cancel">Отмена</button>
             <button id="b-save" value="ok" type="submit" class="primary">Сохранить</button>