맞히면 죽는다
점수가 쌓인다

"지난주 적 스폰 코드를 3종류로 분기해줘. - slow: 초록색, 40x40, 속도 1, 직선 하강 - fast: 노란색, 25x25, 속도 4, 직선 하강 - zigzag: 빨간색, 30x30, 속도 2, x가 sin(y*0.05)*60으로 좌우 흔들림 - 스폰할 때 랜덤하게 셋 중 하나 선택 - 각 적에 hp, points, type 속성 추가"

const ENEMY_TYPES = { slow: { w: 40, h: 40, speed: 1, points: 10, hp: 1, color: '#4A7A68' }, fast: { w: 25, h: 25, speed: 4, points: 20, hp: 1, color: '#C4935A' }, zigzag: { w: 30, h: 30, speed: 2, points: 50, hp: 1, color: '#B84A4A' } }; function spawnEnemy() { const types = ['slow', 'fast', 'zigzag']; const t = types[Math.floor(Math.random() * 3)]; enemies.push({ ...ENEMY_TYPES[t], type: t, x0: Math.random()*canvas.width, x: 0, y: -40 }); } // 매 프레임 — type별 다른 움직임 enemies.forEach(en => { en.y += en.speed; if (en.type === 'zigzag') en.x = en.x0 + Math.sin(en.y * 0.05) * 60; else en.x = en.x0; });

"미사일이 적에 닿으면 둘 다 사라지게 해줘. - 매 프레임 missiles × enemies 이중 루프 - AABB 공식으로 충돌 확인 - 충돌하면 둘 다 .dead = true로 표시 - 매 프레임 마지막에 dead가 true인 것 filter로 제거 - 충돌 함수는 따로 isColliding(a, b)로 빼서 재사용 가능하게"

function isColliding(a, b) { return a.x < b.x + b.w && a.x + a.w > b.x && a.y < b.y + b.h && a.y + a.h > b.y; } // 매 프레임 — 모든 미사일 × 모든 적 missiles.forEach(m => { enemies.forEach(en => { if (isColliding(m, en)) { m.dead = true; en.dead = true; } }); }); // 죽은 것들 제거 missiles = missiles.filter(m => !m.dead && m.y > 0); enemies = enemies.filter(en => !en.dead && en.y < canvas.height);

"점수 시스템 추가해줘. - let score = 0 전역 변수 - 충돌 시 score += enemy.points (slow 10, fast 20, zigzag 50) - 화면 좌상단에 큰 글씨(36px)로 'SCORE 0' 표시 - 폰트는 픽셀 게임 느낌나는 monospace 굵게 - 최고점도 함께 표시 (localStorage 사용)"

let score = 0; let hiScore = parseInt(localStorage.getItem('hiScore') || '0'); // 충돌 시 if (isColliding(m, en)) { score += en.points; // 적 종류별 점수 if (score > hiScore) { hiScore = score; localStorage.setItem('hiScore', score); } m.dead = true; en.dead = true; } // 매 프레임 그리기 (canvas) ctx.fillStyle = '#3D5A80'; ctx.font = 'bold 36px monospace'; ctx.fillText(`SCORE ${score}`, 20, 50); ctx.font = '14px monospace'; ctx.fillText(`BEST ${hiScore}`, 20, 75);

"비행기 HP 시스템 추가해줘. - let hp = 3, maxHp = 3 전역 - 매 프레임 비행기 × 적 충돌 검사 → 충돌 시 hp--, 적 사라짐 - 화면 우상단에 HP 바 그리기 (200x20px) · 배경: 어두운 회색 · 채움: 현재 HP에 비례한 빨간 사각형 · 텍스트: HP 3/3 - 무적 시간 1초 — 한번 맞으면 깜빡거리며 무적"

let hp = 3, maxHp = 3, invincibleUntil = 0; // 매 프레임 충돌 검사 enemies.forEach(en => { if (isColliding(plane, en) && Date.now() > invincibleUntil) { hp--; en.dead = true; invincibleUntil = Date.now() + 1000; // 1초 무적 } }); // 무적이면 깜빡임 (50% 시간만 그림) const blink = Date.now() < invincibleUntil && Math.floor(Date.now()/100) % 2; if (!blink) drawPlane(); // HP 바 그리기 우상단 const barX = canvas.width - 220, barY = 20; ctx.fillStyle = '#333'; ctx.fillRect(barX, barY, 200, 20); // 배경 ctx.fillStyle = '#B84A4A'; ctx.fillRect(barX, barY, 200 * (hp/maxHp), 20); // 비율 채움 ctx.fillStyle = '#fff'; ctx.font = 'bold 12px monospace'; ctx.fillText(`HP ${hp}/${maxHp}`, barX + 80, barY + 14);

"게임오버 시스템 추가해줘. - hp가 0 이하가 되면 gameOver = true - gameOver이면 게임 루프 멈춤 (update/spawn 안 함) - 화면 위에 반투명 검정 오버레이 - 가운데에 'GAME OVER' (대형 빨간 글씨) - 그 밑에 'SCORE: 1240 / BEST: 2100' - '스페이스를 누르면 재시작' 안내 - 스페이스 누르면 score=0, hp=3, 배열 비우고 다시 시작"

let gameOver = false; function update() { if (hp <= 0) gameOver = true; if (gameOver) return; // 게임 멈춤 // ... 평소 게임 로직 } function draw() { // ... 평소 그리기 if (gameOver) { ctx.fillStyle = 'rgba(0,0,0,0.75)'; ctx.fillRect(0, 0, canvas.width, canvas.height); ctx.fillStyle = '#B84A4A'; ctx.font = 'bold 72px monospace'; ctx.textAlign = 'center'; ctx.fillText('GAME OVER', canvas.width/2, canvas.height/2 - 40); ctx.fillStyle = '#fff'; ctx.font = '20px monospace'; ctx.fillText(`SCORE: ${score} / BEST: ${hiScore}`, canvas.width/2, canvas.height/2 + 20); ctx.fillText('Press SPACE to restart', canvas.width/2, canvas.height/2 + 60); } } // 재시작 키 document.addEventListener('keydown', e => { if (gameOver && e.code === 'Space') { score = 0; hp = 3; missiles = []; enemies = []; gameOver = false; } });