Scrapbox上でGyazoのOCR情報を取得するUserScript
https://gyazo.com/024426ed89f13ac080c53bec18c942b7
code:script.js
// カーソル位置に文章を挿入するUserScript
import { insertText } from "/api/code/gosyujin/scrapbox-insert-text/script.js"
// TampberMonkeyの関数呼び出し
function getOcr(id) {
return window.get_gyazo_image(id);
}
function getPrettierOcrText(str) {
const json = JSON.parse(str);
const imageId = json.image_id ?? str;
const ocrPrefix = code:${imageId}\n;
if (!json.ocr) return ${ocrPrefix} OCR情報がありません(処理中、自分が所有していない、Gyazoじゃない);
if (json.ocr.description === '') return ${ocrPrefix} OCR結果が空です;
// コードブロック用にOCR結果を整形
// 改行してコードブロックに貼り付け
//const gyazo_ocr_txt = json.ocr.description.split('\n').map(i => ${i}).join('\n');
// 改行なしで全結合
const gyazo_ocr_txt = json.ocr.description.split('\n').map(i => ${i.trim()}).join('');
return ${ocrPrefix} ${gyazo_ocr_txt};
/* 一時的に文字だけ返す */
//return gyazo_ocr_txt;
}
function execGyazo(source) {
if (!window.get_gyazo_image) {
console.error('TampermonkeyにGetGyazoImageがインストールされていません');
return;
}
if (document.getElementById('text-input').value === '') {
console.warn('範囲が選択されていません')
return;
}
// 選択範囲の文字を取得
const select = document.getElementById('text-input').value;
// Gyazoのidっぽい文字列を抽出
const gyazo_id_regexp = /^0-9a-z{32}$/; // とりあえず選択範囲を分割してgyazo_id_regexpで拾えるものを拾う
const gyazo_ids = select.split(/\s|\/|\?|\=|\|\/).filter(f => f.match(gyazo_id_regexp)); if (gyazo_ids.length === 0) {
console.warn('選択範囲にGyazoのidっぽい文字列がありません');
return;
}
// 選択した部分はカーソル位置にそのまま戻す
insertText({ text: ${select} });
// その後OCR結果を順番に追加していく
const promises = gyazo_ids.map(g => getOcr(g));
Promise.all(promises).then(p => {
p.map(r => insertText({ text: \n${getPrettierOcrText(r.response)}\n }));
});
}
scrapbox.PageMenu.addMenu({
title: 'GyazoのOCR情報を取得する',
onClick: () => execGyazo()
});
scrapbox.PopupMenu.addButton({
onClick: (text) => execGyazo()
});
内容
字が汚いのでOCRの真の力が発揮できていない…
更新履歴
v1.0(2021/11/15)
複数行まとめて変換する時、うまく画像、ocr、画像、ocr...になるようにしたい(2021/11/16)
今は選択範囲、ocr、ocr…となる
順番を保持したい
とりあえず保持できるようにした(2021/11/17)