2010年2月24日水曜日

【mixiアプリ】MouseEvent.MOUSE_WHEEL

最初はブラウザのスクロールを止め、Flash上でホイールイベントを処理したかったのが目的でしたが、
mixiにアップするとローカルでは取れていたのに何故か取れない状況に陥ったために色々と調べてみました。

検証にはIE6,FireFox3.5,GoogleChromeを使用しました。

元々まともにイベントが取れたのはIE6だけで、他の二つは取ることは出来ていませんでした。
更にブラウザのスクロールを止める処理を追加するとIE6でも取ることは出来なくなりました。

ブラウザのスクロールを止めるにはJavaScript側に以下のコードを追加します。

if(window.addEventListener){
window.addEventListener('DOMMouseScroll', wheel, false);
}
window.onmousewheel = document.onmousewheel = wheel;

function wheel(event){
if(!event){
event = window.event;
}
if(event.preventDefault){
event.preventDefault();
}
event.returnValue = false;
}


これでブラウザのスクロールが無効になります。

しかし、Flash側ではイベントが取れません。
何故イベントが取れないのか?正直まだわかっていません。

ローカルに置いてあるswfをブラウザにドラッグしていって起動したときは問題なく取れていました。
mixiにアップした時に取れなくなるのはmixiに原因があるのか?と、mixiアプリの仕様などを熟読

1箇所怪しい場所を発見
http://developer.mixi.co.jp/appli/pc/lets_enjoy_making_mixiapp/use_flash
>embedタグについて、wmode属性を指定します。wmode属性値として、”transparent”もしくは”opaque”を記述します。
>マウスホイールイベントをFlash上で拾うことができない

でも今回作ったやつにwmodeは指定していないのでこれではないのかも

このままではラチがあかないので強硬手段!
JavaScript側でスクロール値が取れるので、ActionScriptのExternalInterfaceの機能を使い、
JavaScript側からFlash側にスクロール値を送信する処理を作りました。

スクロール値を受け取ったFlashはその値を元にMouseEventを作成してdispatchEventをステージに流し、
擬似的にホイールイベントが発生するようにして対応しました!

その時JavaScriptのwheel関数に以下の処理を追加しました。

var delta;
if(event.wheelDelta){ /* IE/Opera */
delta = event.wheelDelta/120;
if(window.opera){ /* Opera9 */
delta = -delta;
}
}else if(event.detail){ /* Firefox */
delta = -event.detail/3;
}

一応これで動いているのでこのまま行ってみようかと思います。
もっと正しい方法があれば教えていただきたいです。

2010年2月3日水曜日

Twitterクライアント OAuth認証処理(mixiアプリ)

前回はデスクトップアプリ(AIR)での認証でしたが、今回はブラウザタイプということで若干処理がことなる。
Twitterのアプリ登録ではApplication TypeとCallback URLが違うくらい。

とりあえず、AIRと違ってアプリから別ドメインへの通信は設定が必要だったり、mixiアプリ自身gadgets.io.makeRequestを使用して通信しなければいけなかったりするのでソースをそれに合うように変更。
http://developer.mixi.co.jp/appli/pc/lets_enjoy_making_mixiapp/require_servers

最初はとりあえず確認のため自分のタイムラインを取得、形式はXMLで取得しました。
受け取ったレスポンスデータをFlashに渡してやって、内部でXMLデータに変換し、解析。

次に認証処理を作ったのですが、どうしてもCallback URLが呼ばれないでデスクトップアプリの時みたいにPINコードが表示される。いろいろ調べてたら以下のようなページを見つけた。

opensocial-jqueryを使ってMixiアプリを作ろうとしてみた

opensocial-jqueryを使ってMixiアプリを作ろうとしてみた(後日談)

>※ mixiアプリから外部サーバへのOAuthによる認証認可要求は、現在サポートされていません。
あれ?無理なの・・・か?よく見たら最初に貼ってるデベロッパーセンターのページじゃんw

うーん、どうしようかなぁ、胡散臭い手だけどPINコード表示は行くんだから、それを手入力してもらうとか!? ブラウザアプリでそれはなんか微妙だなぁ、まだ試してないから出来るかもわからないけどw

後は、mixi経由じゃなくて自分んとこのサーバーにその処理を任せちゃうとかね。それなら行けるのかな?

2010年2月2日火曜日

Twitterクライアント OAuth認証処理

タイムライン上のFrom○○の部分にクライアント名を出したい場合はOAuth認証の処理が必要なのでそれの導入メモ。

大体下記のサイトを参考にして作成。

coderranger.com blog
http://www.coderanger.com/blog/?p=59

google code (暗号化用のライブラリ)
http://code.google.com/p/as3crypto/

posterous
http://tech.yambal.net/flex-air-oauth-twitter-httpbitly4akwpm

某開発者の独り言
http://aqubiblog.blogspot.com/2009/11/twitterfriendfeed.html

まちゅダイヤリー
http://www.machu.jp/diary/20090818.html#p01

2010年2月1日月曜日

Twitterクライアント登録

自分でTwitterのクライアントを作る場合、Twitterにてアプリケーション登録が必要です。

http://twitter.com/oauth_clients

1.Twitterにログインした状態でアクセス
2."Register a new application"を選択
3.必要な情報を入力
  Application Name (日本語可)
  Description (日本語可)
  Application Website
   を入力しておけば大丈夫そう

  Application Typeはとりあえず"Client"
  Default Access typeは"Read & Write"

4.登録が完了すると、"Consumer key" "Consumer secret"が発行されるのでメモ
  (これがアプリケーションと紐付けるための物になります)