Веб-интерфейс для 8266/32 (JeeUI2)

Веб интерфейс для 8266/32 на базе скрипта от JeeUI2, не требующий установки дополнительных библиотек, умеющий работать совместно со штатным веб интерфейсом, и имеющий такую же (блочную) логику управления как и блоки в FLProg.

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#1

Сообщение artemka19 » 05.08.2022{, 19:49}

Создано в версии 7.5.2
*Благодарность за поддержку - Phazz


Описание:
СпойлерПоказать
Веб интерфейс для esp 8266/32*, использующий при построении веб-интерфейса привычный блочный принцип.
-Блоки компилируются также как находятся на плате. (по тем же правилам как и остальные блоки в FLProg).
-Используйте кнопку 'Порядок компиляции блоков" чтобы убедиться в правильности сборки блоков при компиляции!
-Счет страниц начинается с "0", т.е. страница=0 - это Первая страница!!! Номер страницы задается для каждого блока отдельно в параметрах блока.
-Возможно использование совместно со штатным веб-интерфейсом (в этом случае необходимо задать свой адрес, например, " /test").
-Возможно использование опции "Обновление прошивки" (WebUpdate Firmvare).
-Блоки веб-интерфейса не обязательно использовать на одной плате. Но важно самому не запутаться в порядке их использования.
-Имена пунктов в меню не должны быть пустыми.
-Выход "out" в блоках - на этом выходе появятся Данные с веб страницы на один цикл
-Выход "новые данные" в блоках - на этом выходе будет "1" на один цикл и говорит о том что получены новые данные с веб страницы.
-Надпись на выходах блоков "(R-t) ..." означает, что выход работает как R-триггер (R-t).
-Выход "get" - при каждом запросе данных с веб-страницы это выход будет принимать значение "1".
-В блоках Надпись и Поле Ввода добавлена возможность установки размера шрифта (автор @Ushakov)
----------------------------------------------------------------------------
* ВНИМАНИЕ!!! при использовании есп32, есть ограничение:
-ВСЕ блоки веб-интерфейса должны быть в самом конце проекта. (необязательно на одной плате).
-В самом конце проекта, на самой последней плате необходимо вытащить блок "ПОСЛЕДНИЙ БЛОК".
-(for devops) Весь код, содержащийся в Любых Других блоках в секциях "Конец секции Loop", будет помещен в функцию empty().
Эта функция empty() ,будет запускаться в конце Loop.

----------------------------------ВНИМАНИЕ!!!---------------------
в FLProg 7.5.2 - если изменяете МК, то Перед компиляцией:
1.Cохраните проект после этого.
2.Переоткройте проект заново.
(иначе не сработают условия внутри блоков и получите ошибку при компиляции!).
**это обязательно!
**данный баг известен разработчику FLProg, ожидаем исправления :)
----------------------------------------------------------------------------
****отладочную информацию (json строку) можно посмотреть по адресу: "тут-IP-есп/echo"
----------------------------------------------------------------------------
Картинки:
СпойлерПоказать
11.png
5.png
3.png
нет связи.png
22.png
поиск.jpg
Screenshot_20220805-195513.jpg
Screenshot_20220805-195533.jpg



Скачать проект:
СпойлерПоказать
Использование названий цветов в блоках: viewtopic.php?t=8159&start=20#p116874
Последний раз редактировалось artemka19 16.09.2022{, 18:33}, всего редактировалось 40 раз.

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#2

Сообщение artemka19 » 05.08.2022{, 19:51}

Мини-Фак:

-Создание МЕНЮ

1. вытаскиваем Главный блок. задаем заголовок и информацию
СпойлерПоказать
1шаг.png
шаг1.png
2.создаем меню:
СпойлерПоказать
меню1.png
меню2.png
меню2.png (37.16 КБ) 3701 просмотр
нажимаем "Заполнить" и указываем названия для своих пунктов меню:
СпойлерПоказать
меню пункты.png
результат:
СпойлерПоказать
3333.png
Последний раз редактировалось artemka19 05.08.2022{, 20:23}, всего редактировалось 8 раз.

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#3

Сообщение artemka19 » 05.08.2022{, 20:00}

Настройки режима работы WiFi для esp8266

если при использовании ecp8266 слишком часто появляется надпись "НЕТ СВЯЗИ!" (но при этом известно что сила сигнала wifi от роутера достаточная), то можно попробовать следующее:

1 - в блоке в флпрог явно указать режим работы с вай-фай для 8266.(например 802.11n)
2 - и если в роутере есть возможность - то и в нем указать такой же режим работы wifi
(такой же как мы указали в блоке для есп8266)

*по умолчанию в блоке установлен режим автовыбора.

картинки-примеры настроек:
СпойлерПоказать

роутер:
1.png


блок в флпрог:
2.png

