☰

Discord Catbox Uploader

Adds a button to upload files to catbox.moe in Discord

当前为 2024-09-30 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        Discord Catbox Uploader
  3. // @namespace   https://tampermonkey.net/
  4. // @version     1.3
  5. // @description Adds a button to upload files to catbox.moe in Discord
  6. // @author      OasisVee
  7. // @match       https://*.discord.com/*
  8. // @grant       GM_xmlhttpRequest
  9. // @grant       GM_setClipboard
  10. // @grant       GM_addStyle
  11. // @connect     catbox.moe
  12. // @icon        https://www.google.com/s2/favicons?sz=64&domain=catbox.moe
  13. // @license     MIT
  14. // ==/UserScript==
  15.  
  16. (function() {
  17.     'use strict';
  18.  
  19.     const STYLES = `
  20.         .catbox-tooltip {
  21.             position: absolute;
  22.             background-color: #202225;
  23.             color: #dcddde;
  24.             padding: 8px 12px;
  25.             border-radius: 5px;
  26.             font-size: 14px;
  27.             font-weight: 500;
  28.             pointer-events: none;
  29.             opacity: 0;
  30.             transition: opacity 0.1s ease-in-out;
  31.             z-index: 9999;
  32.             top: -30px;
  33.             box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  34.             white-space: nowrap;
  35.             border: 1px solid #36393F;
  36.         }
  37.         .catbox-tooltip::before {
  38.             content: '';
  39.             position: absolute;
  40.             width: 0;
  41.             height: 0;
  42.             border: 8px solid transparent;
  43.             border-top-color: #202225;
  44.             bottom: -16px;
  45.             left: 50%;
  46.             transform: translateX(-50%);
  47.         }
  48.     `;
  49.  
  50.     const CAT_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" fill="currentColor"><path d="M12,8L10.67,8.09C9.81,7.07 7.4,4.5 5,4.5C5,4.5 3.03,7.46 4.96,11.41C4.41,12.24 4.07,12.67 4,13.66L2.07,18.37L2.06,18.39C1.61,19.31 2.08,20.68 3,21.13L3.09,21.17C3.42,21.31 3.77,21.35 4.09,21.3C4.39,21.33 4.7,21.27 4.95,21.13L5.36,20.94C6.35,20.44 6.69,20.18 7.12,20.03C7.88,19.83 8.88,19.9 10.01,19.9H14C15.15,19.9 16.15,19.83 16.91,20.03C17.34,20.18 17.66,20.44 18.65,20.94L19.06,21.13C19.3,21.27 19.61,21.33 19.91,21.3C20.23,21.35 20.58,21.31 20.91,21.17L21,21.13C21.92,20.68 22.39,19.31 21.94,18.39L21.93,18.37L20,13.66C19.93,12.67 19.59,12.24 19.04,11.41C20.97,7.46 19,4.5 19,4.5C16.6,4.5 14.19,7.07 13.33,8.09L12,8M9,11A1,1 0 0,1 10,12A1,1 0 0,1 9,13A1,1 0 0,1 8,12A1,1 0 0,1 9,11M15,11A1,1 0 0,1 16,12A1,1 0 0,1 15,13A1,1 0 0,1 14,12A1,1 0 0,1 15,11M11,14H13L12.3,15.39C12.5,16.03 13.06,16.5 13.75,16.5A1.5,1.5 0 0,0 15.25,15H15.75A2,2 0 0,1 13.75,17C13,17 12.35,16.59 12,16V16H12C11.65,16.59 11,17 10.25,17A2,2 0 0,1 8.25,15H8.75A1.5,1.5 0 0,0 10.25,16.5C10.94,16.5 11.5,16.03 11.7,15.39L11,14Z"/></svg>`;
  51.  
  52.     const catboxButtonTemplate = document.createElement('button');
  53.     catboxButtonTemplate.id = 'catbox-upload-btn';
  54.     catboxButtonTemplate.innerHTML = CAT_SVG;
  55.     catboxButtonTemplate.setAttribute('data-tooltip', 'Upload to Catbox');
  56.  
  57.     const fileInput = document.createElement('input');
  58.     fileInput.type = 'file';
  59.  
  60.     const tooltipElement = document.createElement('div');
  61.     tooltipElement.className = 'catbox-tooltip';
  62.  
  63.     const notificationElement = document.createElement('div');
  64.     notificationElement.style.cssText = `
  65.         position: fixed;
  66.         top: 10px;
  67.         right: 10px;
  68.         padding: 10px 20px;
  69.         border-radius: 5px;
  70.         color: white;
  71.         font-weight: bold;
  72.         z-index: 9999;
  73.         opacity: 0;
  74.         transition: opacity 0.3s ease-in-out;
  75.     `;
  76.  
  77.     function addCatboxButton() {
  78.         const uploadButton = document.querySelector('button.attachButton_f298d4.attachButton_d0696b');
  79.         if (uploadButton && !document.getElementById('catbox-upload-btn')) {
  80.             const catboxButton = catboxButtonTemplate.cloneNode(true);
  81.             catboxButton.className = uploadButton.className;
  82.             catboxButton.style.cssText = `
  83.                 vertical-align: top;
  84.                 padding: 0px 8px;
  85.                 height: 0px;
  86.                 line-height: 0px;
  87.                 top: -20px;
  88.                 margin-left: 23px;
  89.                 position: relative;
  90.                 transform: translateX(0px);
  91.                 color: white;
  92.                 opacity: 80%;
  93.                 display: flex;
  94.                 align-items: center;
  95.                 justify-content: center;
  96.             `;
  97.             catboxButton.addEventListener('click', handleCatboxUpload);
  98.             catboxButton.addEventListener('mouseenter', showTooltip);
  99.             catboxButton.addEventListener('mouseleave', hideTooltip);
  100.             uploadButton.parentNode.insertBefore(catboxButton, uploadButton.nextSibling);
  101.             return true;
  102.         }
  103.         return false;
  104.     }
  105.  
  106.     function showTooltip(event) {
  107.         const button = event.currentTarget;
  108.         tooltipElement.textContent = button.getAttribute('data-tooltip');
  109.         document.body.appendChild(tooltipElement);
  110.         const buttonRect = button.getBoundingClientRect();
  111.         const tooltipRect = tooltipElement.getBoundingClientRect();
  112.         tooltipElement.style.left = `${buttonRect.left + (buttonRect.width / 2) - (tooltipRect.width / 2)}px`;
  113.         tooltipElement.style.top = `${buttonRect.top - tooltipRect.height - 15}px`;
  114.         requestAnimationFrame(() => tooltipElement.style.opacity = '1');
  115.     }
  116.  
  117.     function hideTooltip() {
  118.         tooltipElement.style.opacity = '0';
  119.         setTimeout(() => {
  120.             if (tooltipElement.parentNode) {
  121.                 tooltipElement.parentNode.removeChild(tooltipElement);
  122.             }
  123.         }, 100);
  124.     }
  125.  
  126.     function handleCatboxUpload(event) {
  127.         event.preventDefault();
  128.         event.stopPropagation();
  129.         fileInput.click();
  130.     }
  131.  
  132.     function uploadFile(file) {
  133.         const formData = new FormData();
  134.         formData.append('reqtype', 'fileupload');
  135.         formData.append('fileToUpload', file);
  136.  
  137.         GM_xmlhttpRequest({
  138.             method: 'POST',
  139.             url: 'https://catbox.moe/user/api.php',
  140.             data: formData,
  141.             onload: handleUploadResponse,
  142.             onerror: () => showNotification('Error uploading to Catbox.moe. Please try again.', 'error')
  143.         });
  144.     }
  145.  
  146.     function handleUploadResponse(response) {
  147.         if (response.status === 200) {
  148.             GM_setClipboard(response.responseText);
  149.             showNotification('File uploaded and link copied to clipboard!', 'success');
  150.         } else {
  151.             showNotification('Error uploading to Catbox.moe. Please try again.', 'error');
  152.         }
  153.     }
  154.  
  155.     function showNotification(message, type) {
  156.         notificationElement.textContent = message;
  157.         notificationElement.style.backgroundColor = type === 'error' ? '#ff4444' : '#00C851';
  158.         document.body.appendChild(notificationElement);
  159.         requestAnimationFrame(() => {
  160.             notificationElement.style.opacity = '1';
  161.             setTimeout(() => {
  162.                 notificationElement.style.opacity = '0';
  163.                 setTimeout(() => document.body.removeChild(notificationElement), 300);
  164.             }, 3000);
  165.         });
  166.     }
  167.  
  168.     function init() {
  169.         GM_addStyle(STYLES);
  170.         const observer = new MutationObserver((mutations) => {
  171.             if (mutations.some(mutation => mutation.addedNodes.length > 0)) {
  172.                 addCatboxButton();
  173.             }
  174.         });
  175.         observer.observe(document.body, { childList: true, subtree: true });
  176.         fileInput.addEventListener('change', event => {
  177.             const file = event.target.files[0];
  178.             if (file) uploadFile(file);
  179.         });
  180.         addCatboxButton();
  181.     }
  182.  
  183.     init();
  184. })();