upd

Author: GyverLibs

README.md

@@ -8,9 +8,11 @@
 
 # Settings
 Библиотека для создания простого веб-интерфейса настроек на esp8266/esp32
-- Веб-приложение весит всего 7кб и вшивается в программу в бинарном gzip виде, никакой возни с файлами
+- Веб-приложение весит около 10кб и вшивается в программу в бинарном gzip виде без возни с файлами
 - Удобный билдер панели управления из скетча
 - Десяток типовых виджетов с возможностью объединения в группы и вложенные меню
+- Система авторизации с разными правами для авторизованных юзеров и гостей
+- Файловый менеджер и OTA (обновление по воздуху)
 - Интеграция с библиотекой [GyverDB](https://github.com/GyverLibs/GyverDB) для полностью автоматического хранения данных
 - Компактный бинарный протокол связи
 - Легко адаптируется под любую библиотеку HTTP сервера, из коробки реализовано три версии: GyverHTTP, стандартный esp-WebServer, ESPAsyncWebserver
@@ -184,7 +186,7 @@ void build(sets::Builder& b) {
 ```
 
 ### Контейнеры
-Виджеты можно объединять в контейнеры. Контейнер нужно начать и закончить, так как пакет данных собирается линейно в целях оптимизации скорости и памяти. Метод beginКонтейнер всегда вернёт true для красоты организации кода в блоке условия:
+Виджеты можно объединять в контейнеры. Контейнер нужно начать и закончить, так как пакет данных собирается линейно в целях оптимизации скорости и памяти. Метод `beginКонтейнер` всегда вернёт true для красоты организации кода в блоке условия:
 ```cpp
 void build(sets::Builder& b) {
     if (b.beginGroup("Group 1")) {
@@ -258,8 +260,36 @@ void setup() {
 
 Вебморда отслеживает статус устройства, при потере связи появится текст offline в заголовке страницы. После потери связи вебморда будет запрашивать информацию о виджетах, это очень удобно при разработке - например добавляем виджет, загружаем прошивку. За это время вебморда уже понимает что устройство оффлайн и при первом успешном подключении выводит актуальные виджеты. При изменении значений виджетов вебморда также следит за доставкой пакета, при ошибке связи появится надпись error у соответствующего виджета.
 
+### Авторизация
+В системе предусмотрена авторизация: если в прошивке указать отличный от пустой строки пароль - вебморда будет работать в "гостевом" режиме: отображаются только разрешённые гостям виджеты, файловый менеджер и OTA скрыты и заблокированы. Для ввода пароля нужно зайти в меню (правая верхняя кнопка) и нажать на ключик. Серый ключик означает что авторизация отключена, зелёный - клиент авторизован, красный - неверный пароль. Пароль может содержать любые символы и иметь любую длину - в явном виде он не хранится и не передаётся.
+
+Для разделения админского и гостевого доступа предусмотрен виртуальный контейнер Guest. Если пароль установлен и клиент не авторизован - он будет видеть только виджеты из гостевых контейнеров. Для корректной работы гостевой контейнер не должен прерываться обычными контейнерами. Пример:
+
+```cpp
+if (b.beginGroup("Group 1")) {
+    // гости не видят
+    b.Pass(kk::pass, "Password");
+
+    // виджеты, которые видят гости и админы
+    {
+        sets::GuestAccess g(b);
+        b.Input(kk::uintw, "uint");
+        b.Input(kk::intw, "int");
+        b.Input(kk::int64w, "int 64");
+    }
+
+    // гости не видят
+    {
+        sets::Menu m(b, "sub sub");
+        b.Label(kk::lbl2, "millis()", "", sets::Colors::Red);
+    }
+
+    b.endGroup();
+}
+```
+В гостевой контейнер можно поместить несколько обычных контейнеров, например групп.
+
 ## Описание классов
-- `SettingsBase` (*SettingsBase.h*) - базовый класс без вебсервера
 - `SettingsGyver` (*SettingsGyver.h*) - на вебсервере GyverHTTP
 - `SettingsESP` (*SettingsESP.h*) - на стандартном вебсервере ESP
 - `SettingsAsync` (*SettingsAsync.h*) - на асинхронном ESPAsyncWebserver
@@ -268,6 +298,12 @@ void setup() {
 ```cpp
 Settings(const String& title = "", GyverDB* db = nullptr);
 
+// установить пароль на вебморду. Пустая строка "" чтобы отключить
+void setPass(Text pass);
+
+// перезагрузить страницу. Можно вызывать где угодно + в обработчике update
+void reload();
+
 // установить заголовок страницы
 void setTitle(const String& title);
 
@@ -295,47 +331,111 @@ void tick();
 // инфо о билде
 Build build();
 
-// перезагрузить страницу
+// перезагрузить страницу (вызывать в действии)
 void reload();
 
-// контейнеры
+// КОНТЕЙНЕРЫ
+// разрешить неавторизованным клиентам следующий код
+bool beginGuest();
+
+// запретить неавторизованным клиентам
+void endGuest();
+
+// группа
 bool beginGroup(Text title = Text());
 void endGroup();
 
+// вложенное меню
 bool beginMenu(Text title);
 void endMenu();
 
+// ряд кнопок
 bool beginButtons();
 void endButtons();
 
-// пассивные виджеты
+// ВИДЖЕТЫ
+// ПАССИВНЫЕ
+// многострочный текст
 void Paragraph(size_t id, Text label, Text text = Text());
+
+// текстовое значение
 void Label(size_t id, Text label, Text text = Text(), uint32_t color = SETS_DEFAULT_COLOR);
 void Label(size_t id, Text label, Text text, sets::Colors color);
 
-// активные виджеты
+// без id
+void Label(Text label, Text text = Text(), uint32_t color = SETS_DEFAULT_COLOR);
+void Label(Text label, Text text, sets::Colors color);
+
+// светодиод (включен - зелёный, выключен - красный)
+void LED(size_t id, Text label, bool value);
+void LED(Text label, bool value);
+
+// АКТИВНЫЕ
+// ввод текста и цифр
 bool Input(size_t id, Text label, Text value = Text());
+
+// ввод пароля
 bool Pass(size_t id, Text label, Text value = Text());
+
+// ввод цвета, результат в обычном 24-бит формате
 bool Color(size_t id, Text label, Text value = Text());
+
+// переключатель, результат 1/0
 bool Switch(size_t id, Text label, Text value = Text());
+
+// дата, результат в unix секундах
 bool Date(size_t id, Text label, Text value = Text());
-bool Time(size_t id, Text label, Text value = Text());
+
+// дата и время, результат в unix секундах
 bool DateTime(size_t id, Text label, Text value = Text());
+
+// время, результат в секундах с начала суток
+bool Time(size_t id, Text label, Text value = Text());
+
+// слайдер
 bool Slider(size_t id, Text label, float min = 0, float max = 100, float step = 1, Text unit = Text(), Text value = Text());
 
 // кнопку можно добавлять как внутри контейнера кнопок, так и как одиночный виджет
 bool Button(size_t id, Text label, uint32_t color = SETS_DEFAULT_COLOR);
 bool Button(size_t id, Text label, sets::Colors color);
 
-// опции разделяются ;
+// список выбора, опции в виде текста разделяются ;
 bool Select(size_t id, Text label, Text options, Text value = Text());
 
-// для активации отправь пустой update на его id
+// окно подтверждения, для активации отправь пустой update на его id
 bool Confirm(size_t id, Text label);
 ```
 
 Здесь `Text` - универсальный текстовый формат, принимает строки в любом виде. При указании `value` отличным от стандартного будет отправлено его значение. Иначе будет отправлено значение из БД, если она подключена. Если в качестве значения нужно число - используйте конструктор `Value`, например `b.Color("col", "Color", Value(my_color));`, где `my_color` это `uint32_t`.
 
+### Build
+Инфо о билде
+```cpp
+// клиент авторизован (или пароль не указан, т.е. все админы)
+bool isGranted();
+
+// id виджета (действие)
+size_t id();
+
+// значение виджета (действие)
+Text& value();
+```
+
+### Контейнеры
+```cpp
+// контейнер гостевого доступа
+class GuestAccess(Builder& b);
+
+// контейнер группы виджетов
+class Group(Builder& b, Text title = Text());
+
+// контейнер вложенного меню
+class Menu(Builder& b, Text title);
+
+// контейнер кнопок
+class Buttons(Builder& b);
+```
+
 ### Updater
 ```cpp
 // пустой апдейт (например для вызова Confirm)
@@ -358,6 +458,12 @@ void update(size_t id, <любой численный тип> value);
 - v1.0.2
   - Добавлен виджет Confirm (всплывающее окно подтверждения)
   - Кастомные всплывающие окна для Input (Input теперь работает на просмотре AP WiFi точки на Xiaomi)
+- v1.0.5
+  - Добавлен виджет LED
+  - Добавлен файловый менеджер
+  - Добавлено ОТА обновление
+  - Добавлена авторизация и гостевой фильтр виджетов
+  - Новый стиль для Select
 
 <a id="install"></a>
 ## Установка

library.properties

@@ -1,5 +1,5 @@
 name=Settings
-version=1.0.4
+version=1.0.5
 author=AlexGyver <[email protected]>
 maintainer=AlexGyver <[email protected]>
 sentence=Simple UI webface builder for esp8266/esp32

src/SettingsAsync.h

@@ -2,6 +2,7 @@
 
 #pragma once
 #include <Arduino.h>
+#include <LittleFS.h>
 
 #ifdef ESP8266
 #include <ESP8266WiFi.h>
@@ -14,6 +15,8 @@
 
 #include "SettingsBase.h"
 #include "core/DnsWrapper.h"
+#include "core/ota.h"
+#include "core/fs.h"
 #include "web/settings.h"
 
 class SettingsAsync : public SettingsBase {
@@ -25,18 +28,61 @@ class SettingsAsync : public SettingsBase {
         server.begin();
 
         server.on("/settings", HTTP_GET, [this](AsyncWebServerRequest *request) {
-            String action, id, value;
+            String auth, action, id, value;
+            if (request->hasParam("auth")) auth = request->getParam("auth")->value();
             if (request->hasParam("action")) action = request->getParam("action")->value();
             if (request->hasParam("id")) id = request->getParam("id")->value();
             if (request->hasParam("value")) value = request->getParam("value")->value();
 
             _response = request->beginResponseStream("text/plain");
             cors_h(_response);
-            parse(action, id, value);
+            parse(auth, action, id, value);
             request->send(_response);
             _response = nullptr;
         });
 
+        server.on("/fetch", HTTP_GET, [this](AsyncWebServerRequest *request) {
+            String auth, path;
+            if (request->hasParam("auth")) auth = request->getParam("auth")->value();
+            if (request->hasParam("path")) path = request->getParam("path")->value();
+        
+            if (authenticate(auth)) {
+                AsyncWebServerResponse *response = request->beginResponse(ST_FS, path);
+                cors_h(response);
+                request->send(response);
+            } else {
+                sendCode(401, request);
+            }
+        });
+
+        server.on("/upload", HTTP_POST, 
+        [this](AsyncWebServerRequest* request) {
+            sendCode(200, request);
+        },
+        [this](AsyncWebServerRequest* request, String filename, size_t index, uint8_t* data, size_t len, bool final) {
+            String auth, path;
+            if (request->hasParam("auth")) auth = request->getParam("auth")->value();
+            if (request->hasParam("path")) path = request->getParam("path")->value();
+            if (!authenticate(auth)) return;
+            if (!index) _file = openFileWrite(path);
+            if (len && _file) _file.write(data, len);
+            if (final && _file) _file.close();
+        });
+
+        server.on("/ota", HTTP_POST, 
+        [this](AsyncWebServerRequest* request) {
+            sendCode(Update.hasError() ? 500 : 200, request);
+            if (!Update.hasError()) restart();
+        },
+        [this](AsyncWebServerRequest* request, String filename, size_t index, uint8_t* data, size_t len, bool final) {
+            String auth;
+            if (request->hasParam("auth")) auth = request->getParam("auth")->value();
+            if (!authenticate(auth)) return;
+            if (!index) sets::beginOta(true, true);
+            if (len) Update.write(data, len);
+            if (final) Update.end(true);
+        });
+
         server.onNotFound([this](AsyncWebServerRequest *request) {
             AsyncWebServerResponse *response = request->beginResponse_P(200, "text/html", settings_index_gz, settings_index_gz_len);
             gzip_h(response);
@@ -55,6 +101,12 @@ class SettingsAsync : public SettingsBase {
             cache_h(response);
             request->send(response);
         });
+        server.on("/favicon.svg", HTTP_GET, [this](AsyncWebServerRequest *request) {
+            AsyncWebServerResponse *response = request->beginResponse_P(200, "image/svg+xml", settings_favicon_gz, settings_favicon_gz_len);
+            gzip_h(response);
+            cache_h(response);
+            request->send(response);
+        });
     }
 
     void tick() {
@@ -66,10 +118,16 @@ class SettingsAsync : public SettingsBase {
     AsyncWebServer server;
     AsyncResponseStream *_response = nullptr;
     sets::DnsWrapper _dns;
+    File _file;
 
     void send(uint8_t *data, size_t len) {
         if (_response) _response->write(data, len);
     }
+    void sendCode(int code, AsyncWebServerRequest* request) {
+        AsyncWebServerResponse *response = request->beginResponse(code);
+        cors_h(response);
+        request->send(response);
+    }
 
     void gzip_h(AsyncWebServerResponse *response) {
         response->addHeader(F("Content-Encoding"), F("gzip"));
@@ -83,8 +141,10 @@ class SettingsAsync : public SettingsBase {
         response->addHeader(F("Expires"), F("0"));
     }
     void cors_h(AsyncWebServerResponse *response) {
+#ifdef SETS_USE_CORS
         response->addHeader(F("Access-Control-Allow-Origin"), F("*"));
         response->addHeader(F("Access-Control-Allow-Private-Network"), F("true"));
         response->addHeader(F("Access-Control-Allow-Methods"), F("*"));
+#endif
     }
 };