連載その5「mt.js は何をしているのか? その2」
コミュニティ・ソリューションで利用される mt.js とは?
"mt.js" ファイルは、コミュニティー掲示板やコミュニティーブログで利用される多機能な JavaScript ファイルで、各掲示板やブログディレクトリの直下に配置されています。
コミュニティ・ソリューション以外でも "mt.js" を利用しますが、若干違う JavaScript ファイルとなっています。
主な利用場面は以下の4つです。
- サインイン、サインアウト
- コメント欄の表示、非表示
- お気に入りの制御
- 注目、被注目
今回は「お気に入りの制御」「注目、被注目」について取り上げます。
お気に入りとは?
コミュニティ・ソリューションでは、ブログ記事に対して、読者が『お気に入り』に追加することができます。この機能は、Movable Type のレーティング・フレームワークと呼ばれる仕組みによって実装されており、Movable Type に保存されている、記事などのあらゆるデータに、スコア付けやランキングを設定することができます。
お気に入りは、ユーザー各々のブックマークとしても利用できますし、コミュニティ全体では、人気度の目安として働きます。投票者がコミュニティにサインインしているユーザーなら、お気に入りに登録したトピックやブログ記事は自分のプロフィールページの [最近のアクション] で確認できます。
お気に入り 機能
お気に入り機能は JavaScript によって動作しています。お気に入りの情報はユーザーログインした際に JSON データとしてダウンロードされ、それによりアイコンのステータスを変更します。
ロード時、サインイン時の処理
- ロード時、サインイン時にお気に入りアイコンの状態を変更する JavaScript を呼び出します。
- JavaScript が呼び出される前、お気に入りアイコンはクリックできない状態(灰色)になっています。
- JavaScript が呼ばれると JSON のデータから画面内のお気に入りの状態を調べ、ステータスをチェックします。
- JavaScript でチェックしたステータスを画面に反映させます。
- JavaScript が呼び出された後、投票可能なお気に入りアイコンはアクティブな状態(青色)になっています。
- JavaScript が呼び出された後、投票済みのお気に入りアイコンはクリックできない状態(黒にチェック)になっています。
- ユーザがサインアウトを行うと、全てのお気に入りアイコンはクリックできない状態(灰色)に戻ります。
アクティブ(青色)アイコン クリック時の処理
- アクティブなお気に入りアイコンをクリックすると、JavaScript が呼び出されます。
- JavaScript は、引数として渡された Entry ID から、お気に入りになった旨をシステムに送信します。
- データ送信中はアイコンがアップデート中(インジケーター)に変更されます。
- JavaScript が、クリックしたアイコンを投票済み(黒にチェック)に変更します。
- JavaScript が、クリックしたアイコンの票数を変更します。
投票済み(黒にチェック)アイコン クリック時の処理
- 投票済みなお気に入りアイコンをクリックすると、JavaScript が呼び出されます。
- JavaScript は、引数として渡された Entry ID から、お気に入りから外した旨をシステムに送信します。
- データ送信中はアイコンがアップデート中(インジケーター)に変更されます。
- JavaScript が、クリックしたアイコンをアクティブ(青色)に変更します。
- JavaScript が、クリックしたアイコンの票数を変更します。
メニューから [ 設定 ] の [ コミュニティ ] で、「匿名での投票を許可する」にチェックが入っていた場合、サインインしなくてもお気に入りアイコンがアクティブ(青)になり、お気に入りに投票する事が可能になります。既定値ではチェックが入っていません(サインイン必須)。
注目、被注目 とは?
コミュニティ・ソリューションはユーザーがコミュニティの中で注目するユーザーをフォローする機能を提供します。注目・被注目の状況は、ユーザー各々のプロフィールページで確認したり、テンプレートをカスタマイズして、ユーザーが注目しているユーザーの一覧を表示することもできます。
また、アクション機能と組み合わせれば、注目ユーザーの活動 (記事・トピック作成、コメント、お気に入り) を確認できる仕組みをコミュニティ管理者と、デザイナーに提供します。
注目しているユーザーの一覧とは逆に、ユーザーがどのユーザーに注目されているのかを一覧することもできます。こちらもアクション機能と組み合わせて利用できます。例えば、自分を注目しているユーザーは最近どのようなトピック (または記事) を投稿したのかをチェックするといったこともできます。
注目、被注目 機能
注目、被注目は、ロード時の処理と「注目する」「注目をやめる」時の2つの処理があります。ここでは、プロフィールページでの注目、被注目の挙動を説明します。
ロード時の処理(HTML中のJavaScript)
- プロフィールページを開いた時点では「注目する」「注目をやめる」のリンクは表示されていません。
- これらを表示するための JavaScript はHTMLに書き込まれています。
- サインインするとJavaScript により「注目する」「注目をやめる」のどちらが表示されるか制御します。
- JavaScript の呼び出しはHTMLページの最後にある外部 JavaScript をインクルードしている部分で行われます。
- ここで読み込まれた外部 JavaScript は 「注目しているかどうか」「ユーザ名」「メールアドレス」などの引数を渡します。これにより表示、非表示が制御されます。
「注目する」ボタンをクリックした際の処理(mt.js中のJavaScript)
- 「注目する」ボタンをクリックすると JavaScript が呼ばれます。
- mt-cp.cgi が呼び出され 「注目する」旨をシステムに伝えます。
- ロードが終了するまでインジケーターが表示されます。
- ロードが終了すると、インジケーターが非表示になり「○○に注目しています。 [注目をやめる]」が表示されます。
「注目をやめる」ボタンをクリックした際の処理(mt.js中のJavaScript)
- 「注目をやめる」ボタンをクリックすると JavaScript が呼ばれます。
- mt-cp.cgi が呼び出され 「注目をやめる」旨をシステムに伝えます。
- ロードが終了するまでインジケーターが表示されます。
- ロードが終了すると、インジケーターが非表示になり「[注目をする]」が表示されます。