diff --git a/wled00/data/index_mobile.htm b/wled00/data/index_mobile.htm new file mode 100644 index 00000000..5e240417 --- /dev/null +++ b/wled00/data/index_mobile.htm @@ -0,0 +1,1046 @@ + + + + + + + + + + + WLED + + + + +
+
+
+

WLED

+
+
+

FX 2nd Color

+
+ +
+
+
+
+
+

Brightness

+
+
+

Speed

+
+
+
+   +
+
+   +
+
+   +
+
+   +

+
+   +
+
+   +
+
+   +
+
+   +
+
+
+
+

Edit Presets

+
+ +
+
+

Presets

+
+ 1 +
+
+ 2 +
+
+ 3 +
+
+ 4 +

+
+ 5 +
+
+ 6 +
+
+ 7 +
+
+ 8 +

+
+ 9 +
+
+ 10 +
+
+ 11 +
+
+ 12 +

+
+ 13 +
+
+ 14 +
+
+ 15 +
+
+ 16 +
+
+
+

Cycle Mode

+
+ +
+
+

Cycle Range

+
+ +
+
+ +
+

Preset Duration

+
+
+

Color Transition

+
+
+ +
+ + + + \ No newline at end of file diff --git a/wled00/data/settings_sec.htm b/wled00/data/settings_sec.htm index b307ae20..2b61d5ad 100644 Binary files a/wled00/data/settings_sec.htm and b/wled00/data/settings_sec.htm differ diff --git a/wled00/data/settings_ui.htm b/wled00/data/settings_ui.htm index 24649e4c..a8c2299e 100644 Binary files a/wled00/data/settings_ui.htm and b/wled00/data/settings_ui.htm differ diff --git a/wled00/htmls00.h b/wled00/htmls00.h index 7904fa13..35ceaa5f 100644 --- a/wled00/htmls00.h +++ b/wled00/htmls00.h @@ -1,5 +1,1056 @@ /* - * Index html + * Mobile UI by StormPie html +*/ +const char PAGE_indexM[] PROGMEM = R"=====( + + + + + + + + + + + WLED + + + + +
+
+
+

WLED

+
+
+

FX 2nd Color

+
+ +
+
+
+
+
+

Brightness

+
+
+

Speed

+
+
+
+   +
+
+   +
+
+   +
+
+   +

+
+   +
+
+   +
+
+   +
+
+   +
+
+
+
+

Edit Presets

+
+ +
+
+

Presets

+
+ 1 +
+
+ 2 +
+
+ 3 +
+
+ 4 +

+
+ 5 +
+
+ 6 +
+
+ 7 +
+
+ 8 +

+
+ 9 +
+
+ 10 +
+
+ 11 +
+
+ 12 +

+
+ 13 +
+
+ 14 +
+
+ 15 +
+
+ 16 +
+
+
+

Cycle Mode

+
+ +
+
+

Cycle Range

+
+ +
+
+ +
+

Preset Duration

+
+
+

Color Transition

