diff --git a/backend/scripts/gen_chem8_skeletons.js b/backend/scripts/gen_chem8_skeletons.js new file mode 100644 index 0000000..4088a6b --- /dev/null +++ b/backend/scripts/gen_chem8_skeletons.js @@ -0,0 +1,297 @@ +/* gen_chem8_skeletons.js — генерирует каркасы 7 глав «Химия 8» (Phase 0). + * Запуск: node backend/scripts/gen_chem8_skeletons.js + * Выход: frontend/textbooks/chemistry_8_intro.html, _ch1.html ... _ch6.html + * + * Каркас = валидная брендированная страница: header (водяной знак), hero, + * оглавление § (read-only), баннер «в разработке», ссылка назад в хаб, тема. + * Полный интерактивный SPA-контент каждой главы добавляется в Phase 1–6 + * (файлы перезаписываются), пока скелет обеспечивает навигацию и структуру. + */ +'use strict'; +const fs = require('fs'); +const path = require('path'); + +const OUT = path.join(__dirname, '..', '..', 'frontend', 'textbooks'); + +const P = (t, n) => ({ t, n }); // параграф +const NOTE = (note) => ({ note }); // лаб. опыт / практическая работа + +const CHAPTERS = [ + { + file: 'chemistry_8_intro.html', slug: 'chemistry-8-intro', + kicker: 'Вводный раздел', title: 'Количественные понятия в химии', + range: '§ 1–9', wm: 'mol', + color: { p:'#d97706', d:'#b45309', l:'#fbbf24', soft:'#fef3c7', bgd:'#1c1410', cardd:'#271c14', textd:'#fef3c7' }, + items: [ + P('§ 1', 'Атомы. Химические элементы. Относительная атомная масса'), + P('§ 2', 'Молекулы. Простые и сложные вещества. Химические формулы. Относительная молекулярная масса'), + P('§ 3', 'Химическое количество вещества'), + P('§ 4', 'Моль — единица химического количества вещества. Постоянная Авогадро'), + P('§ 5', 'Молярная масса. Молярный объём газов'), + P('§ 6', 'Вычисление химического количества вещества по его массе и массы вещества по его химическому количеству'), + P('§ 7', 'Вычисление химического количества газа по его объёму и объёма газа по его химическому количеству'), + NOTE('Практическая работа 1. Химическое количество вещества'), + P('§ 8', 'Химические реакции'), + P('§ 9', 'Количественные расчёты по уравнениям химических реакций') + ] + }, + { + file: 'chemistry_8_ch1.html', slug: 'chemistry-8-ch1', + kicker: 'Глава 1', title: 'Важнейшие классы неорганических соединений', + range: '§ 10–23', wm: 'OH', + color: { p:'#0d9488', d:'#0f766e', l:'#14b8a6', soft:'#ccfbf1', bgd:'#0c1a18', cardd:'#102825', textd:'#ccfbf1' }, + items: [ + P('§ 10', 'Оксиды. Состав и классификация оксидов'), + P('§ 11', 'Химические свойства оксидов'), + P('§ 12', 'Получение и применение оксидов'), + P('§ 13', 'Кислоты. Состав и классификация кислот'), + P('§ 14', 'Химические свойства кислот'), + P('§ 15', 'Получение и применение кислот'), + P('§ 16', 'Основания'), + P('§ 17', 'Химические свойства оснований'), + P('§ 18', 'Получение и применение оснований'), + NOTE('Лабораторный опыт 1. Получение нерастворимого основания'), + NOTE('Практическая работа 2. Изучение реакции нейтрализации'), + P('§ 19', 'Соли. Состав и классификация солей'), + P('§ 20', 'Химические свойства солей'), + NOTE('Лабораторный опыт 2. Взаимодействие растворов солей с металлами'), + P('§ 21', 'Получение и применение солей'), + P('§ 22', 'Взаимосвязь между классами основных неорганических веществ'), + NOTE('Практическая работа 3. Решение экспериментальных задач'), + P('§ 23', 'Решение расчётных задач по теме «Основные классы неорганических соединений»') + ] + }, + { + file: 'chemistry_8_ch2.html', slug: 'chemistry-8-ch2', + kicker: 'Глава 2', title: 'Периодический закон и периодическая система химических элементов', + range: '§ 24–28', wm: '№', + color: { p:'#4f46e5', d:'#4338ca', l:'#818cf8', soft:'#e0e7ff', bgd:'#12122b', cardd:'#1b1b3a', textd:'#e0e7ff' }, + items: [ + P('§ 24', 'Систематизация химических элементов'), + P('§ 25', 'Понятие об амфотерности'), + NOTE('Лабораторный опыт 3. Получение гидроксида цинка и изучение его амфотерных свойств'), + P('§ 26', 'Естественные семейства элементов'), + P('§ 27', 'Периодический закон Д. И. Менделеева'), + P('§ 28', 'Периодическая система химических элементов') + ] + }, + { + file: 'chemistry_8_ch3.html', slug: 'chemistry-8-ch3', + kicker: 'Глава 3', title: 'Строение атома и периодичность изменения свойств', + range: '§ 29–35', wm: 'e−', + color: { p:'#2563eb', d:'#1d4ed8', l:'#60a5fa', soft:'#dbeafe', bgd:'#0a1428', cardd:'#102137', textd:'#dbeafe' }, + items: [ + P('§ 29', 'Строение атома. Атомный номер химического элемента'), + P('§ 30', 'Массовое число атома. Нуклиды'), + P('§ 31', 'Изотопы. Явление радиоактивности'), + P('§ 32', 'Состояние электронов в атоме. Электронное облако. Атомная орбиталь'), + P('§ 33', 'Строение электронных оболочек атомов'), + P('§ 34', 'Периодичность изменения свойств атомов химических элементов'), + P('§ 35', 'Характеристика химического элемента по его положению в периодической системе') + ] + }, + { + file: 'chemistry_8_ch4.html', slug: 'chemistry-8-ch4', + kicker: 'Глава 4', title: 'Химическая связь', + range: '§ 36–41', wm: 'H₂O', + color: { p:'#059669', d:'#047857', l:'#34d399', soft:'#d1fae5', bgd:'#0a1a12', cardd:'#10271c', textd:'#d1fae5' }, + items: [ + P('§ 36', 'Природа химической связи'), + P('§ 37', 'Ковалентная связь'), + P('§ 38', 'Неполярная и полярная ковалентная связь. Электроотрицательность'), + NOTE('Лабораторный опыт 4. Составление моделей молекул'), + P('§ 39', 'Ионная связь'), + P('§ 40', 'Металлическая связь. Межмолекулярное взаимодействие'), + P('§ 41', 'Кристаллическое состояние вещества') + ] + }, + { + file: 'chemistry_8_ch5.html', slug: 'chemistry-8-ch5', + kicker: 'Глава 5', title: 'Окислительно-восстановительные реакции', + range: '§ 42–45', wm: 'O₂', + color: { p:'#ea580c', d:'#c2410c', l:'#fb923c', soft:'#ffedd5', bgd:'#1c1208', cardd:'#2a1c10', textd:'#ffedd5' }, + items: [ + P('§ 42', 'Степень окисления'), + P('§ 43', 'Процессы окисления и восстановления'), + P('§ 44', 'Окислительно-восстановительные реакции'), + P('§ 45', 'Окислительно-восстановительные реакции вокруг нас') + ] + }, + { + file: 'chemistry_8_ch6.html', slug: 'chemistry-8-ch6', + kicker: 'Глава 6', title: 'Растворы', + range: '§ 46–52', wm: 'aq', + color: { p:'#0891b2', d:'#0e7490', l:'#22d3ee', soft:'#cffafe', bgd:'#08191c', cardd:'#10282d', textd:'#cffafe' }, + items: [ + P('§ 46', 'Смеси веществ'), + P('§ 47', 'Растворение веществ в воде'), + P('§ 48', 'Характеристики растворимости веществ'), + P('§ 49', 'Качественные характеристики состава растворов'), + P('§ 50', 'Количественные характеристики растворённых веществ. Массовая доля растворённого вещества'), + P('§ 51', 'Молярная концентрация растворённых веществ'), + NOTE('Практическая работа 4. Приготовление раствора с заданной массовой долей и молярной концентрацией'), + P('§ 52', 'Вода и растворы в жизни и деятельности человека') + ] + } +]; + +function esc(s) { + return String(s).replace(/[&<>]/g, c => ({ '&':'&', '<':'<', '>':'>' }[c])); +} + +function outlineHtml(items) { + return items.map(it => { + if (it.note) { + return '
  • ' + + '' + + '' + esc(it.note) + '
  • '; + } + return '
  • ' + esc(it.t) + '' + esc(it.n) + '
  • '; + }).join('\n'); +} + +function pageHtml(ch) { + const c = ch.color; + const wmHeader = ch.kicker.toUpperCase(); + return ` + + + + + + + +Химия 8 · ${esc(ch.kicker)} · «${esc(ch.title)}» + + + + + + + + + + + + +
    +
    + + + К разделам + +
    +
    ${esc(ch.kicker)} · ${esc(ch.range)}
    +

    ${esc(ch.title)}

    +
    +
    + +
    +
    +
    + +
    +
    +
    + +
    +
    +

    Раздел в разработке

    +

    Интерактивное наглядное наполнение этого раздела (теория, модели, симуляторы, тренажёры и боссы) добавляется поэтапно. Ниже — план параграфов раздела согласно учебнику.

    +
    +
    + +
    + + Содержание раздела +
    + +
    + + + + + + + +`; +} + +let count = 0; +for (const ch of CHAPTERS) { + const html = pageHtml(ch); + fs.writeFileSync(path.join(OUT, ch.file), html, 'utf8'); + count++; + console.log('written', ch.file, '(' + ch.items.filter(i => i.t).length + ' §)'); +} +console.log('done:', count, 'chapter skeletons'); diff --git a/backend/src/db/migrations/041_chemistry8_hub.sql b/backend/src/db/migrations/041_chemistry8_hub.sql new file mode 100644 index 0000000..32e448e --- /dev/null +++ b/backend/src/db/migrations/041_chemistry8_hub.sql @@ -0,0 +1,56 @@ +-- Chemistry 8 hub migration. +-- Creates chemistry-8 as a full hub textbook (intro + 6 chapters) in the style of physics-9: +-- chemistry-8 (hub, html_path = chemistry_8_hub.html) +-- chemistry-8-intro (Количественные понятия, §§1–9) → chemistry_8_intro.html +-- chemistry-8-ch1 (Важнейшие классы соединений, §§10–23) → chemistry_8_ch1.html +-- chemistry-8-ch2 (Периодический закон и ПСХЭ, §§24–28) → chemistry_8_ch2.html +-- chemistry-8-ch3 (Строение атома, §§29–35) → chemistry_8_ch3.html +-- chemistry-8-ch4 (Химическая связь, §§36–41) → chemistry_8_ch4.html +-- chemistry-8-ch5 (ОВР, §§42–45) → chemistry_8_ch5.html +-- chemistry-8-ch6 (Растворы, §§46–52) → chemistry_8_ch6.html +-- +-- Source: Шиманович И. Е., Красицкий В. А., Сечко О. И., Хвалюк В. Н., +-- «Химия 8», Народная асвета, 2018. Контент авторский (наш). +-- Author left empty per project policy. + +-- 1. Insert the parent chemistry-8 hub row (does not exist yet in the catalog). +INSERT INTO textbooks + (slug, subject, grade, title, author, description, html_path, para_count, color, sort_order, is_active, parent_slug) +VALUES + ('chemistry-8', 'chemistry', 8, 'Химия — 8 класс', + '', + 'Полный курс химии за 8 класс: количественные понятия (моль, молярная масса и объём, расчёты по уравнениям), важнейшие классы неорганических соединений, периодический закон и строение атома, химическая связь, окислительно-восстановительные реакции, растворы. 7 разделов, 52 параграфа, 4 лабораторных опыта, 4 практические работы.', + 'chemistry_8_hub.html', 52, 'amber', 8, 1, NULL); + +-- 2. Insert the 7 children (intro section + 6 chapters). +INSERT INTO textbooks + (slug, subject, grade, title, author, description, html_path, para_count, color, sort_order, is_active, parent_slug) +VALUES + ('chemistry-8-intro', 'chemistry', 8, 'Химия 8 · Количественные понятия в химии', + '', + '§§1–9: атомы и химические элементы, простые и сложные вещества, химическое количество вещества, моль и постоянная Авогадро, молярная масса и молярный объём газов, расчёты по массе/объёму и по уравнениям реакций. Практическая работа 1.', + 'chemistry_8_intro.html', 9, 'amber', 1, 1, 'chemistry-8'), + ('chemistry-8-ch1', 'chemistry', 8, 'Химия 8 · Важнейшие классы неорганических соединений', + '', + '§§10–23: оксиды, кислоты, основания и соли — состав, классификация, химические свойства, получение и применение; генетическая связь между классами. 2 лабораторных опыта, 2 практические работы.', + 'chemistry_8_ch1.html', 14, 'teal', 2, 1, 'chemistry-8'), + ('chemistry-8-ch2', 'chemistry', 8, 'Химия 8 · Периодический закон и периодическая система', + '', + '§§24–28: систематизация элементов, амфотерность, естественные семейства элементов, периодический закон Д. И. Менделеева и строение периодической системы. Лабораторный опыт 3.', + 'chemistry_8_ch2.html', 5, 'indigo', 3, 1, 'chemistry-8'), + ('chemistry-8-ch3', 'chemistry', 8, 'Химия 8 · Строение атома', + '', + '§§29–35: строение атома и атомный номер, массовое число и нуклиды, изотопы и радиоактивность, электронное облако и атомная орбиталь, строение электронных оболочек, периодичность свойств, характеристика элемента по положению в ПС.', + 'chemistry_8_ch3.html', 7, 'blue', 4, 1, 'chemistry-8'), + ('chemistry-8-ch4', 'chemistry', 8, 'Химия 8 · Химическая связь', + '', + '§§36–41: природа химической связи, ковалентная связь (неполярная и полярная, электроотрицательность), ионная и металлическая связь, межмолекулярное взаимодействие, кристаллическое состояние вещества. Лабораторный опыт 4.', + 'chemistry_8_ch4.html', 6, 'green', 5, 1, 'chemistry-8'), + ('chemistry-8-ch5', 'chemistry', 8, 'Химия 8 · Окислительно-восстановительные реакции', + '', + '§§42–45: степень окисления, процессы окисления и восстановления, окислительно-восстановительные реакции и метод электронного баланса, ОВР вокруг нас.', + 'chemistry_8_ch5.html', 4, 'orange', 6, 1, 'chemistry-8'), + ('chemistry-8-ch6', 'chemistry', 8, 'Химия 8 · Растворы', + '', + '§§46–52: смеси веществ, растворение веществ в воде, характеристики растворимости, качественные и количественные характеристики состава растворов, массовая доля и молярная концентрация, вода и растворы в жизни человека. Практическая работа 4.', + 'chemistry_8_ch6.html', 7, 'cyan', 7, 1, 'chemistry-8'); diff --git a/backend/tests/chemistry8.test.js b/backend/tests/chemistry8.test.js new file mode 100644 index 0000000..ab21428 --- /dev/null +++ b/backend/tests/chemistry8.test.js @@ -0,0 +1,102 @@ +'use strict'; +/* + * Phase 0 тесты учебника «Химия 8» (hub + 7 глав). + * 1. Чистые примитивы frontend/js/chem8_svg.js (window.Chem8): formula/ionLabel/chemEq. + * 2. Целостность каркаса: хаб + 7 файлов глав существуют, slug'и согласованы, + * сумма параграфов = 52, миграция 041 содержит родителя + 7 детей. + */ +const test = require('node:test'); +const assert = require('node:assert'); +const fs = require('node:fs'); +const path = require('node:path'); + +const ROOT = path.join(__dirname, '..', '..'); +const TB = path.join(ROOT, 'frontend', 'textbooks'); + +// --- shim browser global, load the frontend module --- +global.window = global; +require(path.join(ROOT, 'frontend', 'js', 'chem8_svg.js')); +const C = global.Chem8; + +test('Chem8.formula — числовые индексы в подстрочные', () => { + assert.equal(C.formula('CaCO3'), 'CaCO₃'); + assert.equal(C.formula('H2O'), 'H₂O'); + assert.equal(C.formula('Al2(SO4)3'), 'Al₂(SO₄)₃'); + assert.equal(C.formula('NaCl'), 'NaCl'); +}); + +test('Chem8.ionLabel — заряд ионов надстрочным', () => { + assert.equal(C.ionLabel('Na', 1), 'Na⁺'); + assert.equal(C.ionLabel('Ca', 2), 'Ca²⁺'); + assert.equal(C.ionLabel('Cl', -1), 'Cl⁻'); + assert.equal(C.ionLabel('SO4', -2), 'SO₄²⁻'); + assert.equal(C.ionLabel('Fe', 3), 'Fe³⁺'); + assert.equal(C.ionLabel('Na', 0), 'Na'); +}); + +test('Chem8.chemEq — стрелка, индексы, газ', () => { + const html = C.chemEq('2Na + 2H2O -> 2NaOH + H2^'); + assert.ok(html.includes('2H₂O'), 'индексы воды'); + assert.ok(html.includes('→'), 'стрелка реакции'); + assert.ok(html.includes('H₂↑'), 'значок газа'); + assert.ok(html.includes('class="ceq"'), 'обёртка'); +}); + +test('Chem8.chemEq — обратимая реакция и осадок', () => { + const rev = C.chemEq('N2 + 3H2 <-> 2NH3'); + assert.ok(rev.includes('⇌'), 'обратимая стрелка'); + const prec = C.chemEq('AgNO3 + NaCl -> AgClv + NaNO3'); + assert.ok(prec.includes('AgCl↓'), 'значок осадка'); +}); + +test('Chem8 — заглушки возвращают null и не падают', () => { + for (const fn of ['testTube', 'moleTriangle', 'solubilityTable', 'oxStateCalc', 'geneticMap']) { + assert.equal(typeof C[fn], 'function', fn + ' определён'); + assert.equal(C[fn]({}), null, fn + ' заглушка возвращает null'); + } +}); + +// --- каркас страниц --- +const CHILDREN = [ + { slug: 'chemistry-8-intro', file: 'chemistry_8_intro.html', paras: 9 }, + { slug: 'chemistry-8-ch1', file: 'chemistry_8_ch1.html', paras: 14 }, + { slug: 'chemistry-8-ch2', file: 'chemistry_8_ch2.html', paras: 5 }, + { slug: 'chemistry-8-ch3', file: 'chemistry_8_ch3.html', paras: 7 }, + { slug: 'chemistry-8-ch4', file: 'chemistry_8_ch4.html', paras: 6 }, + { slug: 'chemistry-8-ch5', file: 'chemistry_8_ch5.html', paras: 4 }, + { slug: 'chemistry-8-ch6', file: 'chemistry_8_ch6.html', paras: 7 } +]; + +test('сумма параграфов глав = 52', () => { + assert.equal(CHILDREN.reduce((a, c) => a + c.paras, 0), 52); +}); + +test('хаб chemistry_8_hub.html существует и ссылается на все 7 глав', () => { + const hub = fs.readFileSync(path.join(TB, 'chemistry_8_hub.html'), 'utf8'); + assert.ok(hub.includes('var TOTAL = 52'), 'TOTAL=52'); + for (const ch of CHILDREN) { + assert.ok(hub.includes('/textbook/' + ch.slug), 'ссылка на ' + ch.slug); + } + assert.ok(hub.includes('/api/textbooks/chemistry-8/children'), 'грузит детей'); +}); + +test('каждая глава существует и задаёт свой _TB_SLUG', () => { + for (const ch of CHILDREN) { + const html = fs.readFileSync(path.join(TB, ch.file), 'utf8'); + assert.ok(html.includes("const _TB_SLUG = '" + ch.slug + "'"), ch.file + ' slug'); + assert.ok(html.includes('/textbook/chemistry-8"'), ch.file + ' ссылка назад в хаб'); + assert.ok(html.includes('/js/chem8_svg.js'), ch.file + ' подключает chem8_svg'); + assert.ok(html.includes('/js/biochem-core.js'), ch.file + ' подключает biochem-core'); + } +}); + +test('миграция 041 — родитель chemistry-8 + 7 детей, нет эмоджи', () => { + const sql = fs.readFileSync( + path.join(ROOT, 'backend', 'src', 'db', 'migrations', '041_chemistry8_hub.sql'), 'utf8'); + assert.ok(/'chemistry-8'.*NULL/s.test(sql) || sql.includes("'chemistry-8', 'chemistry', 8"), 'родитель'); + for (const ch of CHILDREN) { + assert.ok(sql.includes("'" + ch.slug + "'"), 'дитя ' + ch.slug); + } + // запрет эмоджи (правило проекта) + assert.ok(!/[\u{1F000}-\u{1FAFF}\u{2600}-\u{27BF}]/u.test(sql), 'без эмоджи'); +}); diff --git a/frontend/js/chem8_svg.js b/frontend/js/chem8_svg.js new file mode 100644 index 0000000..3f544f2 --- /dev/null +++ b/frontend/js/chem8_svg.js @@ -0,0 +1,139 @@ +/* chem8_svg.js — химические наглядные примитивы для учебника «Химия 8». + * + * Неймспейс: window.Chem8.* + * Молекулярные модели (структурные / шаростержневые / 3D) — НЕ здесь, а через + * biochem-core.js (window.BioChem). Здесь только то, чего там нет: рендер формул и + * уравнений, ионы, степени окисления, интерактивные виджеты (растворимость, ряд + * активности, индикаторы, классификаторы, калькуляторы расчётов и т. п.). + * + * Phase 0: реализованы чистые текстовые примитивы (ionLabel, chemEq, formula). + * Остальные хелперы — каркасы-заглушки, наполняются по фазам (см. PLAN_CHEMISTRY_8.md, разд. B). + * + * Правила (CLAUDE.md / план): + * - без эмоджи, только inline SVG .ic; + * - в KaTeX-шаблонах двойной backslash (\\to, \\downarrow, \\rightleftharpoons); + * - drag/слайдеры: window-listeners + state ВЫШЕ redraw(), без setPointerCapture. + */ +(function (global) { + 'use strict'; + + var SUB = { '0':'₀','1':'₁','2':'₂','3':'₃','4':'₄', + '5':'₅','6':'₆','7':'₇','8':'₈','9':'₉' }; + var SUP = { '0':'⁰','1':'¹','2':'²','3':'³','4':'⁴', + '5':'⁵','6':'⁶','7':'⁷','8':'⁸','9':'⁹', + '+':'⁺','-':'⁻' }; + + function toSub(digits) { + return String(digits).replace(/[0-9]/g, function (d) { return SUB[d]; }); + } + function toSup(s) { + return String(s).replace(/[0-9+\-]/g, function (c) { return SUP[c] || c; }); + } + + /* formula('CaCO3') -> 'CaCO₃' : числовые индексы атомов в подстрочные. + Не трогает множители-коэффициенты в начале (их рендерит chemEq). */ + function formula(src) { + if (src == null) return ''; + return String(src).replace(/([A-Za-z\)\]])(\d+)/g, function (_, a, n) { + return a + toSub(n); + }); + } + + /* ionLabel('SO4', -2) -> 'SO₄²⁻' ; ionLabel('Ca', 2) -> 'Ca²⁺' ; ionLabel('Na', 1) -> 'Na⁺' */ + function ionLabel(form, charge) { + var body = formula(form); + var c = Number(charge) || 0; + if (c === 0) return body; + var mag = Math.abs(c); + var sign = c > 0 ? '+' : '-'; + var num = mag === 1 ? '' : String(mag); + return body + toSup(num + sign); + } + + /* chemEq('2Na + 2H2O -> 2NaOH + H2^', {arrow:'->'}) -> HTML-строка с индексами, + стрелками (= → ⇌), значками газа (↑) и осадка (↓), условием над стрелкой. + Токены: '->'/'=' необратимая, '<->'/'<=>' обратимая, '^' газ, 'v' осадок. + opts.cond — подпись над стрелкой (например 't', 'кат.', 'эл. ток'). */ + function chemEq(src, opts) { + opts = opts || {}; + var s = String(src == null ? '' : src).trim(); + var arrowHtml = ' ' + arrowGlyph(s, opts) + condHtml(opts) + ' '; + // выделяем стрелку + var parts = s.split(/<->|<=>|->|⇌|=(?![^(]*\))|→/); + var left = parts[0] || ''; + var right = parts.length > 1 ? parts.slice(1).join(' ') : ''; + var html = renderSide(left); + if (right) html += arrowHtml + renderSide(right); + return '' + html + ''; + } + + function arrowGlyph(s, opts) { + if (opts.arrow === '<->' || opts.arrow === '<=>' || /<->|<=>|⇌/.test(s)) return '⇌'; + return '→'; // → + } + function condHtml(opts) { + if (!opts.cond) return ''; + return '' + escapeHtml(opts.cond) + ''; + } + + /* одна сторона уравнения: разбор на вещества по '+', значки ↑/↓ */ + function renderSide(side) { + return side.split('+').map(function (term) { + var t = term.trim(); + if (!t) return ''; + var gas = false, prec = false; + t = t.replace(/\^|↑/g, function () { gas = true; return ''; }) + .replace(/(^|[A-Za-z0-9\)])v(\b|$)|↓/g, function (m) { + prec = true; return m.replace(/v|↓/, ''); + }); + // коэффициент в начале + var coef = ''; + t = t.replace(/^(\d+)/, function (_, n) { coef = n; return ''; }); + var out = (coef ? coef : '') + formula(t.trim()); + if (gas) out += '↑'; + if (prec) out += '↓'; + return out; + }).filter(Boolean).join(' + '); + } + + function escapeHtml(s) { + return String(s).replace(/[&<>"']/g, function (c) { + return { '&':'&','<':'<','>':'>','"':'"',"'":''' }[c]; + }); + } + + /* ---- Каркасы-заглушки интерактивных виджетов (реализуются по фазам) ---- */ + function notImplemented(name) { + return function () { + if (global.console && console.warn) { + console.warn('[Chem8] ' + name + ' ещё не реализован (Phase 0 заглушка)'); + } + return null; + }; + } + + var Chem8 = { + // готово (Phase 0) + formula: formula, + ionLabel: ionLabel, + chemEq: chemEq, + toSub: toSub, + toSup: toSup, + // заглушки (см. план, разд. B) — наполняются в Phase 1–6 + testTube: notImplemented('testTube'), // §18,25 — пробирка: осадок/газ/окраска + moleTriangle: notImplemented('moleTriangle'), // §6 — треугольник n–m–M + equationBalancer: notImplemented('equationBalancer'),// §8 — балансировщик уравнений + oxStateCalc: notImplemented('oxStateCalc'), // §42 — калькулятор степени окисления + redoxBalancer: notImplemented('redoxBalancer'), // §44 — e-баланс ОВР + orbitalDiagram: notImplemented('orbitalDiagram'), // §33 — орбитальная диаграмма + solubilityTable: notImplemented('solubilityTable'), // §19,20,48 — таблица растворимости + activitySeries: notImplemented('activitySeries'), // §14,20 — ряд активности металлов + miniPeriodic: notImplemented('miniPeriodic'), // §1,26,34 — мини-ПСХЭ с подсветкой + indicatorScale: notImplemented('indicatorScale'), // §13,14,16,17 — индикатор + шкала pH + dissociationAnim: notImplemented('dissociationAnim'),// §47 — анимация растворения + classifier: notImplemented('classifier'), // §10,13,16,19,46 — DnD-классификатор + geneticMap: notImplemented('geneticMap') // §22 — генетическая карта-граф классов + }; + + global.Chem8 = Chem8; +})(typeof window !== 'undefined' ? window : this); diff --git a/frontend/textbooks/chemistry_8_ch1.html b/frontend/textbooks/chemistry_8_ch1.html new file mode 100644 index 0000000..3ab5580 --- /dev/null +++ b/frontend/textbooks/chemistry_8_ch1.html @@ -0,0 +1,148 @@ + + + + + + + + +Химия 8 · Глава 1 · «Важнейшие классы неорганических соединений» + + + + + + + + + + + + +
    +
    + + + К разделам + +
    +
    Глава 1 · § 10–23
    +

    Важнейшие классы неорганических соединений

    +
    +
    + +
    +
    +
    + +
    +
    +
    + +
    +
    +

    Раздел в разработке

    +

    Интерактивное наглядное наполнение этого раздела (теория, модели, симуляторы, тренажёры и боссы) добавляется поэтапно. Ниже — план параграфов раздела согласно учебнику.

    +
    +
    + +
    + + Содержание раздела +
    + +
    + + + + + + + diff --git a/frontend/textbooks/chemistry_8_ch2.html b/frontend/textbooks/chemistry_8_ch2.html new file mode 100644 index 0000000..c979a76 --- /dev/null +++ b/frontend/textbooks/chemistry_8_ch2.html @@ -0,0 +1,136 @@ + + + + + + + + +Химия 8 · Глава 2 · «Периодический закон и периодическая система химических элементов» + + + + + + + + + + + + +
    +
    + + + К разделам + +
    +
    Глава 2 · § 24–28
    +

    Периодический закон и периодическая система химических элементов

    +
    +
    + +
    +
    +
    + +
    +
    +
    + +
    +
    +

    Раздел в разработке

    +

    Интерактивное наглядное наполнение этого раздела (теория, модели, симуляторы, тренажёры и боссы) добавляется поэтапно. Ниже — план параграфов раздела согласно учебнику.

    +
    +
    + +
    + + Содержание раздела +
    + +
    + + + + + + + diff --git a/frontend/textbooks/chemistry_8_ch3.html b/frontend/textbooks/chemistry_8_ch3.html new file mode 100644 index 0000000..03c8f07 --- /dev/null +++ b/frontend/textbooks/chemistry_8_ch3.html @@ -0,0 +1,137 @@ + + + + + + + + +Химия 8 · Глава 3 · «Строение атома и периодичность изменения свойств» + + + + + + + + + + + + +
    +
    + + + К разделам + +
    +
    Глава 3 · § 29–35
    +

    Строение атома и периодичность изменения свойств

    +
    +
    + +
    +
    +
    + +
    +
    +
    + +
    +
    +

    Раздел в разработке

    +

    Интерактивное наглядное наполнение этого раздела (теория, модели, симуляторы, тренажёры и боссы) добавляется поэтапно. Ниже — план параграфов раздела согласно учебнику.

    +
    +
    + +
    + + Содержание раздела +
    + +
    + + + + + + + diff --git a/frontend/textbooks/chemistry_8_ch4.html b/frontend/textbooks/chemistry_8_ch4.html new file mode 100644 index 0000000..dc242c9 --- /dev/null +++ b/frontend/textbooks/chemistry_8_ch4.html @@ -0,0 +1,137 @@ + + + + + + + + +Химия 8 · Глава 4 · «Химическая связь» + + + + + + + + + + + + +
    +
    + + + К разделам + +
    +
    Глава 4 · § 36–41
    +

    Химическая связь

    +
    +
    + +
    +
    +
    + +
    +
    +
    + +
    +
    +

    Раздел в разработке

    +

    Интерактивное наглядное наполнение этого раздела (теория, модели, симуляторы, тренажёры и боссы) добавляется поэтапно. Ниже — план параграфов раздела согласно учебнику.

    +
    +
    + +
    + + Содержание раздела +
    + +
    + + + + + + + diff --git a/frontend/textbooks/chemistry_8_ch5.html b/frontend/textbooks/chemistry_8_ch5.html new file mode 100644 index 0000000..2adbfcd --- /dev/null +++ b/frontend/textbooks/chemistry_8_ch5.html @@ -0,0 +1,134 @@ + + + + + + + + +Химия 8 · Глава 5 · «Окислительно-восстановительные реакции» + + + + + + + + + + + + +
    +
    + + + К разделам + +
    +
    Глава 5 · § 42–45
    +

    Окислительно-восстановительные реакции

    +
    +
    + +
    +
    +
    + +
    +
    +
    + +
    +
    +

    Раздел в разработке

    +

    Интерактивное наглядное наполнение этого раздела (теория, модели, симуляторы, тренажёры и боссы) добавляется поэтапно. Ниже — план параграфов раздела согласно учебнику.

    +
    +
    + +
    + + Содержание раздела +
    + +
    + + + + + + + diff --git a/frontend/textbooks/chemistry_8_ch6.html b/frontend/textbooks/chemistry_8_ch6.html new file mode 100644 index 0000000..f533c23 --- /dev/null +++ b/frontend/textbooks/chemistry_8_ch6.html @@ -0,0 +1,138 @@ + + + + + + + + +Химия 8 · Глава 6 · «Растворы» + + + + + + + + + + + + +
    +
    + + + К разделам + +
    +
    Глава 6 · § 46–52
    +

    Растворы

    +
    +
    + +
    +
    +
    + +
    +
    +
    + +
    +
    +

    Раздел в разработке

    +

    Интерактивное наглядное наполнение этого раздела (теория, модели, симуляторы, тренажёры и боссы) добавляется поэтапно. Ниже — план параграфов раздела согласно учебнику.

    +
    +
    + +
    + + Содержание раздела +
    + +
    + + + + + + + diff --git a/frontend/textbooks/chemistry_8_hub.html b/frontend/textbooks/chemistry_8_hub.html new file mode 100644 index 0000000..42dff6f --- /dev/null +++ b/frontend/textbooks/chemistry_8_hub.html @@ -0,0 +1,473 @@ + + + + + + + + +Химия 8 класс — учебник + + + + + + + + + + +
    +
    +
    + + + К каталогу + +
    +
    +

    Химия — 8 класс

    +
    Количественные понятия, классы соединений, периодический закон, строение атома, химическая связь, ОВР, растворы. 7 разделов, 52 параграфа.
    +
    +
    + +
    +
    +
    + +
    + +
    +
    Х
    +
    +
    Общий прогресс по курсу
    +
    Загрузка...
    +
    +
    + +
    + +
    + + +
    +
    mol
    +
    Вводный раздел
    +
    Количественные понятия в химии
    +
    §1–§9 · ПР 1
    +
    +
    +
    Атомы и элементы, простые и сложные вещества, химическое количество вещества, моль и постоянная Авогадро, молярная масса и объём газов, расчёты по массе, объёму и уравнениям реакций.
    +
    +
    Прогресс0%
    +
    +
    +
    Открыть раздел
    +
    +
    + + +
    +
    OH−
    +
    Глава 1
    +
    Важнейшие классы неорганических соединений
    +
    §10–§23 · 2 лаб · ПР 2,3
    +
    +
    +
    Оксиды, кислоты, основания и соли: состав, классификация, химические свойства, получение и применение; генетическая связь между классами неорганических веществ.
    +
    +
    Прогресс0%
    +
    +
    +
    Открыть главу
    +
    +
    + + +
    +
    +
    Глава 2
    +
    Периодический закон и периодическая система
    +
    §24–§28 · 1 лаб
    +
    +
    +
    Систематизация элементов, амфотерность, естественные семейства элементов, периодический закон Д. И. Менделеева и строение периодической системы.
    +
    +
    Прогресс0%
    +
    +
    +
    Открыть главу
    +
    +
    + + +
    +
    e−
    +
    Глава 3
    +
    Строение атома
    +
    §29–§35
    +
    +
    +
    Строение атома и атомный номер, массовое число и нуклиды, изотопы и радиоактивность, электронное облако и орбиталь, электронные оболочки, периодичность свойств.
    +
    +
    Прогресс0%
    +
    +
    +
    Открыть главу
    +
    +
    + + +
    +
    H₂O
    +
    Глава 4
    +
    Химическая связь
    +
    §36–§41 · 1 лаб
    +
    +
    +
    Природа химической связи, ковалентная связь (неполярная и полярная, электроотрицательность), ионная и металлическая связь, межмолекулярное взаимодействие, кристаллические решётки.
    +
    +
    Прогресс0%
    +
    +
    +
    Открыть главу
    +
    +
    + + +
    +
    O₂
    +
    Глава 5
    +
    Окислительно-восстановительные реакции
    +
    §42–§45
    +
    +
    +
    Степень окисления, процессы окисления и восстановления, окислительно-восстановительные реакции и метод электронного баланса, ОВР вокруг нас.
    +
    +
    Прогресс0%
    +
    +
    +
    Открыть главу
    +
    +
    + + +
    +
    aq
    +
    Глава 6
    +
    Растворы
    +
    §46–§52 · ПР 4
    +
    +
    +
    Смеси веществ, растворение в воде, характеристики растворимости, качественные и количественные характеристики состава растворов, массовая доля и молярная концентрация, вода в жизни человека.
    +
    +
    Прогресс0%
    +
    +
    +
    Открыть главу
    +
    +
    + +
    + +
    + +
    +
    +

    Финал курса появится позже

    +

    Итоговая шпаргалка по всем разделам и интегрированные боссы добавляются на завершающем этапе разработки учебника (Phase 7). Пока проходи разделы по порядку — прогресс сохраняется автоматически.

    +
    +
    +
    + +
    +
    + +
    +
    +
    Химик 8 класса
    +
    Изучите все 52 параграфа курса, чтобы получить достижение.
    +
    +
    + +
    + + + + + + + diff --git a/frontend/textbooks/chemistry_8_intro.html b/frontend/textbooks/chemistry_8_intro.html new file mode 100644 index 0000000..be31a0d --- /dev/null +++ b/frontend/textbooks/chemistry_8_intro.html @@ -0,0 +1,140 @@ + + + + + + + + +Химия 8 · Вводный раздел · «Количественные понятия в химии» + + + + + + + + + + + + +
    +
    + + + К разделам + +
    +
    Вводный раздел · § 1–9
    +

    Количественные понятия в химии

    +
    +
    + +
    +
    +
    + +
    +
    +
    + +
    +
    +

    Раздел в разработке

    +

    Интерактивное наглядное наполнение этого раздела (теория, модели, симуляторы, тренажёры и боссы) добавляется поэтапно. Ниже — план параграфов раздела согласно учебнику.

    +
    +
    + +
    + + Содержание раздела +
    + +
    + + + + + + + diff --git a/plans/textbooks-8/PLAN_CHEMISTRY_8.md b/plans/textbooks-8/PLAN_CHEMISTRY_8.md new file mode 100644 index 0000000..c4b91ae --- /dev/null +++ b/plans/textbooks-8/PLAN_CHEMISTRY_8.md @@ -0,0 +1,417 @@ +# План реализации: Химия 8 (Беларусь) — интерактивный наглядный учебник + +> Цель: создать **с нуля** интерактивный наглядный учебник по всей программе 8 класса +> в **современной архитектуре hub + главы** (как Физика 7–11 / Алгебра / Геометрия — +> НЕ как легаси-монолит `chemistry_9.html`), на уровне их качества, с поправкой на +> содержание 8 класса: **количественные понятия (моль, M, Vm, расчёты по уравнениям), +> классы неорганических соединений, периодический закон, строение атома, химическая +> связь, ОВР, растворы.** +> +> **Архитектура (утверждена):** `chemistry_8_hub.html` (хаб-каталог глав) + **7 файлов глав** +> (вводный раздел + 6 глав книги). В БД — родитель `chemistry-8` + 7 детей с `parent_slug`. +> Каждая глава — самостоятельная страница со своими § (см. карту ниже), модульный +> CSS/JS на предмет. Единый стандарт с планом Химии 9 ([[plans/textbooks-9/PLAN_CHEMISTRY_9.md]]). + +--- + +## 🎯 Источник + +| Параметр | Значение | +|----------|----------| +| Книга | `himiya_8kl_shimanovich_rus_2018 (1).pdf` | +| Авторы | Шиманович И. Е., Красицкий В. А., Сечко О. И., Хвалюк В. Н. | +| Изд. | Минск, «Народная асвета», 2018, 243 с. (тираж 116 000) | +| Структура | **Вводный раздел + 6 глав, 52 §, 4 лабораторных опыта, 4 практические работы** | +| Справочные таблицы | ПСХЭ Менделеева, таблица растворимости, ряд активности металлов (форзацы) | + +PDF лежит в `G:\Dev\Тесты\Методички\тест_6 класс\Книги\`. Оглавление — стр. 238–239 PDF. + +> **Важные отличия от Химии 9:** +> 1. Страниц химии-8 **ещё нет** — строим с нуля. Каркас берём у **современных hub-учебников** +> (`physics_9_hub.html` + `physics_9_chN.html`), а НЕ у легаси-монолита `chemistry_9.html`. +> 2. Описательной химии металлов/неметаллов в 8 классе **нет** (это 9 класс) — акцент на +> количественные расчёты, классификацию веществ, строение атома и химическую связь, ОВР. +> +> **Соответствие «раздел книги → файл главы → slug»:** +> +> | Раздел книги | § | Файл | slug | Цвет | +> |---|---|---|---|---| +> | Вводный: Количественные понятия | 1–9 | `chemistry_8_intro.html` | `chemistry-8-intro` | amber | +> | Гл.1 Классы неорг. соединений | 10–23 | `chemistry_8_ch1.html` | `chemistry-8-ch1` | teal | +> | Гл.2 Периодический закон и ПСХЭ | 24–28 | `chemistry_8_ch2.html` | `chemistry-8-ch2` | indigo | +> | Гл.3 Строение атома | 29–35 | `chemistry_8_ch3.html` | `chemistry-8-ch3` | blue | +> | Гл.4 Химическая связь | 36–41 | `chemistry_8_ch4.html` | `chemistry-8-ch4` | green | +> | Гл.5 ОВР | 42–45 | `chemistry_8_ch5.html` | `chemistry-8-ch5` | deep-orange | +> | Гл.6 Растворы | 46–52 | `chemistry_8_ch6.html` | `chemistry-8-ch6` | cyan | +> +> Хаб: `chemistry_8_hub.html` / slug `chemistry-8` (родитель в каталоге). + +--- + +## 📗 ПОЛНАЯ КАРТА СОДЕРЖАНИЯ (52 §) + +Колонка **«Интерактив»** — главный наглядный элемент сверх текста (минимум 1 «звёздный» +виджет на §; полный набор — в стандарте ниже). + +### ВВОДНЫЙ РАЗДЕЛ. Повторение курса 7 класса. Количественные понятия в химии (§§1–9) — *amber* +| § | Тема | Ключ | Интерактив (звёздный виджет) | +|---|------|------|------------------------------| +| §1 | Атомы. Химические элементы. Относительная атомная масса | $Z$, символ, $A_r$ | **miniPeriodic** + поиск $A_r$ по элементу; модель атома | +| §2 | Молекулы. Простые/сложные вещества. Химические формулы. $M_r$ | формула, индексы, $M_r=\sum A_r$ | **Конструктор формул** + калькулятор $M_r$ (biochem-core) | +| §3 | Химическое количество вещества | понятие «порция», $n$ | Визуализация «порции вещества» (частицы → моль) | +| §4 | Моль — единица количества вещества. Постоянная Авогадро | $N=n\cdot N_A$, $N_A=6{,}02\cdot10^{23}$ | **Счётчик частиц** $N\leftrightarrow n$, масштаб $N_A$ | +| §5 | Молярная масса. Молярный объём газов | $M$ (г/моль), $V_m=22{,}4$ л/моль (н.у.) | Калькулятор $M$ + газовая модель ($V_m$) | +| §6 | Вычисление $n$ по $m$ и $m$ по $n$ | $n=\dfrac{m}{M}$ | **Треугольник $n$–$m$–$M$** (интерактивный калькулятор-тренажёр) | +| §7 | Вычисление $n$ газа по $V$ и $V$ по $n$ | $n=\dfrac{V}{V_m}$ | Калькулятор $V=n\cdot V_m$ + связка $m$–$n$–$V$–$N$ | +| §8 | Химические реакции | признаки, закон сохранения массы, балансировка | **Балансировщик уравнений** (анимация коэффициентов) + классификатор типов реакций | +| §9 | Количественные расчёты по уравнениям реакций | стехиометрия, мольные отношения | **sim `stoichiometry`** + пошаговый решатель «дано → по уравнению» | + +**Практическая работа 1** (после §7): «Химическое количество вещества». + +### ГЛАВА 1. Важнейшие классы неорганических соединений (§§10–23) — *teal/cyan* +| § | Тема | Ключ | Интерактив | +|---|------|------|------------| +| §10 | Оксиды. Состав и классификация | $Э_xO_y$; осн./кисл./амфот./несолеобр. | **Классификатор оксидов** (drag формулы → класс) + конструктор формул оксидов по валентности | +| §11 | Химические свойства оксидов | осн.оксид+кислота/вода; кисл.оксид+щёлочь/вода | **Матрица реакций оксидов** (`chemEq`, признаки) | +| §12 | Получение и применение оксидов | горение, разложение; применение | Схемы получения + инфографика применения | +| §13 | Кислоты. Состав и классификация | $H_xAc$; бескисл./кислородсод., основность | **Классификатор кислот** + `indicatorScale` (лакмус/метилоранж) | +| §14 | Химические свойства кислот | + Me (ряд активности), + осн.оксид, + основание, + соль | **Реакции кислот** (4 типа) + ряд активности + `indicatorScale` | +| §15 | Получение и применение кислот | кисл.оксид+вода, соль+кислота | Схемы получения + инфографика | +| §16 | Основания | $Me(OH)_n$; щёлочи/нерастворимые | Конструктор $Me(OH)_n$ + `indicatorScale` (фенолфталеин малиновый) | +| §17 | Химические свойства оснований | нейтрализация, +кисл.оксид, +соль, разложение | **Реакция нейтрализации** (анимация) + `indicatorScale` | +| §18 | Получение и применение оснований | Me+вода, щёлочь+соль | Схемы; **Лаб.1**: получение нерастворимого основания (`testTube` $Cu(OH)_2$↓ голубой) | +| §19 | Соли. Состав и классификация | катион×анион; средние/кислые/основные | **Конструктор солей** (катион×анион) + `solubilityTable` | +| §20 | Химические свойства солей | РИО (↓↑), соль+Me (ряд активности) | `solubilityTable` + предсказатель РИО; **Лаб.2**: соли+металлы | +| §21 | Получение и применение солей | 8+ способов получения | **Матрица способов получения солей** | +| §22 | Взаимосвязь между классами неорг. веществ | генетическая связь Me/неMe → оксид → гидроксид → соль | **Генетическая карта-граф** (интерактивные переходы) | +| §23 | Решение расчётных задач по теме | расчёты по классам, по уравнениям | **sim `stoichiometry`** + тренажёр расчётов | + +**Лаб. опыт 1** (после §18): получение нерастворимого основания. +**Практическая работа 2** (после §18): изучение реакции нейтрализации. +**Лаб. опыт 2** (после §20): взаимодействие растворов солей с металлами. +**Практическая работа 3** (после §22): решение экспериментальных задач. + +### ГЛАВА 2. Периодический закон и периодическая система (§§24–28) — *indigo/violet* +| § | Тема | Ключ | Интерактив | +|---|------|------|------------| +| §24 | Систематизация химических элементов | ранние классификации, металлы/неметаллы | Сортировщик элементов (Me/неMe/амфот.) | +| §25 | Понятие об амфотерности | $Zn(OH)_2, Al(OH)_3$ + кислота **и** + щёлочь | **Амфотерность** (`testTube`, обе реакции); **Лаб.3**: гидроксид цинка | +| §26 | Естественные семейства элементов | щелочные, ЩЗМ, галогены, инертные | **miniPeriodic** — подсветка семейств, тренды свойств | +| §27 | Периодический закон Д. И. Менделеева | формулировка, периодичность | **Демонстрация периодичности** (карточки-раскладка элементов) | +| §28 | Периодическая система химических элементов | период/группа/подгруппа, структура | **Интерактивная ПСХЭ** (sim `periodic`) + разбор структуры | + +**Лаб. опыт 3** (после §25): получение гидроксида цинка и изучение амфотерных свойств. + +### ГЛАВА 3. Строение атома и периодичность свойств (§§29–35) — *blue* +| § | Тема | Ключ | Интерактив | +|---|------|------|------------| +| §29 | Строение атома. Атомный номер | ядро ($p^+,n^0$) + $e^-$, $Z$ | **Модель атома** (sim `bohratom`) — сборка по $Z$ | +| §30 | Массовое число атома. Нуклиды | $A=Z+N$, нуклид | Калькулятор $A=Z+N$ + конструктор нуклида | +| §31 | Изотопы. Явление радиоактивности | одинаковый $Z$, разный $N$; распад | Изотопы-конструктор + sim `radioactive` + расчёт $A_r$ по изотопам | +| §32 | Состояние электронов. Электронное облако. Орбиталь | $s,p,d$ орбитали, форма облака | **3D-облака орбиталей** (sim `orbitals`) | +| §33 | Строение электронных оболочек атомов | уровни, $2n^2$, конфигурация | **Конструктор электронной конфигурации** (`orbitalDiagram`, заполнение) | +| §34 | Периодичность изменения свойств атомов | радиус, ЭО, металличность по периоду/группе | **Графики трендов** (slider период/группа → свойство) | +| §35 | Характеристика элемента по положению в ПС | алгоритм «паспорта» элемента | **Генератор «паспорта элемента»** (пошагово) | + +### ГЛАВА 4. Химическая связь (§§36–41) — *green* +| § | Тема | Ключ | Интерактив | +|---|------|------|------------| +| §36 | Природа химической связи | октет, энергия связи, устойчивость | Анимация «почему атомы соединяются» | +| §37 | Ковалентная связь | общие электронные пары, схемы Льюиса | **Конструктор e-пар** + структурные формулы (biochem-core) | +| §38 | Неполярная и полярная ков. связь. ЭО | $\Delta$ЭО → полярность, диполь | **Slider ЭО → тип связи** + диполь; **Лаб.4**: модели молекул (biochem-core 3D) | +| §39 | Ионная связь | передача $e^-$, ионная решётка | **Анимация $Na\to Cl$** + решётка $NaCl$ | +| §40 | Металлическая связь. Межмолекулярное взаимодействие | «электронный газ», водородная связь | **Модель электронного газа** + водородная связь | +| §41 | Кристаллическое состояние вещества | 4 типа решёток → свойства | **4 типа решёток** (3D) + связь «тип → свойства» | + +**Лаб. опыт 4** (после §38): составление моделей молекул. + +### ГЛАВА 5. Окислительно-восстановительные реакции (§§42–45) — *deep-orange* +| § | Тема | Ключ | Интерактив | +|---|------|------|------------| +| §42 | Степень окисления | правила, расчёт по формуле | **Калькулятор степени окисления** (любая формула) | +| §43 | Процессы окисления и восстановления | отдача/приём $e^-$, окислитель/восстановитель | Визуализация переноса $e^-$ | +| §44 | Окислительно-восстановительные реакции | метод электронного баланса | **Балансировщик ОВР** (пошаговый e-баланс) | +| §45 | ОВР вокруг нас | горение, коррозия, дыхание, батарейки | Инфографика-исследование ОВР в жизни | + +### ГЛАВА 6. Растворы (§§46–52) — *cyan* +| § | Тема | Ключ | Интерактив | +|---|------|------|------------| +| §46 | Смеси веществ | однородные/неоднородные, разделение | Классификатор смесей + методы разделения | +| §47 | Растворение веществ в воде | гидратация, тепловой эффект | **Анимация растворения** (`dissociationAnim`) | +| §48 | Характеристики растворимости веществ | $s=f(t)$, насыщ./ненасыщ. | **График растворимости** + `solubilityTable` | +| §49 | Качественные характеристики состава растворов | насыщ./ненасыщ./разб./конц. | Качественная шкала «крепости» раствора | +| §50 | Количественные характеристики. Массовая доля | $w=\dfrac{m_{в-ва}}{m_{р-ра}}$ | **Калькулятор $w$** (sim `solutions`) | +| §51 | Молярная концентрация растворённых веществ | $c=\dfrac{n}{V}$, разбавление, смешение | **Калькулятор $c$** + разбавление/смешение | +| §52 | Вода и растворы в жизни и деятельности человека | значение, очистка, быт | Инфографика-исследование | + +**Практическая работа 4** (после §51): приготовление раствора с заданной $w$ и $c$. + +**Итого**: 52 §, вводный раздел + 6 глав, **4 лаб. опыта** (§18, §20, §25, §38), **4 практические работы** (§7, §18, §22, §51). + +--- + +## ⚗️ ХИМИЧЕСКИЙ СТАНДАРТ КАЧЕСТВА + +### A. Движки и переиспользуемые активы (всё уже есть в проекте) + +| Что нужно | Берём из | Файл / id | +|-----------|----------|-----------| +| Парсинг формул, $M$/$M_r$, формула Хилла | biochem-core | `frontend/js/biochem-core.js` ✅ | +| 2D/3D шаростержневые модели, VSEPR | biochem-core | `frontend/js/biochem-core.js` ✅ | +| Интерактивная ПСХЭ | sim `periodic` | реестр `_register-all.js` ✅ | +| Модель атома (Бор) | sim `bohratom` | реестр ✅ | +| Орбитали | sim `orbitals` | реестр ✅ | +| Радиоактивность/изотопы | sim `radioactive` | реестр ✅ | +| Стехиометрия | sim `stoichiometry` | реестр ✅ | +| Титрование (нейтрализация) | sim `titration` | реестр ✅ | +| Качественный анализ | sim `qualanalysis` | реестр ✅ | +| Растворы / массовая доля | sim `solutions` | реестр ✅ | +| Песочница реакций | sim `chemsandbox` | реестр ✅ | + +Монтаж: контейнер `
    ` + `openSim('')` (или прямой mount +через `window.LabRegistry`), как на остальных страницах. + +### B. Общий хелпер `/js/chem8_svg.js` (по образцу `geom7_svg.js`, `alg10_svg.js`) + +> **Рекомендация:** химические примитивы 8 и 9 классов сильно пересекаются. Реализовать +> файл так, чтобы его можно было продвинуть в **общий `/js/chem_svg.js`** (план Химии 9 +> ссылается на `chem9_svg.js` — при совместной разработке свести в один shared-модуль и +> переиспользовать оба). Молекулы — **только через `biochem-core.js`**, не дублировать. + +```js +// 1. Рендер уравнения реакции: коэффициенты, состояния (↑↓), стрелки, условия над стрелкой +const chemEq = (src, opts={}) => { /* токенизация формул, верхн./нижн. индексы, →/⇌/→[t°] */ }; + +// 2. Ион с зарядом: ionLabel('SO4', -2) → 'SO₄²⁻' +const ionLabel = (formula, charge) => { /* нижние индексы + надстрочный заряд */ }; + +// 3. Пробирка с осадком/газом/окраской (SVG-анимация) +const testTube = ({fill, precipitate, gas, color, label}) => { /* svg */ }; + +// 4. Треугольник n–m–M (звёздный виджет §6): кликаешь искомое → формула + калькулятор +const moleTriangle = (mount, {solveFor}) => { /* n=m/M, m=n·M, M=m/n */ }; + +// 5. Балансировщик уравнений (§8): подбор коэффициентов, проверка баланса атомов +const equationBalancer = (mount, {skeleton}) => { /* матрица атомов, подсветка дисбаланса */ }; + +// 6. Калькулятор степени окисления (§42): формула → с.о. каждого элемента (правила) +const oxStateCalc = (mount, {formula}) => { /* разбор, правила H+1/O−2/Σ=0 */ }; + +// 7. Балансировщик ОВР методом e-баланса (§44): полуреакции, НОК, коэффициенты +const redoxBalancer = (mount, {skeleton}) => { /* окислитель/восстановитель, Δe⁻ */ }; + +// 8. Орбитальная диаграмма (§33): orbitalDiagram('1s2 2s2 2p4') → клетки + ↑↓ +const orbitalDiagram = (config) => { /* svg клетки, принцип Хунда/Паули */ }; + +// 9. Интерактивная таблица растворимости (§19,20,48): подсветка пары катион×анион (Р/Н/М/—) +const solubilityTable = (mount, {highlight}) => { /* из форзаца книги */ }; + +// 10. Интерактивный ряд активности металлов (§14,20): клик → предсказание реакции +const activitySeries = (mount, opts) => { /* K Ca Na Mg Al Zn Fe ... Au + (H₂) */ }; + +// 11. Мини-ПСХЭ с подсветкой (§1,26,34): элемент/группа/период/семейство +const miniPeriodic = (mount, {highlight, onClick}) => { /* интерактивная сетка */ }; + +// 12. Индикатор + шкала pH (§13,14,16,17): лакмус/фенолфталеин/метилоранж +const indicatorScale = (mount, {ph, indicator}) => { /* цвет полоски */ }; + +// 13. Анимация растворения/гидратации (§47): частицы воды окружают ионы/молекулы +const dissociationAnim = (mount, {substance}) => { /* canvas/SVG-частицы */ }; + +// 14. Классификатор-DnD (§10,13,16,19,46): drag формулы → класс/тип; проверка +const classifier = (mount, {items, buckets}) => { /* оксиды/кислоты/основания/соли/смеси */ }; + +// 15. Генетическая карта-граф (§22): Me/неMe → оксид → гидроксид → соль, клик-переходы +const geneticMap = (mount, opts) => { /* SVG-граф классов + рендер реакции перехода */ }; +``` + +### C. Правила рендера химии (обязательны с §1) + +1. **Формулы веществ** — нижние индексы для атомов ($H_2O$, $CaCO_3$), верхние для зарядов + ионов ($SO_4^{2-}$) и степеней окисления ($\overset{+2}{Ca}$); единый рендер через + `chemEq`/`ionLabel`, не «сырой» текст. +2. **Уравнения реакций** — всегда сбалансированы; стрелки `=`/`→` (необратимая), + `⇌` (обратимая), `↑` (газ), `↓` (осадок), условия над стрелкой ($t$, кат., эл.ток). +3. **Состояние/признак** — для качественных реакций показывать цвет осадка, пузырьки газа, + изменение окраски индикатора (через `testTube`/`indicatorScale`). +4. **Количественные расчёты** — каждый расчётный § даёт калькулятор/тренажёр с пошаговым + решением (дано → формула → подстановка → ответ с единицами), не только готовый ответ. +5. **Молекулярные модели** — структурная формула + 3D (biochem-core) для каждой изучаемой + молекулы (§37–38, §41); для типов решёток — 3D-ячейки. +6. **Цвета — химически достоверные**: осадки ($Cu(OH)_2$ голубой, $Fe(OH)_3$ бурый, + $Zn(OH)_2$ белый); индикаторы (фенолфталеин в щёлочи малиновый, лакмус в кислоте красный, + метилоранж в кислоте розовый). +7. **Безопасность** — где уместно (растворение кислот/щелочей, разбавление) — заметка-«скрепка». +8. **KaTeX-эскейпы** — в JS-шаблонах двойной backslash (`\\to`, `\\downarrow`, `\\rightleftharpoons`). +9. **Drag/слайдеры** — `window`-listeners + `{passive:false}` + state ВЫШЕ `redraw()` + (стандарт геометрии), `touch-action:none` на draggable SVG/canvas, **без `setPointerCapture`**. +10. **Без эмоджи** — только inline SVG `.ic`/`.ico` (правило проекта [[feedback_no_emoji]]). + +### D. Типы интерактивов по темам 8 класса + +| Тип темы | Интерактив | +|----------|------------| +| Количество вещества (§3–7, 9) | `moleTriangle`, калькуляторы $M/V_m/N$, sim `stoichiometry` | +| Химические реакции (§8) | `equationBalancer`, классификатор типов | +| Классы соединений (§10–21) | `classifier`, матрицы реакций, `indicatorScale`, `solubilityTable`, `activitySeries` | +| Генетическая связь (§22) | `geneticMap` | +| Периодический закон / ПСХЭ (§24–28, 34) | `miniPeriodic`, sim `periodic`, графики трендов | +| Строение атома (§29–33) | sim `bohratom`, sim `orbitals`, sim `radioactive`, `orbitalDiagram` | +| Химическая связь (§36–41) | slider ЭО, biochem-core 3D, ионная/металлич. решётка, 4 типа кристаллов | +| ОВР (§42–44) | `oxStateCalc`, `redoxBalancer`, визуализация переноса $e^-$ | +| Растворы (§46–52) | `dissociationAnim`, график растворимости, sim `solutions`, калькулятор $c$ | +| Качественные/амфотерность (§18,25) | `testTube` + уравнение + признак | + +--- + +## 📦 СТРУКТУРА КАЖДОГО § (стандарт наполнения) + +**Теория (3–4 карточки):** +- `theory` — основное определение/понятие + наглядная SVG/модель +- `rule` — ключевая закономерность/формула (рамка) +- `example` — разобранный пример (реакция/расчёт) с пошаговым рендером +- (для прикладных §) `apply` — применение/значение (инфографика) + +**Интерактивы (4–6 на §):** +1. **Звёздный виджет** темы (из карты содержания) +2. **Конструктор/симулятор** (slider / drag / sim из реестра) +3. **Калькулятор** ($M$, $n$, $w$, $c$, с.о., по уравнению) — где применимо +4. **DnD-классификатор** (классы веществ, тип связи/реакции, тип решётки) +5. **Тренажёр** — 5 задач с inline-наглядностью (формула/уравнение/модель в условии) +6. **Босс §** — 4 интеграционные задачи (+5 XP каждая) + +**Дополнительно:** пополнение глоссария (термины §, `[[ссылки]]`), «Вопросы и задания» +из учебника (адаптированные, с проверкой), проходящий jsdom-тест страницы. + +**Финал главы:** итоговая шпаргалка (mini-cards), карта связей (SVG-граф понятий), +7 интегрированных боссов (+10 XP), achievement «Мастер главы N» (+50 XP, confetti), +кнопка перехода к следующей главе. + +--- + +## 🚀 ПОРЯДОК РЕАЛИЗАЦИИ (по фазам) + +### Phase 0 — Фундамент (hub + каркасы глав) +- **`chemistry_8_hub.html`** — хаб-каталог 7 глав по образцу `physics_9_hub.html`: палитра + **amber**, водяной знак «ХИМИЯ», карточки глав с прогрессом (грузится из + `/api/textbooks/chemistry-8/children`), блок «Финал курса» (шпаргалка + боссы — наполняется в Phase 7), + achievement-strip «Химик 8 класса», тема (localStorage `chemistry8_theme`). +- **7 файлов глав** `chemistry_8_intro.html` + `chemistry_8_ch1..ch6.html` — на Phase 0 + валидные каркасы-заглушки (header с водяным знаком, hero, sidebar-оглавление §, контейнер + параграфов, XP/tracker-интеграция), наполнение § — в Phase 1–6. +- **`/js/chem8_svg.js`** (хелперы B — заглушки → реализация по фазам). +- Подключить `biochem-core.js` + нужные симуляторы на страницах глав. +- **Миграция `041_chemistry8_hub.sql`** (следующий номер после `040_content_access.sql`): + **INSERT** родителя `chemistry-8` (`html_path='chemistry_8_hub.html'`, `para_count=52`, + `color='amber'`, `parent_slug=NULL`) + **7 детей** `chemistry-8-intro`/`-ch1..-ch6` + (`parent_slug='chemistry-8'`, свои `html_path`/`para_count`/`color`/`sort_order`) — по образцу + `038_physics_9_hub.sql`. Применить `npm run migrate`. +- jsdom-тест-каркас: хаб строится, все 8 файлов парсятся, ссылки глав ведут на существующие slug. + +### Phase 1 — Вводный раздел «Количественные понятия» (§§1–9) + ПР1 — фундамент расчётов +Базовые движки: калькулятор $M_r$ (biochem-core), `moleTriangle`, связка $m$–$n$–$V$–$N$, +`equationBalancer`, sim `stoichiometry`. **Критично** — эти расчёты используются во всех главах. + +### Phase 2 — Глава 1 «Классы неорганических соединений» (§§10–23) + Лаб.1,2 + ПР2,3 +Самая объёмная. Закладываем `classifier`, `indicatorScale`, `solubilityTable`, +`activitySeries`, матрицы реакций, `testTube` (первые качественные/нейтрализация), +`geneticMap` (§22), sim `titration`. + +### Phase 3 — Глава 2 «Периодический закон и ПСХЭ» (§§24–28) + Лаб.3 +`miniPeriodic`, sim `periodic`, амфотерность ($Zn(OH)_2$ — обе реакции + `testTube`), +демонстрация периодичности. + +### Phase 4 — Глава 3 «Строение атома» (§§29–35) +sim `bohratom`, sim `orbitals`, sim `radioactive`, `orbitalDiagram`, графики периодических +трендов, генератор «паспорта элемента». + +### Phase 5 — Глава 4 «Химическая связь» (§§36–41) + Лаб.4 +slider ЭО → тип связи, biochem-core 3D-модели, ионная/металлическая решётки, +4 типа кристаллических решёток (3D) и связь «тип → свойства». + +### Phase 6 — Глава 5 «ОВР» (§§42–45) + Глава 6 «Растворы» (§§46–52) + ПР4 +`oxStateCalc`, `redoxBalancer`, визуализация переноса $e^-$; затем `dissociationAnim`, +график растворимости, sim `solutions`, калькулятор $c$, ПР4. + +### Phase 7 — Финалы глав + общий финал учебника +Шпаргалки и карты связей по каждой главе; интегрированные боссы + achievements; +**большой финал**: генетическая карта классов + строение/связь, итоговый босс-квест, +ачивка «Химик 8 класса»; глоссарий собран и связан `[[ссылками]]`. + +### Phase 8 — Качество и админка +Полный прогон jsdom-тестов (каждый § — builder не stub); аудит баланса уравнений и +KaTeX/`chemEq`-эскейпов; синхронизация с админкой (если новые sim в `lab.html` → +обновить `ADMIN_SIMS` в `admin.html` — [[feedback_sims_admin_sync]]); проверка доступа +по классам/ученикам ([[project_content_access]], `/api/access`). + +> Рекомендуемый темп: внутри фазы — по 2–3 § за «волну», каждая волна = commit + +> проходящий jsdom-тест (правило CLAUDE.md: commit изменённых файлов + push). + +--- + +## 🗄️ ИНТЕГРАЦИЯ С ПРОЕКТОМ + +| Точка | Действие | +|-------|----------| +| **БД каталог** | `chemistry-8` в `textbooks` **отсутствует** → миграция `041_chemistry8_hub.sql`: INSERT родитель + 7 детей (образец — `038_physics_9_hub.sql`). Каталог `/api/textbooks` показывает только `parent_slug IS NULL`; хаб тянет детей через `/api/textbooks/chemistry-8/children`. | +| **Прогресс/XP** | Автоматически: `textbook-xp-widget.js` (+5 XP/§), `textbook-tracker.js`, `LS.xp`. Доп. XP за боссов — по образцу `phys7_ch1_widgets.js`. | +| **Симуляторы** | Реестр `frontend/js/labs/_register-all.js`. Нужные химические sim уже зарегистрированы: `periodic`, `bohratom`, `orbitals`, `radioactive`, `stoichiometry`, `titration`, `qualanalysis`, `solutions`, `chemsandbox`. | +| **Молекулы** | `biochem-core.js` (парсинг, $M$, 2D/3D, VSEPR). | +| **Бэкенд** | Роуты готовы: `backend/src/routes/textbooks.js` (catalog/progress/bookmarks). Доступ: `backend/src/services/contentAccess.js`. | +| **Глоссарий** | Виджет всплывающих определений на странице (общего нет — реализовать). | +| **Тесты** | `cd backend && npm test` (jsdom). На каждый § — тест: страница строится, builder не stub, уравнения сбалансированы. | +| **Админка** | Новые sim в `lab.html` → синхронно `ADMIN_SIMS` в `admin.html`. | + +--- + +## ⚠️ КРИТИЧЕСКИЕ ПРАВИЛА + +### ❌ НЕ делать +- «Сырые» формулы текстом — только `chemEq`/`ionLabel`/KaTeX. +- Несбалансированные уравнения (аудит баланса перед commit). +- Дублировать молекулярный движок — использовать `biochem-core.js`. +- `setPointerCapture` (теряется после `innerHTML`-replace) → `window`-listeners + state-flag. +- `\to`, `\downarrow`, `\rightleftharpoons` без удвоения backslash в JS-шаблонах. +- Slider-диапазоны за пределы химически возможного (концентрации, температуры, $V_m$). +- Эмоджи — запрещены; только inline SVG `.ic`. +- **Grep tool — запрещён**; поиск только `ast-index` ([[reference_sqlite_node]] и правила проекта). + +### ✅ Обязательно +- Каждый commit → jsdom-тест 100% pass. +- Аудит баланса уравнений + KaTeX-эскейпов после каждой волны. +- Расчётный § = калькулятор/тренажёр с **пошаговым** решением и единицами измерения. +- Качественная реакция = уравнение (молек.+, где есть, ионное) **+ видимый признак**. +- Цвета осадков/индикаторов — химически достоверные. +- Все builder-функции в конце финальной волны главы — НЕ stub'ы. +- Коммитить только изменённые файлы (не `git add -A`), сразу push. + +--- + +## 📊 Оценка объёма + +| Раздел | § | Лаб/ПР | Ожидаемый LOC | +|--------|---|--------|---------------| +| Вводный (кол-во вещества) | 9 | ПР1 | ~7 000 (+`moleTriangle`, `equationBalancer`, `stoichiometry`) | +| Гл.1 Классы соединений | 14 | Лаб1,2 + ПР2,3 | ~16 000 (+`classifier`, `solubilityTable`, `activitySeries`, `geneticMap`) | +| Гл.2 ПЗ и ПСХЭ | 5 | Лаб3 | ~5 000 (+`miniPeriodic`, амфотерность) | +| Гл.3 Строение атома | 7 | — | ~7 000 (+`orbitalDiagram`, sim bohratom/orbitals/radioactive) | +| Гл.4 Химическая связь | 6 | Лаб4 | ~6 500 (+3D-модели, 4 решётки) | +| Гл.5 ОВР | 4 | — | ~4 500 (+`oxStateCalc`, `redoxBalancer`) | +| Гл.6 Растворы | 7 | ПР4 | ~7 000 (+`dissociationAnim`, sim solutions, калькулятор $c$) | +| Финалы глав + общий | — | — | ~5 000 | +| `/js/chem8_svg.js` хелперы | — | — | ~3 000 | +| Хаб + 7 каркасов глав (Phase 0) | — | — | ~3 000 | +| **Итого** | **52** | **4 лаб + 4 ПР** | **~64 000 LOC** | + +--- + +## 🎬 Запуск + +**Phase 0**: `chemistry_8_hub.html` (по образцу `physics_9_hub.html`) + 7 каркасов глав +(`chemistry_8_intro.html`, `chemistry_8_ch1..ch6.html`) + `/js/chem8_svg.js` (скелет) + +подключение `biochem-core.js`/симуляторов + миграция `041_chemistry8_hub.sql` (родитель + 7 детей) ++ `npm run migrate` + jsdom-каркас. +**Phase 1**: Вводный раздел (§§1–9) — закладываем движки расчётов (`moleTriangle`, +`equationBalancer`, sim `stoichiometry`), от которых зависят все главы. + +Дальше — последовательно по главам (Phase 2 → 6), затем финалы (Phase 7) и качество (Phase 8).