Microcontrollers
/
LEDLamp
Прати 1
Волим 0
Креирај огранак 0
Код Дискусије 0 Захтеви за спајање 0 Издања 0 Вики Activity
Преглед изворни кода

reset button and styling

master
gituser пре 1 недеља
родитељ
e831a527ab
комит
407cee7d01
4 измењених фајлова са 150 додато и 31 уклоњено
Један поглед Покажи статистику Diff
  1. 1
    3
      .sproject
  2. 125
    23
      HtmlPages.h
  3. 22
    4
      LEDLamp.ino
  4. 2
    1
      sloeber.ino.cpp

+ 1
- 3
.sproject Прегледај датотеку

Config.Release.board.BOARD.ID=d1 Config.Release.board.BOARD.ID=d1
Config.Release.board.BOARD.MENU.FlashFreq=getMenuItemIDFromMenuItemName did not find menu item with name "40MHz" for menu ID "FlashFreq" and for boardID "d1"!
Config.Release.board.BOARD.MENU.FlashMode=getMenuItemIDFromMenuItemName did not find menu item with name "DOUT (compatible)" for menu ID "FlashMode" and for boardID "d1"!
Config.Release.board.BOARD.MENU.baud=921600 Config.Release.board.BOARD.MENU.baud=921600
Config.Release.board.BOARD.MENU.dbg=Disabled Config.Release.board.BOARD.MENU.dbg=Disabled
Config.Release.board.BOARD.MENU.eesz=4M2M Config.Release.board.BOARD.MENU.eesz=4M2M
Config.Release.board.BOARD.MENU.ssl=all Config.Release.board.BOARD.MENU.ssl=all
Config.Release.board.BOARD.MENU.stacksmash=disabled Config.Release.board.BOARD.MENU.stacksmash=disabled
Config.Release.board.BOARD.MENU.vt=flash Config.Release.board.BOARD.MENU.vt=flash
Config.Release.board.BOARD.MENU.wipe=all
Config.Release.board.BOARD.MENU.wipe=none
Config.Release.board.BOARD.MENU.xtal=80 Config.Release.board.BOARD.MENU.xtal=80
Config.Release.board.BOARD.TXT=${SLOEBER_HOME}/arduinoPlugin/packages/esp8266/hardware/esp8266/3.1.2/boards.txt Config.Release.board.BOARD.TXT=${SLOEBER_HOME}/arduinoPlugin/packages/esp8266/hardware/esp8266/3.1.2/boards.txt
Config.Release.board.PROGRAMMER.NAME=Default Config.Release.board.PROGRAMMER.NAME=Default

+ 125
- 23
HtmlPages.h Прегледај датотеку

.toggle-eye:hover { .toggle-eye:hover {
opacity: 1; opacity: 1;
} }

.bar_white {
background: white;
width: 100%;
height: 3px;
margin-bottom: 20px;
}
.bar_red {
background: red;
width: 100%;
height: 3px;
margin-bottom: 20px;
}

.bar_green {
background: green;
width: 100%;
height: 3px;
margin-bottom: 20px;
}

