Maxim Dolgolyov
22b95ed072
Миграция 031_physics_11_hub.sql: - hub textbook 'physics-11' (cyan, sort 12, para_count 45) - 8 children по главам: ch1 cyan, ch2 violet, ch3 amber, ch4 blue, ch5 pink, ch6 green, ch7 rose, ch8 indigo frontend/js/phys-fx.js (~360 строк): - Глобальный requestAnimationFrame-цикл (Ticker) с подписками - util.subscribe/unsubscribe + IntersectionObserver-пауза невидимых - util.svgFrame, util.axes, util.slider — общие хелперы - PHYS.Oscillogram: гарм. колебания с амплитудой/частотой/фазой/затуханием - PHYS.SpringMass: пружинный маятник (T=2π√(m/k)) с зигзаг-пружиной - PHYS.Pendulum: математический маятник (T=2π√(l/g)) с дугой frontend/textbooks/physics_11_hub.html: - Header cyan-gradient + watermark ФИЗИКА - 4-кол grid карточек глав (8 шт., responsive) - Прогресс-бар курса + API /api/textbooks/physics-11/children frontend/textbooks/physics_11_ch1..ch8.html: - Stub-страницы по образцу geometry_10_r1..r4 (W0) - Список параграфов с ключевыми формулами + 'Будет добавлено в волне WN' - Каждая глава со своей темой (gradient, watermark, цветами) - phys-fx.js подключён сразу (ready для W1+) backend/scripts/gen_phys11_stubs.js — генератор для повторных сборок.
180 lines
9.5 KiB
HTML
180 lines
9.5 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||
<title>Физика 11 · Глава 1 · Механические колебания и волны</title>
|
||
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&family=Unbounded:wght@400;700;800;900&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css">
|
||
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js"></script>
|
||
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js"
|
||
onload="renderMathInElement(document.body,{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false})"></script>
|
||
<script src="/js/api.js" defer></script>
|
||
<script src="/js/xp.js" defer></script>
|
||
<script src="/js/phys-fx.js?v=1" defer></script>
|
||
<style>
|
||
:root{
|
||
--bg:#f8fafc; --card:#fff;
|
||
--text:#0f172a; --muted:#475569;
|
||
--border:#e2e8f0;
|
||
--pri:#0891b2; --pri-d:#0e7490;
|
||
--pri-soft:#cffafe;
|
||
--dark:#155e75;
|
||
--sh:0 4px 16px rgba(0,0,0,.06);
|
||
}
|
||
html.dark{
|
||
--bg:#020617; --card:#0a1929;
|
||
--text:#dbeafe; --muted:#94a3b8;
|
||
--border:#1e293b;
|
||
}
|
||
*{margin:0;padding:0;box-sizing:border-box}
|
||
html,body{min-height:100vh}
|
||
body{font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.55;transition:background .25s,color .25s}
|
||
|
||
.hdr{position:relative;background:linear-gradient(110deg,#155e75 0%,#0891b2 55%,#a5f3fc 100%);color:#fff;padding:32px 24px 28px;overflow:hidden}
|
||
.hdr::before{content:'∿';position:absolute;right:8px;top:-20%;font-family:'Outfit',sans-serif;font-size:clamp(8rem,22vw,18rem);font-weight:900;color:rgba(255,255,255,.10);line-height:1;pointer-events:none;user-select:none}
|
||
.hdr-inner{position:relative;z-index:1;max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
|
||
.hdr-back{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;background:rgba(255,255,255,.14);border-radius:9px;color:#fff;text-decoration:none;font-size:.85rem;font-weight:600;transition:background .15s}
|
||
.hdr-back:hover{background:rgba(255,255,255,.24)}
|
||
.hdr h1{font-family:'Outfit',sans-serif;font-size:1.7rem;font-weight:900;letter-spacing:-.01em}
|
||
.hdr-sub{font-size:.92rem;opacity:.85;margin-top:4px}
|
||
.ic{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
|
||
|
||
main{max-width:980px;margin:0 auto;padding:32px 24px 60px}
|
||
|
||
.intro-card{background:var(--card);border:1.5px solid var(--border);border-radius:16px;padding:22px 26px;margin-bottom:28px;box-shadow:var(--sh)}
|
||
.intro-num{display:inline-block;padding:4px 10px;background:var(--pri-soft);color:var(--pri-d);border-radius:99px;font-size:.72rem;font-weight:800;letter-spacing:.06em;margin-bottom:8px;text-transform:uppercase}
|
||
.intro-card h2{font-family:'Outfit',sans-serif;font-size:1.4rem;font-weight:800;margin-bottom:6px}
|
||
.intro-card p{color:var(--muted);font-size:.95rem}
|
||
|
||
.para-grid{display:grid;grid-template-columns:1fr;gap:14px}
|
||
.para-card{background:var(--card);border:1.5px solid var(--border);border-radius:14px;padding:18px 20px;display:flex;gap:16px;align-items:flex-start;transition:transform .15s,box-shadow .15s,border-color .15s}
|
||
.para-card:hover{transform:translateY(-2px);box-shadow:var(--sh);border-color:var(--pri)}
|
||
.para-num{font-family:'Outfit',sans-serif;font-size:1rem;font-weight:900;color:#fff;background:linear-gradient(135deg,var(--pri),var(--pri-d));padding:8px 12px;border-radius:9px;min-width:56px;text-align:center;letter-spacing:-.02em;flex-shrink:0}
|
||
.para-body{flex:1}
|
||
.para-title{font-family:'Outfit',sans-serif;font-size:1.05rem;font-weight:800;margin-bottom:4px;color:var(--text)}
|
||
.para-sub{font-size:.88rem;color:var(--muted);margin-bottom:10px;line-height:1.55}
|
||
.para-status{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:var(--muted);background:rgba(0,0,0,.04);padding:6px 10px;border-radius:8px;font-weight:600}
|
||
html.dark .para-status{background:rgba(255,255,255,.06)}
|
||
.para-status .ic{width:14px;height:14px}
|
||
|
||
.banner-soon{margin-top:30px;text-align:center;padding:20px;background:linear-gradient(135deg,var(--pri-soft),transparent);border:1px dashed var(--pri);border-radius:14px;color:var(--pri-d);font-weight:700;font-size:.92rem}
|
||
.banner-soon b{font-family:'Outfit',sans-serif}
|
||
|
||
.foot{text-align:center;padding:24px 16px;color:var(--muted);font-size:.78rem;border-top:1px solid var(--border)}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<header class="hdr">
|
||
<div class="hdr-inner">
|
||
<div>
|
||
<a href="/textbook/physics-11" class="hdr-back">
|
||
<svg class="ic" viewBox="0 0 24 24"><polyline points="15 18 9 12 15 6"/></svg>
|
||
К курсу физики 11
|
||
</a>
|
||
</div>
|
||
<div>
|
||
<h1>Глава 1. Механические колебания и волны</h1>
|
||
<div class="hdr-sub">Колебательное движение, гармонические колебания, маятники, превращения энергии, резонанс, продольные и поперечные волны, звук · §1–§6</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
|
||
<div class="intro-card">
|
||
<span class="intro-num">Глава 1</span>
|
||
<h2>Механические колебания и волны</h2>
|
||
<p>Колебательное движение, гармонические колебания, маятники, превращения энергии, резонанс, продольные и поперечные волны, звук. Глава содержит 6 параграфов и финальный этап с боссами.</p>
|
||
</div>
|
||
|
||
<div class="para-grid">
|
||
|
||
<article class="para-card">
|
||
<div class="para-num">§ 1</div>
|
||
<div class="para-body">
|
||
<h2 class="para-title">Колебательное движение. Гармонические колебания</h2>
|
||
<p class="para-sub">$T = \Delta t / N$, $\nu = 1/T$, $\omega = 2\pi/T$, $x = A\cos(\omega t + \varphi_0)$</p>
|
||
<div class="para-status">
|
||
<svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
||
Будет добавлено в волне W1-W2
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="para-card">
|
||
<div class="para-num">§ 2</div>
|
||
<div class="para-body">
|
||
<h2 class="para-title">Пружинный и математический маятники</h2>
|
||
<p class="para-sub">$T_{пр} = 2\pi\sqrt{m/k}$, $T_{мат} = 2\pi\sqrt{l/g}$</p>
|
||
<div class="para-status">
|
||
<svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
||
Будет добавлено в волне W1-W2
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="para-card">
|
||
<div class="para-num">§ 3</div>
|
||
<div class="para-body">
|
||
<h2 class="para-title">Превращения энергии при гарм. колебаниях</h2>
|
||
<p class="para-sub">$W_{мех} = kA^2/2 = m\omega^2 A^2/2$</p>
|
||
<div class="para-status">
|
||
<svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
||
Будет добавлено в волне W1-W2
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="para-card">
|
||
<div class="para-num">§ 4</div>
|
||
<div class="para-body">
|
||
<h2 class="para-title">Свободные и вынужденные колебания. Резонанс</h2>
|
||
<p class="para-sub">Затухание, диссипация, $\omega_{рез} \approx \omega_0$</p>
|
||
<div class="para-status">
|
||
<svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
||
Будет добавлено в волне W1-W2
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="para-card">
|
||
<div class="para-num">§ 5</div>
|
||
<div class="para-body">
|
||
<h2 class="para-title">Распространение колебаний в упругой среде. Продольные и поперечные волны</h2>
|
||
<p class="para-sub">$\lambda = vT$</p>
|
||
<div class="para-status">
|
||
<svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
||
Будет добавлено в волне W1-W2
|
||
</div>
|
||
</div>
|
||
</article>
|
||
|
||
<article class="para-card">
|
||
<div class="para-num">§ 6</div>
|
||
<div class="para-body">
|
||
<h2 class="para-title">Звуковые волны</h2>
|
||
<p class="para-sub">16 Гц – 20 кГц, $v_{зв}^{возд} \approx 340$ м/с</p>
|
||
<div class="para-status">
|
||
<svg class="ic" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
||
Будет добавлено в волне W1-W2
|
||
</div>
|
||
</div>
|
||
</article>
|
||
</div>
|
||
|
||
<div class="banner-soon">
|
||
<b>Глава в разработке.</b> Полная реализация — в следующих волнах. Базовая библиотека <code>phys-fx.js</code> уже доступна.
|
||
</div>
|
||
|
||
</main>
|
||
|
||
<footer class="foot">
|
||
Физика — 11 класс · Глава 1 · LearnSpace
|
||
</footer>
|
||
|
||
</body>
|
||
</html>
|