0.1.5 • Published 2 years ago
nt-number-puzzle v0.1.5
nt-number-puzzle
nt-number-puzzle is a module that implements the retro game numeric puzzle as vue (vue components). Why don't you try to provide simple entertainment for users when developing a personal project or use it for users who are bored while loading long and long data?
nt-number-puzzle은 레트로 게임인 숫자 퍼즐을 vue(vue components)로 구현한 모듈입니다. 개인프로젝트 개발 시 사용자를 위한 간단한 즐길거리를 제공하려 하거나 길고 긴 데이터 로딩 중 심심한 사용자들을 위해 사용해 보는것은 어떨까요??
Demo
nt-number-puzzle demo page.
Installation
$ npm install nt-number-puzzle —-saveUsage
import NtNumberPuzzle from 'nt-number-puzzle';
import 'nt-number-puzzle/number-puzzle.css';
//template
//user`s source
...
<NtNumberPuzzle
:grid-size="4" // default: 4
:cell-size="4" // default: 4(rem)
label-text = "..."
/>Props
gridSize: number ▶︎
4
Set the vertical/horizontal size of tile grid.cellSize: number ▶︎
4
Setting the size of tiles(unit rem).labelText: string ▶︎
''
Setting letters to display tiles.
How to play
- Click the
STARTbutton to start game. - Click to move up, down, left, and right tiles of empty tiles.
- Place the tiles in order.
- When all the tiles are placed in order, the game ends.
- You can specify the tiles to move by pressing the
top,bottom,left, andrightkeys on the keyboard. - You can move an active tile by pressing the
spacekey. - Press the
ctrlkey to display the order of the tiles. - If you click the
RETRYbutton during the game, the tiles will mix and restart the game.