├── .github └── FUNDING.yml ├── .gitignore ├── .prettierignore ├── .prettierrc ├── CHANGELOG.md ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── package.json ├── phaser3-typescript.png ├── src ├── boilerplates │ ├── parcel-boilerplate │ │ ├── index.html │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── interfaces │ │ │ │ └── image.interface.ts │ │ │ ├── objects │ │ │ │ └── redhat.ts │ │ │ └── scenes │ │ │ │ └── game-scene.ts │ │ ├── static │ │ │ └── images │ │ │ │ ├── red.png │ │ │ │ └── redhat.png │ │ ├── styles │ │ │ ├── css │ │ │ │ └── style.css │ │ │ └── less │ │ │ │ └── style.less │ │ ├── tsconfig.json │ │ └── yarn.lock │ └── webpack-boilerplate │ │ ├── package.json │ │ ├── src │ │ ├── assets │ │ │ ├── red.png │ │ │ ├── redhat.png │ │ │ └── styles │ │ │ │ ├── css │ │ │ │ └── style.css │ │ │ │ └── less │ │ │ │ └── style.less │ │ ├── config.ts │ │ ├── game.ts │ │ ├── index.html │ │ ├── interfaces │ │ │ └── image.interface.ts │ │ ├── objects │ │ │ └── redhat.ts │ │ └── scenes │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock ├── experimental │ ├── cellular-automaton │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── const │ │ │ │ └── const.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── graphics.interface.ts │ │ │ ├── objects │ │ │ │ └── cell.ts │ │ │ └── scenes │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── fractal-tree │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ └── scenes │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── game-of-life │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── objects │ │ │ │ ├── cell.ts │ │ │ │ ├── grid.ts │ │ │ │ └── patterns │ │ │ │ │ └── patterns.ts │ │ │ └── scenes │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── lissajous-curve │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ └── scenes │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── point-in-polygon │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── graphics.interface.ts │ │ │ ├── objects │ │ │ │ └── ray.ts │ │ │ ├── scenes │ │ │ │ └── game-scene.ts │ │ │ └── services │ │ │ │ └── collisions.service.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── procedural-generation │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── const │ │ │ │ └── galaxy.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── interfaces.ts │ │ │ ├── objects │ │ │ │ └── star-system.ts │ │ │ └── scenes │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── raycasting │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── scenes │ │ │ │ └── game-scene.ts │ │ │ └── services │ │ │ │ └── raycasting │ │ │ │ ├── ray.ts │ │ │ │ └── raycasting.service.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ └── untextured-raycaster │ │ ├── package.json │ │ ├── src │ │ ├── config.ts │ │ ├── const │ │ │ └── map.ts │ │ ├── game.ts │ │ ├── index.html │ │ ├── objects │ │ │ └── player.ts │ │ └── scenes │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock ├── games │ ├── alpha-adjust │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ └── images │ │ │ │ │ └── crystal.png │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── crystal.interface.ts │ │ │ ├── objects │ │ │ │ ├── clone-crystal.ts │ │ │ │ └── original-crystal.ts │ │ │ └── scenes │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── asteroid │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ └── font │ │ │ │ │ ├── asteroidFont.fnt │ │ │ │ │ └── asteroidFont.png │ │ │ ├── config.ts │ │ │ ├── const │ │ │ │ └── const.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ ├── asteroid.interface.ts │ │ │ │ ├── bullet.interface.ts │ │ │ │ └── graphics.interface.ts │ │ │ ├── objects │ │ │ │ ├── asteroid.ts │ │ │ │ ├── bullet.ts │ │ │ │ └── ship.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ ├── game-scene.ts │ │ │ │ └── main-menu-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── blockade │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── font │ │ │ │ │ ├── pcsenior.fnt │ │ │ │ │ └── pcsenior.png │ │ │ │ └── images │ │ │ │ │ ├── border.png │ │ │ │ │ └── player.png │ │ │ ├── config.ts │ │ │ ├── const │ │ │ │ └── const.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── image.interface.ts │ │ │ ├── objects │ │ │ │ ├── player.ts │ │ │ │ ├── playerTwo.ts │ │ │ │ └── wall.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ ├── game-scene.ts │ │ │ │ └── main-menu-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── blocks │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── images │ │ │ │ │ └── cursor.png │ │ │ │ ├── pack.json │ │ │ │ └── sprites │ │ │ │ │ └── block.png │ │ │ ├── config.ts │ │ │ ├── const │ │ │ │ └── const.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ ├── block.interface.ts │ │ │ │ └── cursor.interface.ts │ │ │ ├── objects │ │ │ │ ├── block.ts │ │ │ │ └── cursor.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── breakout │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── font │ │ │ │ │ ├── font.fnt │ │ │ │ │ └── font.png │ │ │ │ └── pack.json │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── interfaces.ts │ │ │ ├── objects │ │ │ │ ├── ball.ts │ │ │ │ ├── brick.ts │ │ │ │ └── player.ts │ │ │ ├── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ └── game-scene.ts │ │ │ └── settings.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── candy-crush │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── License.txt │ │ │ │ ├── images │ │ │ │ │ ├── cookie1.png │ │ │ │ │ ├── cookie2.png │ │ │ │ │ ├── croissant.png │ │ │ │ │ ├── cupcake.png │ │ │ │ │ ├── donut.png │ │ │ │ │ ├── eclair.png │ │ │ │ │ ├── macaroon.png │ │ │ │ │ ├── pie.png │ │ │ │ │ ├── poptart1.png │ │ │ │ │ ├── poptart2.png │ │ │ │ │ ├── starcookie1.png │ │ │ │ │ └── starcookie2.png │ │ │ │ └── pack.json │ │ │ ├── config.ts │ │ │ ├── const │ │ │ │ └── const.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── image.interface.ts │ │ │ ├── objects │ │ │ │ └── tile.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── clocks │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── images │ │ │ │ │ ├── ball.png │ │ │ │ │ ├── bigclockface.png │ │ │ │ │ └── smallclockface.png │ │ │ │ ├── pack.json │ │ │ │ └── sprites │ │ │ │ │ ├── bigclock.png │ │ │ │ │ ├── bighand.png │ │ │ │ │ ├── smallclock.png │ │ │ │ │ └── smallhand.png │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── interfaces.ts │ │ │ ├── objects │ │ │ │ ├── ball.ts │ │ │ │ └── clock.ts │ │ │ ├── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ └── game-scene.ts │ │ │ └── settings.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── coin-runner │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ └── images │ │ │ │ │ ├── background.png │ │ │ │ │ ├── coin.png │ │ │ │ │ └── player.png │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── image.interface.ts │ │ │ ├── objects │ │ │ │ ├── coin.ts │ │ │ │ └── player.ts │ │ │ └── scenes │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── endless-runner │ │ ├── package.json │ │ ├── src │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── scenes │ │ │ │ └── game-scene.ts │ │ │ └── settings.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── flappy-bird │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── font │ │ │ │ │ ├── font.fnt │ │ │ │ │ └── font.png │ │ │ │ ├── images │ │ │ │ │ ├── bg.png │ │ │ │ │ └── bird.png │ │ │ │ ├── pack.json │ │ │ │ └── sprites │ │ │ │ │ └── pipe.png │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── image.interface.ts │ │ │ ├── objects │ │ │ │ ├── bird.ts │ │ │ │ └── pipe.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ ├── game-scene.ts │ │ │ │ └── main-menu-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── snake │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ └── font │ │ │ │ │ ├── snakeFont.fnt │ │ │ │ │ └── snakeFont.png │ │ │ ├── config.ts │ │ │ ├── const │ │ │ │ └── const.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ └── graphics.interface.ts │ │ │ ├── objects │ │ │ │ ├── apple.ts │ │ │ │ └── snake.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ ├── game-scene.ts │ │ │ │ └── main-menu-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── space-invaders │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── animations │ │ │ │ │ └── animations.json │ │ │ │ ├── font │ │ │ │ │ ├── font.fnt │ │ │ │ │ └── font.png │ │ │ │ ├── pack.json │ │ │ │ └── sprites │ │ │ │ │ ├── bullet.png │ │ │ │ │ ├── crab.png │ │ │ │ │ ├── octopus.png │ │ │ │ │ ├── player.png │ │ │ │ │ └── squid.png │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── helpers │ │ │ │ └── animation-helper.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ ├── bullet.interface.ts │ │ │ │ ├── image.interface.ts │ │ │ │ └── sprite.interface.ts │ │ │ ├── objects │ │ │ │ ├── bullet.ts │ │ │ │ ├── enemy.ts │ │ │ │ └── player.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ ├── game-scene.ts │ │ │ │ ├── hud-scene.ts │ │ │ │ └── menu-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── space-shooter │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── images │ │ │ │ │ └── player.png │ │ │ │ ├── pack.json │ │ │ │ └── styles │ │ │ │ │ ├── css │ │ │ │ │ └── style.css │ │ │ │ │ └── less │ │ │ │ │ └── style.less │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ ├── bullet.interface.ts │ │ │ │ └── image.interface.ts │ │ │ ├── objects │ │ │ │ ├── bullet.ts │ │ │ │ └── player.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ └── game-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ ├── super-mario-land │ │ ├── package.json │ │ ├── src │ │ │ ├── assets │ │ │ │ ├── animations │ │ │ │ │ └── animations.json │ │ │ │ ├── collectibles │ │ │ │ │ ├── coin2.png │ │ │ │ │ ├── flower.png │ │ │ │ │ ├── heart.png │ │ │ │ │ ├── mushroom.png │ │ │ │ │ └── star.png │ │ │ │ ├── font │ │ │ │ │ ├── superMarioLand.fnt │ │ │ │ │ └── superMarioLand.png │ │ │ │ ├── images │ │ │ │ │ ├── platform.png │ │ │ │ │ └── title.png │ │ │ │ ├── maps │ │ │ │ │ ├── level1.json │ │ │ │ │ ├── level1room1.json │ │ │ │ │ └── level1room2.json │ │ │ │ ├── pack.json │ │ │ │ ├── sprites │ │ │ │ │ ├── box.png │ │ │ │ │ ├── brick.png │ │ │ │ │ ├── coin.png │ │ │ │ │ ├── goomba.png │ │ │ │ │ ├── mario.png │ │ │ │ │ └── rotatingCoin.png │ │ │ │ └── tiles │ │ │ │ │ └── tiles.png │ │ │ ├── config.ts │ │ │ ├── game.ts │ │ │ ├── helpers │ │ │ │ └── animation-helper.ts │ │ │ ├── index.html │ │ │ ├── interfaces │ │ │ │ ├── box.interface.ts │ │ │ │ ├── brick.interface.ts │ │ │ │ ├── collectible.interface.ts │ │ │ │ ├── platform.interface.ts │ │ │ │ ├── portal-destination.interface.ts │ │ │ │ ├── portal.interface.ts │ │ │ │ └── sprite.interface.ts │ │ │ ├── objects │ │ │ │ ├── box.ts │ │ │ │ ├── brick.ts │ │ │ │ ├── collectible.ts │ │ │ │ ├── enemy.ts │ │ │ │ ├── goomba.ts │ │ │ │ ├── mario.ts │ │ │ │ ├── platform.ts │ │ │ │ └── portal.ts │ │ │ └── scenes │ │ │ │ ├── boot-scene.ts │ │ │ │ ├── game-scene.ts │ │ │ │ ├── hud-scene.ts │ │ │ │ └── menu-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock │ └── tank │ │ ├── package.json │ │ ├── src │ │ ├── assets │ │ │ ├── font │ │ │ │ ├── font.fnt │ │ │ │ └── font.png │ │ │ ├── maps │ │ │ │ └── levelMap.json │ │ │ ├── obstacles │ │ │ │ ├── barrel-grey-side-rust.png │ │ │ │ ├── barrel-grey-side.png │ │ │ │ ├── barrel-grey-top.png │ │ │ │ ├── barrel-red-side.png │ │ │ │ ├── barrel-red-top.png │ │ │ │ ├── tree-large.png │ │ │ │ └── tree-small.png │ │ │ ├── pack.json │ │ │ ├── sprites │ │ │ │ ├── barrel-blue.png │ │ │ │ ├── barrel-red.png │ │ │ │ ├── bullet-blue.png │ │ │ │ ├── bullet-red.png │ │ │ │ ├── tank-blue.png │ │ │ │ └── tank-red.png │ │ │ └── tiles │ │ │ │ └── tiles.png │ │ ├── config.ts │ │ ├── game.ts │ │ ├── index.html │ │ ├── interfaces │ │ │ ├── bullet.interface.ts │ │ │ └── image.interface.ts │ │ ├── objects │ │ │ ├── bullet.ts │ │ │ ├── enemy.ts │ │ │ ├── obstacles │ │ │ │ └── obstacle.ts │ │ │ └── player.ts │ │ └── scenes │ │ │ ├── boot-scene.ts │ │ │ ├── game-scene.ts │ │ │ └── menu-scene.ts │ │ ├── tsconfig.json │ │ ├── webpack.config.ts │ │ └── yarn.lock └── patterns │ ├── behavioral-design-patterns │ └── command │ │ ├── README.md │ │ ├── command.interface.ts │ │ ├── command.ts │ │ ├── gameobject.ts │ │ └── input-helper.ts │ └── creational-design-patterns │ └── factory-method │ ├── package.json │ ├── src │ ├── assets │ │ ├── font │ │ │ ├── pcsenior.fnt │ │ │ └── pcsenior.png │ │ ├── images │ │ │ └── enemy.png │ │ └── pack.json │ ├── config.ts │ ├── game.ts │ ├── index.html │ ├── interfaces │ │ └── image.interface.ts │ ├── objects │ │ ├── bobbie.ts │ │ ├── enemy.ts │ │ ├── kanye.ts │ │ └── wallace.ts │ ├── scenes │ │ ├── boot-scene.ts │ │ ├── factory-method-scene.ts │ │ └── simple-factory-scene.ts │ └── services │ │ ├── enemy-factory.ts │ │ └── simple-enemy-factory.ts │ ├── tsconfig.json │ ├── webpack.config.ts │ └── yarn.lock └── yarn.lock /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | custom: https://www.buymeacoffee.com/JZDVjsT26 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Folders 2 | .vscode/ 3 | dist/ 4 | node_modules/ 5 | .cache 6 | 7 | # Files 8 | .DS_STORE -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | .vscode/ 2 | dist/ 3 | node_modules/ -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 80, 3 | "tabWidth": 2, 4 | "useTabs": false, 5 | "semi": true, 6 | "singleQuote": true, 7 | "quoteProps": "as-needed", 8 | "jsxSingleQuote": false, 9 | "trailingComma": "none", 10 | "bracketSpacing": true, 11 | "jsxBracketSameLine": false, 12 | "arrowParens": "always" 13 | } 14 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 - 2021 digitsensitive 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /phaser3-typescript.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/phaser3-typescript.png -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | Parcel-Boilerplate 7 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "parcel-boilerplate", 3 | "version": "0.0.1", 4 | "description": "Parcel-Boilerplate for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "devDependencies": { 7 | "parcel-bundler": "1.12.5", 8 | "parcel-plugin-static-files-copy": "2.6.0", 9 | "typescript": "5.4.2" 10 | }, 11 | "dependencies": { 12 | "phaser": "3.80.1" 13 | }, 14 | "scripts": { 15 | "serve-dev": "parcel ./index.html -p 8080" 16 | }, 17 | "repository": { 18 | "type": "git", 19 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 20 | }, 21 | "author": { 22 | "name": "digitsensitive", 23 | "email": "digit.sensitivee@gmail.com" 24 | }, 25 | "license": "MIT", 26 | "bugs": { 27 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 28 | }, 29 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 30 | } 31 | -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Parcel-Boilerplate', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | backgroundColor: 0x3a404d, 8 | type: Phaser.AUTO, 9 | scale: { 10 | mode: Phaser.Scale.MAX_ZOOM, 11 | autoCenter: Phaser.Scale.CENTER_HORIZONTALLY, 12 | parent: 'game', 13 | width: '100%', 14 | height: '100%' 15 | }, 16 | physics: { 17 | default: 'arcade', 18 | arcade: { 19 | gravity: { x: 0, y: 100 } 20 | } 21 | }, 22 | scene: [GameScene] 23 | }; 24 | -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string | Phaser.Textures.Texture; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/src/objects/redhat.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | 3 | export class Redhat extends Phaser.GameObjects.Image { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | constructor(params: ImageConstructor) { 7 | super(params.scene, params.x, params.y, params.texture, params.frame); 8 | 9 | this.initSprite(); 10 | this.initPhysics(); 11 | 12 | this.scene.add.existing(this); 13 | } 14 | 15 | private initSprite() { 16 | this.setScale(0.5); 17 | } 18 | 19 | private initPhysics() { 20 | this.scene.physics.world.enable(this); 21 | this.body.setVelocity(100, 200); 22 | this.body.setBounce(1, 1); 23 | this.body.setCollideWorldBounds(true); 24 | this.body.setSize(200, 300); 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/src/scenes/game-scene.ts: -------------------------------------------------------------------------------- 1 | import { Redhat } from '../objects/redhat'; 2 | 3 | export class GameScene extends Phaser.Scene { 4 | private myRedhat: Redhat; 5 | 6 | constructor() { 7 | super({ key: 'GameScene' }); 8 | } 9 | 10 | preload(): void { 11 | this.load.image('redhat', 'images/redhat.png'); 12 | this.load.image('redParticle', 'images/red.png'); 13 | } 14 | 15 | create(): void { 16 | const emitter = this.add.particles(0, 0, 'redParticle', { 17 | speed: 100, 18 | scale: { start: 0.5, end: 0 }, 19 | blendMode: 'ADD' 20 | }); 21 | 22 | this.myRedhat = new Redhat({ 23 | scene: this, 24 | x: 400, 25 | y: 300, 26 | texture: 'redhat' 27 | }); 28 | 29 | emitter.startFollow(this.myRedhat); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/static/images/red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/boilerplates/parcel-boilerplate/static/images/red.png -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/static/images/redhat.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/boilerplates/parcel-boilerplate/static/images/redhat.png -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/styles/css/style.css: -------------------------------------------------------------------------------- 1 | body{background-color:#282c34;color:#abb2bf} -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/styles/less/style.less: -------------------------------------------------------------------------------- 1 | // out: ../css/style.css, compress: true, sourceMap: false 2 | 3 | body { 4 | background-color: #282c34; 5 | color: #abb2bf; 6 | } 7 | -------------------------------------------------------------------------------- /src/boilerplates/parcel-boilerplate/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "module": "commonjs", 4 | "moduleResolution": "node", 5 | "outDir": "./dist/", 6 | "target": "ES6", 7 | "sourceMap": false, 8 | "noImplicitAny": true, 9 | "strict": false 10 | }, 11 | "include": ["src/**/*"], 12 | "exclude": ["node_modules", "**/*.spec.ts"] 13 | } 14 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "webpack-boilerplate", 3 | "version": "0.0.1", 4 | "description": "Webpack-Boilerplate for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/assets/red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/boilerplates/webpack-boilerplate/src/assets/red.png -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/assets/redhat.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/boilerplates/webpack-boilerplate/src/assets/redhat.png -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/assets/styles/css/style.css: -------------------------------------------------------------------------------- 1 | body{padding:0;margin:0;background-color:#282c34;color:#abb2bf} -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/assets/styles/less/style.less: -------------------------------------------------------------------------------- 1 | // out: ../css/style.css, compress: true, sourceMap: false 2 | 3 | body { 4 | padding: 0; 5 | margin: 0; 6 | background-color: #282c34; 7 | color: #abb2bf; 8 | } 9 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Webpack-Boilerplate', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | backgroundColor: 0x3a404d, 8 | type: Phaser.AUTO, 9 | scale: { 10 | mode: Phaser.Scale.MAX_ZOOM, 11 | autoCenter: Phaser.Scale.CENTER_HORIZONTALLY, 12 | parent: 'game', 13 | width: '100%', 14 | height: '100%' 15 | }, 16 | physics: { 17 | default: 'arcade', 18 | arcade: { 19 | gravity: { x: 0, y: 100 } 20 | } 21 | }, 22 | scene: [GameScene] 23 | }; 24 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 13 | <%= htmlWebpackPlugin.options.title %> 14 | 15 | 16 |
17 | 18 | 19 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string | Phaser.Textures.Texture; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/objects/redhat.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | 3 | export class Redhat extends Phaser.GameObjects.Image { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | constructor(params: ImageConstructor) { 7 | super(params.scene, params.x, params.y, params.texture, params.frame); 8 | 9 | this.initSprite(); 10 | this.initPhysics(); 11 | 12 | this.scene.add.existing(this); 13 | } 14 | 15 | private initSprite() { 16 | this.setScale(0.5); 17 | } 18 | 19 | private initPhysics() { 20 | this.scene.physics.world.enable(this); 21 | this.body.setVelocity(100, 200); 22 | this.body.setBounce(1, 1); 23 | this.body.setCollideWorldBounds(true); 24 | this.body.setSize(200, 300); 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/src/scenes/game-scene.ts: -------------------------------------------------------------------------------- 1 | import { Redhat } from '../objects/redhat'; 2 | 3 | export class GameScene extends Phaser.Scene { 4 | private myRedhat: Redhat; 5 | 6 | constructor() { 7 | super({ key: 'GameScene' }); 8 | } 9 | 10 | preload(): void { 11 | this.load.image('redhat', '../assets/redhat.png'); 12 | this.load.image('redParticle', '../assets/red.png'); 13 | } 14 | 15 | create(): void { 16 | const emitter = this.add.particles(0, 0, 'redParticle', { 17 | speed: 100, 18 | scale: { start: 0.5, end: 0 }, 19 | blendMode: 'ADD' 20 | }); 21 | 22 | this.myRedhat = new Redhat({ 23 | scene: this, 24 | x: 400, 25 | y: 300, 26 | texture: 'redhat' 27 | }); 28 | 29 | emitter.startFollow(this.myRedhat); 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/boilerplates/webpack-boilerplate/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "cellular-automaton", 3 | "version": "0.0.1", 4 | "description": "Cellular Automaton for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | import { CONST } from './const/const'; 3 | 4 | export const GameConfig: Phaser.Types.Core.GameConfig = { 5 | title: 'Cellular automaton', 6 | url: 'https://github.com/digitsensitive/phaser3-typescript', 7 | version: '0.0.1', 8 | width: 600, 9 | height: 600, 10 | type: Phaser.AUTO, 11 | parent: 'game', 12 | scene: [GameScene], 13 | backgroundColor: CONST.BACKGROUND_COLOR, 14 | render: { pixelArt: true, antialias: false } 15 | }; 16 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/src/const/const.ts: -------------------------------------------------------------------------------- 1 | export const CONST = { 2 | BACKGROUND_COLOR: 0x2d1edf, 3 | CELLSIZE: 6, 4 | GRID_WIDTH: 100, 5 | GRID_HEIGHT: 100, 6 | OFFSET: 0, 7 | FIELD_COLOR: 0xffffff, 8 | FIELD_ALPHA: 1 9 | }; 10 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/src/interfaces/graphics.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ICellConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | } 6 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/src/objects/cell.ts: -------------------------------------------------------------------------------- 1 | import { CONST } from '../const/const'; 2 | import { ICellConstructor } from '../interfaces/graphics.interface'; 3 | 4 | export class Cell extends Phaser.GameObjects.Graphics { 5 | private value: number; 6 | 7 | constructor(aParams: ICellConstructor) { 8 | super(aParams.scene); 9 | 10 | this.fillStyle(CONST.FIELD_COLOR, CONST.FIELD_ALPHA); 11 | this.fillRect(aParams.x, aParams.y, CONST.CELLSIZE, CONST.CELLSIZE); 12 | 13 | this.setVisible(false); 14 | this.value = 0; 15 | this.scene.add.existing(this); 16 | } 17 | 18 | public getValue(): number { 19 | return this.value; 20 | } 21 | 22 | public setValue(value: number): void { 23 | this.value = value; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/cellular-automaton/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Cellular Automaton', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/experimental/fractal-tree/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "fractal-tree", 3 | "version": "0.0.1", 4 | "description": "Fractal Tree for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/experimental/fractal-tree/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Fractal tree', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 600, 8 | height: 600, 9 | type: Phaser.AUTO, 10 | parent: 'game', 11 | scene: [GameScene], 12 | backgroundColor: '#de3412', 13 | render: { pixelArt: false, antialias: true } 14 | }; 15 | -------------------------------------------------------------------------------- /src/experimental/fractal-tree/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/experimental/fractal-tree/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/experimental/fractal-tree/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/fractal-tree/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Fractal Tree', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/experimental/game-of-life/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "game-of-life", 3 | "version": "0.0.1", 4 | "description": "Game Of Life for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/experimental/game-of-life/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Game Of Life', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 600, 8 | height: 600, 9 | type: Phaser.AUTO, 10 | parent: 'game', 11 | scene: [GameScene], 12 | backgroundColor: '#ededed', 13 | render: { pixelArt: false, antialias: true } 14 | }; 15 | -------------------------------------------------------------------------------- /src/experimental/game-of-life/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/experimental/game-of-life/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/experimental/game-of-life/src/objects/cell.ts: -------------------------------------------------------------------------------- 1 | export class Cell { 2 | private value: number; 3 | private position: Phaser.Math.Vector2; 4 | private valueHasChanged: boolean; 5 | 6 | constructor(x: number, y: number, v: number) { 7 | this.value = v; 8 | this.position = new Phaser.Math.Vector2(x, y); 9 | this.valueHasChanged = false; 10 | } 11 | 12 | public getValue(): number { 13 | return this.value; 14 | } 15 | 16 | public getPosition(): Phaser.Math.Vector2 { 17 | return this.position; 18 | } 19 | 20 | public setValue(v: number): void { 21 | this.value = v; 22 | } 23 | 24 | public setValueChange(): void { 25 | this.valueHasChanged = true; 26 | } 27 | 28 | public changeValue(): boolean { 29 | return this.valueHasChanged; 30 | } 31 | 32 | public setValueToFalse(): void { 33 | this.valueHasChanged = false; 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/experimental/game-of-life/src/objects/patterns/patterns.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * A selection of patterns for Game of Life 3 | * https://www.conwaylife.com 4 | */ 5 | export const PATTERNS = { 6 | BLINKER: [[1, 1, 1]], 7 | BLOCK: [ 8 | [1, 1], 9 | [1, 1] 10 | ], 11 | EATER1: [ 12 | [1, 1, 0, 0], 13 | [1, 0, 1, 0], 14 | [0, 0, 1, 0], 15 | [0, 0, 1, 1] 16 | ], 17 | GLIDER: [ 18 | [0, 1, 0], 19 | [0, 0, 1], 20 | [1, 1, 1] 21 | ], 22 | HERSCHEL: [ 23 | [1, 0, 0], 24 | [1, 1, 1], 25 | [1, 0, 1], 26 | [0, 0, 1] 27 | ] 28 | }; 29 | -------------------------------------------------------------------------------- /src/experimental/game-of-life/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/game-of-life/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Game Of Life', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/experimental/lissajous-curve/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "lissajous-curve", 3 | "version": "0.0.1", 4 | "description": "Lissajous Curve for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/experimental/lissajous-curve/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Lissajous curve', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 600, 8 | height: 600, 9 | type: Phaser.AUTO, 10 | parent: 'game', 11 | scene: [GameScene], 12 | backgroundColor: '#000000', 13 | render: { pixelArt: false, antialias: true } 14 | }; 15 | -------------------------------------------------------------------------------- /src/experimental/lissajous-curve/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/experimental/lissajous-curve/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/experimental/lissajous-curve/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/lissajous-curve/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Lissajous Curve', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "point-in-polygon", 3 | "version": "0.0.1", 4 | "description": "Point in Polygon for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Point in Polygon', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 600, 8 | height: 600, 9 | type: Phaser.AUTO, 10 | parent: 'game', 11 | scene: [GameScene], 12 | physics: { 13 | default: 'arcade' 14 | }, 15 | backgroundColor: '#000000', 16 | render: { pixelArt: false, antialias: true } 17 | }; 18 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/src/interfaces/graphics.interface.ts: -------------------------------------------------------------------------------- 1 | export interface IGraphicsConstructor { 2 | scene: Phaser.Scene; 3 | direction: Phaser.Math.Vector2; 4 | options?: Phaser.Types.GameObjects.Graphics.Options; 5 | } 6 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/src/objects/ray.ts: -------------------------------------------------------------------------------- 1 | import { IGraphicsConstructor } from '../interfaces/graphics.interface'; 2 | 3 | export class Ray extends Phaser.GameObjects.Graphics { 4 | // Vectors 5 | private direction: Phaser.Math.Vector2; 6 | 7 | // Variables 8 | private movingSpeed: number; 9 | 10 | // Circle Geom 11 | private rayCircle: Phaser.Geom.Circle; 12 | 13 | constructor(aParams: IGraphicsConstructor) { 14 | super(aParams.scene, aParams.options); 15 | 16 | this.initVariables(aParams.direction); 17 | this.initGraphics(aParams.options); 18 | 19 | this.scene.add.existing(this); 20 | } 21 | 22 | private initVariables(direction: Phaser.Math.Vector2): void { 23 | this.direction = direction.normalize(); 24 | this.movingSpeed = 2; 25 | } 26 | 27 | private initGraphics( 28 | aParams: Phaser.Types.GameObjects.Graphics.Options 29 | ): void { 30 | this.setPosition(aParams.x, aParams.y); 31 | 32 | this.rayCircle = new Phaser.Geom.Circle( 33 | this.direction.x, 34 | this.direction.y, 35 | 4 36 | ); 37 | this.fillCircleShape(this.rayCircle); 38 | } 39 | 40 | update(): void { 41 | this.x += this.direction.x * this.movingSpeed; 42 | this.y += this.direction.y * this.movingSpeed; 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/src/services/collisions.service.ts: -------------------------------------------------------------------------------- 1 | export function PointLineCollision( 2 | x1: number, 3 | y1: number, 4 | x2: number, 5 | y2: number, 6 | px: number, 7 | py: number 8 | ): boolean { 9 | // Get distances from the point to the two ends of the line 10 | let d1 = Phaser.Math.Distance.Between(px, py, x1, y1); 11 | let d2 = Phaser.Math.Distance.Between(px, py, x2, y2); 12 | 13 | // Get the length of the line 14 | let lineLen = Phaser.Math.Distance.Between(x1, y1, x2, y2); 15 | 16 | // Add a buffer zone (if higher, than less accurate) 17 | let buffer = 0.1; 18 | 19 | // If the two distances are equal to the line's length, 20 | // the point is on the line! 21 | if (d1 + d2 >= lineLen - buffer && d1 + d2 <= lineLen + buffer) { 22 | return true; 23 | } 24 | return false; 25 | } 26 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/point-in-polygon/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Point in Polygon', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/experimental/procedural-generation/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "procedural-generation", 3 | "version": "0.0.1", 4 | "description": "Procedural Generation for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/experimental/procedural-generation/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Procedural Generation', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 800, 8 | height: 600, 9 | zoom: 1, 10 | type: Phaser.AUTO, 11 | parent: 'game', 12 | scene: [GameScene], 13 | backgroundColor: '#000000', 14 | render: { pixelArt: false, antialias: true } 15 | }; 16 | -------------------------------------------------------------------------------- /src/experimental/procedural-generation/src/const/galaxy.ts: -------------------------------------------------------------------------------- 1 | export const GALAXY = { 2 | width: 1800, 3 | height: 1200, 4 | sectorSize: 16, 5 | planetColors: [0xffffff, 0xfcba03, 0x35fc03, 0x05f2ee, 0x9d02eb, 0xed0767] 6 | }; 7 | -------------------------------------------------------------------------------- /src/experimental/procedural-generation/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/experimental/procedural-generation/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/experimental/procedural-generation/src/interfaces/interfaces.ts: -------------------------------------------------------------------------------- 1 | export interface IStarSystemConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | } 6 | -------------------------------------------------------------------------------- /src/experimental/procedural-generation/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/procedural-generation/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Procedural Generation', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/experimental/raycasting/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "raycasting", 3 | "version": "0.0.1", 4 | "description": "Raycasting for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/experimental/raycasting/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: '2D Raycasting', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 800, 8 | height: 600, 9 | type: Phaser.AUTO, 10 | parent: 'game', 11 | scene: [GameScene], 12 | backgroundColor: '#000000', 13 | render: { pixelArt: false, antialias: true } 14 | }; 15 | -------------------------------------------------------------------------------- /src/experimental/raycasting/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/experimental/raycasting/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/experimental/raycasting/src/services/raycasting/ray.ts: -------------------------------------------------------------------------------- 1 | export class Ray { 2 | private v: Phaser.Math.Vector2; 3 | 4 | constructor(x: number, y: number) { 5 | this.v = new Phaser.Math.Vector2(x, y); 6 | } 7 | 8 | public getVector(): Phaser.Math.Vector2 { 9 | return this.v; 10 | } 11 | 12 | public getX(): number { 13 | return this.v.x; 14 | } 15 | 16 | public getY(): number { 17 | return this.v.y; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /src/experimental/raycasting/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/raycasting/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Raycasting', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/experimental/untextured-raycaster/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "untextured-raycaster", 3 | "version": "0.0.1", 4 | "description": "Untextured Raycaster for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/experimental/untextured-raycaster/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Untextured Raycasting', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 640, 8 | height: 480, 9 | type: Phaser.AUTO, 10 | parent: 'game', 11 | scene: [GameScene], 12 | backgroundColor: '#000000', 13 | render: { pixelArt: false, antialias: true } 14 | }; 15 | -------------------------------------------------------------------------------- /src/experimental/untextured-raycaster/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/experimental/untextured-raycaster/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/experimental/untextured-raycaster/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/experimental/untextured-raycaster/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Untextured Raycaster', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "alpha-adjust", 3 | "version": "0.0.1", 4 | "description": "Alpha Adjust for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/src/assets/images/crystal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/alpha-adjust/src/assets/images/crystal.png -------------------------------------------------------------------------------- /src/games/alpha-adjust/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Alpha Adjust', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 800, 8 | height: 600, 9 | type: Phaser.AUTO, 10 | parent: 'game', 11 | scene: [GameScene], 12 | input: { 13 | mouse: true 14 | }, 15 | backgroundColor: '#1d2b53', 16 | render: { pixelArt: true, antialias: false } 17 | }; 18 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/src/interfaces/crystal.interface.ts: -------------------------------------------------------------------------------- 1 | export interface CrystalConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | alpha?: number; 7 | frame?: string | number; 8 | } 9 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/src/objects/clone-crystal.ts: -------------------------------------------------------------------------------- 1 | import { CrystalConstructor } from '../interfaces/crystal.interface'; 2 | 3 | export class CloneCrystal extends Phaser.GameObjects.Image { 4 | private increaseAlpha: boolean; 5 | 6 | constructor(params: CrystalConstructor) { 7 | super(params.scene, params.x, params.y, params.texture); 8 | 9 | this.initVariables(); 10 | this.initImage(); 11 | this.scene.add.existing(this); 12 | } 13 | 14 | private initVariables(): void { 15 | this.increaseAlpha = false; 16 | } 17 | 18 | private initImage(): void { 19 | this.setOrigin(0.5); 20 | this.setScale(2); 21 | this.setAlpha(1); 22 | } 23 | 24 | update(): void { 25 | this.updateAlphaOfCloneCrystal(); 26 | this.checkIfAlphaOutOfRange(); 27 | } 28 | 29 | private updateAlphaOfCloneCrystal(): void { 30 | if (this.increaseAlpha) { 31 | this.alpha += 0.01; 32 | } else { 33 | this.alpha -= 0.01; 34 | } 35 | } 36 | 37 | private checkIfAlphaOutOfRange(): void { 38 | if (this.alpha === 0) { 39 | this.increaseAlpha = true; 40 | this.alpha = 0; 41 | } else if (this.alpha === 1) { 42 | this.increaseAlpha = false; 43 | this.alpha = 1; 44 | } 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/src/objects/original-crystal.ts: -------------------------------------------------------------------------------- 1 | import { CrystalConstructor } from '../interfaces/crystal.interface'; 2 | 3 | export class OriginalCrystal extends Phaser.GameObjects.Image { 4 | private randomAlpha: number; 5 | 6 | constructor(params: CrystalConstructor) { 7 | super(params.scene, params.x, params.y, params.texture); 8 | 9 | this.initVariables(params.alpha); 10 | this.initImage(); 11 | this.scene.add.existing(this); 12 | } 13 | 14 | private initVariables(alpha: number): void { 15 | this.randomAlpha = alpha; 16 | } 17 | 18 | private initImage(): void { 19 | this.setOrigin(0.5); 20 | this.setScale(2); 21 | this.setAlpha(this.randomAlpha); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/alpha-adjust/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Alpha-Adjust', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/asteroid/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "asteroid", 3 | "version": "0.0.1", 4 | "description": "Asteroid for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/asteroid/src/assets/font/asteroidFont.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/asteroid/src/assets/font/asteroidFont.png -------------------------------------------------------------------------------- /src/games/asteroid/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { MainMenuScene } from './scenes/main-menu-scene'; 3 | import { GameScene } from './scenes/game-scene'; 4 | 5 | export const GameConfig: Phaser.Types.Core.GameConfig = { 6 | title: 'Asteroid', 7 | url: 'https://github.com/digitsensitive/phaser3-typescript', 8 | version: '0.0.1', 9 | type: Phaser.AUTO, 10 | scene: [BootScene, MainMenuScene, GameScene], 11 | scale: { width: '100%', height: '100%', parent: 'game' }, 12 | input: { 13 | keyboard: true, 14 | mouse: false, 15 | touch: false, 16 | gamepad: false 17 | }, 18 | physics: { 19 | default: 'arcade' 20 | }, 21 | backgroundColor: '#000000', 22 | render: { antialias: true } 23 | }; 24 | -------------------------------------------------------------------------------- /src/games/asteroid/src/const/const.ts: -------------------------------------------------------------------------------- 1 | export let CONST = { 2 | SHIP_SIZE: 20, 3 | SCORE: 0, 4 | HIGHSCORE: 0, 5 | LIVES: 3, 6 | ASTEROID_COUNT: 3, 7 | ASTEROID: { 8 | LARGE: { 9 | MAXSIZE: 100, 10 | MINSIZE: 50, 11 | MAXSPEED: 3, 12 | MINSPEED: 1 13 | }, 14 | MEDIUM: { 15 | MAXSIZE: 50, 16 | MINSIZE: 30, 17 | MAXSPEED: 4, 18 | MINSPEED: 1 19 | }, 20 | SMALL: { 21 | MAXSIZE: 30, 22 | MINSIZE: 10, 23 | MAXSPEED: 4, 24 | MINSPEED: 2 25 | } 26 | } 27 | }; 28 | -------------------------------------------------------------------------------- /src/games/asteroid/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/asteroid/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/asteroid/src/interfaces/asteroid.interface.ts: -------------------------------------------------------------------------------- 1 | export interface AsteroidConstructor { 2 | scene: Phaser.Scene; 3 | size: number; 4 | options?: Phaser.Types.GameObjects.Graphics.Options; 5 | } 6 | -------------------------------------------------------------------------------- /src/games/asteroid/src/interfaces/bullet.interface.ts: -------------------------------------------------------------------------------- 1 | export interface BulletConstructor { 2 | scene: Phaser.Scene; 3 | rotation: number; 4 | options?: Phaser.Types.GameObjects.Graphics.Options; 5 | } 6 | -------------------------------------------------------------------------------- /src/games/asteroid/src/interfaces/graphics.interface.ts: -------------------------------------------------------------------------------- 1 | export interface GraphicsConstructor { 2 | scene: Phaser.Scene; 3 | options?: Phaser.Types.GameObjects.Graphics.Options; 4 | } 5 | -------------------------------------------------------------------------------- /src/games/asteroid/src/scenes/boot-scene.ts: -------------------------------------------------------------------------------- 1 | export class BootScene extends Phaser.Scene { 2 | constructor() { 3 | super({ 4 | key: 'BootScene' 5 | }); 6 | } 7 | 8 | update(): void { 9 | this.scene.start('MainMenuScene'); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/games/asteroid/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/asteroid/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Asteroid', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/blockade/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "blockade", 3 | "version": "0.0.1", 4 | "description": "Blockade for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/blockade/src/assets/font/pcsenior.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/blockade/src/assets/font/pcsenior.png -------------------------------------------------------------------------------- /src/games/blockade/src/assets/images/border.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/blockade/src/assets/images/border.png -------------------------------------------------------------------------------- /src/games/blockade/src/assets/images/player.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/blockade/src/assets/images/player.png -------------------------------------------------------------------------------- /src/games/blockade/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { MainMenuScene } from './scenes/main-menu-scene'; 3 | import { GameScene } from './scenes/game-scene'; 4 | 5 | export const GameConfig: Phaser.Types.Core.GameConfig = { 6 | title: 'Blockade', 7 | url: 'https://github.com/digitsensitive/phaser3-typescript', 8 | version: '0.0.1', 9 | width: 256, 10 | height: 224, 11 | zoom: 3, 12 | type: Phaser.AUTO, 13 | parent: 'game', 14 | scene: [BootScene, MainMenuScene, GameScene], 15 | input: { 16 | keyboard: true, 17 | mouse: false, 18 | touch: false, 19 | gamepad: false 20 | }, 21 | backgroundColor: '#000000', 22 | render: { pixelArt: true, antialias: false } 23 | }; 24 | -------------------------------------------------------------------------------- /src/games/blockade/src/const/const.ts: -------------------------------------------------------------------------------- 1 | export let CONST = { 2 | P1_SCORE: 0, 3 | P2_SCORE: 0, 4 | FIELD_SIZE: 8 5 | }; 6 | -------------------------------------------------------------------------------- /src/games/blockade/src/game.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * In October 1976 Gremlin published a 2-player Maze Game called Blockade. 3 | * It is the first of what would become known as snake games. 4 | * 5 | * The display was 256 x 224 pixels and the game had only 2 colors. 6 | * Using four directional buttons, each player could move his character around 7 | * leaving a solid line behind them, turning at 90 degree angles. To win, a player 8 | * had to last longer than the opponent before hitting something. The game ended 9 | * after one player gained six wins ([Wikipedia]()). 10 | */ 11 | 12 | import 'phaser'; 13 | import { GameConfig } from './config'; 14 | 15 | export class Game extends Phaser.Game { 16 | constructor(config: Phaser.Types.Core.GameConfig) { 17 | super(config); 18 | } 19 | } 20 | 21 | window.addEventListener('load', () => { 22 | const game = new Game(GameConfig); 23 | }); 24 | -------------------------------------------------------------------------------- /src/games/blockade/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/blockade/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/blockade/src/objects/wall.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | 3 | export class Wall extends Phaser.GameObjects.Image { 4 | constructor(params: ImageConstructor) { 5 | super(params.scene, params.x, params.y, params.texture, params.frame); 6 | this.setOrigin(0.5, 0.5); 7 | this.setAlpha(Phaser.Math.RND.between(0.01, 0.4)); 8 | this.scene.add.existing(this); 9 | } 10 | 11 | update(): void { 12 | if (this.alpha < 1) { 13 | this.setAlpha(this.alpha + 0.005); 14 | } else { 15 | this.setAlpha(1); 16 | } 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /src/games/blockade/src/scenes/boot-scene.ts: -------------------------------------------------------------------------------- 1 | export class BootScene extends Phaser.Scene { 2 | constructor() { 3 | super({ 4 | key: 'BootScene' 5 | }); 6 | } 7 | 8 | update(): void { 9 | this.scene.start('MainMenuScene'); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/games/blockade/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/blockade/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Blockade', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/blocks/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "blocks", 3 | "version": "0.0.1", 4 | "description": "Blocks for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/blocks/src/assets/images/cursor.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/blocks/src/assets/images/cursor.png -------------------------------------------------------------------------------- /src/games/blocks/src/assets/pack.json: -------------------------------------------------------------------------------- 1 | { 2 | "preload": { 3 | "files": [ 4 | { 5 | "type": "spritesheet", 6 | "key": "block", 7 | "url": "./assets/sprites/block.png", 8 | "frameConfig": { 9 | "frameWidth": 16, 10 | "frameHeight": 16 11 | } 12 | }, 13 | { 14 | "type": "image", 15 | "key": "cursor", 16 | "url": "./assets/images/cursor.png" 17 | } 18 | ] 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /src/games/blocks/src/assets/sprites/block.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/blocks/src/assets/sprites/block.png -------------------------------------------------------------------------------- /src/games/blocks/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | 4 | export const GameConfig: Phaser.Types.Core.GameConfig = { 5 | title: 'Blocks', 6 | url: 'https://github.com/digitsensitive/phaser3-typescript', 7 | version: '0.0.1', 8 | width: 160, 9 | height: 144, 10 | zoom: 3, 11 | type: Phaser.AUTO, 12 | parent: 'game', 13 | scene: [BootScene, GameScene], 14 | backgroundColor: '#24232e', 15 | render: { pixelArt: true, antialias: false } 16 | }; 17 | -------------------------------------------------------------------------------- /src/games/blocks/src/const/const.ts: -------------------------------------------------------------------------------- 1 | export let CONST = { 2 | currentLevel: 0, 3 | tileSize: 16, 4 | levels: [ 5 | { 6 | width: 10, 7 | height: 9, 8 | cursorStart: [3, 3], 9 | data: [ 10 | [1, 1, 1, 1, 1, 1, 1, 1, 1, 1], 11 | [1, 0, 0, 0, 1, 1, 1, 1, 1, 1], 12 | [1, 0, 0, 0, 0, 0, 0, 1, 1, 1], 13 | [1, 0, 0, 0, 0, 3, 0, 1, 1, 1], 14 | [1, 0, 0, 0, 0, 2, 0, 1, 1, 1], 15 | [1, 0, 0, 3, 2, 4, 3, 1, 1, 1], 16 | [1, 0, 4, 1, 1, 1, 1, 1, 1, 1], 17 | [1, 1, 1, 1, 1, 1, 1, 1, 1, 1], 18 | [1, 1, 1, 1, 1, 1, 1, 1, 1, 1] 19 | ] 20 | } 21 | ] 22 | }; 23 | -------------------------------------------------------------------------------- /src/games/blocks/src/game.ts: -------------------------------------------------------------------------------- 1 | /** This is just a concept for a game **/ 2 | 3 | import 'phaser'; 4 | import { GameConfig } from './config'; 5 | 6 | export class Game extends Phaser.Game { 7 | constructor(config: Phaser.Types.Core.GameConfig) { 8 | super(config); 9 | } 10 | } 11 | 12 | window.addEventListener('load', () => { 13 | const game = new Game(GameConfig); 14 | }); 15 | -------------------------------------------------------------------------------- /src/games/blocks/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/blocks/src/interfaces/block.interface.ts: -------------------------------------------------------------------------------- 1 | export interface BlockConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | type: number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/blocks/src/interfaces/cursor.interface.ts: -------------------------------------------------------------------------------- 1 | export interface CursorConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | alpha?: number; 7 | frame?: string | number; 8 | cursorStartPosition: any; 9 | } 10 | -------------------------------------------------------------------------------- /src/games/blocks/src/objects/block.ts: -------------------------------------------------------------------------------- 1 | import { BlockConstructor } from '../interfaces/block.interface'; 2 | 3 | export class Block extends Phaser.GameObjects.Sprite { 4 | private blockType: number; 5 | private isDying: boolean; 6 | 7 | constructor(params: BlockConstructor) { 8 | super(params.scene, params.x, params.y, params.texture, params.type); 9 | 10 | this.blockType = params.type; 11 | this.isDying = false; 12 | 13 | this.initSprite(); 14 | this.scene.add.existing(this); 15 | } 16 | 17 | update(): void { 18 | if (this.isDying) { 19 | this.alpha -= 0.02; 20 | 21 | if (this.alpha === 0) { 22 | this.isDying = false; 23 | this.setType(0); 24 | this.setAlpha(1); 25 | } 26 | } 27 | } 28 | 29 | private initSprite() { 30 | this.setFrame(this.blockType); 31 | this.setOrigin(0, 0); 32 | } 33 | 34 | public getType(): number { 35 | return this.blockType; 36 | } 37 | 38 | public setType(id: number): void { 39 | this.blockType = id; 40 | this.setFrame(this.blockType); 41 | } 42 | 43 | public activateDead(): void { 44 | this.isDying = true; 45 | } 46 | 47 | public getDead(): boolean { 48 | return this.isDying; 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /src/games/blocks/src/objects/cursor.ts: -------------------------------------------------------------------------------- 1 | import { CONST } from '../const/const'; 2 | import { CursorConstructor } from '../interfaces/cursor.interface'; 3 | 4 | export class Cursor extends Phaser.GameObjects.Image { 5 | private currentPosition: [number, number]; 6 | private activated: boolean; 7 | 8 | constructor(params: CursorConstructor) { 9 | super( 10 | params.scene, 11 | params.x, 12 | params.y, 13 | params.texture, 14 | params.cursorStartPosition 15 | ); 16 | 17 | this.currentPosition = params.cursorStartPosition; 18 | this.initVariables(); 19 | this.initImage(); 20 | 21 | this.scene.add.existing(this); 22 | } 23 | 24 | private initVariables(): void { 25 | this.activated = false; 26 | } 27 | 28 | private initImage(): void { 29 | this.setOrigin(0, 0); 30 | } 31 | 32 | public moveTo(x: number, y: number): void { 33 | this.currentPosition = [x, y]; 34 | this.setPosition(x * CONST.tileSize, y * CONST.tileSize); 35 | } 36 | 37 | public getX(): number { 38 | return this.currentPosition[0]; 39 | } 40 | 41 | public getY(): number { 42 | return this.currentPosition[1]; 43 | } 44 | 45 | public isActivated(): boolean { 46 | return this.activated; 47 | } 48 | 49 | public setActivated(): void { 50 | this.activated = !this.activated; 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /src/games/blocks/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/blocks/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Blocks', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/breakout/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "breakout", 3 | "version": "0.0.1", 4 | "description": "Breakout for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/breakout/src/assets/font/font.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/breakout/src/assets/font/font.png -------------------------------------------------------------------------------- /src/games/breakout/src/assets/pack.json: -------------------------------------------------------------------------------- 1 | { 2 | "preload": { 3 | "files": [ 4 | { 5 | "type": "bitmapFont", 6 | "key": "font", 7 | "textureURL": "./assets/font/font.png", 8 | "fontDataURL": "./assets/font/font.fnt" 9 | } 10 | ] 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/games/breakout/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | 4 | export const GameConfig: Phaser.Types.Core.GameConfig = { 5 | title: 'Breakout', 6 | url: 'https://github.com/digitsensitive/phaser3-typescript', 7 | version: '0.0.1', 8 | type: Phaser.AUTO, 9 | scene: [BootScene, GameScene], 10 | input: { 11 | keyboard: true 12 | }, 13 | physics: { 14 | default: 'arcade', 15 | arcade: { 16 | gravity: { x: 0, y: 0 } 17 | } 18 | }, 19 | scale: { 20 | mode: Phaser.Scale.NONE, 21 | autoCenter: Phaser.Scale.CENTER_HORIZONTALLY, 22 | parent: 'game', 23 | width: 480, 24 | height: 640 25 | }, 26 | backgroundColor: 0x262626, 27 | render: { pixelArt: true } 28 | }; 29 | -------------------------------------------------------------------------------- /src/games/breakout/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/breakout/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/breakout/src/interfaces/interfaces.ts: -------------------------------------------------------------------------------- 1 | export interface RectangleConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | width?: number; 6 | height?: number; 7 | fillColor?: number; 8 | fillAlpha?: number; 9 | } 10 | -------------------------------------------------------------------------------- /src/games/breakout/src/objects/ball.ts: -------------------------------------------------------------------------------- 1 | import { RectangleConstructor } from '../interfaces/interfaces'; 2 | 3 | export class Ball extends Phaser.GameObjects.Rectangle { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | constructor(params: RectangleConstructor) { 7 | super( 8 | params.scene, 9 | params.x, 10 | params.y, 11 | params.width, 12 | params.height, 13 | params.fillColor, 14 | params.fillAlpha 15 | ); 16 | 17 | this.initRectangle(); 18 | this.initPhysics(); 19 | this.scene.add.existing(this); 20 | } 21 | 22 | private initRectangle(): void { 23 | this.setOrigin(0); 24 | this.width = 10; 25 | this.height = 10; 26 | this.setFillStyle(0xffffff); 27 | } 28 | 29 | private initPhysics(): void { 30 | this.scene.physics.world.enable(this); 31 | this.body.setBounce(1, 1); 32 | this.body.setCollideWorldBounds(); 33 | } 34 | 35 | public applyInitVelocity(): void { 36 | this.body.setVelocity(Phaser.Math.RND.between(-200, 200), 200); 37 | this.body.speed = 800; 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /src/games/breakout/src/objects/brick.ts: -------------------------------------------------------------------------------- 1 | import { RectangleConstructor } from '../interfaces/interfaces'; 2 | 3 | export class Brick extends Phaser.GameObjects.Rectangle { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | constructor(params: RectangleConstructor) { 7 | super( 8 | params.scene, 9 | params.x, 10 | params.y, 11 | params.width, 12 | params.height, 13 | params.fillColor, 14 | params.fillAlpha 15 | ); 16 | 17 | this.initRectangle(); 18 | this.initPhysics(); 19 | this.scene.add.existing(this); 20 | } 21 | 22 | private initRectangle(): void { 23 | this.setOrigin(0); 24 | } 25 | 26 | private initPhysics(): void { 27 | this.scene.physics.world.enable(this); 28 | this.body.setImmovable(true); 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/games/breakout/src/settings.ts: -------------------------------------------------------------------------------- 1 | const LEVELS = [ 2 | { 3 | BRICKS: [ 4 | 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 5 | 0, 0, 0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 6 | 1, 1, 1, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 7 | 2, 2, 2, 2, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 8 | 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3 9 | ], 10 | HEIGHT: 8, 11 | WIDTH: 14 12 | } 13 | ]; 14 | export let settings = { 15 | BRICK: { HEIGHT: 10, MARGIN_TOP: 50, SPACING: 10, WIDTH: 25 }, 16 | LEVELS: LEVELS, 17 | currentLevel: 0, 18 | highScore: 0, 19 | lives: 3, 20 | score: 0 21 | }; 22 | -------------------------------------------------------------------------------- /src/games/breakout/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/breakout/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Breakout', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/candy-crush/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "candy-crush", 3 | "version": "0.0.1", 4 | "description": "Candy Crush for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/cookie1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/cookie1.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/cookie2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/cookie2.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/croissant.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/croissant.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/cupcake.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/cupcake.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/donut.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/donut.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/eclair.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/eclair.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/macaroon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/macaroon.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/pie.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/pie.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/poptart1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/poptart1.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/poptart2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/poptart2.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/starcookie1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/starcookie1.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/assets/images/starcookie2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/candy-crush/src/assets/images/starcookie2.png -------------------------------------------------------------------------------- /src/games/candy-crush/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | 4 | export const GameConfig: Phaser.Types.Core.GameConfig = { 5 | title: 'Candy crush', 6 | url: 'https://github.com/digitsensitive/phaser3-typescript', 7 | version: '0.0.1', 8 | width: 520, 9 | height: 700, 10 | type: Phaser.AUTO, 11 | parent: 'game', 12 | scene: [BootScene, GameScene], 13 | backgroundColor: '#de3412', 14 | render: { pixelArt: false, antialias: true } 15 | }; 16 | -------------------------------------------------------------------------------- /src/games/candy-crush/src/const/const.ts: -------------------------------------------------------------------------------- 1 | export let CONST = { 2 | score: 0, 3 | highscore: 0, 4 | gridWidth: 8, 5 | gridHeight: 8, 6 | tileWidth: 64, 7 | tileHeight: 72, 8 | candyTypes: [ 9 | 'cookie1', 10 | 'cookie2', 11 | 'croissant', 12 | 'cupcake', 13 | 'donut', 14 | 'eclair', 15 | 'macaroon', 16 | 'pie', 17 | 'poptart1', 18 | 'poptart2', 19 | 'starcookie1', 20 | 'starcookie2' 21 | ] 22 | }; 23 | -------------------------------------------------------------------------------- /src/games/candy-crush/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/candy-crush/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/candy-crush/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/candy-crush/src/objects/tile.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | 3 | export class Tile extends Phaser.GameObjects.Image { 4 | constructor(params: ImageConstructor) { 5 | super(params.scene, params.x, params.y, params.texture, params.frame); 6 | 7 | // set image settings 8 | this.setOrigin(0, 0); 9 | this.setInteractive(); 10 | 11 | this.scene.add.existing(this); 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/games/candy-crush/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/candy-crush/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Candy Crush', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/clocks/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "clocks", 3 | "version": "0.0.1", 4 | "description": "Clocks for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/clocks/src/assets/images/ball.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/clocks/src/assets/images/ball.png -------------------------------------------------------------------------------- /src/games/clocks/src/assets/images/bigclockface.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/clocks/src/assets/images/bigclockface.png -------------------------------------------------------------------------------- /src/games/clocks/src/assets/images/smallclockface.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/clocks/src/assets/images/smallclockface.png -------------------------------------------------------------------------------- /src/games/clocks/src/assets/pack.json: -------------------------------------------------------------------------------- 1 | { 2 | "preload": { 3 | "files": [ 4 | { 5 | "type": "image", 6 | "key": "ball", 7 | "url": "./assets/images/ball.png" 8 | }, 9 | { 10 | "type": "image", 11 | "key": "smallclockface", 12 | "url": "./assets/images/smallclockface.png" 13 | }, 14 | { 15 | "type": "image", 16 | "key": "bigclockface", 17 | "url": "./assets/images/bigclockface.png" 18 | }, 19 | { 20 | "type": "spritesheet", 21 | "key": "bigclock", 22 | "url": "./assets/sprites/bigclock.png", 23 | "frameConfig": { 24 | "frameWidth": 140, 25 | "frameHeight": 140 26 | } 27 | }, 28 | { 29 | "type": "spritesheet", 30 | "key": "bighand", 31 | "url": "./assets/sprites/bighand.png", 32 | "frameConfig": { 33 | "frameWidth": 140, 34 | "frameHeight": 140 35 | } 36 | }, 37 | { 38 | "type": "spritesheet", 39 | "key": "smallclock", 40 | "url": "./assets/sprites/smallclock.png", 41 | "frameConfig": { 42 | "frameWidth": 70, 43 | "frameHeight": 70 44 | } 45 | }, 46 | { 47 | "type": "spritesheet", 48 | "key": "smallhand", 49 | "url": "./assets/sprites/smallhand.png", 50 | "frameConfig": { 51 | "frameWidth": 70, 52 | "frameHeight": 70 53 | } 54 | } 55 | ] 56 | } 57 | } 58 | -------------------------------------------------------------------------------- /src/games/clocks/src/assets/sprites/bigclock.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/clocks/src/assets/sprites/bigclock.png -------------------------------------------------------------------------------- /src/games/clocks/src/assets/sprites/bighand.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/clocks/src/assets/sprites/bighand.png -------------------------------------------------------------------------------- /src/games/clocks/src/assets/sprites/smallclock.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/clocks/src/assets/sprites/smallclock.png -------------------------------------------------------------------------------- /src/games/clocks/src/assets/sprites/smallhand.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/clocks/src/assets/sprites/smallhand.png -------------------------------------------------------------------------------- /src/games/clocks/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | 4 | export const GameConfig: Phaser.Types.Core.GameConfig = { 5 | title: 'Clocks', 6 | url: 'https://github.com/digitsensitive/phaser3-typescript', 7 | version: '0.0.1', 8 | type: Phaser.AUTO, 9 | scene: [BootScene, GameScene], 10 | input: { 11 | keyboard: true 12 | }, 13 | physics: { 14 | default: 'arcade', 15 | arcade: { 16 | gravity: { x: 0, y: 0 } 17 | } 18 | }, 19 | scale: { 20 | mode: Phaser.Scale.FIT, 21 | autoCenter: Phaser.Scale.CENTER_BOTH, 22 | parent: 'game', 23 | width: 640, 24 | height: 960 25 | }, 26 | backgroundColor: 0x4ac7ff 27 | }; 28 | -------------------------------------------------------------------------------- /src/games/clocks/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/clocks/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/clocks/src/interfaces/interfaces.ts: -------------------------------------------------------------------------------- 1 | export interface ClockConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | prefix: string; 8 | } 9 | 10 | export interface ImageConstructor { 11 | scene: Phaser.Scene; 12 | x: number; 13 | y: number; 14 | texture: string | Phaser.Textures.Texture; 15 | frame?: string | number; 16 | } 17 | -------------------------------------------------------------------------------- /src/games/clocks/src/objects/ball.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/interfaces'; 2 | 3 | export class Ball extends Phaser.GameObjects.Image { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | private speed: number; 7 | 8 | constructor(params: ImageConstructor) { 9 | super(params.scene, params.x, params.y, params.texture, params.frame); 10 | 11 | this.initVariables(); 12 | this.initImage(); 13 | this.initPhysics(); 14 | this.scene.add.existing(this); 15 | } 16 | 17 | private initVariables() { 18 | this.speed = 600; 19 | } 20 | 21 | private initImage() { 22 | this.setVisible(false); 23 | } 24 | 25 | private initPhysics() { 26 | this.scene.physics.world.enable(this); 27 | this.body.setCollideWorldBounds(true); 28 | this.body.onWorldBounds = true; 29 | } 30 | 31 | public getSpeed(): number { 32 | return this.speed; 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /src/games/clocks/src/settings.ts: -------------------------------------------------------------------------------- 1 | const LEVELS = [ 2 | { 3 | CLOCK_SPEED: { MIN: 200, MAX: 450 }, 4 | CLOCKS: [ 5 | 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 6 | 0, 2, 0, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 2, 0, 0, 0, 0, 0, 7 | 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 8 | ] 9 | }, 10 | { 11 | CLOCK_SPEED: { MIN: 120, MAX: 400 }, 12 | CLOCKS: [ 13 | 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 14 | 0, 0, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 15 | 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 16 | ] 17 | }, 18 | { 19 | CLOCK_SPEED: { MIN: 120, MAX: 400 }, 20 | CLOCKS: [ 21 | 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 22 | 0, 2, 0, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 23 | 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0 24 | ] 25 | } 26 | ]; 27 | 28 | export let settings = { 29 | GRID_SIZE_IN_PIXELS: 40, 30 | LEVELS: LEVELS, 31 | LEVEL_HEIGHT_IN_TILES: 8, 32 | LEVEL_WIDTH_IN_TILES: 8, 33 | currentLevel: 1 34 | }; 35 | -------------------------------------------------------------------------------- /src/games/clocks/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/clocks/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Clocks', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/coin-runner/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "coin-runner", 3 | "version": "0.0.1", 4 | "description": "Coin Runner for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/coin-runner/src/assets/images/background.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/coin-runner/src/assets/images/background.png -------------------------------------------------------------------------------- /src/games/coin-runner/src/assets/images/coin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/coin-runner/src/assets/images/coin.png -------------------------------------------------------------------------------- /src/games/coin-runner/src/assets/images/player.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/coin-runner/src/assets/images/player.png -------------------------------------------------------------------------------- /src/games/coin-runner/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Coin Runner', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | width: 768, 8 | height: 576, 9 | type: Phaser.AUTO, 10 | parent: 'game', 11 | scene: [GameScene], 12 | input: { 13 | keyboard: true 14 | }, 15 | backgroundColor: '#3A99D9', 16 | render: { pixelArt: false, antialias: false } 17 | }; 18 | -------------------------------------------------------------------------------- /src/games/coin-runner/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/coin-runner/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/coin-runner/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/coin-runner/src/objects/player.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | 3 | export class Player extends Phaser.GameObjects.Image { 4 | private cursors: Phaser.Types.Input.Keyboard.CursorKeys; 5 | private walkingSpeed: number; 6 | 7 | constructor(params: ImageConstructor) { 8 | super(params.scene, params.x, params.y, params.texture); 9 | 10 | this.initVariables(); 11 | this.initImage(); 12 | this.initInput(); 13 | 14 | this.scene.add.existing(this); 15 | } 16 | 17 | private initVariables(): void { 18 | this.walkingSpeed = 5; 19 | } 20 | 21 | private initImage(): void { 22 | this.setOrigin(0.5, 0.5); 23 | } 24 | 25 | private initInput(): void { 26 | this.cursors = this.scene.input.keyboard.createCursorKeys(); 27 | } 28 | 29 | update(): void { 30 | this.handleInput(); 31 | } 32 | 33 | private handleInput(): void { 34 | if (this.cursors.right.isDown) { 35 | this.x += this.walkingSpeed; 36 | this.setFlipX(false); 37 | } else if (this.cursors.left.isDown) { 38 | this.x -= this.walkingSpeed; 39 | this.setFlipX(true); 40 | } else if (this.cursors.up.isDown) { 41 | this.y -= this.walkingSpeed; 42 | } else if (this.cursors.down.isDown) { 43 | this.y += this.walkingSpeed; 44 | } 45 | } 46 | } 47 | -------------------------------------------------------------------------------- /src/games/coin-runner/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/coin-runner/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Coin Runner', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/endless-runner/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "endless-runner", 3 | "version": "0.0.1", 4 | "description": "Endless Runner for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "expose-loader": "5.0.0", 15 | "html-webpack-plugin": "5.6.0", 16 | "ts-loader": "9.5.1", 17 | "ts-node": "10.9.2", 18 | "typescript": "5.4.2", 19 | "webpack": "5.90.3", 20 | "webpack-cli": "5.1.4", 21 | "webpack-dev-server": "5.0.2" 22 | }, 23 | "dependencies": { 24 | "phaser": "3.80.1" 25 | }, 26 | "repository": { 27 | "type": "git", 28 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 29 | }, 30 | "author": { 31 | "name": "digitsensitive", 32 | "email": "digit.sensitivee@gmail.com" 33 | }, 34 | "license": "MIT", 35 | "bugs": { 36 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 37 | }, 38 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 39 | } 40 | -------------------------------------------------------------------------------- /src/games/endless-runner/src/config.ts: -------------------------------------------------------------------------------- 1 | import { GameScene } from './scenes/game-scene'; 2 | 3 | export const GameConfig: Phaser.Types.Core.GameConfig = { 4 | title: 'Endless Runner', 5 | url: 'https://github.com/digitsensitive/phaser3-typescript', 6 | version: '0.0.1', 7 | type: Phaser.AUTO, 8 | scene: [GameScene], 9 | input: { 10 | mouse: true 11 | }, 12 | physics: { 13 | default: 'arcade', 14 | arcade: { 15 | gravity: { x: 0, y: 800 } 16 | } 17 | }, 18 | scale: { 19 | mode: Phaser.Scale.NONE, 20 | parent: 'game', 21 | autoCenter: Phaser.Scale.CENTER_BOTH, 22 | width: 960, 23 | height: 640 24 | }, 25 | backgroundColor: 0x4ac7ff 26 | }; 27 | -------------------------------------------------------------------------------- /src/games/endless-runner/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/endless-runner/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/endless-runner/src/settings.ts: -------------------------------------------------------------------------------- 1 | export let settings = { 2 | BLOCK_WIDTH: 40, 3 | MAX_ACTIVE_TOWERS: 8, 4 | SPACING: { MAX: 8, MIN: 4 }, 5 | SCROLLING_SPEED_X_AXIS: -200, 6 | TOWER_PROPERTIES: { 7 | COLOR: 0xffef24, 8 | HEIGHT: { MIN: 80, MAX: 350 } 9 | }, 10 | createTowerXPosition: 0, 11 | highScore: 0, 12 | score: 0 13 | }; 14 | -------------------------------------------------------------------------------- /src/games/endless-runner/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/endless-runner/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 6 | 7 | const config: webpack.Configuration = { 8 | context: path.resolve(__dirname, 'src'), 9 | entry: './game.ts', 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].[chunkhash].js', 13 | chunkFilename: '[name].[chunkhash].js', 14 | clean: true 15 | }, 16 | module: { 17 | rules: [ 18 | { 19 | test: /\.ts$/, 20 | include: path.resolve(__dirname, 'src'), 21 | loader: 'ts-loader' 22 | } 23 | ] 24 | }, 25 | devServer: { 26 | static: path.join(__dirname, 'dist') 27 | }, 28 | resolve: { 29 | extensions: ['.ts', '.js'] 30 | }, 31 | plugins: [ 32 | new HtmlWebpackPlugin({ 33 | template: path.resolve(__dirname, 'src/index.html'), 34 | title: 'Endless Runner', 35 | inject: 'head' 36 | }) 37 | ] 38 | }; 39 | 40 | export default config; 41 | -------------------------------------------------------------------------------- /src/games/flappy-bird/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "flappy-bird", 3 | "version": "0.0.1", 4 | "description": "Flappy Bird for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/flappy-bird/src/assets/font/font.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/flappy-bird/src/assets/font/font.png -------------------------------------------------------------------------------- /src/games/flappy-bird/src/assets/images/bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/flappy-bird/src/assets/images/bg.png -------------------------------------------------------------------------------- /src/games/flappy-bird/src/assets/images/bird.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/flappy-bird/src/assets/images/bird.png -------------------------------------------------------------------------------- /src/games/flappy-bird/src/assets/pack.json: -------------------------------------------------------------------------------- 1 | { 2 | "preload": { 3 | "files": [ 4 | { 5 | "type": "bitmapFont", 6 | "key": "font", 7 | "textureURL": "./assets/font/font.png", 8 | "fontDataURL": "./assets/font/font.fnt" 9 | }, 10 | { 11 | "type": "image", 12 | "key": "background", 13 | "url": "./assets/images/bg.png" 14 | }, 15 | { 16 | "type": "image", 17 | "key": "bird", 18 | "url": "./assets/images/bird.png" 19 | }, 20 | { 21 | "type": "spritesheet", 22 | "key": "pipe", 23 | "url": "./assets/sprites/pipe.png", 24 | "frameConfig": { 25 | "frameWidth": 20, 26 | "frameHeight": 20 27 | } 28 | } 29 | ] 30 | } 31 | } 32 | -------------------------------------------------------------------------------- /src/games/flappy-bird/src/assets/sprites/pipe.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/flappy-bird/src/assets/sprites/pipe.png -------------------------------------------------------------------------------- /src/games/flappy-bird/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | import { MainMenuScene } from './scenes/main-menu-scene'; 4 | 5 | export const GameConfig: Phaser.Types.Core.GameConfig = { 6 | title: 'Flappy Bird', 7 | url: 'https://github.com/digitsensitive/phaser3-typescript', 8 | version: '0.0.1', 9 | width: 390, 10 | height: 600, 11 | type: Phaser.AUTO, 12 | parent: 'game', 13 | scene: [BootScene, MainMenuScene, GameScene], 14 | input: { 15 | keyboard: true 16 | }, 17 | physics: { 18 | default: 'arcade', 19 | arcade: { 20 | gravity: { x: 0, y: 300 } 21 | } 22 | }, 23 | backgroundColor: '#98d687', 24 | render: { pixelArt: true, antialias: false } 25 | }; 26 | -------------------------------------------------------------------------------- /src/games/flappy-bird/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/flappy-bird/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/flappy-bird/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/flappy-bird/src/objects/pipe.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | 3 | export class Pipe extends Phaser.GameObjects.Image { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | constructor(params: ImageConstructor) { 7 | super(params.scene, params.x, params.y, params.texture, params.frame); 8 | 9 | // image 10 | this.setScale(3); 11 | this.setOrigin(0, 0); 12 | 13 | // physics 14 | this.scene.physics.world.enable(this); 15 | this.body.allowGravity = false; 16 | this.body.setVelocityX(-200); 17 | this.body.setSize(20, 20); 18 | 19 | this.scene.add.existing(this); 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /src/games/flappy-bird/src/scenes/main-menu-scene.ts: -------------------------------------------------------------------------------- 1 | export class MainMenuScene extends Phaser.Scene { 2 | private startKey: Phaser.Input.Keyboard.Key; 3 | private titleBitmapText: Phaser.GameObjects.BitmapText; 4 | private playBitmapText: Phaser.GameObjects.BitmapText; 5 | 6 | constructor() { 7 | super({ 8 | key: 'MainMenuScene' 9 | }); 10 | } 11 | 12 | init(): void { 13 | this.startKey = this.input.keyboard.addKey( 14 | Phaser.Input.Keyboard.KeyCodes.S 15 | ); 16 | this.startKey.isDown = false; 17 | } 18 | 19 | create(): void { 20 | this.titleBitmapText = this.add.bitmapText( 21 | 0, 22 | 200, 23 | 'font', 24 | 'FLAPPY BIRD', 25 | 30 26 | ); 27 | 28 | this.titleBitmapText.x = this.getCenterXPositionOfBitmapText( 29 | this.titleBitmapText.width 30 | ); 31 | 32 | this.playBitmapText = this.add.bitmapText(0, 300, 'font', 'S: PLAY', 25); 33 | 34 | this.playBitmapText.x = this.getCenterXPositionOfBitmapText( 35 | this.playBitmapText.width 36 | ); 37 | } 38 | 39 | update(): void { 40 | if (this.startKey.isDown) { 41 | this.scene.start('GameScene'); 42 | } 43 | } 44 | 45 | private getCenterXPositionOfBitmapText(width: number): number { 46 | return this.sys.canvas.width / 2 - width / 2; 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /src/games/flappy-bird/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/flappy-bird/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Flappy Bird', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/snake/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "snake", 3 | "version": "0.0.1", 4 | "description": "Snake for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/snake/src/assets/font/snakeFont.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/snake/src/assets/font/snakeFont.png -------------------------------------------------------------------------------- /src/games/snake/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | import { MainMenuScene } from './scenes/main-menu-scene'; 4 | 5 | export const GameConfig: Phaser.Types.Core.GameConfig = { 6 | title: 'Snake', 7 | url: 'https://github.com/digitsensitive/phaser3-typescript', 8 | version: '0.0.1', 9 | width: 256, 10 | height: 224, 11 | zoom: 3, 12 | type: Phaser.AUTO, 13 | parent: 'game', 14 | scene: [BootScene, MainMenuScene, GameScene], 15 | input: { 16 | keyboard: true, 17 | mouse: false, 18 | touch: false, 19 | gamepad: false 20 | }, 21 | backgroundColor: '#000000', 22 | render: { pixelArt: true, antialias: false } 23 | }; 24 | -------------------------------------------------------------------------------- /src/games/snake/src/const/const.ts: -------------------------------------------------------------------------------- 1 | export let CONST = { 2 | SCORE: 0, 3 | HIGHSCORE: 0, 4 | FIELD_SIZE: 8 5 | }; 6 | -------------------------------------------------------------------------------- /src/games/snake/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/snake/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/snake/src/interfaces/graphics.interface.ts: -------------------------------------------------------------------------------- 1 | export interface GraphicsConstructor { 2 | scene: Phaser.Scene; 3 | options?: Phaser.Types.GameObjects.Graphics.Options; 4 | } 5 | -------------------------------------------------------------------------------- /src/games/snake/src/objects/apple.ts: -------------------------------------------------------------------------------- 1 | import { CONST } from '../const/const'; 2 | import { GraphicsConstructor } from '../interfaces/graphics.interface'; 3 | 4 | export class Apple extends Phaser.GameObjects.Graphics { 5 | constructor(params: GraphicsConstructor) { 6 | super(params.scene, params.options); 7 | this.x = params.options.x; 8 | this.y = params.options.y; 9 | this.fillStyle(0x61e85b, 0.8); 10 | this.fillRect( 11 | CONST.FIELD_SIZE, 12 | CONST.FIELD_SIZE, 13 | CONST.FIELD_SIZE, 14 | CONST.FIELD_SIZE 15 | ); 16 | this.scene.add.existing(this); 17 | } 18 | 19 | /** 20 | * Randomly generate new apple position on the field 21 | * @param _rndX [Random X Position] 22 | * @param _rndY [Random Y Position] 23 | */ 24 | public newApplePosition(_rndX: number, _rndY: number): void { 25 | this.x = _rndX; 26 | this.y = _rndY; 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/games/snake/src/scenes/boot-scene.ts: -------------------------------------------------------------------------------- 1 | export class BootScene extends Phaser.Scene { 2 | constructor() { 3 | super({ 4 | key: 'BootScene' 5 | }); 6 | } 7 | 8 | update(): void { 9 | this.scene.start('MainMenuScene'); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/games/snake/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/snake/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Snake', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/space-invaders/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "space-invaders", 3 | "version": "0.0.1", 4 | "description": "Space Invaders for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/assets/font/font.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/space-invaders/src/assets/font/font.png -------------------------------------------------------------------------------- /src/games/space-invaders/src/assets/pack.json: -------------------------------------------------------------------------------- 1 | { 2 | "preload": { 3 | "files": [ 4 | { 5 | "type": "bitmapFont", 6 | "key": "font", 7 | "textureURL": "./assets/font/font.png", 8 | "fontDataURL": "./assets/font/font.fnt" 9 | }, 10 | { 11 | "type": "json", 12 | "key": "animationJSON", 13 | "url": "./assets/animations/animations.json" 14 | }, 15 | { 16 | "type": "image", 17 | "key": "bullet", 18 | "url": "./assets/sprites/bullet.png" 19 | }, 20 | { 21 | "type": "image", 22 | "key": "player", 23 | "url": "./assets/sprites/player.png" 24 | }, 25 | { 26 | "type": "spritesheet", 27 | "key": "octopus", 28 | "url": "./assets/sprites/octopus.png", 29 | "frameConfig": { 30 | "frameWidth": 12, 31 | "frameHeight": 8 32 | } 33 | }, 34 | { 35 | "type": "spritesheet", 36 | "key": "crab", 37 | "url": "./assets/sprites/crab.png", 38 | "frameConfig": { 39 | "frameWidth": 11, 40 | "frameHeight": 8 41 | } 42 | }, 43 | { 44 | "type": "spritesheet", 45 | "key": "squid", 46 | "url": "./assets/sprites/squid.png", 47 | "frameConfig": { 48 | "frameWidth": 8, 49 | "frameHeight": 8 50 | } 51 | } 52 | ] 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/assets/sprites/bullet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/space-invaders/src/assets/sprites/bullet.png -------------------------------------------------------------------------------- /src/games/space-invaders/src/assets/sprites/crab.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/space-invaders/src/assets/sprites/crab.png -------------------------------------------------------------------------------- /src/games/space-invaders/src/assets/sprites/octopus.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/space-invaders/src/assets/sprites/octopus.png -------------------------------------------------------------------------------- /src/games/space-invaders/src/assets/sprites/player.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/space-invaders/src/assets/sprites/player.png -------------------------------------------------------------------------------- /src/games/space-invaders/src/assets/sprites/squid.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/space-invaders/src/assets/sprites/squid.png -------------------------------------------------------------------------------- /src/games/space-invaders/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | import { HUDScene } from './scenes/hud-scene'; 4 | import { MenuScene } from './scenes/menu-scene'; 5 | 6 | export const GameConfig: Phaser.Types.Core.GameConfig = { 7 | title: 'Space Invaders', 8 | url: 'https://github.com/digitsensitive/phaser3-typescript', 9 | version: '0.0.1', 10 | width: 224, 11 | height: 240, 12 | zoom: 3, 13 | type: Phaser.AUTO, 14 | parent: 'game', 15 | scene: [BootScene, MenuScene, GameScene, HUDScene], 16 | input: { 17 | keyboard: true 18 | }, 19 | physics: { 20 | default: 'arcade', 21 | arcade: { 22 | gravity: { x: 0, y: 0 }, 23 | debug: false 24 | } 25 | }, 26 | backgroundColor: '#f5cc69', 27 | render: { pixelArt: true, antialias: false } 28 | }; 29 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/interfaces/bullet.interface.ts: -------------------------------------------------------------------------------- 1 | export interface BulletConstructor { 2 | scene: Phaser.Scene; 3 | bulletProperties: { speed: number }; 4 | x: number; 5 | y: number; 6 | texture: string; 7 | frame?: string | number; 8 | } 9 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/interfaces/sprite.interface.ts: -------------------------------------------------------------------------------- 1 | export interface SpriteConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/objects/bullet.ts: -------------------------------------------------------------------------------- 1 | import { BulletConstructor } from '../interfaces/bullet.interface'; 2 | 3 | export class Bullet extends Phaser.GameObjects.Image { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | private bulletSpeed: number; 7 | 8 | constructor(params: BulletConstructor) { 9 | super(params.scene, params.x, params.y, params.texture); 10 | 11 | this.initVariables(params); 12 | this.initImage(); 13 | this.initPhysics(); 14 | 15 | this.scene.add.existing(this); 16 | } 17 | 18 | private initVariables(params: BulletConstructor): void { 19 | this.bulletSpeed = params.bulletProperties.speed; 20 | } 21 | 22 | private initImage(): void { 23 | this.setOrigin(0.5, 0.5); 24 | } 25 | 26 | private initPhysics(): void { 27 | this.scene.physics.world.enable(this); 28 | this.body.setVelocityY(this.bulletSpeed); 29 | this.body.setSize(1, 8); 30 | } 31 | 32 | update(): void { 33 | if (this.y < 0 || this.y > this.scene.sys.canvas.height) { 34 | this.destroy(); 35 | } 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /src/games/space-invaders/src/scenes/hud-scene.ts: -------------------------------------------------------------------------------- 1 | export class HUDScene extends Phaser.Scene { 2 | private bitmapTexts: Phaser.GameObjects.BitmapText[]; 3 | 4 | constructor() { 5 | super({ 6 | key: 'HUDScene' 7 | }); 8 | } 9 | 10 | init(): void { 11 | this.bitmapTexts = []; 12 | } 13 | 14 | create(): void { 15 | // create bitmap texts 16 | this.bitmapTexts.push( 17 | this.add.bitmapText( 18 | 10, 19 | this.scene.systems.canvas.height - 20, 20 | 'font', 21 | `Lives: ${this.registry.get('lives')}`, 22 | 8 23 | ) 24 | ); 25 | this.bitmapTexts.push( 26 | this.add.bitmapText( 27 | 10, 28 | 10, 29 | 'font', 30 | `Points: ${this.registry.get('points')}`, 31 | 8 32 | ) 33 | ); 34 | 35 | // create events 36 | const level = this.scene.get('GameScene'); 37 | level.events.on('pointsChanged', this.updatePoints, this); 38 | level.events.on('livesChanged', this.updateLives, this); 39 | } 40 | 41 | private updatePoints() { 42 | this.bitmapTexts[1].setText(`Points: ${this.registry.get('points')}`); 43 | } 44 | 45 | private updateLives() { 46 | this.bitmapTexts[0].setText(`Lives: ${this.registry.get('lives')}`); 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /src/games/space-invaders/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/space-invaders/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Space Invaders', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/space-shooter/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "space-shooter", 3 | "version": "0.0.1", 4 | "description": "Space Shooter for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/space-shooter/src/assets/images/player.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/space-shooter/src/assets/images/player.png -------------------------------------------------------------------------------- /src/games/space-shooter/src/assets/pack.json: -------------------------------------------------------------------------------- 1 | { 2 | "preload": { 3 | "files": [ 4 | { 5 | "type": "image", 6 | "key": "player", 7 | "url": "./assets/images/player.png" 8 | } 9 | ] 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/games/space-shooter/src/assets/styles/css/style.css: -------------------------------------------------------------------------------- 1 | body{background-color:#282c34;color:#abb2bf} -------------------------------------------------------------------------------- /src/games/space-shooter/src/assets/styles/less/style.less: -------------------------------------------------------------------------------- 1 | // out: ../css/style.css, compress: true, sourceMap: false 2 | 3 | body { 4 | background-color: #282c34; 5 | color: #abb2bf; 6 | } 7 | -------------------------------------------------------------------------------- /src/games/space-shooter/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | 4 | export const GameConfig: Phaser.Types.Core.GameConfig = { 5 | title: 'Space Shooter', 6 | url: 'https://github.com/digitsensitive/phaser3-typescript', 7 | version: '0.0.1', 8 | width: 800, 9 | height: 600, 10 | backgroundColor: 0x3a404d, 11 | type: Phaser.AUTO, 12 | parent: 'game', 13 | physics: { 14 | default: 'arcade', 15 | arcade: { 16 | gravity: { x: 0, y: 0 } 17 | } 18 | }, 19 | scene: [BootScene, GameScene] 20 | }; 21 | -------------------------------------------------------------------------------- /src/games/space-shooter/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/space-shooter/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 13 | <%= htmlWebpackPlugin.options.title %> 14 | 15 | 16 |
17 | 18 | 19 | -------------------------------------------------------------------------------- /src/games/space-shooter/src/interfaces/bullet.interface.ts: -------------------------------------------------------------------------------- 1 | export interface BulletConstructor { 2 | scene: Phaser.Scene; 3 | rotation: number; 4 | options?: Phaser.Types.GameObjects.Graphics.Options; 5 | } 6 | -------------------------------------------------------------------------------- /src/games/space-shooter/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string | Phaser.Textures.Texture; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/space-shooter/src/scenes/game-scene.ts: -------------------------------------------------------------------------------- 1 | import { Player } from '../objects/player'; 2 | 3 | export class GameScene extends Phaser.Scene { 4 | private player: Player; 5 | 6 | constructor() { 7 | super({ key: 'GameScene' }); 8 | } 9 | 10 | create(): void { 11 | this.player = new Player({ 12 | scene: this, 13 | x: 400, 14 | y: 300, 15 | texture: 'player' 16 | }); 17 | } 18 | 19 | update(): void { 20 | this.player.update(); 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /src/games/space-shooter/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/space-shooter/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Space Shooter', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/super-mario-land/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "super-mario-land", 3 | "version": "0.0.1", 4 | "description": "Super Mario Land for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/collectibles/coin2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/collectibles/coin2.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/collectibles/flower.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/collectibles/flower.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/collectibles/heart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/collectibles/heart.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/collectibles/mushroom.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/collectibles/mushroom.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/collectibles/star.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/collectibles/star.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/font/superMarioLand.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/font/superMarioLand.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/images/platform.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/images/platform.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/images/title.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/images/title.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/sprites/box.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/sprites/box.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/sprites/brick.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/sprites/brick.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/sprites/coin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/sprites/coin.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/sprites/goomba.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/sprites/goomba.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/sprites/mario.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/sprites/mario.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/sprites/rotatingCoin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/sprites/rotatingCoin.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/assets/tiles/tiles.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/super-mario-land/src/assets/tiles/tiles.png -------------------------------------------------------------------------------- /src/games/super-mario-land/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | import { HUDScene } from './scenes/hud-scene'; 4 | import { MenuScene } from './scenes/menu-scene'; 5 | 6 | export const GameConfig: Phaser.Types.Core.GameConfig = { 7 | title: 'Super Mario Land', 8 | url: 'https://github.com/digitsensitive/phaser3-typescript', 9 | version: '0.0.1', 10 | width: 160, 11 | height: 144, 12 | zoom: 5, 13 | type: Phaser.AUTO, 14 | parent: 'game', 15 | scene: [BootScene, MenuScene, HUDScene, GameScene], 16 | input: { 17 | keyboard: true 18 | }, 19 | physics: { 20 | default: 'arcade', 21 | arcade: { 22 | gravity: { x: 0, y: 475 }, 23 | debug: false 24 | } 25 | }, 26 | backgroundColor: '#f8f8f8', 27 | render: { pixelArt: true } 28 | }; 29 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/game.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * A remake of the famous and great Super Mario Land released in 1989 on the Game Boy. 3 | * I have used the original screen resolution of 160 x 144 Pixels. 4 | * 5 | * The creation of this remake took more time than expected. 6 | * Only the first level was implemented, with the following components to follow: 7 | * 8 | * - Enemy Nokobon 9 | * - Enemy Fly 10 | * - Platform at the end of the level is not working properly yet 11 | * - Currently you can go several times into the tubes 12 | * - Small details 13 | * 14 | * This is a remake of the original game for educational purposes. 15 | * The rights remain with Nintendo. 16 | * 17 | * References and Resources 18 | * 19 | * [1] [Spriters Resource](https://www.spriters-resource.com/game_boy_gbc/sml) 20 | * [2] [Super Mario Land Font by Patrick Lauke, CC BY 3.0 license](https://smartfonts.com/super-mario-land.font) 21 | * [3] [Nintendo Technical Data](https://www.nintendo.co.uk/Support/Game-Boy-Pocket-Color/Product-information/Technical-data/Technical-data-619585.html) 22 | * [4] [Generic Platformer and Phaser Bootstrap Project](https://github.com/nkholski/phaser3-es6-webpack) 23 | */ 24 | 25 | import 'phaser'; 26 | import { GameConfig } from './config'; 27 | 28 | export class Game extends Phaser.Game { 29 | constructor(config: Phaser.Types.Core.GameConfig) { 30 | super(config); 31 | } 32 | } 33 | 34 | window.addEventListener('load', () => { 35 | const game = new Game(GameConfig); 36 | }); 37 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/interfaces/box.interface.ts: -------------------------------------------------------------------------------- 1 | export interface IBoxConstructor { 2 | scene: Phaser.Scene; 3 | content: any; 4 | x: number; 5 | y: number; 6 | texture: string; 7 | frame?: string | number; 8 | } 9 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/interfaces/brick.interface.ts: -------------------------------------------------------------------------------- 1 | export interface IBrickConstructor { 2 | scene: Phaser.Scene; 3 | value: number; 4 | x: number; 5 | y: number; 6 | texture: string; 7 | frame?: string | number; 8 | } 9 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/interfaces/collectible.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ICollectibleConstructor { 2 | scene: Phaser.Scene; 3 | points: number; 4 | x: number; 5 | y: number; 6 | texture: string; 7 | frame?: string | number; 8 | } 9 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/interfaces/platform.interface.ts: -------------------------------------------------------------------------------- 1 | export interface IPlatformConstructor { 2 | scene: Phaser.Scene; 3 | tweenProps: any; 4 | x: number; 5 | y: number; 6 | texture: string; 7 | frame?: string | number; 8 | } 9 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/interfaces/portal-destination.interface.ts: -------------------------------------------------------------------------------- 1 | export interface IPortalDestination { 2 | x: number; 3 | y: number; 4 | dir: string; 5 | } 6 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/interfaces/portal.interface.ts: -------------------------------------------------------------------------------- 1 | import { IPortalDestination } from './portal-destination.interface'; 2 | 3 | export interface IPortalConstructor { 4 | scene: Phaser.Scene; 5 | spawn: IPortalDestination; 6 | x: number; 7 | y: number; 8 | width?: number; 9 | height?: number; 10 | } 11 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/interfaces/sprite.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ISpriteConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/objects/collectible.ts: -------------------------------------------------------------------------------- 1 | import { ICollectibleConstructor } from '../interfaces/collectible.interface'; 2 | 3 | export class Collectible extends Phaser.GameObjects.Sprite { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | // variables 7 | private currentScene: Phaser.Scene; 8 | private points: number; 9 | 10 | constructor(aParams: ICollectibleConstructor) { 11 | super(aParams.scene, aParams.x, aParams.y, aParams.texture, aParams.frame); 12 | 13 | // variables 14 | this.currentScene = aParams.scene; 15 | this.points = aParams.points; 16 | this.initSprite(); 17 | this.currentScene.add.existing(this); 18 | } 19 | 20 | private initSprite() { 21 | // sprite 22 | this.setOrigin(0, 0); 23 | this.setFrame(0); 24 | 25 | // physics 26 | this.currentScene.physics.world.enable(this); 27 | this.body.setSize(8, 8); 28 | this.body.setAllowGravity(false); 29 | } 30 | 31 | update(): void {} 32 | 33 | public collected(): void { 34 | this.destroy(); 35 | this.currentScene.registry.values.score += this.points; 36 | this.currentScene.events.emit('scoreChanged'); 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/objects/platform.ts: -------------------------------------------------------------------------------- 1 | import { IPlatformConstructor } from '../interfaces/platform.interface'; 2 | 3 | export class Platform extends Phaser.GameObjects.Image { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | // variables 7 | private currentScene: Phaser.Scene; 8 | private tweenProps: any; 9 | 10 | constructor(aParams: IPlatformConstructor) { 11 | super(aParams.scene, aParams.x, aParams.y, aParams.texture, aParams.frame); 12 | 13 | // variables 14 | this.currentScene = aParams.scene; 15 | this.tweenProps = aParams.tweenProps; 16 | 17 | this.initImage(); 18 | this.initTween(); 19 | this.currentScene.add.existing(this); 20 | } 21 | 22 | private initImage(): void { 23 | // image 24 | this.setOrigin(0, 0); 25 | this.setFrame(0); 26 | 27 | // physics 28 | this.currentScene.physics.world.enable(this); 29 | this.body.setSize(24, 5); 30 | this.body.setAllowGravity(false); 31 | this.body.setImmovable(true); 32 | } 33 | 34 | private initTween(): void { 35 | this.currentScene.tweens.add({ 36 | targets: this, 37 | props: this.tweenProps, 38 | ease: 'Power0', 39 | yoyo: true, 40 | repeat: -1 41 | }); 42 | } 43 | 44 | update(): void {} 45 | } 46 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/objects/portal.ts: -------------------------------------------------------------------------------- 1 | import { IPortalConstructor } from '../interfaces/portal.interface'; 2 | import { IPortalDestination } from '../interfaces/portal-destination.interface'; 3 | 4 | export class Portal extends Phaser.GameObjects.Zone { 5 | body: Phaser.Physics.Arcade.Body; 6 | 7 | // variables 8 | private currentScene: Phaser.Scene; 9 | private portalDestinationForMario: IPortalDestination; 10 | 11 | public getPortalDestination(): IPortalDestination { 12 | return this.portalDestinationForMario; 13 | } 14 | 15 | constructor(aParams: IPortalConstructor) { 16 | super(aParams.scene, aParams.x, aParams.y, aParams.width, aParams.height); 17 | 18 | // variables 19 | this.currentScene = aParams.scene; 20 | this.portalDestinationForMario = aParams.spawn; 21 | 22 | this.initZone(); 23 | this.currentScene.add.existing(this); 24 | } 25 | 26 | private initZone() { 27 | this.setOrigin(0, 0); 28 | 29 | // physics 30 | this.currentScene.physics.world.enable(this); 31 | this.body.setSize(this.height, this.width); 32 | this.body.setOffset(0, 0); 33 | this.body.setAllowGravity(false); 34 | this.body.setImmovable(true); 35 | } 36 | 37 | update(): void {} 38 | } 39 | -------------------------------------------------------------------------------- /src/games/super-mario-land/src/scenes/menu-scene.ts: -------------------------------------------------------------------------------- 1 | export class MenuScene extends Phaser.Scene { 2 | private startKey: Phaser.Input.Keyboard.Key; 3 | private bitmapTexts: Phaser.GameObjects.BitmapText[] = []; 4 | 5 | constructor() { 6 | super({ 7 | key: 'MenuScene' 8 | }); 9 | } 10 | 11 | init(): void { 12 | this.startKey = this.input.keyboard.addKey( 13 | Phaser.Input.Keyboard.KeyCodes.S 14 | ); 15 | this.startKey.isDown = false; 16 | this.initGlobalDataManager(); 17 | } 18 | 19 | create(): void { 20 | this.add.image(0, 0, 'title').setOrigin(0, 0); 21 | 22 | this.bitmapTexts.push( 23 | this.add.bitmapText( 24 | this.sys.canvas.width / 2 - 22, 25 | 105, 26 | 'font', 27 | 'START', 28 | 8 29 | ) 30 | ); 31 | } 32 | 33 | update(): void { 34 | if (this.startKey.isDown) { 35 | this.scene.start('HUDScene'); 36 | this.scene.start('GameScene'); 37 | this.scene.bringToTop('HUDScene'); 38 | } 39 | } 40 | 41 | private initGlobalDataManager(): void { 42 | this.registry.set('time', 400); 43 | this.registry.set('level', 'level1'); 44 | this.registry.set('world', '1-1'); 45 | this.registry.set('worldTime', 'WORLD TIME'); 46 | this.registry.set('score', 0); 47 | this.registry.set('coins', 0); 48 | this.registry.set('lives', 2); 49 | this.registry.set('spawn', { x: 12, y: 44, dir: 'down' }); 50 | this.registry.set('marioSize', 'small'); 51 | } 52 | } 53 | -------------------------------------------------------------------------------- /src/games/super-mario-land/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/super-mario-land/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Super Mario Land', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/games/tank/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "tank", 3 | "version": "0.0.1", 4 | "description": "Tank for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/games/tank/src/assets/font/font.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/font/font.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/obstacles/barrel-grey-side-rust.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/obstacles/barrel-grey-side-rust.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/obstacles/barrel-grey-side.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/obstacles/barrel-grey-side.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/obstacles/barrel-grey-top.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/obstacles/barrel-grey-top.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/obstacles/barrel-red-side.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/obstacles/barrel-red-side.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/obstacles/barrel-red-top.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/obstacles/barrel-red-top.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/obstacles/tree-large.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/obstacles/tree-large.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/obstacles/tree-small.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/obstacles/tree-small.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/sprites/barrel-blue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/sprites/barrel-blue.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/sprites/barrel-red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/sprites/barrel-red.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/sprites/bullet-blue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/sprites/bullet-blue.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/sprites/bullet-red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/sprites/bullet-red.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/sprites/tank-blue.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/sprites/tank-blue.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/sprites/tank-red.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/sprites/tank-red.png -------------------------------------------------------------------------------- /src/games/tank/src/assets/tiles/tiles.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/games/tank/src/assets/tiles/tiles.png -------------------------------------------------------------------------------- /src/games/tank/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { GameScene } from './scenes/game-scene'; 3 | import { MenuScene } from './scenes/menu-scene'; 4 | 5 | export const GameConfig: Phaser.Types.Core.GameConfig = { 6 | title: 'Tank', 7 | url: 'https://github.com/digitsensitive/phaser3-typescript', 8 | version: '0.0.1', 9 | width: 1600, 10 | height: 1200, 11 | zoom: 0.6, 12 | type: Phaser.AUTO, 13 | parent: 'game', 14 | scene: [BootScene, MenuScene, GameScene], 15 | input: { 16 | keyboard: true 17 | }, 18 | physics: { 19 | default: 'arcade', 20 | arcade: { 21 | gravity: { x: 0, y: 0 } 22 | } 23 | }, 24 | backgroundColor: '#000000', 25 | render: { antialias: true } 26 | }; 27 | -------------------------------------------------------------------------------- /src/games/tank/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/games/tank/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/games/tank/src/interfaces/bullet.interface.ts: -------------------------------------------------------------------------------- 1 | export interface IBulletConstructor { 2 | scene: Phaser.Scene; 3 | rotation: number; 4 | x: number; 5 | y: number; 6 | texture: string; 7 | frame?: string | number; 8 | } 9 | -------------------------------------------------------------------------------- /src/games/tank/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface IImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/games/tank/src/objects/bullet.ts: -------------------------------------------------------------------------------- 1 | import { IBulletConstructor } from '../interfaces/bullet.interface'; 2 | 3 | export class Bullet extends Phaser.GameObjects.Image { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | private bulletSpeed: number; 7 | 8 | constructor(aParams: IBulletConstructor) { 9 | super(aParams.scene, aParams.x, aParams.y, aParams.texture); 10 | 11 | this.rotation = aParams.rotation; 12 | this.initImage(); 13 | this.scene.add.existing(this); 14 | } 15 | 16 | private initImage(): void { 17 | // variables 18 | this.bulletSpeed = 1000; 19 | 20 | // image 21 | this.setOrigin(0.5, 0.5); 22 | this.setDepth(2); 23 | 24 | // physics 25 | this.scene.physics.world.enable(this); 26 | this.scene.physics.velocityFromRotation( 27 | this.rotation - Math.PI / 2, 28 | this.bulletSpeed, 29 | this.body.velocity 30 | ); 31 | } 32 | 33 | update(): void {} 34 | } 35 | -------------------------------------------------------------------------------- /src/games/tank/src/objects/obstacles/obstacle.ts: -------------------------------------------------------------------------------- 1 | import { IImageConstructor } from '../../interfaces/image.interface'; 2 | 3 | export class Obstacle extends Phaser.GameObjects.Image { 4 | body: Phaser.Physics.Arcade.Body; 5 | 6 | constructor(aParams: IImageConstructor) { 7 | super(aParams.scene, aParams.x, aParams.y, aParams.texture); 8 | 9 | this.initImage(); 10 | this.scene.add.existing(this); 11 | } 12 | 13 | private initImage(): void { 14 | // image 15 | this.setOrigin(0, 0); 16 | 17 | // physics 18 | this.scene.physics.world.enable(this); 19 | this.body.setImmovable(true); 20 | } 21 | 22 | update(): void {} 23 | } 24 | -------------------------------------------------------------------------------- /src/games/tank/src/scenes/menu-scene.ts: -------------------------------------------------------------------------------- 1 | export class MenuScene extends Phaser.Scene { 2 | private startKey: Phaser.Input.Keyboard.Key; 3 | private bitmapTexts: Phaser.GameObjects.BitmapText[] = []; 4 | 5 | constructor() { 6 | super({ 7 | key: 'MenuScene' 8 | }); 9 | } 10 | 11 | init(): void { 12 | this.startKey = this.input.keyboard.addKey( 13 | Phaser.Input.Keyboard.KeyCodes.S 14 | ); 15 | this.startKey.isDown = false; 16 | } 17 | 18 | create(): void { 19 | this.bitmapTexts.push( 20 | this.add.bitmapText( 21 | this.sys.canvas.width / 2 - 120, 22 | this.sys.canvas.height / 2, 23 | 'font', 24 | 'PRESS S TO PLAY', 25 | 30 26 | ) 27 | ); 28 | 29 | this.bitmapTexts.push( 30 | this.add.bitmapText( 31 | this.sys.canvas.width / 2 - 120, 32 | this.sys.canvas.height / 2 - 100, 33 | 'font', 34 | 'TANK', 35 | 100 36 | ) 37 | ); 38 | } 39 | 40 | update(): void { 41 | if (this.startKey.isDown) { 42 | this.scene.start('GameScene'); 43 | } 44 | } 45 | } 46 | -------------------------------------------------------------------------------- /src/games/tank/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/games/tank/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Tank', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /src/patterns/behavioral-design-patterns/command/command.interface.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * @author Digitsensitive 3 | * @copyright 2019 Digitsensitive 4 | * @description Command Interface 5 | * Declares a single execution method 6 | * @license Digitsensitive 7 | */ 8 | 9 | export interface Command { 10 | execute(): void; 11 | } 12 | -------------------------------------------------------------------------------- /src/patterns/behavioral-design-patterns/command/gameobject.ts: -------------------------------------------------------------------------------- 1 | /** 2 | * @author Digitsensitive 3 | * @copyright 2019 Digitsensitive 4 | * @description Design patterns: Behavioral design pattern - Command 5 | * Game Object 6 | * @license Digitsensitive 7 | */ 8 | 9 | export class GameObject extends Phaser.GameObjects.Image { 10 | constructor(params) { 11 | super(params.scene, params.x, params.y, params.key); 12 | 13 | this.initImage(); 14 | 15 | this.scene.add.existing(this); 16 | } 17 | 18 | private initImage(): void { 19 | this.setOrigin(0, 0); 20 | } 21 | 22 | public shoot(): void {} 23 | public updatePosition(tile: Phaser.Tilemaps.Tile): void {} 24 | } 25 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "factory-method", 3 | "version": "0.0.1", 4 | "description": "Factory Method for Phaser 3 in TypeScript", 5 | "keywords": [], 6 | "scripts": { 7 | "build-dev": "webpack --mode development", 8 | "build-prod": "webpack --mode production", 9 | "serve-dev": "webpack --mode development && webpack serve --mode development" 10 | }, 11 | "devDependencies": { 12 | "@types/node": "20.11.25", 13 | "@types/webpack": "5.28.5", 14 | "copy-webpack-plugin": "12.0.2", 15 | "expose-loader": "5.0.0", 16 | "html-webpack-plugin": "5.6.0", 17 | "ts-loader": "9.5.1", 18 | "ts-node": "10.9.2", 19 | "typescript": "5.4.2", 20 | "webpack": "5.90.3", 21 | "webpack-cli": "5.1.4", 22 | "webpack-dev-server": "5.0.2" 23 | }, 24 | "dependencies": { 25 | "phaser": "3.80.1" 26 | }, 27 | "repository": { 28 | "type": "git", 29 | "url": "git+https://github.com/digitsensitive/phaser3-typescript.git" 30 | }, 31 | "author": { 32 | "name": "digitsensitive", 33 | "email": "digit.sensitivee@gmail.com" 34 | }, 35 | "license": "MIT", 36 | "bugs": { 37 | "url": "https://github.com/digitsensitive/phaser3-typescript/issues" 38 | }, 39 | "homepage": "https://github.com/digitsensitive/phaser3-typescript#readme" 40 | } 41 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/assets/font/pcsenior.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/patterns/creational-design-patterns/factory-method/src/assets/font/pcsenior.png -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/assets/images/enemy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/digitsensitive/phaser3-typescript/c7d303ad59127442655a56f0c428e4f3c039f621/src/patterns/creational-design-patterns/factory-method/src/assets/images/enemy.png -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/assets/pack.json: -------------------------------------------------------------------------------- 1 | { 2 | "preload": { 3 | "files": [ 4 | { 5 | "type": "image", 6 | "key": "enemy", 7 | "url": "./assets/images/enemy.png" 8 | }, 9 | { 10 | "type": "bitmapFont", 11 | "key": "font", 12 | "textureURL": "./assets/font/pcsenior.png", 13 | "fontDataURL": "./assets/font/pcsenior.fnt" 14 | } 15 | ] 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/config.ts: -------------------------------------------------------------------------------- 1 | import { BootScene } from './scenes/boot-scene'; 2 | import { FactoryMethodScene } from './scenes/factory-method-scene'; 3 | import { SimpleFactoryScene } from './scenes/simple-factory-scene'; 4 | 5 | export const GameConfig: Phaser.Types.Core.GameConfig = { 6 | title: 'Factory Method', 7 | url: 'https://github.com/digitsensitive/phaser3-typescript', 8 | version: '0.0.1', 9 | width: 160, 10 | height: 144, 11 | zoom: 4, 12 | type: Phaser.AUTO, 13 | parent: 'game', 14 | scene: [BootScene, SimpleFactoryScene, FactoryMethodScene], 15 | backgroundColor: '#32484f', 16 | render: { pixelArt: true, antialias: false } 17 | }; 18 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/game.ts: -------------------------------------------------------------------------------- 1 | import 'phaser'; 2 | import { GameConfig } from './config'; 3 | 4 | export class Game extends Phaser.Game { 5 | constructor(config: Phaser.Types.Core.GameConfig) { 6 | super(config); 7 | } 8 | } 9 | 10 | window.addEventListener('load', () => { 11 | const game = new Game(GameConfig); 12 | }); 13 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | <%= htmlWebpackPlugin.options.title %> 8 | 9 | 10 |
11 | 12 | 13 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/interfaces/image.interface.ts: -------------------------------------------------------------------------------- 1 | export interface ImageConstructor { 2 | scene: Phaser.Scene; 3 | x: number; 4 | y: number; 5 | texture: string | Phaser.Textures.Texture; 6 | frame?: string | number; 7 | } 8 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/objects/bobbie.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | import { Enemy } from './enemy'; 3 | 4 | export class Bobbie extends Enemy { 5 | constructor(params: ImageConstructor) { 6 | super(params); 7 | this.dexterity = 4; 8 | this.intelligence = 4; 9 | this.strength = 7; 10 | this.setTint(0x32a881); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/objects/enemy.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | 3 | export class Enemy extends Phaser.GameObjects.Image { 4 | protected dexterity: number; 5 | protected intelligence: number; 6 | protected strength: number; 7 | 8 | constructor(params: ImageConstructor) { 9 | super(params.scene, params.x, params.y, params.texture, params.frame); 10 | this.initImage(); 11 | this.scene.add.existing(this); 12 | } 13 | 14 | private initImage(): void { 15 | this.setScale(2); 16 | this.setOrigin(0.5, 0.5); 17 | } 18 | 19 | public getDexterity(): number { 20 | return this.dexterity; 21 | } 22 | 23 | public getIntelligence(): number { 24 | return this.intelligence; 25 | } 26 | 27 | public getStrength(): number { 28 | return this.strength; 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/objects/kanye.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | import { Enemy } from './enemy'; 3 | 4 | export class Kanye extends Enemy { 5 | constructor(params: ImageConstructor) { 6 | super(params); 7 | this.dexterity = 8; 8 | this.intelligence = 2; 9 | this.strength = 4; 10 | this.setTint(0x3495eb); 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/objects/wallace.ts: -------------------------------------------------------------------------------- 1 | import { ImageConstructor } from '../interfaces/image.interface'; 2 | import { Enemy } from './enemy'; 3 | 4 | export class Wallace extends Enemy { 5 | constructor(params: ImageConstructor) { 6 | super(params); 7 | this.dexterity = 3; 8 | this.intelligence = 8; 9 | this.strength = 4; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/src/scenes/simple-factory-scene.ts: -------------------------------------------------------------------------------- 1 | import { SimpleEnemyFactory } from '../services/simple-enemy-factory'; 2 | import { Enemy } from '../objects/enemy'; 3 | 4 | export class SimpleFactoryScene extends Phaser.Scene { 5 | private enemyFactory: SimpleEnemyFactory; 6 | private enemies: Phaser.GameObjects.Group; 7 | 8 | constructor() { 9 | super({ 10 | key: 'SimpleFactoryScene' 11 | }); 12 | } 13 | 14 | init(): void { 15 | this.enemyFactory = new SimpleEnemyFactory(this); 16 | 17 | this.enemies = this.add.group({ 18 | runChildUpdate: true 19 | }); 20 | } 21 | 22 | create(): void { 23 | this.enemies.add( 24 | this.enemyFactory.create({ type: 'bobbie', x: 20, y: 20 }) 25 | ); 26 | this.enemies.add( 27 | this.enemyFactory.create({ type: 'wallace', x: 20, y: 60 }) 28 | ); 29 | this.enemies.add( 30 | this.enemyFactory.create({ type: 'kanye', x: 20, y: 100 }) 31 | ); 32 | 33 | this.enemies.getChildren().forEach((enemy: Enemy) => { 34 | this.add.bitmapText( 35 | enemy.x + 20, 36 | enemy.y - 3, 37 | 'font', 38 | 'D:' + 39 | enemy.getDexterity() + 40 | ' ' + 41 | 'I:' + 42 | enemy.getIntelligence() + 43 | ' ' + 44 | 'S:' + 45 | enemy.getStrength(), 46 | 8 47 | ); 48 | }, this); 49 | } 50 | } 51 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES6", 4 | "module": "CommonJS", 5 | "moduleResolution": "node", 6 | "noImplicitAny": true, 7 | "strict": false, 8 | "esModuleInterop": true // webpack.config.ts 9 | }, 10 | "include": ["src/**/*"], 11 | "exclude": ["node_modules"] 12 | } 13 | -------------------------------------------------------------------------------- /src/patterns/creational-design-patterns/factory-method/webpack.config.ts: -------------------------------------------------------------------------------- 1 | import path from 'path'; 2 | import webpack from 'webpack'; 3 | import 'webpack-dev-server'; 4 | 5 | import CopyWebpackPlugin from 'copy-webpack-plugin'; 6 | import HtmlWebpackPlugin from 'html-webpack-plugin'; 7 | 8 | const config: webpack.Configuration = { 9 | context: path.resolve(__dirname, 'src'), 10 | entry: './game.ts', 11 | output: { 12 | path: path.resolve(__dirname, 'dist'), 13 | filename: '[name].[chunkhash].js', 14 | chunkFilename: '[name].[chunkhash].js', 15 | clean: true 16 | }, 17 | module: { 18 | rules: [ 19 | { 20 | test: /\.ts$/, 21 | include: path.resolve(__dirname, 'src'), 22 | loader: 'ts-loader' 23 | } 24 | ] 25 | }, 26 | devServer: { 27 | static: path.join(__dirname, 'dist') 28 | }, 29 | resolve: { 30 | extensions: ['.ts', '.js'] 31 | }, 32 | plugins: [ 33 | new CopyWebpackPlugin({ 34 | patterns: [ 35 | { 36 | from: 'assets', 37 | to: 'assets' 38 | } 39 | ] 40 | }), 41 | new HtmlWebpackPlugin({ 42 | template: path.resolve(__dirname, 'src/index.html'), 43 | title: 'Factory method', 44 | inject: 'head' 45 | }) 46 | ] 47 | }; 48 | 49 | export default config; 50 | -------------------------------------------------------------------------------- /yarn.lock: -------------------------------------------------------------------------------- 1 | # THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. 2 | # yarn lockfile v1 3 | 4 | 5 | prettier@3.2.5: 6 | version "3.2.5" 7 | resolved "https://registry.yarnpkg.com/prettier/-/prettier-3.2.5.tgz#e52bc3090586e824964a8813b09aba6233b28368" 8 | integrity sha512-3/GWa9aOC0YeD7LUfvOG2NiDyhOWRvt1k+rcKhOuYnMY24iiCphgneUfJDyFXd6rZCAnuLBv6UeAULtrhT/F4A== 9 | --------------------------------------------------------------------------------