ZB-Server/it232Abschied
Private
Public Access
1
0
Fork 0
Code Packages Activity

bug fixes

Browse Source
This commit is contained in:
Sebastian Unterschütz
2025-11-26 18:56:59 +01:00
parent 6fdad68a9b
commit cf2e6e1c94
13 changed files with 392 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
static/index.html
View File

@@ -69,7 +69,7 @@
<p>Dein Score: <span id="finalScore" style="color:yellow; font-size: 24px;">0</span></p>
<div id="inputSection">
<input type="text" id="playerNameInput" placeholder="Dein Name" maxlength="10">
<input type="text" id="playerNameInput" placeholder="NAME" maxlength="4" style="text-transform:uppercase;">
<button id="submitBtn" onclick="submitScore()">EINTRAGEN</button>
</div>

2
static/js/config.js
View File

@@ -10,7 +10,7 @@ const CHUNK_SIZE = 60;
const TARGET_FPS = 60;
const MS_PER_TICK = 1000 / TARGET_FPS;
const DEBUG_SYNC = true;
const DEBUG_SYNC = false;
const SYNC_TOLERANCE = 5.0;
// RNG Klasse

4
static/js/logic.js
View File

@@ -53,7 +53,9 @@ function updateGameLogic() {
else if (obs.def.type === "powerup") {
if (obs.def.id === "p_god") godModeLives = 3;
if (obs.def.id === "p_bat") hasBat = true;
if (obs.def.id === "p_boot") bootTicks = 600; // ca. 10 Sekunden
if (obs.def.id === "p_boot") bootTicks = 600;
lastPowerupTick = currentTick;
continue; // Entfernen (Eingesammelt)
}
// C. GEGNER / HINDERNIS

67
static/js/main.js
View File

@@ -50,7 +50,7 @@ window.startGameClick = async function() {
sessionID = sData.sessionId;
rng = new PseudoRNG(sData.seed);
isGameRunning = true;
// Wir resetten die Zeit, damit es keinen Sprung gibt
maxRawBgIndex = 0;
lastTime = performance.now();
resize();
} catch(e) {
@@ -100,32 +100,48 @@ window.submitScore = async function() {
// ==========================================
window.showMyCodes = function() {
if(window.openModal) window.openModal('codes');
const listEl = document.getElementById('codesList');
if(!listEl) return;
const claims = JSON.parse(localStorage.getItem('escape_claims') || '[]');
if (claims.length === 0) {
const rawClaims = JSON.parse(localStorage.getItem('escape_claims') || '[]');
if (rawClaims.length === 0) {
listEl.innerHTML = "<div style='padding:10px; text-align:center; color:#666;'>Keine Codes gespeichert.</div>";
return;
}
const sortedClaims = rawClaims
.map((item, index) => ({ ...item, originalIndex: index }))
.sort((a, b) => b.score - a.score);
let html = "";
for (let i = claims.length - 1; i >= 0; i--) {
const c = claims[i];
sortedClaims.forEach(c => {
const canDelete = c.sessionId ? true : false;
const btnStyle = canDelete ? "cursor:pointer; color:#ff4444; border-color:#ff4444;" : "cursor:not-allowed; color:gray; border-color:gray;";
const btnAttr = canDelete ? `onclick="deleteClaim(${i}, '${c.sessionId}', '${c.code}')"` : "disabled";
const btnAttr = canDelete ? `onclick="deleteClaim(${c.originalIndex}, '${c.sessionId}', '${c.code}')"` : "disabled";
let rankIcon = "📄";
if (c.score >= 10000) rankIcon = "🔥";
if (c.score >= 5000) rankIcon = "⭐";
html += `
<div style="border-bottom:1px solid #444; padding:8px 0; display:flex; justify-content:space-between; align-items:center;">
<div style="text-align:left;">
<span style="color:#00e5ff; font-weight:bold; font-size:12px;">${c.code}</span>
<span style="color:#ffcc00;">(${c.score} Pkt)</span><br>
<span style="color:#00e5ff; font-weight:bold; font-size:12px;">${rankIcon} ${c.code}</span>
<span style="color:#ffcc00; font-weight:bold;">(${c.score} Pkt)</span><br>
<span style="color:#aaa; font-size:9px;">${c.name} • ${c.date}</span>
</div>
<button ${btnAttr} style="background:transparent; border:1px solid; padding:5px; font-size:9px; margin:0; ${btnStyle}">LÖSCHEN</button>
<button ${btnAttr}
style="background:transparent; border:1px solid; padding:5px; font-size:9px; margin:0; ${btnStyle}">
LÖSCHEN
</button>
</div>`;
}
});
listEl.innerHTML = html;
};
@@ -150,13 +166,38 @@ async function loadLeaderboard() {
try {
const res = await fetch(`/api/leaderboard?sessionId=${sessionID}`);
const entries = await res.json();
let html = "<h3>BESTENLISTE</h3>";
let html = "<h3 style='margin-bottom:5px'>BESTENLISTE</h3>";
entries.forEach(e => {
const color = e.isMe ? "yellow" : "white";
html += `<div style="display:flex; justify-content:space-between; color:${color}; margin-bottom:5px;"><span>#${e.rank} ${e.name}</span><span>${Math.floor(e.score/10)}</span></div>`;
const bgStyle = e.isMe ? "background:rgba(255,255,0,0.1);" : "";
const betterThanMe = e.rank - 1;
let infoText = "";
if (e.isMe && betterThanMe > 0) {
infoText = `<div style='font-size:8px; color:#aaa;'>(${betterThanMe} waren besser)</div>`;
} else if (e.isMe && betterThanMe === 0) {
infoText = `<div style='font-size:8px; color:#ffcc00;'>👑 NIEMAND ist besser!</div>`;
}
html += `
<div style="border-bottom:1px dotted #444; padding:5px; ${bgStyle} margin-bottom:2px;">
<div style="display:flex; justify-content:space-between; color:${color};">
<span>#${e.rank} ${e.name.toUpperCase()}</span>
<span>${Math.floor(e.score/10)}</span>
</div>
${infoText}
</div>`;
if(e.rank === 3 && entries.length > 3 && !entries[3].isMe) {
html += "<div style='text-align:center; color:gray; font-size:8px;'>...</div>";
}
});
document.getElementById('leaderboard').innerHTML = html;
} catch(e) {}
} catch(e) { console.error(e); }
}
async function loadStartScreenLeaderboard() {

14
static/js/network.js
View File

@@ -27,11 +27,21 @@ async function sendChunk() {
if (data.serverObs) {
serverObstacles = data.serverObs;
// --- NEU: DEBUG MODUS VERGLEICH ---
if (typeof DEBUG_SYNC !== 'undefined' && DEBUG_SYNC) {
compareState(snapshotobstacles, data.serverObs);
}
// ----------------------------------
if (data.powerups) {
const sTick = data.serverTick;
if (lastPowerupTick > sTick) {
} else {
godModeLives = data.powerups.godLives;
hasBat = data.powerups.hasBat;
bootTicks = data.powerups.bootTicks;
}
}
}
if (data.status === "dead") {

18
static/js/render.js
View File

@@ -44,29 +44,29 @@ resize();
// --- DRAWING ---
function drawGame() {
// 1. Alles löschen
ctx.clearRect(0, 0, GAME_WIDTH, GAME_HEIGHT);
// --- HINTERGRUND (Level-Wechsel) ---
let currentBg = null;
// Haben wir Hintergründe geladen?
if (bgSprites.length > 0) {
// Wechsel alle 2000 Punkte (Server-Score) = 200 Punkte (Anzeige)
const changeInterval = 10000;
// Berechne Index: 0-1999 -> 0, 2000-3999 -> 1, etc.
// Das % (Modulo) sorgt dafür, dass es wieder von vorne anfängt, wenn die Bilder ausgehen
const bgIndex = Math.floor(score / changeInterval) % bgSprites.length;
const currentRawIndex = Math.floor(score / changeInterval);
if (currentRawIndex > maxRawBgIndex) {
maxRawBgIndex = currentRawIndex;
}
const bgIndex = maxRawBgIndex % bgSprites.length;
currentBg = bgSprites[bgIndex];
}
if (currentBg && currentBg.complete && currentBg.naturalHeight !== 0) {
ctx.drawImage(currentBg, 0, 0, GAME_WIDTH, GAME_HEIGHT);
} else {
// Fallback: Hellgrau, falls Bild fehlt
// Fallback
ctx.fillStyle = "#f0f0f0";
ctx.fillRect(0, 0, GAME_WIDTH, GAME_HEIGHT);
}
@@ -127,7 +127,7 @@ function drawGame() {
if(bootTicks > 0) statusText += `👟 ${(bootTicks/60).toFixed(1)}s`;
// Drift Info (nur wenn Objekte da sind)
if (obstacles.length > 0 && serverObstacles.length > 0) {
if (DEBUG_SYNC == true && length > 0 && serverObstacles.length > 0) {
const drift = Math.abs(obstacles[0].x - serverObstacles[0].x).toFixed(1);
statusText += ` | Drift: ${drift}px`; // Einkommentieren für Debugging
}

2
static/js/state.js
View File

@@ -19,10 +19,12 @@ let bootTicks = 0;
// Hintergrund
let currentBgIndex = 0;
let maxRawBgIndex = 0;
// Tick Time
let lastTime = 0;
let accumulator = 0;
let lastPowerupTick = -9999;
// Grafiken
let sprites = {};