From 83aad34e8b73affa4774a3fb8b96c3e898b3ca69 Mon Sep 17 00:00:00 2001 From: Maxim Dolgolyov Date: Sat, 30 May 2026 10:47:15 +0300 Subject: [PATCH] =?UTF-8?q?feat(phys7=20ch1):=20Phase=201=20Wave=202=20?= =?UTF-8?q?=E2=80=94=20=C2=A73,=20=C2=A74,=20=C2=A75?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit WIDGETS (+347 строк к phys7_ch1_widgets.js, теперь 749 строк, экспорт p1..p5): §3 «Методы исследования в физике»: - 3 карточки (3 метода / отличия / опыт Галилея на Пизанской башне) - IV-1 СИМ: timeline-список 5 исторических опытов (Архимед→Галилей→Торричелли→Паскаль→Ньютон) с раскрывающимися деталями - IV-2 КВИЗ: 4 вопроса «опыт vs наблюдение vs гипотеза vs теория» - IV-3 DnD: 8 ситуаций по 3 корзинам (наблюдение / эксперимент / гипотеза) - IV-4 ТРН: 5 вопросов закрепления §4 «Прямые и косвенные измерения» (S=ab, V=abc, rho=m/V): - 3 карточки (типы измерений / основные формулы / объём картофеля по вытеснению) - IV-1 СИМ: палитра 6 приборов (линейка/весы/термометр/секундомер/мензурка/динамометр) с единицами - IV-2 КАЛЬК (главный визуал §4): 4 slider'а a, b, c (см) и m (г) → пересчёт S, V, плотности с угадыванием вещества (дерево / алюминий / железо / свинец / золото) - IV-3 DnD: 8 примеров измерений → прямое / косвенное - IV-4 ТРН: 5 расчётных задач (площадь, объём кирпича, плотность, скорость, вытеснение) §5 «Единицы измерения. СИ»: - 3 карточки (зачем СИ / 7 основных единиц в таблице / приставки от нано до гига) - IV-1 СИМ: 7 цветных карт основных единиц СИ - IV-2 КАЛЬК конвертер: число × приставка (Г/М/к/—/с/м/мк/н) × единица (м/г/с/Вт/Гц/Н) → результат с автоформатированием (экспоненциальная запись для больших/малых) - IV-3 DnD: 8 величин → 5 основных единиц СИ - IV-4 ТРН: 5 задач на перевод (км→м, кг→г, ч→с, мс→с, см²→м²) Pre-commit, parse-check, KaTeX-аудит (одиночные backslash =0), smoke-test (экспорт=5) пройдены. --- frontend/js/phys7_ch1_widgets.js | 353 ++++++++++++++++++++++++++++++- 1 file changed, 350 insertions(+), 3 deletions(-) diff --git a/frontend/js/phys7_ch1_widgets.js b/frontend/js/phys7_ch1_widgets.js index d8163d5..13dbe37 100644 --- a/frontend/js/phys7_ch1_widgets.js +++ b/frontend/js/phys7_ch1_widgets.js @@ -392,11 +392,358 @@ function add_p2(){ renderMath(body); } -/* Экспорт — заглушки для остальных §, добавятся в следующих волнах */ +/* ========================================================== */ +/* §3 — Методы исследования в физике */ +/* ========================================================== */ +function add_p3(){ + const body = document.getElementById('p3-body'); + if(!body) return; + let h = ''; + + h += makeCard('theory', 'Как физики изучают природу', '§ 3.1', + 'Физика использует три метода познания:' + + '
    ' + + '
  1. Наблюдение — изучение явления без вмешательства. Учёный смотрит, фиксирует, не изменяя условий.
    2. ' + + '
  2. Эксперимент — целенаправленное воссоздание явления в нужных условиях с измерениями.
    3. ' + + '
  3. Теоретическое описание — построение модели, формул, законов; гипотеза сначала, потом — проверка.
    4. ' + + '
