by xtetsuji
09/03 [2025/09/03 11:56:32]
現在閲覧しているサイトの Trello カードを作成しつつ、そのサイトのスクリーンショットを撮ってクリップボードに入れます
/*
* @title Trelloカード作成+スクショコピー
* @description 現在閲覧しているサイトの Trello カードを作成しつつ、そのサイトのスクリーンショットを撮ってクリップボードに入れます
* @include http://*
* @license MIT License
* @require
*/
javascript:(async()=>{
// load html2canvas if not present
if(!window.html2canvas){
await new Promise((res,rej)=>{
const s=document.createElement('script');
s.src='https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js';
s.onload=res; s.onerror=rej; document.head.appendChild(s);
}).catch(e=>{alert('html2canvas の読み込みに失敗しました'); throw e;});
}
try{
// take screenshot of whole page
const el=document.documentElement;
const w=el.scrollWidth, h=el.scrollHeight;
const canvas=await html2canvas(el,{
useCORS:true,
windowWidth: w,
windowHeight: h,
scrollX: -window.scrollX,
scrollY: -window.scrollY,
scale: Math.min(2, window.devicePixelRatio||1)
});
await new Promise((res)=>canvas.toBlob(res,'image/png'));
const blob = await new Promise(res=>canvas.toBlob(res,'image/png'));
// copy to clipboard (may require secure context and user gesture)
if(navigator.clipboard && window.ClipboardItem){
await navigator.clipboard.write([new ClipboardItem({'image/png': blob})]);
console.log('スクリーンショットをクリップボードにコピーしました');
alert('スクリーンショットをクリップボードにコピーしました。Trello へ移動します。');
} else {
alert('クリップボード書き込み非対応のブラウザです（ClipboardItem 必須）');
}
// open Trello add-card popup with page title/URL
const name = encodeURIComponent(document.title || 'No title');
const url = encodeURIComponent(location.href);
const desc = encodeURIComponent((window.getSelection().toString()||'') + '\n\n(自動追記)');
// opens Trello add-card UI (ユーザーが保存を確定する)
window.open(`https://trello.com/add-card?name=${name}&desc=${desc}&url=${url}`,'_blank');
}catch(e){
console.error(e); alert('処理中にエラーが発生しました: '+e);
}
})()