From 79790e88b9950d9c4fb6925b3cf9ac50bf3aa919 Mon Sep 17 00:00:00 2001 From: Manuel Piroch Date: Sun, 21 Apr 2024 06:16:27 -0300 Subject: [PATCH 1/8] add gifplayer.htm --- tools/cdata.js | 3 +- wled00/data/gifplayer/gifplayer.htm | 1132 +++++++++++++++++++++++++++ wled00/wled_server.cpp | 10 + 3 files changed, 1144 insertions(+), 1 deletion(-) create mode 100644 wled00/data/gifplayer/gifplayer.htm diff --git a/tools/cdata.js b/tools/cdata.js index 12dda1cbe0..45a16b2e0d 100644 --- a/tools/cdata.js +++ b/tools/cdata.js @@ -26,7 +26,7 @@ const packageJson = require("../package.json"); // Export functions for testing module.exports = { isFileNewerThan, isAnyFileInFolderNewerThan }; -const output = ["wled00/html_ui.h", "wled00/html_pixart.h", "wled00/html_cpal.h", "wled00/html_pxmagic.h", "wled00/html_settings.h", "wled00/html_other.h"] +const output = ["wled00/html_ui.h", "wled00/html_pixart.h", "wled00/html_cpal.h", "wled00/html_pxmagic.h", "wled00/html_gifplayer.h", "wled00/html_settings.h", "wled00/html_other.h"] // \x1b[34m is blue, \x1b[36m is cyan, \x1b[0m is reset const wledBanner = ` @@ -239,6 +239,7 @@ writeHtmlGzipped("wled00/data/index.htm", "wled00/html_ui.h", 'index'); writeHtmlGzipped("wled00/data/pixart/pixart.htm", "wled00/html_pixart.h", 'pixart'); writeHtmlGzipped("wled00/data/cpal/cpal.htm", "wled00/html_cpal.h", 'cpal'); writeHtmlGzipped("wled00/data/pxmagic/pxmagic.htm", "wled00/html_pxmagic.h", 'pxmagic'); +writeHtmlGzipped("wled00/data/gifplayer/gifplayer.htm", "wled00/html_gifplayer.h", 'gifplayer'); writeChunks( "wled00/data", diff --git a/wled00/data/gifplayer/gifplayer.htm b/wled00/data/gifplayer/gifplayer.htm new file mode 100644 index 0000000000..4c011698e9 --- /dev/null +++ b/wled00/data/gifplayer/gifplayer.htm @@ -0,0 +1,1132 @@ + + + + + + GIF Player + + + + +
+
+
+ GIFPLAYER +
+
+
+
+
+ +
+
+ +
+
+ +
+
+
+ + +
+
+ +

+ +
+
+ +
+
+
+
+ +
+
+
+
+ +
+
+
+
+ +
+
+ +
+ + + diff --git a/wled00/wled_server.cpp b/wled00/wled_server.cpp index d184e98789..632047f7f0 100644 --- a/wled00/wled_server.cpp +++ b/wled00/wled_server.cpp @@ -9,6 +9,9 @@ #ifndef WLED_DISABLE_PXMAGIC #include "html_pxmagic.h" #endif +#ifndef WLED_DISABLE_GIFPLAYER + #include "html_gifplayer.h" +#endif #include "html_cpal.h" // define flash strings once (saves flash memory) @@ -455,6 +458,13 @@ void initServer() }); #endif +#ifndef WLED_DISABLE_GIFPLAYER + static const char _gifplayer_htm[] PROGMEM = "/gifplayer.htm"; + server.on(_gifplayer_htm, HTTP_GET, [](AsyncWebServerRequest *request) { + handleStaticContent(request, FPSTR(_gifplayer_htm), 200, FPSTR(CONTENT_TYPE_HTML), PAGE_gifplayer, PAGE_gifplayer_L); + }); +#endif + static const char _cpal_htm[] PROGMEM = "/cpal.htm"; server.on(_cpal_htm, HTTP_GET, [](AsyncWebServerRequest *request) { handleStaticContent(request, FPSTR(_cpal_htm), 200, FPSTR(CONTENT_TYPE_HTML), PAGE_cpal, PAGE_cpal_L); From c3869db6b0c5e363ae25abe49b9e9318d499fd8d Mon Sep 17 00:00:00 2001 From: Manuel Piroch Date: Sun, 21 Apr 2024 14:16:09 -0300 Subject: [PATCH 2/8] add GIF button in palettes pane --- wled00/data/index.htm | 1 + 1 file changed, 1 insertion(+) diff --git a/wled00/data/index.htm b/wled00/data/index.htm index 4a532abb7a..f96a20ae8b 100644 --- a/wled00/data/index.htm +++ b/wled00/data/index.htm @@ -126,6 +126,7 @@
+ From a7dc69e5684c37205584d066a2fc804b7c1486dc Mon Sep 17 00:00:00 2001 From: Manuel Piroch Date: Sun, 21 Apr 2024 14:33:10 -0300 Subject: [PATCH 3/8] small fixes - loading spinner now showing on upload - hostname value now trimmed and checked for change before refresh - remove invisible upload button --- wled00/data/gifplayer/gifplayer.htm | 35 ++++++++--------------------- 1 file changed, 9 insertions(+), 26 deletions(-) diff --git a/wled00/data/gifplayer/gifplayer.htm b/wled00/data/gifplayer/gifplayer.htm index 4c011698e9..6e7e4039ad 100644 --- a/wled00/data/gifplayer/gifplayer.htm +++ b/wled00/data/gifplayer/gifplayer.htm @@ -574,18 +574,6 @@ style="display: none" />
-
-
- -
@@ -952,24 +940,30 @@

