« Google Ajax Feed API の代わりに Yahoo!Pipesを使ってみた | トップページ | 『はてブBOX』で、はてブコメントにはてなスターを付ける! »

2008/03/06

マウスホイールではてブコメント流し読み!『はてブBOX』(ブックマークレット/Greasemonkey/SeaHorse)

変わリ種はてブコメントビューア第3弾!
今回の『はてブBOX』はこれまでの『はてブニコす』や『はてブぽっぷ』と比べ、実用性も高いと思います。はてブコメントファンの方はぜひお試しを!
【追記:2008/03/07】……って、Greasemonkey&SeaHorseのリンク、はてブポップになっていた……丸一日そのまま放置、すみません。
あとついでに、日付・時刻も表示するように修正しました(ver.0.01a)。
が、Yahoo!Pipes経由でとると、ときどき時間が9時間ずれる……いつもならともかく、ときどきというのが、謎(?_?)。

【追記:2008/03/09】結局、y:publishedではなくdc:dateから取ることにした。
あと、履歴は今後記事の最後にまとめることにした。
ブックマークレットの方はともかく、Greasemonkey/SeaHorseは更新の都度インストールしなおしになるのが難点。外部スクリプト呼出し専用のを作ってもいいんだけど……。
■特徴
  1. 見ているページにはてブコメントがついていたら、右下にコメント数付きのBOXを表示。
  2. BOXのあたりにマウスカーソルを当てると、はてブコメントを付けているユーザのアイコンを読込んで表示。
    アイコンが多いと下にはみ出して見えなくなりますが……仕様です(w。
  3. アイコンにマウスカーソルを当てると、そのユーザのコメントをポップアップ表示。
  4. マウスホイール、もしくは[←][→]のカーソルキーで、コメント切り替え。
  5. BOXのクリックでそのページのはてなブックマーク画面を、アイコンのクリックでそのユーザのはてなブックマーク画面を、それぞれ呼出し。
  6. はてブコメントにはてなスターをつける機能付き。
要は『はてブぽっぷ』のけれん味(笑)をなくして、操作性を向上させたものですな。
マウスホイールやキー操作によって、スクロールすることなく次々とコメントを切り替えられるので、なかなか快適!だと自分では思ってます(笑)。
IE7とFirefox2.0.0.12でしかテストはしてません……あ、Operaだとマウスホイールが効かないみたい……そのうち余裕があれば調べてみよう。

【追記:2008/03/09】OperaはDOMMouseScroll未対応だったか。onmousewheel使うしかないみたい。修正してみたつもり。
■実行イメージ

Hbboxsample1

■ブックマークレット
ブックマークレットの登録方法等はこちら→【Web】ブックマークレットのブラウザ毎の登録方法
■Greasemonkey&SeaHorse
Seahorseの使い方については、例えばこちらとかこちら。 Greasemonkeyの使い方については、例えばこちら
以下、個人的な覚書。
  • IE7だと"keypress"ではカーソルキーが取得出来ない……"keypress"でとれるのは文字入力出来るキーだけ?
  • キー入力のイベント、Firefoxだと"keydown"は単発、"keypress"はリピート可、なのかな?
  • キー入力イベントを設定する対象となるオブジェクトはdocumentでいいのかな?IE7だとdocument.bodyでもいいみたいだけれど。他のオブジェクト(divとか)だとダメっぽい。
  • キー入力イベントを使うときは気をつけないと思わぬ副作用が……[→]カーソルキーで横スクロールしちゃったりとか(笑)。
  • イベントをキャンセルするには、ハンドラ内に細工するのが有効か。
    IE7だとハンドラの戻り値をfalseにするか、event.returnValueにfalse設定。
    Firefoxだとevent.preventDefault()[イベントキャンセル]、かな。
  • event.stopPropagation()[伝播抑制]は多分、IE7のevent.cancelBubble=true相当。 IE7はイベントバブリング(子要素→親要素)固定(?)だけど、FirefoxはaddEventListenerの第3引数で切り替え出来る(true:イベントキャプチャリング)……と思ってよいのかな?
■更新履歴
  • [2008/03/09](ver.0.01e~f)
    1. IEでページによってはDOMオブジェクトの挿入時にエラーとなる不具合修正(document.body.insertBefore(DOM object,document.body.lastChild)→document.body.appendChild(DOM object))(ver.0.01e)。
    2. [Shift]キーを押しながらBOXからマウスカーソルを外すと、コメント表示を維持したままになるように修正(ver.0.01f)。
      これにより、コメント部分に移動して☆を付けた人を確認したり、コメントから引用部分を選択してから☆を付けたり、コメントを付けたりすることが出来るようになった。
    3. Firefoxでコメントを切替えるときに一瞬消えてから再表示されていたのを改善(ver.0.01f)。
  • [2008/03/08](ver.0.01d)
    1. はてブコメントに対してはてなスターを付ける機能追加。
    2. 日付取得をentry['y:published'].utimeから行っていたのをentry['dc:date']からに修正。
    3. その他バグフィックス。
  • [2008/03/07](ver.0.01a~c)
    1. コメント日付・時刻表示(ver.0.01a)。
    2. 細かいバグフィックス(heigth→heightとか(w)(ver.0.01b)。
    3. Operaのホイール対応(ver.0.01c)。
  • [2008/03/06](ver.0.01)
    1. 初版リリース。

« Google Ajax Feed API の代わりに Yahoo!Pipesを使ってみた | トップページ | 『はてブBOX』で、はてブコメントにはてなスターを付ける! »

パソコン・インターネット」カテゴリの記事

おもいつき」カテゴリの記事

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック

» 『はてブBOX』で、はてブコメントにはてなスターを付ける! [風柳亭 - 別館:書庫のある庵 -]
はてブコメントビューア『はてブBOX』を改修し、はてブコメントにはてなスターを付けられるようにしてみました(ver.0.01d)。 こころにくいあんちくしょうのコメントに星をふりまいてあげましょう(笑)。...... [続きを読む]

« Google Ajax Feed API の代わりに Yahoo!Pipesを使ってみた | トップページ | 『はてブBOX』で、はてブコメントにはてなスターを付ける! »

戻るリンク追加

カレンダー

2019年9月
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30          

ココログカレンダーPlus

検索


    • Web全体 サイト内
    • 蔵書のISBNを入力して下さい
    • はじめる前
      初級者向け
      上級者向け
      ブログ紹介
      結果を表示

最近のトラックバック

コメントリストツリー化

無料ブログはココログ