§9 Треугольники с общей высотой: SVG draggable с общей стороной AB и
двумя вершинами C/D на параллельной прямой, live S₁/S₂=a₁/a₂,
анимация-доказательство, калькулятор, тренажёр, босс.
§10 Медиана и площади: SVG draggable треугольник с медианой AM делит
на 2 равновеликих, отдельная визуализация всех 3 медиан → 6 равновеликих
треугольников с центроидом G, доказательство, калькулятор, тренажёр, босс.
§11 Теорема Пифагора (ключевая): слайдеры катетов с квадратами a², b², c²
на сторонах, анимация доказательства через квадрат (a+b)², калькулятор
(a,b→c; c,a→b; диагональ прямоугольника), DnD-сортировщик пифагоровых
троек (3-4-5, 5-12-13, 6-8-10, 7-24-25, 9-12-15), тренажёр, босс (5 задач).
File: 3998 → 5118 LOC. 11 of 15 §§ Главы 2 готовы.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
§5 Draggable трапеция:
- Высота теперь рисуется как вертикальная пунктирная линия В СЕРЕДИНЕ
трапеции от верхнего основания до нижнего (с прямым углом у основания),
а не уходит вертикально вверх от вершины A вне фигуры
- Жёлтый drag-handle для h перенесён в вершину D (верх-лево) — тащишь
её вертикально и высота меняется. Синий drag-handle для b остался в C.
- Добавлены подписи всех вершин ABCD точками и Unbounded-буквами
- Подсказки в углу SVG что какой цвет означает
§5 Пошаговое доказательство:
- Полностью переписана геометрия с КОРРЕКТНЫМ поворотом на 180°
вокруг середины M боковой стороны BC (формула P'=2M-P)
- Раньше копия трапеции уходила за пределы viewBox (y=-20)
- Теперь 4 шага: трапеция → поворот вокруг M → параллелограмм ABD'A' →
половина = трапеция, формула S=½(a+b)h
§8 Прямые углы:
- Card 8.1: треугольник A(20,150) B(220,150) C(92,54) — НАСТОЯЩИЙ
прямоугольный 3-4-5 с h_c=ab/c (раньше координаты не давали 90° в C)
- Card 8.2: оба треугольника теперь корректные прямоугольные с прямыми
углами на правильных вершинах
- Card 8.3: треугольник 6-8-10, маркер прямого угла в H пересчитан
через единичные векторы H→C и H→A (раньше показывал не то направление)
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Системный аудит 62 статических SVG в теоретических карточках выявил
2 мелких косяка:
Ch1 §10 (квадрат, карточка 10.2): не хватало прямоугольных меток в
двух верхних углах — у квадрата были обозначены только нижние.
Добавлены маркеры в (68,24) и (168,24).
Ch2 §2 (прямоугольник, карточка 2.2 — периметр): на верхней стороне
у стрелки была ссылка marker-end='url(#a2)', но сам marker #a2 в SVG
не определён → битая ссылка. Убрана для консистентности с остальными
тремя сторонами.
KaTeX-форматирование: проверено во всех 24 buildP-функциях обеих глав —
везде используются корректные $...$ / $$...$$ / \[...\] делиметры.
Конвертаций не потребовалось.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Было:
- 5.1: высота нарисована из вершины (некорректно как иллюстрация
'расстояние между параллельными сторонами')
- 5.2: координаты треугольников ABD/BCD и диагонали указывали на точки
ВНЕ трапеции (диагональ заканчивалась в (215,30) вместо вершины D=(65,30))
- 5.3: то же — высота из вершины
Стало:
- Высота — вертикальная пунктирная линия в середине трапеции от верхнего
основания до нижнего, с прямым углом
- Все вершины ABCD подписаны и отмечены точками
- В 5.2 диагональ BD корректно проведена, треугольники ABD/BCD точно
совпадают с половинами трапеции, добавлены подписи S₁=½ah, S₂=½bh
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Было: продолжение рисовалось от next-vertex назад через v, дуга центрировалась
у next-vertex с углом из произвольного направления — углы отображались
неправильно (не у тех вершин, не в тех направлениях).
Стало: для каждой вершины v вычисляются prev/next, направления u=(v-prev)/|·|
(входящая сторона), w=(next-v)/|·| (исходящая). Продолжение u рисуется от v
дальше. Дуга — сектор у v от u-направления до w-направления, sweep
определяется через знак векторного произведения (u×w). Подпись угла —
по биссектрисе дуги на радиусе Rlabel.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Drag (12 SVG-интерактивов): pointermove/pointerup/pointercancel слушались на
самом vertex-элементе. При выходе курсора за пределы маленького круга drag
обрывался — отсюда эффект 'нажал, чуть-чуть потянулось, и всё'. Перенесены
на window — теперь работают как нативный drag.
§7 (Прямоугольник): info-карточка показывала 'AC = BD' с одним значением.
Теперь две отдельные карточки AC и BD + индикатор равенства (зелёная плашка
'Диагонали равны' / красная 'Не равны' с Δ).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
В функции drawProof пошагового доказательства §4 использовалась переменная
cy без определения (была только cx). Это приводило к ReferenceError при
вызове buildP4, и из-за throw в ensureBuilt секция §4 не открывалась
при клике на карточку в селекторе параграфов.
Проверено: все 17 параграфов главы (p1-p16, final1) теперь строятся без ошибок.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Часть 1: 9 mini-cards с формулами всех 16 параграфов (KaTeX).
Часть 2: интерактивная SVG-карта иерархии четырёхугольников
(клик по узлу — подсветка свойств).
Часть 3: 7 интегрированных боссов (по 10 XP):
- Босс 1: многоугольник из суммы углов 1620°
- Босс 2: параллелограмм через треугольник ABD
- Босс 3: средние линии прямоугольника → ромб
- Босс 4: ромб 60° → диагонали (Пифагор)
- Босс 5: теорема Фалеса, 3 подзадачи
- Босс 6: треугольник 12-16-20 — средняя линия + медиана + центроид
- Босс 7: равнобедренная трапеция 20/8/10
Часть 4: при победе над всеми — achievement 'Мастер многоугольников Главы 1',
+50 XP бонус, confetti, кнопка перехода к Главе 2.
File: 5194 → 5558 LOC. Глава 1 полностью наполнена.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Прогресс работает, отладочная обвязка больше не нужна:
- tracker.js: удалены все console.log/console.warn (boot, click,
POST, HTTP-ответ, patch-успех), удалены ensureDebugBadge и
updateDebugBadge (визуальный бейдж в правом нижнем углу),
recordParaVisit больше не вызывает updateDebugBadge
- 5 хуков (bubble, capture, setParaTab-patch, .tab[refN] sidebar,
polling .active) сохранены в production-виде — без логов, но
с теми же действиями
- backend/routes/textbooks.js: убран '[progress]' console.log из
POST /:slug/progress
Pre-commit hook теперь проходит без --no-verify.
Chemistry-9 и physics-9 имеют ДВА навигатора:
1. .para-pill[data-para=pN] — верхние пилюли с большими карточками
2. .tab[data-tab=refN] — sidebar-справочник, тонкие строки слева
Ученик кликал именно по второму (§46 Mg и ЩЗМ), но tracker
ловил только первый. Маппинг ref<N> → p<N> по регексу.
Capture-фаза, чтобы не зависеть от bubble.
Если ни bubble, ни capture, ни setParaTab-patch не сработали (например,
страница использует другой механизм навигации), наблюдаем DOM раз в
500мс на изменение класса .active у пилюли. Когда активная пилюля
меняется — фиксируем визит.
Это самый robust способ: работает независимо от событий, функций и
библиотек страницы. Стоит копейки — один querySelector в 500мс.
Юзер докладывает, что клик по пилюле не вызывает body click handler
(никаких логов после клика). Возможные причины: capture-listener
расширения браузера со stopPropagation, CSS overlay, что-то ещё.
Чтобы гарантированно ловить клики ВНЕ зависимости от bubble-цепочки:
1) Bubble click на body (как было)
2) Capture click на document (фаза до bubble)
3) Monkey-patch window.setParaTab — функцию, которую chemistry-9 и
physics-9 зовут inline через onclick. Перехват на уровне JS-функции
работает даже если event-стек сломан.
Защита от двойного срабатывания: pill.__tbVisited флаг на 100мс.
Если setParaTab определяется позже tracker'а — короткий poll 20*100мс.
Из каталога кнопка 'Продолжить' ведёт на /textbook/<slug>#<last_para>.
handleHashNav при загрузке делала setLastPara(p6) — POST с last_para
БЕЗ mark_read. Поэтому каталог менял last_para, но 'прочитано'
оставалось без изменений.
Сейчас handleHashNav объединяет оба обновления (как wirePillTracking)
в один POST с mark_read=key.
Из лога user 2: '[tracker] chemistry-9 → POST {"last_para":"p6"}'
теперь будет '...{"last_para":"p6","mark_read":"p6"}'.
Пользователь видит '1 из N' (от моих тестовых POST через API) но
клики в браузере не увеличивают счётчик. Добавлены логи:
- на boot: slug, есть ли LS, есть ли токен
- на клик по пилюле: ключ
- на каждый POST: тело + HTTP-статус ответа
- на ошибку: response.text или fetch-exception
Цель — собрать сигнал из DevTools-консоли пользователя.
Уберём после диагностики (одобрено как временное).
Tracker проверяет 'LS.getToken()' перед каждым POST'ом. Без api.js
объект LS undefined, и tracker возвращает из syncToServer ничего не
делая. Поэтому в physics8_thermal/electro/optics прогресс не писался
вообще (ни last_para, ни mark_read).
Добавил <script src="/js/api.js" defer> перед xp.js во все 3 файла.
Chemistry-9 и physics-9 не затронуты — у них api.js уже подключён в
конце body перед tracker'ом.
Старый syncPending-баг успел залить локальный localState.read данными,
которых нет на сервере. После фиксов firstTime=false для всех ключей в
localState.read, и mark_read иначе никогда не уходил → каталог показывал
0 даже после реальных кликов.
Решение: убрать оптимизацию firstTime. Слать mark_read КАЖДЫЙ раз —
серверный код if(!arr.includes(mark_read)) arr.push(...) не добавит
дубликат. Лишний POST стоит копейки, зато система самовосстанавливается
без зависимости от загрузочного backfill.
Старый syncPending-баг (теперь починен в коммите dacc0eb) оставил у
учеников локальное состояние с прочитанными параграфами, но сервер
ничего не знал. После фикса firstTime=false для всех уже-кликнутых
пилюль, и mark_read не уходил на сервер при повторном клике.
Решение: loadServerProgress теперь вычисляет diff между local.read
и server.read; для каждого ключа, которого нет на сервере, дёргает
syncToServer({mark_read: k}). Coalesce в pendingExtra гарантирует,
что все запросы упорядочатся.
Эффект: при следующей загрузке учебника каталог автоматически догоняется.
Раньше: клик по .para-pill вызывал setLastPara() → POST с last_para
→ syncPending=true. Тут же вызывался markRead() → второй POST с
mark_read → guard 'if (syncPending) return' молча отбрасывал его.
Результат: каталог показывал 'Продолжить' (last_para пришёл),
но '0 из N прочитано' (paragraphs_read остался пуст).
Два уровня фикса:
1) wirePillTracking объединяет last_para + mark_read в ОДИН POST
через коалесцирующий syncToServer(firstTime ? {mark_read:key} : {})
2) syncToServer теперь не дропает патчи: если предыдущий POST в
полёте, новые поля сохраняются в pendingExtra и отправляются
после .finally() — гарантия 'ни один mark_read не теряется'.
Затрагивает chemistry-9, physics-9, physics8_thermal/electro/optics —
у них теперь '0/N прочитано' начнёт расти при кликах по пилюлям.
После переименования slug algebra-8 → algebra-8-ch1 (миграция 014) Глава 1
продолжала POSTить прогресс под старым именем 'algebra-8', который теперь
указывает на hub-строку. Эффект: paragraphs_read и last_para уходили в
hub-row, а каталог хабов их игнорировал (агрегирует только children).
Фикс:
- algebra_8.html: _TB_SLUG = 'algebra-8-ch1'
- migration 016: union перенос ошибочно записанного прогресса из hub в
ch1; очистка hub-row. Идемпотентно (NOT EXISTS guard).
Проверено: после миграции у user 2 paragraphs_read='["p1"]' живёт в
ch1-row, hub-row пуста.
Другие учебники проверены — корректно:
- ch2/ch3 уже использовали правильные slug
- chemistry-9, physics-9, physics8_* подключены через textbook-tracker
- algebra_8_hub.html и physics_8.html — хабы без tracker (правильно)
A. textbook-tracker.js: первый клик по .para-pill теперь автоматически
помечает параграф как прочитанный. «Прочитано» = «открыто». Сразу
даёт осмысленный счётчик для chemistry-9 и physics-9 в каталоге.
Slug fallback: physics8_* → physics-8-* (корректный слаг).
B. Физика 8 — миграция 015:
- 3 children: physics-8-thermal / electro / optics с parent_slug
- parent физики-8 обновлён: para_count=40, описание трёх разделов
- sub-файлы получили textbook-tracker.js + правильный слаг
- physics_8.html переписана в стиле algebra_8_hub: 3 цветные
карточки, агрегированный прогресс, ачивка «Эксперт физики 8»
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- migration 014: parent_slug column + algebra-8 hub row +
rename old algebra-8 → algebra-8-ch1 (progress сохраняется
через стабильный textbook_id=3)
- backend/routes/textbooks.js: GET / фильтрует parent_slug IS NULL;
aggregated progress для хабов; новый GET /:slug/children
- algebra_8_hub.html: новая хаб-страница с 3 карточками глав,
hero с общим прогрессом, XP-бейдж, ссылки на главы
- algebra_8/ch2/ch3: кнопки cross-chapter заменены на
одну «К алгебре 8» в шапке
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- js/textbook-xp-widget.js: shared модуль (monkey-patch addXp +
para-pill auto-award для учебников без addXp)
- physics8_thermal/electro/optics: добавлены теги /js/xp.js и
/js/textbook-xp-widget.js — теперь все 74 addXp-хука пробрасываются
в глобальный gamification (через self-award endpoint с дебаунсом)
- chemistry_9 + physics_9: те же теги. Каждый первый клик по
.para-pill даёт +5 XP в систему (без правок 23000 LOC)
- Изначальный XP в учебниках не теряется — localStorage остаётся
кешем, сервер — источник правды
§ Финал главы 3:
- BOSS ARENA: 7 боссов (5–7 заданий каждый, иконки <>, ±, [], ∩, ∪, 1/x, ★):
· §13 Хранитель сравнения — свойства, транзитивность, смена знака
· §14 Алхимик границ — оценки x+y, x-y, xy
· §15 Архитектор промежутков — линейные неравенства, запись
· §16 Дирижёр пересечений — системы и совокупности
· §17 Мастер параболы — квадратные, D, корни
· §18 Властелин ОДЗ — дробно-рац., выколотые точки
· ★ Чемпион неравенств (финал) — 7 заданий из всей главы
- Универсальный движок select / yesno / input, HP-бар, состояние в localStorage
- Сертификат «Чемпион неравенств» при всех 7 победах
Увлекательная математика (3 факта):
- Почему меняется знак при умножении на отрицательное
- Кто придумал знаки $<$ и $>$ (Хэрриот, 1631)
- Неравенство Коши (a+b)/2 ≥ √(ab)
Финальная практика — генератор 5 типов задач (линейные, оценка,
системы, квадратные, ОДЗ). Серия из 5 = достижение.
algebra_8.html: добавлена ссылка «Глава 3 →» в шапке.
§ 17 «Квадратные неравенства. Метод интервалов»:
- Теория: парабола, метод интервалов, правило знаков
- INTERACT 1: SVG-парабола + слайдеры a, b, c с цветовой раскраской
на оси: зелёные зоны = выражение > 0, красные = < 0. Корни как
точки. Внизу — текстовый анализ (D, корни, решение для >0 и <0).
- INTERACT 2: Пошаговый решатель — D, корни, знаки, ответ
(4-5 шагов с обработкой D<0 и D=0)
- INTERACT 3: Тренажёр 6 квадратных (multiple-choice)
- INTERACT 4: Drag-сопоставление (a, D, направление неравенства) →
тип ответа: вне корней / между / R / пусто
- INTERACT 5: «Где плюс, где минус?» — кликаем по 3 интервалам
параболы x²−4x+3, ставим знаки. Победа = +, -, +.
§ 18 «Дробно-рациональные»:
- Теория: f/g ≷ 0, выколотые точки знаменателя, алгоритм
- INTERACT 1: Пошаговый решатель (x-a)/(x-b) ≥ 0 с учётом a vs b
(включая случай a == b)
- INTERACT 2: Тренажёр 6 неравенств (multiple-choice)
- INTERACT 3: Найди ОДЗ — 5 выражений, вводим запрещённые точки
- INTERACT 4: Drag «закрашена/выколота» — 8 ситуаций
Раньше: алгебра 1 и 2 главы хранили прогресс только в localStorage,
поэтому каталог /textbooks показывал 0/N прочитано и кнопку 'Открыть'
даже после активной работы с учебником.
Теперь обе главы шлют POST /api/textbooks/:slug/progress:
- markLastPara(id) — при каждом goTo(); сервер запоминает last_para,
каталог показывает кнопку 'Продолжить'.
- markParaRead(id) — когда STATE.progress[key] первый раз ≥ 50%
(внутрипараграфный прогресс достаточен); сервер добавляет id в
paragraphs_read[], каталог показывает '1/7 прочитано'.
- Дебаунс 600мс — несколько быстрых переходов схлопываются в один POST.
- keepalive:true + beforeunload-flush, чтобы последний переход не
потерялся при закрытии вкладки.
- loadServerReadState() при init() — если на другом устройстве уже
прочитаны параграфы, локальный STATE.progress поднимается до 100%
для них (визуально совпадает с каталогом).
Slug: 'algebra-8' для ch1, 'algebra-8-ch2' для ch2.
- backend: POST /api/gamification/self-award (rate-limited, validated)
- frontend/js/xp.js: load/add/flush/on клиент, ~150 LOC, дебаунс 300мс,
keepalive fetch на unload/visibilitychange hidden
- algebra_8.html и algebra_8_ch2.html: XP_LEVELS заменён на единую
формулу с сервером; addXp/loadProgress подключены к window.LS.xp
- При первой загрузке: merge max(local, server); далее сервер — источник
правды
Раньше: каждая глава хранила XP отдельно (algebra8_ch1_xp +
algebra8_ch2_xp), формулы уровня были разные (дискретная таблица в
ch1, формула sqrt в ch2), визуально XP-карты различались.
Теперь:
- Один ключ localStorage: 'algebra8_xp' для обеих глав.
- При первой загрузке (в любой главе) — single-shot миграция:
если новый ключ отсутствует, суммирует старые ch1 + ch2 и
сохраняет под единый ключ. Старые ключи не удаляются (на всякий).
- Единая таблица уровней XP_LEVELS = [0, 50, 120, 220, 350, 520,
740, 1000, 1300, 1700, 2200] (11 уровней, MAX = Ур. 11).
- Единые функции calcLevel(xp) и _xpForLevel(lv).
- XP-карта в сайдбаре главы 2 теперь идентична главе 1:
градиент acc→pri-soft, .xp-card-title, .xp-bar, .xp-fill, .xp-nums.
- Hero badge «★ Ур. N · NN XP» добавлен в hero обоих глав.
- addXp в ch2: при повышении уровня — popup с номером уровня + confetti.
- addXp в ch1: refreshProgressUI вызывается, чтобы обновлять hero
badge сразу после начисления.
- SIDEBARS.final2: убрал stub 'будет в Wave 4', добавил 5 строк по
финалу (7 боссов, типы заданий, награда, практика, серия).
- XP card в сайдбаре: уровень (Lv N), текущий XP, прогресс-бар до
следующего уровня, остаток XP. Формула: Lv = floor(sqrt(xp/50)).
- XP badge в hero (рядом с прогрессом): жёлто-розовая пилюля
«★ Lv N · NN XP», обновляется при каждом addXp.
- TIPS: 7 советов (по одному на каждый §+финал). В сайдбаре отдельная
карточка «Подсказка» с жёлтым градиентом — контекстная под текущий
параграф.
- refreshProgressUI: после изменения XP пересобирает сайдбар, чтобы
карточки опыта/совета оставались актуальными.
Универсальный хелпер setupSorter(cfg) с pointer-events:
- desktop: тащим карточку → подсветка целевого ящика → отпускаем = поставлено
- touch / mobile: тап по карточке (становится "armed") → тап по ящику = поставлено
- × кнопка на placed-чипе → возврат в pool
- drop за пределы ящика на сам pool тоже возвращает чип
- threshold 8px — клик не превращается в drag случайно
Стили: .dnd-chip с cursor:grab/active grabbing, .armed shadow,
.dragging opacity, .drop-box.over подсветка с лёгким scale.
Применено к:
- § 7 INT 2 (полное / неполное / не квадратное) — 8 уравнений
- § 10 INT 5 (раскладывается / не раскладывается) — 8 трёхчленов
- § 11 INT 5 (движение / работа / числа / геометрия) — 8 задач,
columnLayout:true для длинных текстов
Старые «лесенки кнопок Полн./Неполн./Не квадр.» удалены — теперь
один-клик-затем-один-клик или drag. § 12 INT 4 оставлен как
<select> (другой паттерн: одна метка для нескольких уравнений).
Три «пошаговых» решателя дампили все шаги сразу при первом клике.
Переписаны на прогрессивное раскрытие:
- § 8 INT 5 «Пошаговый решатель» (квадратное)
- § 10 INT 2 «Пошаговый разлагатель»
- § 12 INT 1 «Решатель биквадратного»
Паттерн: Старт → шаги собираются в массив, idx=0 → Дальше (1/N) →
каждый шаг — отдельный блок с border-left и fadeIn. По окончании —
кнопка «Готово», начисление достижения и confetti. Кнопка «Сначала»
сбрасывает к Старту.
Ещё: § 8 INT 4 — $D = b^2 - 4ac$ показывался буквально с долларами,
потому что использовался textContent + renderMath на чужом элементе.
Заменено на innerHTML + renderMath на правильный узел.
- Слайдеры (.sliders label): убран flex-direction:column, который раскладывал
KaTeX-span / '=' / <b> / <input> на 4 строки. Теперь label = block,
всё на одной строке, slider — на следующей.
- .wg-help: вместо мелкого курсива — полноценный hint-box с жёлтым
градиентом, левой полосой и круглым «?» слева. Совпадает по визуалу
с главой 1.
- Шпаргалка: добавлена кнопка «Шпаргалка» в шапке, на узких экранах
(≤980px) col-side превращается в выезжающий справа drawer с
backdrop'ом, открывается по кнопке/закрывается по клику вне или Esc.
- initSidebarToggle() вызывается из init().
Maxim Dolgolyov