☰

Blomaga Image Paste

ブロマガにクリップボードから画像アップロード

  1. // ==UserScript==
  2. // @name         Blomaga Image Paste
  3. // @namespace    https://github.com/segabito/
  4. // @version      0.0.5
  5. // @description  ブロマガにクリップボードから画像アップロード
  6. // @author       segabito macmoto
  7. // @match        *://ch.nicovideo.jp/tool/blomaga/edit?article_id=*
  8. // @match        *://ch.nicovideo.jp/tool/blomaga/edit
  9. // @grant        none
  10. // @require      https://cdnjs.cloudflare.com/ajax/libs/lodash.js/3.10.1/lodash.js
  11. // @license      public domain
  12. // @noframes
  13. // ==/UserScript==
  14.  
  15. (function() {
  16.   const monkey = function() {
  17.     const $ = window.jQuery;
  18.     const Blomaga = window.Blomaga;
  19.     const Editor = Blomaga.Editor;
  20.  
  21.     const post = function(file) {
  22.       const transfer = new Blomaga.EditorUploader.FileReadTransfer();
  23.       const progressBar = new Blomaga.EditorUploader.ProgressBar();
  24.       progressBar.setPercent(0);
  25.       transfer.progress_bar = progressBar;
  26.       progressBar.show();
  27.  
  28.       transfer.onProgress = (per) => {
  29.         progressBar.setPercent(per);
  30.       };
  31.  
  32.       transfer.onLoad = (resp) => {
  33.         console.info('success: ', resp);
  34.         progressBar.setPercent(100);
  35.         progressBar.showSuccess();
  36.         window.setTimeout(() => { progressBar.hide(); }, 1000);
  37.  
  38.         Blomaga.EditorSideBar.Image.addList(
  39.           resp.src,
  40.           resp.image_id,
  41.           resp.width,
  42.           resp.height,
  43.           resp.csrf_token,
  44.           resp.csrf_token_time
  45.         );
  46.         Editor.insertUploadImage(
  47.           resp.image_id,
  48.           resp.src,
  49.           resp.width,
  50.           resp.height
  51.         );
  52.       };
  53.  
  54.       transfer.onError = (json) => {
  55.         progressBar.showError(json);
  56.       };
  57.  
  58.       transfer.upload(file);
  59.     };
  60.  
  61.     const onPaste = function(e) {
  62.       let file;
  63.       const items =
  64.         (e.clipboardData || e.originalEvent.clipboardData).items;
  65.       console.info('clipboard items', e, JSON.stringify(items));
  66.  
  67.       for (let i = 0, len = items.length; i < len; i++) {
  68.         let item = items[i];
  69.         if (item.type.match(/^image/i)) {
  70.           file = item.getAsFile();
  71.           break;
  72.         }
  73.       }
  74.       if (!file) { return; }
  75.       e.preventDefault();
  76.       e.stopPropagation();
  77.       post(file);
  78.     };
  79.  
  80.     const initialize = function() {
  81.       Editor.insertUploadImage =
  82.         _.debounce(Editor.insertUploadImage.bind(Editor), 300);
  83.  
  84.       window.setTimeout(() => {
  85.         $('iframe#wysiwyg_editor_ifr')
  86.           .contents().find('html').on('paste', onPaste);
  87.       }, 1000);
  88.     };
  89.     initialize();
  90.   };
  91.  
  92.  
  93.   const script = document.createElement('script');
  94.   script.setAttribute('type', 'text/javascript');
  95.   script.setAttribute('charset', 'UTF-8');
  96.   script.appendChild(document.createTextNode('(' + monkey + ')()'));
  97.   document.body.appendChild(script);
  98. })();