From b6eb650f0c16dc1115c154e1f0fa5741d12c0115 Mon Sep 17 00:00:00 2001 From: Yehia Shalaby Date: Mon, 13 Apr 2026 13:38:37 +0200 Subject: [PATCH 1/5] add LCDWrapper calss to Wrap the lcd print function --- Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp | 23 +++++++++++++++++++++-- 1 file changed, 21 insertions(+), 2 deletions(-) diff --git a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp index bb4362b..16fe62f 100644 --- a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp +++ b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp @@ -64,7 +64,24 @@ extern PubSubClient client; // #include // https://github.com/johnrickman/LiquidCrystal_I2C -LiquidCrystal_I2C lcd(LCD_ADDRESS, 20, 4); + +class LCDWrapper +{ +public : + void init(LiquidCrystal_I2C* _lcd) + { + _LCD = _lcd; + } + void print(char *str) + { + _LCD->print(str); + } +private: +LiquidCrystal_I2C* _LCD; +}; + +LiquidCrystal_I2C Real_lcd(LCD_ADDRESS, 20, 4); +LCDWrapper lcd; #include "DFPlayer.h" @@ -335,7 +352,9 @@ void GPAD_HAL_setup(Stream *serialport, wifi_mode_t wifiMode, IPAddress &deviceI local_ptr_to_serial = serialport; Wire.begin(); - lcd.init(); + Real_lcd.init(); + lcd.init(&Real_lcd); + #if (DEBUG > 0) serialport->println(F("Clear LCD")); #endif From 619d75e9c6af1c0a78290e89c23ea03187c25a25 Mon Sep 17 00:00:00 2001 From: Yehia Shalaby Date: Mon, 13 Apr 2026 13:47:00 +0200 Subject: [PATCH 2/5] fix lcd extern conflict --- Firmware/GPAD_API/GPAD_API/GPAD_HAL.h | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h index e912ab2..8a29849 100644 --- a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h +++ b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h @@ -185,5 +185,6 @@ void interpretBuffer(char *buf, int rlen, Stream *serialport, PubSubClient *clie void GPAD_HAL_setup(Stream *serialport, wifi_mode_t wifiMode, IPAddress &deviceIp); void GPAD_HAL_loop(); -extern LiquidCrystal_I2C lcd; +// extern LiquidCrystal_I2C lcd; +extern LCDWrapper lcd; #endif From 0e1399a7bc99a7f173b8fe99ff6c4d8d841c773d Mon Sep 17 00:00:00 2001 From: Yehia Shalaby Date: Mon, 13 Apr 2026 14:35:04 +0200 Subject: [PATCH 3/5] add more warp function to the lcdWarper and chnage the LiquidCrystal_I2C at RickmanLiquidCrystal_I2C.h to LCDWrapper. --- Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp | 15 ----- Firmware/GPAD_API/GPAD_API/GPAD_HAL.h | 56 +++++++++++++++++++ .../GPAD_API/RickmanLiquidCrystal_I2C.h | 7 ++- 3 files changed, 60 insertions(+), 18 deletions(-) diff --git a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp index 16fe62f..1f3d520 100644 --- a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp +++ b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp @@ -65,21 +65,6 @@ extern PubSubClient client; // https://github.com/johnrickman/LiquidCrystal_I2C -class LCDWrapper -{ -public : - void init(LiquidCrystal_I2C* _lcd) - { - _LCD = _lcd; - } - void print(char *str) - { - _LCD->print(str); - } -private: -LiquidCrystal_I2C* _LCD; -}; - LiquidCrystal_I2C Real_lcd(LCD_ADDRESS, 20, 4); LCDWrapper lcd; diff --git a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h index 8a29849..ad943fe 100644 --- a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h +++ b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h @@ -168,6 +168,62 @@ namespace gpad_hal const GPAD_API gpadApi = GPAD_API(SemanticVersion(API_MAJOR_VERSION, API_MINOR_VERSION, API_PATCH_VERSION)); } + + +class LCDWrapper : public Print +{ +public : + virtual size_t write(uint8_t b) override { + return _LCD->write(b); + } + void init(LiquidCrystal_I2C* _lcd) + { + _LCD = _lcd; + } + void init() + { + _LCD->init(); + } + void clear(){ + _LCD->clear(); + } + void backlight(){ + _LCD->backlight(); + } + void noBacklight(){ + _LCD->noBacklight(); + } + void setCursor(int16_t col, int16_t row){ + _LCD->setCursor(col, row); + } + void print(const char *str) + { + _LCD->print(str); + } + void print(int c) + { + _LCD->print(c); + } + void print(const __FlashStringHelper* str) + { + _LCD->print(str); + } + void noBlink(){ + _LCD->noBlink(); + } + void blink(){ + _LCD->blink(); + } + void cursor(){ + _LCD->cursor(); + } + void noCursor(){ + _LCD->noCursor(); + } +private: +LiquidCrystal_I2C* _LCD; +}; + // SPI Functions.... void setup_spi(); void receive_byte(byte c); diff --git a/Firmware/GPAD_API/GPAD_API/RickmanLiquidCrystal_I2C.h b/Firmware/GPAD_API/GPAD_API/RickmanLiquidCrystal_I2C.h index dc38258..a25563d 100644 --- a/Firmware/GPAD_API/GPAD_API/RickmanLiquidCrystal_I2C.h +++ b/Firmware/GPAD_API/GPAD_API/RickmanLiquidCrystal_I2C.h @@ -10,7 +10,8 @@ #include // #include -#include +// #include +#include "GPAD_HAL.h" namespace Menu { @@ -18,8 +19,8 @@ namespace Menu class lcdOut : public cursorOut { public: - LiquidCrystal_I2C *device; - inline lcdOut(LiquidCrystal_I2C *o, idx_t *t, panelsList &p, menuOut::styles s = menuOut::minimalRedraw) + LCDWrapper *device; + inline lcdOut(LCDWrapper *o, idx_t *t, panelsList &p, menuOut::styles s = menuOut::minimalRedraw) : cursorOut(t, p, s), device(o) {} size_t write(uint8_t ch) override { return device->write(ch); } void clear() override From c39b573fbafa65d7e027f0dfb4ba26fbe5a1a03e Mon Sep 17 00:00:00 2001 From: Yehia Shalaby Date: Mon, 13 Apr 2026 15:25:10 +0200 Subject: [PATCH 4/5] comment the clearLCD(); call before hal init --- Firmware/GPAD_API/GPAD_API/GPAD_API.ino | 2 +- Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp | 4 +++- Firmware/GPAD_API/GPAD_API/GPAD_HAL.h | 2 +- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/Firmware/GPAD_API/GPAD_API/GPAD_API.ino b/Firmware/GPAD_API/GPAD_API/GPAD_API.ino index a8d8251..3ff24e2 100644 --- a/Firmware/GPAD_API/GPAD_API/GPAD_API.ino +++ b/Firmware/GPAD_API/GPAD_API/GPAD_API.ino @@ -365,7 +365,7 @@ void setup() } serialSplash(); // We call this a second time to get the MAC on the screen - clearLCD(); + // clearLCD(); // Set LED pins as outputs #if defined(LED_D9) diff --git a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp index 1f3d520..0b3741e 100644 --- a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp +++ b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.cpp @@ -335,10 +335,12 @@ void GPAD_HAL_setup(Stream *serialport, wifi_mode_t wifiMode, IPAddress &deviceI // Setup the SWITCH_ENCODER // Print instructions on DEBUG serial port + lcd.init(&Real_lcd); local_ptr_to_serial = serialport; Wire.begin(); + Real_lcd.init(); - lcd.init(&Real_lcd); + #if (DEBUG > 0) serialport->println(F("Clear LCD")); diff --git a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h index ad943fe..6363437 100644 --- a/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h +++ b/Firmware/GPAD_API/GPAD_API/GPAD_HAL.h @@ -241,6 +241,6 @@ void interpretBuffer(char *buf, int rlen, Stream *serialport, PubSubClient *clie void GPAD_HAL_setup(Stream *serialport, wifi_mode_t wifiMode, IPAddress &deviceIp); void GPAD_HAL_loop(); -// extern LiquidCrystal_I2C lcd; +extern LiquidCrystal_I2C Real_lcd; extern LCDWrapper lcd; #endif From 99db58271ad98b98869704fcd3d6cad64d7f41b5 Mon Sep 17 00:00:00 2001 From: nk25719 Date: Mon, 13 Apr 2026 17:47:38 +0300 Subject: [PATCH 5/5] initial commit for the Soft Krake webPage. --- Firmware/GPAD_API/data/index.html | 129 +++++++++++++++++++--- Firmware/GPAD_API/data/style.css | 177 +++++++++++++++++++++++------- 2 files changed, 247 insertions(+), 59 deletions(-) diff --git a/Firmware/GPAD_API/data/index.html b/Firmware/GPAD_API/data/index.html index 64ffffa..90b4383 100644 --- a/Firmware/GPAD_API/data/index.html +++ b/Firmware/GPAD_API/data/index.html @@ -1,24 +1,117 @@ - + - KRAKE Web Server - - - - + + Soft KRAKE + + + -
-

