OpenSocial jQuery に mixi Platform 固有の拡張機能を追加する jQuery プラグインを公開しました。

おはようございます。ちょっと体調のすぐれない Nobuhiro Nakajima です。

OpenSocial jQuery mixi Platform 1.0.0 をリリースしました。
http://code.google.com/p/opensocial-jquery/ -- Downlaod
http://code.google.com/p/opensocial-jquery/wiki/PluginMixi -- Document

OpenSocial jQuery mixi Platform は mixi 固有の拡張機能を OpenSocial jQuery に追加するための jQuery プラグインです。OpenSocial jQuery 本体に続けて、OpenSocial jQuery mixi Platform をロードして使ってください。

<script type="text/javascript" src="opensocial-jquery.js"></script>
<script type="text/javascript" src="opensocial-jquery.mixi.js"></script>

外部サイトに誘導する

jQuery.view を使って、外部サイトに誘導できます。このとき、外部サイトの URL を指定します。また、パラメータを指定すると QUERY_STRING に変換して URL に付与します。

// http://www.google.com/
$.view('http://www.google.com/');

// http://www.google.com/search?q=corgi
$.view('http://www.google.com/search', { q: 'corgi' }); 

ただし mixi の URL を指定したときは、外部サイトとみなさず、即ページ遷移します。

// http://mixi.co.jp/
$.view('http://mixi.co.jp/');

// http://mixi.jp/show_profile.pl?id=0123456789
$.view('http://mixi.jp/show_profile.pl', { id: '0123456789' });

また、従来どおり、ビューの切り替えや現在のビュー名の取得もできます。

$.view('profile');
$.view('home');
$.view('canvas', { q: 'corgi' });
console.info($.view()); // profile, home, canvas

参加コミュニティを取得する

jQuery.getData を使って、ユーザの参加コミュニティを取得できます。このとき url に /communities からはじまるパスと @viewer, @owner, ユーザID のいずれかを指定します。jQuery.ajax や jQuery.get も同様です。

$.getData('/communities/@viewer/@self').next(function(communities) {
  $.each(communities, function(i, community) {
    console.info(community.id); // コミュニティID
    console.info(community.userId); // ユーザID
    console.info(community.url); // コミュニティURL
    console.info(community.name); // コミュニティ名
    console.info(community.thumbnailUrl); // コミュニティ画像
  });
  console.info(communities.totalResults); // 参加コミュニティ数
}).error(function(e) {
  alert(e+'');
});

学校を選択する

jQuery.getData を使って、VIEWER の母校や在学中の学校を選択できます。このとき url に /schools からはじまるパスと @selected を指定します。jQuery.ajax や jQuery.get も同様です。

$.getData('/schools/@selected').next(function(schools) {
  var school = schools[0];
  console.info(school.token); // 学校トークン
  console.info(school.divisionId); // 学校区分ID
  console.info(school.division); // 学校区分名
});

学校リストを取得する

jQuery.getData を使って、VIEWER の母校や在学中の学校リストを取得できます。このとき url に /schools からはじまるパスと @viewer を指定します。jQuery.ajax や jQuery.get も同様です。

$.getData('/schools/@viewer/@self').next(function(schools) {
  $.each(schools, function(i, school) {
    console.info(school.token); // 学校トークン
    console.info(school.divisionId); // 学校区分ID
    console.info(school.division); // 学校区分名
  }
  console.info(schools.totalResults); // 学校数 = schools.length
}).error(function(e) {
  alert(e+'');
});

マイミクを招待する

jQuery.invite を使って、マイミクを招待できます。このとき @friends を指定します。招待したマイミクのユーザIDリストを取得できます。

$.invite('@friends', function(ids) {
  $.each(ids, function(i, id) { console.log(id) }); // ユーザIDリスト
});

また @friends を省略しても同じことができます。

$.invite(function(ids) {
  $.each(ids, function(i, id) { console.log(id) }); // ユーザIDリスト
});

さらに Deferred チェーンを使っても同じことができます。

$.invite('@friends').next(function(ids) {
  $.each(ids, function(i, id) { console.log(id) }); // ユーザIDリスト
}).error(function(e) {
  alert(e+'');
});

同級生を招待する

jQuery.invite を使って、同級生を招待できます。このとき @classmates を指定します。招待した同級生のユーザIDリストを取得できます。

$.invite('@classmates', function(ids) {
  $.each(ids, function(i, id) { console.log(id) }); // ユーザIDリスト
});

さらに Deferred チェーンを使っても同じことができます。

$.invite('@classmates').next(function(ids) {
  $.each(ids, function(i, id) { console.log(id) }); // ユーザIDリスト
}).error(function(e) {
  alert(e+'');
});

コンテナを判別する

jQuery.container.mixi を使って、コンテナが mixi Platform かどうか判別できます。
他コンテナも含めて 1つの JS ファイルにまとめるときに役立ちます。

if ($.container.mixi) { ... } // mixi Platform

.mixi クラスを使って、コンテナが mixi Platform かどうか判別できます。
他コンテナも含めて 1つの CSS ファイルにまとめるときに役立ちます。

<style type="text/css">
.mixi p { color: red; } /* mixi Platform */
</style>

OpenSocial jQuery に対する質問や要望は Google Group で受け付けています。開発中の最新情報も入手できます。ぜひご参加ください。

OpenSocial jQuery Discussion
http://groups.google.com/group/opensocial-jquery

-- 2009-12-10 スクリーンキャプチャの追加

Enhancing of jQuery.ajax with JSDeferred 1.0.0 をリリースしました

こんばんは。なかじまんです。Enhancing of jQuery.ajax with JSDeferred 1.0.0 をリリースしました。

http://plugins.jquery.com/project/ajax-deferred

Enhancing of jQuery.ajax with JSDeferred は jQuery.ajax とショートカットのチェーンとエラーハンドリングを実現するものです。基本的な使い方は、過去エントリの Enhancing of jQuery.ajax with JSDeferred: jQuery.ajax チェーンとその short cut のエラーハンドリング を見てください。

今回のリリースでは、次のとおり jQuery.ajax とショートカットで deferred チェーンできるようにしました。

$.getJSON('/foo').next(function(foo) {
console.log('next', foo);
return $.getJSON('/bar').next(function(bar) {
console.log('bar', bar);
return [foo, bar];
});
}).next(function(foobar) {
console.log('foobar', foobar[0], foobar[1]);
}).post('/foo.json', { foo: 'bar' }).next(function() {
}).error(function(status) {
console.log('error', status);
});

また jQuery.ajax 以外から deferred チェーンを開始できるように jQuery.next を追加しました。さらに deferred チェーンを同期できるように jQuery.call を追加しました。これで、より複雑な状況にも対応できるようになりました。

$.next(function() {
function foo(a, b) {
return a + b;
};
return $.call(foo, 10, 1);
}).next(function(sum) {
console.log(sum);
});

また jQuery.wait を追加して、ちょい待ちにも対応できるようになりました。

$.wait(10).next(function() {
});

まとめると、次のメソッドが使えることになります。

jQuery.wait
jQuery.next
jQuery.call
jQuery.ajax
jQuery.get
jQuery.getJSON
jQuery.post
Deferred.next
Deferred.error
Deferred.call
Deferred.fail
Deferred.cancel
Deferred.wait
Deferred.next
Deferred.call
Deferred.ajax
Deferred.get
Deferred.getJSON
Deferred.post

以上は、次のバージョンの opensocial-jquery でも使えるようにします。