Home Explore Help
Sign In
brwong
/
conway
Watch 1
Star 0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

initial setup; simple board and cell components

Brandon Wong 8 years ago
commit
dfeee4d811
10 changed files with 211 additions and 0 deletions
Split View Show Diff Stats
  1. 3 0
      .babelrc
  2. 6 0
      .gitignore
  3. 12 0
      index.html
  4. 15 0
      life.css
  5. 32 0
      package.json
  6. 52 0
      src/main.js
  7. 35 0
      src/processor.js
  8. 26 0
      src/rules.js
  9. 12 0
      test/processor.js
  10. 18 0
      test/rules.js

+ 3 - 0
.babelrc
View File 

@@ -0,0 +1,3 @@
 
+{
 
+  "presets": ["es2015", "react"]
 
+}

+ 6 - 0
.gitignore
View File 

@@ -0,0 +1,6 @@
 
+.idea
 
+node_modules
 
+build
 
+test-build
 
+npm-debug*
 
+*.swp

+ 12 - 0
index.html
View File 

@@ -0,0 +1,12 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <title>Conway's Game of Life</title>
 
+    <link rel="stylesheet" href="life.css">
 
+</head>
 
+<body>
 
+    <div id="board"></div>
 
+    <script src="build/bundle.js"></script>
 
+</body>
 
+</html>

+ 15 - 0
life.css
View File 

@@ -0,0 +1,15 @@
 
+
 
+.cell {
 
+    width:9px;
 
+    height:9px;
 
+    position:absolute;
 
+    top:50px;
 
+    left:100px;
 
+    background-color:beige;
 
+    border:1px solid brown;
 
+}
 
+
 
+
 
+
 
+
 
+

+ 32 - 0
package.json
View File 

@@ -0,0 +1,32 @@
 
+{
 
+  "name": "conway",
 
+  "version": "0.1.0",
 
+  "scripts": {
 
+    "test": "echo \"Error: no test specified\" && exit 1",
 
+    "postinstall": "npm run compile",
 
+    "compile-test": "babel test --out-dir test-build",
 
+    "compile-src": "babel src --out-dir build",
 
+    "compile-frontend": "webpack src/main.js build/bundle.js --module-bind 'js=babel-loader'",
 
+    "compile": "npm run compile-src; npm run compile-test; npm run compile-frontend",
 
+    "watch": "nodemon --watch src --watch test --exec \"npm run compile --silent\"",
 
+    "serverwatch": "nodemon --watch src --watch test --exec \"npm run compile --silent && node build/server.js\"",
 
+    "testwatch": "nodemon --watch src --watch test --exec \"npm run compile --silent && npm test\""
 
+  },
 
+  "private": true,
 
+  "dependencies": {
 
+    "babel-cli": "^6.6.5",
 
+    "babel-core": "^6.7.7",
 
+    "babel-loader": "^6.2.4",
 
+    "babel-preset-es2015": "^6.6.0",
 
+    "babel-preset-react": "^6.5.0",
 
+    "immutable": "^3.8.1",
 
+    "react": "^15.0.1",
 
+    "react-dom": "^15.0.1",
 
+    "webpack": "^1.13.0"
 
+  },
 
+  "devDependencies": {
 
+    "blue-tape": "^0.2.0",
 
+    "nodemon": "^1.9.1",
 
+    "tape": "^4.5.1"
 
+  }
 
+}

+ 52 - 0
src/main.js
View File 

@@ -0,0 +1,52 @@
 
+
 
+import React from 'react';
 
+import ReactDOM from 'react-dom';
 
+
 
+
 
+const Cell = React.createClass({
 
+    render() {
 
+        return <div className="cell" style={{top:this.props.y, left:this.props.x}}></div>;
 
+    },
 
+});
 
+
 
+
 
+const Board = React.createClass({
 
+    render() {
 
+        let nh = this.props.settings.height || 10,
 
+            nw = this.props.settings.width || 10,
 
+            ot = this.props.settings.offsetTop || 0,
 
+            ol = this.props.settings.offsetLeft || 0,
 
+            cells = [];
 
+        for( let i = 0; i < nh; i++ ) {
 
+            for( let j = 0; j < nw; j++ ) {
 
+                let x = (((j % nw) * 10) + ol) + 'px',
 
+                    y = ((i * 10) + ot) + 'px';
 
+                cells.push( <Cell x={x} y={y} /> );
 
+            }
 
+        }
 
+
 
+        return (
 
+            <div>
 
+                {cells}
 
+            </div>
 
+        );
 
+    },
 
+});
 
