pred8or Jun 6 2023 at 13:59

Свет мой, зеркальце

Easy

12 min

5.2K

DIY

Case

+23

Comments 13

DustyZebra Jun 6 2023 at 14:38

А чем https://open-meteo.com плох? Ни лимитов, ни регистраций вообще.

pred8or Jun 6 2023 at 14:41

Обязательно включу в список провайдеров

janvarev Jun 6 2023 at 15:44

Добавить к системе какой-нибудь STT/TTS и можно пилить собственного голосового чат-бота. Интересно, "Свет мой" пойдёт в качестве триггера?

Можете попробовать Ирину прикрутить (триггер настраивается, если что): https://github.com/janvarev/Irene-Voice-Assistant

Опять же, там есть клиент-серверный вариант, на клиенте можно разместить только слушалку микрофона.

pred8or Jun 6 2023 at 16:01

Один из проектов, на который посматриваю, планировал потестить

Reason89 Jun 6 2023 at 20:26

Хочу купить Zigbee-MQTT шлюз и пару датчиков температуры.

У меня шлюз gateway2 от xiaomi вполне адекватно работает с зеркалом. На форуме magic mirror пару лет назад было кучу плагинов для работы с их датчиками, сейчас думаю ещё больше стало.

pred8or Jun 7 2023 at 10:31

Все датчики, что видел, не ниже -20. Что странно, потому что внешние датчики для обычных бытовых RF-метеостанций умеют -40.

TimeTiger Jun 6 2023 at 23:38

А не поделитесь модулями? Часы с погодой хорошо смотрятся.

pred8or Jun 6 2023 at 23:43

Именно модуль? Без MQTT и прочего он бесполезен. Могу дать HTML + CSS, которые этот дизайн реализуют, собственно, так я их сначала и нарисовал, а потом в модуле реализовал

pred8or Jun 7 2023 at 10:13

html

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>

<div class="r-clock-wr1">
<div class="r-clock-wc1">
<div class="r-clock-dow">воскресенье</div>
<div class="r-clock-date">41 мартобря 2023 г</div>
</div>
<div class="r-clock-time">27:69</div>
<div class="r-clock-weather"><img src="thundershowers.svg" /></div>
<div class="r-clock-temp">58&deg;</div>
</div>

<div class="r-weather-wr1">
<div class="r-weather-wc1" id="r-weather-wc1-1">
<div class="r-weather-dow" id="r-weather-dow-1">Пн</div>
<div class="r-weather-icon"><img id="r-weather-icon-1" src="day-isolated-moderate-sleet-showers.svg" /></div>
<div class="r-weather-temp" id="r-weather-temp-1">-20&deg;/15&deg;</div>
</div>
<div class="r-weather-wc1" id="r-weather-wc1-2">
<div class="r-weather-dow" id="r-weather-dow-2">Вт</div>
<div class="r-weather-icon"><img id="r-weather-icon-2" src="day-isolated-moderate-sleet-showers.svg" /></div>
<div class="r-weather-temp" id="r-weather-temp-2">-20&deg;/15&deg;</div>
</div>
<div class="r-weather-wc1" id="r-weather-wc1-3">
<div class="r-weather-dow" id="r-weather-dow-3">Ср</div>
<div class="r-weather-icon"><img id="r-weather-icon-3" src="day-isolated-moderate-sleet-showers.svg" /></div>
<div class="r-weather-temp" id="r-weather-temp-3">-20&deg;/15&deg;</div>
</div>
<div class="r-weather-wc1" id="r-weather-wc1-4">
<div class="r-weather-dow" id="r-weather-dow-4">Чт</div>
<div class="r-weather-icon"><img id="r-weather-icon-4" src="day-isolated-moderate-sleet-showers.svg" /></div>
<div class="r-weather-temp" id="r-weather-temp-4">-20&deg;/15&deg;</div>
</div>
<div class="r-weather-wc1" id="r-weather-wc1-5">
<div class="r-weather-dow" id="r-weather-dow-5">Пт</div>
<div class="r-weather-icon"><img id="r-weather-icon-5" src="day-isolated-moderate-sleet-showers.svg" /></div>
<div class="r-weather-temp" id="r-weather-temp-5">-20&deg;/15&deg;</div>
</div>
<div class="r-weather-wc1" id="r-weather-wc1-6">
<div class="r-weather-dow" id="r-weather-dow-6">Сб</div>
<div class="r-weather-icon"><img id="r-weather-icon-6" src="day-isolated-moderate-sleet-showers.svg" /></div>
<div class="r-weather-temp" id="r-weather-temp-6">-20&deg;/15&deg;</div>
</div>
</div>

</body>

css

@font-face
{
    font-family: "Yanone Kaffeesatz";
    src: url("YanoneKaffeesatz.ttf");
    font-weight: 200 700;
}

html, body
{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background-color: black;
	color: white;
	font-family: 'Yanone Kaffeesatz';
}

.r-clock-wr1
{
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0;
	font-size: 80px;
    line-height: 1;
}

.r-clock-wc1
{
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	font-size: 0.4em;
	padding: 0;
}

.r-clock-time
{
	font-weight: 700;
	margin: 0 10px;
	padding: 0;
}

.r-clock-dow
{
	text-transform: capitalize;
}

.r-clock-weather img, .r-weather-icon img
{
	width: 96px;
}

.r-weather-wr1
{
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 0;
	font-size: 80px;
    line-height: 1;
    gap: 10px;
}

.r-weather-wc1
{
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0;
}

.r-weather-dow, .r-weather-temp
{
	font-size: 0.4em;
}

Результат

mister_dino Jun 7 2023 at 21:34

Можно еще добавить модуль пробок от Яндекса на JS https://yandex.ru/dev/maps/archive/doc/jsapi/1.x/mod/concepts/traffic.html

pred8or Jun 7 2023 at 21:35

Не, мне это не нужно. Где и когда у меня в районе пробка - я и так знаю

thesilo Jun 7 2023 at 21:53

А почему выбор пал на ips матрицу? Они же всегда болеют засветами и плохим черным цветом. VA матрица была бы лучшим решением, возможно. На них очень четкий черный и минимум засветов

pred8or Jun 7 2023 at 21:55

Выбор не падал, его нет. Я потому этот проект и затеял, с таким портативным монитором что не надо ничего разбирать, думать как подать питание и т.п.