Skip to content

Latest commit

 

History

History
129 lines (93 loc) · 4.73 KB

README.md

File metadata and controls

129 lines (93 loc) · 4.73 KB

Match Three Game

Build Status GitHub GitHub code size in bytes

An elimination game that drawed by Canvas and implemented using TypeScript.
The game play design and some of the resources are from Gardenscapes.

English | 简体中文

🎮 Game online

https://vermouth1995.github.io/MatchThreeGame/

✨ Features

  • 🎀 Beautiful page, smooth game experience.
  • 🌼 Written in TypeScript with predictable static types.
  • 🏅 Multiple rendering methods support capability.
  • ⚙️ Compile with gulp, full link development.
  • 🏆 Powerful level customization in every detail.
  • 🤳 Support for mobile terminal.

🔨 Debug

  • run npm i
  • run npm run build
  • open html file(/dist/index.html) in browser

💅 Code Foramt

  • run npm run format

🔖 Directory Structure

concept -- Basic tools (tool concept class content)

concept
├─ coordinate                         -- Coordinate and coordinate operation
   ├─ event                           -- Record movement events
   ├─ coordinate_adaptor              -- Coordinate adaptor
   ├─ coordinate_dynamic              -- Dynamic coordinate
   ├─ coordinate_value                -- Common coordinate
   ├─ coordinate                      -- Coordinate interface
   └─ locus                           -- Record the moving state and coordinate track
├─ linked_list                        -- Linked list
├─ listener                           -- Listening tools to manage listening events
├─ once                               -- Manages the invocation of a series of callback functions
├─ style                              -- Style classes, such as colors, fonts, and so on
└─ random_weight                      -- Random access with weights

engine -- Game engine (core elements and concepts in game)

engine
├─ birth                              -- The generation of eliminable elements
├─ board                              -- Game board
├─ cell                               -- Game cell
├─ goal                               -- Game goal
├─ item                               -- Eliminated elements
├─ sacrifice                          -- Rule of elimination
├─ puzzle_keeper                      -- The object that holds the real rendering block
└─ score                              -- Game steps/Score management

game -- Game logic (including score calculation, relationship between levels, etc.)

game
├─ game                               -- Instance of game logic
├─ level_creator                      -- Level generator
├─ level_data                         -- Level data interface
├─ level                              -- Level implementation
└─ message                            -- Message

level -- Level (level content setting)

level
├─ 1                                  -- Level 1
├─ 2                                  -- Level 2
├─ 3                                  -- Level 3
└─ ...                                -- Level ...

main -- Project entrance

main
├─ resource                           -- Game resources
└─ index                              -- Entrance

platform -- Rendering platform

platform
├─ canvas                             -- canvas
└─ webgl                              -- webgl

render -- Image rendering

render
├─ atom                               -- Minimum render unit
├─ puzzle                             -- Real rendering block
├─ render_adapter                     -- Render adapter
├─ render_locus                       -- Trace nodes of the rendering tree
├─ render_position                    -- Nodes of the rendering tree
└─ render                             -- Render interface

🚧 TODO List

  • Rerender when window onResize
  • onTouch realization
  • Level selection
  • Style optimization
  • Automatic prompt
  • Bomb appearance weight can be set
  • Level of dwarf

👩‍💻 Maintainer

🤝 Contributors

⏰ License

MIT © Vermouth1995