ワタタツの日記!

☆ 法文など括弧の多い文書を折り畳みできるブックマークレットを作った

条文って、カッコが多くてめちゃ読みづらいです。カッコ内を折りたためる条文リーダがあると便利だろうなぁ。（ちらっ > @NeXTSTEP2OSX )

— Takahiro Sumiya (@gnutar) 2018年5月19日

というツイートのようにわしが一瞥されていたので、 法律の条文のように括弧が多い文書を括弧で折り畳みして表示できるブックマークレットを作りました。

ブックマークレット

そのブックマークレットは次です。

javascript:(() => {
  var s=document.createElement('style');s.innerText='.toggler0 { text-indent:0; width:16px; display: inline-block; animation: 0.2s ease-in forwards rotation; } .toggler1 { text-indent:0; width:16px; display: inline-block; animation: 0.2s ease-in reverse forwards rotation; } @keyframes rotation { 0%25 { transform: rotate(0deg) } 100%25 { transform: rotate(-90deg) } }';document.getElementsByTagName('head')[0].appendChild(s);
})();
[0,1].forEach((l) => {
 const d=document;var s=d.body.innerHTML;d.body.innerHTML=s.replace(/（([^（]+?)）/g,"<span style=\"\"><span onclick=\"var n=this.nextSibling;if(n.style.display === 'none'){n.style.display = '';this.className='';this.className = 'toggler1';}else{ n.style.display = 'none';this.className='';this.className = 'toggler0';} \" class=\"toggler0\" style=\"color: #aaa; cursor: pointer;\">▼</span><span style=\"display: none\"> ($1) </span></span>");
})

gist にも置いています。

このままコピペしてもいいですし、このリンクをそのままブックマークバーへドラッグするなどして、ブックマークに入れて使って下さい。

(ちなみにアニメーションをええがに付けようと思ったのですがまだうまくできていません。)

使用例

例えば、著作権法の条文を開いて実行してみます。

次のようになります。

「▼」になったところをポチポチすると開け閉めできます。

動画で見ると次のような具合です。

https://www.youtube.com/embed/N7-w--vhSR0

ではでは。