Minesweeper - codetour
This commit is contained in:
Pieter Heemeryck
parent
e8faf752c6
commit
037b195232
|
|
@ -0,0 +1,196 @@
|
|||
{
|
||||
"title": "minesweeper-walkthrough",
|
||||
"steps": [
|
||||
{
|
||||
"file": "samples/react-minesweeper/package.json",
|
||||
"description": "Minimal path to awesomeness:\r\n\r\n>> cd .\\samples\\react-minesweeper\r\n\r\n>> npm install\r\n\r\n>> gulp serve\r\n",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 14,
|
||||
"character": 4
|
||||
},
|
||||
"end": {
|
||||
"line": 14,
|
||||
"character": 16
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Tile/Tile.tsx",
|
||||
"description": "Tile rendering",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 32,
|
||||
"character": 7
|
||||
},
|
||||
"end": {
|
||||
"line": 38,
|
||||
"character": 13
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Tile/Tile.module.scss",
|
||||
"description": "Numbers are coloured like in the original game!",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 10,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 45,
|
||||
"character": 2
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Tile/Tile.module.scss",
|
||||
"description": "Mines & flags can have additional styling:\r\n- The background of the mine tile that was clicked on turns red\r\n- Flags that were incorrect turn red as well",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 47,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 67,
|
||||
"character": 2
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/models/TileInfo.ts",
|
||||
"description": "Each tile has these properties",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 5,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 10,
|
||||
"character": 2
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/IMinesweeperState.ts",
|
||||
"description": "State of the main component",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 7,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 17,
|
||||
"character": 4
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"description": "Render main component\r\n- Game info header\r\n- Grid\r\n- High score callout",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 52,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 56,
|
||||
"character": 13
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"line": 111,
|
||||
"description": "Events:\r\n- Left / right click\r\n- Toggle mine / flag mode\r\n- Select difficulty\r\n- Toggle high score\r\n- Reset"
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"description": "Tile click events:\r\n- Chording\r\n- Mine / flag mode: interchange meaning left / right click",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 113,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 137,
|
||||
"character": 4
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"description": "State initialization.",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 33,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 43,
|
||||
"character": 7
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"line": 201,
|
||||
"description": "- [Initialize grid][#12]\r\n- [Discover][#13]\r\n- [Plant flag][#14]\r\n- [Chording][#15]\r\n- [Traverse empty][#16]\r\n- [Get surrounding mines / flags][#17]\r\n- [Player wins / loses][#18]"
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"line": 203,
|
||||
"description": "Randomize the mines in the grid\r\n\r\nBack to [game logic overview][#11]"
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"line": 227,
|
||||
"description": "Game logic: discover\r\n\r\nBack to [game logic overview][#11]"
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"line": 288,
|
||||
"description": "Game logic: plant flag\r\n\r\nBack to [game logic overview][#11]"
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"line": 320,
|
||||
"description": "Game logic: chording\r\n\r\nBack to [game logic overview][#11]"
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"line": 342,
|
||||
"description": "Game logic: traverse empty tiles\r\n- Recursive\r\n\r\nBack to [game logic overview][#11]"
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"description": "Game logic: get surrounding mines / flags\r\n- Using the 8 delta coordinates\r\n\r\nBack to [game logic overview][#11]",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 361,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 389,
|
||||
"character": 4
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "samples/react-minesweeper/src/webparts/minesweeper/components/Grid/Minesweeper.tsx",
|
||||
"line": 412,
|
||||
"description": "Game logic: player wins / loses\r\n\r\nBack to [game logic overview][#11]",
|
||||
"selection": {
|
||||
"start": {
|
||||
"line": 412,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 463,
|
||||
"character": 4
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
"ref": "master"
|
||||
}
|
||||
Loading…
Reference in New Issue