//------------------
У меня на таких настройках (как на картинках выше) крайне Стабильное поведение у 8266/32 и никаких надписей не появляется лишний раз).
Однако, при высокой нагрузке на wifi сеть (какой-нибудь торрент-качалкой или
даже если начать измерять скорость сети приложением SpeedTest) - то надпись "НЕТ СВЯЗИ!" может кратковременно отображаться (но только на 8266!)
Последний раз редактировалось artemka19 09.08.2022{, 01:59}, всего редактировалось 7 раз.

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#4

Сообщение artemka19 » 05.08.2022{, 20:38}

пробуем)
если понравится - будем развивать дальше)

ecoins
Полковник
Сообщения: 1804
Зарегистрирован: 12.02.2016{, 11:40}
Репутация: 315
Откуда: Шатура
Имя: Энвер

Веб-интерфейс для 8266/32 (JeeUI2)

#5

Сообщение ecoins » 05.08.2022{, 21:28}

Здорово, что сделали, давно сами присматривались.
Будем испытывать.

ArtemArable
Рядовой
Сообщения: 60
Зарегистрирован: 23.11.2020{, 16:46}
Репутация: 1
Имя: Artem

Веб-интерфейс для 8266/32 (JeeUI2)

#6

Сообщение ArtemArable » 06.08.2022{, 09:25}

Интересно. Надо попробовать. Какое разнообразие WebUI сложилось:
- встроенный;
- ESPUI;
- GyverPortal;
- JeeUI
Кто лучше...

Аватара пользователя
Phazz
Полковник
Сообщения: 2064
Зарегистрирован: 17.10.2016{, 15:38}
Репутация: 249
Откуда: Сургут
Имя: Анатолий

Веб-интерфейс для 8266/32 (JeeUI2)

#7

Сообщение Phazz » 06.08.2022{, 10:18}

Скажу про преимущества этого UI.
1. Он создавался с учетом специфики флпрог.
2. Нет специальных библиотек.
3. Расположение элементов зависит от расположения блоков в проекте а не от хронологического порядка добавления.
4. Гибкость. В некоторых моментах он даже гибче чем встроенный UI.
5. Встроенный поиск в сети и апдейт.

Ну и это готовое приложение по сути. Перенести его через appinvertor труда большого не составит

ArtemArable
Рядовой
Сообщения: 60
Зарегистрирован: 23.11.2020{, 16:46}
Репутация: 1
Имя: Artem

Веб-интерфейс для 8266/32 (JeeUI2)

#8

Сообщение ArtemArable » 06.08.2022{, 10:46}

Phazz писал(а):
06.08.2022{, 10:18}
Скажу про преимущества этого UI.
1. Он создавался с учетом специфики флпрог.
2. Нет специальных библиотек.
3. Расположение элементов зависит от расположения блоков в проекте а не от хронологического порядка добавления.
4. Гибкость. В некоторых моментах он даже гибче чем встроенный UI.
5. Встроенный поиск в сети и апдейт.

Ну и это готовое приложение по сути. Перенести его через appinvertor труда большого не составит
В Телеге уже писал, что встроенному не хватает блочности. Процесс создания, отладки занимает много времени.

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#9

Сообщение artemka19 » 06.08.2022{, 22:17}

ArtemArable писал(а):
06.08.2022{, 09:25}
- встроенный;
- ESPUI;
- GyverPortal;
- JeeUI
тут самое интересное отличие: можно использовать Штатный и Jeeui2 совместно-параллельно на одном порту (не поднимая еще один дополнительный затратный по ресурсам для МК веб сервер)

*буквально в два клика)

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#10

Сообщение artemka19 » 06.08.2022{, 22:27}

*имеется желание реализовать на базе этого блока и еще такие протоколы как: Асинхронный веб-сервер и Реал-тайм сервер (веб-сокет сервер).

Было бы крайне удобно, на мой субъективный взгляд, иметь возможность выбора протокола общения при создании интерфейса прямо из Пользовательского блока в флпрог)

sergserg
Сержант
Сообщения: 203
Зарегистрирован: 25.02.2021{, 14:26}
Репутация: -17
Имя: Сергей

Веб-интерфейс для 8266/32 (JeeUI2)

#11

Сообщение sergserg » 06.08.2022{, 23:12}

artemka19 писал(а):
05.08.2022{, 20:38}
пробуем)
если понравится - будем развивать дальше)
мне вот это понравилось: поставил всего одну галочку в блоке и получил обновление прошивки без всякого гемора :smile9:

artemka19 писал(а):
06.08.2022{, 22:27}
Асинхронный веб-сервер и Реал-тайм сервер (веб-сокет сервер).
а это что за звери такие? :smile427:

П,С, а сможете добавить ползунок какой нибудь еще?)

tema
Рядовой
Сообщения: 78
Зарегистрирован: 21.09.2020{, 12:31}
Репутация: 1
Имя: tema