KRAKE Web Server

- + +
+
+ KRAKE icon + KRAKE
- A public invention device - - Update - -
-
Visit: pubinv.org
- + + +
+ + + +
+
+

KRAKE

+

A Public Invention device

+ +
Serial: %SERIAL%
+
URL: %URL%
+
IP: %IP%
+
MAC: %MAC%
+
WiFi RSSI: %RSSI%
+
Uptime: %UPTIME%
+
MQTT: %MQTT%
+ +
+ QR Code +
+
+ +
+
Live LCD Output
+
+
+
+
+
+
+
+
+
+
+ + + + + - + \ No newline at end of file diff --git a/Firmware/GPAD_API/data/style.css b/Firmware/GPAD_API/data/style.css index 97bbb07..0f1fe6d 100644 --- a/Firmware/GPAD_API/data/style.css +++ b/Firmware/GPAD_API/data/style.css @@ -1,60 +1,155 @@ -html { +* { + box-sizing: border-box; +} + +body { + margin: 0; font-family: Arial, Helvetica, sans-serif; - text-align: center; + background: #f4f7f9; + color: #1b1b1b; } -h1 { - font-size: 1.8rem; + +.topbar { + height: 60px; + background: #55b06e8a; color: white; + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 16px; +} + +.brand { + display: flex; + align-items: center; + gap: 10px; + font-weight: bold; + font-size: 1.1rem; } -.topnav { - overflow: hidden; - background-color: #0A1128; + +.brand-icon { + width: 28px; + height: 28px; + object-fit: contain; } -body { - margin: 0; + +.menu-toggle { + background: transparent; + color: white; + border: none; + font-size: 1.8rem; + cursor: pointer; +} + +.side-menu { + position: fixed; + top: 60px; + right: -260px; + width: 240px; + height: calc(100% - 60px); + background: white; + box-shadow: -2px 0 10px rgba(0, 0, 0, 0.12); + transition: right 0.25s ease; + padding: 14px 0; + z-index: 10; } -.content { - padding: 50px; + +.side-menu.open { + right: 0; } -.card-grid { - max-width: 800px; + +.side-menu a { + display: block; + padding: 14px 18px; + color: #222; + text-decoration: none; + border-bottom: 1px solid #eee; + font-size: 0.98rem; +} + +.side-menu a:hover { + background: #f2f6f8; +} + +.container { + max-width: 760px; margin: 0 auto; - display: grid; - grid-gap: 2rem; - grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + padding: 20px 14px 30px; } + .card { - background-color: white; - box-shadow: 2px 2px 12px 1px rgba(140,140,140,.5); + background: white; + border-radius: 12px; + padding: 18px; + margin-bottom: 16px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); +} + +h1 { + margin-top: 0; + margin-bottom: 8px; + font-size: 1.5rem; } -.card-title { - font-size: 1.2rem; + +.subtitle { + margin-top: 0; + color: #555; + margin-bottom: 18px; +} + +.info-row { + margin: 8px 0; + word-break: break-word; +} + +.label { font-weight: bold; - color: #034078 } -.state { - font-size: 1.2rem; - color:#1282A2; + +.qr-box { + margin-top: 16px; } -button { - border: none; - color: #FEFCFB; - padding: 15px 32px; - text-align: center; - font-size: 16px; - width: 100px; - border-radius: 4px; - transition-duration: 0.4s; + +.qr-box img { + width: 120px; + max-width: 100%; + border: 1px solid #ddd; + border-radius: 8px; + background: white; +} + +.lcd-title { + font-weight: bold; + margin-bottom: 12px; } -.button-on { - background-color:#034078; + +.lcd-frame { + background: #222; + display: inline-block; + padding: 12px; + border-radius: 10px; } -.button-on:hover { - background-color: #1282A2; + +.lcd-screen { + background: #a8c97a; + color: #18220f; + padding: 10px 12px; + border-radius: 6px; + font-family: "Courier New", monospace; } -.button-off { - background-color:#858585; + +.lcd-line { + min-height: 1.4em; + white-space: pre; } -.button-off:hover { - background-color: #252524; + +.footer { + text-align: center; + padding: 0 0 24px; +} + +.footer a { + color: #146620; + text-decoration: none; + font-weight: bold; } \ No newline at end of file