ラベル opensocial-jaxer-client の投稿を表示しています。 すべての投稿を表示
ラベル opensocial-jaxer-client の投稿を表示しています。 すべての投稿を表示

2009-08-12

Golazo GeoNotes is available. It's social web app that integrated with Google Friend Connect highly.

Hello,

I'm afraid my expressions may be rude or hard to read, because I'm not so good at English. But please, please be patient! I will try hard to learn English!

Thank you very much for the chance to introduce Golazo GeoNotes.

Golazo GeoNotes
http://golazo.aptanacloud.com/



Golazo GeoNotes is the social web application that integrated with Google Friend Connect (GFC) highly. I developed this demo app from the following purpose.

* What kind of a social web application can we build when we use GFC platform and API?

* When we use GFC platform and API, how far we can develop a social Web application effectively?

In this app, you post a geographic text, and can associate a geographic coordinate automatically. And you can share the text with a friend.

This app depends on GFC platform and API for the following social functions.

* With sign-in button of GFC and and two-legged OAuth by fcauth this app authenticate an account and link a profile.

* This app displays Site View, Home View, Profile View, and Canvas View with a social graph of GFC.

* This app displays members, friends, footprints, activities, chat, comment, and recommend with a Social Gadgets in each
view.

* This app depends on Members Gadgets for the management of the profile, a search and the invitation of the friend.

A development environment and the volume of this app are as follows.

* Aptana Cloud (Jaxer, Apache2, MySQL5)
* ActiveJS
* opensocial-jaxer-client
* opensocial-jquery
* jQuery XML to JSON Plugin
* CSS Browser Selector

* 896 lines of JavaScript on client and server.
* 10 pages of HTML
* 2 tables on database
* 9 social gadgets

I want to contribute to the Jaxer, GFC, and OpenSocial with this demo app. Did you think to develop the custom social web application that used Jaxer and GFC?

Thank you.

2009-08-10

Google Friend Connect をベースとしたウェブアプリのデモサイトを公開しました

こんばんは。なかじまんです。ブログの投稿は久しぶりです。

Google Friend Connect をベースとしたウェブアプリのデモサイトを公開しました。Golazo GeoNotes という位置付きメモを投稿して、友達とそのメモをタイムラインで共有しようというものです。

Golazo GeoNotes
http://golazo.aptanacloud.com/

Golazo GeoNotes を開発した目的は 2つあります。1つ目は Google Friend Connect というプラットフォームと API を使うと、どんなソーシャルなウェブアプリが構築できそうか、その可能性を確認することです。2つ目は、プラットフォームと API を活用することで、どのくらい作らずに済みそうか、その効率を確認することです。

これらの考察は、いろいろな方から助言などを貰いながら、今後じっくり検討していきます。ここでは、まず Golazo GeoNotes がどんなウェブアプリなのかざっと紹介します。Google Friend Connect の使い方(使われ方)がなんとなく伝わると期待しています。

サイトビュー

いわゆるトップページです。すべての位置付きメモを新着順でリスト表示します。

Recent members は、最近アカウント登録したユーザのサムネイルを表示します。Recommended notes は、人気のあるメモのランキングを表示します。これらは、ガジェットを使って実現しています。



ホームビュー

サインインして使う自分専用ページです。自分と友達の新着メモをリスト表示します。また、位置表現を含むテキストを入力して投稿すると、そのテキストから緯度経度を検出して、位置付きメモとして保存します。

Friends' footprints は、友達のあしあとをリスト表示します。Eiji Kitamura さん作の あしあとガジェット を使っています。Friends' activity は、友達のアクティビティをリスト表示します。こちらも、ガジェットを使って実現しています。



プロフィールビュー

第三者から見えるアカウント各自のページです。各自の新着メモをリスト表示します。アカウントの簡易プロフィールを表示します。その View full profile から詳細プロフィールを表示します。

Friends は、アカウント各自の友達をサムネイル表示します。Activity は、各自のアクティビティをリスト表示します。これらは、ガジェットを使って実現しています。



キャンバスビュー

位置付きメモの詳細ページです。投稿したメモをすべて表示します。

メモのコメントをリスト表示します。また、メモにコメントを投稿できます。メモをお気に入りに投票して、人気ランキングに参加できます。そして、その下でランキングを表示しています。いずれも、ガジェットを使って実現しています。



メンバーと友達

サイトの参加メンバーをリスト表示します。また、自分の友達をリスト表示します。友達を探したり、招待したりできます。ガジェットを使って実現しています。



プロフィールの詳細

サイトの参加メンバーの詳細プロフィールを表示します。アカウント各自の参加サイトや、友達、アクティビティを確認できます。こちらも、ガジェットを使って実現しています。



チャット

