-
Notifications
You must be signed in to change notification settings - Fork 0
/
Website.h
8 lines (5 loc) · 3.34 KB
/
Website.h
1
2
3
4
5
6
7
8
#ifndef Website_h
#define Website_h
#include "Arduino.h"
const String LANDINGPAGE = "<!DOCTYPE html><html><head> <meta charset=\"utf-8\"> <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"> <title>Bedlights!</title> <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/bulma@0.9.2/css/bulma.min.css\"></head><body> <section class=\"section\"> <div class=\"container\"> <h1 class=\"title\"> Bedlights </h1> </div> </section> <section> <div class=\"container is-fluid\"> <div class=\"columns\"> <div class=\"column\"> <h4 class=\"title is-4\">Presets</h4> <div class=\"buttons\"> <button class=\"button is-info\" type=\"button\" onclick=\"setPreset('police')\">Police</button> <button class=\"button is-info\" type=\"button\" onclick=\"setPreset('fadingstars')\">Stars</button> <button class=\"button is-info\" type=\"button\" onclick=\"setPreset('sunset')\">Sunset</button> <button class=\" button is-info\" type=\"button\" onclick=\"setPreset('lesen')\">Lesen</button> <button class=\"button is-info\" type=\"button\" onclick=\"setPreset('twolights')\">Two Lights</button> <button class=\"button is-info\" type=\"button\" onclick=\"setPreset('mouse')\">Mouse</button> <button class=\"button is-info\" type=\"button\" onclick=\"setPreset('disco')\">Disco</button> <button class=\"button is-info\" type=\"button\" onclick=\"setPreset('rainbow')\">Rainbow</button> </div> <div class=\"buttons\"> <button class=\"button is-primary\" onclick=\"setColor(255,255,255)\" type=\"button\">All On</button> <button class=\"button is-danger\" onclick=\"setColor(0,0,0)\" type=\"button\">Off</button> </div> </div> <div class=\"column\"> <h4 class=\"title is-4\">Direct Control</h4> <form> <div class=\"field\"> <label class=\"label\" for=\"color\">Color</label> <input class=\"input\" type=\"color\" id=\"color\" name=\"color\" value=\"#ffffff\"> </div> <div class=\"field\"> <label class=\"label\" for=\"color\">Brightness</label> <input class=\"slider is-fullwidth\" id=\"brightness\" step=\"1\" min=\"0\" max=\"100\" value=\"50\" type=\"range\"> </div> <button type=\"button\" class=\"button is-info\" onclick=\"setPickedColor()\">Set</button> </form> </div> </div> </section> <script> function setPickedColor() { const color = document.getElementById(\"color\").value; const brightness = document.getElementById(\"brightness\").value; const r = Math.floor(parseInt(color.substr(1, 2), 16) * brightness / 100); const g = Math.floor(parseInt(color.substr(3, 2), 16) * brightness / 100); const b = Math.floor(parseInt(color.substr(5, 2), 16) * brightness / 100); setColor(r, g, b); } function setPreset(preset) { fetch(\"/setpreset?preset=\" + preset) .then(response => { console.log(response) }) .catch((error) => { console.error(error) }); } function setColor(r, g, b) { fetch(\"/setallleds?color=[\" + r + \",\" + g + \",\" + b + \"]\") .then(response => { console.log(response) }) .catch((error) => { console.error(error) }); } </script></body></html>";
#endif