'); + + h += makeCard('rule', 'Чем отличаются?', '§ 3.2', + 'Наблюдение: смотрим за грозой — не запускаем её сами.
' + + 'Эксперимент: бросаем шары разной массы в трубке без воздуха и измеряем время падения.
' + + 'Гипотеза: «может быть, тела падают одинаково в вакууме?» — её надо проверить экспериментом.
' + + 'Теория: подтверждённая гипотеза становится частью знаний — например, закон всемирного тяготения.'); + + h += makeCard('example', 'Опыт Галилея с Пизанской башней', '§ 3.3', + 'По легенде, в конце XVI века Галилео Галилей поднялся на наклонную Пизанскую башню ' + + 'и одновременно бросил с её вершины два шара разной массы — тяжёлый и лёгкий. ' + + 'Шары упали на землю почти одновременно. Это был эксперимент, ' + + 'опровергнувший представление Аристотеля о том, что тяжёлые тела падают быстрее. ' + + 'Так появилась гипотеза «все тела падают с одним ускорением», позже подтверждённая в опытах с вакуумной трубкой.'); + + /* IV-1: timeline исторических опытов */ + h += wgWrap('p3-iv1', 'СИМ', 'Великие опыты и наблюдения', 'Кликай по этапам — узнавай, чем прославился каждый учёный.', + '
' + + ['Архимед / III в. до н. э. — закон рычага. Наблюдение и расчёт.', + 'Галилей / 1590-е — падение тел с башни. Эксперимент.', + 'Торричелли / 1643 — открыл атмосферное давление. Эксперимент с ртутью.', + 'Паскаль / 1648 — закон передачи давления. Эксперимент и теория.', + 'Ньютон / 1687 — закон всемирного тяготения. Теория, объединившая всё.'].map((txt, i) => { + const [name, rest] = txt.split(' — '); + return '
' + (i+1) + '. ' + name + '
' + rest + '
'; + }).join('') + + '
'); + + /* IV-2: КВИЗ опыт vs наблюдение */ + h += wgWrap('p3-iv2', 'КВИЗ', 'Опыт или наблюдение?', 'Выбери, какой метод использован.', + '
' + + quizQuestion('p3-q', 0, 'Метеоролог смотрит на облака и записывает их форму.', ['Наблюдение','Эксперимент','Гипотеза','Теория'], 0) + + quizQuestion('p3-q', 1, 'Ученик помещает шарик в воду и измеряет, насколько поднялся уровень.', ['Наблюдение','Эксперимент','Гипотеза','Теория'], 1) + + quizQuestion('p3-q', 2, 'Учёный предполагает: «возможно, металл проводит тепло из-за свободных электронов».', ['Наблюдение','Эксперимент','Гипотеза','Теория'], 2) + + quizQuestion('p3-q', 3, 'Архимед открыл закон рычага и записал его в виде формулы $F_1 l_1 = F_2 l_2$.', ['Наблюдение','Эксперимент','Гипотеза','Теория'], 3, 'Подтверждённое соотношение — это теория (закон).') + + '
'); + + /* IV-3: DnD «классифицируй» */ + h += wgWrap('p3-iv3', 'DnD', 'Классификация ситуаций', 'Распредели 8 ситуаций по трём корзинам.', + dndPool('p3-dnd', [ + { id:'a1', cat:'obs', html:'Смотрим, как тает снег весной' }, + { id:'a2', cat:'obs', html:'Записываем температуру за неделю' }, + { id:'a3', cat:'exp', html:'Нагреваем металл лампой и измеряем удлинение' }, + { id:'a4', cat:'exp', html:'Сравниваем падение перышка в трубке с воздухом и без' }, + { id:'a5', cat:'hyp', html:'Возможно, скорость света — максимальная во Вселенной' }, + { id:'a6', cat:'hyp', html:'Может быть, существуют тёмная материя и тёмная энергия' }, + { id:'a7', cat:'exp', html:'Бросаем мяч с разной высоты и засекаем время полёта' }, + { id:'a8', cat:'obs', html:'Изучаем затмение Луны' } + ], [ + { cat:'obs', label:'Наблюдение' }, + { cat:'exp', label:'Эксперимент' }, + { cat:'hyp', label:'Гипотеза' } + ])); + + /* IV-4: тренажёр */ + h += wgWrap('p3-iv4', 'ТРН', 'Тренажёр §3', 'Закрепи материал.', + '
' + + quizQuestion('p3-tr', 0, 'Что НЕ относится к методам познания в физике?', ['Наблюдение','Эксперимент','Угадывание','Теория'], 2, 'Угадывание — это не научный метод.') + + quizQuestion('p3-tr', 1, 'Главное отличие эксперимента от наблюдения — это…', ['Использование приборов','Активное вмешательство и контроль условий','Запись результатов','Участие учёного'], 1) + + quizQuestion('p3-tr', 2, 'Гипотеза становится теорией, когда…', ['Её опубликовали','Она проверена опытом','Её одобрил профессор','Её записали в учебник'], 1) + + quizQuestion('p3-tr', 3, 'Какой учёный знаменит опытами с падающими телами?', ['Архимед','Галилей','Ньютон','Эйнштейн'], 1) + + quizQuestion('p3-tr', 4, 'Что такое физическая модель?', ['Реальный прибор','Упрощённое представление явления для расчётов','Любая теория','Только формула'], 1, 'Модель опускает несущественные детали ради простоты.') + + '
'); + + h += readButton('p3'); + + body.innerHTML = h; + wireDnd('p3-dnd', [ + { id:'a1', cat:'obs' },{ id:'a2', cat:'obs' },{ id:'a3', cat:'exp' },{ id:'a4', cat:'exp' }, + { id:'a5', cat:'hyp' },{ id:'a6', cat:'hyp' },{ id:'a7', cat:'exp' },{ id:'a8', cat:'obs' } + ], []); + wireQuiz('p3-q-host', () => { if(window.addXp) window.addXp(10, 'quiz-p3'); }); + wireQuiz('p3-tr-host', () => { if(window.addXp) window.addXp(15, 'tr-p3'); }); + wireReadBtn('p3'); + renderMath(body); +} + +/* ========================================================== */ +/* §4 — Прямые и косвенные измерения */ +/* ========================================================== */ +function add_p4(){ + const body = document.getElementById('p4-body'); + if(!body) return; + let h = ''; + + h += makeCard('theory', 'Два типа измерений', '§ 4.1', + 'Прямое измерение — значение читается прямо со шкалы прибора. ' + + 'Длину книги — линейкой, массу — весами, время — секундомером, температуру — термометром.

