ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

Управление, ввод и вывод информации

Пользовательские блоки для коммкникации и связи GSM, GPRS, IR, Bluetooth и другие
Правила форума
Рекомендации по размещению блоков:
Автор блока создает подробное описание блока, отличие от подобных(если есть на данный момент).Сложные блоки очень желательно с примерами.
При выходе новых версий редактирует/дополняет свой первый пост с указанием даты, версии, причины.
В каждой теме обсуждается только выложенный автором блок - баги, возможность (или предложение) доработки и прочие хотелки.
Свои блоки, переработанные, с другими библиотеками, протоколами и т.д.- размещаем либо сами отдельно, либо обсуждаем и дорабатываем в форуме Разработка блоков.
Пользователи улучшив блок автора и проверив его работоспособность - могут обратиться к автору или модераторам с просьбой добавить их версию блока в первое сообщение темы.
User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#1

Сообщение User8 » 15.08.2019{, 21:00}

Изображение

ESPUI - веб-интерфейс(dashboard) без необходимости изучения различных языков для создания web-страниц, сам моментально обновляется при изменение значений, без перезагрузки страницы.

Описание блоков:
Main: должен присутствовать в проекте всегда, в параметрах Main блока можно включить авторизацию и задать заголовок веб-интерфейса;
Tab - вкладка: размещается над блоками которым нужно попасть в эту вкладку, укажите нужный tabId в настройках, так же укажите этот же tabId у блоков которые должны быть в этой вкладке;
Slider: в настройках можно указать минимальное и максимальное значение для слайдера;
Switcher: переключатель, выход Status показывает актуальное состояние переключателя. При подаче единицы на вход UpdateValue, в веб-интерфейсе значение изменится, на то, что указанно на входе Value;
Label: вывод любого текста в web-интерфейс, при подаче единицы на вход UpdateText, строка будет обновлена в вебинтерфейсе на ту, что указана на входе Text. Если нужно перевести текст на следующую строку, используйте в строке тег <br> там где нужно перенести текст;
InputText: можно вводить любой текст в вебинтерфейсе, этот текст появится на выходе Text;
InputNumber: тоже самое что и блок InputText, только для ввода чисел.
Button: при нажатии будет единица на выходе Status;
Pad: колесо управления;
PadWithCenter: колесо управление с центральной кнопкой;

Расположение блоков в web-интерфейсе будет такое же, как вы расположите их в flprog.

Доступные цвета для блоков:
COLOR_TURQUOISE
COLOR_EMERALD
COLOR_PETERRIVER
COLOR_WETASPHALT
COLOR_SUNFLOWER
COLOR_CARROT
COLOR_ALIZARIN
COLOR_NONE

Пример проекта для демонстрации функционала:
ESPUI_test2.flp
(4.91 МБ) 3261 скачивание
Видео по использованию интерфейса в flprog:
https://youtu.be/i9-Gy7GuEIw
https://youtu.be/MDqO-L7NTDc
https://youtu.be/ElC8SVVFqn8
https://youtu.be/5LGsO7_Z6f8
https://youtu.be/-VA8BcGTkq8

Если у вас не компилируется проект удалите из FLProg\ideV5\portable\sketchbook\libraries папки ESPUI и ArduinoOTA, если не поможет попробуйте установить библиотеки вручную, разархивируйте архив в папку: flprog\ideV5\libraries\
espui_libraries_v1.2.zip
(1.46 МБ) 2138 скачиваний

Данный веб-интерфейс не будет работать вместе с встроенным в flprog, если только на разных портах.
Не забудьте включить wifi клиент в настройках контроллера и указать данные вашей wifi сети.

Новая/Альтернативная версия блоков: viewtopic.php?f=71&t=7414

Main блок с внешними входами авторизации: viewtopic.php?p=83619#p83619
Остальные блоки: viewtopic.php?p=74571#p74571
Вложения
ESPUI_Main_1_2_(CODE).ubi
(5.08 МБ) 1686 скачиваний
ESPUI_Tab_1_0_(CODE).ubi
(6.85 КБ) 1760 скачиваний
Последний раз редактировалось User8 10.11.2021{, 11:42}, всего редактировалось 66 раз.

User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#41

Сообщение User8 » 14.12.2019{, 23:49}

