aln/edu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
Sebastian Molenda
2026-05-05 16:22:20 +02:00
commit 838cb9743e
6 changed files with 776 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

162
index.html Normal file
View File

@@ -0,0 +1,162 @@
<!doctype html>
<html lang="pl">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover" />
<title>Trening Matematyczny - Dodawanie/Odejmowanie</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<div class="app-wrap">
<main class="screen" id="menu-screen">
<h1 class="app-title">Matma Trening</h1>
<section class="panel">
<h2>Wybierz działania</h2>
<div class="ops" id="ops">
<button class="op-btn" data-op="add">+ Dodawanie</button>
<button class="op-btn" data-op="sub">− Odejmowanie</button>
<button class="op-btn" data-op="mul">× Mnożenie</button>
<button class="op-btn" data-op="div">÷ Dzielenie</button>
</div>
</section>
<section class="panel">
<h2>Tryb gry</h2>
<div class="modes">
<button class="mode-btn" data-mode="timed" id="mode-timed">
<span class="icon">⧗</span>
Na czas
</button>
<button class="mode-btn" data-mode="training" id="mode-training">
<span class="icon">∞</span>
Trening
</button>
</div>
<p class="hint">Wybierz co najmniej jedno działanie, a następnie tryb, aby rozpocząć.</p>
</section>
<section class="panel">
<h2>Historia
<button id="history-toggle" class="small" style="float:right">Pokaż</button>
</h2>
<div class="history-list collapsed" id="history-panel">
<div id="history-list">
<!-- wpisy historii w menu -->
</div>
</div>
</section>
<section class="panel">
<h2>
Ustawienia
<button id="settings-toggle" class="small" style="float:right">Pokaż</button>
</h2>
<div class="settings collapsed" id="settings-panel">
<label> Czas (sek) — tryb na czas
<input id="setting-timed" type="number" min="5" max="600" />
</label>
<label> Maksymalny wynik
<input id="setting-max-result" type="number" min="1" max="999" />
</label>
<label> Maksymalna składowa (operand)
<input id="setting-max-operand" type="number" min="1" max="999" />
</label>
<label> Liczba zadań (tryb Trening)
<input id="setting-session-problems" type="number" min="1" max="500" />
</label>
<label> Wynik może być ujemny
<input id="setting-allow-negative" type="checkbox" />
</label>
<label> Wynik może być ułamkiem
<input id="setting-allow-fraction" type="checkbox" />
</label>
<div class="settings-actions">
<button id="save-settings" class="mode-btn">Zapisz</button>
<button id="reset-settings" class="mode-btn">Reset</button>
</div>
</div>
</section>
</main>
<main class="screen hidden" id="play-screen">
<header class="play-header">
<div class="left">
<button id="back-btn" class="small">← Menu</button>
</div>
<div class="center">
<div id="status">Trening</div>
</div>
<div class="right">
<div id="score">0</div>
</div>
</header>
<div class="progress-outer"><div id="progress-inner" class="progress-inner"></div></div>
<section class="problem-area">
<div id="timer" class="timer hidden">60</div>
<div id="problem" class="problem">—</div>
<div id="feedback" class="feedback"></div>
</section>
<section class="answer-area">
<div id="answer" class="answer"> </div>
<div class="keypad">
<div class="row">
<button class="key">1</button>
<button class="key">2</button>
<button class="key">3</button>
</div>
<div class="row">
<button class="key">4</button>
<button class="key">5</button>
<button class="key">6</button>
</div>
<div class="row">
<button class="key">7</button>
<button class="key">8</button>
<button class="key">9</button>
</div>
<div class="row">
<button class="key special" id="negate">+/-</button>
<button class="key">0</button>
<button class="key" id="dot">.</button>
</div>
<div class="row">
<button class="key special" id="clear">C</button>
<button class="key special" id="backspace">←</button>
<button class="submit-btn" id="submit">Sprawdź</button>
</div>
</div>
</section>
<section class="panel hidden" id="summary-panel">
<div class="summary">
<h2>Podsumowanie</h2>
<p id="summary-text">Poprawne odpowiedzi: 0</p>
<div style="display:flex;gap:8px;justify-content:center;margin-top:12px">
<button id="summary-back" class="mode-btn">Powrót</button>
</div>
</div>
</section>
</main>
<main class="screen hidden" id="history-screen">
<header class="play-header">
<div class="left">
<button id="history-back" class="small">← Menu</button>
</div>
<div class="center"><strong>Historia sesji</strong></div>
<div class="right">
<button id="clear-history" class="small">Wyczyść</button>
</div>
</header>
<section class="panel history-list" id="history-list">
<!-- wpisy historii -->
</section>
</main>
</div>
<script src="app.js"></script>
</body>
</html>