オンラインのメンバーとチャットなどリアルタイムにコミュニケーションができます。ガジェットを使って実現しています。



設定

簡易プロフィールを表示して確認できます。メールアドレスを変更できます。Edit Profile から Google Friend Connect のプロフィールや設定を編集できます。



サインイン

Google Friend Connect ボタンを使ってサインインします。



Google, Yahoo!(US), AIM, NetLog, OpenID のアカウントが使えます。



Google を選択すると、おなじみのページでログイン手続きします。



OpenID を選択すると、OpenID の入力を求められます。入力すると、各プロバイダにページ遷移してログイン手続きします。



アカウントの登録

はじめに Google Friend Connect ボタンを使ってサインインします。



次に Google Friend Connect とリンクした簡易プロフィールを表示します。



(必要に応じて)メールアドレスを入力し、Create my account ボタンでアカウントを登録します。



アカウントの削除

Delete my account ボタンでアカウントを削除できます。



こんな感じです。ざっと紹介しました。雰囲気は伝わったでしょうか。今後は目的やテーマを絞って、考察していこうと考えています。

2009-06-23

Aptana Jaxer 向けの OS API をベースとした OpenSocial Client Library を作りました

おはようございます。なかじまんです。

Aptana Jaxer のサーバサイド JavaScript 向けの OpenSocial Client Library を作りました。opensocial-jaxer-client と名付け Apache License 2.0 のオープンソースとして Google Code で公開します。



opensocial-jaxer-client は OS API ( Lightweight JavaScript API ともいう) のソースコードをそのままベースとして Aptana Jaxer 向けに手直ししたものです。なので opensocial-jaxer-client を使うと OS API の手軽さそのままで OpenSocial の Server-side integration ができちゃうわけです。

さっそく実例を紹介します。

はじめに opensocial-jaxer-client.js をロードし osapi.init を使って初期化します。rpcUrl は RPC Protocol のエンドポイントです。fcauth は Google FriendConnect の cookie ベースのセキュリティトークンです。現在のリリース 0.1.0 は fcauth のみサポートします。近いうちに consumer key, consumer secret もサポートします。

<script src="opensocial-jaxer-client.js" runat="server"></script>
<script runat="server">

osapi.init({
rpcUrl: 'http://friendconnect.gmodules.com/ps/api',
fcauth: Jaxer.Util.Cookie.get('fcauth03382920006806842951')
});

osiapi.people を使って、プロフィールや友達リストを取得できます。OS API は execute メソッドの引数に与えた関数を非同期でコールバックしますが、opensocial-jaxer-client は同期して結果を戻り値で返します。

var viewer = osapi.people.getViewer().execute();

Jaxer.Log.info('Your name is ' + viewer.displayName);

var viewer = osapi.people.getViewer({
fields: ['profileUrl', 'thumbnailUrl']
}).execute();

Jaxer.Log.info('Your profile URL is ' + viewer.profileUrl);
Jaxer.Log.info('Your thumbnail URL is ' + viewer.thumbnailUrl);

osiapi.appdata を使って、アプリケーションデータの取得、更新、削除ができます。

var r = osapi.appdata.update({
userId: '@viewer', data: { gifts: 'a crazed monkey' }
}).execute();

var data = osapi.appdata.get({
userId: '@viewer', keys: ['gifts']
}).execute();

Jaxer.Log.info('AppData gifts is ' + data[viewer.id].gifts);

var r = osapi.appdata.deleteData({
userId: '@viewer', keys: ['gifts']
}).execute();

osiapi.activities を使って、アクティビティの取得と追加ができます。

var r = osapi.activities.create({
userId: '@viewer', activity: {
title: 'Hello!', url: 'http://example.com/'
}
}).execute();

var list = osapi.activities.get({
userId: '@viewer'
}).execute();

list.forEach(function(data) {
Jaxer.Log.info('Activity title is ' + data.title);
Jaxer.Log.info('Activity URL is ' + data.url);
});

osapi.batch を使って、上記の people, appdata, activities のバッチ操作もできます。

var batch = osapi.newBatch()
.add('viewer', osapi.people.getViewer())
.add('data', osapi.appdata.get({ userId: '@viewer' }))
.execute();

Jaxer.Log.info('Viewer id is ' + batch.viewer.id);
Jaxer.Log.info('Viewer name is ' + batch.viewer.displayName);
Jaxer.Log.info('Viewer thumbnail URL is ' + batch.viewer.thumbnailUrl);
Jaxer.Log.info('AppData gifts is ' + batch.data[batch.viewer.id].gifts);

Aptana Jaxer 向けということで、ほとんどニーズがないかと思いますが、わたし自身、目的があって使えていますので、もしかしたら必要とする人や場面があったりするかも... という願いを込めて、オープンソースとして公開しました。