使ってみよう! Windows Live SDK/API

第12回 Live Messenger Library ―― オリジナルLive Messengerの作成(中編)

この記事を読むのに必要な時間:およそ 9 分

会話の作成とアクティブな会話の一覧表示

まずは,会話の作成とアクティブな会話の一覧を表示できるようにします。

会話の作成

ユーザが会話を新たに作る場合について考えます。会話を表すConversationクラスは,

  • UserオブジェクトのConversationsプロパティ(ConversationCollectionクラス型)のCreateメソッド

により作成できます。Createメソッドの引数には,メンバーのIMAddressオブジェクトを渡します。

今回 作成するアプリケーションでは,ページに表示したメンバー一覧からメンバーをクリックすることで新たに会話を作ります。そこで先ほど書いたメンバー表示の部分を少し変更します。次のようにメンバーをAタグでリンク表示にし,クリックイベントでGihyo.LiveSample.createConversationメソッドを呼び出すようにします。

sb.append('<li>');
sb.append('<a href="#" onclick="Gihyo.LiveSample.createConversation(' +
          "'" + address.get_address() + "'," + address.get_type() + ');return false;">');
sb.append((displayName != '') ? displayName : address.get_address());
sb.append('(' + Enum.toString(Microsoft.Live.Messenger.PresenceStatus, status) + ')');
sb.append('</a>');
sb.append('</li>');

2行追加しました。Conversationオブジェクトを生成するためIMAddressオブジェクトが引数に欲しいところですが,オブジェクトをそのままページに記述できないためアカウントアドレスとアドレスの種類を引数にしています。

Gihyo.LiveSample.createConversationメソッドは次のようになります。ContactsコレクションにはFindメソッドがあり,引数に渡したアドレスとアドレスの種類からContactオブジェクトを取得できます。

Gihyo.LiveSample.createConversation = function(address, type) {
    var contact = Gihyo.LiveSample.User.get_contacts().find(address, type);
    if (contact != null) {
        Gihyo.LiveSample.User.get_conversations().create(contact.get_currentAddress());
    }
}

以上で会話を作成する部分はできました。

アクティブな会話の一覧表示

作成された会話を以下の手順により一覧表示してみましょう。

  1. Userオブジェクト,ConversationsプロパティのCollectionChangedイベントの関連付け
  2. Conversationsプロパティから各Conversationオブジェクトの取得
  3. ConversationオブジェクトのRosterプロパティから会話に参加しているユーザの取得・表示

Conversationsプロパティもコレクションとして扱えます。コレクションの内容が変化したときのイベント,CollectionChangedを関連付けます。Gihyo.LiveSample.signInCompletedメソッド内に以下の記述を追加します。

Gihyo.LiveSample.User.get_conversations().add_collectionChanged(Delegate.create(null, Gihyo.LiveSample.conversationsCollectionChanged));

Conversationには,その会話に参加しているユーザのIMAddressオブジェクトをRosterプロパティによって取得できます。これもコレクションです。ここでは会話に参加しているユーザの表示名をリンクとして表示します。Gihyo.LiveSample.conversationsCollectionChangedメソッドには次のように記述します。

Gihyo.LiveSample.conversationsCollectionChanged = function(sender, e) {
    var userAddress = Gihyo.LiveSample.User.get_address().get_address();
    var sb = new StringBuilder();
    var conversations = Gihyo.LiveSample.User.get_conversations().getEnumerator();
    var index = 0;
    while (conversations.moveNext()) {
        var c = conversations.get_current();

        // 会話に参加しているメンバーを列挙
        var roster = c.get_roster().getEnumerator();
        var names = new Array();

        while (roster.moveNext()) {
            var address = roster.get_current().get_address();
            if (address == userAddress) {
                // ユーザーは除外
                continue;
            }
            
            // ユーザの表示名を取得 空文字だった場合はアドレスを使用
            var displayName = roster.get_current().get_presence().get_displayName();
            if (displayName != '') {
                names.add(displayName);
            } else {
                names.add(address);
            }
        }
        
        sb.append('<li>');
        sb.append('<a href="#" onclick="Gihyo.LiveSample.selectConversation(' + index  + ');return false;">');
        sb.append(names.join(', '));
        sb.append('</a>');
        sb.append(' [<a href="#" onclick="Gihyo.LiveSample.closeConversation(' + index  + ');return false;">close</a>]');
        sb.append('</li>');
        ++index;
    }
    $('conversations').innerHTML = '<ul>' + sb.toString() + '</ul>';
}

この後の処理も考えた記述も含んでいます。会話の選択と終了のためのリンクです。indexという変数を作成してループ中にインクリメントし,コレクションの要素番号を各メソッドの引数としています。これは,ConversationCollectionクラスが要素番号によっても各Conversationオブジェクトにアクセスできるためです。これらのリンクをクリックしたときのメソッドについては後ほど説明します。

ここまでで,メンバーをクリックしたり,メッセージが送信され新しい会話が作成されたりすると,会話の一覧が更新・表示されると思います。実行した結果は図4のようになります。

図4 アクティブな会話の一覧表示

図4 アクティブな会話の一覧表示

著者プロフィール

松江祐輔(まつえゆうすけ)

日本システムウエア株式会社 勤務。現在,ハードウェア設計・検証業務を担当。大学生・大学院生時代はベンチャー企業 有限会社ミレニアムシステムズにプログラマーとして従事。趣味はプログラミング。好きな言語はVisual Basic。Microsoft MVP for Windows Live Platform(Jul 2010 - Jun 2011),Windows Live(Jul 2011 - Jun 2013)。

URL:http://katamari.jp