В прошлом году звёзды сошлись и я понял чего мне не хватает в деревенском доме: удобного управления климатом в комнатах и нагревателем воды на кухне. Этот проект все ещё не закончен, но уже близок к завершению. Надеюсь к лету доделаю. А пока опишу другой проект, который сделал параллельно.
Для управления климатом я разрабатываю контроллер с символьным дисплеем 16x2 дисплеем, парой кнопок под управлением ESP8266 которые будет установлены в пластиковом корпусе. Для проработки отображаемой на дисплее информации нужно было как-то ее себе представлять. На гитхабе нашелся проект, с помощью которого можно было сгенерировать внешний вид такого дисплея. Но там каждый раз нужно было вручную писать html и js код. Чтоб упростить в дальнейшем разработку решил это дело оптимизировать, что и вылилось в онлайн веб эмулятор LCD дисплеев. Проект open source, размещен на GitHub. Далее опишу его возможности.
Разрабатывая этот проект, случайно открыл для себя возможность разместить его на хостинге GitHub. В целом все круто: после аплоада изменений в репозиторий обновления автоматически погружаются в веб версию.
Основные возможности:
- Просмотр таблиц символов для англоязычных, японских и русифицированных версий дисплеев
- Таблица разных спецсимволов
- Генератор кода для Ардуино пользовательских символов
- Настройки цвета дисплея и символов, количества и размера символов и др.
- Одновременное тестирование неограниченного количества дисплеев в удобном веб-интерфейсе
- Настройки и конфигурация тестовых дисплеев сохраняются локально в базе браузера. Вы сможете сохранить страницу и работать с ней оффлайн
- Интерфейс оптимизирован для просмотра на смартфонах
Из базового проекта были взяты без изменений кодовые таблицы для английского и японского языков. Я добавил таблицу символов для русифицированных дисплеев и таблицу с набором специальных символов (templates).
Посмотреть эти таблицы можно на вкладке СРs (Code pages).
При выборе любого символа в таблице он подсвечивается красной рамкой и копируется во внутреннюю переменную, из которой потом можно его вставить в редакторе пользовательских символов (вкладка Custom).
 |
| Таблица пользовательских символов |
Естественно был добавлен свой редактор пользовательских символов с генератором ардуино-кода. Для вставки сохраненного ранее символа в матрицу и дальнейшего редактирования - нажмите ▼
 |
| Генератор arduino-кода для пользовательских символов |
По назначению кнопок:
Х - очистит всю панель пользовательских символов
▲ - скопирует выделенный символ во внутреннею переменную, а так же сохранит весь набор пользовательских символов для вставки его в тестируемые панели на вкладке Test
▼ - вставит скопированный символ в текущую позицию или заменит все пользовательские символы в панели, если перед этим вы скопировали параметры тестируемой панели.
Назначение по остальным кнопкам думаю должно быть и так понятно.
На вкладке Config можно задать параметры отображения тестируемых панелей – количество символов, цвет дисплея, размер пикселей тестируемого дисплея.
 |
| Конфигурация тестируемых панелей |
Все настройки сохраняются в локальном хранилище вашего браузера и загружаются при каждом обновлении страницы. Таким образом можно не бояться, что тестируемые параметры пропадут.
На вкладке Test находятся тестируемые панели:
Количество тестируемых дисплеев не ограничен. Но при большом их количестве начнутся тормоза из-за нехватки оперативной памяти. Но я до этого не доходил.
Можно задать название панели, свернуть ее и скопировать или заменить параметры ее отображения.
Пользовательские символы добавляются из панели Custom в тестовый дисплей при его создании и при загрузке страницы из сохраненных данных. Таким образом, для каждого тестируемого дисплея можно задать свой набор пользовательских символов. Так же вы можете скопировать набор символов из вкладки Custom при помощи кнопки ▲ и вставить этот набор в нужную панель. Обратно тоже работает - при копировании параметров панели, можно затем вставить ее набор пользовательских символов для редактирования.
Для вывода пользовательских, или любых других символов из кодовой страницы тестируемой панели, нужно в текстовом поле ввести обратный слэш и номер символа: "\00" - первый пользовательский символ, "\07" - последний пользовательский символ, "\A4" - позиция символа из кодовой таблицы, где "А" - строка, а "4" - ряд в таблице (для определения позиции символа в таблице см. вкладку CPs)
