Skip to content

Commit

Permalink
resized assets and replaced handlers with serveStatic
Browse files Browse the repository at this point in the history
  • Loading branch information
@rednblkx
rednblkx committed Aug 23, 2024
1 parent 5a72bb2 commit 2bbf4af
Show file tree
Hide file tree
Showing 12 changed files with 45 additions and 53 deletions.
Binary file added data/assets/hk-finish-0.webp
View file
Binary file not shown.
Binary file added data/assets/hk-finish-1.webp
View file
Binary file not shown.
Binary file added data/assets/hk-finish-2.webp
View file
Binary file not shown.
Binary file added data/assets/hk-finish-3.webp
View file
Binary file not shown.
0 data/misc.css → data/assets/misc.css
View file
File renamed without changes.
Binary file removed data/hk-finish-0.webp
View file
Binary file not shown.
Binary file removed data/hk-finish-1.webp
View file
Binary file not shown.
Binary file removed data/hk-finish-2.webp
View file
Binary file not shown.
Binary file removed data/hk-finish-3.webp
View file
Binary file not shown.
2 changes: 1 addition & 1 deletion data/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="misc.css"/>
<link rel="stylesheet" href="assets/misc.css"/>
<title>HK Configuration</title>
<style>
label {
Expand Down
58 changes: 37 additions & 21 deletions data/misc.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,14 @@ <h3 style="margin-top: 0;text-align: center;">HomeKit</h3>
style="display:flex;flex-direction: column;border: 2px #8e8271 dashed;padding: 1rem;margin-bottom: 1rem;gap: 8px;">
<div style="display: flex;flex-direction: column;">
<label for="device-name">Device Name</label>
<input type="text" name="device-name" id="device-name" placeholder="HK" required value="%DEVICENAME%" style="width: fit-content;" />
<input type="text" name="device-name" id="device-name" placeholder="HK" required value="%DEVICENAME%"
style="width: fit-content;" />
</div>

<div style="display: flex;flex-direction: column;">
<label for="hk-setupcode">Setup Code</label>
<input type="number" name="hk-setupcode" id="hk-setupcode" placeholder="46637726" required value="%HKSETUPCODE%" style="width: fit-content;" />
<input type="number" name="hk-setupcode" id="hk-setupcode" placeholder="46637726" required
value="%HKSETUPCODE%" style="width: fit-content;" />
</div>

<div>
Expand All @@ -28,22 +30,36 @@ <h3 style="margin-top: 0;text-align: center;">HomeKit</h3>
</div>
<fieldset>
<legend>HomeKey Card Finish:</legend>
<div id="hkfinish" style="background-image: url(hk-finish-0.webp);width: 300px;background-size: contain;background-repeat: no-repeat;min-height: 100px;"></div>
<div>
<label id="tan" for="hk-tan">Tan</label>
<input type="radio" id="hk-finish-0" onClick="document.getElementById('hkfinish').style.backgroundImage=`url(hk-finish-0.webp)`" name="hk-hwfinish" value="0" />
</div>
<div>
<label id="gold" for="hk-gold">Gold</label>
<input type="radio" id="hk-finish-1" onClick="document.getElementById('hkfinish').style.backgroundImage=`url(hk-finish-1.webp)`" name="hk-hwfinish" value="1" />
</div>
<div>
<label id="silver" for="hk-silver">Silver</label>
<input type="radio" id="hk-finish-2" onClick="document.getElementById('hkfinish').style.backgroundImage=`url(hk-finish-2.webp)`" name="hk-hwfinish" value="2" />
</div>
<div>
<label id="black" for="hk-black">Black</label>
<input type="radio" id="hk-finish-3" onClick="document.getElementById('hkfinish').style.backgroundImage=`url(hk-finish-3.webp)`" name="hk-hwfinish" value="3" />
<div style="display: flex;justify-content: space-evenly;margin-bottom: 0;padding-bottom: 0;">
<div id="hkfinish"
style="background-image: url(assets/hk-finish-0.webp);background-size: contain;background-repeat: no-repeat;width: 9rem;">
</div>
<div style="display: flex;flex-direction: column;align-items: flex-end;">
<div>
<label id="tan" for="hk-tan">Tan</label>
<input type="radio" id="hk-finish-0"
onClick="document.getElementById('hkfinish').style.backgroundImage=`url(assets/hk-finish-0.webp)`"
name="hk-hwfinish" value="0" />
</div>
<div>
<label id="gold" for="hk-gold">Gold</label>
<input type="radio" id="hk-finish-1"
onClick="document.getElementById('hkfinish').style.backgroundImage=`url(assets/hk-finish-1.webp)`"
name="hk-hwfinish" value="1" />
</div>
<div>
<label id="silver" for="hk-silver">Silver</label>
<input type="radio" id="hk-finish-2"
onClick="document.getElementById('hkfinish').style.backgroundImage=`url(assets/hk-finish-2.webp)`"
name="hk-hwfinish" value="2" />
</div>
<div>
<label id="black" for="hk-black">Black</label>
<input type="radio" id="hk-finish-3"
onClick="document.getElementById('hkfinish').style.backgroundImage=`url(assets/hk-finish-3.webp)`"
name="hk-hwfinish" value="3" />
</div>
</div>
</div>
</fieldset>
</div>
Expand Down Expand Up @@ -92,8 +108,8 @@ <h3 style="margin-top: 0;text-align: center;">HomeSpan</h3>
document
.getElementById(`hk-finish-${hwfinish}`)
.setAttribute("checked", "");
document.getElementById('hkfinish').style.backgroundImage=`url(hk-finish-${hwfinish}.webp)`;
if (nfcSuccessHL) {
document.getElementById('hkfinish').style.backgroundImage = `url(assets/hk-finish-${hwfinish}.webp)`;
if (nfcSuccessHL) {
document.getElementById("nfc-s-hl").setAttribute("checked", "");
}
if (nfcFailHL) {
Expand Down Expand Up @@ -139,4 +155,4 @@ <h3 style="margin-top: 0;text-align: center;">HomeSpan</h3>
}, 5000);
}
form.addEventListener("submit", handleForm);
</script>
</script>
38 changes: 7 additions & 31 deletions src/main.cpp
View file
Original file line number Diff line number Diff line change
Expand Up @@ -823,38 +823,14 @@ String actionsProcess(const String& var) {
}
return "";
}