method: "POST", body: formData, }; + showLoading(); try { const response = await fetch(url, options); if (!response.ok) { throw new Error(response.status); } toast(`${file.name} successfully uploaded`, "success"); - images(); - storage(); } catch (error) { const msg = `Error uploading image: ${error}`; console.error(msg); toast(msg, "error"); + } finally { + await images(); + await storage(); + hideLoading(); } } // reload all info on change of hostname input hostname.addEventListener("blur", async () => { - WLED_URL = `${protocol}//${hostname.value}`; + hostname.value = hostname.value.trim(); + newWledUrl = `${protocol}//${hostname.value}`; + if (WLED_URL == newWledUrl) { return; } + WLED_URL = newWledUrl // replace url in browser var url = window.location.protocol + @@ -1000,8 +994,6 @@

false ); - gId("btnUpload").addEventListener("click", upload, false); - gId("dropzone").addEventListener("dragover", (e) => { e.preventDefault(); }); @@ -1015,8 +1007,6 @@

source.files = e.dataTransfer.files; const { name } = source.files[0]; - // gId("dropzoneLabel").textContent = `Image ${name} selected!`; - btnUpload.removeAttribute("disabled"); upload(); }); @@ -1033,14 +1023,7 @@

return; } const { name } = e.target.files[0]; - // dropzoneLabel.textContent = `Image ${name} selected!`; - btnUpload.removeAttribute("disabled"); - console.log("test"); upload(); - } else { - // dropzoneLabel.textContent = - // "Drag and drop a file here or click to select a file"; - btnUpload.setAttribute("disabled", ""); } }); From d45409c9b193ada067d62caccffd2e3d71c5744f Mon Sep 17 00:00:00 2001 From: Manuel Piroch Date: Sun, 21 Apr 2024 16:55:15 -0300 Subject: [PATCH 4/8] show ID of saved preset --- wled00/data/gifplayer/gifplayer.htm | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/wled00/data/gifplayer/gifplayer.htm b/wled00/data/gifplayer/gifplayer.htm index 6e7e4039ad..831c47d7ec 100644 --- a/wled00/data/gifplayer/gifplayer.htm +++ b/wled00/data/gifplayer/gifplayer.htm @@ -915,7 +915,7 @@

const { success } = await response.json(); if (success) { - toast("Request sent successfully"); + toast(`Saved as preset with ID ${id}`); window.parent.postMessage("loadPresets", WLED_URL); } } catch (error) { From 9747e61cc618bfdfc4508445d5c393377adb7934 Mon Sep 17 00:00:00 2001 From: Manuel Piroch Date: Wed, 24 Apr 2024 11:08:40 -0300 Subject: [PATCH 5/8] turn hostname red on error, reduce connection timeouts --- wled00/data/gifplayer/gifplayer.htm | 24 ++++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) diff --git a/wled00/data/gifplayer/gifplayer.htm b/wled00/data/gifplayer/gifplayer.htm index 831c47d7ec..a2da51325b 100644 --- a/wled00/data/gifplayer/gifplayer.htm +++ b/wled00/data/gifplayer/gifplayer.htm @@ -221,6 +221,10 @@ text-align: center; } + #hostname.error { + color: var(--error-light); + } + .dropzone { border: 1px dashed var(--gray-light); background-color: var(--gray-dark); @@ -574,7 +578,6 @@ style="display: none" /> -