Main блок обновлен, теперь можно использовать ESP32.

hrach, пытался вам ответить в личные сообщения, но у вас стоит ограничение и я не могу отправить вам сообщение.

User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#42

Сообщение User8 » 15.12.2019{, 01:53}

Обновлен блок Switcher, добавлена возможность изменять состояние в веб-интерфейсе через входы блока.

Отправлено спустя 5 минут 56 секунд:
hrach, теперь можно использовать блок Switcher вместе с физическими кнопками.

vovka1973
Майор
Сообщения: 1060
Зарегистрирован: 14.02.2016{, 14:16}
Репутация: 42
Откуда: kazahstan

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#43

Сообщение vovka1973 » 15.12.2019{, 09:01}

Rovki писал(а):
09.12.2019{, 21:46}
10 каскад управлять 1 лампочкой ...
получилось с разных телефонов управлять одним чайником одновременно.
Интересно, как сделать через интернет управление?

Отправлено спустя 33 минуты 10 секунд:
User8 писал(а):
15.12.2019{, 01:59}
Обновлен блок Switcher, добавлена возможность изменять состояние в веб-интерфейсе через входы блока.
а к кнопкам можно также сделать? И как увеличить текст в блоках?
Изображение

User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#44

Сообщение User8 » 15.12.2019{, 10:20}

vovka1973 писал(а):
15.12.2019{, 09:34}
как сделать через интернет управление?
Все зависит от ip выдаваемого провайдером, если ip белый, то достаточно пробросить порт и настроить ddns.
Если ip серый (обычно серые ip выдают все мобильные операторы), то доступ из интернета можно получить через vpn, в интернете много информации.
vovka1973 писал(а):
15.12.2019{, 09:34}
а к кнопкам можно также сделать?
Пробовал менять название кнопки динамически, изменение происходит только после перезагрузки страницы, так что пока не выйдет.

Brand2
Лейтенант
Сообщения: 414
Зарегистрирован: 26.02.2018{, 21:27}
Репутация: 42
Откуда: Haifa
Имя: Alex

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#45

Сообщение Brand2 » 17.12.2019{, 23:50}

User8, загрузил Ваш проект из примера для демонстрации,а в UART пишет IP unset,в чем может быть причина?

User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#46

Сообщение User8 » 18.12.2019{, 01:06}

Brand2, указано неправильное название wifi сети или пароль в flprog. Еще возможно роутер не выдал ip.

vovka1973
Майор
Сообщения: 1060
Зарегистрирован: 14.02.2016{, 14:16}
Репутация: 42
Откуда: kazahstan

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#47

Сообщение vovka1973 » 18.12.2019{, 03:28}

Brand2 писал(а):
17.12.2019{, 23:50}
User8, загрузил Ваш проект из примера для демонстрации,а в UART пишет IP unset,в чем может быть причина?
попробуйте так , создайте свою точку доступа и подключайтесь к ней и не забудьте включить просто клиента и будет все работать без роутера.
Изображение

Brand2
Лейтенант
Сообщения: 414
Зарегистрирован: 26.02.2018{, 21:27}
Репутация: 42
Откуда: Haifa
Имя: Alex

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#48

Сообщение Brand2 » 18.12.2019{, 09:33}

User8,vovka1973, имя сети и пароль правильные,ночью разбудите скажу ,а вот с точкой доступа работает,но подключение долго проходит,или вообще пишет ошибка аутетификации.

User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#49

Сообщение User8 » 18.12.2019{, 09:40}

Brand2, что за есп? Если это nodemcu на которой есп распаяна прям на плате и без экрана сверху, то эти платы глючные.

Brand2
Лейтенант
Сообщения: 414
Зарегистрирован: 26.02.2018{, 21:27}
Репутация: 42
Откуда: Haifa
Имя: Alex

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#50

Сообщение Brand2 » 18.12.2019{, 10:05}

User8, точно,это wemos,похожа на NODE MCU 012E,только сейчас обратил внимение,они у меня и раньше глючили,забыл просто.
Спасибо,поищу другую плату.

vovka1973
Майор
Сообщения: 1060
Зарегистрирован: 14.02.2016{, 14:16}
Репутация: 42
Откуда: kazahstan

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#51

Сообщение vovka1973 » 18.12.2019{, 15:35}

