AI Web UIで頻出する操作を便利にするブックマークレット

ai-web-bookmarklet.js

javascript:void(function(){var L=['US English','UK English','中国語','スペイン語','フランス語','ポルトガル語','ドイツ語','アラビア語','ヒンディー語','トルコ語','インドネシア語','韓国語'];var JP='\n```\n\n上記文章を\n丁寧な表現、カジュアル、技術的の3パターンで ';var SFX=' に翻訳して1クリックでコピーできるようにして';var SVCS={perplexity:{q:'https://www.perplexity.ai/search/new?q=',home:'https://www.perplexity.ai/'},claude:{q:'https://claude.ai/new?q=',home:'https://claude.ai'},chatgpt:{q:'https://chatgpt.com/?prompt=',home:'https://chatgpt.com/'}};var ACTS={ja:'和訳して1クリックでコピーできるようにして',edit:'校正して',sum:'要約して',dia:'図解して',brk:'分解して補足説明して',vfy:'真偽検証して',md:'マークダウン形式に変換して'};function go(t,m){var q;if(m==='raw'){q=t;}else{var H='```\n'+t+'\n```\n\n上記の文章・内容を';q=ACTS[m]?H+ACTS[m]:'```\n'+t+JP+m+SFX;}var s=SVCS[svc.value]||SVCS.perplexity;var w=open(s.q+encodeURIComponent(q),'_blank');if(w)w.focus();}var M=/Mac/i.test(navigator.platform),mod=M?'⌘':'Ctrl',alt=M?'⌥':'Alt';var E=document.createElement.bind(document);var host=E('div');host.style.cssText='position:fixed;top:0;left:0;width:100%;height:100%;z-index:99999';var shadow=host.attachShadow({mode:'open'});var style=E('style');style.textContent='*:not(svg):not(svg *):not(style){all:initial;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}#overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center}#box{background:#fff;border-radius:8px;padding:8px;position:relative;min-width:469px;max-width:90vw}#cl{position:absolute;top:-28px;right:0;background:none;border:none;cursor:pointer;line-height:1;font-size:22px;color:#ccc;z-index:1}#svcwrap{position:absolute;bottom:100%;left:26px;background:#fff;border-radius:6px 6px 0 0;padding:0 6px 0 0;z-index:1;overflow:hidden}#svc{font-size:11px;font-weight:700;padding:5px 10px;border:none;border-radius:0;cursor:pointer;background:#fff;color:#333;outline:none;appearance:auto;-webkit-appearance:menulist}#svc option{font-size:11px;font-weight:700;color:#666}#go{position:absolute;top:-21px;left:6px;font-size:13px;color:#fff;text-decoration:none;cursor:pointer;z-index:1;line-height:1;display:flex;align-items:center;}#ta{display:block;width:100%;height:173px;font-size:14px;padding:8px;border:1px solid #ccc;border-radius:4px;outline:none;color:#1c1c1c;background:#dfdfdf;resize:both;min-width:449px;min-height:80px;box-sizing:border-box;tab-size:4;-moz-tab-size:4}#row{margin-top:6px;display:flex;justify-content:space-between;align-items:center}#lft{display:flex;align-items:center}#sel{padding:4px 3px 4px 6px;font-size:10.5px;border:1px solid #3C3B6E;border-radius:4px;cursor:pointer;background:#3C3B6E;color:#fff;margin-right:2px;appearance:auto;-webkit-appearance:menulist}#sel option{color:#aaa;font-size:10.5px;background:#2a2950}#sel2{padding:4px 3px 4px 6px;font-size:10.5px;border:1px solid #142;border-radius:4px;cursor:pointer;background:#142;color:#fff;margin-left:6px;margin-right:2px;appearance:auto;-webkit-appearance:menulist}#sel2 option{font-size:10.5px;color:#aaa;background:#253}.btn{padding:4px 15px;font-size:10.5px;cursor:pointer;border:1px solid transparent;border-radius:4px;color:#fff}.focushl{outline:2px solid #4A90D9;outline-offset:1px}#warn{margin-top:5px;padding:5px 8px;border:1.5px solid #c0392b;border-radius:4px;background:#fdecea;color:#a94442;font-size:11px;display:none;line-height:1.4;cursor:pointer}#warn .detail{margin-top:6px;border-top:1px solid #e6c3c0;padding-top:4px;font-size:10.5px;max-height:120px;overflow-y:auto}#warn .drow{display:flex;padding:2px 4px;border-radius:2px}#warn .drow:nth-child(even){background:rgba(192,57,43,.07)}#warn .dpos{color:#a94442;font-weight:700;min-width:52px;font-family:monospace;font-size:11px}#warn .dname{color:#777;font-size:9.5px}#tip{position:fixed;padding:4px 8px;background:#333;color:#fff;font-size:11px;border-radius:4px;pointer-events:none;display:none;z-index:100000;white-space:nowrap}#dh{position:absolute;top:-28px;left:110px;right:22px;height:28px;cursor:grab;z-index:0}#dh:active{cursor:grabbing}';shadow.appendChild(style);var tip=E('div');tip.id='tip';shadow.appendChild(tip);var tt;function T(el,s){el.onmouseenter=function(){tt=setTimeout(function(){tip.textContent=s;tip.style.display='block'},500)};el.onmousemove=function(e){tip.style.left=e.clientX+12+'px';tip.style.top=e.clientY-28+'px'};el.onmouseleave=function(){clearTimeout(tt);tip.style.display='none'};}function X(){host.remove();window.removeEventListener('keydown',K,true);window.removeEventListener('keyup',S,true);window.removeEventListener('keypress',S,true);window.removeEventListener('paste',P,true);window.removeEventListener('copy',P,true);window.removeEventListener('cut',P,true);}var Q=''+window.getSelection();var overlay=E('div');overlay.id='overlay';var box=E('div');box.id='box';var cl=E('button');cl.id='cl';cl.textContent='×';cl.onclick=X;var svcwrap=E('div');svcwrap.id='svcwrap';var svc=E('select');svc.id='svc';Object.keys(SVCS).forEach(function(k){var o=E('option');o.value=k;o.textContent=k[0].toUpperCase()+k.slice(1);svc.appendChild(o)});svcwrap.appendChild(svc);var goL=E('a');goL.id='go';goL.target='_blank';goL.rel='noopener';goL.href=SVCS.perplexity.home;goL.innerHTML='<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 3 21 3 21 9"/><line x1="21" y1="3" x2="11" y2="13"/><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/></svg>';svc.addEventListener('change',function(){var s=SVCS[svc.value];goL.href=s?s.home:SVCS.perplexity.home});goL.onclick=function(){setTimeout(X,0)};var ta=E('textarea');ta.id='ta';ta.value=Q.trim();new ResizeObserver(function(){var w=ta.offsetWidth;if(w>0)box.style.width=w+16+'px';}).observe(ta);var row=E('div');row.id='row';var lft=E('div');lft.id='lft';var sel=E('select');sel.id='sel';L.forEach(function(l){var o=E('option');o.value=l;o.textContent=l;sel.appendChild(o)});function B(txt,bg,m,ts){var b=E('button');b.className='btn';b.textContent=txt;b.style.background=bg;b.onclick=function(){var v=ta.value.trim();if(!v)return;X();go(v,m)};T(b,ts);return b;}var bt=E('button');bt.className='btn';bt.textContent='翻訳';bt.style.background='#3C3B6E';bt.style.marginRight='2px';bt.onclick=function(){var t=ta.value.trim();if(!t)return;X();go(t,sel.value)};T(bt,mod+' + Enter');var jaBtn=B('和訳','#BC002D','ja',mod+' + Shift + Enter');lft.append(sel,bt,jaBtn);var sel2=E('select');sel2.id='sel2';var o0=E('option');o0.value='';o0.textContent='アクション';o0.disabled=true;o0.selected=true;sel2.appendChild(o0);[['校正','edit'],['要約','sum'],['図解','dia'],['分解補足','brk'],['真偽検証','vfy'],['マークダウン化','md']].forEach(function(p){var o=E('option');o.value=p[1];o.textContent=p[0];sel2.appendChild(o)});sel2.addEventListener('change',function(){var t=ta.value.trim();var m=sel2.value;sel2.selectedIndex=0;if(t&&m){X();go(t,m);}});var rawBtn=B('質問','#333','raw',alt+' + Enter');var rgt=E('div');rgt.style.cssText='display:flex;align-items:center';rgt.append(sel2,rawBtn);row.append(lft,rgt);var warn=E('div');warn.id='warn';var INVIS=/[\u200B\u200C\u200D\u200E\u200F\u202A-\u202E\u2060-\u2064\u2066-\u2069\uFEFF\u00AD\u034F\u061C\u115F\u1160\u17B4\u17B5\u180B-\u180E\u2000-\u200A\u2028\u2029\u205F\u2800\u3164\uFFA0]/;var NAMES={'\u200B':'Zero-Width Space','\u200C':'ZWNJ','\u200D':'ZWJ','\u200E':'LTR Mark','\u200F':'RTL Mark','\u202A':'LTR Embedding','\u202B':'RTL Embedding','\u202C':'Pop Direction','\u202D':'LTR Override','\u202E':'RTL Override','\u2060':'Word Joiner','\u2061':'Function Apply','\u2062':'Invisible Times','\u2063':'Invisible Separator','\u2064':'Invisible Plus','\u2066':'LTR Isolate','\u2067':'RTL Isolate','\u2068':'First Strong Isolate','\u2069':'Pop Directional Isolate','\uFEFF':'BOM/ZWNBSP','\u00AD':'Soft Hyphen','\u034F':'Combining Grapheme Joiner','\u061C':'Arabic Letter Mark','\u180E':'Mongolian Vowel Separator','\u2800':'Braille Blank','\u3164':'Hangul Filler','\uFFA0':'Halfwidth Hangul Filler'};var warnData=[];var warnOpen=false;function checkInvis(){var v=ta.value;warnData=[];var line=1,col=1;for(var i=0;i<v.length;i++){var c=v[i];var cp=v.codePointAt(i);if(cp>0xFFFF){var pair=String.fromCodePoint(cp);if(INVIS.test(pair))warnData.push({pos:line+':'+col,code:'U+'+cp.toString(16).toUpperCase(),name:'U+'+cp.toString(16).toUpperCase()});col++;i++;}else if(c=='\n'){line++;col=1;}else{if(INVIS.test(c)){var hex='U+'+cp.toString(16).toUpperCase().padStart(4,'0');warnData.push({pos:line+':'+col,code:hex,name:NAMES[c]||hex});}col++;}}renderWarn();}function renderWarn(){if(!warnData.length){warn.style.display='none';return;}warn.style.display='block';warn.innerHTML='';warn.appendChild(document.createTextNode('不可視文字を'+warnData.length+'個検出。プロンプトインジェクションにご注意ください。'));if(!warnOpen){var tog=E('span');tog.style.cssText='float:right;font-size:9px;color:#aaa';tog.textContent='▼';warn.insertBefore(tog,warn.firstChild);}if(!warnOpen)return;var detail=E('div');detail.className='detail';warnData.forEach(function(d){var row=E('div');row.className='drow';var pos=E('span');pos.className='dpos';pos.textContent=d.pos;var code=E('span');code.className='dname';code.style.minWidth='62px';code.textContent=d.code;var name=E('span');name.className='dname';name.textContent=d.name;row.appendChild(pos);row.appendChild(code);row.appendChild(name);detail.appendChild(row);});warn.appendChild(detail);}warn.addEventListener('click',function(){if(!warnData.length)return;warnOpen=!warnOpen;renderWarn();});ta.addEventListener('input',checkInvis);checkInvis();var focusOrder=[ta,svc,sel,bt,jaBtn,sel2,rawBtn];var focusIdx=0;function hlEl(el,on){if(el===svc){svcwrap.classList[on?'add':'remove']('focushl');}else{el.classList[on?'add':'remove']('focushl');}}function clearFocus(){focusOrder.forEach(function(el){hlEl(el,false);});}function setFocusIdx(idx){clearFocus();focusIdx=idx;var el=focusOrder[focusIdx];el.focus();hlEl(el,true);}focusOrder.forEach(function(el,i){el.addEventListener('focus',function(){clearFocus();hlEl(el,true);focusIdx=i;});el.addEventListener('blur',function(){hlEl(el,false);});});function K(e){if(document.activeElement!==host)return;var tr=M?e.metaKey:e.ctrlKey;var k=(e.key||'').toLowerCase();if(tr&&shadow.activeElement===ta&&/^[vcxazy]$/.test(k)){e.stopImmediatePropagation();if(k==='a'){e.preventDefault();ta.select();return;}if(k==='z'){e.preventDefault();document.execCommand(e.shiftKey?'redo':'undo');return;}if(k==='y'){e.preventDefault();document.execCommand('redo');return;}return;}if(tr&&/^[cvxazyCVXAZY]$/.test(e.key))return;e.stopPropagation();if(e.key==='Tab'&&!e.isComposing){if(e.shiftKey){e.preventDefault();setFocusIdx((focusIdx+1)%focusOrder.length);return;}if(shadow.activeElement===ta){e.preventDefault();var start=ta.selectionStart;var end=ta.selectionEnd;ta.value=ta.value.substring(0,start)+'\t'+ta.value.substring(end);ta.selectionStart=ta.selectionEnd=start+1;}return;}if(e.key==='Escape'){e.preventDefault();X();return;}if(e.key==='Enter'&&!e.isComposing){var t=ta.value.trim();if(!t)return;var m=e.altKey&&!tr?'raw':tr&&e.shiftKey?'ja':tr?sel.value:null;if(m){e.preventDefault();X();setTimeout(function(){go(t,m)},50);}}}function S(e){if(document.activeElement===host)e.stopPropagation();}function P(e){if(shadow.activeElement===ta)e.stopImmediatePropagation();}window.addEventListener('keydown',K,true);window.addEventListener('keyup',S,true);window.addEventListener('keypress',S,true);window.addEventListener('paste',P,true);window.addEventListener('copy',P,true);window.addEventListener('cut',P,true);ta.addEventListener('keydown',K);var dh=E('div');dh.id='dh';var _dx=0,_dy=0,_drag=false;dh.addEventListener('mousedown',function(e){_drag=true;var r=box.getBoundingClientRect();_dx=e.clientX-r.left;_dy=e.clientY-r.top;box.style.position='fixed';box.style.left=r.left+'px';box.style.top=r.top+'px';box.style.margin='0';overlay.style.display='block';overlay.style.alignItems='unset';overlay.style.justifyContent='unset';e.preventDefault();});document.addEventListener('mousemove',function(e){if(!_drag)return;box.style.left=(e.clientX-_dx)+'px';box.style.top=(e.clientY-_dy)+'px';},true);document.addEventListener('mouseup',function(){if(_drag){_drag=false;}},true);box.append(svcwrap,goL,cl,dh,ta,row,warn);overlay.appendChild(box);shadow.appendChild(overlay);document.body.appendChild(host);ta.focus();}())