Adminator/geograsim
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Schueler: Auftrags-Card im Marken-Stil (Sim-Bild + Orange + 📋 Auftrag-Badge)

Browse Source 
- renderAuftragCard nutzt card_image + .mod-card-Muster statt Verlauf+Emoji
- Warte-Zustand bei pausierter (Tempo-)Freigabe: "⏳ Wartet auf Freigabe"

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Thomas
2026-07-22 11:49:34 +02:00
parent 97144495a1
commit 3a2e65ebd9
1 changed files with 29 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files
App/schueler.html
+29 -15
View File
@@ -225,21 +225,35 @@ async function renderModules() {
// das Modul aber spielbar bleibt.
var teacherStarted = modList.filter(function(m) { return m.mode === 'teacher_started' && !m.assignmentCompleted; });
if (teacherStarted.length > 0) {
html += '<div style="margin-bottom:1rem">';
html += '<p style="font-size:.78rem;font-weight:700;color:#e8833a;margin-bottom:.4rem">📋 Aufträge von deiner Lehrperson</p>';
teacherStarted.forEach(function(m) {
var due = m.dueDate ? '<br><span style="font-size:.6rem;color:#8a8a8a">Zu erledigen bis ' + new Date(m.dueDate).toLocaleDateString('de-AT',{day:'2-digit',month:'2-digit',year:'numeric',hour:'2-digit',minute:'2-digit'}) + '</span>' : '';
var quiz = m.quizEnabled ? '<br><span style="font-size:.6rem;color:#4a7c8a">📝 Mit kurzem Quiz</span>' : '';
var url = buildModuleUrl(m);
html += '<a href="'+url+'" class="mod-card" style="border-color:#e8833a;border-width:2px;margin-bottom:.5rem">';
html += '<div class="mod-img" style="height:80px;background:linear-gradient(135deg,#e8833a,#f4a261)"><span style="font-size:2.5rem">'+(m.icon||'📚')+'</span></div>';
html += '<div class="mod-body">';
html += '<h3 style="color:#e8833a">'+m.icon+' '+m.name+(m.forcedLevel ? ' — Stufe '+m.forcedLevel : '')+'</h3>';
html += '<p>Auftrag von deiner Lehrperson'+due+quiz+'</p>';
html += '<span class="mod-status" style="background:#fde8d0;color:#e8833a">▶ Jetzt starten</span>';
html += '</div></a>';
});
html += '</div>';
html += '<div style="margin-bottom:1.3rem">';
html += '<p style="font-size:.84rem;font-weight:800;color:#e8833a;margin-bottom:.55rem;display:flex;align-items:center;gap:.4rem">📋 Aufträge von deiner Lehrperson</p>';
html += '<div class="mod-grid">';
teacherStarted.forEach(function(m) { html += renderAuftragCard(m); });
html += '</div></div>';
}
// Auftrags-Card im Marken-Stil: Sim-Bild + Orange-Akzent, klar als Auftrag erkennbar.
function renderAuftragCard(m) {
var cardImg = m.card_image ? 'assets/img/' + m.card_image : null;
var imgHtml = cardImg ? '<img src="'+cardImg+'" alt="">' : '<span style="font-size:3rem">'+(m.icon||'📚')+'</span>';
var url = buildModuleUrl(m);
var badge = '<span style="position:absolute;top:8px;left:8px;background:#e8833a;color:#fff;font-size:.66rem;font-weight:800;padding:3px 11px;border-radius:9999px;letter-spacing:.04em;box-shadow:0 2px 5px rgba(0,0,0,.22);z-index:5">📋 Auftrag</span>';
var meta = [];
if (m.dueDate) meta.push('⏰ bis ' + new Date(m.dueDate).toLocaleDateString('de-AT',{day:'2-digit',month:'2-digit',hour:'2-digit',minute:'2-digit'}));
if (m.quizEnabled) meta.push('📝 mit kurzem Quiz');
var s = '<div class="mod-card spielbar" style="border-color:#e8833a;border-width:2px">';
s += '<div class="mod-img" style="position:relative">'+imgHtml+badge+'</div>';
s += '<div class="mod-body">';
s += '<h3 style="color:#c25e1e">'+(m.icon||'📚')+' '+m.name+(m.forcedLevel ? ' <span style="font-weight:600;color:#9a9a9a;font-size:.82rem">· Stufe '+m.forcedLevel+'</span>' : '')+'</h3>';
s += '<p>Auftrag von deiner Lehrperson'+(meta.length ? '<br><span style="color:#8a8a8a">'+meta.join(' · ')+'</span>' : '')+'</p>';
s += '<div class="mod-actions">';
if (m.paused) {
s += '<span class="mod-btn" style="flex:1;justify-content:center;background:#fdf1e6;color:#c25e1e;border-color:#e8c3a0;cursor:default" title="Deine Lehrperson gibt den Start noch frei">⏳ Wartet auf Freigabe</span>';
} else {
s += '<a href="'+url+'" class="mod-btn primary" style="background:#e8833a;border-color:#e8833a">▶ Jetzt starten</a>';
}
s += '</div></div></div>';
return s;
}
// Regulaere Module: spielbar zuerst, "in Kürze" am Ende.