Brand2 писал(а):
18.12.2019{, 10:05}
NODE MCU 012E
как шьеш ее ? что выставляешь иде? просто у меня wemos mini с камнем 012E шью на
1111.JPG
1111.JPG (10.24 КБ) 2309 просмотров
Изображение

Аватара пользователя
hrach
Сержант
Сообщения: 258
Зарегистрирован: 17.09.2015{, 11:05}
Репутация: 13
Откуда: Самара
Имя: Грачик
Контактная информация:

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#52

Сообщение hrach » 18.12.2019{, 17:15}

User8 писал(а):
15.12.2019{, 01:53}
Main блок обновлен, теперь можно использовать ESP32.

hrach, пытался вам ответить в личные сообщения, но у вас стоит ограничение и я не могу отправить вам сообщение.
Спасибо большое. У меня вопрос такой. Как можно в строку ставить гиперссылку ( пробовал средствами HTML не компилируется выдает ошибку)
Да теперь можно меня с общение отправлять исправил.

Brand2
Лейтенант
Сообщения: 414
Зарегистрирован: 26.02.2018{, 21:27}
Репутация: 42
Откуда: Haifa
Имя: Alex

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#53

Сообщение Brand2 » 18.12.2019{, 17:26}

vovka1973, я шил его как NODE MCU 1(12E),наверное из за этого косяки и вылезли,хотя прошился без проблемм

User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#54

Сообщение User8 » 18.12.2019{, 17:53}

hrach, нужно экранировать скобки обратным слешем: <a href=\"#\">ссылка</a>
Последний раз редактировалось User8 19.12.2019{, 01:04}, всего редактировалось 1 раз.

Аватара пользователя
hrach
Сержант
Сообщения: 258
Зарегистрирован: 17.09.2015{, 11:05}
Репутация: 13
Откуда: Самара
Имя: Грачик
Контактная информация:

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#55

Сообщение hrach » 18.12.2019{, 18:17}

User8 писал(а):
18.12.2019{, 17:53}
hrach, нужно экранировать скобки обратным слешем: <a href=\"#\">test</a>
Спасибо большое, попробую. А стили к тексту можно сделать цвет размер шрифта?

User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#56

Сообщение User8 » 18.12.2019{, 18:55}

hrach, попробуйте так: <span style=\"color:red;\">текст</span>

Аватара пользователя
hrach
Сержант
Сообщения: 258
Зарегистрирован: 17.09.2015{, 11:05}
Репутация: 13
Откуда: Самара
Имя: Грачик
Контактная информация:

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#57

Сообщение hrach » 18.12.2019{, 23:26}

User8 писал(а):
18.12.2019{, 18:55}
hrach, попробуйте так: <span style=\"color:red;\">текст</span>
Спасибо большое, попробую.

Аватара пользователя
hrach
Сержант
Сообщения: 258
Зарегистрирован: 17.09.2015{, 11:05}
Репутация: 13
Откуда: Самара
Имя: Грачик
Контактная информация:

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#58

Сообщение hrach » 25.12.2019{, 21:07}

User8 писал(а):
18.12.2019{, 17:53}
hrach, нужно экранировать скобки обратным слешем: <a href=\"#\">ссылка</a>
Я пробовал сделать ссылку допустим на yandex.ru. Получается так "Не найдена страница для веб-адреса http://192.168.1.14/yandex.ru". Как можно сделать глобальную ссылку?
Вложения
ссылка.jpg

User8
Лейтенант
Сообщения: 341
Зарегистрирован: 12.06.2017{, 14:44}
Репутация: 103
Имя: Евгений

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#59

Сообщение User8 » 25.12.2019{, 21:21}

hrach, <a href=\"https://yandex.ru\">ссылка</a>

Аватара пользователя
hrach
Сержант
Сообщения: 258
Зарегистрирован: 17.09.2015{, 11:05}
Репутация: 13
Откуда: Самара
Имя: Грачик
Контактная информация:

ESPUI - веб-интерфейс из блоков для ESP8266, ESP32

#60

Сообщение hrach » 25.12.2019{, 22:05}

User8 писал(а):
25.12.2019{, 21:21}
hrach, <a href=\"https://yandex.ru\">ссылка</a>
Спасибо большое все заработал.

Ответить

Вернуться в «Коммуникация и связь»