NOBODY:PLACE

キーボードショートカットを実装するjQueryプラグイン「hotkeys」【feedpost tips】

昨日リリースしたTumblr用ツール「feedpost」で採用している技術を紹介するシリーズ。 2回目はキーボードショートカットを実装するjQueryプラグイン「hotkeys」。導入はとっても簡単で、jQueryと一緒に読み込み、イベントをキーに合わせて設定してやればOK。フォーカスがdocumentにあるときの設定は例えばこう。このサンプルでは「J」キーを押すと「pressed J key」というポップアップが表示されます。input欄やtextarea欄にカーソルがあるときには反応しないので、神経質になりすぎることなく設定出来ます。

（続き）【メモ】 callbackで「#_=_」が付いて来てしまう件への対応

先日、OAuthで認証したあとのcallbackのURLの末尾に「#_=_」が付いて来てしまうことがあるのを回避するというのをメモったのですが、【メモ】 callbackで「#_=_」が付いて来てしまう件への対応 | mutter これでは上手く動かないことがあるのが解りました。具体的には、リダイレクト先で期待するURLはこれだったとき、

http://hoge.com/?foo=bar

コールバックからのリダイレクトがこれになり、

http://hoge.com/?foo=bar#_=_

前回のスクリプトで是正するとこうなってしまいます。

http://hoge.com/

引数が落ちちゃう。というわけで、対応しました。

【メモ】 callbackで「#_=_」が付いて来てしまう件への対応

このスクリプトだと引数が落ちてしまうようです。それに対応したのがこちら（続き）【メモ】 callbackで「#_=_」が付いて来てしまう件への対応 | mutter

どういう理屈なのか解りませんが、OAuthで認証したあとのcallbackのURLの末尾に「#_=_」が付いて来てしまうことがあるようです。検索した限りではFacebookがそういう仕様のようで、Tumblrも同じような仕様です。多分、サービス側に何らかの理由があってこうなっているんだとは思うのですが、受け取る側からするとちょっと不都合があります。例えば、

http://hoge.com/return

というURLをcallbackに指定してリクエストを投げた場合、こんな感じで返ってきます。

http://hoge.com/return?oauth_token=xxx&oauth_verifier=yyy#_=_

んで、何らかの処理をしてサイトのトップページにリダイレクトをしてやると（例はSymfony）、

$this->redirect('hoge/index')

URLはこうなってしまいます。

http://hoge.com/#_=_

本当はこうしたいのに。

http://hoge.com

もしかしたらフレームワーク側で対処出来るのかも知れませんし、ブラウザの設定なのかも知れませんが、検索して情報を収集してみた結果「JavaScriptでアドホックな対応」というのがポピュラーなようなので、とりあえずそれに従うことにしました。

[ExtJS4] Storeに設定したイベントが何回も呼び出されてしまう【メモ】

Storeにイベントリスナーを設定すると、読み込まれる度に何度も何度も呼ばれてしまうことがあります。また、呼ばれる回数が読み込む毎に増えて行ってしまう場合もあります。要はコーディングが悪いと言うことなのですが、初心者である自分の反省も兼ねてメモ。

ダメな例

var store = Ext.getStore('sampleStore');
store.on({
load : {
fn : {
console.log('load event fired.');
}
}
});

[ExtJS4] Grid上で右クリックした行を選択する【メモ】

こうですか、わかりません！いや一応動いてるんですけどね… そんなことよりも、Gridとコンテキストメニューのスコープで嵌まってるよ… まぁもう嵌まるのにも慣れてきたけどね。

[ExtJS4] jsonデータとextraParamをPOST送信するとextraParamがGETで送られてしまう【メモ】

なんだかえらい嵌まった上に検索しても日本語情報が無かったのでメモ。

【Tumblr】 Tumblr Queueの最新ページへのリンクを生成するGreasemonkeyを更新しました。（0.2.3）

Tumblr Queueの最新ページへのリンクを生成するGreasemonkeyを更新しました。

インストール

https://gist.github.com/raw/614547/tumblr_queue_latest_link.user.js

変更点

ダッシュボードのデザイン変更に対応しました。

更新履歴

0.2.2 -> 0.2.3 (2012/09/08)

ダッシュボードのデザイン変更に対応しました

0.2.1 -> 0.2.2 (2011/10/29)

QueueのURL変更に対応しました

0.2.0 -> 0.2.1 (2011/09/06)

ダッシュボードのデザイン変更に対応しました

0.1.1 -> 0.2.0 (2011/06/12)

syoichiさんのコードを受け入れ

[ExtJS4] コンストラクタ的な要素の呼ばれる順【メモ】

ただのメモです。

Controllerの場合

init

It is called before the Application’s launch function is executed so gives a hook point to run any code before your Viewport is created.

Viewportがインスタンス化する前に呼ばれます。

onLaunch

A template method like init, but called after the viewport is created. This is called after the launch method of Application is executed.

Viewportがインスタンス化された後に呼ばれます。

Componentの場合

initComponent

constructor

インスタンス化されるときに実行されます。2つはほぼ同時に実行されますが、中身が全く同じと言うことではないようです。詳細は以下のエントリ参照。 Extjs4 initComponentとconstructorの違い – 日々精進

createdFn

Optional callback to execute after the class is created, the execution scope of which (this) will be the newly created class itself.

Ext.defineの第3引数。そのクラスが生成されたあとに実行されるコールバック関数。「created」ってのはインスタンス化ではなくてファイルが読み込まれたとき…と言うような気がする（後述の実行順参照）

実行順例

Component: createdFn
Controller: init
Component: constructor
Component: initComponent
Application: launch
Controller: onLaunch

ややこしい…

$.post()のコールバックが動くのはHTTPステータスコードが2xxのとき（jQuery）

前回の続き、というか補足メモ。 jQueryで作るAjaxな検索フォーム（テスト） | mutter

JavaScript: 検索部分

function sampleSearchFilckr () {
var word = $('#sampleSearchWord').val();
if(!word) {
alert('検索語を入力してください');
return false;
}
//検索
$.post(
'/sample/flickr',
{"q": word},
function(data, status) {
//searchに成功したら結果を表示する
$('#sampleSearchResult').html(data);
},
"html"
);
}