summaryrefslogtreecommitdiff
path: root/src/ui/index.js
blob: 01068cb8bc2a044a0e9e72fac9ec12e0ee984d59 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
import { draw } from './canvas.js';
import { create_team, create_epoch, update_epoch } from '../simulation/game.js';


console.log("generating agents...");
const start_teams = [...Array(4)].map(x => create_team(2, 400, 50));
console.log("creating epoch...");
let epoch = create_epoch(60, start_teams);
console.log("ready!");


function draw_cell(ctx, x, y, cell) {
  ctx.fillStyle = (() => {
    switch (cell.type) {
      case 'empty':
        return '#ffffff';
      case 'immutable':
        return '#0000ff';
      case 'mutable':
        return '#555555';
      case 'active':
        return '#000000';
      case 'flag':
        return '#ffff00';
      default:
        return '#00ff00';
    }
  })();
  ctx.fillRect(x, y, 1, 1);
}

function draw_agent(ctx, agent) {
  ctx.beginPath();
  ctx.fillStyle = '#ff0000';
  const { x, y } = agent;
  ctx.arc(x+.5, y+.5, .5, 0, 2*Math.PI);
  ctx.fill();
}


function render(canvas) {
  draw(canvas, epoch.size, (ctx) => {
    for (let y=0; y<epoch.size; y++) {
      for (let x=0; x<epoch.size; x++) {
        draw_cell(ctx, x, y, epoch.game.world.lattice[y][x]);
      }
    }
    epoch.game.world.agents.forEach(a => draw_agent(ctx, a));
  });
}


function update(canvas) {
  console.log('update');
  epoch = update_epoch(epoch);
  render(canvas);
  setTimeout(() => update(canvas), 1);
}


function main() {
  const canvas = document.getElementById('canvas');
  window.onresize = () => { 
    const size = 0.95*window.innerWidth
    canvas.width = size;
    canvas.height = size;
    render(canvas); 
  }
  window.onresize();
  console.log("c:");
  update(canvas);
}


window.onload = main;