Hatena::ブログ(Diary)

W&R : Jazzと読書の日々 このページをアンテナに追加 RSSフィード

2016/04/03

HandyFlowyをスタイリッシュにするStylenoteを着脱式にしました

WorkFlowyの見掛けを変更

HandyFlowyをスタイリッシュに改造する拡張スクリプト Stylenote
手軽に拡張スクリプトを作る方法。HandyFlowyにはブックマークレットが使える。だったら単体でも登録できるじゃないか。そう思って、まずStylishモドキを考えてみました。見た目をカスタマイズする...

WorkFlowyのスタイルを変更する拡張スクリプト。Webページのデザインについて書かれたサイトを見ては、そのCSSがWorkFlowyに使えないか試しています。

そうなると困るのが再読み込み。別のデザインに切り替えようとすると、データを再読み込みする必要がありました。待ち時間が発生する。書きたいときの気持ちに合わせてモードを変えるのに間があいてしまう。それで、前回のトグル方式を利用して、スタイルの着脱ができるようにしてみました。


着脱式Stylenote

HandyFlowy 1.0
分類: 仕事効率化,ユーティリティ
価格: 無料 (Michinari YAMAMOTO)

使い方は従来と同じ。トピックのノートに書かれたCSSをWorkFlowyに適用する。そのための拡張スクリプトを創り出す拡張スクリプトです。メタ・スクリプト。出来た拡張スクリプトを実行すると、デザインが変更されます。そして、もう一度実行すると解除する。

MemoFlowy経由で登録→ http://tinyurl.com/htkenmx


スクリプト本体

p=pageContainer.querySelector(".noted");
if(p){
  name=p.querySelector(".content").innerText;
  s=p.querySelector(".notes").innerText;
  s=s.replace(/^\s*\/\/(.+?)$/mg,"").replace(/\n\s*/g,"").replace(/"/g,"'");
  script="if(document.getElementById('Stylenote')){document.body.removeChild(Stylenote)}else{e=document.createElement('style');e.id='Stylenote';e.innerHTML=\"" + s + "\";document.body.appendChild(e);}";
  text="handyflowy://import?name="+encodeURIComponent(name) + "&script=" + encodeURIComponent(script);
  webkit.messageHandlers.CopyToClipboard.postMessage(text);
  open(text);
}else{
  alert("No CSS in Note.");
};


着脱式Cardy

HandyFlowy用Cardyを少しだけバージョンアップします
ちらほらと桜もほころんできた。WorkFlowyを情報カードに変える拡張スクリプト。カードスタイルにすると「まとまり」が視覚化されます。パネルが集まったり散らばったりしてブロックを作り上げていく。プロ...

たとえば、Cardyも着脱式。

MemoFlowy経由で登録→ http://tinyurl.com/z76ml3g


まとめ

キャストオフは漢のロマン。デザインを変えるだけで、自分の中の「何か」が変わる。モードによって装備を変えると、出てくる文体も変わります。ヘンシーン!