+
 
+
 
+
 
+
 
+let settings = {
 
+    offsetTop:40,
 
+    offsetLeft:10,
 
+    width:50,
 
+    height:20
 
+};
 
+
 
+ReactDOM.render(
 
+    <Board settings={settings} />,
 
+    document.getElementById('board')
 
+);
 
+
 
+
 
+

+ 35 - 0
src/processor.js
View File 

@@ -0,0 +1,35 @@
 
+
 
+import Immutable from 'Immutable';
 
+import processCell from './rules.js';
 
+
 
+
 
+export default function process(state) {
 
+    return state.map(function procRow(row, y) {
 
+        return row.map(function procCells(cell, x) {
 
+            const xb = x - 1,
 
+                xa = x + a,
 
+                yb = y - 1,
 
+                ya = y + 1;
 
+            return processCell([
 
+                [
 
+                    (state.get(yb).get(xb) || 0),
 
+                    (state.get(yb).get(x) || 0),
 
+                    (state.get(yb).get(xa) || 0)
 
+                ],
 
+                [
 
+                    (state.get(y).get(xb) || 0),
 
+                    (state.get(y).get(x) || 0),
 
+                    (state.get(y).get(xa) || 0)
 
+                ],
 
+                [
 
+                    (state.get(ya).get(xb) || 0),
 
+                    (state.get(ya).get(x) || 0),
 
+                    (state.get(ya).get(xa) || 0)
 
+                ]
 
+            ]);
 
+        });
 
+    });
 
+};
 
+
 
+
 
+

+ 26 - 0
src/rules.js
View File 

@@ -0,0 +1,26 @@
 
+
 
+
 
+export default function processCell(neighbourhood) {
 
+    const livingNeighbours = neighbourhood.reduce(function countRows(acc, row, ind) {
 
+        return acc + row.reduce((s, c, i) => (!(ind === 1 && i === 1) ? s+c : s));
 
+    }, 0);
 
+
 
+    if( neighbourhood[1][1] ) {
 
+        if( livingNeighbours < 2 ) {
 
+            neighbourhood[1][1] = 0;
 
+        }
 
+        else if( livingNeighbours > 3 ) {
 
+            neighbourhood[1][1] = 0;
 
+        }
 
+    }
 
+    else {
 
+        if( livingNeighbours === 3 ) {
 
+            neighbourhood[1][1] = 1;
 
+        }
 
+    }
 
+
 
+    return neighbourhood;
 
+}
 
+
 
+
 
+

+ 12 - 0
test/processor.js
View File 

@@ -0,0 +1,12 @@
 
+
 
+import process from '../build/processor.js';
 
+import Immutable from 'immutable';
 
+import tape from 'tape';
 
+
 
+
 
+tape.test('processor', function testProcessor(t) {
 
+    t.end();
 
+});
 
+
 
+
 
+

+ 18 - 0
test/rules.js
View File 

@@ -0,0 +1,18 @@
 
+
 
+import processCell from '../build/rules.js';
 
+import tape from 'tape';
 
+
 
+
 
+tape.test('various scenarios', function testRules(t) {
 
+    t.equal(processCell([[1,1,1], [0,0,0], [0,0,0]])[1][1], 1, 'test 1');
 
+    t.equal(processCell([[0,0,0], [1,1,1], [0,0,0]])[1][1], 1, 'test 2');
 
+    t.equal(processCell([[0,0,0], [1,1,1], [0,1,0]])[1][1], 1, 'test 3');
 
+    t.equal(processCell([[0,0,0], [1,0,1], [0,1,0]])[1][1], 1, 'test 4');
 
+    t.equal(processCell([[0,0,0], [1,0,1], [0,0,0]])[1][1], 0, 'test 5');
 
+    t.equal(processCell([[0,0,0], [1,1,0], [0,0,0]])[1][1], 0, 'test 6');
 
+    t.equal(processCell([[0,0,0], [0,1,0], [0,0,0]])[1][1], 0, 'test 7');
 
+    t.equal(processCell([[1,1,1], [1,1,1], [1,1,1]])[1][1], 0, 'test 8');
 
+    t.end();
 
+});
 
+
 
+