Merge branch 'master' of github.com:s00500/ESPUI

pio_examples/gui/.gitignore

@@ -0,0 +1 @@
+.pio

pio_examples/gui/platformio.ini

@@ -0,0 +1,16 @@
+; PlatformIO Project Configuration File
+;
+;   Build options: build flags, source filter
+;   Upload options: custom upload port, speed and extra flags
+;   Library options: dependencies, extra library storages
+;   Advanced options: extra scripting
+;
+; Please visit documentation for the other options and examples
+; https://docs.platformio.org/page/projectconf.html
+
+[env:esp8266]
+platform = espressif8266
+board = nodemcuv2
+framework = arduino
+
+lib_extra_dirs = ../../

pio_examples/gui/src/gui.ino

@@ -0,0 +1,270 @@
+#include <DNSServer.h>
+#include <ESPUI.h>
+
+const byte DNS_PORT = 53;
+IPAddress apIP(192, 168, 1, 1);
+DNSServer dnsServer;
+
+#if defined(ESP32)
+#include <WiFi.h>
+#else
+#include <ESP8266WiFi.h>
+#endif
+
+const char* ssid = "ESPUI";
+const char* password = "espui";
+
+const char* hostname = "espui";
+
+int statusLabelId;
+int graphId;
+int millisLabelId;
+int testSwitchId;
+
+void numberCall(Control* sender, int type)
+{
+    Serial.println(sender->value);
+}
+
+void textCall(Control* sender, int type)
+{
+    Serial.print("Text: ID: ");
+    Serial.print(sender->id);
+    Serial.print(", Value: ");
+    Serial.println(sender->value);
+}
+
+void slider(Control* sender, int type)
+{
+    Serial.print("Slider: ID: ");
+    Serial.print(sender->id);
+    Serial.print(", Value: ");
+    Serial.println(sender->value);
+    // Like all Control Values in ESPUI slider values are Strings. To use them as int simply do this:
+    int sliderValueWithOffset = sender->value.toInt() + 100;
+    Serial.print("SliderValue with offset");
+    Serial.println(sliderValueWithOffset);
+}
+
+void buttonCallback(Control* sender, int type)
+{
+    switch (type)
+    {
+    case B_DOWN:
+        Serial.println("Button DOWN");
+        break;
+
+    case B_UP:
+        Serial.println("Button UP");
+        break;
+    }
+}
+
+void buttonExample(Control* sender, int type)
+{
+    switch (type)
+    {
+    case B_DOWN:
+        Serial.println("Status: Start");
+        ESPUI.print(statusLabelId, "Start");
+        break;
+
+    case B_UP:
+        Serial.println("Status: Stop");
+        ESPUI.print(statusLabelId, "Stop");
+        break;
+    }
+}
+void padExample(Control* sender, int value)
+{
+    switch (value)
+    {
+    case P_LEFT_DOWN:
+        Serial.print("left down");
+        break;
+
+    case P_LEFT_UP:
+        Serial.print("left up");
+        break;
+
+    case P_RIGHT_DOWN:
+        Serial.print("right down");
+        break;
+
+    case P_RIGHT_UP:
+        Serial.print("right up");
+        break;
+
+    case P_FOR_DOWN:
+        Serial.print("for down");
+        break;
+
+    case P_FOR_UP:
+        Serial.print("for up");
+        break;
+
+    case P_BACK_DOWN:
+        Serial.print("back down");
+        break;
+
+    case P_BACK_UP:
+        Serial.print("back up");
+        break;
+
+    case P_CENTER_DOWN:
+        Serial.print("center down");
+        break;
+
+    case P_CENTER_UP:
+        Serial.print("center up");
+        break;
+    }
+
+    Serial.print(" ");
+    Serial.println(sender->id);
+}
+
+void switchExample(Control* sender, int value)
+{
+    switch (value)
+    {
+    case S_ACTIVE:
+        Serial.print("Active:");
+        break;
+
+    case S_INACTIVE:
+        Serial.print("Inactive");
+        break;
+    }
+
+    Serial.print(" ");
+    Serial.println(sender->id);
+}
+
+void otherSwitchExample(Control* sender, int value)
+{
+    switch (value)
+    {
+    case S_ACTIVE:
+        Serial.print("Active:");
+        break;
+
+    case S_INACTIVE:
+        Serial.print("Inactive");
+        break;
+    }
+
+    Serial.print(" ");
+    Serial.println(sender->id);
+}
+
+void setup(void)
+{
+    ESPUI.setVerbosity(Verbosity::VerboseJSON);
+    Serial.begin(115200);
+
+#if defined(ESP32)
+    WiFi.setHostname(hostname);
+#else
+    WiFi.hostname(hostname);
+#endif
+
+    // try to connect to existing network
+    WiFi.begin(ssid, password);
+    Serial.print("\n\nTry to connect to existing network");
+
+    {
+        uint8_t timeout = 10;
+
+        // Wait for connection, 5s timeout
+        do
+        {
+            delay(500);
+            Serial.print(".");
+            timeout--;
+        } while (timeout && WiFi.status() != WL_CONNECTED);
+
+        // not connected -> create hotspot
+        if (WiFi.status() != WL_CONNECTED)
+        {
+            Serial.print("\n\nCreating hotspot");
+
+            WiFi.mode(WIFI_AP);
+            WiFi.softAPConfig(apIP, apIP, IPAddress(255, 255, 255, 0));
+            WiFi.softAP(ssid);
+
+            timeout = 5;
+
+            do
+            {
+                delay(500);
+                Serial.print(".");
+                timeout--;
+            } while (timeout);
+        }
+    }
+
+    dnsServer.start(DNS_PORT, "*", apIP);
+
+    Serial.println("\n\nWiFi parameters:");
+    Serial.print("Mode: ");
+    Serial.println(WiFi.getMode() == WIFI_AP ? "Station" : "Client");
+    Serial.print("IP address: ");
+    Serial.println(WiFi.getMode() == WIFI_AP ? WiFi.softAPIP() : WiFi.localIP());
+
+    statusLabelId = ESPUI.label("Status:", ControlColor::Turquoise, "Stop");
+    millisLabelId = ESPUI.label("Millis:", ControlColor::Emerald, "0");
+    ESPUI.button("Push Button", &buttonCallback, ControlColor::Peterriver, "Press");
+    ESPUI.button("Other Button", &buttonExample, ControlColor::Wetasphalt, "Press");
+    ESPUI.padWithCenter("Pad with center", &padExample, ControlColor::Sunflower);
+    ESPUI.pad("Pad without center", &padExample, ControlColor::Carrot);
+    testSwitchId = ESPUI.switcher("Switch one", &switchExample, ControlColor::Alizarin, false);
+    ESPUI.switcher("Switch two", &otherSwitchExample, ControlColor::None, true);
+    ESPUI.slider("Slider one", &slider, ControlColor::Alizarin, 30);
+    ESPUI.slider("Slider two", &slider, ControlColor::None, 100);
+    ESPUI.text("Text Test:", &textCall, ControlColor::Alizarin, "a Text Field");
+    ESPUI.number("Numbertest", &numberCall, ControlColor::Alizarin, 5, 0, 10);
+
+    graphId = ESPUI.graph("Graph Test", ControlColor::Wetasphalt);
+
+    /*
+     * .begin loads and serves all files from PROGMEM directly.
+     * If you want to serve the files from SPIFFS use ESPUI.beginSPIFFS
+     * (.prepareFileSystem has to be run in an empty sketch before)
+     */
+
+    // Enable this option if you want sliders to be continuous (update during move) and not discrete (update on stop)
+    // ESPUI.sliderContinuous = true;
+
+    /*
+     * Optionally you can use HTTP BasicAuth. Keep in mind that this is NOT a
+     * SECURE way of limiting access.
+     * Anyone who is able to sniff traffic will be able to intercept your password
+     * since it is transmitted in cleartext. Just add a string as username and
+     * password, for example begin("ESPUI Control", "username", "password")
+     */
+    ESPUI.sliderContinuous = true;
+    ESPUI.begin("ESPUI Control");
+}
+
+void loop(void)
+{
+    dnsServer.processNextRequest();
+
+    static long oldTime = 0;
+    static bool testSwitchState = false;
+    delay(10);
+    return;
+
+    if (millis() - oldTime > 5000)
+    {
+        ESPUI.print(millisLabelId, String(millis()));
+
+        ESPUI.addGraphPoint(graphId, random(1, 50));
+
+        testSwitchState = !testSwitchState;
+        ESPUI.updateSwitcher(testSwitchId, testSwitchState);
+
+        oldTime = millis();
+    }
+}