+
+
+ +
+ + + + +)====="; +/* + * Classic UI Index html */ //head0 (js) const char PAGE_index0[] PROGMEM = R"=====( diff --git a/wled00/htmls01.h b/wled00/htmls01.h index 04f957d6..7bc78e64 100644 --- a/wled00/htmls01.h +++ b/wled00/htmls01.h @@ -139,6 +139,13 @@ const char PAGE_settings_ui1[] PROGMEM = R"=====(

Web Setup

+User Interface Mode: +

+The following options are for the classic UI!
Server description:
Use HSB sliders instead of RGB by default:
Color Theme: @@ -338,10 +345,12 @@ HTTP traffic is unencrypted. An attacker in the same network can intercept form
Enable ArduinoOTA:

About

-WLED version 0.6.5
+WLED version 0.6.5

+Contributors:
+StormPie (Mobile HTML UI)

(c) 2016-2018 Christian Schwinne
Licensed under the MIT license

-Uses libraries:
+Uses libraries:
ESP8266/ESP32 Arduino Core
(ESP32) WebServer_tng by bbx10
WS2812FX by kitesurfer1404 (modified)
diff --git a/wled00/wled00.ino b/wled00/wled00.ino index ed55c784..c16ff171 100644 --- a/wled00/wled00.ino +++ b/wled00/wled00.ino @@ -33,7 +33,7 @@ #include "WS2812FX.h" //version in format yymmddb (b = daily build) -#define VERSION 1805181 +#define VERSION 1805222 const String versionString = "0.6.5"; //AP and OTA default passwords (change them!) @@ -56,6 +56,7 @@ byte auxTriggeredState = 0; //0: input 1: high 2: low //Default CONFIG String serverDescription = "WLED Light"; byte currentTheme = 0; +byte uiConfiguration = 0; //0: auto 1: classic 2: mobile String clientSSID = "Your_Network"; String clientPass = ""; String cmDNS = "led"; diff --git a/wled00/wled01_eeprom.ino b/wled00/wled01_eeprom.ino index 70b20100..acfa1cfd 100644 --- a/wled00/wled01_eeprom.ino +++ b/wled00/wled01_eeprom.ino @@ -212,6 +212,7 @@ void saveSettingsToEEPROM() EEPROM.write(2200,!receiveDirect); EEPROM.write(2201,enableRealtimeUI); + EEPROM.write(2202,uiConfiguration); EEPROM.commit(); } @@ -422,6 +423,7 @@ void loadSettingsFromEEPROM(bool first) } receiveDirect = !EEPROM.read(2200); enableRealtimeUI = EEPROM.read(2201); + uiConfiguration = EEPROM.read(2202); bootPreset = EEPROM.read(389); wifiLock = EEPROM.read(393); diff --git a/wled00/wled02_xml.ino b/wled00/wled02_xml.ino index e6725cf2..6258f417 100644 --- a/wled00/wled02_xml.ino +++ b/wled00/wled02_xml.ino @@ -170,6 +170,7 @@ String getSettings(byte subPage) if (subPage == 3) { + resp += ds + "UI" + si + String(uiConfiguration) + ";"; resp += ds + "DS" + v + "\"" + serverDescription + "\";"; resp += ds + "MD" + c + useHSBDefault + ";"; resp += ds + "TH" + si + String(currentTheme) + ";"; diff --git a/wled00/wled03_set.ino b/wled00/wled03_set.ino index 117f143d..4f6d3965 100644 --- a/wled00/wled03_set.ino +++ b/wled00/wled03_set.ino @@ -240,6 +240,7 @@ void handleSettingsSet(byte subPage) //UI if (subPage == 3) { + if (server.hasArg("UI")) uiConfiguration = server.arg("UI").toInt(); if (server.hasArg("DS")) serverDescription = server.arg("DS"); useHSBDefault = server.hasArg("MD"); useHSB = useHSBDefault; diff --git a/wled00/wled05_init.ino b/wled00/wled05_init.ino index 9c09de8a..8cc72c36 100644 --- a/wled00/wled05_init.ino +++ b/wled00/wled05_init.ino @@ -231,6 +231,9 @@ void wledInit() server.send(404, "text/plain", "Not Found"); } }); + const char * headerkeys[] = {"User-Agent"}; + server.collectHeaders(headerkeys,sizeof(char*)); + if (!initLedsLast) strip.service(); //init Alexa hue emulation if (alexaEnabled) alexaInit(); @@ -399,15 +402,27 @@ void serveIndexOrWelcome() void serveIndex() { + bool serveMobile = false; + if (uiConfiguration == 0) serveMobile = checkClientIsMobile(server.header("User-Agent")); + else if (uiConfiguration == 2) serveMobile = true; + if (!arlsTimeout || enableRealtimeUI) //do not serve while receiving realtime { - server.setContentLength(strlen_P(PAGE_index0) + cssColorString.length() + strlen_P(PAGE_index1) + strlen_P(PAGE_index2) + strlen_P(PAGE_index3)); - server.send(200, "text/html", ""); - server.sendContent_P(PAGE_index0); - server.sendContent(cssColorString); - server.sendContent_P(PAGE_index1); - server.sendContent_P(PAGE_index2); - server.sendContent_P(PAGE_index3); + if (serveMobile) + { + server.setContentLength(strlen_P(PAGE_indexM)); + server.send(200, "text/html", ""); + server.sendContent_P(PAGE_indexM); + } else + { + server.setContentLength(strlen_P(PAGE_index0) + cssColorString.length() + strlen_P(PAGE_index1) + strlen_P(PAGE_index2) + strlen_P(PAGE_index3)); + server.send(200, "text/html", ""); + server.sendContent_P(PAGE_index0); + server.sendContent(cssColorString); + server.sendContent_P(PAGE_index1); + server.sendContent_P(PAGE_index2); + server.sendContent_P(PAGE_index3); + } } else { server.send(200, "text/plain", "The WLED UI is not available while receiving real-time data."); } @@ -529,5 +544,14 @@ String getBuildInfo() return info; } +bool checkClientIsMobile(String useragent) +{ + //to save complexity this function is not comprehensive + if (useragent.indexOf("Android") >= 0) return true; + if (useragent.indexOf("iPhone") >= 0) return true; + if (useragent.indexOf("iPod") >= 0) return true; + return false; +} +