admin/wiki
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

auto-sync: 2026-05-12 23:20:01

Browse Source
This commit is contained in:
Stream
2026-05-12 23:20:01 +03:00
parent 4946502720
commit ac3f8839d5
3 changed files with 586 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

285
tasks/enduro-trails/DEV_TASK_DARK_STYLE.md Normal file
View File

@@ -0,0 +1,285 @@
# DEV TASK: Тёмная тема карты (F-18)
**Статус:** Ready for dev
**Проект:** enduro-trails
**Фаза:** 5.1
**BRD:** нет (простая фича)
---
## Цель
> Карта MapLibre переключается между светлым и тёмным стилем синхронно с темой UI (auto/light/dark + SunCalc).
## Архитектура
Сейчас `style.json` — это светлый стиль (фон `#f0ede6`, OSM raster desaturated). Нужно создать `style-dark.json` с тёмной палитрой и исправить логику в `switchMapStyle()`, которая сейчас инвертирована (считает `style.json` тёмным).
Подход: тёмный стиль = тот же OSM raster, но с `brightness-max: 0.3`, `contrast: -0.2`, тёмный background. Цвета треков и POI адаптированы для тёмного фона.
## Стек / Зависимости
- MapLibre GL JS (уже подключён)
- Никаких новых зависимостей
---
## Инфраструктура
| Параметр | Значение |
|----------|----------|
| Сервер | `slin@82.22.50.71` (пароль: `motoZ@yaz2010`) |
| Рабочая директория | `/home/slin/enduro-trails/prototype/static/` |
| Workspace | `/home/node/.openclaw/workspace/tasks/enduro-trails/prototype/static/` |
| Деплой | SFTP + `docker cp` после рестарта |
| Контейнер | `prototype-enduro-trails-1` |
| URL | `https://openclaw.mva154.duckdns.org/enduro/` |
---
## Файловая карта
| Действие | Файл | Ответственность |
|----------|------|-----------------|
| Создать | `static/style-dark.json` | Тёмный стиль карты |
| Переименовать | `static/style.json` → оставить как есть | Светлый стиль (уже есть) |
| Изменить | `static/app.js` (строки 86-105) | Исправить логику switchMapStyle |
---
## Задачи
### Task 1: Создать style-dark.json
**Файлы:**
- Создать: `static/style-dark.json`
**Шаги:**
- [ ] **1.1** Создать `style-dark.json` на основе `style.json` со следующими изменениями:
```json
{
"name": "Enduro Trails Dark",
"layers": [
{
"id": "background",
"paint": { "background-color": "#1a1a2e" }
},
{
"id": "osm-base",
"paint": {
"raster-opacity": 1.0,
"raster-saturation": -0.6,
"raster-contrast": -0.1,
"raster-brightness-min": 0,
"raster-brightness-max": 0.35
}
},
{
"id": "trails-track",
"paint": {
"line-color": "...",
"line-opacity": 0.95
}
// Цвета треков: grade1/2 → #FFE066, grade3/4/5 → #FF6633, default → #FF6633
},
{
"id": "trails-path-bridleway",
"paint": {
"line-color": "#ff4444",
"line-opacity": 0.9
}
},
{
"id": "poi-circles",
"paint": {
"circle-stroke-color": "#333333"
// Остальные цвета POI — ярче на 10-15% для контраста на тёмном фоне
}
},
{
"id": "poi-labels",
"paint": {
"text-color": "#e0e0e0",
"text-halo-color": "#1a1a2e",
"text-halo-width": 2
}
}
]
}
```
Полная спецификация изменений относительно `style.json`:
| Слой | Свойство | Светлый | Тёмный |
|------|----------|---------|--------|
| background | background-color | `#f0ede6` | `#1a1a2e` |
| osm-base | raster-saturation | `-0.4` | `-0.6` |
| osm-base | raster-contrast | `0.25` | `-0.1` |
| osm-base | raster-brightness-max | `0.9` | `0.35` |
| trails-track | line-color grade1/2 | `#FFD700` | `#FFE066` |
| trails-track | line-color grade3/4/5/default | `#FF4400` | `#FF6633` |
| trails-path-bridleway | line-color | `#cc0000` | `#ff4444` |
| poi-circles | circle-stroke-color | `#ffffff` | `#333333` |
| poi-labels | text-color | `#333333` | `#e0e0e0` |
| poi-labels | text-halo-color | `#ffffff` | `#1a1a2e` |
| poi-labels | text-halo-width | `1.5` | `2` |
Все остальные свойства (sources, glyphs, filters, zoom levels, line-width) — копировать из `style.json` без изменений.
- [ ] **1.2** Проверить валидность JSON
```bash
cat static/style-dark.json | python3 -m json.tool > /dev/null && echo "OK"
# Ожидаемый результат: OK
```
**Критерий готовности:** Файл `style-dark.json` существует, валидный JSON, содержит все слои из style.json с тёмной палитрой.
---
### Task 2: Исправить switchMapStyle() в app.js
**Файлы:**
- Изменить: `static/app.js` (строки 86-105)
**Шаги:**
- [ ] **2.1** Заменить функцию `switchMapStyle()` (строки 86-105):
**Было:**
```javascript
function switchMapStyle() {
const map = window._map;
if (!map) return;
const dark = isDarkTheme();
const basePath = window.location.pathname.replace(/\/[^/]*$/, '') || '';
const styleUrl = dark ? basePath + '/style.json' : basePath + '/style-light.json';
// Check if style-light.json exists - if not, keep current
fetch(styleUrl, { method: 'HEAD' }).then(r => {
if (r.ok) {
map.setStyle(styleUrl);
} else {
// No light style available, keep dark
if (!dark) {
console.log('Light map style not available, keeping dark');
}
}
}).catch(() => {
// Network error, don't switch
});
}
```
**Стало:**
```javascript
function switchMapStyle() {
const map = window._map;
if (!map) return;
const dark = isDarkTheme();
const basePath = window.location.pathname.replace(/\/[^/]*$/, '') || '';
const styleUrl = dark ? basePath + '/style-dark.json' : basePath + '/style.json';
fetch(styleUrl, { method: 'HEAD' }).then(r => {
if (r.ok) {
map.setStyle(styleUrl);
} else {
console.log('Map style not available:', styleUrl);
}
}).catch(() => {
// Network error, don't switch
});
}
```
Ключевое изменение: `dark → style-dark.json`, `light → style.json` (было инвертировано).
- [ ] **2.2** Проверить что `switchMapStyle()` вызывается в `applyTheme()` (строка 26) — уже есть, не трогать.
**Критерий готовности:** При `isDarkTheme() === true` загружается `style-dark.json`, при `false` — `style.json`.
---
### Task 3: Деплой и проверка
**Шаги:**
- [ ] **3.1** Загрузить файлы на сервер
```bash
# Через Node.js ssh2 (deploy_static.js) или напрямую:
scp static/style-dark.json slin@82.22.50.71:/home/slin/enduro-trails/prototype/static/
scp static/app.js slin@82.22.50.71:/home/slin/enduro-trails/prototype/static/
```
- [ ] **3.2** Docker cp в контейнер
```bash
ssh slin@82.22.50.71 << 'EOF'
docker cp /home/slin/enduro-trails/prototype/static/style-dark.json prototype-enduro-trails-1:/app/static/style-dark.json
docker cp /home/slin/enduro-trails/prototype/static/app.js prototype-enduro-trails-1:/app/static/app.js
EOF
```
⚠️ НЕ рестартовать контейнер! Просто cp — иначе придётся копировать ВСЕ файлы заново.
- [ ] **3.3** Проверить доступность стилей
```bash
curl -s -o /dev/null -w "%{http_code}" https://openclaw.mva154.duckdns.org/enduro/style.json
# Ожидаемый результат: 200
curl -s -o /dev/null -w "%{http_code}" https://openclaw.mva154.duckdns.org/enduro/style-dark.json
# Ожидаемый результат: 200
```
- [ ] **3.4** Проверить содержимое тёмного стиля
```bash
curl -s https://openclaw.mva154.duckdns.org/enduro/style-dark.json | python3 -c "import json,sys; d=json.load(sys.stdin); print(d['name'], d['layers'][0]['paint'])"
# Ожидаемый результат: Enduro Trails Dark {'background-color': '#1a1a2e'}
```
**Критерий готовности:** Оба стиля доступны по URL, тёмный стиль содержит правильную палитру.
---
## Проверка (Acceptance)
| # | Проверка | Действие | Ожидаемый результат |
|---|----------|----------|---------------------|
| 1 | Светлая тема | Открыть сайт, выбрать ☀️ | Карта светлая (бежевый фон) |
| 2 | Тёмная тема | Переключить на 🌙 | Карта тёмная (тёмно-синий фон, приглушённый OSM) |
| 3 | Auto (день) | Режим auto днём | Карта светлая |
| 4 | Auto (ночь) | Режим auto ночью | Карта тёмная |
| 5 | Overlay сохраняется | Включить terrain → переключить тему | Terrain слой остаётся видимым |
| 6 | Маршрут сохраняется | Построить маршрут → переключить тему | Маршрут остаётся на карте |
| 7 | style-dark.json 200 | `curl` | HTTP 200 |
---
## Ограничения и контекст
- ⚠️ `docker cp` БЕЗ рестарта контейнера — рестарт перезапишет статику из образа
- ⚠️ SSH через Node.js ssh2 модуль (бинарный ssh в контейнере OpenClaw не работает — glibc mismatch). Альтернатива: `deploy_static.js`
- ⚠️ После `map.setStyle()` все кастомные слои (terrain, routes, markers) слетают — `onMapStyleLoad()` + `rebuildMapOverlays()` уже обрабатывают это через событие `style.load`
- 🚫 Не трогать `style.json` — это рабочий светлый стиль
- 🚫 Не менять логику SunCalc / applyAutoTheme — она работает корректно
---
## Деплой-чеклист
- [ ] `style-dark.json` создан и валиден
- [ ] `app.js` — логика `switchMapStyle` исправлена
- [ ] Файлы загружены на сервер (`/home/slin/enduro-trails/prototype/static/`)
- [ ] `docker cp` выполнен (без рестарта!)
- [ ] `style-dark.json` доступен по URL (HTTP 200)
- [ ] Переключение темы меняет стиль карты
- [ ] Overlays (terrain, routes) сохраняются при смене стиля
---
*Создано: 2026-05-12 | Автор ТЗ: Стрим | Исполнитель: Dev-агент*