bool headersFix(AsyncWebServerRequest* request) { request->addInterestingHeader("ANY"); return true; };
void setupWeb() {
webServer.on("/", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/index.html", "text/html", false, indexProcess);
});
webServer.on("/misc.css", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/misc.css", "text/css", false, nullptr);
});
webServer.on("/hk-finish-0.webp", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/hk-finish-0.webp", "image/webp", false);
});
webServer.on("/hk-finish-1.webp", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/hk-finish-1.webp", "image/webp", false);
});
webServer.on("/hk-finish-2.webp", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/hk-finish-2.webp", "image/webp", false);
});
webServer.on("/hk-finish-3.webp", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/hk-finish-3.webp", "image/webp", false);
});
webServer.on("/info", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/info.html", "text/html", false, hkInfoHtmlProcess);
});
webServer.on("/mqtt", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/mqtt.html", "text/html", false, mqttHtmlProcess);
});
webServer.on("/misc", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/misc.html", "text/html", false, miscHtmlProcess);
});
webServer.on("/actions", HTTP_GET, [](AsyncWebServerRequest* request) {
request->send(LittleFS, "/actions.html", "text/html", false, actionsProcess);
});
webServer.serveStatic("/info", LittleFS, "/info.html").setTemplateProcessor(hkInfoHtmlProcess).setFilter(headersFix);
webServer.serveStatic("/mqtt", LittleFS, "/mqtt.html").setTemplateProcessor(mqttHtmlProcess).setFilter(headersFix);
webServer.serveStatic("/misc", LittleFS, "/misc.html").setTemplateProcessor(miscHtmlProcess).setFilter(headersFix);
webServer.serveStatic("/actions", LittleFS, "/actions.html").setTemplateProcessor(actionsProcess).setFilter(headersFix);
webServer.serveStatic("/assets", LittleFS, "/assets/").setFilter(headersFix);
webServer.serveStatic("/", LittleFS, "/").setDefaultFile("index.html").setTemplateProcessor(indexProcess).setFilter(headersFix);
webServer.on("/mqttconfig", HTTP_POST, [](AsyncWebServerRequest* request) {
const char* TAG = "mqttconfig";
int params = request->params();
Expand Down

0 comments on commit 2bbf4af

Please sign in to comment.