stub Cell component; add css loader
This commit is contained in:
parent
e123ae201d
commit
057a0fdd09
10 changed files with 4304 additions and 15 deletions
3
.babelrc
Normal file
3
.babelrc
Normal file
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"presets": ["@babel/preset-env"]
|
||||
}
|
1
dist/app.bundle.js
vendored
Normal file
1
dist/app.bundle.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dist/index.html
vendored
Normal file
1
dist/index.html
vendored
Normal file
|
@ -0,0 +1 @@
|
|||
<!doctype html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Game of Life</title></head><body><h1>Game of Life</h1><aside id="controls"></aside><main id="game-field"></main><script src="app.bundle.js"></script></body></html>
|
4230
package-lock.json
generated
4230
package-lock.json
generated
File diff suppressed because it is too large
Load diff
15
package.json
15
package.json
|
@ -4,8 +4,8 @@
|
|||
"description": "",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "webpack --mode=production",
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"build": "webpack --mode=production --config webpack.prod.js",
|
||||
"test": "jest",
|
||||
"start": "webpack-dev-server --open --config webpack.dev.js"
|
||||
},
|
||||
"author": "",
|
||||
|
@ -13,15 +13,26 @@
|
|||
"devDependencies": {
|
||||
"@babel/core": "^7.9.6",
|
||||
"@babel/preset-env": "^7.9.6",
|
||||
"babel-jest": "^26.0.1",
|
||||
"babel-loader": "^8.1.0",
|
||||
"clean-webpack-plugin": "^3.0.0",
|
||||
"css-loader": "^3.5.3",
|
||||
"html-loader": "^1.1.0",
|
||||
"html-webpack-plugin": "^4.3.0",
|
||||
"jest": "^26.0.1",
|
||||
"style-loader": "^1.2.1",
|
||||
"webpack": "^4.43.0",
|
||||
"webpack-cli": "^3.3.11",
|
||||
"webpack-dev-server": "^3.11.0",
|
||||
"webpack-merge": "^4.2.2"
|
||||
},
|
||||
"jest": {
|
||||
"transform": {
|
||||
".*": "<rootDir>/node_modules/babel-jest"
|
||||
},
|
||||
"testDirectoryName": "src/test",
|
||||
"moduleFileExtensions": [
|
||||
"js"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
10
src/components/Cell.js
Normal file
10
src/components/Cell.js
Normal file
|
@ -0,0 +1,10 @@
|
|||
class Cell {
|
||||
constructor() {
|
||||
this.living = false;
|
||||
}
|
||||
toggleLiving() {
|
||||
this.living = !this.living;
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = Cell;
|
25
src/index.js
25
src/index.js
|
@ -1,2 +1,23 @@
|
|||
require("./styles/reset.css");
|
||||
(() => console.log("hello world!"))();
|
||||
import css from "./styles/reset.css";
|
||||
require("./components/Cell")(() => console.log("hello world!"))();
|
||||
|
||||
// controls
|
||||
// -- state=idle ?
|
||||
// ---- rewind runs through gameHistory to current state - 1 step
|
||||
// ---- forward adds 1 step to game
|
||||
// ---- play sets state to playing, each cell runs through logic below with timeout = speed
|
||||
// ---- speed sets timeout
|
||||
// ---- reset restores initial gameState
|
||||
// ------ form
|
||||
// -------- type to load handles
|
||||
// ---------- dynamic autofill after x characters (select els)
|
||||
// -------- "seed" to submit handle and request contribCalender
|
||||
|
||||
// game-board
|
||||
// -- sections of board
|
||||
// ---- cells
|
||||
// ------ state=idle ? onClick=changeCell : onClick=()=>{}
|
||||
// ------ state=playing && cell=live ? dispatchToNeighbors(liveNeighbors++)
|
||||
// -------- when playing all live cells dispatch, then all cells determine life
|
||||
// -- load sections of board
|
||||
// ---- onDispatch from neighboring section load square around all sections (eg 1x1 dispatch loads frame of sections around 1x1 to form new 3x3 )
|
||||
|
|
|
@ -24,11 +24,6 @@ time, mark, audio, video {
|
|||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/* make sure to set some focus styles for accessibility */
|
||||
:focus {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
|
|
26
src/test/Cell.test.js
Normal file
26
src/test/Cell.test.js
Normal file
|
@ -0,0 +1,26 @@
|
|||
const Cell = require("../components/Cell");
|
||||
|
||||
describe("Cell functionality", () => {
|
||||
test("dispatch toggleLiving state should mark living cell dead", () => {
|
||||
const cell = new Cell();
|
||||
cell.toggleLiving();
|
||||
expect(cell.living).toEqual(true);
|
||||
});
|
||||
test.todo("dispatch toggleLiving state should mark dead cell living");
|
||||
test.todo(
|
||||
"dispatch add Live Neighbor should increment live neighbors property"
|
||||
);
|
||||
test.todo(
|
||||
"dispatch setLiving should determine life based on neighbors (for living cells)"
|
||||
);
|
||||
const livingFromLivingStates = new Array(8).map((_, i) =>
|
||||
i === 2 || i === 3 ? true : false
|
||||
);
|
||||
test.todo(
|
||||
"dispatch setLiving should determine life based on neighbors (for dead cells)"
|
||||
);
|
||||
const livingFromDeadStates = new Array(8).map((_, i) =>
|
||||
i === 3 ? true : false
|
||||
);
|
||||
test.todo("dispatch setLiving should reset live neighbors");
|
||||
});
|
|
@ -25,9 +25,6 @@ module.exports = {
|
|||
exclude: /node_modules/,
|
||||
use: {
|
||||
loader: "babel-loader",
|
||||
options: {
|
||||
presets: ["@babel/preset-env"],
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
Loading…
Reference in a new issue