game-of-life
/
index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Conway's Game of Life</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <aside>
      <br />
      <label for="height">Height: (cells)</label>
      <input type="number" id="height" step="1" min="1" />
      <label for="width">Width: (cells)</label>
      <input type="number" id="width" step="1" min="1" />
      <label for="unit">Size of each cell: (px)</label>
      <input type="number" id="size" step="1" min="3" max="20" />
      <label for="gap">Gap between cells: (px)</label>
      <input type="number" id="gap" step="1" min="1" max="10" />
      <button id="new">Generate</button>
      <button id="reset">Reset</button>
      <br />
      <label for="density">Density of cells: <strong id="figure1"></strong></label>
      <input type="range" id="density" step="0.01" min="0" max="1" />
      <label for="interval">Interval: <strong id="figure2"></strong> (ms)</label>
      <input type="range" id="interval" step="40" min="40" max="1000" />
      <input type=checkbox id="multithreading" /> <label for="multithreading">Use web worker</label>
      <label for="examples">Examples of patterns:</label>
      <select id="examples"></select>
      <button id="random">Random</button>
      <button id="start">Start</button>
      <button id="stop" disabled>Stop</button>
      <button id="step">Next</button>
      <button id="clean">Clean</button>
      <br />
      <a href="https://github.com/myst729/game-of-life#conways-game-of-life">What's this?</a>
    </aside>
    <section>
      <h2>Conway's Game of Life</h2>
      <canvas id="world"></canvas>
    </section>
    <script src="lifes.js"></script>
    <script src="gol.js"></script>
  </body>
</html>