☰

EasyScreenOCR Add Clipboard Upload Feature

Allow direct image upload from the clipboard.

  1. // ==UserScript==
  2. // @name               EasyScreenOCR Add Clipboard Upload Feature
  3. // @name:zh-tw         EasyScreenOCR 增加從剪貼簿上傳的功能
  4. // @version            1.2
  5. // @description        Allow direct image upload from the clipboard.
  6. // @description:zh-tw  允許從剪貼簿直接上傳圖片
  7. // @match              https://online.easyscreenocr.com/*
  8. // @grant              none
  9. // @author             ani20168
  10. // @icon               https://online.easyscreenocr.com/favicon.ico
  11. // @namespace          https://greasyfork.org/users/1044014
  12. // ==/UserScript==
  13.  
  14. (function() {
  15.     'use strict';
  16.  
  17.     // Define the new dropzone element
  18.     var dropzone = document.querySelector('.el-upload');
  19.  
  20.     dropzone.addEventListener('paste', function(event) {
  21.         // Get the clipboard data as an image file
  22.         var items = (event.clipboardData || event.originalEvent.clipboardData).items;
  23.         for (var i = 0; i < items.length; i++) {
  24.             if (items[i].type.indexOf("image") !== -1) {
  25.                 var blob = items[i].getAsFile();
  26.  
  27.                 // Create a new file object from the clipboard image data
  28.                 var file = new File([blob], "pasted-image.png", {type: "image/png"});
  29.  
  30.                 // "el-upload__input" seems to be the actual file input, so we will use it to trigger the upload
  31.                 var fileInput = dropzone.querySelector('.el-upload__input');
  32.                 if (fileInput) {
  33.                     fileInput.files = new FileListItems([file]);
  34.  
  35.                     // Manually dispatch a change event
  36.                     var changeEvent = new Event('change', { 'bubbles': true });
  37.                     fileInput.dispatchEvent(changeEvent);
  38.                 }
  39.             }
  40.         }
  41.     });
  42.  
  43.     // This is a helper function to allow us to assign to the files property of an input
  44.     function FileListItems(files) {
  45.         var b = new ClipboardEvent("").clipboardData || new DataTransfer(); // ClipboardEvent's clipboardData or fallback
  46.         for (var i = 0, len = files.length; i<len; i++) b.items.add(files[i]);
  47.         return b.files;
  48.     }
  49.  
  50. })();
  51.  
  52.  
  53.  
  54.  
  55.  
  56.