2006年3月アーカイブ

記事を書くときにサイトのスクリーンショットを載せたい時がありますが、そうした時に便利なWebサービスが公開されました。

SimpleAPI開発日記 ? SimpleAPIシリーズ第１弾 サムネイル生成ツールをリリースしました
http://www.simpleapi.net/blog/?p=3
SimpleAPIシリーズは、XMLやJavascript、POSTメソッドをなるべく使わずに簡単に既存サービスに組み込めるAPI系サービスです。

http://img.simpleapi.net/

URLを渡すだけでとても簡単にサムネイルを表示させることができます。
ということで、間単にBlogに貼り付けられるようなコードを生成するブックマークレットを作成してみました。

サムネイル化 汎用

↓直接、クリップボードに転送するようにしたもの。

サムネイル化　IE専用

サムネイル化　Firefox専用

リンクをツールバーにドラッグするか右クリックで「お気に入り」に登録してお使いください。書式はなるべく改造しやすいようにしてみたので、興味のある方は変更してみてください。


例えば、ウチのTOPページで実行してコードを貼り付けると以下のような表示になります。


AUSGANG SOFT

このサービス、スクリーンショットの作成にIEを使ってるようです。IEで表示した時の問題も再現されてます(^^;
もちろんFlashもちゃんと表示してくれます。

すでにユーザーによっていろんな利用方法が考案されていて、おもしろいですね。その中に、Firefox の機能拡張COPY URL+用のコードを作られた方がいて、その発想を拝借して今回のブックマークレット作ってみました。


このAPIへの要望としては、画像のURLを指定した時に、Flickrのようなサムネールを表示してくれればと。また違った利用の仕方ができそうです。

www.flickr.com

以前、作った 英次郎 bookmarklet に新しいウィンドウで開くことはできないか？というご要望をいただいたので、検索結果を別窓で開くバージョンを作りました。

英辞郎 (別窓版)

リンクをツールバーにドラッグするか右クリックで「お気に入り」に登録してお使いください。

別窓を開くために、"location.href="を"window.open()"に変更しただけです。

window.open() は、広告のポップウィンドウを開くためによく使われるので、広告のポップアップを防ぐ機能を持ったブラウザやツールバー(Googleツールバーとか)などを使われていると、動作しない場合があります。ポップアップブロック機能を解除する必要があります。


余談ですが。
ブックマークレットは、手軽で、効果も高いものなので、自分でチャレンジされる人が増えるといいなと思います。

公開されているブックマークレットのソースを見て変えてみるのが早道です。
自分の作りたい機能とよく似たブックマークレットを使って改造してみるのが簡単です。僕もそれで覚えました。

できたものを公開される方は、以下のページを読んでおくことをオススメします。

Bookmarklet - ブックマークレットを作成する際のポイント

もっと興味が出てきたなら、Javascriptについては、各種リファレンスが公開されてるのでそちらを三項に。

JavaScriptビジュアル・リファレンス シーズ エムディエヌコーポレーション 2004-11 売り上げランキング : 29,745 おすすめ平均 Amazonで詳しく見る by G-Tools

開発環境について。
Firefox をお使いの方は、以下のエクステンションがオススメです。

Mozilla Update :: Extensions -- More Info:FireBug - All Releases
https://addons.mozilla.org/extensions/moreinfo.php?id=1843&application=firefox

コマンドライン感覚で、Javascriptを実行することができるデバッガです。
簡単なブックマークレットならこれですぐ試せます。
ブラウザウィンドウの下のアイコンからいつでも呼び出せるので便利です。

ページ内の要素も参照できるので、Greasemonkey用のスクリプトを作るときにも重宝しています。

例えば、↓の英次郎の検索結果のページで、FireBugに"document.getElementsByTagName('ul')[0].innerHTML"と打ち込めば、検索結果部分だけ見ることができます。

スペースアルク：英辞郎検索結果



やる気があれば選択した文字列の訳を画面遷移なしにツールチップで表示とかも作れそうな気が。提供元に怒られるかな？

他にも、いろいろHackする時に便利です。

例えば、Google ローカルで、FireBugに"gApplication"と打ち込めば、オブジェクトが返ってきます。その際に右端の"JS"をクリックすると、オブジェクトのプロパティが参照できます。

Google Maps(Local) で座標位置を取得するブックマークレットはこの機能を使って作りました。


さらに余談。
この記事のスクリーンショットは、Going My Wayさんが紹介されていた flickr and WEBIMAGER を使ってみました。

以前に紹介した Performancing for Firefox と組み合わせることで、スクリーンショットの入った記事が簡単に書けますね。

はてブコメント中毒で、FEEDBRINGERを使ってる人向けの Greasemonkey スクリプト。

id:kusigahama:20051212:p3 を直した
http://d.hatena.ne.jp/faerie/20051212#1134394421

aki77の日記 - Google x はてブ のコメントをツールチップ表示
http://d.hatena.ne.jp/aki77/20060130/1138609981

この２つをFEEDBRINGERに組み合わせて、被はてブ数を表示、かつコメントをツールチップ表示。
素晴らしいスクリプトを提供されている、お二方に感謝。

• fb.user.js

インストールは、右クリック(Mac は ctrl+クリック) → "Install User Script..." で。

最初は、RSSリーダー（FEEDBRINGER）でも、いぬびーむさんの"全サイトはてブ化"が使えたらと思って触りはじめたんですが、できあがったら、はてなRSSの機能そのままだったという。

Bloglines 用とかもあるといいかも。どなたか。

ちなみに、FEEDBRINGER用には、↓のスクリプトもオススメ。

FEEDBRINGER で未読がないフィードを非表示に
http://lowreal.net/logs/2006/02/25/1

ぼくはまちちゃん！(Hatena) - Googleマップ→わんわん
http://d.hatena.ne.jp/Hamachiya2/20060304/1141466754

というブックマークレットが公開されてます。
これを見て、前回の応用で、Google Maps(Local) に はてなワンワンワールドへのリンクを追加するGreasemonkeyスクリプトを作ってみました。

• googlemapstowanwanworld.user.js

インストールは、右クリック(Mac は ctrl+クリック) → "Install User Script..." で。

Google Maps(Local) に”Go www!”というワンワンワールドへのリンクが追加されます。

Googleマップ再び！
Hagex-day.info

各地の名所↑巡りのお供にどうぞ。

2006/03/13追記：
GoogleMapsの仕様変更で動作しなくなっていたので修正。

Googleローカルは、住所で検索すると、ほぼその場所に飛んでくれるので、住所から地図上の位置を割り出すのに便利です。

最近、Google Maps API を使ったものを仕事で作ってるのですが、マーカーを立てる座標を取得するのに、この機能を使おうと思ってブックマークレットを作りました。

座標を取得

Google Maps(Local) で実行すると、現在の緯度経度を表示します。

↓直接、クリップボードに転送するようにしたもの。

座標を取得　IE専用

座標を取得　Firefox専用

リンクをツールバーにドラッグするか右クリックで「お気に入り」に登録してお使いください。

Firefox専用は to-zero.com さんのコードを使わせていただきました。
to-zero.com: Fotolifeの画像リンクタグ取得Bookmarklet
http://www.to-zero.com/2006/02/fotolifebookmarklet_1.html

問題は、検索しても出てこない住所ですね。
わりとあるようなので、それが大変かも。

2006/03/13追記：GoogleMapsの仕様変更で動作しなくなっていたので修正。
2006/05/19追記：GoogleMapsの仕様変更で動作しなくなっていたので再修正。
2006/05/30追記：再修正。アップデート激しすぎ。
2007/05/02追記：再修正。久しぶりのアップデート。

怪獣が出るらしいと聞いて潜入したら、
燃やされましたw

はてなワンワンワールド
http://world.hatelabo.jp/

　はてなブックマークのコメントが自動的に表示される、いぬビームさんの「全てのサイトをはてブ化するGreasemonkeyスクリプト」。
　もはや、これナシは考えられないほど、便利です。

　まだ、未体験の人むけに体験版が公開されました。

　これ、単なる体験版というだけでなく実用的な気がします。
　たまに、人にメールなどでおもしろいページを教える時に、はてブのコメントも含めて見せたいと思う時が。
　そういう時に、この体験版を使って送ればどんな環境の人でもコメントが見れて便利です。

　なので、今、見ているページを、この体験版で表示するブックマークレット。

hb_addict

↑のリンクをツールバーにドラッグするか右クリックで「お気に入り」に登録してお使いください。