diff --git a/backend/tests/chemistry7-page.test.js b/backend/tests/chemistry7-page.test.js
index 955788b..067e6d1 100644
--- a/backend/tests/chemistry7-page.test.js
+++ b/backend/tests/chemistry7-page.test.js
@@ -108,7 +108,22 @@ test('ch1 Волна 3: интерактивы §7–§9 монтируются
assert.deepEqual(errors, [], 'нет ошибок: ' + errors.join(' | '));
});
-test('ch1: переход к §9 и финалу строит заглушку без ошибок', async () => {
+test('ch1 Волна 4: §10–§12 + ЛО1 + финал главы монтируются', async () => {
+ const { doc, errors } = await loadDom('chemistry_7_ch1.html');
+ doc.defaultView.goTo('p10'); await wait(100);
+ assert.ok(doc.querySelector('#p10-signs #p10-signs-go'), 'детектор признаков §10');
+ doc.defaultView.goTo('lo1'); await wait(100);
+ assert.ok(doc.querySelector('#lo1-signs #lo1-signs-go'), 'детектор признаков ЛО1');
+ doc.defaultView.goTo('p11'); await wait(100);
+ assert.ok(doc.querySelector('#p11-bal svg'), 'весы сохранения массы §11');
+ doc.defaultView.goTo('p12'); await wait(120);
+ assert.ok(doc.querySelector('#p12-mount').childElementCount > 0, 'балансировщик §12');
+ doc.defaultView.goTo('final1'); await wait(120);
+ assert.ok(doc.querySelectorAll('#navDotsfinal1 .nav-dot').length >= 6, 'боссы финала главы');
+ assert.deepEqual(errors, [], 'нет ошибок: ' + errors.join(' | '));
+});
+
+test('ch1: переход к §9 и финалу строит без ошибок', async () => {
const { doc, errors } = await loadDom('chemistry_7_ch1.html');
doc.defaultView.goTo('p9'); await wait(80);
assert.ok(doc.querySelector('#p9-body .para-hero'), 'para-hero §9');
diff --git a/frontend/js/chem7_ch1_widgets.js b/frontend/js/chem7_ch1_widgets.js
index ef6b5e6..a9776d6 100644
--- a/frontend/js/chem7_ch1_widgets.js
+++ b/frontend/js/chem7_ch1_widgets.js
@@ -298,10 +298,79 @@
$('p9-a').addEventListener('change', upd); $('p9-b').addEventListener('change', upd); upd();
}
+ /* ── Волна 4 ── */
+
+ /* §10 / ЛО1 — детектор признаков химической реакции */
+ var DEMOS = [
+ { name: 'Нагревание малахита', signs: ['изменение цвета: зелёный → чёрный', 'выделение газа (водяной пар и углекислый газ)'] },
+ { name: 'Сливание растворов CuSO₄ и NaOH', signs: ['образование осадка (голубой)', 'изменение цвета раствора'] },
+ { name: 'Горение серы', signs: ['выделение света и тепла (пламя)', 'появление резкого запаха'] },
+ { name: 'Добавление соды в уксус', signs: ['выделение газа (пузырьки)'] }
+ ];
+ function mount_signs(mountId) {
+ var m = $(mountId); if (!m || m._built) return; m._built = 1;
+ var idx = 0;
+ function render() {
+ m.innerHTML = '
'
+ + '
'
+ + '
Выбери опыт и нажми «Провести опыт».
';
+ $(mountId + '-pick').addEventListener('change', function (e) { idx = +e.target.value; m._built = 0; render(); });
+ $(mountId + '-go').addEventListener('click', function () {
+ var d = DEMOS[idx], out = $(mountId + '-out'); out.className = 'out ok';
+ out.innerHTML = 'Наблюдаемые признаки реакции:
'
+ + d.signs.map(function (s) { return '
✓ ' + esc(s) + '
'; }).join('')
+ + '
Эти признаки указывают, что произошла химическая реакция — образовались новые вещества.
';
+ });
+ }
+ render();
+ }
+ function mount_p10() { mount_signs('p10-signs'); }
+ function mount_lo1() { mount_signs('lo1-signs'); }
+
+ /* §11 — весы сохранения массы */
+ function mount_p11() {
+ var m = $('p11-bal'); if (!m || m._built) return; m._built = 1;
+ var mixed = false;
+ function scale(level) {
+ // level: 0 = равновесие
+ return '';
+ }
+ function render() {
+ m.innerHTML = scale()
+ + '
' + (mixed
+ ? 'После реакции: осадок Cu(OH)₂ + раствор Na₂SO₄. Стрелка весов не сдвинулась — масса сохранилась (100 г = 100 г).'
+ : 'До реакции: раствор CuSO₄ + раствор NaOH, общая масса 100 г.') + '
'
+ + '';
+ $('p11-mix').addEventListener('click', function () { mixed = !mixed; m._built = 0; render(); });
+ }
+ render();
+ }
+
+ /* §12 — балансировщик уравнений (переиспользуем Chem8.equationBalancer) */
+ function mount_p12() {
+ var pick = $('p12-pick'), mount = $('p12-mount'); if (!pick || pick._built || !C().equationBalancer) return; pick._built = 1;
+ function build() { var parts = pick.value.split('|'); C().equationBalancer(mount, { skeleton: parts[0], solution: parts[1].split(',').map(Number) }); }
+ pick.addEventListener('change', build); build();
+ }
+
W.CHEM8_WIDGETS = Object.assign(W.CHEM8_WIDGETS || {}, {
p1: mount_p1, p2: mount_p2, pr1: mount_pr1, p3: mount_p3,
p4: mount_p4, p5: mount_p5, p6: mount_p6,
- p7: mount_p7, p8: mount_p8, p9: mount_p9
+ p7: mount_p7, p8: mount_p8, p9: mount_p9,
+ p10: mount_p10, lo1: mount_lo1, p11: mount_p11
});
- W.FLAG_MOUNTS = Object.assign(W.FLAG_MOUNTS || {}, {});
+ W.FLAG_MOUNTS = Object.assign(W.FLAG_MOUNTS || {}, { p12: mount_p12 });
})(window);
diff --git a/frontend/textbooks/chemistry_7_ch1.html b/frontend/textbooks/chemistry_7_ch1.html
index 07caf6d..14df0b9 100644
--- a/frontend/textbooks/chemistry_7_ch1.html
+++ b/frontend/textbooks/chemistry_7_ch1.html
@@ -106,7 +106,9 @@ window.PARAS = [
window.ACH_LABELS = { start:'Начало главы 1!', p1_done:'§1 изучен!', p2_done:'§2 изучен!',
pr1_done:'Практическая работа 1 выполнена!', p3_done:'§3 изучен!',
p4_done:'§4 изучен!', p5_done:'§5 изучен!', p6_done:'§6 изучен!',
- p7_done:'§7 изучен!', p8_done:'§8 изучен!', p9_done:'§9 изучен!', final1_tasks:'Глава 1 пройдена!' };
+ p7_done:'§7 изучен!', p8_done:'§8 изучен!', p9_done:'§9 изучен!',
+ p10_done:'§10 изучен!', lo1_done:'Лабораторный опыт 1 выполнен!', p11_done:'§11 изучен!', p12_done:'§12 изучен!',
+ final1_tasks:'Глава 1 пройдена! Вы — Мастер первоначальных понятий!' };
window.SIDEBARS = {
p1:{ title:'Шпаргалка §1', rows:[['Вещество','то, из чего состоит тело'],['Тело','предмет из вещества'],['Свойства','цвет, запах, плотность, $t_{пл}$…']] },
p2:{ title:'Шпаргалка §2', rows:[['Чистое','постоянный состав'],['Смесь','2+ вещества'],['Разделение','по различию свойств']] },
@@ -117,7 +119,12 @@ window.SIDEBARS = {
p6:{ title:'Шпаргалка §6', rows:[['Сложное','разные элементы'],['Примеры','$H_2O$, $CO_2$, $NH_3$'],['Состав','можно разложить']] },
p7:{ title:'Шпаргалка §7', rows:[['Индекс','число атомов'],['Коэффициент','число молекул'],['Состав','качеств. + количеств.']] },
p8:{ title:'Шпаргалка §8', rows:[['$M_r$','$=\\sum A_r$'],['$M_r(H_2O)$','18'],['$M_r(H_2SO_4)$','98']] },
- p9:{ title:'Шпаргалка §9', rows:[['Валентность','число связей'],['H — I, O — II',''],['Формула','по НОК валентностей']] }
+ p9:{ title:'Шпаргалка §9', rows:[['Валентность','число связей'],['H — I, O — II',''],['Формула','по НОК валентностей']] },
+ p10:{ title:'Шпаргалка §10', rows:[['Физическое','форма/состояние'],['Химическое','новые вещества'],['Признаки','цвет, газ, осадок, запах, тепло']] },
+ lo1:{ title:'Лаб. опыт 1', rows:[['Цель','наблюдать признаки реакций'],['Признак','новое вещество']] },
+ p11:{ title:'Шпаргалка §11', rows:[['Закон','масса сохраняется'],['$m$ реаг.','= $m$ прод.'],['Авторы','Ломоносов, Лавуазье']] },
+ p12:{ title:'Шпаргалка §12', rows:[['Уравнивают','коэффициентами'],['Индексы','не трогать'],['Баланс','атомы слева = справа']] },
+ final1:{ title:'Финал главы 1', rows:[['§§1–12','все понятия'],['Награда','ачивка + XP']] }
};
window.TIPS = [
{ sec:'p1', html:'Тело — это предмет (гвоздь, стакан), а вещество — то, из чего он сделан (железо, стекло). Из одного вещества можно сделать много тел.' },
@@ -129,7 +136,12 @@ window.TIPS = [
{ sec:'p6', html:'Сложное вещество образовано атомами разных элементов ($H_2O$ — водород и кислород) и может быть разложено на простые.' },
{ sec:'p7', html:'Индекс относится к атому/группе слева от него. В $H_2SO_4$: 2 атома H, 1 атом S, 4 атома O. Коэффициент (число перед формулой) — это число молекул.' },
{ sec:'p8', html:'$M_r$ — сумма $A_r$ всех атомов формулы. $M_r(\\text{CO}_2)=12+2\\cdot16=44$.' },
- { sec:'p9', html:'Кислород в соединениях имеет валентность II, водород — I. Зная их, можно определить валентность другого элемента и составить формулу по НОК.' }
+ { sec:'p9', html:'Кислород в соединениях имеет валентность II, водород — I. Зная их, можно определить валентность другого элемента и составить формулу по НОК.' },
+ { sec:'p10', html:'Признаки химической реакции: изменение цвета, выделение газа, образование осадка, появление запаха, выделение или поглощение тепла и света.' },
+ { sec:'lo1', html:'Если после действия появились новые вещества (изменился цвет, выпал осадок, выделился газ) — произошла химическая реакция.' },
+ { sec:'p11', html:'Атомы в реакции не исчезают и не появляются, поэтому масса веществ до реакции равна массе после (М. В. Ломоносов, А. Лавуазье).' },
+ { sec:'p12', html:'Уравнивают реакцию только коэффициентами (числами перед формулами). Индексы внутри формул менять нельзя.' },
+ { sec:'final1', html:'Собери всё: вещество/смесь, атом/элемент, формула, $M_r$, валентность, признаки реакции, закон сохранения, уравнение.' }
];
/* ── задачи (тренажёр) ── */
@@ -187,6 +199,32 @@ window.POOLS = {
{q:'Какова валентность кислорода в соединениях?',hint:'постоянная',unit:'',a:2,ex:'Кислород почти всегда двухвалентен (II).'},
{q:'Какова валентность хлора в молекуле $\\text{HCl}$?',hint:'равна числу атомов H',unit:'',a:1,ex:'Хлор соединён с 1 атомом H → валентность I.'},
{q:'Какова формула оксида алюминия (Al — III, O — II)?',opts:['AlO','Al₂O₃','AlO₂','Al₃O₂'],a:1,ex:'НОК(3,2)=6 → индексы 2 и 3 → Al₂O₃.'}
+ ],
+ p10:[
+ {q:'Что НЕ является признаком химической реакции?',opts:['Изменение цвета','Выделение газа','Образование осадка','Изменение формы предмета'],a:3,ex:'Изменение формы — физическое изменение, не признак реакции.'},
+ {q:'Таяние льда — это явление…',opts:['Химическое','Физическое','Реакция','Горение'],a:1,ex:'Вода не превращается в другое вещество — физическое явление.'},
+ {q:'Ржавление железа — это явление…',opts:['Физическое','Химическое','Растворение','Плавление'],a:1,ex:'Образуется новое вещество (ржавчина) — химическое явление.'},
+ {q:'Появление резкого запаха при горении серы — это…',opts:['Признак химической реакции','Физическое изменение','Не имеет значения','Изменение формы'],a:0,ex:'Образовался новый газ — признак реакции.'}
+ ],
+ p11:[
+ {q:'Закон сохранения массы означает, что…',opts:['Масса всегда растёт','Масса реагентов равна массе продуктов','Атомы исчезают','Масса уменьшается'],a:1,ex:'Атомы не исчезают — масса сохраняется.'},
+ {q:'При реакции $4$ г водорода с $32$ г кислорода сколько граммов воды образуется?',hint:'$4+32$',unit:'г',a:36,ex:'$4+32=36$ г.'},
+ {q:'Сожгли $12$ г углерода, получили $44$ г $\\text{CO}_2$. Сколько граммов кислорода вступило?',hint:'$44-12$',unit:'г',a:32,ex:'$44-12=32$ г.'},
+ {q:'Кто открыл закон сохранения массы веществ?',opts:['Д. И. Менделеев','М. В. Ломоносов','И. Ньютон','Архимед'],a:1,ex:'М. В. Ломоносов (и позже А. Лавуазье).'}
+ ],
+ p12:[
+ {q:'В уравнении $2\\text{H}_2+\\text{O}_2=2\\text{H}_2\\text{O}$ коэффициент перед $\\text{H}_2\\text{O}$ равен…',hint:'смотри на воду',unit:'',a:2,ex:'Коэффициент 2.'},
+ {q:'Что можно изменять при уравнивании реакции?',opts:['Только индексы','Только коэффициенты','И индексы, и коэффициенты','Ничего'],a:1,ex:'Уравнивают только коэффициентами.'},
+ {q:'В уравнении $3\\text{Fe}+2\\text{O}_2=\\text{Fe}_3\\text{O}_4$ коэффициент перед $\\text{Fe}$ равен…',hint:'железо слева',unit:'',a:3,ex:'Коэффициент 3.'},
+ {q:'Если в реакции 2 атома фосфора, сколько их должно быть в продуктах?',hint:'закон сохранения',unit:'',a:2,ex:'Столько же — атомы не исчезают.'}
+ ],
+ final1:[
+ {q:'$M_r(\\text{H}_2\\text{SO}_4)=?$',hint:'$2+32+64$',unit:'',a:98,ex:'$98$.'},
+ {q:'Валентность серы в $\\text{SO}_2$ (кислород — II)?',hint:'$2\\cdot\\text{II}$',unit:'',a:4,ex:'IV.'},
+ {q:'Коэффициент перед $\\text{H}_2$ в $2\\text{H}_2+\\text{O}_2=2\\text{H}_2\\text{O}$?',hint:'',unit:'',a:2,ex:'2.'},
+ {q:'Сколько атомов кислорода в формуле $\\text{Fe}_3\\text{O}_4$?',hint:'индекс при O',unit:'',a:4,ex:'4.'},
+ {q:'$\\text{N}_2$ — простое или сложное вещество?',opts:['Простое','Сложное'],a:0,ex:'Один элемент — простое.'},
+ {q:'Сожгли $4$ г серы, получили $8$ г $\\text{SO}_2$. Сколько граммов кислорода вступило?',hint:'$8-4$',unit:'г',a:4,ex:'$8-4=4$ г.'}
]
};
@@ -367,6 +405,82 @@ function build_p9(){
wireReadBtn('p9');
}
+function build_p10(){
+ document.getElementById('p10-body').innerHTML =
+ '
§ 10 · Химия 7
Явления физические и химические. Признаки химических реакций
'
+ +'
Чем химическое явление отличается от физического и как распознать химическую реакцию.
'
+ +'
явлениереакцияпризнаки
'
+ +makeCard('theory','Физические и химические явления','§10','
При физическом явлении вещество не превращается в другое — меняются лишь форма, размеры или состояние (таяние льда, испарение воды, измельчение мела).
'
+ +'
При химическом явлении (реакции) из одних веществ образуются другие вещества с новыми свойствами (горение, ржавление, скисание молока).
')
+ +makeCard('rule','Признаки химических реакций','§10','
О том, что произошла химическая реакция, судят по признакам:
Зелёный порошок малахита при нагревании чернеет (образуется $\\text{CuO}$) и выделяет газы. Видны сразу два признака — изменение цвета и выделение газа.
')
+ +wgt('Детектор признаков реакции','')
+ +rememberBox(['Физическое явление — вещество остаётся тем же.','Химическая реакция — образуются новые вещества.','Признаки реакции: цвет, газ, осадок, запах, тепло/свет.'])
+ +qList(['Приведи примеры физического и химического явлений.','Какие признаки реакции наблюдаются при горении?','Почему ржавление железа — химическое явление?'])
+ +secNav('p9','lo1')+readButton('p10');
+ wireReadBtn('p10');
+}
+
+function build_lo1(){
+ document.getElementById('lo1-body').innerHTML =
+ '
Лабораторный опыт 1
Признаки протекания химических реакций
'
+ +'
Пронаблюдать признаки, по которым узнают химическую реакцию.
'
+ +makeCard('lab','Ход работы',null,'
Прилей к раствору соли меди раствор щёлочи — наблюдай образование осадка и изменение цвета.
Капни на мел (или соду) кислоту — наблюдай выделение газа (пузырьки).
Нагрей выданное вещество — отметь изменение цвета или выделение газа.
Запиши, какой признак реакции наблюдался в каждом опыте, и сделай вывод.
'
+ +'
Кислоты и щёлочи едкие — не допускай попадания на кожу; нагревай осторожно.
Закон сохранения массы веществ. Химические уравнения
'
+ +'
$m_{реагентов}=m_{продуктов}$
'
+ +'
Почему масса веществ в реакции не меняется и как это записывают уравнением.
'
+ +'
закон сохраненияуравнение
'
+ +makeCard('theory','Закон сохранения массы','§11','
Закон сохранения массы: масса веществ, вступивших в реакцию, равна массе веществ, образовавшихся в результате реакции. Открыт М. В. Ломоносовым и подтверждён А. Лавуазье.
'
+ +'
Причина проста: атомы в реакции не исчезают и не появляются — они лишь по-новому соединяются. Поэтому их общее число (и масса) сохраняется.
Реакцию записывают уравнением: слева — реагенты, справа — продукты. Например: $2\\text{H}_2+\\text{O}_2=2\\text{H}_2\\text{O}$. Число атомов каждого элемента слева и справа одинаково.
')
+ +wgt('Весы сохранения массы','')
+ +rememberBox(['Масса реагентов = масса продуктов.','Атомы лишь перегруппировываются, их число сохраняется.','Реакцию записывают химическим уравнением.'])
+ +qList(['Сформулируй закон сохранения массы.','Почему масса не изменяется в ходе реакции?','При сжигании 12 г угля в кислороде получили 44 г углекислого газа. Сколько кислорода вступило в реакцию?'])
+ +secNav('lo1','p12')+readButton('p11');
+ wireReadBtn('p11');
+}
+
+function build_p12(){
+ document.getElementById('p12-body').innerHTML =
+ '
§ 12 · Химия 7
Составление уравнений химических реакций
'
+ +'
подбор коэффициентов
'
+ +'
Как уравнять реакцию, чтобы число атомов слева и справа совпало.
$\\text{H}_2+\\text{O}_2 \\to$ ? Ставим коэффициенты: $2\\text{H}_2+\\text{O}_2=2\\text{H}_2\\text{O}$. Слева и справа: 4 атома H и 2 атома O.
')
+ +'
Балансировщик: расставь коэффициенты
Подбери коэффициенты так, чтобы число атомов каждого элемента совпало слева и справа.
'
+ +'
'
+ +rememberBox(['Уравнивают только коэффициентами.','Индексы в формулах не трогают.','После расстановки проверь число атомов каждого элемента.'])
+ +qList(['Почему при уравнивании нельзя менять индексы?','Уравняй реакцию $\\text{P}+\\text{O}_2\\to\\text{P}_2\\text{O}_5$.','Что показывает коэффициент перед формулой?'])
+ +secNav('p11','final1')+readButton('p12');
+ wireReadBtn('p12');
+}
+
+function build_final1(){
+ document.getElementById('final1-body').innerHTML =
+ '
Финал главы 1
Босс: первоначальные химические понятия
'
+ +'
вещество · атом · формула · $M_r$ · валентность · уравнение
'
+ +'
Шесть интегрированных задач на всё, что изучено в главе. Реши все — получи звание «Мастер первоначальных понятий».
'
+ +makeCard('rule','Шпаргалка главы 1',null,'
'
+ +'
Тело — предмет, вещество — из чего он сделан; смеси разделяют по различию свойств.
'
+ +'
Атом — мельчайшая частица; элемент — атомы с одинаковым $Z$; $A_r$ — относительная атомная масса.
'
+ +'
Простое вещество — 1 элемент, сложное — разные; формула показывает состав.
'
+ +'
$M_r=\\sum A_r$; валентность: H — I, O — II; формула — по НОК валентностей.