From 919b48574a4ec2eeb9cf2462e24f7c6e688a4a84 Mon Sep 17 00:00:00 2001 From: Ewoud Date: Sun, 14 Jan 2024 16:01:54 +0100 Subject: [PATCH] Themes, table column values, 3-state bool, insRow, delRow index.css + index.html - add theme dropdown - themes: add :root (WIP) - use in h1, h2, th, module, mdlColumn, over (WIP) index.js - remove varNodeMapping - add theme - add genTableRowHTML index.js: genHTML - table, add insRow/+ button - uiFun handling: -1 for requested, -2 for processed - remove varNodeMapping index.js: receiveData - remove varNodeMapping index.js: changeHTML - simplify label - value / table: simplify using genTableRowHTML - value / th: refactor supporting column values and simplify using genTableRowHTML - value / checkbox: support indeterminate - advanced value assignment - add setTheme and getTheme SysModModel: - getValue: add optional rowNr SysModPins - pinTbl readonly (no insRow and delRow) - pinNr default empty SysModUI - vlTbl default ro - vlloops default empty - processJson: add insRow and delRow (WIP) - insVars: add count and valueFun (WIP)! - 3-state boolean - initVarAndUpdate: support null values (using uint16Max), add valueFun (WIP) SysModWeb - clTbl ro and move table value to columns value - clTbl columns: default null - clientsChanged: remove column values instead of processUIFun (WIP) SysModModules - mdlTbl ro and move table value to columns value - columns value: use valueFun (WIP), default null ArtNet: defa --- data/app.js | 5 +- data/index.css | 125 +- data/index.htm | 33 +- data/index.js | 363 +++-- platformio.ini | 6 +- src/App/AppEffects.h | 23 +- src/App/AppLedsV.cpp | 5 +- src/App/AppLedsV.h | 5 +- src/App/AppModFixtureGen.h | 5 +- src/App/AppModLeds.h | 7 +- src/Sys/SysJsonRDWS.h | 7 +- src/Sys/SysModFiles.cpp | 9 +- src/Sys/SysModFiles.h | 7 +- src/Sys/SysModModel.cpp | 19 +- src/Sys/SysModModel.h | 9 +- src/Sys/SysModNetwork.cpp | 19 +- src/Sys/SysModNetwork.h | 7 +- src/Sys/SysModPins.cpp | 11 +- src/Sys/SysModPins.h | 7 +- src/Sys/SysModPrint.cpp | 5 +- src/Sys/SysModPrint.h | 5 +- src/Sys/SysModSystem.cpp | 9 +- src/Sys/SysModSystem.h | 5 +- src/Sys/SysModUI.cpp | 17 +- src/Sys/SysModUI.h | 76 +- src/Sys/SysModWeb.cpp | 32 +- src/Sys/SysModWeb.h | 5 +- src/SysModule.h | 5 +- src/SysModules.cpp | 29 +- src/SysModules.h | 5 +- src/User/UserModArtNet.h | 7 +- src/User/UserModDDP.h | 8 +- src/User/UserModE131.h | 7 +- src/User/UserModExample.h | 5 +- src/User/UserModHA.h | 5 +- src/User/UserModInstances.h | 13 +- src/User/UserModMDNS.h | 5 +- src/User/UserModWLEDAudio.h | 5 +- src/html_ui.h | 2508 ++++++++++++++++++----------------- src/main.cpp | 5 +- 40 files changed, 1869 insertions(+), 1564 deletions(-) diff --git a/data/app.js b/data/app.js index 113fd282..7b9931d2 100644 --- a/data/app.js +++ b/data/app.js @@ -1,10 +1,11 @@ // @title StarMod // @file app.js -// @date 20231016 +// @date 20240114 // @repo https://github.com/ewowi/StarMod // @Authors https://github.com/ewowi/StarMod/commits/main -// @Copyright (c) 2023 Github StarMod Commit Authors +// @Copyright (c) 2024 Github StarMod Commit Authors // @license GNU GENERAL PUBLIC LICENSE Version 3, 29 June 2007 +// @license For non GPL-v3 usage, commercial licenses must be purchased. Contact moonmodules@icloud.com function userFun(userFunId, data) { if (userFunId == "pview" && jsonValues.pview) { diff --git a/data/index.css b/data/index.css index 28c9aeec..0a30397a 100644 --- a/data/index.css +++ b/data/index.css @@ -1,13 +1,86 @@ /* @title StarMod @file index.css - @date 20231016 + @date 20240114 @repo https://github.com/ewowi/StarMod @Authors https://github.com/ewowi/StarMod/commits/main - @Copyright (c) 2023 Github StarMod Commit Authors + @Copyright (c) 2024 Github StarMod Commit Authors @license GNU GENERAL PUBLIC LICENSE Version 3, 29 June 2007 + @license For non GPL-v3 usage, commercial licenses must be purchased. Contact moonmodules@icloud.com */ +:root, + :root.starmod { + --bg-color: linear-gradient(to bottom, #ffbe33 0%, #b60f62 100%); + --th-color: #b60f6281; + --h-color: #b60f62; + --border-color: #666; + } + :root.light { + --bg-color: #fff; + --h-color: #000000; + --th-color: #6d686a81; + --text-color: #123; + } + :root.dark { + --bg-color: #121212; + --text-color: #696d7d; + } + :root.blue { + --bg-color: #05396B; + --text-color: #E7F1FE; + } + :root.pink { + --bg-color: #ffcad4; + --text-color: #e75480; + } + :root.space { + --bg-color: #000; + --text-color: #f2bd16; + --bg-url: url(//space); + --font-family: 'Press Start 2P', cursive; + } + :root.nyan { + --bg-color: #013367; + --text-color: #fff; + --bg-url: url(//nyan); + --font-family: 'Comic Neue', cursive; + } + +/* inspired by WLED / MoonModules - temporary */ +:root { + --c-1: #111; + --c-f: #fff; + --c-2: #222; + --c-3: #333; + --c-4: #444; + --c-5: #555; + --c-6: #666; + --c-8: #888; + --c-b: #bbb; + --c-c: #ccc; + --c-e: #eee; + --c-d: #ddd; + --c-r: #c32; + --c-g: #2c1; + --c-l: #48a; + --c-y: #a90; + --t-b: 0.5; + --c-o: rgba(34, 34, 34, 0.9); + --c-tb : rgba(34, 34, 34, var(--t-b)); + --c-tba: rgba(102, 102, 102, var(--t-b)); + --c-tbh: rgba(51, 51, 51, var(--t-b)); + /*following are internal*/ + --th: 70px; + --tp: 70px; + --bh: 63px; + --tbp: 14px 14px 10px 14px; + --bbp: 9px 0 7px 0; + --bhd: none; + --sgp: "block"; + --bmt: 0px; +} + /* default nodes */ label { margin-right: 6px; /*space after*/ @@ -53,11 +126,11 @@ select { } h1,h2 { - color: #b60f62; /* StarMod base color??? */ + color: var(--h-color); } div { - line-height: 1.6; /* recommended height */ + line-height: 2; /* 1.6 is recommended height */ } /* for toggleModal */ @@ -105,7 +178,7 @@ div { /* padding-top: 12px; padding-bottom: 12px; */ text-align: left; - background-color: #676767; + background-color: var(--th-color); color: white; } @@ -116,10 +189,10 @@ div { } .module { - border: 3px solid #666; + border: 3px solid var(--border-color); /* background-color: #ddd; */ /* background: linear-gradient(to bottom, #33ccff 0%, #ff99cc 100%); */ - background: linear-gradient(to bottom, #ffbe33 0%, #b60f62 100%); + background: var(--bg-color); /* linear-gradient(to bottom, #ffbe33 0%, #b60f62 100%); */ border-radius: 21px; /* from .5em */ padding: 10px; margin: 10px; /*space around modules */ @@ -131,7 +204,7 @@ div { } .mdlColumn { - border: 3px solid #666; + border: 3px solid var(--border-color); /* border-radius: .5em; */ border-radius: 21px; padding: 10px; @@ -139,41 +212,7 @@ div { } .module.over, .mdlColumn.over { - border: 3px dotted #666; -} - -/* inspired by WLED / MoonModules */ -:root { - --c-1: #111; - --c-f: #fff; - --c-2: #222; - --c-3: #333; - --c-4: #444; - --c-5: #555; - --c-6: #666; - --c-8: #888; - --c-b: #bbb; - --c-c: #ccc; - --c-e: #eee; - --c-d: #ddd; - --c-r: #c32; - --c-g: #2c1; - --c-l: #48a; - --c-y: #a90; - --t-b: 0.5; - --c-o: rgba(34, 34, 34, 0.9); - --c-tb : rgba(34, 34, 34, var(--t-b)); - --c-tba: rgba(102, 102, 102, var(--t-b)); - --c-tbh: rgba(51, 51, 51, var(--t-b)); - /*following are internal*/ - --th: 70px; - --tp: 70px; - --bh: 63px; - --tbp: 14px 14px 10px 14px; - --bbp: 9px 0 7px 0; - --bhd: none; - --sgp: "block"; - --bmt: 0px; + border: 3px dotted var(--border-color); } #connind { diff --git a/data/index.htm b/data/index.htm index b3129569..ca051201 100644 --- a/data/index.htm +++ b/data/index.htm @@ -1,10 +1,14 @@ - + @@ -38,6 +42,19 @@

StarMod by MoonModules 💫

| + | + Theme
@@ -52,7 +69,7 @@

StarMod by MoonModules 💫

☾
-

(c) 2023 MoonModules Licensed under GPL v3

+

(c) 2024 MoonModules Licensed under GPL-v3