From 89b9fd8a456b8fb806adffc3bc197196a792a5ce Mon Sep 17 00:00:00 2001 From: cschwinne Date: Tue, 22 May 2018 21:11:19 +0200 Subject: [PATCH] Mobile UI by StormPie added --- wled00/data/index_mobile.htm | 1046 +++++++++++++++++++++++++++++++++ wled00/data/settings_sec.htm | Bin 7556 -> 7708 bytes wled00/data/settings_ui.htm | Bin 7338 -> 7836 bytes wled00/htmls00.h | 1053 +++++++++++++++++++++++++++++++++- wled00/htmls01.h | 13 +- wled00/wled00.ino | 3 +- wled00/wled01_eeprom.ino | 2 + wled00/wled02_xml.ino | 1 + wled00/wled03_set.ino | 1 + wled00/wled05_init.ino | 38 +- 10 files changed, 2146 insertions(+), 11 deletions(-) create mode 100644 wled00/data/index_mobile.htm 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

+
+ +
+
+
    +
  • Color
    • +
  • Effects
    • +
  • Both
    • +
+
+

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 b307ae20ebc2dd293ca89f695729f7fb399db6b1..2b61d5ad92661f557710cb8f527e74e344cead1d 100644 GIT binary patch delta 124 zcmZp%o@28iL2U9hDIwV;20I34hJ1!Rh7yJ%hD?SehEgCaAIL6du$s&-AZZ>9<>xX4 z0OeB|6c}uPv>k&6gD+5B5|Et(7WH5V0gCtlSPfC Ksm*cXYHR@HDH~1z delta 28 kcmbPZ(_+0LL2U95v3-*pq}e9#5m%VJML=Zp2XP%X0IlH*E&u=k diff --git a/wled00/data/settings_ui.htm b/wled00/data/settings_ui.htm index 24649e4c450cc5009e7e48f0104f6854fa6a5965..a8c2299e7b3162b7ade6745a98252fe11d964cc4 100644 GIT binary patch delta 229 zcmZ2wImdRxHv#2PhGK?Ph9U+922X}Oh7vG4jUkaC8OTy#@MXwnNSUlDq{$izlvkQ8 zFRVRzk&pztBSR@rZT{r-qPCNSSvZ{;a)4Tj8Hy*r7q;g&Vo+kR18YrU$YjWwyiizn za+ + + + + + + + + + + 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

+
+ +
+
+
    +
  • Color
    • +
  • Effects
    • +
  • Both
    • +
+
+

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; +} +