Explicit Eye mod for Sixty Four

Readme.md

Explicit Eye

This is a mod that make the Fill Director indication more visible and useful

Follow modding instruction on Sixty Four wiki

ExplicitEye.js

label =on 'Explicit Eye';
description = 'Make the Fill Director indication more visible and useful';

(function () {
  let c = typeof configuration === 'object' ? configuration : {};
  if (!c?.enabled) return;
  
  Game.prototype.renderUnfilled = function () {
    this.ctx.save();
    const margin = this.pixelRatio * 16;
    const size = this.pixelRatio * 18;
    /** @type CanvasRenderingContext2D */
    const ctx = this.ctx;
    const mx = ctx.canvas.clientWidth;
    const my = ctx.canvas.clientHeight;
    for (let i = 0; i < this.unfilledEntities.length; i++) {
      const coords = this.uvToXYUntranslated(this.unfilledEntities[i].position);
      const vector = [this.mouse.xy[0] - coords[0], this.mouse.xy[1] - coords[1]];
      const length = (vector[0] ** 2 + vector[1] ** 2) ** 0.5;

      //if (length > this.unit * 6) {
      if (coords[0] < 0 || coords[1] < 0 || coords[0] > mx || coords[1] > my) {
        this.ctx.strokeStyle = `#FFF`;
        this.ctx.lineWidth = this.pixelRatio * 6;
        vector[0] /= length;
        vector[1] /= length;

        this.ctx.beginPath();
        this.ctx.moveTo(this.mouse.xy[0], this.mouse.xy[1]);
        this.ctx.lineTo(this.mouse.xy[0] - vector[0] * size, this.mouse.xy[1] - vector[1] * size);
        this.ctx.stroke();
      } else {
        this.ctx.fillStyle = `#FFF`;
        this.ctx.strokeStyle = `#FFF`;
        this.ctx.lineWidth = this.pixelRatio * 6;

        this.ctx.beginPath();
        this.ctx.moveTo(this.mouse.xy[0], this.mouse.xy[1]);
        this.ctx.lineTo(coords[0], coords[1]);
        this.ctx.stroke();

        this.ctx.beginPath();
        this.ctx.arc(coords[0], coords[1], this.pixelRatio * 5, 0, Math.PI * 2);
        this.ctx.closePath();
        this.ctx.fill();
      }
    }

    for (let i = 0; i < this.unfilledEntities.length; i++) {
      const coords = this.uvToXYUntranslated(this.unfilledEntities[i].position);
      const vector = [this.mouse.xy[0] - coords[0], this.mouse.xy[1] - coords[1]];
      const length = (vector[0] ** 2 + vector[1] ** 2) ** 0.5;

      if (coords[0] < 0 || coords[1] < 0 || coords[0] > mx || coords[1] > my) {
        this.ctx.strokeStyle = `#112`;
        this.ctx.lineWidth = this.pixelRatio * 2;
        vector[0] /= length;
        vector[1] /= length;

        this.ctx.beginPath();
        this.ctx.moveTo(this.mouse.xy[0], this.mouse.xy[1]);
        this.ctx.lineTo(this.mouse.xy[0] - vector[0] * size, this.mouse.xy[1] - vector[1] * size);
        this.ctx.stroke();
      } else {
        this.ctx.fillStyle = `#112`;
        this.ctx.strokeStyle = `#112`;
        this.ctx.lineWidth = this.pixelRatio * 2;

        this.ctx.beginPath();
        this.ctx.moveTo(this.mouse.xy[0], this.mouse.xy[1]);
        this.ctx.lineTo(coords[0], coords[1]);
        this.ctx.stroke();

        this.ctx.beginPath();
        this.ctx.arc(coords[0], coords[1], this.pixelRatio * 3, 0, Math.PI * 2);
        this.ctx.closePath();
        this.ctx.fill();
      }
    }
    this.ctx.restore();
  };
})();