
import _ from 'underscore';
import Victor from 'Victor';

import './index.html';
import './images/favicon.ico';
import './style/style.css';

import * as Canvas from './Canvas';
import * as Tripod from './Tripod';

const drawTripod = (canvas, {leg1, leg2, leg3}) => {
  Canvas.drawSquare(canvas, leg1, 10, 'white');
  Canvas.drawSquare(canvas, leg2, 10, 'white');
  Canvas.drawSquare(canvas, leg3, 10, 'white');

  Canvas.drawLine(canvas, leg1, leg2, 'white');
  Canvas.drawLine(canvas, leg2, leg3, 'white');
  Canvas.drawLine(canvas, leg3, leg1, 'white');
};

const init = () => {
  console.log('init');

  const tripod = Tripod.create(
    Victor(100, 130),
    Victor(90, 80),
    Victor(80, 110),
  );

  const canvasEl = document.getElementById('canvas');
  const canvas = Canvas.create(window, canvasEl);

  const world = {
    canvas,
    tripod
  };

  canvasEl.onclick = (e) => {
    onClick(e, world);
  };

  requestAnimationFrame(() => draw(world));
};

const draw = (world) => {
  Tripod.live(world.tripod);
  Canvas.drawBackground(world.canvas, 'black');
  drawTripod(world.canvas, world.tripod);

  requestAnimationFrame(() => draw(world));
};

const onClick = (e, world) => {
  const newTarget = Victor(e.clientX, e.clientY);
  console.log(newTarget);
  Tripod.newTarget(world.tripod, newTarget);
};

init();

@@ -550,24 +550,117 @@
 hite');%0A%7D;%0A%0A
+const drawTarget = (canvas, target) =%3E %7B%0A  Canvas.drawSquare(canvas, target, 10, 'red');%0A%7D;%0A%0A
 const init =
@@ -664,24 +664,24 @@
 t = () =%3E %7B%0A
-
   console.lo
@@ -938,16 +938,34 @@
   tripod
+,%0A    target: null
 %0A  %7D;%0A%0A 
@@ -1173,16 +1173,86 @@
 lack');%0A
+  if (world.target) %7B%0A    drawTarget(world.canvas, world.target);%0A  %7D%0A
   drawTr
@@ -1372,18 +1372,15 @@
 %7B%0A  
-const newT
+world.t
 arge
@@ -1417,34 +1417,8 @@
 Y);%0A
-  console.log(newTarget);%0A
   Tr
@@ -1446,25 +1446,66 @@
 tripod, 
-newTarget
+world.target, () =%3E %7B%0A    world.target = null;%0A  %7D
 );%0A%7D;%0A%0Ai

Create and draw global target