Adminator
1e51ef7def
- Konzept/, didaktik_geografie/, didaktik_simulation/, v2-modules/, v2-platform/ - 12 code-workspace-Files - STATUS-*.md - viele M/D/R-Änderungen an bereits getrackten Files - .gitignore verstärkt: **/.humaninput/, **/secret_keys.txt Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
121 lines
4.2 KiB
HTML
121 lines
4.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Hallo Welt — Mock-Plattform-Test</title>
|
|
<style>
|
|
body { font-family: system-ui, sans-serif; padding: 24px; max-width: 1200px; margin: 0 auto; }
|
|
h1 { color: #1f4e5a; }
|
|
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 24px; }
|
|
.panel { border: 1px solid #ddd; border-radius: 8px; overflow: hidden; }
|
|
.panel-header { background: #f7f6f3; padding: 8px 12px; font-weight: 600; }
|
|
iframe { width: 100%; height: 600px; border: 0; display: block; }
|
|
pre {
|
|
margin: 0; padding: 12px; background: #1e1e1e; color: #d4d4d4;
|
|
font-size: 12px; height: 600px; overflow: auto; font-family: 'Consolas', monospace;
|
|
}
|
|
pre .ts { color: #6a9955; }
|
|
pre .endpoint { color: #4ec9b0; }
|
|
pre .type { color: #c586c0; }
|
|
.controls { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
|
|
select, button {
|
|
font-size: 14px; padding: 6px 10px;
|
|
border: 1px solid #ccc; border-radius: 4px; background: #fff;
|
|
}
|
|
button { cursor: pointer; }
|
|
.help { color: #666; font-size: 14px; margin-top: 8px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<h1>Hallo Welt — Mock-Plattform-Test</h1>
|
|
<p class="help">Lädt das Modul gegen die Mock-Plattform und zeigt links das Modul, rechts die Telemetry-Logs in Echtzeit.</p>
|
|
|
|
<div class="controls">
|
|
<label>Test-Schüler*in:
|
|
<select id="studentSelect">
|
|
<option value="42">42 — Lena (Standard)</option>
|
|
<option value="43">43 — Yusuf (Easy-Sprache)</option>
|
|
<option value="44">44 — Sofia (A11y voll)</option>
|
|
</select>
|
|
</label>
|
|
<label>Sprache:
|
|
<select id="langSelect">
|
|
<option value="de-AT-standard">Standard</option>
|
|
<option value="de-AT-easy">Leichte Sprache</option>
|
|
</select>
|
|
</label>
|
|
<button id="reloadBtn">Neu starten</button>
|
|
<button id="clearBtn">Log leeren</button>
|
|
</div>
|
|
|
|
<div class="grid">
|
|
<div class="panel">
|
|
<div class="panel-header">Modul</div>
|
|
<iframe id="moduleFrame" title="Modul-Vorschau"></iframe>
|
|
</div>
|
|
<div class="panel">
|
|
<div class="panel-header">Telemetry-Log (Live)</div>
|
|
<pre id="log">// Wartet auf Events …</pre>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
const PLATFORM_BASE = '../../../v2-platform';
|
|
|
|
async function getToken(studentId) {
|
|
const r = await fetch(`${PLATFORM_BASE}/mock/issue-token.php?student=${studentId}&class=99`);
|
|
return (await r.json()).token;
|
|
}
|
|
|
|
async function reload() {
|
|
const studentId = document.getElementById('studentSelect').value;
|
|
const lang = document.getElementById('langSelect').value;
|
|
const token = await getToken(studentId);
|
|
const params = new URLSearchParams({
|
|
session_token: token,
|
|
student_id: studentId,
|
|
class_id: 99,
|
|
mode: 'free',
|
|
difficulty: 'L1',
|
|
lang,
|
|
resume: 0,
|
|
mock: 1, // BUGFIX 2026-05-17: sonst fragt Modul echte Plattform statt Mock
|
|
});
|
|
document.getElementById('moduleFrame').src = `../public/game.html?${params}`;
|
|
}
|
|
|
|
let lastSize = 0;
|
|
async function pollLog() {
|
|
try {
|
|
const r = await fetch(`${PLATFORM_BASE}/mock/uploads/log.jsonl?_=${Date.now()}`);
|
|
if (!r.ok) return;
|
|
const text = await r.text();
|
|
if (text.length === lastSize) return;
|
|
lastSize = text.length;
|
|
const lines = text.trim().split('\n').slice(-20); // letzte 20
|
|
document.getElementById('log').innerHTML = lines.map(l => {
|
|
try {
|
|
const e = JSON.parse(l);
|
|
const t = (e.body?.type) || '-';
|
|
return `<span class="ts">${e.ts}</span> <span class="endpoint">${e.endpoint}</span> <span class="type">[${t}]</span>\n ${JSON.stringify(e.body, null, 2)}`;
|
|
} catch { return l; }
|
|
}).join('\n\n');
|
|
document.getElementById('log').scrollTop = document.getElementById('log').scrollHeight;
|
|
} catch (e) { /* ignore */ }
|
|
}
|
|
|
|
document.getElementById('reloadBtn').addEventListener('click', reload);
|
|
document.getElementById('clearBtn').addEventListener('click', async () => {
|
|
await fetch(`${PLATFORM_BASE}/mock/uploads/log.jsonl`, { method: 'DELETE' }).catch(() => {});
|
|
// Browser kann keine Datei löschen, also nur Anzeige leeren
|
|
document.getElementById('log').innerHTML = '// Anzeige geleert (Datei selbst muss man manuell löschen).';
|
|
});
|
|
|
|
setInterval(pollLog, 1500);
|
|
reload();
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|