.bar_blue {
background: blue;
width: 100%;
height: 3px;
margin-bottom: 20px;
}
@keyframes fadeIn { @keyframes fadeIn {
from {opacity: 0; transform: translateY(10px);} from {opacity: 0; transform: translateY(10px);}
to {opacity: 1; transform: translateY(0);} to {opacity: 1; transform: translateY(0);}
<body> <body>


<div class="card"> <div class="card">
<div style="display: flex">
<div class="bar_green"></div>
<div class="bar_white"></div>
<div class="bar_red"></div>
<div class="bar_blue"></div>
</div>
<h2>Wemos LEDLamp Setup</h2> <h2>Wemos LEDLamp Setup</h2>
<div class="mac">Device: )rawliteral"
<div class="mac">Device: )rawliteral"
+ macAddress + macAddress
+ R"rawliteral(</div> + R"rawliteral(</div>


<form action="/save" method="POST">
<input name="ssid" placeholder="WLAN Name (SSID)">

<div class="pw-wrapper">
<input id="pass" name="pass" type="password" placeholder="Passwort">
<span class="toggle-eye" onclick="togglePassword()">👁</span>
</div>

<button type="submit">Speichern & Verbinden</button>
</form>
<div class="info">Verbinde den LEDLamp Wemos mit einem WLAN Netzwerk</div>
<form action="/save" method="POST">
<input name="ssid" placeholder="WLAN Name (SSID)">
<div class="pw-wrapper">
<input id="pass" name="pass" type="password" placeholder="Passwort">
<span class="toggle-eye" onclick="togglePassword()">👁</span>
</div>
<button type="submit">Speichern & Verbinden</button>
</form>
<div class="info">Verbinde den LEDLamp Wemos mit einem WLAN Netzwerk</div>
</div>


</body> </body>
</html> </html>
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>

<head> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Wemos LEDLamp Control</title> <title>Wemos LEDLamp Control</title>


.info { .info {
font-size: 12px; font-size: 12px;
opacity: 0.8; opacity: 0.8;
margin-top: 8px;
margin-bottom: 15px; margin-bottom: 15px;
text-align: center; text-align: center;
} }
button { button {
width: 100%; width: 100%;
padding: 12px; padding: 12px;
margin-top: 10px;
border: none; border: none;
border-radius: 10px; border-radius: 10px;
background: #00c6ff; background: #00c6ff;
button:hover { button:hover {
background: #0072ff; background: #0072ff;
transform: translateY(-2px);
transform: translateY(-1px) translateX(1px);
} }

.btn-row {
display: flex;
gap: 10px;
align-items: center;
margin-top: 10px;
}
.mac { .mac {
font-size: 11px; font-size: 11px;
opacity: 0.7; opacity: 0.7;
word-break: break-all; word-break: break-all;
} }

.bar_white {
background: white;
width: 100%;
height: 3px;
margin-bottom: 20px;
}
.bar_red {
background: red;
width: 100%;
height: 3px;
margin-bottom: 20px;
}

.bar_green {
background: green;
width: 100%;
height: 3px;
margin-bottom: 20px;
}

.bar_blue {
background: blue;
width: 100%;
height: 3px;
margin-bottom: 20px;
}

@keyframes fadeIn { @keyframes fadeIn {
from {opacity: 0; transform: translateY(10px);} from {opacity: 0; transform: translateY(10px);}
to {opacity: 1; transform: translateY(0);} to {opacity: 1; transform: translateY(0);}
<body> <body>


<div class="card"> <div class="card">
<div style="display: flex">
<div class="bar_green"></div>
<div class="bar_white"></div>
<div class="bar_red"></div>
<div class="bar_blue"></div>
</div>
<h2>Wemos LEDLamp Control</h2> <h2>Wemos LEDLamp Control</h2>
<div class="mac">Device: )rawliteral"
<div class="mac">Device: )rawliteral"
+ macAddress + macAddress
+ R"rawliteral(</div> + R"rawliteral(</div>

<div class="btn-row">
<button type="button" onclick="ledOn()">LED EIN</button>
<button type="button" onclick="ledOff()">LED AUS</button>
<div class="btn-row">
<button type="button" onclick="ledOn()">LED EIN</button>
<div id="led_status">⚫</div>
<button type="button" onclick="ledOff()">LED AUS</button>
</div>
<div class="btn-row">
<button type="button" onclick="resetWifiCfg()">Wifi-Konfiguration löschen</button>
</div>
<div id="reset_status" class="info">-</div>
</div> </div>

<script> <script>
let ws; let ws;
function connectWS() { function connectWS() {
ws = new WebSocket("ws://" + location.hostname + ":81/"); ws = new WebSocket("ws://" + location.hostname + ":81/");
ws.onopen = () => { ws.onopen = () => {
console.log("WebSocket connected"); console.log("WebSocket connected");
}; };
ws.onmessage = (e) => { ws.onmessage = (e) => {
console.log("ESP:", e.data); console.log("ESP:", e.data);
if (e.data === "LED ON") {
document.getElementById("led_status").innerHTML = "🟢";
}
if (e.data === "LED OFF") {
document.getElementById("led_status").innerHTML = "⚫";
}

if (e.data === "Wifi_Reset_Success") {
document.getElementById("reset_status").innerHTML = "Die Wifi-Konfiguration wurde erfolgreich zurückgesetzt.";
}
}; };
ws.onclose = () => { ws.onclose = () => {
console.log("WS disconnected → reconnect"); console.log("WS disconnected → reconnect");
setTimeout(connectWS, 1000); setTimeout(connectWS, 1000);
ws.send("/ledOff"); ws.send("/ledOff");
} }
} }

function resetWifiCfg() {
if (ws && ws.readyState === 1) {
ws.send("/resetWifiCfg");
}
}
</script> </script>



+ 22
- 4
LEDLamp.ino Прегледај датотеку

webServer.send(200, "text/html", html); webServer.send(200, "text/html", html);
} }



// ---------- SAVE ---------- // ---------- SAVE ----------
void handleSave() { void handleSave() {
String ssid = webServer.arg("ssid"); String ssid = webServer.arg("ssid");
Serial.println("Captive Portal gestartet"); Serial.println("Captive Portal gestartet");
} }



void webSocketEvent(uint8_t num, WStype_t type, uint8_t *payload, size_t length) { void webSocketEvent(uint8_t num, WStype_t type, uint8_t *payload, size_t length) {


switch (type) { switch (type) {


if (msg == "/ledOn") { if (msg == "/ledOn") {
digitalWrite(ledPin, LOW); digitalWrite(ledPin, LOW);
webSocket.sendTXT(num, "LED ON");
delay(10);
if (digitalRead(ledPin) == LOW) {
webSocket.sendTXT(num, "LED ON");
}
} else if (msg == "/ledOff") { } else if (msg == "/ledOff") {
digitalWrite(ledPin, HIGH); digitalWrite(ledPin, HIGH);
webSocket.sendTXT(num, "LED OFF");
delay(10);
if (digitalRead(ledPin) == HIGH) {
webSocket.sendTXT(num, "LED OFF");
}
} else if (msg == "/resetWifiCfg") {
resetWifiConfiguration(num);
} else { } else {
String s = "ACK: " + msg; String s = "ACK: " + msg;
webSocket.sendTXT(num, s); webSocket.sendTXT(num, s);
} }
} }


void resetWifiConfiguration(uint8_t num) {
EEPROM.begin(sizeof(Config));
config.valid = false;
EEPROM.put(0, config);

webSocket.sendTXT(num, "Wifi_Reset_Success");
delay(200);

EEPROM.commit();
ESP.restart();
}

void setState(AppState newState) { void setState(AppState newState) {
Serial.printf("STATE %s -> %s\n", stateToString(state), stateToString(newState)); Serial.printf("STATE %s -> %s\n", stateToString(state), stateToString(newState));
state = newState; state = newState;

+ 2
- 1
sloeber.ino.cpp Прегледај датотеку

//This is a automatic generated file //This is a automatic generated file
//Please do not modify this file //Please do not modify this file
//If you touch this file your change will be overwritten during the next build //If you touch this file your change will be overwritten during the next build
//This file has been generated on 2026-06-08 18:48:53
//This file has been generated on 2026-06-08 21:47:53


#include "Arduino.h" #include "Arduino.h"
#include "Arduino.h" #include "Arduino.h"
void handleNotFound() ; void handleNotFound() ;
void startAP() ; void startAP() ;
void webSocketEvent(uint8_t num, WStype_t type, uint8_t *payload, size_t length) ; void webSocketEvent(uint8_t num, WStype_t type, uint8_t *payload, size_t length) ;
void resetWifiConfiguration(uint8_t num) ;
void setState(AppState newState) ; void setState(AppState newState) ;
void handleBoot() ; void handleBoot() ;
void handleConnecting() ; void handleConnecting() ;

Write Preview
Loading…
Откажи
Сачувај