maxim.dolgolyov/Learn_System
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
a4ac33c0147b3f7d7281e3d27348aadb0bbdfd43
Learn_System/frontend/textbooks/math_6_ch4.html
T
Maxim Dolgolyov 21853bdc27 feat(math6): Глава 4 — Рациональные числа (§1–§11 + финал) 
§1 числа со знаком + координатная прямая; §2 модуль, противоположные,
диаграмма N⊂Z⊂Q; §3 сравнение (прямая + наибольшее из трёх);
§4 сложение (демонстратор на прямой + тренажёр); §5 вычитание = +противоп.
(тренажёр + перепиши сложением); §6 законы сложения (удобный счёт +
определи закон); §7 умножение (таблица знаков + тренажёр); §8 деление
(тренажёр + знак частного); §9 порядок действий; §11 прикладной
(температуры/долги/глубина); финал — 6 боссов. ВСЕ 6 глав готовы.
Тесты math6: 17/17.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-02 20:08:48 +03:00

642 lines
64 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<title>Математика 6 · Глава 4 · Рациональные числа</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<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>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/css/math6.css">
<script src="/js/api.js" defer></script>
<script src="/js/xp.js" defer></script>
<script src="/js/math6_svg.js" defer></script>
<script src="/js/math6_engine.js" defer></script>
<style>:root{--pri:#e11d48;--pri2:#be123c;--pri-soft:#ffe4e6;--acc:#f43f5e;--acc2:#e11d48;--acc-soft:#fff1f2}</style>
</head>
<body>
<header class="hdr" data-wm="−5">
<div class="hdr-row">
<div>
<h1>Математика 6 · Глава 4</h1>
<div class="hdr-sub">Положительные и отрицательные числа · модуль · множества Z и Q · действия и законы</div>
</div>
<div class="hdr-side">
<a href="/textbook/math-6" class="hdr-btn" title="Ко всем главам"><svg class="ic" viewBox="0 0 24 24"><polyline points="15 18 9 12 15 6"/></svg> К математике 6</a>
<button id="search-btn" class="hdr-btn" title="Поиск (Ctrl+K)"><svg class="ic" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="m21 21-4-4"/></svg> <span>Поиск</span></button>
<button id="sidebar-btn" class="hdr-btn" title="Шпаргалка"><svg class="ic" viewBox="0 0 24 24"><line x1="4" y1="6" x2="20" y2="6"/><line x1="4" y1="12" x2="20" y2="12"/><line x1="4" y1="18" x2="14" y2="18"/></svg> Шпаргалка</button>
<button id="theme-btn" class="hdr-btn" title="Сменить тему"><svg class="ic" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg> <span id="theme-lab">Тёмная</span></button>
</div>
</div>
</header>
<main class="main">
<div class="col-main">
<section class="hero" data-wm="−5">
<h2>Рациональные числа</h2>
<p>Температура ниже нуля, долги, координаты влево от нуля — так в математику приходят <b>отрицательные числа</b>. В этой главе мы построим <b>координатную прямую</b>, познакомимся с <b>модулем</b> и противоположными числами, множествами целых $\mathbb{Z}$ и рациональных $\mathbb{Q}$ чисел, и научимся выполнять <b>все действия</b> с рациональными числами по правилам знаков.</p>
<div class="hero-row">
<button class="btn-primary" onclick="goTo('p1')"><svg class="ic" viewBox="0 0 24 24"><polygon points="6 4 20 12 6 20 6 4" fill="currentColor" stroke="none"/></svg> Начать § 1</button>
<div class="hero-progress"><span class="hp-label">Прогресс по главе</span><div class="hp-bar"><div id="hero-hp-fill" class="hp-fill"></div></div><span id="hero-hp-text" class="hp-text">0%</span></div>
<div id="hero-xp-badge" class="hero-xp-badge" title="Опыт" data-gamified></div>
</div>
</section>
<section class="psel"><div class="psel-title">Параграфы главы</div><div id="psel-grid" class="psel-grid"></div></section>
<div id="sections"></div>
</div>
<aside class="col-side" id="col-side"><div id="sidebar-content"></div></aside>
<div class="col-side-backdrop" id="col-side-backdrop"></div>
</main>
<footer class="foot" id="m6-foot">Интерактивный учебник «Математика 6» · Глава 4 · Рациональные числа · LearnSpace</footer>
<div id="ach-popup" class="ach-popup"><svg class="ic" viewBox="0 0 24 24" style="width:22px;height:22px"><polygon points="12,2 22,20 2,20"/></svg><span id="ach-text">Достижение!</span></div>
<div id="gloss-tip" class="gloss-tip"></div>
<div id="search-modal" class="search-modal" role="dialog" aria-label="Поиск по главе">
<div class="search-box">
<input type="text" id="search-input" class="search-input" placeholder="Поиск: понятие, действие, параграф…" autocomplete="off">
<div id="search-results" class="search-results"></div>
<div class="search-foot"><span><kbd>&#8593;&#8595;</kbd> навигация</span><span><kbd>Enter</kbd> открыть</span><span><kbd>Esc</kbd> закрыть</span></div>
</div>
</div>
<script>
'use strict';
window.M6 = {
slug: 'math-6-ch4', lsPrefix: 'math6_ch4', xpKey: 'math6_xp', wm: '−5',
paras: [
{ id:'p1', num:'§ 1', name:'Положительные и отрицательные числа. Координатная прямая', sub:'Числа со знаком' },
{ id:'p2', num:'§ 2', name:'Модуль. Противоположные числа. Z и Q', sub:'|x| и множества чисел' },
{ id:'p3', num:'§ 3', name:'Сравнение рациональных чисел', sub:'Что больше на прямой' },
{ id:'p4', num:'§ 4', name:'Сложение рациональных чисел', sub:'Правила сложения' },
{ id:'p5', num:'§ 5', name:'Вычитание рациональных чисел', sub:'Прибавляем противоположное' },
{ id:'p6', num:'§ 6', name:'Законы сложения', sub:'Удобный порядок действий' },
{ id:'p7', num:'§ 7', name:'Умножение рациональных чисел', sub:'Знаки при умножении' },
{ id:'p8', num:'§ 8', name:'Деление рациональных чисел', sub:'Знаки при делении' },
{ id:'p9', num:'§ 9', name:'Задачи на все действия', sub:'Порядок действий' },
{ id:'app', num:'§ 11', name:'Математика вокруг нас', sub:'Отрицательные числа в жизни', applied:true },
{ id:'final', num:'★', name:'Финал главы', sub:'Тест · боссы главы 4', final:true }
],
achLabels: {
start:'Начало главы 4!', p1_done:'Числа со знаком — ясно!', p2_done:'Модуль и Z, Q освоены!',
p3_done:'Сравниваю рациональные!', p4_done:'Сложение освоено!', p5_done:'Вычитание — точно!',
p6_done:'Законы сложения работают!', p7_done:'Умножение знаков — мастер!', p8_done:'Деление знаков — уверенно!',
p9_done:'Все действия — на отлично!', app_done:'Математика вокруг нас!', ch4_done:'Глава 4 пройдена!'
},
startAch: ['start','Начало главы 4!'],
finalAch: ['ch4_done','Глава 4 пройдена!'],
sidebars: {}, tips: [], glossary: [], builders: {},
footer: 'Интерактивный учебник «Математика 6» · Глава 4 · Рациональные числа · LearnSpace'
};
/* ===================== ВСПОМОГАТЕЛЬНОЕ ===================== */
function _ri(a,b){ return a + Math.floor(Math.random()*(b-a+1)); }
function _pick(a){ return a[_ri(0,a.length-1)]; }
function _nz(a,b){ var v; do{ v=_ri(a,b); }while(v===0); return v; }
function _par(x){ return x<0 ? '('+x+')' : ''+x; }
function svgWrap(w,h,inner){ return '<div class="m6-fig" style="max-width:'+w+'px;margin:10px auto"><svg viewBox="0 0 '+w+' '+h+'" style="width:100%;height:auto;display:block;background:var(--card,#fff);border-radius:10px;border:1px solid var(--border)">'+inner+'</svg></div>'; }
/* ===================== § 1. ПОЛОЖИТЕЛЬНЫЕ И ОТРИЦАТЕЛЬНЫЕ. КООРДИНАТНАЯ ПРЯМАЯ ===================== */
function buildP1(){
var box=document.getElementById('p1-body'); var h='';
h+=makeCard('theory','Числа со знаком','1.1',
'<p>Числа бывают <b>положительные</b> ($+3$, или просто $3$), <b>отрицательные</b> ($-3$) и <b>ноль</b> (не положителен и не отрицателен). Отрицательными измеряют температуру ниже нуля, долги, глубину.</p>');
h+=makeCard('rule','Координатная прямая','1.2',
'<p><b>Координатная прямая</b> — прямая с началом $O$ (точка $0$), положительным направлением (вправо) и единичным отрезком. Положительные числа — справа от нуля, отрицательные — слева.</p>'
+'<p>Каждому числу соответствует точка, и наоборот; это его <b>координата</b>.</p>');
h+='<div class="wg" id="p1-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Прочитай координату</div></div>'
+'<div class="wg-help">Определи координату отмеченной точки (может быть отрицательной).</div>'
+'<div class="score-display"><span>Вопрос <b id="p1-i">1</b> / 6</span><span>Очки: <b id="p1-s">0</b> / 6</span></div>'
+'<div id="p1-fig"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p1-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p1-go">Проверить</button></div>'
+'<div class="feedback" id="p1-fb"></div></div>';
h+='<div class="wg" id="p1-iv2"><div class="wg-header"><span class="wg-badge">Интерактив 2</span><div class="wg-title">Положительное, отрицательное или ноль?</div></div>'
+'<div class="wg-help">Определи знак числа.</div>'
+'<div class="score-display"><span>Вопрос <b id="p1-ci">1</b> / 6</span><span>Очки: <b id="p1-cs">0</b> / 6</span></div>'
+'<div id="p1-cq" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap"><button class="btn primary" data-v="p">положительное</button><button class="btn primary" data-v="z">ноль</button><button class="btn primary" data-v="n">отрицательное</button></div>'
+'<div class="feedback" id="p1-cfb"></div></div>';
h+=secNav(null,'p2')+readBtn('p1');
box.innerHTML=h; renderMath(box);
(function(){
var i=0,score=0,cur=0;
function show(){ if(i>=6){ document.getElementById('p1-fig').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'p1-iv1');bumpProgress('p1',30);}else if(score>=3){addXp(8,'p1-iv1');bumpProgress('p1',16);} return; }
cur=_ri(-6,6); document.getElementById('p1-i').textContent=i+1;
document.getElementById('p1-fig').innerHTML=Math6.numberLine({min:-7,max:7,minor:1,major:1,width:580,marks:[{v:cur,label:'?',color:'#e11d48'}]});
document.getElementById('p1-a').value=''; document.getElementById('p1-fb').style.display='none'; }
function go(){ if(i>=6)return; var fb=document.getElementById('p1-fb'), v=parseInt(document.getElementById('p1-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число (можно со знаком −).'); return; }
if(v===cur){ score++; feedback(fb,true,'✓ Верно: '+cur+'.'); } else feedback(fb,false,'✗ Нет. Координата: '+cur+'.');
document.getElementById('p1-s').textContent=score; i++; setTimeout(show,1200); }
document.getElementById('p1-go').addEventListener('click',go);
document.getElementById('p1-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
(function(){
var i=0,score=0,cur=null;
function gen(){ var v=_ri(-9,9); cur={v:v, k:v>0?'p':(v<0?'n':'z')}; }
function show(){ if(i>=6){ document.getElementById('p1-cq').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'p1-iv2');bumpProgress('p1',30);}else if(score>=3){addXp(8,'p1-iv2');bumpProgress('p1',16);} return; }
gen(); document.getElementById('p1-ci').textContent=i+1; document.getElementById('p1-cq').innerHTML='Число $'+cur.v+'$ — какое?'; renderMath(document.getElementById('p1-cq'));
document.getElementById('p1-cfb').style.display='none'; }
function ans(k){ if(i>=6)return; var fb=document.getElementById('p1-cfb'), nm={p:'положительное',n:'отрицательное',z:'ноль'};
if(k===cur.k){ score++; feedback(fb,true,'✓ Верно — '+nm[cur.k]+'.'); } else feedback(fb,false,'✗ Нет. $'+cur.v+'$ — '+nm[cur.k]+'.');
document.getElementById('p1-cs').textContent=score; i++; setTimeout(show,1200); }
document.querySelectorAll('#p1-iv2 [data-v]').forEach(function(b){ b.addEventListener('click',function(){ ans(b.getAttribute('data-v')); }); }); show();
})();
}
/* ===================== § 2. МОДУЛЬ. ПРОТИВОПОЛОЖНЫЕ. Z И Q ===================== */
function buildP2(){
var box=document.getElementById('p2-body'); var h='';
h+=makeCard('theory','Модуль и противоположные числа','2.1',
'<p><b>Модуль</b> числа $|a|$ — это расстояние от точки $a$ до нуля; он всегда $\\ge 0$: $|{-7}|=7$, $|5|=5$, $|0|=0$.</p>'
+'<p><b>Противоположные числа</b> отличаются только знаком ($5$ и $-5$); их сумма равна нулю, а модули равны.</p>');
h+=makeCard('theory','Множества чисел: N ⊂ Z ⊂ Q','2.2',
'<p><b>Натуральные</b> $\\mathbb{N}=\\{1;2;3;\\ldots\\}$ — для счёта. <b>Целые</b> $\\mathbb{Z}$ — натуральные, им противоположные и ноль. <b>Рациональные</b> $\\mathbb{Q}$ — все числа, представимые дробью $\\frac{m}{n}$ (включая десятичные и отрицательные).</p>'
+svgWrap(240,180,'<ellipse cx="120" cy="95" rx="108" ry="78" fill="rgba(225,29,72,.08)" stroke="#e11d48" stroke-width="2"/><ellipse cx="120" cy="105" rx="78" ry="55" fill="rgba(124,58,237,.10)" stroke="#7c3aed" stroke-width="2"/><ellipse cx="120" cy="118" rx="46" ry="32" fill="rgba(79,70,229,.12)" stroke="#4f46e5" stroke-width="2"/><text x="120" y="32" text-anchor="middle" font-size="15" font-weight="800" fill="#e11d48">Q (рациональные)</text><text x="120" y="70" text-anchor="middle" font-size="14" font-weight="800" fill="#7c3aed">Z (целые)</text><text x="120" y="122" text-anchor="middle" font-size="13" font-weight="800" fill="#4f46e5">N: 1,2,3…</text>'));
h+='<div class="wg" id="p2-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Найди модуль</div></div>'
+'<div class="wg-help">Модуль — расстояние до нуля, всегда неотрицателен.</div>'
+'<div class="score-display"><span>Вопрос <b id="p2-i">1</b> / 6</span><span>Очки: <b id="p2-s">0</b> / 6</span></div>'
+'<div id="p2-q" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p2-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p2-go">Проверить</button></div>'
+'<div class="feedback" id="p2-fb"></div></div>';
h+='<div class="wg" id="p2-iv2"><div class="wg-header"><span class="wg-badge">Интерактив 2</span><div class="wg-title">Противоположное число</div></div>'
+'<div class="wg-help">Назови число, противоположное данному.</div>'
+'<div class="score-display"><span>Вопрос <b id="p2-oi">1</b> / 5</span><span>Очки: <b id="p2-os">0</b> / 5</span></div>'
+'<div id="p2-oq" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p2-oa" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p2-ogo">Проверить</button></div>'
+'<div class="feedback" id="p2-ofb"></div></div>';
h+=secNav('p1','p3')+readBtn('p2');
box.innerHTML=h; renderMath(box);
(function(){
var i=0,score=0,cur=0;
function show(){ if(i>=6){ document.getElementById('p2-q').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'p2-iv1');bumpProgress('p2',30);}else if(score>=3){addXp(8,'p2-iv1');bumpProgress('p2',16);} return; }
cur=_ri(-15,15); document.getElementById('p2-i').textContent=i+1; document.getElementById('p2-q').innerHTML='Вычисли $|'+cur+'|$.'; renderMath(document.getElementById('p2-q'));
document.getElementById('p2-a').value=''; document.getElementById('p2-fb').style.display='none'; }
function go(){ if(i>=6)return; var fb=document.getElementById('p2-fb'), v=parseInt(document.getElementById('p2-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===Math.abs(cur)){ score++; feedback(fb,true,'✓ Верно: '+Math.abs(cur)+'.'); } else feedback(fb,false,'✗ Нет. $|'+cur+'|='+Math.abs(cur)+'$.');
document.getElementById('p2-s').textContent=score; i++; setTimeout(show,1200); }
document.getElementById('p2-go').addEventListener('click',go);
document.getElementById('p2-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
(function(){
var i=0,score=0,cur=0;
function show(){ if(i>=5){ document.getElementById('p2-oq').innerHTML='<b>Готово!</b> '+score+' / 5'; if(score>=4){addXp(15,'p2-iv2');bumpProgress('p2',30);}else if(score>=2){addXp(8,'p2-iv2');bumpProgress('p2',16);} return; }
cur=_nz(-12,12); document.getElementById('p2-oi').textContent=i+1; document.getElementById('p2-oq').innerHTML='Число, противоположное $'+cur+'$ — это?'; renderMath(document.getElementById('p2-oq'));
document.getElementById('p2-oa').value=''; document.getElementById('p2-ofb').style.display='none'; }
function go(){ if(i>=5)return; var fb=document.getElementById('p2-ofb'), v=parseInt(document.getElementById('p2-oa').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===-cur){ score++; feedback(fb,true,'✓ Верно: '+(-cur)+'.'); } else feedback(fb,false,'✗ Нет. Противоположное: '+(-cur)+'.');
document.getElementById('p2-os').textContent=score; i++; setTimeout(show,1200); }
document.getElementById('p2-ogo').addEventListener('click',go);
document.getElementById('p2-oa').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
}
/* ===================== § 3. СРАВНЕНИЕ РАЦИОНАЛЬНЫХ ===================== */
function buildP3(){
var box=document.getElementById('p3-body'); var h='';
h+=makeCard('rule','Сравнение на координатной прямой','3.1',
'<p>Из двух чисел <b>больше то, которое правее</b> на координатной прямой.</p>'
+'<p>Любое положительное $>$ любого отрицательного; $0$ больше любого отрицательного. Из двух отрицательных больше то, у которого <b>меньше модуль</b> (ближе к нулю): $-2 > -5$.</p>');
h+='<div class="wg" id="p3-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Сравни числа</div></div>'
+'<div class="wg-help">Сравни два числа на координатной прямой.</div>'
+'<div class="score-display"><span>Вопрос <b id="p3-i">1</b> / 6</span><span>Очки: <b id="p3-s">0</b> / 6</span></div>'
+'<div id="p3-fig"></div><div id="p3-q" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap"><button class="btn primary" data-c=">">a &gt; b</button><button class="btn primary" data-c="<">a &lt; b</button></div>'
+'<div class="feedback" id="p3-fb"></div></div>';
h+='<div class="wg" id="p3-iv2"><div class="wg-header"><span class="wg-badge">Интерактив 2</span><div class="wg-title">Наибольшее из трёх</div></div>'
+'<div class="wg-help">Выбери наибольшее из трёх чисел.</div>'
+'<div class="score-display"><span>Вопрос <b id="p3-mi">1</b> / 5</span><span>Очки: <b id="p3-ms">0</b> / 5</span></div>'
+'<div id="p3-mopts" style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap"></div>'
+'<div class="feedback" id="p3-mfb"></div></div>';
h+=secNav('p2','p4')+readBtn('p3');
box.innerHTML=h; renderMath(box);
(function(){
var i=0,score=0,cur=null;
function gen(){ var a=_ri(-6,6), b=_ri(-6,6); if(a===b)b=b>=0?b-1:b+1; cur={a:a,b:b}; }
function show(){ if(i>=6){ document.getElementById('p3-fig').innerHTML=''; document.getElementById('p3-q').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'p3-iv1');bumpProgress('p3',30);}else if(score>=3){addXp(8,'p3-iv1');bumpProgress('p3',16);} return; }
gen(); document.getElementById('p3-i').textContent=i+1;
document.getElementById('p3-fig').innerHTML=Math6.numberLine({min:-7,max:7,minor:1,major:1,width:580,marks:[{v:cur.a,label:'a',color:'#4f46e5'},{v:cur.b,label:'b',color:'#e11d48',above:false}]});
document.getElementById('p3-q').innerHTML='$a='+cur.a+'$, $b='+cur.b+'$. Что верно?'; renderMath(document.getElementById('p3-q'));
document.getElementById('p3-fb').style.display='none'; }
function ans(c){ if(i>=6)return; var fb=document.getElementById('p3-fb'), correct=cur.a>cur.b?'>':'<';
if(c===correct){ score++; feedback(fb,true,'✓ Верно: $'+cur.a+' '+correct+' '+cur.b+'$.'); } else feedback(fb,false,'✗ Нет: $'+cur.a+' '+correct+' '+cur.b+'$.');
document.getElementById('p3-s').textContent=score; i++; setTimeout(show,1200); }
document.querySelectorAll('#p3-iv1 [data-c]').forEach(function(b){ b.addEventListener('click',function(){ ans(b.getAttribute('data-c')); }); }); show();
})();
(function(){
var i=0,score=0,cur=null;
function gen(){ var s=[]; while(s.length<3){ var v=_ri(-9,9); if(s.indexOf(v)<0)s.push(v); } var mx=Math.max.apply(null,s); cur={s:s,mx:mx}; }
function show(){ if(i>=5){ document.getElementById('p3-mopts').innerHTML='<b>Готово!</b> '+score+' / 5'; if(score>=4){addXp(15,'p3-iv2');bumpProgress('p3',30);}else if(score>=2){addXp(8,'p3-iv2');bumpProgress('p3',16);} return; }
gen(); document.getElementById('p3-mi').textContent=i+1;
document.getElementById('p3-mopts').innerHTML=cur.s.map(function(v){ return '<button class="btn primary" data-v="'+v+'">$'+v+'$</button>'; }).join('');
document.querySelectorAll('#p3-mopts [data-v]').forEach(function(b){ b.addEventListener('click',function(){ ans(+b.getAttribute('data-v')); }); }); renderMath(document.getElementById('p3-mopts'));
document.getElementById('p3-mfb').style.display='none'; }
function ans(v){ if(i>=5)return; var fb=document.getElementById('p3-mfb');
if(v===cur.mx){ score++; feedback(fb,true,'✓ Верно: '+cur.mx+'.'); } else feedback(fb,false,'✗ Нет. Наибольшее: '+cur.mx+'.');
document.getElementById('p3-ms').textContent=score; i++; setTimeout(show,1200); }
show();
})();
}
/* ===================== § 4. СЛОЖЕНИЕ РАЦИОНАЛЬНЫХ ===================== */
function buildP4(){
var box=document.getElementById('p4-body'); var h='';
h+=makeCard('rule','Правила сложения','4.1',
'<p><b>Одинаковые знаки:</b> складываем модули, ставим общий знак: $-3+(-4)=-7$.</p>'
+'<p><b>Разные знаки:</b> из большего модуля вычитаем меньший, ставим знак числа с бо́льшим модулем: $-7+4=-3$, &nbsp; $7+(-4)=3$.</p>'
+'<p>Сумма противоположных равна нулю: $6+(-6)=0$.</p>');
h+='<div class="wg" id="p4-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Сложение на прямой</div></div>'
+'<div class="wg-help">Двигай слагаемые — результат отмечается на координатной прямой.</div>'
+'<div class="sliders"><label>$a$ = <b id="p4-av">-3</b><input type="range" id="p4-asl" min="-6" max="6" value="-3"></label><label>$b$ = <b id="p4-bv">5</b><input type="range" id="p4-bsl" min="-6" max="6" value="5"></label></div>'
+'<div id="p4-fig"></div><div id="p4-out" class="qbox"></div></div>';
h+='<div class="wg" id="p4-iv2"><div class="wg-header"><span class="wg-badge">Интерактив 2</span><div class="wg-title">Тренажёр сложения</div></div>'
+'<div class="wg-help">Сложи рациональные числа.</div>'
+'<div class="score-display"><span>Пример <b id="p4-i">1</b> / 6</span><span>Очки: <b id="p4-s">0</b> / 6</span></div>'
+'<div id="p4-q" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p4-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p4-go">Проверить</button></div>'
+'<div class="feedback" id="p4-fb"></div></div>';
h+=secNav('p3','p5')+readBtn('p4');
box.innerHTML=h; renderMath(box);
(function(){
var asl=document.getElementById('p4-asl'), bsl=document.getElementById('p4-bsl'), fig=document.getElementById('p4-fig'), out=document.getElementById('p4-out');
function render(){ var a=+asl.value,b=+bsl.value,s=a+b; document.getElementById('p4-av').textContent=a; document.getElementById('p4-bv').textContent=b;
fig.innerHTML=Math6.numberLine({min:-12,max:12,minor:1,major:2,width:580,marks:[{v:a,label:'a',color:'#4f46e5'},{v:s,label:'a+b',color:'#059669',above:false}]});
out.innerHTML='<div style="font-size:1.3rem;font-weight:800;color:var(--pri2)">$'+a+' + '+_par(b)+' = '+s+'$</div>'; renderMath(out); }
asl.oninput=render; bsl.oninput=render; render();
})();
(function(){
var i=0,score=0,cur=null;
function gen(){ var a=_nz(-12,12), b=_nz(-12,12); cur={a:a,b:b,s:a+b}; }
function show(){ if(i>=6){ document.getElementById('p4-q').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'p4-iv2');bumpProgress('p4',30);}else if(score>=3){addXp(8,'p4-iv2');bumpProgress('p4',16);} return; }
gen(); document.getElementById('p4-i').textContent=i+1; document.getElementById('p4-q').innerHTML='Вычисли $'+cur.a+' + '+_par(cur.b)+'$'; renderMath(document.getElementById('p4-q'));
document.getElementById('p4-a').value=''; document.getElementById('p4-fb').style.display='none'; }
function go(){ if(i>=6)return; var fb=document.getElementById('p4-fb'), v=parseInt(document.getElementById('p4-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===cur.s){ score++; feedback(fb,true,'✓ Верно: '+cur.s+'.'); } else feedback(fb,false,'✗ Нет. $'+cur.a+'+'+_par(cur.b)+'='+cur.s+'$.');
document.getElementById('p4-s').textContent=score; i++; setTimeout(show,1200); }
document.getElementById('p4-go').addEventListener('click',go);
document.getElementById('p4-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
}
/* ===================== § 5. ВЫЧИТАНИЕ РАЦИОНАЛЬНЫХ ===================== */
function buildP5(){
var box=document.getElementById('p5-body'); var h='';
h+=makeCard('rule','Вычитание — это прибавление противоположного','5.1',
'<p>Чтобы из числа вычесть другое, нужно к нему прибавить <b>противоположное</b>: $a - b = a + (-b)$.</p>'
+'<p>$5 - 8 = 5 + (-8) = -3$; &nbsp; $-4 - 3 = -4 + (-3) = -7$; &nbsp; $2 - (-6) = 2 + 6 = 8$.</p>');
h+='<div class="wg" id="p5-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Тренажёр вычитания</div></div>'
+'<div class="wg-help">Замени вычитание сложением с противоположным и вычисли.</div>'
+'<div class="score-display"><span>Пример <b id="p5-i">1</b> / 6</span><span>Очки: <b id="p5-s">0</b> / 6</span></div>'
+'<div id="p5-q" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p5-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p5-go">Проверить</button></div>'
+'<div class="feedback" id="p5-fb"></div></div>';
h+='<div class="wg" id="p5-iv2"><div class="wg-header"><span class="wg-badge">Интерактив 2</span><div class="wg-title">Перепиши как сложение</div></div>'
+'<div class="wg-help">Выбери верную запись вычитания в виде сложения.</div>'
+'<div class="score-display"><span>Вопрос <b id="p5-ri">1</b> / 5</span><span>Очки: <b id="p5-rs">0</b> / 5</span></div>'
+'<div id="p5-rq" class="qbox"></div><div id="p5-ropts" style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap"></div>'
+'<div class="feedback" id="p5-rfb"></div></div>';
h+=secNav('p4','p6')+readBtn('p5');
box.innerHTML=h; renderMath(box);
(function(){
var i=0,score=0,cur=null;
function gen(){ var a=_ri(-10,10), b=_nz(-10,10); cur={a:a,b:b,d:a-b}; }
function show(){ if(i>=6){ document.getElementById('p5-q').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'p5-iv1');bumpProgress('p5',30);}else if(score>=3){addXp(8,'p5-iv1');bumpProgress('p5',16);} return; }
gen(); document.getElementById('p5-i').textContent=i+1; document.getElementById('p5-q').innerHTML='Вычисли $'+cur.a+' - '+_par(cur.b)+'$'; renderMath(document.getElementById('p5-q'));
document.getElementById('p5-a').value=''; document.getElementById('p5-fb').style.display='none'; }
function go(){ if(i>=6)return; var fb=document.getElementById('p5-fb'), v=parseInt(document.getElementById('p5-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===cur.d){ score++; feedback(fb,true,'✓ Верно: '+cur.a+' + '+_par(-cur.b)+' = '+cur.d+'.'); } else feedback(fb,false,'✗ Нет. $'+cur.a+'-'+_par(cur.b)+'='+cur.a+'+'+_par(-cur.b)+'='+cur.d+'$.');
document.getElementById('p5-s').textContent=score; i++; setTimeout(show,1300); }
document.getElementById('p5-go').addEventListener('click',go);
document.getElementById('p5-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
(function(){
var i=0,score=0,cur=null;
function gen(){ var a=_ri(-8,8), b=_nz(-8,8); cur={a:a,b:b}; }
function show(){ if(i>=5){ document.getElementById('p5-rq').innerHTML='<b>Готово!</b> '+score+' / 5'; document.getElementById('p5-ropts').innerHTML=''; if(score>=4){addXp(15,'p5-iv2');bumpProgress('p5',30);}else if(score>=2){addXp(8,'p5-iv2');bumpProgress('p5',16);} return; }
gen(); document.getElementById('p5-ri').textContent=i+1; document.getElementById('p5-rq').innerHTML='Как записать $'+cur.a+' - '+_par(cur.b)+'$ в виде сложения?'; renderMath(document.getElementById('p5-rq'));
var right=cur.a+' + '+_par(-cur.b); var w1=cur.a+' + '+_par(cur.b); var w2=(-cur.a)+' + '+_par(-cur.b);
var opts=[right,w1,w2]; for(var j=opts.length-1;j>0;j--){var k=_ri(0,j),t=opts[j];opts[j]=opts[k];opts[k]=t;}
document.getElementById('p5-ropts').innerHTML=opts.map(function(o){ return '<button class="btn primary" data-o="'+o+'">$'+o+'$</button>'; }).join('');
document.querySelectorAll('#p5-ropts [data-o]').forEach(function(b){ b.addEventListener('click',function(){ ans(b.getAttribute('data-o'),right); }); }); renderMath(document.getElementById('p5-ropts'));
document.getElementById('p5-rfb').style.display='none'; }
function ans(o,right){ if(i>=5)return; var fb=document.getElementById('p5-rfb');
if(o===right){ score++; feedback(fb,true,'✓ Верно: $'+right+'$.'); } else feedback(fb,false,'✗ Нет. Правильно: $'+right+'$.');
document.getElementById('p5-rs').textContent=score; i++; setTimeout(show,1300); }
show();
})();
}
/* ===================== § 6. ЗАКОНЫ СЛОЖЕНИЯ ===================== */
function buildP6(){
var box=document.getElementById('p6-body'); var h='';
h+=makeCard('rule','Законы сложения','6.1',
'<p><b>Переместительный:</b> $a+b=b+a$ (слагаемые можно менять местами).</p>'
+'<p><b>Сочетательный:</b> $(a+b)+c=a+(b+c)$ (слагаемые можно группировать).</p>'
+'<p>Их используют для удобства: сначала складывают противоположные или «круглые» числа: $-7+15+7 = (-7+7)+15 = 15$.</p>');
h+='<div class="wg" id="p6-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Вычисли удобным способом</div></div>'
+'<div class="wg-help">Сгруппируй слагаемые, чтобы считать было легко.</div>'
+'<div class="score-display"><span>Пример <b id="p6-i">1</b> / 5</span><span>Очки: <b id="p6-s">0</b> / 5</span></div>'
+'<div id="p6-q" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p6-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p6-go">Проверить</button></div>'
+'<div class="feedback" id="p6-fb"></div></div>';
h+='<div class="wg" id="p6-iv2"><div class="wg-header"><span class="wg-badge">Интерактив 2</span><div class="wg-title">Какой закон применён?</div></div>'
+'<div class="wg-help">Определи, какой закон сложения использован в равенстве.</div>'
+'<div class="score-display"><span>Вопрос <b id="p6-li">1</b> / 5</span><span>Очки: <b id="p6-ls">0</b> / 5</span></div>'
+'<div id="p6-lq" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap"><button class="btn primary" data-l="p">переместительный</button><button class="btn primary" data-l="s">сочетательный</button></div>'
+'<div class="feedback" id="p6-lfb"></div></div>';
h+=secNav('p5','p7')+readBtn('p6');
box.innerHTML=h; renderMath(box);
(function(){
var P=[['-7 + 15 + 7',15],['23 + (-18) + (-23)',-18],['-12 + 30 + 12',30],['8 + (-15) + (-8)',-15],['-5 + (-9) + 5',-9],['-20 + 14 + 20',14]];
var order=P.map(function(_,k){return k;}); for(var j=order.length-1;j>0;j--){var k=_ri(0,j),t=order[j];order[j]=order[k];order[k]=t;}
var i=0,score=0,cur=null;
function show(){ if(i>=5){ document.getElementById('p6-q').innerHTML='<b>Готово!</b> '+score+' / 5'; if(score>=4){addXp(15,'p6-iv1');bumpProgress('p6',30);}else if(score>=2){addXp(8,'p6-iv1');bumpProgress('p6',16);} return; }
cur=P[order[i]]; document.getElementById('p6-i').textContent=i+1; document.getElementById('p6-q').innerHTML='Вычисли удобным способом: $'+cur[0]+'$'; renderMath(document.getElementById('p6-q'));
document.getElementById('p6-a').value=''; document.getElementById('p6-fb').style.display='none'; }
function go(){ if(i>=5)return; var fb=document.getElementById('p6-fb'), v=parseInt(document.getElementById('p6-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===cur[1]){ score++; feedback(fb,true,'✓ Верно: '+cur[1]+'.'); } else feedback(fb,false,'✗ Нет. Правильно: '+cur[1]+'.');
document.getElementById('p6-s').textContent=score; i++; setTimeout(show,1300); }
document.getElementById('p6-go').addEventListener('click',go);
document.getElementById('p6-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
(function(){
var Q=[['a+b = b+a','p'],['(a+b)+c = a+(b+c)','s'],['7 + (-5) = -5 + 7','p'],['(2+8)+5 = 2+(8+5)','s'],['(-3+4)+1 = -3+(4+1)','s'],['12 + 9 = 9 + 12','p']];
var order=Q.map(function(_,k){return k;}); for(var j=order.length-1;j>0;j--){var k=_ri(0,j),t=order[j];order[j]=order[k];order[k]=t;}
var i=0,score=0,cur=null;
function show(){ if(i>=5){ document.getElementById('p6-lq').innerHTML='<b>Готово!</b> '+score+' / 5'; if(score>=4){addXp(15,'p6-iv2');bumpProgress('p6',30);}else if(score>=2){addXp(8,'p6-iv2');bumpProgress('p6',16);} return; }
cur=Q[order[i]]; document.getElementById('p6-li').textContent=i+1; document.getElementById('p6-lq').innerHTML='$'+cur[0]+'$'; renderMath(document.getElementById('p6-lq'));
document.getElementById('p6-lfb').style.display='none'; }
function ans(l){ if(i>=5)return; var fb=document.getElementById('p6-lfb'), nm={p:'переместительный',s:'сочетательный'};
if(l===cur[1]){ score++; feedback(fb,true,'✓ Верно — '+nm[cur[1]]+'.'); } else feedback(fb,false,'✗ Нет. Это '+nm[cur[1]]+' закон.');
document.getElementById('p6-ls').textContent=score; i++; setTimeout(show,1300); }
document.querySelectorAll('#p6-iv2 [data-l]').forEach(function(b){ b.addEventListener('click',function(){ ans(b.getAttribute('data-l')); }); }); show();
})();
}
/* ===================== § 7. УМНОЖЕНИЕ РАЦИОНАЛЬНЫХ ===================== */
function buildP7(){
var box=document.getElementById('p7-body'); var h='';
h+=makeCard('rule','Правило знаков при умножении','7.1',
'<p>Перемножают модули, а знак определяют по правилу:</p>'
+'<table class="tbl" style="max-width:320px;margin:6px auto"><tr><th>$\\times$</th><th>$+$</th><th>$-$</th></tr><tr><th>$+$</th><td>$+$</td><td>$-$</td></tr><tr><th>$-$</th><td>$-$</td><td>$+$</td></tr></table>'
+'<p>«Минус на минус даёт плюс». $-3\\cdot(-4)=12$, &nbsp; $-3\\cdot 4=-12$. Умножение на $0$ даёт $0$.</p>');
h+='<div class="wg" id="p7-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Знак произведения</div></div>'
+'<div class="wg-help">Выбери знаки множителей — узнай знак произведения.</div>'
+'<div style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:8px"><button class="btn" data-s="pp">$(+)\\cdot(+)$</button><button class="btn" data-s="pn">$(+)\\cdot(-)$</button><button class="btn" data-s="np">$(-)\\cdot(+)$</button><button class="btn" data-s="nn">$(-)\\cdot(-)$</button></div>'
+'<div id="p7-out" class="qbox"></div></div>';
h+='<div class="wg" id="p7-iv2"><div class="wg-header"><span class="wg-badge">Интерактив 2</span><div class="wg-title">Тренажёр умножения</div></div>'
+'<div class="wg-help">Перемножь рациональные числа со знаками.</div>'
+'<div class="score-display"><span>Пример <b id="p7-i">1</b> / 6</span><span>Очки: <b id="p7-s">0</b> / 6</span></div>'
+'<div id="p7-q" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p7-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p7-go">Проверить</button></div>'
+'<div class="feedback" id="p7-fb"></div></div>';
h+=secNav('p6','p8')+readBtn('p7');
box.innerHTML=h; renderMath(box);
(function(){
var out=document.getElementById('p7-out');
function render(s){ var map={pp:['$(+)\\cdot(+)=+$','плюс'],pn:['$(+)\\cdot(-)=-$','минус'],np:['$(-)\\cdot(+)=-$','минус'],nn:['$(-)\\cdot(-)=+$','плюс']};
out.innerHTML='<div style="font-size:1.3rem;font-weight:800;color:var(--pri2)">'+map[s][0]+'</div><div style="color:var(--muted);margin-top:4px">Знак произведения — <b>'+map[s][1]+'</b>.</div>'; renderMath(out); }
document.querySelectorAll('#p7-iv1 [data-s]').forEach(function(b){ b.addEventListener('click',function(){ document.querySelectorAll('#p7-iv1 [data-s]').forEach(function(x){x.classList.remove('primary');}); b.classList.add('primary'); render(b.getAttribute('data-s')); }); });
render('nn');
})();
(function(){
var i=0,score=0,cur=null;
function gen(){ var a=_nz(-9,9), b=_nz(-9,9); cur={a:a,b:b,p:a*b}; }
function show(){ if(i>=6){ document.getElementById('p7-q').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'p7-iv2');bumpProgress('p7',30);}else if(score>=3){addXp(8,'p7-iv2');bumpProgress('p7',16);} return; }
gen(); document.getElementById('p7-i').textContent=i+1; document.getElementById('p7-q').innerHTML='Вычисли $'+_par(cur.a)+' \\cdot '+_par(cur.b)+'$'; renderMath(document.getElementById('p7-q'));
document.getElementById('p7-a').value=''; document.getElementById('p7-fb').style.display='none'; }
function go(){ if(i>=6)return; var fb=document.getElementById('p7-fb'), v=parseInt(document.getElementById('p7-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===cur.p){ score++; feedback(fb,true,'✓ Верно: '+cur.p+'.'); } else feedback(fb,false,'✗ Нет. $'+_par(cur.a)+'\\cdot'+_par(cur.b)+'='+cur.p+'$.');
document.getElementById('p7-s').textContent=score; i++; setTimeout(show,1200); }
document.getElementById('p7-go').addEventListener('click',go);
document.getElementById('p7-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
}
/* ===================== § 8. ДЕЛЕНИЕ РАЦИОНАЛЬНЫХ ===================== */
function buildP8(){
var box=document.getElementById('p8-body'); var h='';
h+=makeCard('rule','Правило знаков при делении','8.1',
'<p>Делят модули, а знак — по тому же правилу, что и при умножении: одинаковые знаки дают $+$, разные — $-$.</p>'
+'<p>$-12\\div(-3)=4$, &nbsp; $-12\\div 3=-4$, &nbsp; $12\\div(-4)=-3$. На ноль делить нельзя.</p>');
h+='<div class="wg" id="p8-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Тренажёр деления</div></div>'
+'<div class="wg-help">Раздели рациональные числа (деление нацело).</div>'
+'<div class="score-display"><span>Пример <b id="p8-i">1</b> / 6</span><span>Очки: <b id="p8-s">0</b> / 6</span></div>'
+'<div id="p8-q" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p8-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p8-go">Проверить</button></div>'
+'<div class="feedback" id="p8-fb"></div></div>';
h+='<div class="wg" id="p8-iv2"><div class="wg-header"><span class="wg-badge">Интерактив 2</span><div class="wg-title">Какой знак результата?</div></div>'
+'<div class="wg-help">Определи знак частного, не вычисляя значение.</div>'
+'<div class="score-display"><span>Вопрос <b id="p8-zi">1</b> / 5</span><span>Очки: <b id="p8-zs">0</b> / 5</span></div>'
+'<div id="p8-zq" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;flex-wrap:wrap"><button class="btn primary" data-z="+">положительный</button><button class="btn primary" data-z="-">отрицательный</button></div>'
+'<div class="feedback" id="p8-zfb"></div></div>';
h+=secNav('p7','p9')+readBtn('p8');
box.innerHTML=h; renderMath(box);
(function(){
var i=0,score=0,cur=null;
function gen(){ var q=_nz(-9,9), b=_nz(-6,6); cur={a:q*b,b:b,q:q}; }
function show(){ if(i>=6){ document.getElementById('p8-q').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'p8-iv1');bumpProgress('p8',30);}else if(score>=3){addXp(8,'p8-iv1');bumpProgress('p8',16);} return; }
gen(); document.getElementById('p8-i').textContent=i+1; document.getElementById('p8-q').innerHTML='Вычисли $'+_par(cur.a)+' \\div '+_par(cur.b)+'$'; renderMath(document.getElementById('p8-q'));
document.getElementById('p8-a').value=''; document.getElementById('p8-fb').style.display='none'; }
function go(){ if(i>=6)return; var fb=document.getElementById('p8-fb'), v=parseInt(document.getElementById('p8-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===cur.q){ score++; feedback(fb,true,'✓ Верно: '+cur.q+'.'); } else feedback(fb,false,'✗ Нет. $'+_par(cur.a)+'\\div'+_par(cur.b)+'='+cur.q+'$.');
document.getElementById('p8-s').textContent=score; i++; setTimeout(show,1200); }
document.getElementById('p8-go').addEventListener('click',go);
document.getElementById('p8-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
(function(){
var i=0,score=0,cur=null;
function gen(){ var a=_nz(-9,9), b=_nz(-9,9); cur={a:a,b:b,z:(a*b>0)?'+':'-'}; }
function show(){ if(i>=5){ document.getElementById('p8-zq').innerHTML='<b>Готово!</b> '+score+' / 5'; if(score>=4){addXp(15,'p8-iv2');bumpProgress('p8',30);}else if(score>=2){addXp(8,'p8-iv2');bumpProgress('p8',16);} return; }
gen(); document.getElementById('p8-zi').textContent=i+1; document.getElementById('p8-zq').innerHTML='Какой знак у $'+_par(cur.a)+' \\div '+_par(cur.b)+'$?'; renderMath(document.getElementById('p8-zq'));
document.getElementById('p8-zfb').style.display='none'; }
function ans(z){ if(i>=5)return; var fb=document.getElementById('p8-zfb');
if(z===cur.z){ score++; feedback(fb,true,'✓ Верно — '+(cur.z==='+'?'положительный':'отрицательный')+'.'); } else feedback(fb,false,'✗ Нет. Знак '+(cur.z==='+'?'положительный':'отрицательный')+'.');
document.getElementById('p8-zs').textContent=score; i++; setTimeout(show,1200); }
document.querySelectorAll('#p8-iv2 [data-z]').forEach(function(b){ b.addEventListener('click',function(){ ans(b.getAttribute('data-z')); }); }); show();
})();
}
/* ===================== § 9. ЗАДАЧИ НА ВСЕ ДЕЙСТВИЯ ===================== */
function buildP9(){
var box=document.getElementById('p9-body'); var h='';
h+=makeCard('rule','Порядок действий со знаками','9.1',
'<p>Сначала действия в <b>скобках</b>, затем <b>умножение и деление</b>, потом <b>сложение и вычитание</b>. Внимательно следи за знаками.</p>'
+'<p>$-3 + 4\\cdot(-2) = -3 + (-8) = -11$.</p>');
h+='<div class="wg" id="p9-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Вычисли выражение</div></div>'
+'<div class="wg-help">Соблюдай порядок действий и правила знаков.</div>'
+'<div class="score-display"><span>Пример <b id="p9-i">1</b> / 6</span><span>Очки: <b id="p9-s">0</b> / 6</span></div>'
+'<div id="p9-q" class="qbox"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="p9-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="p9-go">Проверить</button></div>'
+'<div class="feedback" id="p9-fb"></div></div>';
h+=secNav('p8','app')+readBtn('p9');
box.innerHTML=h; renderMath(box);
(function(){
var P=[['-3 + 4\\cdot(-2)',-11],['(-5+2)\\cdot 3',-9],['10 - 3\\cdot 4',-2],['-2\\cdot(-3) + 1',7],['(-8)\\div 2 - 1',-5],['-1 - (-6)',5],['5\\cdot(-2) + 12',2],['(-4)\\cdot 2 + (-3)',-11],['(-12)\\div(-4) - 5',-2],['6 + (-2)\\cdot 5',-4]];
var order=P.map(function(_,k){return k;}); for(var j=order.length-1;j>0;j--){var k=_ri(0,j),t=order[j];order[j]=order[k];order[k]=t;}
var i=0,score=0,cur=null;
function show(){ if(i>=6){ document.getElementById('p9-q').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(20,'p9-iv1');bumpProgress('p9',50);}else if(score>=3){addXp(10,'p9-iv1');bumpProgress('p9',26);} return; }
cur=P[order[i]]; document.getElementById('p9-i').textContent=i+1; document.getElementById('p9-q').innerHTML='Вычисли $'+cur[0]+'$'; renderMath(document.getElementById('p9-q'));
document.getElementById('p9-a').value=''; document.getElementById('p9-fb').style.display='none'; }
function go(){ if(i>=6)return; var fb=document.getElementById('p9-fb'), v=parseInt(document.getElementById('p9-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===cur[1]){ score++; feedback(fb,true,'✓ Верно: '+cur[1]+'.'); } else feedback(fb,false,'✗ Нет. Правильно: '+cur[1]+'.');
document.getElementById('p9-s').textContent=score; i++; setTimeout(show,1300); }
document.getElementById('p9-go').addEventListener('click',go);
document.getElementById('p9-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
}
/* ===================== § 11. МАТЕМАТИКА ВОКРУГ НАС ===================== */
function buildApp(){
var box=document.getElementById('app-body'); var h='';
h+=makeCard('theory','Отрицательные числа вокруг нас','11.1',
'<p>Температура ниже нуля, долги и доходы, высота над уровнем моря и глубина, координаты в играх и на карте — всюду нужны отрицательные числа.</p>');
h+='<div class="wg" id="app-iv1"><div class="wg-header"><span class="wg-badge">Интерактив 1</span><div class="wg-title">Задачи из жизни</div></div>'
+'<div class="wg-help">Реши практическую задачу. Ответ — целое число (можно со знаком −).</div>'
+'<div class="score-display"><span>Задача <b id="app-i">1</b> / 6</span><span>Очки: <b id="app-s">0</b> / 6</span></div>'
+'<div id="app-q" class="qbox" style="font-size:1rem;text-align:left"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="app-a" class="tinp" style="width:90px;text-align:center"><button class="btn primary" id="app-go">Проверить</button></div>'
+'<div class="feedback" id="app-fb"></div></div>';
h+=secNav('p9','final')+readBtn('app');
box.innerHTML=h; renderMath(box);
(function(){
var P=[
{q:'Утром было −5°, днём потеплело на 8°. Какая температура стала (°C)?',a:3},
{q:'Температура −3° понизилась ещё на 6°. Сколько стало (°C)?',a:-9},
{q:'На счёте было 200 руб., сняли долг 250 руб. Сколько на счёте (руб.)?',a:-50},
{q:'Подводная лодка на глубине −80 м поднялась на 30 м. На какой глубине теперь (м)?',a:-50},
{q:'Игрок имел −15 очков и заработал 40. Сколько очков стало?',a:25},
{q:'Температура поднялась с −7° до 5°. На сколько градусов потеплело?',a:12},
{q:'Лифт с −2 этажа поднялся на 7 этажей. На каком этаже он теперь?',a:5}
];
var order=P.map(function(_,k){return k;}); for(var j=order.length-1;j>0;j--){var k=_ri(0,j),t=order[j];order[j]=order[k];order[k]=t;}
var i=0,score=0,cur=null;
function show(){ if(i>=6){ document.getElementById('app-q').innerHTML='<b>Готово!</b> '+score+' / 6'; if(score>=5){addXp(15,'app-iv1');bumpProgress('app',35);}else if(score>=3){addXp(8,'app-iv1');bumpProgress('app',18);} return; }
cur=P[order[i]]; document.getElementById('app-i').textContent=i+1; document.getElementById('app-q').innerHTML=cur.q;
document.getElementById('app-a').value=''; document.getElementById('app-fb').style.display='none'; }
function go(){ if(i>=6)return; var fb=document.getElementById('app-fb'), v=parseInt(document.getElementById('app-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===cur.a){ score++; feedback(fb,true,'✓ Верно: '+cur.a+'.'); } else feedback(fb,false,'✗ Нет. Правильно: '+cur.a+'.');
document.getElementById('app-s').textContent=score; i++; setTimeout(show,1300); }
document.getElementById('app-go').addEventListener('click',go);
document.getElementById('app-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
}
/* ===================== ФИНАЛ ГЛАВЫ — БОССЫ ===================== */
function buildFinal(){
var box=document.getElementById('final-body'); var h='';
h+=makeCard('theory','Финал главы 4','★','<p>Шесть боссов проверят модуль, сравнение и все действия с рациональными числами. Победи всех!</p>');
h+='<div class="wg" id="fin"><div class="wg-header"><span class="wg-badge">Боссы</span><div class="wg-title">Сразись с главой 4</div></div>'
+'<div class="hp-boss"><div class="hp-boss-fill" id="fin-hp" style="width:100%"></div></div>'
+'<div class="score-display"><span>Босс <b id="fin-i">1</b> / 6</span><span>Побеждено: <b id="fin-s">0</b> / 6</span></div>'
+'<div id="fin-name" style="font-weight:800;color:#b91c1c;text-align:center;margin-bottom:6px"></div>'
+'<div id="fin-q" class="boss-q"></div>'
+'<div style="display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap"><input type="number" id="fin-a" class="tinp" style="width:120px;text-align:center" placeholder="ответ"><button class="btn primary" id="fin-go">Удар!</button></div>'
+'<div class="feedback" id="fin-fb"></div></div>';
h+=secNav('app',null)+readBtn('final','Завершить главу 4 (+10 XP)');
box.innerHTML=h; renderMath(box);
(function(){
var bosses=[
function(){ var v=_nz(-15,15); return {name:'Модуль', q:'Вычисли $|'+v+'|$.', ans:Math.abs(v)}; },
function(){ var a=_nz(-12,12),b=_nz(-12,12); return {name:'Сумматор', q:'Вычисли $'+a+' + '+_par(b)+'$.', ans:a+b}; },
function(){ var a=_ri(-10,10),b=_nz(-10,10); return {name:'Вычитатель', q:'Вычисли $'+a+' - '+_par(b)+'$.', ans:a-b}; },
function(){ var a=_nz(-9,9),b=_nz(-9,9); return {name:'Множитель', q:'Вычисли $'+_par(a)+' \\cdot '+_par(b)+'$.', ans:a*b}; },
function(){ var q=_nz(-9,9),b=_nz(-6,6); return {name:'Делитель', q:'Вычисли $'+_par(q*b)+' \\div '+_par(b)+'$.', ans:q}; },
function(){ var e=_pick([['-3 + 4\\cdot(-2)',-11],['(-5+2)\\cdot 3',-9],['-2\\cdot(-3)+1',7],['(-12)\\div(-4)-5',-2]]); return {name:'Порядок Действий', q:'Вычисли $'+e[0]+'$.', ans:e[1]}; }
];
var i=0,score=0,cur=null,done=false,N=6;
function show(){ if(i>=N){ done=true; document.getElementById('fin-name').textContent=''; document.getElementById('fin-q').innerHTML=(score>=5?'<b>Победа!</b> Глава 4 пройдена. ':'<b>Бой окончен.</b> ')+'Побеждено боссов: '+score+' / '+N+'.'; document.getElementById('fin-hp').style.width=(score>=5?0:40)+'%';
if(score>=5){ addXp(40,'final'); bumpProgress('final',100); if(window.confetti)try{confetti();}catch(e){} } else bumpProgress('final',60); return; }
cur=bosses[i](); document.getElementById('fin-i').textContent=i+1; document.getElementById('fin-s').textContent=score;
document.getElementById('fin-name').textContent='Босс '+(i+1)+': '+cur.name; document.getElementById('fin-hp').style.width=(100-i*100/N)+'%';
document.getElementById('fin-q').innerHTML=cur.q; renderMath(document.getElementById('fin-q'));
document.getElementById('fin-a').value=''; document.getElementById('fin-fb').style.display='none'; }
function go(){ if(done||i>=N)return; var fb=document.getElementById('fin-fb'), v=parseInt(document.getElementById('fin-a').value,10);
if(isNaN(v)){ feedback(fb,false,'Введи число.'); return; }
if(v===cur.ans){ score++; feedback(fb,true,'✓ Босс повержен! Ответ '+cur.ans+'.'); } else feedback(fb,false,'✗ Босс устоял. Верно: '+cur.ans+'.');
document.getElementById('fin-s').textContent=score; i++; setTimeout(show,1400); }
document.getElementById('fin-go').addEventListener('click',go);
document.getElementById('fin-a').addEventListener('keydown',function(e){ if(e.key==='Enter')go(); }); show();
})();
}
/* ===================== ДАННЫЕ ===================== */
var SIDEBARS = {
p1:{ title:'Шпаргалка § 1', rows:[ ['Положительные','справа от 0'], ['Отрицательные','слева от 0'], ['Ноль','ни +, ни −'], ['Координата','число точки на прямой'] ]},
p2:{ title:'Шпаргалка § 2', rows:[ ['Модуль $|a|$','расстояние до 0, $\\ge0$'], ['$|{-7}|$','$=7$'], ['Противоположные','$a$ и $-a$, сумма $0$'], ['$\\mathbb{N}\\subset\\mathbb{Z}\\subset\\mathbb{Q}$','натур. ⊂ целые ⊂ рацион.'] ]},
p3:{ title:'Шпаргалка § 3', rows:[ ['Больше','то, что правее'], ['$+ > -$','любое полож. > любого отриц.'], ['Два отрицат.','больше с меньшим модулем'], ['$-2 > -5$','ближе к нулю'] ]},
p4:{ title:'Шпаргалка § 4', rows:[ ['Одинаковые знаки','складываем модули, знак тот же'], ['Разные знаки','модули вычитаем, знак большего'], ['$a+(-a)$','$=0$'] ]},
p5:{ title:'Шпаргалка § 5', rows:[ ['Вычитание','$a-b=a+(-b)$'], ['$5-8$','$=5+(-8)=-3$'], ['$2-(-6)$','$=2+6=8$'] ]},
p6:{ title:'Шпаргалка § 6', rows:[ ['Переместительный','$a+b=b+a$'], ['Сочетательный','$(a+b)+c=a+(b+c)$'], ['Удобно','группируем противоположные'] ]},
p7:{ title:'Шпаргалка § 7', rows:[ ['$(-)\\cdot(-)$','$=+$'], ['$(+)\\cdot(-)$','$=-$'], ['Модули','перемножаем'], ['$\\cdot 0$','$=0$'] ]},
p8:{ title:'Шпаргалка § 8', rows:[ ['Знаки','как при умножении'], ['$(-)\\div(-)$','$=+$'], ['$(+)\\div(-)$','$=-$'], ['На 0','делить нельзя'] ]},
p9:{ title:'Шпаргалка § 9', rows:[ ['Порядок','скобки → ×÷ → +−'], ['Знаки','следим внимательно'], ['$-3+4\\cdot(-2)$','$=-11$'] ]},
app:{ title:'Шпаргалка § 11', rows:[ ['Потеплело','прибавляем'], ['Похолодало','вычитаем'], ['Долг','отрицательное число'], ['Глубина','со знаком −'] ]},
final:{ title:'Финал главы 4', rows:[ ['6 боссов','модуль, сравнение, все действия'], ['Победа','5 из 6 и больше'], ['Награда','+40 XP и достижение «Глава 4 пройдена»'] ]}
};
var TIPS = [
{ sec:'p1', html:'Отрицательные числа левее нуля. Чем левее число, тем оно меньше: $-6$ меньше, чем $-1$.' },
{ sec:'p2', html:'Модуль «снимает» знак: $|{-7}|=7$. Противоположное — меняет знак: для $-7$ это $7$.' },
{ sec:'p3', html:'На прямой больше то, что правее. Из двух отрицательных больше то, что ближе к нулю (меньше по модулю).' },
{ sec:'p4', html:'Сначала реши: знаки одинаковые (складываем модули) или разные (вычитаем меньший модуль из большего, знак — от большего).' },
{ sec:'p5', html:'Любое вычитание превращай в сложение: $a-b=a+(-b)$. Дальше работают правила сложения.' },
{ sec:'p6', html:'Ищи пары противоположных чисел ($-7$ и $7$) — их сумма ноль; складывай их первыми, остальное проще.' },
{ sec:'p7', html:'Сначала перемножь модули, потом поставь знак: одинаковые знаки — плюс, разные — минус. «Минус на минус — плюс».' },
{ sec:'p8', html:'Деление по тем же правилам знаков, что умножение. Сначала найди знак, потом раздели модули.' },
{ sec:'p9', html:'Порядок: скобки, потом умножение/деление, потом сложение/вычитание. Каждый шаг следи за знаком.' }
];
var GLOSSARY = [
{ term:'отрицательное число', def:'Число меньше нуля, со знаком минус ($-3$).', sec:'p1', aliases:['отрицательное число','отрицательные числа','отрицательных чисел','отрицательным'] },
{ term:'координатная прямая', def:'Прямая с началом, направлением и единичным отрезком.', sec:'p1', aliases:['координатная прямая','координатной прямой','координатную прямую'] },
{ term:'модуль', def:'Расстояние от числа до нуля, $|a|\\ge0$.', sec:'p2', aliases:['модуль','модуля','модуле','модулем','модулю'] },
{ term:'противоположные числа', def:'Числа, отличающиеся только знаком ($a$ и $-a$); их сумма ноль.', sec:'p2', aliases:['противоположные числа','противоположное число','противоположных чисел','противоположное'] },
{ term:'целые числа', def:'Натуральные, противоположные им и ноль: $\\mathbb{Z}$.', sec:'p2', aliases:['целые числа','целых чисел','целое число'] },
{ term:'рациональные числа', def:'Числа, представимые дробью $\\frac{m}{n}$ (включая отрицательные): $\\mathbb{Q}$.', sec:'p2', aliases:['рациональные числа','рациональных чисел','рациональное число'] }
];
var BUILDERS = { p1:buildP1, p2:buildP2, p3:buildP3, p4:buildP4, p5:buildP5, p6:buildP6, p7:buildP7, p8:buildP8, p9:buildP9, app:buildApp, final:buildFinal };
Object.assign(window.M6, { sidebars:SIDEBARS, tips:TIPS, glossary:GLOSSARY, builders:BUILDERS });
</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink