import {Display} from '../display.js';
import {Tool} from '../tool.js';
import {div, sub} from '../vector.js';

export class ObjectTool extends Tool {
  selected = undefined;
  display = undefined;
  textEl = undefined;

  setContainer(container) {
    super.setContainer(container);
  }

  constructor() {
    super();

    this.display = new Display();
    this.display.canvas.width = 150;
    this.display.canvas.height = 150;

    this.textEl = document.createElement('div');

    this.div.appendChild(this.textEl);
    this.div.appendChild(this.display.canvas);
  }

  frame() {
    this.display.frame();
    const obj = this.sim.select.selectedSingle;
    this.textEl.innerHTML = `obj id: ${obj?.id}`;
    if (!obj) return;

    // Show object details
    // Distance from center of screen
    // Render the object

    // Set up this.display.viewOrigin

    const {radius, position} = obj;
    const widthRatio = Math.abs(2 * radius) / this.display.canvas.width;
    const heightRatio = Math.abs(2 * radius) / this.display.canvas.height;
    const ratio = Math.max(widthRatio, heightRatio) * 2;
    this.display.scalePower = Math.log2(1 / ratio);
    this.display.viewOrigin = sub(position,
      div({x: this.display.width, y: this.display.height}, 2));
    obj.drawObject(this.display);
    obj.drawArrows(this.display);
  }
}