Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Lee Ho Seong #10

Open
wants to merge 21 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
21 commits
Select commit Hold shift + click to select a range
d9bee02
Initial commit
jihwooon Dec 11, 2023
bd6746e
update, draw 함수 리팩터링
leon-808 Dec 19, 2023
f964ca5
ch01 예제 세가지 풀이와 eslint 따옴표 해결
leon-808 Dec 19, 2023
d6e7cb1
sum.test.ts 풀이
leon-808 Dec 20, 2023
87b1262
Input 인터페이스, 클래스로의 코드 이관
leon-808 Dec 21, 2023
f268a65
신호등 기능 interface, class 로의 코드 이관 및 테스트
leon-808 Dec 21, 2023
78ab05a
타일 Interface, Class 로의 코드 이관 및 에러
leon-808 Dec 21, 2023
21c83cb
Map 변수, 생성 함수로 에러 해결 및 PR 제언 토대로 수정
leon-808 Dec 21, 2023
207897b
Remove 메서드 전문화, colorOfTile 클래스로 코드 이관
leon-808 Dec 22, 2023
ab5ae4c
if 문 추가 이관을 통해 color 를 draw 함수로 변경
leon-808 Dec 22, 2023
f223e7b
moveHorizontal, Vertical 인라인화
leon-808 Dec 22, 2023
6733d98
stony, boxy 메서드 추가 및 stone, box 클래스 리팩터링
leon-808 Dec 27, 2023
a8e4e99
.prettierignore 파일 무시
leon-808 Dec 27, 2023
44826c2
조건문에서 부수적인 동작 분리
leon-808 Dec 27, 2023
755dc54
updateTile 인라인화와 불필요한 코드 정리
leon-808 Dec 29, 2023
5a9d2f1
FallStrategy 클래스로 코드 이관 및 메소드 통합
leon-808 Dec 29, 2023
6068dff
Array.ts 전략 패턴 적용
leon-808 Jan 2, 2024
20ecf29
Processor 인터페이스를 생성해 유사한 클래스 통합
leon-808 Jan 2, 2024
f50acda
remove 함수를 하나로 통합하기 위한 인터페이스 도입
leon-808 Jan 2, 2024
0983348
Key 와 Lock 클래스의 통합
leon-808 Jan 2, 2024
7474c00
전략 패턴 적용을 위한 KeyConfiguration 클래스 도입
leon-808 Jan 2, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
250 changes: 199 additions & 51 deletions index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ const TILE_SIZE = 30;
const FPS = 30;
const SLEEP = 1000 / FPS;

