import { draw } from './canvas.js';
import { create_team, create_epoch, update_epoch } from '../simulation/game.js';


const start_teams = [...Array(5)].map(x => create_team(8, 50, 50));
let epoch = create_epoch(60, start_teams);


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;