チャットサービス

アプリケーションにチャットのウィジェットを貼ります。投稿されたメッセージは Mobage の通常のチャットと同様に審査が行われます。
このサービスを利用するには事前に RESTful API でチャットのチャンネルを生成する必要があります。
 RESTful API に関する詳細は Chat API をご覧ください。

定義

要素名

mobage:embedChat

属性

名前

必須

説明

デフォルト値

備考

data-plugins-type

mbga-game-chat で固定値

data-talk-id

チャットの生成済みチャンネル ID

data-product-name

タイトル名

data-widget-id

 

生成されるウィジェット要素 (iframe) への ID (DOMのid)

"game-chat"

data-widget-mode

 

ウィジェットのモード

"simple_message_list"

"simple_message_list" / "message_list" / "preview"

data-use-stream

 

リアルタイムチャット (true/false)

false

data-limit

 

表示するメッセージの最大数

5

data-preview-limit

 

プレビュー時に表示するメッセージの最大数

1

data-widget-mode が "preview" の場合のみ有効

data-stamp-size

 

スタンプサイズ ("small"/"large")

"small"

data-widget-modeが "message-list" の場合のみ有効

data-theme

 

テーマ ("dark"/"light")

"light"

data-default-message

 

入力に表示するデフォルトメッセージ

data-success-callback

 

メッセージ投稿が成功した場合のリダイレクト先URL

Gadget サーバ経由のURLへの置換されます

data-show-header

 

ヘッダー部分の表示/非表示 (true/false)

true

data-show-link

 

下部ボタン部分の表示/非表示 (true/false)

true

data-show-postform

 

投稿の入力フォームの表示/非表示 (true/false)

true

data-style-sheet

 

ゲーム独自のスタイルを定義した CSS ファイル

Gadget サーバ経由のURLへの置換されます

ウィジェットのモード

simple_message_list モード

リスト形式でチャットメッセージが表示されるモードです。

message_list モード

吹き出し形式でチャットメッセージが表示され、履歴を見るボタンが配置されるモードです。
 

preview モード

最新メッセージのみを表示し、アコーディオン形式で開閉できるモードです。

 

HTML 構成と CSS クラス

ゲームチャットのウィジェットで使われている各パーツの HTML には、custom- の接頭辞で始まる class が与えられています。その class に CSS を適用させてカスタマイズすることができます。作成した CSS ファイルは、data-style-sheet 属性で指定します。

カスタマイズのために、bodyに third というclass名が与えられているので、そこから継承して下さい。

custom-log-controller-area

custom-open-chat-app-area

custom-header-area

custom-open-log-reload-area

custom-preview-close-cell

custom-preview-open-cell

custom-post-form-area

custom-preview-cell

custom-messages-area

サンプル

  • HTML
  • CSS
     
    2013年12月より Game chat Widget(Android)に既存の「チャットで見る」ボタンに加え、「アプリで開く」ボタンを追加されました。
    ユーザの端末に「Mobage Chat」アプリがインストールされている場合、「Mobage Chat」アプリで開かれます。
    ユーザの端末に「Mobage Chat」アプリがインストールされていない場合、Google PlayのAndroidアプリダウンロード画面に遷移します。
     

    更新履歴

  • 2014/04/24
    • Android向け「アプリで開く」ボタンの詳細を追加
  • 2013/06/20
    • 属性に data-stamp-size を追加
    • custom-post-form-area の HTML 更新
  • 2013/05/29
    • 属性に data-widget-mode を追加
    • 属性に data-use-stream を追加
    • 属性に data-preview-limit を追加
    • HTML 構成と CSS クラスを詳説
  • 2013/04/25
    • 新規作成

 

 

 

PREVIOUS

ユーザーアップグレードサービス

NEXT

ライフサイクルイベント