GF.game({ title: "Maze Shooter 3D", instructions: "Move & turn to navigate. Shoot enemies. Clear all then reach EXIT!", scoreLabel: "Kills", bg: '#1a0a00', accent: '#ff6600', winText: "You escaped the maze!", loseText: "You died in the maze...", lives: 1, hud: false, controls: 'none', setup: function(GF) { this.MAP_W = 12; this.MAP_H = 12; this.map = []; this.enemies = []; this.bullets = []; this.particles = []; this.health = 100; this.maxHealth = 100; this.invTimer = 0; this.shootCooldown = 0; this.gameOver = false; this.won = false; this.flashTimer = 0; this.flashColor = ''; this.exitX = 0; this.exitY = 0; this.killCount = 0; this.totalEnemies = 0; this.muzzleFlash = 0; // Generate maze var M = this.MAP_W, N = this.MAP_H; var map = []; for (var y = 0; y < N; y++) { map[y] = []; for (var x = 0; x < M; x++) { map[y][x] = 1; } } // Recursive backtracker var visited = []; for (var y = 0; y < N; y++) { visited[y] = []; for (var x = 0; x < M; x++) visited[y][x] = false; } var stack = []; var cx = 1, cy = 1; map[cy][cx] = 0; visited[cy][cx] = true; stack.push([cx, cy]); var dirs = [[0,-2],[0,2],[-2,0],[2,0]]; while (stack.length > 0) { var cur = stack[stack.length-1]; cx = cur[0]; cy = cur[1]; var shuffled = dirs.slice().sort(function(){return Math.random()-0.5;}); var moved = false; for (var i = 0; i < shuffled.length; i++) { var nx = cx + shuffled[i][0], ny = cy + shuffled[i][1]; if (nx > 0 && nx < M-1 && ny > 0 && ny < N-1 && !visited[ny][nx]) { map[ny - shuffled[i][1]/2][nx - shuffled[i][0]/2] = 0; map[ny][nx] = 0; visited[ny][nx] = true; stack.push([nx, ny]); moved = true; break; } } if (!moved) stack.pop(); } this.map = map; // Player start this.px = 1.5; this.py = 1.5; this.pAngle = 0; this.pSpeed = 3.0; this.pTurnSpeed = 2.2; // Exit tile this.exitX = M - 2; this.exitY = N - 2; map[this.exitY][this.exitX] = 0; // Place enemies var numEnemies = 8; var placed = 0; var attempts = 0; while (placed < numEnemies && attempts < 200) { attempts++; var ex = GF.randInt(1, M-2); var ey = GF.randInt(1, N-2); if (map[ey][ex] === 0 && !(Math.abs(ex-1)<2 && Math.abs(ey-1)<2)) { this.enemies.push({ x: ex + 0.5, y: ey + 0.5, angle: GF.rand(0, Math.PI*2), speed: GF.rand(0.5, 1.0), health: 1, alive: true, moveTimer: GF.rand(0, 2), size: 0.3 }); placed++; } } this.totalEnemies = this.enemies.length; // Button areas this.btnFwd = {x: 200, y: 700, w: 80, h: 60}; this.btnBack = {x: 200, y: 760, w: 80, h: 40}; this.btnLeft = {x: 60, y: 720, w: 80, h: 60}; this.btnRight = {x: 340, y: 720, w: 80, h: 60}; this.btnShoot = {x: 380, y: 650, w: 90, h: 70}; this.FOV = Math.PI / 3; this.NUM_RAYS = 80; }, update: function(dt, GF) { if (this.gameOver || this.won) return; dt = Math.min(dt, 0.05); this.invTimer = Math.max(0, this.invTimer - dt); this.shootCooldown = Math.max(0, this.shootCooldown - dt); this.muzzleFlash = Math.max(0, this.muzzleFlash - dt); this.flashTimer = Math.max(0, this.flashTimer - dt); // Input var px = GF.pointer.x, py = GF.pointer.y; var pdown = GF.pointer.down; var fwd = false, back = false, left = false, right = false, shoot = false; function inBtn(btn) { return pdown && px >= btn.x && px <= btn.x+btn.w && py >= btn.y && py <= btn.y+btn.h; } if (inBtn(this.btnFwd)) fwd = true; if (inBtn(this.btnBack)) back = true; if (inBtn(this.btnLeft)) left = true; if (inBtn(this.btnRight)) right = true; if (inBtn(this.btnShoot)) shoot = true; // Turn if (left) this.pAngle -= this.pTurnSpeed * dt; if (right) this.pAngle += this.pTurnSpeed * dt; // Move var moveDir = 0; if (fwd) moveDir = 1; if (back) moveDir = -1; if (moveDir !== 0) { var nx = this.px + Math.cos(this.pAngle) * this.pSpeed * dt * moveDir; var ny = this.py + Math.sin(this.pAngle) * this.pSpeed * dt * moveDir; var r = 0.25; if (this.map[Math.floor(ny)][Math.floor(this.px)] === 0) this.py = ny; if (this.map[Math.floor(this.py)][Math.floor(nx)] === 0) this.px = nx; } // Shoot if (shoot && this.shootCooldown <= 0) { this.shootCooldown = 0.35; this.muzzleFlash = 0.1; GF.sound('shoot'); // Raycast for enemy hit var hitDist = 20; var ax = this.pAngle; var bx = this.px, by = this.py; var dx = Math.cos(ax), dy = Math.sin(ax); var closest = null; var closestDist = 20; for (var i = 0; i < this.enemies.length; i++) { var e = this.enemies[i]; if (!e.alive) continue; var ex = e.x - bx, ey = e.y - by; var dot = ex*dx + ey*dy; if (dot < 0) continue; var perpDist = Math.abs(ex*dy - ey*dx); if (perpDist < e.size + 0.15 && dot < closestDist) { closestDist = dot; closest = e; } } if (closest) { closest.alive = false; this.killCount++; GF.addScore(10); GF.sound('explode'); // Particles for (var p = 0; p < 8; p++) { var ang = GF.rand(0, Math.PI*2); this.particles.push({ x: closest.x, y: closest.y, vx: Math.cos(ang)*2, vy: Math.sin(ang)*2, life: 0.5, maxLife: 0.5, color: '#ff4400' }); } } } // Enemy AI for (var i = 0; i < this.enemies.length; i++) { var e = this.enemies[i]; if (!e.alive) continue; e.moveTimer -= dt; if (e.moveTimer <= 0) { e.angle = GF.rand(0, Math.PI*2); e.moveTimer = GF.rand(0.5, 2.0); } var spd = e.speed; var enx = e.x + Math.cos(e.angle)*spd*dt; var eny = e.y + Math.sin(e.angle)*spd*dt; if (this.map[Math.floor(eny)][Math.floor(e.x)] === 0) e.y = eny; else { e.angle = GF.rand(0, Math.PI*2); e.moveTimer = GF.rand(0.3,1.0); } if (this.map[Math.floor(e.y)][Math.floor(enx)] === 0) e.x = enx; else { e.angle = GF.rand(0, Math.PI*2); e.moveTimer = GF.rand(0.3,1.0); } // Damage player if (this.invTimer <= 0) { var d = GF.dist(this.px, this.py, e.x, e.y); if (d < 0.5) { this.health -= 20; this.invTimer = 1.5; this.flashTimer = 0.2; this.flashColor = 'rgba(255,0,0,0.4)'; GF.sound('hit'); if (this.health <= 0) { this.health = 0; this.gameOver = true; GF.sound('lose'); GF.lose(); } } } } // Particles for (var i = this.particles.length-1; i >= 0; i--) { var p = this.particles[i]; p.x += p.vx * dt; p.y += p.vy * dt; p.life -= dt; if (p.life <= 0) this.particles.splice(i, 1); } if (this.particles.length > 150) this.particles.splice(0, this.particles.length - 150); // Win condition var allDead = this.enemies.every(function(e){ return !e.alive; }); var atExit = Math.floor(this.px) === this.exitX && Math.floor(this.py) === this.exitY; if (allDead && atExit) { this.won = true; GF.sound('win'); GF.win(); } }, draw: function(GF) { var W = GF.W, H = GF.H; var viewH = 620; // Sky GF.rect(0, 0, W, viewH/2, '#1a1a2e'); // Floor GF.rect(0, viewH/2, W, viewH/2, '#2a1a0a'); // Raycasting var numRays = this.NUM_RAYS; var sliceW = W / numRays; var halfFOV = this.FOV / 2; // Collect wall slices var zBuffer = []; for (var r = 0; r < numRays; r++) { var rayAngle = this.pAngle - halfFOV + (r / numRays) * this.FOV; var rdx = Math.cos(rayAngle); var rdy = Math.sin(rayAngle); var dist = 0; var step = 0.05; var hit = false; var rx = this.px, ry = this.py; for (var s = 0; s < 400; s++) { rx += rdx * step; ry += rdy * step; dist += step; var mx = Math.floor(rx), my = Math.floor(ry); if (mx < 0 || mx >= this.MAP_W || my < 0 || my >= this.MAP_H) { hit = true; break; } if (this.map[my][mx] === 1) { hit = true; break; } } // Fix fisheye var corrDist = dist * Math.cos(rayAngle - this.pAngle); zBuffer[r] = corrDist; var wallH = Math.min(viewH, (viewH / (corrDist + 0.0001)) * 0.8); var shade = Math.max(0, Math.min(255, 255 - corrDist * 30)); var col = 'rgb(' + Math.floor(shade*0.7) + ',' + Math.floor(shade*0.5) + ',' + Math.floor(shade*0.3) + ')'; var wx = r * sliceW; var wy = (viewH - wallH) / 2; GF.rect(wx, wy, sliceW + 1, wallH, col); } // Draw enemies as sprites for (var i = 0; i < this.enemies.length; i++) { var e = this.enemies[i]; if (!e.alive) continue; var ex = e.x - this.px, ey = e.y - this.py; var dist2 = Math.sqrt(ex*ex + ey*ey); if (dist2 < 0.3) continue; var angle = Math.atan2(ey, ex) - this.pAngle; while (angle > Math.PI) angle -= Math.PI*2; while (angle < -Math.PI) angle += Math.PI*2; if (Math.abs(angle) > halfFOV + 0.1) continue; var corrD = dist2 * Math.cos(angle); var screenX = ((angle + halfFOV) / this.FOV) * W; var sprH = Math.min(viewH, (viewH / (corrD + 0.001)) * 0.6); var sprW = sprH * 0.7; var sprX = screenX - sprW/2; var sprY = (viewH - sprH) / 2; // Check z-buffer var rayIdx = Math.floor(screenX / sliceW); if (rayIdx < 0 || rayIdx >= numRays) continue; if (corrD > zBuffer[rayIdx] + 0.1) continue; var shade2 = Math.max(0.2, 1 - corrD/10); var gc = Math.floor(200 * shade2); GF.circle(screenX, sprY + sprH*0.35, sprH*0.3, 'rgb('+gc+',0,0)'); GF.circle(screenX, sprY + sprH*0.35, sprH*0.2, 'rgb('+Math.floor(gc*1.3)+','+Math.floor(gc*0.3)+',0)'); // Eyes GF.circle(screenX - sprH*0.08, sprY + sprH*0.28, sprH*0.06, '#ffff00'); GF.circle(screenX + sprH*0.08, sprY + sprH*0.28, sprH*0.06, '#ffff00'); } // Exit marker (simple indicator) var exRelX = this.exitX + 0.5 - this.px; var exRelY = this.exitY + 0.5 - this.py; var exDist = Math.sqrt(exRelX*exRelX + exRelY*exRelY); var exAngle = Math.atan2(exRelY, exRelX) - this.pAngle; while (exAngle > Math.PI) exAngle -= Math.PI*2; while (exAngle < -Math.PI) exAngle += Math.PI*2; if (Math.abs(exAngle) < halfFOV && exDist > 0.5) { var exScreenX = ((exAngle + halfFOV) / this.FOV) * W; var exRayIdx = Math.floor(exScreenX / sliceW); if (exRayIdx >= 0 && exRayIdx < this.NUM_RAYS && exDist < zBuffer[exRayIdx] + 0.5) { var exH = Math.min(viewH, (viewH / (exDist * Math.cos(exAngle) + 0.001)) * 0.8); var allDead2 = this.enemies.every(function(e){ return !e.alive; }); var exColor = allDead2 ? '#00ff88' : '#888888'; GF.rect(exScreenX - 8, (viewH - exH)/2, 16, exH, exColor); if (allDead2) GF.text('EXIT', exScreenX, (viewH - exH)/2 - 10, {size:12, color:'#00ff88', align:'center', bold:true}); } } // Crosshair var cx = W/2, cy = viewH/2; GF.line(cx-12, cy, cx+12, cy, '#ffffff', 2); GF.line(cx, cy-12, cx, cy+12, '#ffffff', 2); GF.circle(cx, cy, 3, '#ffffff'); // Muzzle flash if (this.muzzleFlash > 0) { GF.circle(cx, cy, 20, 'rgba(255,200,50,0.6)'); } // Hit flash if (this.flashTimer > 0) { GF.rect(0, 0, W, viewH, this.flashColor); } // HUD bar background GF.rect(0, viewH, W, H - viewH, '#111111'); // Health bar GF.rect(10, viewH+8, 160, 18, '#333333'); GF.rect(10, viewH+8, Math.floor(160 * this.health / this.maxHealth), 18, '#cc2200'); GF.text('HP: ' + this.health, 14, viewH+22, {size:13, color:'#ffffff', align:'left', bold:true}); // Kill counter var allDead3 = this.enemies.every(function(e){ return !e.alive; }); var killColor = allDead3 ? '#00ff88' : '#ffaa00'; GF.text('Enemies: ' + this.killCount + '/' + this.totalEnemies, W/2, viewH+22, {size:13, color:killColor, align:'center', bold:true}); // Score GF.text('Score: ' + GF.score, W-10, viewH+22, {size:13, color:'#ffff88', align:'right', bold:true}); // Exit hint if (allDead3) { GF.text('FIND THE EXIT!', W/2, viewH+44, {size:14, color:'#00ff88', align:'center', bold:true}); } // Buttons var self = this; function drawBtn(btn, label, color) { GF.rect(btn.x, btn.y, btn.w, btn.h, color); GF.strokeRect(btn.x, btn.y, btn.w, btn.h, '#ffffff', 2); GF.text(label, btn.x + btn.w/2, btn.y + btn.h/2 + 6, {size:16, color:'#ffffff', align:'center', bold:true}); } drawBtn(this.btnFwd, '▲', '#224422'); drawBtn(this.btnBack, '▼', '#224422'); drawBtn(this.btnLeft, '◀', '#224422'); drawBtn(this.btnRight, '▶', '#224422'); drawBtn(this.btnShoot, '🔥 FIRE', '#662200'); // Minimap (small) var mmScale = 5; var mmX = W - this.MAP_W * mmScale - 5; var mmY = viewH - this.MAP_H * mmScale - 5; for (var my = 0; my < this.MAP_H; my++) { for (var mx = 0; mx < this.MAP_W; mx++) { if (this.map[my][mx] === 1) { GF.rect(mmX + mx*mmScale, mmY + my*mmScale, mmScale, mmScale, '#555555'); } } } // Exit on minimap GF.rect(mmX + this.exitX*mmScale, mmY + this.exitY*mmScale, mmScale, mmScale, allDead3 ? '#00ff88' : '#888888'); // Player on minimap GF.circle(mmX + this.px*mmScale, mmY + this.py*mmScale, 3, '#ffff00'); // Enemies on minimap for (var i = 0; i < this.enemies.length; i++) { var e = this.enemies[i]; if (!e.alive) continue; GF.circle(mmX + e.x*mmScale, mmY + e.y*mmScale, 2, '#ff4400'); } } });