maxim.dolgolyov/Learn_System
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(math6): полоса процента (Гл.2 §1) + фильтр множества (Гл.3 §1)

Browse Source 
Math6Anim.barModel — полоса 0..100%, заполняется (easing) к проценту,
синхронно %↔десятичная↔дробь; вшита в §2.1 на тот же ползунок, что и сетка 100.
Math6Anim.setFilter — числа 1..12 по очереди проходят сквозь «фильтр свойства»
(чётные/кратные 3/больше 6), подходящие падают в множество; кнопки смены свойства;
вшита в §3.1. Теперь во ВСЕХ 6 главах есть canvas-анимации + stepPlayer везде.
Headless-safe. Тесты math6: 20/20.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Maxim Dolgolyov
2026-06-02 22:00:57 +03:00
parent 97966ba2df
commit 302b062649
4 changed files with 78 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/textbooks/math_6_ch2.html
+4 -3
View File
@@ -129,7 +129,7 @@ function buildP1(){
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">Двигай ползунок — закрашенные клетки из 100 показывают процент.</div>'
+'<div class="sliders"><label>Процент = <b id="p1-pv">35</b>%<input type="range" id="p1-p" min="0" max="100" value="35"></label></div>'
+'<div id="p1-fig"></div><div id="p1-out" class="qbox"></div></div>';
+'<div id="p1-fig"></div><div id="p1-bar" style="margin:8px 0"></div><div id="p1-out" class="qbox"></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-i">1</b> / 6</span><span>Очки: <b id="p1-s">0</b> / 6</span></div>'
@@ -140,9 +140,10 @@ function buildP1(){
box.innerHTML=h; renderMath(box);
(function(){
var sl=document.getElementById('p1-p'), fig=document.getElementById('p1-fig'), out=document.getElementById('p1-out');
var sl=document.getElementById('p1-p'), fig=document.getElementById('p1-fig'), out=document.getElementById('p1-out'), bar=null;
function render(){ var p=+sl.value; document.getElementById('p1-pv').textContent=p; fig.innerHTML=grid100(p);
out.innerHTML='<div style="font-size:1.2rem;font-weight:800;color:var(--pri2)">$'+p+'\\% = \\dfrac{'+p+'}{100} = '+_kf(p/100)+'$</div>'; renderMath(out); }
out.innerHTML='<div style="font-size:1.2rem;font-weight:800;color:var(--pri2)">$'+p+'\\% = \\dfrac{'+p+'}{100} = '+_kf(p/100)+'$</div>'; renderMath(out);
if(window.Math6Anim){ if(!bar) bar=Math6Anim.barModel(document.getElementById('p1-bar'),{percent:p}); else bar.set(p); } }
sl.oninput=render; render();
})();