enum Tile {
enum RawTile {
AIR,
FLUX,
UNBREAKABLE,
Expand All @@ -13,6 +13,150 @@ enum Tile {
KEY2, LOCK2
}

// Tile Interface & Class
interface Tile {
isFlux(): boolean;
isUnbreakable(): boolean;
isStone(): boolean;
isFallingStone(): boolean;
isBox(): boolean;
isFallingBox(): boolean;
isKey1(): boolean;
isLock1(): boolean;
isKey2(): boolean;
isLock2(): boolean;
}

class Flux implements Tile {
isFlux() { return true; }
isUnbreakable() { return false; }
isStone() { return false; }
isFallingStone() { return false; }
isBox() { return false; }
isFallingBox() { return false; }
isKey1() { return false; }
isLock1() { return false; }
isKey2() { return false; }
isLock2() { return false; }
}

class Unbreakable implements Tile {
isFlux() { return false; }
isUnbreakable() { return true; }
isStone() { return false; }
isFallingStone() { return false; }
isBox() { return false; }
isFallingBox() { return false; }
isKey1() { return false; }
isLock1() { return false; }
isKey2() { return false; }
isLock2() { return false; }
}

class Stone implements Tile {
isFlux() { return false; }
isUnbreakable() { return false; }
isStone() { return true; }
isFallingStone() { return false; }
isBox() { return false; }
isFallingBox() { return false; }
isKey1() { return false; }
isLock1() { return false; }
isKey2() { return false; }
isLock2() { return false; }
}

class FallingStone implements Tile {
isFlux() { return false; }
isUnbreakable() { return false; }
isStone() { return false; }
isFallingStone() { return true; }
isBox() { return false; }
isFallingBox() { return false; }
isKey1() { return false; }
isLock1() { return false; }
isKey2() { return false; }
isLock2() { return false; }
}

class Box implements Tile {
isFlux() { return false; }
isUnbreakable() { return false; }
isStone() { return false; }
isFallingStone() { return false; }
isBox() { return true; }
isFallingBox() { return false; }
isKey1() { return false; }
isLock1() { return false; }
isKey2() { return false; }
isLock2() { return false; }
}

class FallingBox implements Tile {
isFlux() { return false; }
isUnbreakable() { return false; }
isStone() { return false; }
isFallingStone() { return false; }
isBox() { return false; }
isFallingBox() { return true; }
isKey1() { return false; }
isLock1() { return false; }
isKey2() { return false; }
isLock2() { return false; }
}

class Key1 implements Tile {
isFlux() { return false; }
isUnbreakable() { return false; }
isStone() { return false; }
isFallingStone() { return false; }
isBox() { return false; }
isFallingBox() { return false; }
isKey1() { return true; }
isLock1() { return false; }
isKey2() { return false; }
isLock2() { return false; }
}

class Lock1 implements Tile {
isFlux() { return false; }
isUnbreakable() { return false; }
isStone() { return false; }
isFallingStone() { return false; }
isBox() { return false; }
isFallingBox() { return false; }
isKey1() { return false; }
isLock1() { return true; }
isKey2() { return false; }
isLock2() { return false; }
}

class Key2 implements Tile {
isFlux() { return false; }
isUnbreakable() { return false; }
isStone() { return false; }
isFallingStone() { return false; }
isBox() { return false; }
isFallingBox() { return false; }
isKey1() { return false; }
isLock1() { return false; }
isKey2() { return true; }
isLock2() { return false; }
}

class Lock2 implements Tile {
isFlux() { return false; }
isUnbreakable() { return false; }
isStone() { return false; }
isFallingStone() { return false; }
isBox() { return false; }
isFallingBox() { return false; }
isKey1() { return false; }
isLock1() { return false; }
isKey2() { return false; }
isLock2() { return true; }
}

enum RawInput {
UP, DOWN, LEFT, RIGHT
}
Expand Down Expand Up @@ -60,7 +204,7 @@ class Down implements Input {

let playerx = 1;
let playery = 1;
const map: Tile[][] = [
const map: RawTile[][] = [
[2, 2, 2, 2, 2, 2, 2, 2],
[2, 3, 0, 1, 1, 2, 0, 2],
[2, 4, 2, 6, 1, 2, 0, 2],
Expand All @@ -71,51 +215,51 @@ const map: Tile[][] = [

const inputs: Input[] = [];

function remove(tile: Tile) {
function remove(tile: RawTile) {
for (let y = 0; y < map.length; y++) {
for (let x = 0; x < map[y].length; x++) {
if (map[y][x] === tile) {
map[y][x] = Tile.AIR;
map[y][x] = RawTile.AIR;
}
}
}
}

function moveToTile(newx: number, newy: number) {
map[playery][playerx] = Tile.AIR;
map[newy][newx] = Tile.PLAYER;
map[playery][playerx] = RawTile.AIR;
map[newy][newx] = RawTile.PLAYER;
playerx = newx;
playery = newy;
}

function moveHorizontal(dx: number) {
if (map[playery][playerx + dx] === Tile.FLUX
|| map[playery][playerx + dx] === Tile.AIR) {
if (map[playery][playerx + dx] === RawTile.FLUX
|| map[playery][playerx + dx] === RawTile.AIR) {
moveToTile(playerx + dx, playery);
} else if ((map[playery][playerx + dx] === Tile.STONE
|| map[playery][playerx + dx] === Tile.BOX)
&& map[playery][playerx + dx + dx] === Tile.AIR
&& map[playery + 1][playerx + dx] !== Tile.AIR) {
} else if ((map[playery][playerx + dx] === RawTile.STONE
|| map[playery][playerx + dx] === RawTile.BOX)
&& map[playery][playerx + dx + dx] === RawTile.AIR
&& map[playery + 1][playerx + dx] !== RawTile.AIR) {
map[playery][playerx + dx + dx] = map[playery][playerx + dx];
moveToTile(playerx + dx, playery);
} else if (map[playery][playerx + dx] === Tile.KEY1) {
remove(Tile.LOCK1);
} else if (map[playery][playerx + dx] === RawTile.KEY1) {
remove(RawTile.LOCK1);
moveToTile(playerx + dx, playery);
} else if (map[playery][playerx + dx] === Tile.KEY2) {
remove(Tile.LOCK2);
} else if (map[playery][playerx + dx] === RawTile.KEY2) {
remove(RawTile.LOCK2);
moveToTile(playerx + dx, playery);
}
}

function moveVertical(dy: number) {
if (map[playery + dy][playerx] === Tile.FLUX
|| map[playery + dy][playerx] === Tile.AIR) {
if (map[playery + dy][playerx] === RawTile.FLUX
|| map[playery + dy][playerx] === RawTile.AIR) {
moveToTile(playerx, playery + dy);
} else if (map[playery + dy][playerx] === Tile.KEY1) {
remove(Tile.LOCK1);
} else if (map[playery + dy][playerx] === RawTile.KEY1) {
remove(RawTile.LOCK1);
moveToTile(playerx, playery + dy);
} else if (map[playery + dy][playerx] === Tile.KEY2) {
remove(Tile.LOCK2);
} else if (map[playery + dy][playerx] === RawTile.KEY2) {
remove(RawTile.LOCK2);
moveToTile(playerx, playery + dy);
}
}
Expand All @@ -135,18 +279,18 @@ function handleInputs() {
function updateMap() {
for (let y = map.length - 1; y >= 0; y--) {
for (let x = 0; x < map[y].length; x++) {
if ((map[y][x] === Tile.STONE || map[y][x] === Tile.FALLING_STONE)
&& map[y + 1][x] === Tile.AIR) {
map[y + 1][x] = Tile.FALLING_STONE;
map[y][x] = Tile.AIR;
} else if ((map[y][x] === Tile.BOX || map[y][x] === Tile.FALLING_BOX)
&& map[y + 1][x] === Tile.AIR) {
map[y + 1][x] = Tile.FALLING_BOX;
map[y][x] = Tile.AIR;
} else if (map[y][x] === Tile.FALLING_STONE) {
map[y][x] = Tile.STONE;
} else if (map[y][x] === Tile.FALLING_BOX) {
map[y][x] = Tile.BOX;
if ((map[y][x] === RawTile.STONE || map[y][x] === RawTile.FALLING_STONE)
&& map[y + 1][x] === RawTile.AIR) {
map[y + 1][x] = RawTile.FALLING_STONE;
map[y][x] = RawTile.AIR;
Copy link
Owner

@jihwooon jihwooon Dec 21, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

map[y][x]은 다음 배열을 참조 하고 있습니다.

const map: RawTile[][] = [
  [2, 2, 2, 2, 2, 2, 2, 2],
  [2, 3, 0, 1, 1, 2, 0, 2],
  [2, 4, 2, 6, 1, 2, 0, 2],

이 배열은 RawTile 열거형을 참조하고 있어서 map으로부터 메서드를 호출 할 수 없습니다. 참조 타입을 변경하시면 됩니다.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

그럼 처음 말씀드렸던대로 첫 RawTile 맵을 기반으로
tile class 들을 담고 있는 새 맵을 만들고 그걸 참조하게 하면 될까요?

Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

책에서는 기존 Tile을 인터페이스로 구현하도록 합니다. 때문에 인터페이스로 참조 타입으로 사용해도 됩니다.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

아 오류 해결 내용을 뒤에서 다루나 보네요.. 감사합니다 그럼 한번 만들어보겠습니다.

} else if ((map[y][x] === RawTile.BOX || map[y][x] === RawTile.FALLING_BOX)
&& map[y + 1][x] === RawTile.AIR) {
map[y + 1][x] = RawTile.FALLING_BOX;
map[y][x] = RawTile.AIR;
} else if (map[y][x] === RawTile.FALLING_STONE) {
map[y][x] = RawTile.STONE;
} else if (map[y][x] === RawTile.FALLING_BOX) {
map[y][x] = RawTile.BOX;
}
}
}
Expand All @@ -168,27 +312,31 @@ function createGraphics() {
function drawMap(g:CanvasRenderingContext2D) {
for (let y = 0; y < map.length; y++) {
for (let x = 0; x < map[y].length; x++) {
if (map[y][x] === Tile.FLUX) {
g.fillStyle = '#ccffcc';
} else if (map[y][x] === Tile.UNBREAKABLE) {
g.fillStyle = '#999999';
} else if (map[y][x] === Tile.STONE || map[y][x] === Tile.FALLING_STONE) {
g.fillStyle = '#0000cc';
} else if (map[y][x] === Tile.BOX || map[y][x] === Tile.FALLING_BOX) {
g.fillStyle = '#8b4513';
} else if (map[y][x] === Tile.KEY1 || map[y][x] === Tile.LOCK1) {
g.fillStyle = '#ffcc00';
} else if (map[y][x] === Tile.KEY2 || map[y][x] === Tile.LOCK2) {
g.fillStyle = '#00ccff';
}

if (map[y][x] !== Tile.AIR && map[y][x] !== Tile.PLAYER) {
g.fillRect(x * TILE_SIZE, y * TILE_SIZE, TILE_SIZE, TILE_SIZE);
}
colorOfTile(g, x, y);
}
}
}

function colorOfTile(g: CanvasRenderingContext2D, x: number, y: number) {
if (map[y][x]) {
g.fillStyle = '#ccffcc';
} else if (map[y][x] === RawTile.UNBREAKABLE) {
g.fillStyle = '#999999';
} else if (map[y][x] === RawTile.STONE || map[y][x] === RawTile.FALLING_STONE) {
g.fillStyle = '#0000cc';
} else if (map[y][x] === RawTile.BOX || map[y][x] === RawTile.FALLING_BOX) {
g.fillStyle = '#8b4513';
} else if (map[y][x] === RawTile.KEY1 || map[y][x] === RawTile.LOCK1) {
g.fillStyle = '#ffcc00';
} else if (map[y][x] === RawTile.KEY2 || map[y][x] === RawTile.LOCK2) {
g.fillStyle = '#00ccff';
}

if (map[y][x] !== RawTile.AIR && map[y][x] !== RawTile.PLAYER) {
g.fillRect(x * TILE_SIZE, y * TILE_SIZE, TILE_SIZE, TILE_SIZE);
}
}

function drawPlayer(g:CanvasRenderingContext2D) {
g.fillStyle = '#ff0000';
g.fillRect(playerx * TILE_SIZE, playery * TILE_SIZE, TILE_SIZE, TILE_SIZE);
Expand Down
5 changes: 0 additions & 5 deletions src/ch02/TrafficLight.enum.ts

This file was deleted.