ブラウザにオーバーレイするブックマークレットWidget各種
ブラウザの上に、ウインドウをオーバーレイして各種機能を実現するブックマークレットWidgetをここに紹介していきます。今後新機能が追加された場合は、ここに追記していきます。
（2008/3/23にcodereposへの公開を機にソースコードの構造が変わりました。恐れ入りますが、それ以前にブックマークされた方は入れ替えていただけますでしょうか。今までのURLはいずれ削除する予定です。）
WidgetというのはUIを伴った小さな部品という意味なのですが、ここで紹介しているものは、ブラウザ画面内をマウスドラッグで移動して、今見ているWebページに機能を追加するウインドウです。
以下のリンクをブックマークに登録したり、ブックマークバーにドラッグすることで使えるようになります。
どんな動作をするか？は試しにリンクをクリックしてみてください。
１．PHPの関数を調べる。
よくわからない関数名をコピペしたり、記憶の断片を下にphp.netの優れたヘルプをすぐに呼び出すことができます。
関連エントリ：
F's Garage：[update]PHPの関数をすぐに調べるbookmarklet
２．Webの文字列をExciteの英日翻訳に投げる。
マウスで翻訳したい英文を選択してブックマークレットを起動すれば、選択範囲を簡単にエキサイトの翻訳に投げることができます。
関連エントリ：
F's Garage：[update]英日翻訳をするブックマークレット
３．選択文字を自動翻訳
５秒周期でマウスで選択した文字列を翻訳します。文章が日本語だったら日→英に、英文だったら英→日に自動判別して翻訳します。
3/23をもってgoogleの翻訳apiに変更しました。ちょっと試した限り、今までより高い精度の翻訳が得られると思います。
関連エントリ：
F's Garage：iPhone SDKを読み解くのに必須！ Google AJAX Language APIを使ったブックマークWidget作った。
４．blogに書くリンクをさくっと作る。
blogのリンクを作る時に、blogのタイトルって選択しにくかったり、はてなスターを一緒に選択することになって、面倒だなぁと思ったりしませんか？
このブックマークレットは、今見ているページのURLとtitleから、適切なblog貼り付け用リンクを作ってくれるものです。
５．HTML内で別サイトを表示するインラインブラウザ
これはリンクの周辺にフローティングウインドウを表示して、その中に指定したサイトを表示するものです。
ブックマークレットとして使うのではなくblogエントリの中でリンクを張って使うことを想定しています。例えばリンク先のURLを資料としてだけ見せたいだけなので、わざわざ別ウインドウを開くまでもない、という時に使えます。
６．twitterにメッセージを送信するbookmarket
ブラウジングしてたり調べ物をしているときに唐突に何かをつぶやきたくなって、twitterに書き込みをしたくなることがあります。
ただの書き込み欲を満たしたいだけなのに、そこからtwitter画面を開いてしまうとついつい他の人の書き込みを見て余計な時間を費やすのもアレなのと、僕は便利なtwitterツールを使ってないので、さくっと書き込みをする手段が欲しくて、bookmarketでtwitter書き込み用のwidgetを作りました。
続きはこちらから→F's Garage：twitterにメッセージを送信するbookmarket
７．[まだ全然作り中]同一サイトリンクを抽出するbookmarket
たまに大量のリンクが張られたページの中で、果たしてそのサイト内の本当のリンクは一体どこなのか？というのを知りたいことがあります。（エロ動画の騙しリンク回避とか）
そのサイトと同一ドメインのリンクだけを抽出するbookmarkletを作ってみました。まだ全然UIはイケてないですが、UIはさておき、目的は達成できているので公開してみます。
あと、同一ドメインで外に連れて行かれるURLにはOUTという文字が入ってることが多いので、「out」という文字がリンクに書かれていると無視するようにしました。
まだIE6では動かないっぽいので、FirefoxかOpera,Safariで動かしてください。
＊＊＊今後やりたいこと。
・link makerはもっといろんなことができるような気がする。
blog作成のツール群に発展させたい。
・パスワードマネージャが作れると思った。
＊＊＊何か作ってみたい人へ
3/23にcodereposでソースコードを公開しました！
技術的にはウインドウ制御と、個別の機能を記述するファイルが分離しており、かつウインドウUIのテンプレートが分離されているプラグイン構造になっているので、簡単に新規機能を追加することができます。
こちらから取得いただけます。
http://svn.coderepos.org/share/lang/javascript/PluggableInlineWindow/trunk/
＊＊＊利用について。
どうぞご自由にご利用ください。
何かに使ったら教えてもらえるとありがたいです。