☰

Agar.io custom skin upload to skin

Upload image for custom skin

目前为 2023-04-27 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Agar.io custom skin upload to skin
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.2
  5. // @description  Upload image for custom skin
  6. // @author       New Jack 🕹️
  7. // @match        agar.io/*
  8. // @grant        none
  9. // @license      MIT
  10. // ==/UserScript==
  11.  
  12. (function () {
  13.     'use strict';
  14.  
  15.     function createButton() {
  16.         const button = document.createElement("input");
  17.         button.type = "file";
  18.         button.accept = "image/*";
  19.         button.id = "customImageUpload";
  20.         return button;
  21.     }
  22.  
  23.     function insertButton(button, target) {
  24.         if (target) {
  25.             target.appendChild(button);
  26.         }
  27.     }
  28.  
  29.     function convertImageToBase64(event) {
  30.         const file = event.target.files[0];
  31.         const reader = new FileReader();
  32.  
  33.         reader.onloadend = function () {
  34.             const base64 = reader.result;
  35.             drawImage(base64);
  36.         };
  37.  
  38.         reader.readAsDataURL(file);
  39.     }
  40.  
  41.     function drawImage(base64) {
  42.         const c = document.getElementById("skin-editor-canvas");
  43.         const ctx = c.getContext("2d");
  44.         const image = new Image();
  45.  
  46.         image.onload = function () {
  47.             // Set the canvas size to 512x512
  48.             c.width = 512;
  49.             c.height = 512;
  50.  
  51.             // Draw the image on the canvas, resizing it to 512x512
  52.             ctx.drawImage(image, 0, 0, 512, 512);
  53.             ctx.save();
  54.         };
  55.  
  56.         image.src = base64;
  57.     }
  58.  
  59.     function checkForRightTools() {
  60.         const rightTools = document.querySelector(".right-tools");
  61.  
  62.         if (rightTools) {
  63.             const button = createButton();
  64.             insertButton(button, rightTools);
  65.             button.addEventListener("change", convertImageToBase64);
  66.  
  67.             // Clear the interval once the button is added.
  68.             clearInterval(checkInterval);
  69.         }
  70.     }
  71.  
  72.     // Check for the .right-tools element every 5 seconds (5000 milliseconds).
  73.     const checkInterval = setInterval(checkForRightTools, 5000);
  74. })();