通知システム

CS-Cartの通知は画面右上隅にポップアップして表示されます。

標準で5つの通知タイプがあります：

通知 (code type: N)
エラー (code type: E)
警告 (code type: W)
チェックアウト時のエラー (code type: O)
情報 (code type: I)

それぞれのタイプには色がつけられています： 通知は緑、エラーは赤、警告はオレンジ、チェックアウト時のエラーはオレンジで右上隅に表示され、情報はポップアップのダイアログで表示されます。

＜画像＞

表示フォーマットは通知が呼び出されるエリアのCSSファイルに定義されています。通知は関数fn_set_notification (/functions/fn.common.php) を使用して生成されます。

空のコンテナはそれぞれのページのHTMLに書かれています。通知行われると通知ブロックはこのコンテナに表示されます。

通知は以下のレンプレートに定義されています：

管理パネル: /backend/templates/common/notification.tpl
ショップフロント: /themes/[theme name]/templates/common/notification.tpl

通知の設定方法

通知には2つの方法があります：

スクリプトの実行によってページがロードされる前に通知を表示される
AJAXリクエストと共に、ページが表示された後および特定場合に表示される

1つ目はページがリロードされた際に表示される通知を作成するために使用します。 2つ目はページをリロードすることなく、いくつかのJavascriptのイベントによって通知する際に使用します。

まず1つ目の通知の生成過程を見てみましょう：

通知の関数はコントローラーコードから呼び出されます。例えば:

<?php
if ($mode == 'add_to_cart') {
    fn_set_notification('E', fn_get_lang_var('warning'), $msg, true, 'insecure_password');
}

fn_set_notification() 関数は新しい通知内容を通知用の配列に追加します。

テンプレーターは_/backend/templates/common/notification.tpl や/themes/[theme name]/templates/common/notification.tpl_ を処理し、fn_get_notifications()を介して、それぞれの配列へすべての通知のリストを渡します。
通知用の配列が空でなかった場合、通知のHTMLコードが表示されます。

2つ目はAJAXを使った通知の生成方法です

ページを表示する際、テンプレーターは/backend/templates/common/notification.tpl や/themes/[theme name]/templates/common/notification.tpl を処理し、通知用のコンテナ(<div class=”cm-notification-container”>)を作成します。このコンテナは空かまたは1つ目の通知設定を含んでいます。
設定用関数はAJAXリクエストで実行されるコントローラーコードで呼び出されます。　例えば:

<?php
if (defined('AJAX_REQUEST')) {
    fn_set_notification('E', fn_get_lang_var('warning'), $msg, true, 'insecure_password');
}

この関数は以下の場合、通知用配列に新しい要素を追加します。

コントローラーの実行もしくはexit() 関数で処理が明示的に中断された場合、(/Tygh/Ajax.php) のAJAXクラス用のデストラクタが起動します。このデストラクタは通知内容をJSON形式の配列に変換し、この配列をJS関数response (/js/tygh/ajax.js) に引き渡します。
この関数response は関数ceNotification (/js/tygh/core.js) を呼び出し、すべての定義されたAJAX通知配列が渡されます。通知の表示はnotification.append メソッドによりceNotification 関数で実行されます。

関数は通知のHTMLコードが宣言されたテンプレート/backend/templates/common/notification.tpl または /themes/[theme name]/templates/common/notification.tpl (<div class=”cm-notification-container”>)をコンテナに追加します。また、Javascriptの通知の作成を行います。

$.ceNotification('show', {
    type: 'E',
    title: _.error,
    message: error_msg
});

前へマイクロフォーマット Microformats 次へツールチップ

最終更新 1 か月前