☰

Sploop.io Tracers

Draws tracers on enemies, teammates and animals

Install this script?
Author's suggested script

You may also like Dsync Client [Sploop.io].

Install this script 
  1. // ==UserScript==
  2. // @name Sploop.io Tracers
  3. // @author Murka
  4. // @description Draws tracers on enemies, teammates and animals
  5. // @icon https://sploop.io/img/ui/favicon.png
  6. // @version 0.2
  7. // @match *://sploop.io/*
  8. // @run-at document-start
  9. // @grant none
  10. // @license MIT
  11. // @namespace https://greatest.deepsurf.us/users/919633
  12. // ==/UserScript==
  13. /* jshint esversion:6 */
  14.  
  15. /*
  16.     Author: Murka
  17.     Github: https://github.com/Murka007
  18.     Discord: https://discord.gg/sG9cyfGPj5
  19.     Greasyfork: https://greatest.deepsurf.us/en/users/919633
  20.  
  21.     Description:
  22.     - Draws tracers at enemies, teammates and animals
  23.     - You can choose your tracers mode, `ARROWS` or `LINES`
  24.     - If you will have any issues with this script, report about it in my discord
  25. */
  26.  
  27. (function() {
  28.     "use strict";
  29.  
  30.     // Customize tracers by changing values
  31.     window.tracers = {
  32.         mode: "ARROWS", // ARROWS, LINES
  33.         color: {
  34.             teammate: "#a4cc4f",
  35.             enemy: "#cc5151"
  36.         }
  37.     };
  38.     
  39.     
  40.  
  41.     const log = console.log;
  42.     function createHook(target, prop, setter) {
  43.         if (!window.hooks) {
  44.             window.hooks = {
  45.                 setter: [],
  46.                 getter: []
  47.             };
  48.         }
  49.         window.hooks.setter.push(setter);
  50.  
  51.         const symbol = Symbol(prop);
  52.         Object.defineProperty(target, prop, {
  53.             get() {
  54.                 return this[symbol];
  55.             },
  56.             set(value) {
  57.                 for (const setter of window.hooks.setter) {
  58.                     setter(this, symbol, value);
  59.                 }
  60.             },
  61.             configurable: true
  62.         })
  63.     }
  64.  
  65.     const myPlayer = {
  66.         id: null,
  67.         data: null
  68.     };
  69.  
  70.     // Get player id
  71.     window.WebSocket = new Proxy(WebSocket, {
  72.         construct(target, args) {
  73.             const socket = new target(...args);
  74.             socket.addEventListener("message", function(event) {
  75.                 try {
  76.                     const data = JSON.parse(event.data);
  77.                     if (data[0] === 35) {
  78.                         myPlayer.id = data[1];
  79.                     }
  80.                 } catch(err) {}
  81.             })
  82.             return socket;
  83.         }
  84.     })
  85.  
  86.     createHook(Object.prototype, "i", function(that, symbol, value) {
  87.         that[symbol] = value;
  88.         if (myPlayer.id === value) myPlayer.data = that;
  89.     });
  90.  
  91.     function formatPosition(args) {
  92.         const [ img, x, y ] = args;
  93.         return {
  94.             x: x + 0.5 * img.width / 2,
  95.             y: y - 67.5
  96.         };
  97.     }
  98.  
  99.     function triangle(ctx, x, y, width, height, angle, color) {
  100.         ctx.save();
  101.         ctx.translate(x, y);
  102.         ctx.rotate(angle);
  103.         ctx.fillStyle = color;
  104.         ctx.beginPath();
  105.         ctx.moveTo(width, 0);
  106.         ctx.lineTo(0, -height);
  107.         ctx.lineTo(-width, 0);
  108.         ctx.closePath();
  109.         ctx.fill();
  110.         ctx.restore();
  111.     }
  112.  
  113.     function lines(ctx, x1, y1, x2, y2, color) {
  114.         ctx.save();
  115.         ctx.strokeStyle = color;
  116.         ctx.lineCap = "round";
  117.         ctx.lineWidth = 5;
  118.         ctx.beginPath();
  119.         ctx.moveTo(x1, y1);
  120.         ctx.lineTo(x2, y2);
  121.         ctx.stroke();
  122.         ctx.restore();
  123.     }
  124.  
  125.     const COLOR = {
  126.         TEAMMATE: "#a4cc4f",
  127.         ENEMY: "#cc5151"
  128.     };
  129.  
  130.     // drawImage is called when the game draws a health gauge
  131.     CanvasRenderingContext2D.prototype.drawImage = new Proxy(CanvasRenderingContext2D.prototype.drawImage, {
  132.         apply(target, _this, args) {
  133.             const data = target.apply(_this, args);
  134.             const [ img, x, y, w, h ] = args;
  135.             if (
  136.                 img instanceof HTMLCanvasElement &&
  137.                 [COLOR.TEAMMATE, COLOR.ENEMY].includes(_this.fillStyle) &&
  138.                 myPlayer.data !== null &&
  139.                 w === img.width * 0.5 &&
  140.                 h === img.height * 0.5
  141.             ) {
  142.                 const { gU: x1, gV: y1 } = myPlayer.data;
  143.                 const { x: x2, y: y2 } = formatPosition(args);
  144.  
  145.                 const angle = Math.atan2(y2 - y1, x2 - x1);
  146.                 const isMyPlayer = angle === -Math.PI/2 && _this.fillStyle === COLOR.TEAMMATE;
  147.                 const { teammate, enemy } = window.tracers.color;
  148.                 const color = _this.fillStyle === COLOR.TEAMMATE ? teammate : enemy;
  149.  
  150.                 if (!isMyPlayer) {
  151.                     const x = x1 + 80 * Math.cos(angle);
  152.                     const y = y1 + 80 * Math.sin(angle);
  153.                     switch (window.tracers.mode) {
  154.                         case "ARROWS":
  155.                             triangle(_this, x, y, 15, 40, angle + Math.PI / 2, color);
  156.                             break;
  157.                         case "LINES":
  158.                             lines(_this, x1, y1, x2, y2, color);
  159.                             break;
  160.                     }
  161.                 }
  162.             }
  163.             return data;
  164.         }
  165.     })
  166.  
  167. })();