src/ESPUI.cpp

@@ -755,9 +755,12 @@ void ESPUIClass::updateControl(Control* control, int clientId)
     root["type"] = (int)control->type + ControlType::UpdateOffset;
     root["value"] = control->value;
     root["id"] = control->id;
+    root["visible"] = control->visible;
     root["color"] = (int)control->color;
-    if(control->panelStyle != 0) root["panelStyle"] = control->panelStyle;
+    if (control->panelStyle != 0)
-    if(control->elementStyle != 0) root["elementStyle"] = control->elementStyle;
+        root["panelStyle"] = control->panelStyle;
+    if (control->elementStyle != 0)
+        root["elementStyle"] = control->elementStyle;
     serializeJson(document, json);
 
 #if defined(DEBUG_ESPUI)
@@ -798,17 +801,21 @@ void ESPUIClass::updateControl(Control* control, int clientId)
     }
 }
 
-void ESPUIClass::setPanelStyle(uint16_t id, String style, int clientId) {
+void ESPUIClass::setPanelStyle(uint16_t id, String style, int clientId)
+{
     Control* control = getControl(id);
-    if(control) {
+    if (control)
+    {
         control->panelStyle = style;
         updateControl(control, clientId);
     }
 }
 
-void ESPUIClass::setElementStyle(uint16_t id, String style, int clientId) {
+void ESPUIClass::setElementStyle(uint16_t id, String style, int clientId)
+{
     Control* control = getControl(id);
-    if(control) {
+    if (control)
+    {
         control->elementStyle = style;
         updateControl(control, clientId);
     }
@@ -964,7 +971,8 @@ Initially this function used to send the control element data individually.
 Due to a change in the ESPAsyncWebserver library this had top be changed to be
 sent as one blob at the beginning. Therefore a new type is used as well
 */
-void ESPUIClass::jsonDom(AsyncWebSocketClient* client) {
+void ESPUIClass::jsonDom(AsyncWebSocketClient* client)
+{
 
     DynamicJsonDocument document(jsonInitialDocumentSize);
     document["type"] = (int)UI_INITIAL_GUI;
@@ -977,21 +985,26 @@ void ESPUIClass::jsonDom(AsyncWebSocketClient* client) {
     titleItem["type"] = (int)UI_TITLE;
     titleItem["label"] = ui_title;
 
-    while(1) {
+    while (1)
+    {
         control = prepareJSONChunk(client, control, &items);
 
         String json;
         serializeJson(document, json);
 #if defined(DEBUG_ESPUI)
-        if (this->verbosity >= Verbosity::VerboseJSON) {
+        if (this->verbosity >= Verbosity::VerboseJSON)
+        {
             Serial.println("Sending elements --------->");
             Serial.println(json);
         }
 #endif
-        if (client != nullptr) client->text(json);
+        if (client != nullptr)
-        else this->ws->textAll(json);
+            client->text(json);
+        else
+            this->ws->textAll(json);
 
-        if(control == nullptr) break;
+        if (control == nullptr)
+            break;
 
         document.clear();
         items.clear();
@@ -1000,14 +1013,15 @@ void ESPUIClass::jsonDom(AsyncWebSocketClient* client) {
     }
 }
 
-
+/* Prepare a chunk of elements as a single JSON string. If the allowed number of elements is greater than the total
-/* Prepare a chunk of elements as a single JSON string. If the allowed number of elements is greater than the total number
+number this will represent the entire UI and this function will return null. If a control pointer is returned then the
-this will represent the entire UI and this function will return null. If a control pointer is returned then the limit 
+limit was reached, the currently serialised must be sent, and then processing resumed to send the next chunk. */
-was reached, the currently serialised must be sent, and then processing resumed to send the next chunk. */
+Control* ESPUIClass::prepareJSONChunk(AsyncWebSocketClient* client, Control* control, JsonArray* items)
-Control *ESPUIClass::prepareJSONChunk(AsyncWebSocketClient* client, Control* control, JsonArray *items) {
+{
     int elementcount = 0;
 
-    while (control != nullptr && elementcount < 10) {
+    while (control != nullptr && elementcount < 10)
+    {
         JsonObject item = items->createNestedObject();
 
         item["id"] = String(control->id);
@@ -1015,9 +1029,11 @@ Control *ESPUIClass::prepareJSONChunk(AsyncWebSocketClient* client, Control* con
         item["label"] = control->label;
         item["value"] = String(control->value);
         item["color"] = (int)control->color;
-        item["visible"] = control->visible;
+        item["visible"] = (int)control->visible;
-        if(control->panelStyle != 0) item["panelStyle"] = String(control->panelStyle);
+        if (control->panelStyle != 0)
-        if(control->elementStyle != 0) item["elementStyle"] = String(control->elementStyle);
+            item["panelStyle"] = String(control->panelStyle);
+        if (control->elementStyle != 0)
+            item["elementStyle"] = String(control->elementStyle);
 
         if (control->parentControl != Control::noParent) {
             item["parentControl"] = String(control->parentControl);