Веб-интерфейс для 8266/32 (JeeUI2)

#12

Сообщение tema » 07.08.2022{, 08:18}

а можно блоки без проекта?

ArtemArable
Рядовой
Сообщения: 60
Зарегистрирован: 23.11.2020{, 16:46}
Репутация: 1
Имя: Artem

Веб-интерфейс для 8266/32 (JeeUI2)

#13

Сообщение ArtemArable » 07.08.2022{, 09:04}

tema писал(а):
07.08.2022{, 08:18}
а можно блоки без проекта?
ПКМ, выбрать сохранить в библиотеке...

Отправлено спустя 1 час 6 минут 24 секунды:
Запустил проект из шапки. Периодически выдает отсутствие связи.

Отправлено спустя 2 часа 34 минуты 4 секунды:
Может какое то ТЗ накидать совместно? Определиться с потребностями, так сказать.

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#14

Сообщение artemka19 » 07.08.2022{, 23:05}

ArtemArable писал(а):
07.08.2022{, 12:44}
Периодически выдает отсутствие связи.
на esp8266?

ArtemArable
Рядовой
Сообщения: 60
Зарегистрирован: 23.11.2020{, 16:46}
Репутация: 1
Имя: Artem

Веб-интерфейс для 8266/32 (JeeUI2)

#15

Сообщение ArtemArable » 07.08.2022{, 23:56}

artemka19 писал(а):
07.08.2022{, 23:05}
ArtemArable писал(а):
07.08.2022{, 12:44}
Периодически выдает отсутствие связи.
на esp8266?
Да.

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#16

Сообщение artemka19 » 08.08.2022{, 00:41}

update - v.1.21
-добавлена опция для 8266 - выбор режима работы сети (802.11b/g/n)

ArtemArable писал(а):
07.08.2022{, 23:56}
Да.
пробуем это решение :
viewtopic.php?f=202&t=8159&p=116295#p116295

у меня стало отлично работать! :smile9:

Отправлено спустя 13 минут 48 секунд:
sergserg писал(а):
06.08.2022{, 23:12}
а сможете добавить ползунок какой нибудь еще?
накидаю попозже еще элементов)

artemka19
Лейтенант
Сообщения: 333
Зарегистрирован: 03.09.2020{, 15:41}
Репутация: 134
Откуда: Питер
Имя: Артем

Веб-интерфейс для 8266/32 (JeeUI2)

#17

Сообщение artemka19 » 09.08.2022{, 02:07}

update до v.1.22

-добавлен ползунок
-добавлен выбор цвета
СпойлерПоказать
1.png
2.png
3.png
4.png
5.png
6.png

Аватара пользователя
Phazz
Полковник
Сообщения: 2064
Зарегистрирован: 17.10.2016{, 15:38}
Репутация: 249
Откуда: Сургут
Имя: Анатолий

Веб-интерфейс для 8266/32 (JeeUI2)

#18

Сообщение Phazz » 09.08.2022{, 19:44}

artemka19, А можно выпадающий список? Пожалуйста ))

ArtemArable
Рядовой
Сообщения: 60
Зарегистрирован: 23.11.2020{, 16:46}
Репутация: 1
Имя: Artem

Веб-интерфейс для 8266/32 (JeeUI2)

#19

Сообщение ArtemArable » 09.08.2022{, 20:53}

Phazz писал(а):
09.08.2022{, 19:44}
artemka19, А можно выпадающий список? Пожалуйста ))
Друзья, нужно ТЗ :rtfm: В какую форму это облачить решать автору. Считаю, что необходимы поля ввода и вывода данных, времени, даты, выпадающий список, слайдер, блок логгирования с меткой времени, разные кнопки, переключатели. Блоки элементов вывода с входом предустановки, а лучше с выбором возможности записью в EEPROM.

Ingwar
Полковник
Сообщения: 1714
Зарегистрирован: 28.10.2015{, 22:47}
Репутация: 140
Откуда: Ленобласть
Имя: Игорь

Веб-интерфейс для 8266/32 (JeeUI2)

#20

Сообщение Ingwar » 10.08.2022{, 01:08}

ArtemArable писал(а):
09.08.2022{, 20:53}
Друзья, нужно ТЗ В какую форму это облачить решать автору. Считаю, что необходимы поля ввода и вывода данных, времени, даты, выпадающий список, слайдер, блок логгирования с меткой времени, разные кнопки, переключатели. Блоки элементов вывода с входом предустановки, а лучше с выбором возможности записью в EEPROM.
Еще немного и artemka19, будет ДОЛЖЕН всему форуму... :smile171: :smile171: :smile171:
Люди в своем большинстве живо интересуются всем на свете, за исключением того, что действительно стоит знать.

Ответить

Вернуться в «WEB интерфейс»