From 244a0633638a4ec05cddcbdd1aae5596eb1bb9e9 Mon Sep 17 00:00:00 2001 From: Maxim Dolgolyov Date: Fri, 29 May 2026 22:50:01 +0300 Subject: [PATCH] =?UTF-8?q?feat(phys8=20ch1):=20Phase=201=20Wave=201=20?= =?UTF-8?q?=E2=80=94=20=C2=A71=20=C2=AB=D0=92=D0=BD=D1=83=D1=82=D1=80?= =?UTF-8?q?=D0=B5=D0=BD=D0=BD=D1=8F=D1=8F=20=D1=8D=D0=BD=D0=B5=D1=80=D0=B3?= =?UTF-8?q?=D0=B8=D1=8F=C2=BB=20+=20=C2=A72=20=C2=AB=D0=A1=D0=BF=D0=BE?= =?UTF-8?q?=D1=81=D0=BE=D0=B1=D1=8B=20=D0=B8=D0=B7=D0=BC=D0=B5=D0=BD=D0=B5?= =?UTF-8?q?=D0=BD=D0=B8=D1=8F=20U=C2=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit §1 — Внутренняя энергия: - 3 теории: определение U, факторы зависимости, сравнение состояний - IV-1: симуляция «холодный vs горячий газ» — 2 сосуда с молекулами, скорость ∝ √T_K, цвет по tempColor - IV-2: викторина из 6 раундов «У какого тела U больше?» - IV-3: DnD на 8 факторов «Зависит / Не зависит» - IV-4: MCQ-тренажёр на 6 вопросов с XP-наградой §2 — Способы изменения внутренней энергии: - 3 теории: 2 способа, 3 вида теплопередачи, примеры из жизни - IV-1: двойная анимация «работа (брусок-трение) vs теплопередача (контакт горячее+холодное)» с термометром и стрелками потока тепла - IV-2: викторина из 8 ситуаций «работа или теплопередача?» - IV-3: DnD-сортировка 8 ситуаций по 2 категориям - IV-4: MCQ-тренажёр с XP-бонусом Инфраструктура: _SIMS, _killSim, _isVisible — управление RAF для паузы симуляций при переключении секций. Co-Authored-By: Claude Opus 4.7 --- frontend/textbooks/physics_8_ch1.html | 657 +++++++++++++++++++++++++- 1 file changed, 651 insertions(+), 6 deletions(-) diff --git a/frontend/textbooks/physics_8_ch1.html b/frontend/textbooks/physics_8_ch1.html index b62fc53..d50d66c 100644 --- a/frontend/textbooks/physics_8_ch1.html +++ b/frontend/textbooks/physics_8_ch1.html @@ -271,8 +271,18 @@ const ACH_LABELS = { }; const SIDEBARS = { - p1:{title:"Шпаргалка § 1",rows:[["В разработке","Phase 1 Wave 1"]]}, - p2:{title:"Шпаргалка § 2",rows:[["В разработке","Phase 1 Wave 1"]]}, + p1:{title:"Шпаргалка § 1",rows:[ + ["$U$","сумма $E_k$ хаотич. движения молекул и $E_p$ их взаимодействия"], + ["Зависит от","$T$, $m$, агрегатного состояния, рода вещества"], + ["Не зависит от","скорости тела как целого, высоты, формы, цвета"], + ["При нагреве","молекулы быстрее $\\Rightarrow$ $U$ растёт"] + ]}, + p2:{title:"Шпаргалка § 2",rows:[ + ["Способа 2","совершение работы и теплопередача"], + ["Работа","трение, удар, сжатие газа, деформация"], + ["Теплопередача","проводность, конвекция, излучение"], + ["Знак","нагрев $\\Rightarrow$ $\\Delta U > 0$; охлаждение $\\Rightarrow$ $\\Delta U < 0$"] + ]}, p3:{title:"Шпаргалка § 3",rows:[["В разработке","Phase 1 Wave 2"]]}, p4:{title:"Шпаргалка § 4",rows:[["В разработке","Phase 1 Wave 2"]]}, p5:{title:"Шпаргалка § 5",rows:[["В разработке","Phase 1 Wave 2"]]}, @@ -286,8 +296,8 @@ const SIDEBARS = { }; const TIPS=[ - {sec:'p1',html:"Параграф § 1 будет реализован в Phase 1 Wave 1. Используем хелперы из phys.js и optics.js."}, - {sec:'p2',html:"Параграф § 2 будет реализован в Phase 1 Wave 1. Используем хелперы из phys.js и optics.js."}, + {sec:'p1',html:"Тело состоит из молекул. Они движутся (есть $E_k$) и взаимодействуют (есть $E_p$). Их сумма — внутренняя энергия $U$. Главное: $U$ не зависит от того, движется ли тело и на какой высоте оно лежит."}, + {sec:'p2',html:"Изменить $U$ можно двумя способами: совершить работу (трение, сжатие, удар) или передать тепло без работы (контакт, поток, излучение). Чай в стакане остывает — это теплопередача. Спички в коробке нагреваются от тряски — это работа."}, {sec:'p3',html:"Параграф § 3 будет реализован в Phase 1 Wave 2. Используем хелперы из phys.js и optics.js."}, {sec:'p4',html:"Параграф § 4 будет реализован в Phase 1 Wave 2. Используем хелперы из phys.js и optics.js."}, {sec:'p5',html:"Параграф § 5 будет реализован в Phase 1 Wave 2. Используем хелперы из phys.js и optics.js."}, @@ -301,8 +311,8 @@ const TIPS=[ ]; const BUILDERS = { - p1: ()=>{ const box=document.getElementById('p1-body'); box.innerHTML = buildStub('p1', 'Внутренняя энергия', 'Phase 1 Wave 1') + secNavFor('p1') + readButton('p1'); renderMath(box); wireReadBtn('p1'); }, - p2: ()=>{ const box=document.getElementById('p2-body'); box.innerHTML = buildStub('p2', 'Способы изменения внутренней энергии', 'Phase 1 Wave 1') + secNavFor('p2') + readButton('p2'); renderMath(box); wireReadBtn('p2'); }, + p1: ()=>{ build_p1(); }, + p2: ()=>{ build_p2(); }, p3: ()=>{ const box=document.getElementById('p3-body'); box.innerHTML = buildStub('p3', 'Теплопроводность', 'Phase 1 Wave 2') + secNavFor('p3') + readButton('p3'); renderMath(box); wireReadBtn('p3'); }, p4: ()=>{ const box=document.getElementById('p4-body'); box.innerHTML = buildStub('p4', 'Конвекция', 'Phase 1 Wave 2') + secNavFor('p4') + readButton('p4'); renderMath(box); wireReadBtn('p4'); }, p5: ()=>{ const box=document.getElementById('p5-body'); box.innerHTML = buildStub('p5', 'Излучение', 'Phase 1 Wave 2') + secNavFor('p5') + readButton('p5'); renderMath(box); wireReadBtn('p5'); }, @@ -652,6 +662,641 @@ function initSidebarToggle(){ document.addEventListener('keydown',e=>{ if(e.key==='Escape') close(); }); } +/* ====================================================================== + PHASE 1 · WAVE 1 — §1, §2 + ====================================================================== */ + +/* Глобальное состояние симуляций — чтобы можно было остановить при unmount */ +const _SIMS = {}; +function _killSim(key){ if(_SIMS[key] && _SIMS[key].raf){ cancelAnimationFrame(_SIMS[key].raf); _SIMS[key].raf=0; } } +function _isVisible(secId){ const el=document.getElementById('sec-'+secId); return el && el.classList.contains('active'); } + +/* ======== §1 — Внутренняя энергия ======== */ +function build_p1(){ + const box = document.getElementById('p1-body'); + let h = ''; + + /* 3 теоретические карточки */ + h += makeCard('theory', 'Что такое внутренняя энергия', '§ 1.1', + '

Любое тело состоит из молекул. Молекулы непрерывно движутся (имеют кинетическую энергию $E_k$) и взаимодействуют друг с другом (имеют потенциальную энергию $E_p$).

' + +'

Внутренняя энергия $U$ тела — это сумма $E_k$ хаотического движения всех молекул и $E_p$ их взаимодействия:

' + +'

$U = \\sum E_k\\,(\\text{молекул}) + \\sum E_p\\,(\\text{взаимодействия})$

' + +'

В отличие от механической энергии, $U$ не зависит от того, движется ли тело и на какой оно высоте.

' + ); + h += makeCard('rule', 'От чего зависит $U$', '§ 1.2', + '

Внутренняя энергия тела растёт, если:

' + +'' + +'

$U$ не зависит от того, движется ли тело как целое, и от его высоты над поверхностью земли.

' + ); + h += makeCard('example', 'Сравнение', '§ 1.3', + '

В стакане 200 г воды при $t = 20$ °C. Сравним $U$ в трёх ситуациях:

' + +'
    ' + +'
  1. стакан стоит на столе;
    2. ' + +'
  2. стакан подняли на полку высотой 1,5 м;
    3. ' + +'
  3. стакан несут в поезде со скоростью 60 км/ч.
    4. ' + +'
' + +'

Во всех трёх случаях $U$ одинакова, потому что $T$, $m$ и агрегатное состояние воды не изменились.

' + ); + + /* IV1 — Симуляция «Холодный vs горячий газ» */ + h += '
' + +'
IV-1
Холодный и горячий газ
' + +'
Двигайте slider\'ы $T_1$ и $T_2$ — наблюдайте, как меняется скорость молекул. Чем выше $T$, тем быстрее они движутся и тем больше внутренняя энергия $U$.
' + +'
' + +'' + +'' + +'
' + +'' + +'
' + +'Левый: $T_1 = $ 293 К,  ср. скорость молекул 100%' + +'Правый: $T_2 = $ 573 К,  ср. скорость молекул 140%' + +'У какого тела больше $U$? — у того, где молекулы быстрее.' + +'
' + +'
'; + + /* IV2 — Викторина «Где больше U?» */ + h += '
' + +'
IV-2
У какого тела больше $U$?
' + +'
Сравните две ситуации и выберите ту, у которой больше внутренняя энергия, или «одинаково», если они равны.
' + +'
' + +'
' + +'
Раунд: 1 / 6Правильно: 0
' + +'
'; + + /* IV3 — DnD «Зависит / Не зависит» */ + h += '
' + +'
IV-3
От чего зависит $U$?
' + +'
Перетащите чипы в нужную колонку. Подсказка: $U$ — это о молекулах, а не о теле как целом.
' + +'
' + +'
' + +'
Зависит
' + +'
Не зависит
' + +'
' + +'
' + +'' + +'
'; + + /* IV4 — MCQ тренажёр */ + h += '
' + +'
IV-4
Тренажёр: 6 вопросов
' + +'
Ответьте на 6 вопросов о внутренней энергии. Достаточно 4 правильных, чтобы получить +15 XP.
' + +'
' + +'
Вопрос: 1 / 6Правильно: 0
' + +'
'; + + box.innerHTML = h + secNavFor('p1') + readButton('p1'); + renderMath(box); + wireReadBtn('p1'); + + _initP1_sim(); + _initP1_quiz(); + _initP1_dnd(); + _initP1_mcq(); +} + +/* === §1 IV-1: газ-симуляция === */ +function _initP1_sim(){ + _killSim('p1sim'); + const svg = document.getElementById('p1-sim'); if(!svg) return; + const W=460, H=200, boxW=200, boxH=160, gap=20; + const L = {x:gap, y:(H-boxH)/2, w:boxW, h:boxH}; + const R = {x:W-gap-boxW, y:(H-boxH)/2, w:boxW, h:boxH}; + /* частицы */ + const Nl = 22, Nr = 22; + function makeParticles(N, box){ + const arr = []; + for(let i=0;i box.x+box.w-4) { p.x = box.x+box.w-4; p.vx = -p.vx; } + if(p.y < box.y+4) { p.y = box.y+4; p.vy = -p.vy; } + if(p.y > box.y+box.h-4) { p.y = box.y+box.h-4; p.vy = -p.vy; } + } + } + function render(){ + if(!_isVisible('p1')) { _SIMS.p1sim.raf = requestAnimationFrame(render); return; } + const k1 = getSpeed(T1), k2 = getSpeed(T2); + step(pL, L, k1); step(pR, R, k2); + /* HSL цвет — холодный → синий, горячий → красный */ + const cL = window.PHYS.tempColor(T1, -100, 500); + const cR = window.PHYS.tempColor(T2, -100, 500); + let s = ''; + s += ''; + s += ''; + for(const p of pL) s += ''; + for(const p of pR) s += ''; + s += 'T = '+T1+' °C'; + s += 'T = '+T2+' °C'; + svg.innerHTML = s; + _SIMS.p1sim.raf = requestAnimationFrame(render); + } + _SIMS.p1sim = { raf: 0 }; + _SIMS.p1sim.raf = requestAnimationFrame(render); + + function update(){ + T1 = +document.getElementById('p1-t1').value; + T2 = +document.getElementById('p1-t2').value; + document.getElementById('p1-t1v').textContent = T1; + document.getElementById('p1-t2v').textContent = T2; + document.getElementById('p1-t1k').textContent = (273 + T1); + document.getElementById('p1-t2k').textContent = (273 + T2); + const v1 = Math.round(getSpeed(T1)*100); + const v2 = Math.round(getSpeed(T2)*100); + document.getElementById('p1-v1').textContent = v1; + document.getElementById('p1-v2').textContent = v2; + } + document.getElementById('p1-t1').addEventListener('input', update); + document.getElementById('p1-t2').addEventListener('input', update); + update(); +} + +/* === §1 IV-2: викторина «Где больше U?» === */ +function _initP1_quiz(){ + const QS = [ + {A:'1 кг воды при $t = 20$ °C', B:'1 кг воды при $t = 80$ °C', ans:'B', why:'При большей $T$ молекулы движутся быстрее $\\Rightarrow$ больше $U$.'}, + {A:'1 кг льда при $0$ °C', B:'1 кг воды при $0$ °C', ans:'B', why:'При плавлении (0 °C, лёд$\\to$вода) поглощается теплота, поэтому у воды $U$ больше.'}, + {A:'2 кг железа при $100$ °C', B:'1 кг железа при $100$ °C', ans:'A', why:'У большей массы — больше молекул, значит больше $U$.'}, + {A:'Камень на полу', B:'Тот же камень на полке (1 м выше)', ans:'C', why:'$U$ не зависит от высоты. Это потенциальная механическая энергия, а не внутренняя.'}, + {A:'Покоящийся теннисный мяч', B:'Тот же мяч, летящий со скоростью 20 м/с', ans:'C', why:'$U$ не зависит от скорости тела как целого.'}, + {A:'1 кг воды при $100$ °C', B:'1 кг водяного пара при $100$ °C', ans:'B', why:'При кипении (вода$\\to$пар) поглощается большая теплота. У пара $U$ больше.'} + ]; + let i = 0, ok = 0; + function render(){ + const q = QS[i]; + const wrap = document.getElementById('p1-quiz'); + if(!wrap) return; + wrap.innerHTML = + '
' + +'' + +'' + +'
' + +'
' + +''; + document.getElementById('p1-quiz-r').textContent = (i+1); + document.getElementById('p1-quiz-ok').textContent = ok; + wrap.querySelectorAll('[data-pick]').forEach(btn=>{ + btn.addEventListener('click', ()=>{ + if(btn.disabled) return; + const pick = btn.dataset.pick; + wrap.querySelectorAll('[data-pick]').forEach(b=>b.disabled=true); + const fb = document.getElementById('p1-quiz-fb'); + if(pick === q.ans){ + ok++; + fb.className = 'feedback ok'; fb.innerHTML = '✓ Верно. '+q.why; + addXp(3, 'p1-quiz'); bumpProgress('p1', 4); + } else { + fb.className = 'feedback fail'; fb.innerHTML = '✗ Не то. '+q.why; + } + document.getElementById('p1-quiz-ok').textContent = ok; + renderMath(wrap); + }); + }); + renderMath(wrap); + } + document.getElementById('p1-quiz-next').addEventListener('click', ()=>{ + i = (i+1) % QS.length; render(); + }); + render(); +} + +/* === §1 IV-3: DnD сортировка === */ +function _initP1_dnd(){ + const items = [ + {id:'t', cat:'dep', html:'температура $T$'}, + {id:'m', cat:'dep', html:'масса $m$'}, + {id:'ag', cat:'dep', html:'агрегатное состояние'}, + {id:'rd', cat:'dep', html:'род вещества'}, + {id:'sp', cat:'indep', html:'скорость тела как целого'}, + {id:'h', cat:'indep', html:'высота над землёй'}, + {id:'fm', cat:'indep', html:'форма тела'}, + {id:'cl', cat:'indep', html:'цвет тела'} + ]; + const wg = document.querySelector('#sec-p1 .wg:nth-of-type(7)'); /* IV-3 — 7-й (3 теории + IV1+IV2+IV3) */ + const dnd = setupSorter({ + poolId:'p1-dnd-pool', + scopeSelector:'#sec-p1', + cats:['dep','indep'], + items: items, + columnLayout:false + }); + document.getElementById('p1-dnd-check').addEventListener('click', ()=>{ + const fb = document.getElementById('p1-dnd-fb'); + let wrong = 0, total = items.length; + items.forEach(it=>{ if(dnd.placed[it.id] !== it.cat) wrong++; }); + if(wrong === 0){ + fb.className = 'feedback ok'; fb.innerHTML = '✓ Идеально! +15 XP. $U$ — это про молекулы, а не про движение тела или его положение.'; + addXp(15, 'p1-dnd'); bumpProgress('p1', 20); + } else { + fb.className = 'feedback fail'; fb.innerHTML = '✗ Ошибок: '+wrong+' из '+total+'. Помните: $U$ зависит от $T$, $m$, агрегатного состояния и рода вещества.'; + } + renderMath(fb); + }); + document.getElementById('p1-dnd-reset').addEventListener('click', ()=>{ + dnd.reset(); + const fb = document.getElementById('p1-dnd-fb'); fb.style.display='none'; + }); +} + +/* === §1 IV-4: MCQ-тренажёр === */ +function _initP1_mcq(){ + const QS = [ + {q:'Из чего складывается внутренняя энергия?', opts:['Только из $E_k$ молекул','$E_k$ + $E_p$ всех молекул','Из массы и объёма','Из температуры'], ans:1, why:'$U$ — сумма кинетических энергий хаотического движения и потенциальных энергий взаимодействия молекул.'}, + {q:'При нагревании тела его внутренняя энергия…', opts:['уменьшается','растёт','не меняется','становится отрицательной'], ans:1, why:'Молекулы движутся быстрее $\\Rightarrow$ $U$ растёт.'}, + {q:'Зависит ли $U$ от скорости движения тела как целого?', opts:['да','нет','только для газов','только при $v > 100$ м/с'], ans:1, why:'$U$ зависит только от хаотического движения молекул внутри тела.'}, + {q:'У какого тела $U$ больше: у стакана воды на столе или у того же стакана, поднятого на 1 м?', opts:['на полу','на полке','одинакова','зависит от формы стакана'], ans:2, why:'Высота не влияет на $U$ — это про механическую $E_p$, а не про внутреннюю.'}, + {q:'Изменится ли $U$, если вещество переходит из твёрдого в жидкое состояние при той же температуре?', opts:['нет','да, растёт','да, уменьшается','зависит от формы тела'], ans:1, why:'При плавлении рвутся связи между молекулами, поглощается теплота $\\Rightarrow$ $U$ растёт.'}, + {q:'Какое из утверждений верно?', opts:['$U$ — это $mv^2/2$ тела','$U$ — это $mgh$ тела','$U$ — это $E_k+E_p$ молекул внутри','$U$ — это объём $\\times$ давление'], ans:2, why:'$U$ — энергия молекул, не имеет отношения к движению или положению тела как целого.'} + ]; + let i = 0, ok = 0, done = 0, awarded = false; + function render(){ + const q = QS[i]; + const wrap = document.getElementById('p1-mcq'); + if(!wrap) return; + let h = '
Вопрос '+(i+1)+'. '+q.q+'
'; + h += '
'; + q.opts.forEach((opt, k)=>{ + h += ''; + }); + h += '
'; + h += '
'; + wrap.innerHTML = h; + document.getElementById('p1-mcq-i').textContent = (i+1); + document.getElementById('p1-mcq-ok').textContent = ok; + wrap.querySelectorAll('[data-k]').forEach(btn=>{ + btn.addEventListener('click', ()=>{ + if(btn.disabled) return; + wrap.querySelectorAll('[data-k]').forEach(b=>b.disabled=true); + const k = +btn.dataset.k; + const fb = document.getElementById('p1-mcq-fb'); + if(k === q.ans){ + ok++; done++; + fb.className='feedback ok'; fb.innerHTML='✓ Верно. '+q.why; + addXp(2,'p1-mcq'); bumpProgress('p1', 3); + } else { + done++; + fb.className='feedback fail'; fb.innerHTML='✗ Не то. '+q.why; + } + document.getElementById('p1-mcq-ok').textContent = ok; + renderMath(wrap); + if(done >= QS.length && !awarded && ok >= 4){ + awarded = true; + setTimeout(()=>{ + const wgFb = document.getElementById('p1-mcq-fb'); + wgFb.className='feedback ok'; + wgFb.innerHTML='✓ +15 XP — тренажёр пройден ('+ok+' из '+QS.length+').'; + addXp(15,'p1-mcq-bonus'); bumpProgress('p1', 15); + }, 600); + } + }); + }); + const nextBtn = document.getElementById('p1-mcq-next'); + if(nextBtn) nextBtn.addEventListener('click', ()=>{ i=(i+1)%QS.length; render(); }); + renderMath(wrap); + } + render(); +} + +/* ======== §2 — Способы изменения внутренней энергии ======== */ +function build_p2(){ + const box = document.getElementById('p2-body'); + let h = ''; + + h += makeCard('theory', 'Два способа', '§ 2.1', + '

Внутреннюю энергию тела $U$ можно изменить двумя принципиально разными способами:

' + +'
    ' + +'
  • Совершение работы. Над телом или само тело совершает работу (трение, сжатие газа, удар, деформация). $U$ растёт.
    • ' + +'
  • Теплопередача. Энергия передаётся от более горячего тела к более холодному без совершения работы.
    • ' + +'
' + +'

Изменение внутренней энергии обозначают $\\Delta U$. Если $T$ растёт — $\\Delta U > 0$, если падает — $\\Delta U < 0$.

' + ); + h += makeCard('rule', 'Три вида теплопередачи', '§ 2.2', + '

Теплопередача бывает трёх видов:

' + +'
    ' + +'
  1. Теплопроводность (§ 3) — через прямой контакт частиц. Металлическая ложка в чае нагревается.
    2. ' + +'
  2. Конвекция (§ 4) — потоками жидкости или газа. Радиатор греет комнату.
    3. ' + +'
  3. Излучение (§ 5) — электромагнитными волнами, даже через вакуум. Солнце греет Землю.
    4. ' + +'
' + ); + h += makeCard('example', 'Примеры из жизни', '§ 2.3', + '
    ' + +'
  • Трёшь ладони — нагреваются. Работа сил трения.
    • ' + +'
  • Спички в коробке встряхиваешь — нагреваются. Работа.
    • ' + +'
  • Чай в стакане остывает. Теплопередача (излучение + конвекция).
    • ' + +'
  • Ложка в горячем чае нагревается. Теплопередача (теплопроводность).
    • ' + +'
  • Велосипедный насос нагревается при работе. Работа (сжатие газа).
    • ' + +'
' + ); + + /* IV1 — анимация: трение vs контакт */ + h += '
' + +'
IV-1
Два способа: работа и теплопередача
' + +'
Слева — работа: брусок скользит по доске, трение нагревает его. Справа — теплопередача: горячее тело отдаёт энергию холодному при контакте, температуры выравниваются.
' + +'' + +'
' + +'
' + +'Брусок (трение): $T = $ 20 °C, $\\Delta U$ растёт' + +'Контакт: $T_{гор} = $ 90 °C, $T_{хол} = $ 10 °C' + +'
' + +'
'; + + /* IV2 — викторина «работа или теплопередача» */ + h += '
' + +'
IV-2
Работа или теплопередача?
' + +'
Прочитай ситуацию и определи, как меняется внутренняя энергия: совершается работа или происходит теплопередача.
' + +'
' + +'
' + +'
Раунд: 1 / 8Правильно: 0
' + +'
'; + + /* IV3 — DnD «работа vs теплопередача» */ + h += '
' + +'
IV-3
Сортировка ситуаций
' + +'
Перетащите чипы в нужную колонку. Работа — когда силы перемещают что-то (трение, сжатие, удар). Теплопередача — без работы, просто через контакт, поток или излучение.
' + +'
' + +'
' + +'
Работа
' + +'
Теплопередача
' + +'
' + +'
' + +'' + +'
'; + + /* IV4 — MCQ тренажёр */ + h += '
' + +'
IV-4
Тренажёр: 6 вопросов
' + +'
Достаточно 4 правильных ответов, чтобы получить +15 XP.
' + +'
' + +'
Вопрос: 1 / 6Правильно: 0
' + +'
'; + + box.innerHTML = h + secNavFor('p2') + readButton('p2'); + renderMath(box); + wireReadBtn('p2'); + + _initP2_sim(); + _initP2_quiz(); + _initP2_dnd(); + _initP2_mcq(); +} + +/* === §2 IV-1: симуляция «работа vs теплопередача» === */ +function _initP2_sim(){ + _killSim('p2sim'); + const svg = document.getElementById('p2-sim'); if(!svg) return; + const W=460, H=200; + /* левая сцена: брусок скользит по доске */ + /* правая сцена: два тела касаются, температуры → среднее */ + let running = false; + let tA = 20; /* температура бруска */ + let tH = 90, tC = 10; /* контакт горячий/холодный */ + let blockX = 60; + let t = 0; + function reset(){ + tA = 20; tH = 90; tC = 10; blockX = 60; t = 0; + document.getElementById('p2-tA').textContent = '20'; + document.getElementById('p2-uA').textContent = '0'; + document.getElementById('p2-tH').textContent = '90'; + document.getElementById('p2-tC').textContent = '10'; + paint(); + } + function paint(){ + let s = ''; + /* === ЛЕВАЯ СЦЕНА: трение === */ + /* доска */ + s += ''; + /* штриховка под доской */ + for(let i=22;i<218;i+=10) s += ''; + /* брусок (цвет по температуре) */ + const cA = window.PHYS.tempColor(tA, 20, 80); + s += ''; + /* стрелка-сила F (рука толкает) */ + s += window.PHYS.drawArrow ? window.PHYS.drawArrow(blockX-30, 106, blockX-5, 106, '#10b981', 2.2, 9) : ''; + s += 'F'; + /* трение (внизу бруска) */ + s += 'трение нагревает'; + /* термометр для бруска */ + s += window.PHYS.thermometer(220, 50, 80, 0, 100, tA); + /* подпись */ + s += 'РАБОТА (трение)'; + /* === разделитель === */ + s += ''; + /* === ПРАВАЯ СЦЕНА: контакт === */ + const cH = window.PHYS.tempColor(tH, 0, 100); + const cCo = window.PHYS.tempColor(tC, 0, 100); + s += ''; + s += ''; + /* стрелки потока тепла */ + s += window.PHYS.drawArrow ? window.PHYS.drawArrow(326, 100, 344, 100, '#dc2626', 2.2, 8) : ''; + s += window.PHYS.drawArrow ? window.PHYS.drawArrow(326, 120, 344, 120, '#dc2626', 2.2, 8) : ''; + s += 'Q'; + /* подписи температур */ + s += ''+tH.toFixed(0)+' °C'; + s += ''+tC.toFixed(0)+' °C'; + s += 'ТЕПЛОПЕРЕДАЧА'; + svg.innerHTML = s; + } + function tick(){ + if(!running){ _SIMS.p2sim.raf = requestAnimationFrame(tick); return; } + if(!_isVisible('p2')){ _SIMS.p2sim.raf = requestAnimationFrame(tick); return; } + t += 1; + /* брусок двигается слева направо и нагревается */ + blockX += 0.8; + if(blockX > 170){ blockX = 60; } + if(tA < 80) tA += 0.18; + /* контакт: tH и tC сходятся к среднему */ + const avg = (tH + tC) / 2; + if(Math.abs(tH - avg) > 0.05){ + tH -= (tH - avg) * 0.012; + tC += (avg - tC) * 0.012; + } + document.getElementById('p2-tA').textContent = tA.toFixed(0); + document.getElementById('p2-uA').textContent = (tA - 20).toFixed(0) === '0' ? '0' : '+'+(tA - 20).toFixed(0); + document.getElementById('p2-tH').textContent = tH.toFixed(0); + document.getElementById('p2-tC').textContent = tC.toFixed(0); + paint(); + _SIMS.p2sim.raf = requestAnimationFrame(tick); + } + document.getElementById('p2-sim-start').addEventListener('click', ()=>{ + running = !running; + document.getElementById('p2-sim-start').textContent = running ? 'Пауза' : 'Запустить'; + }); + document.getElementById('p2-sim-reset').addEventListener('click', ()=>{ + running = false; + document.getElementById('p2-sim-start').textContent = 'Запустить'; + reset(); + }); + _SIMS.p2sim = { raf: 0 }; + reset(); + _SIMS.p2sim.raf = requestAnimationFrame(tick); +} + +/* === §2 IV-2: викторина работа/теплопередача === */ +function _initP2_quiz(){ + const QS = [ + {sit:'Долго трёшь руки одна о другую — они нагреваются.', ans:'W', why:'Работа сил трения переходит во внутреннюю энергию рук.'}, + {sit:'Чай в стакане остывает на столе.', ans:'H', why:'Теплопередача от чая в воздух и стенки стакана — без совершения работы.'}, + {sit:'Велосипедный насос нагревается при накачивании колеса.', ans:'W', why:'Воздух в насосе сжимается — над ним совершается работа.'}, + {sit:'Металлическая ложка в горячем чае нагревается.', ans:'H', why:'Теплопередача (теплопроводность) от чая к ложке.'}, + {sit:'Гвоздь забивают молотком — шляпка гвоздя нагревается.', ans:'W', why:'Кинетическая энергия молотка переходит в работу деформации/трения.'}, + {sit:'Лёд в холодильнике плавится, если открыть дверцу.', ans:'H', why:'Тёплый воздух комнаты передаёт энергию льду.'}, + {sit:'Греется проволока в фене — горячий воздух дует на руки.', ans:'H', why:'Конвекция: поток горячего воздуха переносит энергию.'}, + {sit:'Спички в коробке от долгой тряски нагрелись.', ans:'W', why:'Работа сил трения внутри коробки.'} + ]; + let i = 0, ok = 0; + function render(){ + const q = QS[i]; + const wrap = document.getElementById('p2-quiz'); + if(!wrap) return; + wrap.innerHTML = + '
'+q.sit+'
' + +'
' + +'' + +'' + +'
' + +''; + document.getElementById('p2-quiz-r').textContent = (i+1); + document.getElementById('p2-quiz-ok').textContent = ok; + wrap.querySelectorAll('[data-pick]').forEach(btn=>{ + btn.addEventListener('click', ()=>{ + if(btn.disabled) return; + const pick = btn.dataset.pick; + wrap.querySelectorAll('[data-pick]').forEach(b=>b.disabled=true); + const fb = document.getElementById('p2-quiz-fb'); + if(pick === q.ans){ + ok++; + fb.className='feedback ok'; fb.innerHTML='✓ Верно. '+q.why; + addXp(3,'p2-quiz'); bumpProgress('p2', 4); + } else { + fb.className='feedback fail'; fb.innerHTML='✗ Не то. '+q.why; + } + document.getElementById('p2-quiz-ok').textContent = ok; + }); + }); + } + document.getElementById('p2-quiz-next').addEventListener('click', ()=>{ + i = (i+1) % QS.length; render(); + }); + render(); +} + +/* === §2 IV-3: DnD сортировка === */ +function _initP2_dnd(){ + const items = [ + {id:'a', cat:'work', html:'трение ладонями'}, + {id:'b', cat:'work', html:'сжатие воздуха в насосе'}, + {id:'c', cat:'work', html:'удар молотком по гвоздю'}, + {id:'d', cat:'work', html:'строгание доски рубанком'}, + {id:'e', cat:'heat', html:'остывание чая в стакане'}, + {id:'f', cat:'heat', html:'нагрев ложки в супе'}, + {id:'g', cat:'heat', html:'Солнце греет асфальт'}, + {id:'h', cat:'heat', html:'батарея греет комнату'} + ]; + const dnd = setupSorter({ + poolId:'p2-dnd-pool', + scopeSelector:'#sec-p2', + cats:['work','heat'], + items: items, + columnLayout:false + }); + document.getElementById('p2-dnd-check').addEventListener('click', ()=>{ + const fb = document.getElementById('p2-dnd-fb'); + let wrong = 0, total = items.length; + items.forEach(it=>{ if(dnd.placed[it.id] !== it.cat) wrong++; }); + if(wrong === 0){ + fb.className='feedback ok'; fb.innerHTML='✓ Идеально! +15 XP. Работа связана с движением макротел, теплопередача — с разностью температур.'; + addXp(15,'p2-dnd'); bumpProgress('p2', 20); + } else { + fb.className='feedback fail'; fb.innerHTML='✗ Ошибок: '+wrong+' из '+total+'. Подсказка: трение, сжатие, удар, строгание — это работа.'; + } + }); + document.getElementById('p2-dnd-reset').addEventListener('click', ()=>{ + dnd.reset(); + const fb = document.getElementById('p2-dnd-fb'); fb.style.display='none'; + }); +} + +/* === §2 IV-4: MCQ тренажёр === */ +function _initP2_mcq(){ + const QS = [ + {q:'Какими способами можно изменить $U$ тела?', opts:['Только работой','Только теплопередачей','Работой и теплопередачей','Только нагревом'], ans:2, why:'Это два равноправных способа.'}, + {q:'Что нагревает наковальню при ковке?', opts:['Теплопередача','Работа удара','Излучение','Конвекция'], ans:1, why:'Кинетическая энергия молотка совершает работу деформации.'}, + {q:'Какой вид теплопередачи греет руку от костра, если не подходить близко?', opts:['Теплопроводность','Конвекция','Излучение','Работа'], ans:2, why:'Через воздух (плохой проводник) и без контакта — это излучение.'}, + {q:'Чай в термосе долго не остывает, потому что…', opts:['у термоса большая масса','стенки термоса тонкие','двойные стенки и вакуум между ними подавляют все виды теплопередачи','чай совершает работу'], ans:2, why:'Вакуум — нет конвекции и проводности; зеркальные стенки уменьшают излучение.'}, + {q:'Какой пример НЕ относится к теплопередаче?', opts:['Ложка нагрелась в супе','Воздух у радиатора поднимается вверх','Снег тает на солнце','Гвоздь нагрелся, когда его забили молотком'], ans:3, why:'Гвоздь нагрелся работой удара.'}, + {q:'Знак $\\Delta U$ для остывающего тела?', opts:['$\\Delta U > 0$','$\\Delta U < 0$','$\\Delta U = 0$','зависит от массы'], ans:1, why:'$T$ падает $\\Rightarrow$ $U$ уменьшается $\\Rightarrow$ $\\Delta U < 0$.'} + ]; + let i = 0, ok = 0, done = 0, awarded = false; + function render(){ + const q = QS[i]; + const wrap = document.getElementById('p2-mcq'); + if(!wrap) return; + let h = '
Вопрос '+(i+1)+'. '+q.q+'
'; + h += '
'; + q.opts.forEach((opt, k)=>{ + h += ''; + }); + h += '
'; + h += '
'; + wrap.innerHTML = h; + document.getElementById('p2-mcq-i').textContent = (i+1); + document.getElementById('p2-mcq-ok').textContent = ok; + wrap.querySelectorAll('[data-k]').forEach(btn=>{ + btn.addEventListener('click', ()=>{ + if(btn.disabled) return; + wrap.querySelectorAll('[data-k]').forEach(b=>b.disabled=true); + const k = +btn.dataset.k; + const fb = document.getElementById('p2-mcq-fb'); + if(k === q.ans){ + ok++; done++; + fb.className='feedback ok'; fb.innerHTML='✓ Верно. '+q.why; + addXp(2,'p2-mcq'); bumpProgress('p2', 3); + } else { + done++; + fb.className='feedback fail'; fb.innerHTML='✗ Не то. '+q.why; + } + document.getElementById('p2-mcq-ok').textContent = ok; + renderMath(wrap); + if(done >= QS.length && !awarded && ok >= 4){ + awarded = true; + setTimeout(()=>{ + const wgFb = document.getElementById('p2-mcq-fb'); + wgFb.className='feedback ok'; + wgFb.innerHTML='✓ +15 XP — тренажёр пройден ('+ok+' из '+QS.length+').'; + addXp(15,'p2-mcq-bonus'); bumpProgress('p2', 15); + }, 600); + } + }); + }); + const nextBtn = document.getElementById('p2-mcq-next'); + if(nextBtn) nextBtn.addEventListener('click', ()=>{ i=(i+1)%QS.length; render(); }); + renderMath(wrap); + } + render(); +} + function init(){ loadProgress(); initTheme(); initSidebarToggle(); initSearch(); buildParaSelector(); refreshProgressUI(); loadServerReadState(); goTo(PARAS[0].id);