' + + 'Косвенное измерение — значение вычисляется по формуле из других величин, ' + + 'измеренных прямо. Например, чтобы найти площадь стола, измеряют длину и ширину линейкой ' + + '(прямые), а площадь $S = a b$ — это уже косвенное измерение.'); + + h += makeCard('rule', 'Основные формулы косвенных измерений', '§ 4.2', + ''); + + h += makeCard('example', 'Объём картофеля', '§ 4.3', + 'Картофелина имеет неправильную форму — линейкой её не измерить. Но можно сделать так:' + + '
    ' + + '
  1. Налить в мензурку воды до отметки $V_1 = 200$ мл (прямое измерение).
    2. ' + + '
  2. Опустить картофелину; уровень поднялся до $V_2 = 280$ мл (прямое).
    3. ' + + '
  3. Объём картофелины: $V = V_2 - V_1 = 80$ мл $= 80$ см³ (косвенное).
    4. ' + + '
'); + + /* IV-1: лаборатория приборов */ + h += wgWrap('p4-iv1', 'СИМ', 'Лаборатория измерительных приборов', 'Каждый прибор даёт прямое измерение одной величины.', + '
' + + [ + ['Линейка','длина','м, см, мм','#0284c7'], + ['Весы','масса','кг, г','#7c3aed'], + ['Термометр','температура','°C','#dc2626'], + ['Секундомер','время','с, мин','#10b981'], + ['Мензурка','объём жидкости','мл, л','#0891b2'], + ['Динамометр','сила','Н','#d97706'] + ].map(([nm, v, u, col]) => + '
' + + '
' + nm + '
' + + '
' + v + '
' + + '
' + u + '
' + + '
').join('') + + '
'); + + /* IV-2: главный калькулятор косвенных измерений */ + h += wgWrap('p4-iv2', 'КАЛЬК', 'Калькулятор косвенных измерений', 'Меняй размеры $a, b, c$ и массу $m$ — формулы пересчитываются автоматически.', + '
' + + '' + + '' + + '' + + '' + + '
' + + '
' + + '
Площадь: $S = a b = $ 50 см²
' + + '
Объём: $V = a b c = $ 150 см³
' + + '
Плотность: $\\rho = m/V = $ 2.7 г/см³ (близко к алюминию)
' + + '
'); + + /* IV-3: DnD прямое/косвенное */ + h += wgWrap('p4-iv3', 'DnD', 'Прямое или косвенное?', 'Распредели измерения по типу.', + dndPool('p4-dnd', [ + { id:'a1', cat:'dir', html:'Длина книги линейкой' }, + { id:'a2', cat:'ind', html:'Площадь стола из длины × ширины' }, + { id:'a3', cat:'dir', html:'Температура воздуха термометром' }, + { id:'a4', cat:'ind', html:'Скорость велосипедиста (путь / время)' }, + { id:'a5', cat:'dir', html:'Время урока секундомером' }, + { id:'a6', cat:'ind', html:'Объём картофеля через вытеснение воды' }, + { id:'a7', cat:'dir', html:'Масса яблока на весах' }, + { id:'a8', cat:'ind', html:'Плотность металла $\\rho = m/V$' } + ], [ + { cat:'dir', label:'Прямое' }, + { cat:'ind', label:'Косвенное' } + ])); + + /* IV-4: тренажёр расчётных */ + h += wgWrap('p4-iv4', 'ТРН', 'Тренажёр §4', '5 расчётных задач.', + '
' + + quizQuestion('p4-tr', 0, 'Прямоугольник: $a = 6$ см, $b = 4$ см. Площадь $S = ?$', ['10 см²','24 см²','12 см²','20 см²'], 1, '$S = 6 \\cdot 4 = 24$ см².') + + quizQuestion('p4-tr', 1, 'Кирпич: $a = 25$ см, $b = 12$ см, $c = 6{,}5$ см. Объём $V$?', ['1900 см³','1950 см³','2000 см³','2500 см³'], 1, '$V = 25 \\cdot 12 \\cdot 6{,}5 = 1950$ см³.') + + quizQuestion('p4-tr', 2, 'Тело массой $m = 200$ г занимает объём $V = 25$ см³. Плотность?', ['4 г/см³','6 г/см³','8 г/см³','10 г/см³'], 2, '$\\rho = m/V = 200/25 = 8$ г/см³ (близко к железу).') + + quizQuestion('p4-tr', 3, 'Путь $s = 60$ м, время $t = 12$ с. Скорость?', ['4 м/с','5 м/с','6 м/с','8 м/с'], 1, '$v = s/t = 60/12 = 5$ м/с.') + + quizQuestion('p4-tr', 4, 'В мензурку с водой $V_1 = 50$ мл опустили камень — уровень поднялся до $V_2 = 78$ мл. Объём камня?', ['22 мл','28 мл','32 мл','78 мл'], 1, '$V = V_2 - V_1 = 78 - 50 = 28$ мл.') + + '
'); + + h += readButton('p4'); + + body.innerHTML = h; + + // Wire calc §4 IV-2 + const upd = () => { + const a = +document.getElementById('p4-a-r').value; + const b = +document.getElementById('p4-b-r').value; + const c = +document.getElementById('p4-c-r').value; + const m = +document.getElementById('p4-m-r').value; + document.getElementById('p4-a').textContent = a; + document.getElementById('p4-b').textContent = b; + document.getElementById('p4-c').textContent = c; + document.getElementById('p4-m').textContent = m; + const S = a * b; + const V = a * b * c; + const rho = m / V; + document.getElementById('p4-S').textContent = S; + document.getElementById('p4-V').textContent = V; + document.getElementById('p4-rho').textContent = rho.toFixed(2); + // Угадывание вещества по плотности (г/см³) + let name = ''; + if(rho < 0.3) name = '(легче пенопласта — нереально!)'; + else if(rho < 0.7) name = '(дерево / сосна)'; + else if(rho < 1.1) name = '(вода или лёд)'; + else if(rho < 3.5) name = '(алюминий / стекло)'; + else if(rho < 9) name = '(железо / медь)'; + else if(rho < 15) name = '(свинец / ртуть)'; + else if(rho < 22) name = '(золото / платина)'; + else name = '(плотнее любого металла)'; + document.getElementById('p4-rho-name').textContent = name; + }; + ['p4-a-r','p4-b-r','p4-c-r','p4-m-r'].forEach(id => document.getElementById(id).addEventListener('input', upd)); + upd(); + + wireDnd('p4-dnd', [ + { id:'a1', cat:'dir' },{ id:'a2', cat:'ind' },{ id:'a3', cat:'dir' },{ id:'a4', cat:'ind' }, + { id:'a5', cat:'dir' },{ id:'a6', cat:'ind' },{ id:'a7', cat:'dir' },{ id:'a8', cat:'ind' } + ], []); + wireQuiz('p4-tr-host', () => { if(window.addXp) window.addXp(15, 'tr-p4'); }); + wireReadBtn('p4'); + renderMath(body); +} + +/* ========================================================== */ +/* §5 — Единицы измерения физических величин. СИ */ +/* ========================================================== */ +function add_p5(){ + const body = document.getElementById('p5-body'); + if(!body) return; + let h = ''; + + h += makeCard('theory', 'Зачем СИ?', '§ 5.1', + 'Если каждый учёный использует свои единицы — результаты невозможно сравнить. ' + + 'В 1960 году принята Международная система единиц (СИ) — единый стандарт. ' + + 'В СИ — 7 основных единиц; все остальные получаются комбинацией основных.'); + + h += makeCard('rule', '7 основных единиц СИ', '§ 5.2', + '' + + '' + + [['Длина','метр','м'],['Масса','килограмм','кг'],['Время','секунда','с'],['Сила тока','ампер','А'],['Температура','кельвин','К'],['Кол-во вещества','моль','моль'],['Сила света','кандела','кд']].map(([v,u,s]) => + '').join('') + + '
ВеличинаЕдиницаОбозначение
' + v + '' + u + '' + s + '
'); + + h += makeCard('example', 'Кратные и дольные приставки', '§ 5.3', + '' + + '' + + [['Г (гига)','$10^9$','1 ГГц = $10^9$ Гц'],['М (мега)','$10^6$','1 МВт = $10^6$ Вт'],['к (кило)','$10^3$','1 кг = 1000 г'],['—','1','1 м'],['м (милли)','$10^{-3}$','1 мс = 0,001 с'],['мк (микро)','$10^{-6}$','1 мкм = $10^{-6}$ м'],['н (нано)','$10^{-9}$','1 нс = $10^{-9}$ с']].map(([pf,k,ex]) => + '').join('') + + '
ПриставкаМножительПример
' + pf + '' + k + '' + ex + '
'); + + /* IV-1: визуал — 7 основных */ + h += wgWrap('p5-iv1', 'СИМ', '7 китов СИ', 'Семь основных единиц — фундамент всех физических измерений.', + '
' + + [['Длина','м','#0284c7'],['Масса','кг','#7c3aed'],['Время','с','#10b981'],['Ток','А','#d97706'],['Темп.','К','#dc2626'],['Вещ-во','моль','#0891b2'],['Свет','кд','#fbbf24']].map(([v, u, col]) => + '
' + + '
' + u + '
' + + '
' + v + '
' + + '
').join('') + + '
'); + + /* IV-2: главный конвертер */ + h += wgWrap('p5-iv2', 'КАЛЬК', 'Конвертер единиц', 'Выбери приставку и величину — увидь перевод в основную единицу СИ.', + '
' + + '' + + '' + + '' + + '
' + + '
' + + '5 км' + + '   =   ' + + '5000 м' + + '
' + + '
'); + + /* IV-3: DnD — величина ↔ единица СИ */ + h += wgWrap('p5-iv3', 'DnD', 'Величина ↔ единица СИ', 'Соедини каждую величину с её основной единицей.', + dndPool('p5-dnd', [ + { id:'a1', cat:'m', html:'Длина' }, + { id:'a2', cat:'kg', html:'Масса' }, + { id:'a3', cat:'s', html:'Время' }, + { id:'a4', cat:'K', html:'Температура' }, + { id:'a5', cat:'A', html:'Сила тока' }, + { id:'a6', cat:'m', html:'Расстояние от Минска до Бреста' }, + { id:'a7', cat:'kg', html:'Масса арбуза' }, + { id:'a8', cat:'s', html:'Длительность урока' } + ], [ + { cat:'m', label:'метр (м)' }, + { cat:'kg', label:'килограмм (кг)' }, + { cat:'s', label:'секунда (с)' }, + { cat:'K', label:'кельвин (К)' }, + { cat:'A', label:'ампер (А)' } + ])); + + /* IV-4: тренажёр на перевод */ + h += wgWrap('p5-iv4', 'ТРН', 'Тренажёр §5', '5 задач на перевод единиц.', + '
' + + quizQuestion('p5-tr', 0, '$5$ км $= ?$ м', ['50','500','5 000','50 000'], 2, '$5 \\cdot 1000 = 5\\,000$ м.') + + quizQuestion('p5-tr', 1, '$0{,}25$ кг $= ?$ г', ['25','100','250','2500'], 2, '$0{,}25 \\cdot 1000 = 250$ г.') + + quizQuestion('p5-tr', 2, '$2$ ч $= ?$ с', ['120','3 600','7 200','12 000'], 2, '$2 \\cdot 60 \\cdot 60 = 7\\,200$ с.') + + quizQuestion('p5-tr', 3, '$300$ мс $= ?$ с', ['0,03','0,3','3','30'], 1, '$300 \\cdot 10^{-3} = 0{,}3$ с.') + + quizQuestion('p5-tr', 4, '$1$ см² $= ?$ м²', ['0,1','0,01','0,001','0,0001'], 3, '$1\\,\\text{см}^2 = (10^{-2}\\,\\text{м})^2 = 10^{-4}\\,\\text{м}^2$.') + + '
'); + + h += readButton('p5'); + + body.innerHTML = h; + + // Wire converter §5 IV-2 + const updConv = () => { + const n = +document.getElementById('p5-n-r').value; + const pf = +document.getElementById('p5-pf').value; + const u = document.getElementById('p5-u').value; + document.getElementById('p5-n').textContent = n; + const prefixLabels = { '1000000000':'Г','1000000':'М','1000':'к','1':'','0.01':'с','0.001':'м','1e-6':'мк','1e-9':'н' }; + // Получим символ по value + const sel = document.getElementById('p5-pf'); + const pfLabel = (sel.options[sel.selectedIndex].text.match(/^([А-Яа-я—]+)/) || ['',''])[1]; + const result = n * pf; + // Format result + let resStr; + if(Math.abs(result) >= 1e6 || (Math.abs(result) > 0 && Math.abs(result) < 0.001)) resStr = result.toExponential(2); + else if(Number.isInteger(result)) resStr = result.toLocaleString('ru-RU'); + else resStr = (+result.toPrecision(6)).toLocaleString('ru-RU'); + document.getElementById('p5-src').textContent = n + ' ' + pfLabel + u; + document.getElementById('p5-dst').textContent = resStr + ' ' + u; + const explain = pf === 1 ? 'Без приставки.' : ('Множитель ' + (pf >= 1 ? pf.toLocaleString('ru-RU') : pf) + '. Умножаем число на этот множитель.'); + document.getElementById('p5-explain').textContent = explain; + }; + document.getElementById('p5-n-r').addEventListener('input', updConv); + document.getElementById('p5-pf').addEventListener('change', updConv); + document.getElementById('p5-u').addEventListener('change', updConv); + updConv(); + + wireDnd('p5-dnd', [ + { id:'a1', cat:'m' },{ id:'a2', cat:'kg' },{ id:'a3', cat:'s' },{ id:'a4', cat:'K' }, + { id:'a5', cat:'A' },{ id:'a6', cat:'m' },{ id:'a7', cat:'kg' },{ id:'a8', cat:'s' } + ], []); + wireQuiz('p5-tr-host', () => { if(window.addXp) window.addXp(15, 'tr-p5'); }); + wireReadBtn('p5'); + renderMath(body); +} + +/* Экспорт */ window.PHYS7_CH1_WIDGETS = { p1: add_p1, - p2: add_p2 - // p3..p7, final1 — в Wave 2/3 + p2: add_p2, + p3: add_p3, + p4: add_p4, + p5: add_p5 + // p6, p7, final1 — в Wave 3 }; })();