Vimmers でgithubアイコンがない場合の対処

[koron]

Vimmersにおいてgithubしか無い人がgithub(gavatar)にアイコンを設定してないと
progress画像が表示され続けてしまいます。
これをoctocatなgithubのデフォルトアイコンにしたいです。

[koron]

具体的には、現時点で

• Marc Weber
• Christian Brabandt
• Shaula

の3つ。

[hail2u]

GitHubのプロフィール画像はGravatarなので、GitHubのAPI経由で取れるメールアドレスを使ってGravatar APIを叩く……というかGravatarの画像URL作るのが良いんじゃないかと。

GravatarのAPI的な奴では画像がない場合のデフォルト画像を設定できるので、そこでOctocatにすれば良いと思います。メールアドレスのハッシュがクライアントサイドのJavaScriptだとそこそこ面倒ですけど、ライブラリはすぐ見つかると思うのでなんとかなるはず。

[koron]

@hail2u 任せた!

[zunda]

横からすみません。GitHub ARIでGravatar IDも得られるかもしれません
http://developer.github.com/v3/users/

[hail2u]

@zunda あーそのとおりですね。

と思って書き換えようかと思ったら、GitHubのAPI自体が既に普通にGravatarの機能を使ってなかったらOctocatの画像が返るようになってるみたいなので、コードのバグな感じ。

画像をすり替えるコールバックをelementCacheを構築する時にだけ発火させてるので、最初にランダムに50選ばれたところに上記の人達が入っていない場合、$("img." + github)が当然見つからないためすり替えが起こらないということだと思います(50人に選ばれると大体ちゃんと摩り替わる)。実際にバグが表面化するのはShow All押した時で、elementCacheにあるロード中画像のままHTMLに追加され、その後それをすり替えるというコードがないため。

なのでelementCache構築時じゃなくて、refreshVimmers()の中のループ内でappend()したすぐ後に、GitHubアカウント持ちの場合は$.getJSON()仕込んでやるという形にすれば必ず$('img.' + github)が見つかるようになり、うまく画像が摩り替わるんではないかと思います。

とコードを書かないで説明してみました。jqmlよく知らないので書くのメンドイです。

[mattn]

実はコード書くのに制限あるのでjqmlやめたい

On 6/9/13, Kyo Nagashima notifications@github.com wrote:

@zunda あーそのとおりですね。

と思って書き換えようかと思ったら、GitHubのAPI自体が既に普通にGravatarの機能を使ってなかったらOctocatの画像が返るようになってるみたいなので、コードのバグな感じ。

画像をすり替えるコールバックをelementCacheを構築する時にだけ発火させてるので、最初にランダムに50選ばれたところに上記の人達が入っていない場合、$("img." + github)が当然見つからないためすり替えが起こらないということだと思います(50人に選ばれると大体ちゃんと摩り替わる)。実際にバグが表面化するのはShow
All押した時で、elementCacheにあるロード中画像のままHTMLに追加され、その後それをすり替えるというコードがないため。

なのでelementCache構築時じゃなくて、refreshVimmers()の中のループ内でappend()したすぐ後に、GitHubアカウント持ちの場合は$.getJSON()仕込んでやるという形にすれば必ず`$('img.'

• github)`が見つかるようになり、うまく画像が摩り替わるんではないかと思います。

とコードを書かないで説明してみました。jqmlよく知らないので書くのメンドイです。

---

Reply to this email directly or view it on GitHub:
#93 (comment)

• Yasuhiro Matsumoto

[koron]

こういうの なら乗り換えたい。

が、それとこれとは関係ないハズ。

[koron]

ちょっと試してたら gh から API Rate Limit Exceeded for XXX.XXX.XXX.XXX だって。
そういうのもあるのかw

[koron]

e893aa3 で実装はした。動作は未確認。

• element 構築後に呼び出されるフック機構を追加
• フック機構に gh のアイコンローダを登録
• ghアイコンローダでは $ ではなく 構築された element の find() を使う

jqmlよく知らないので書くのメンドイです。

本件と jqml は本質的には関係なかった。

[koron]

動作確認できたら閉じる。

[hail2u]

動いてそう。

jqml使ってHTML作った後、DOMに追加する前、に差し替えてるのか、描画コスト低そうで良いですね。

[koron]

jqml は関係ないです。 「elementCache に入れるようにしたから $() では検索できない場合がある」 ってことでした。
なので検索できるように element.find() に変えただけです。

[koron]

@hail2u おっと、原因の調査&動作確認ありがとうございます。