目次


IBM Content Navigator におけるプラグイン開発手順

開発環境の準備からサンプル作成および実行まで

Comments

前提

ICN のプラグイン開発には、実行環境として ICN および WebSphere Application Server (WAS) が、開発環境として Rational Application Developer (RAD) がインストールされている必要があります。これらの構成、インストール、およびセットアップ方法は、それぞれのインストール・マニュアルと developerWorks の記事を参照してください。巻末に参考文献を紹介しています。

ここでは、ICN 2.0.2、WAS 8.0、および RAD 8.0.4 を前提に説明をします。インストール・フォルダーおよび RAD のワークスペースは表 1 のように記述します。各記述は、各自の環境に読みかえてください。

JavaScript および Dojo Toolkit の文法や詳細については参考文献を参照してください。

表 1. 各フォルダーと文章中の記述
フォルダー文章中の記述
ICN インストール・フォルダー<ICN_dir>

ICN プラグインの特徴

ICN のプラグイン・フレームワークを利用することにより、クライアント側の JavaScript モジュールやサーバー側のサービスを再利用して、効率よくカスタム・アプリケーションを開発することができます。ICN のプラグイン・フレームワークでは、クライアント側は Dojo Toolkit をベースとして非常に柔軟なユーザー・インターフェースを開発することができます。サーバー側のコードも簡単に拡張できるカスタマイズ・ポイントが用意されているので、拡張が必要な機能の性質に応じて効率よくサーバー側の処理を実装することもできます。よって、クライアント側とサーバー側のコードを目的に応じて柔軟に設計し、ICN が提供するフレームワークによって少ないコード量で効果的なアプリケーションを作成することが可能です。

サンプル・プラグインの概要

この記事で説明するサンプル・プラグインは、画面に “Hello, <user_name>” を表示する簡単なプラグインです。これはいわゆる Hello World を出力する ICN プラグインのようなものであり、プラグインの最小構成を理解するためのサンプルです。 このサンプル・プラグインを元に、機能を追加する形で独自のプラグインを開発していくことができます。

この記事では次の流れで ICN プラグインについて説明していきます。まず次章では、プラグイン開発に必要な開発環境の準備を説明します。次に、サンプル・プラグインの中身である Java と JavaScript のソース・コードの説明をします。最後に、ICN 上でサンプル・プラグインを実行する方法を説明します。

開発環境の準備

初めに、プラグイン開発のための開発環境の準備をします。

プロジェクトの作成

RAD 上にサンプル・プロジェクト開発用の Java プロジェクトを作成します。ここではプロジェクト名を SamplePlugin としています。

  1. 「ファイル」 > 「新規」 > 「プロジェクト」 を開きます
  2. 「Java プロジェクト」を選択して「次へ」をクリックします
  3. プロジェクト名に SamplePlugin を入力して「終了」をクリックします
  4. 指定した名前で Java プロジェクトが作成されたことを確認します

クラスパスの設定

プラグイン内で使用するライブラリーの JAR ファイルを、作成したプロジェクトのライブラリーに設定します。表 2 に、ライブラリーに設定する JAR ファイルと、そのコピー元フォルダーを示します。実行環境と開発環境が異なる場合は、事前に実行環境から開発環境へ JAR ファイルをコピーしてください。

表 2. JAR ファイルとコピー元フォルダー
ファイル名コピー元フォルダー備考
navigatorAPI.jar<ICN_dir>\configure\libベースの Java class
  1. 作成したプロジェクトを右クリックして、「プロパティー」を開きます
  2. 「Java のビルド・パス」を開きます
  3. 「ライブラリー」タブを開きます
  4. 「外部 JAR の追加」を開きます
  5. コピー元フォルダー(もしくは、実行環境からコピーしてきた JAR ファイルが保存されているフォルダー)から navigatorAPI.jar を選択して「開く」をクリックします
  6. ライブラリーに追加されたことを確認して「OK」をクリックします
  7. SamplePlugin プロジェクトの「参照先のライブラリー」に navigatorAPI.jar が登録されたことを確認します

サンプル・プラグインの作成

サンプル・プラグインの作成について順を追って説明します。この流れに沿えば、簡単なプラグインの作成ができます。さらに、このサンプルを元に機能を追加していくことで、オリジナルのプラグインを作成することができます。JavaScript モジュールを実装することにより、ユーザー・インターフェースのカスタマイズも柔軟に行うことができます。

ICN が提供している各 Java クラスおよび JavaScript モジュールについての詳細は、巻末に示した参考文献の IBM Content Navigator API reference を参照してください。

フォルダー構造とファイルの作成

初めに、図 1 のようにフォルダーとファイルを作成します。 図 1 の例では、パッケージ名を com.ibm.sample.plugin としています。各フォルダーの説明は表 3 に示します。各ファイルについては後節で説明します。

図 1. SamplePlugin プロジェクトのフォルダー構成とファイル
表 3. 各フォルダーの説明
フォルダー名説明
featureフィーチャーを定義する PluginFeature を継承した Java ファイルを配置するためのフォルダー。フィーチャーとは、参照や検索のように ICN の画面として提供される機能のまとまりです。ひとつのプラグインで複数のフィーチャーを定義することもできます。
WebContentクライアント側のソース・コードを配置するためのフォルダー
nlsDojo のウィジェットで使用する多言語対応のための JavaScript メッセージ・ファイルを配置するためのフォルダー
resourcesDojo のウィジェットで使用する CSS ファイルを配置するためのフォルダー
imagesDojo のウィジェットで使用する画像ファイルを配置するためにフォルダー
widgetDojo のウィジェットを実装する JavaScript ファイルを配置するためのフォルダー
templatesDojo のウィジェットのテンプレート HTML ファイルを配置するためのフォルダー

Plugin クラスの作成

SamplePlugin.java には、サンプル・プラグイン用に SamplePlugin クラスを定義します。このクラスは、プラグインとしての基本的な情報を定義する Plugin クラスを継承します。

各メソッドで返す値の説明は、表 4 に示します。巻末で SamplePlugin のソース・コードがダウンロードできますので、合わせて参照してください。

ここで指定したプラグインの名前、バージョン、フィーチャー(フィーチャー名は後述の PluginFeature クラスで指定します)は、プラグインを ICN にロードしたときに表示されます。

図 2. SamplePlugin.java
package com.ibm.sample.plugin;

import java.util.Locale;

import com.ibm.ecm.extension.Plugin;
import com.ibm.ecm.extension.PluginFeature;
import com.ibm.sample.plugin.feature.SampleFeature;

public class SamplePlugin extends Plugin {

	@Override
	public String getId() {
		return "samplePlugin";
	}

	@Override
	public String getName(Locale arg0) {
		return "Sample Plug-in";
	}

	@Override
	public String getVersion() {
		return "1.0.0";
	}

	@Override
	public String getScript() {
		return "sample/sample.js";
	}

	@Override
	public String getDojoModule() {
		return "sample";
	}

	@Override
	public String getCSSFileName() {
		return "sample/resources/sample.css";
	}

	@Override
	public PluginFeature[] getFeatures() {
		return new PluginFeature[] { new SampleFeature() };
	}
}

 

表 4. SamplePlugin.java で定義するメソッド
メソッド名説明
getIdプラグインの ID を文字列で指定します。
getNameプラグインの名前を文字列で指定します。
getVersionプラグインのバージョンを文字列で指定します。
getScriptロード時に呼び出す JavaScript ファイルのパスを文字列で指定します。
getDojoModuleプラグインの Dojo モジュール名を文字列で指定します。通常は WebContent の下のルート・フォルダー名です。この例では sample フォルダーになります。
getCSSFileNameプラグインが使用する CSS ファイルのパスを文字列で指定します。
getFeatures提供するフィーチャーを PluginFeature の配列として指定します。

PluginFeature クラスの実装

次に、PluginFeature クラスを継承して SamplePlugin で実装するフィーチャー用のクラスを作成します。これは前節の Plugin クラスで getFeatures メソッドに記述するクラスです。複数のフィーチャーを提供する場合は、複数の PluginFeature クラスを作成し、 Plugin クラスの getFeatures メソッドで配列として列挙します。

表 5 は、図 3 で定義している各メソッドの説明です。

図 3. SampleFeature.java
package com.ibm.sample.plugin.feature;

import java.util.Locale;

import com.ibm.ecm.extension.PluginFeature;

public class SampleFeature extends PluginFeature {

	@Override
	public String getId() {
		return "sampleFeature";
	}

	@Override
	public String getName(Locale arg0) {
		return "Sample Feature";
	}

	@Override
	public String getDescription(Locale arg0) {
		return "This is a sample plug-in feature.";
	}

	@Override
	public String getContentClass() {
		return "sample/widget/SamplePane";
	}

	@Override
	public String getIconUrl() {
		return "samplePluginFeatureIcon";
	}

	@Override
	public String getFeatureIconTooltipText(Locale arg0) {
		return "Tooltip for Sample Feature";
	}

	@Override
	public String getPopupWindowClass() {
		return null;
	}

	@Override
	public String getPopupWindowTooltipText(Locale arg0) {
		return null;
	}

	@Override
	public boolean isPreLoad() {
		return false;
	}
}

 

表 5. SampleFeature.java で定義するメソッド
メソッド名説明
getIdフィーチャーの ID を文字列で指定します。
getNameフィーチャーの名前を文字列で指定します。
getDescriptionフィーチャーの説明を文字列で指定します。
getContentClassフィーチャーのウィジェットのパスを文字列で指定します。
getIconUrlローンチ・バーに表示されるフィーチャー・アイコン画像の CSS クラス名を文字列で指定します。CSS 定義はスタイルシートに記述します。
getFeatureIconTooltipTextフィーチャーのアイコンをマウスでポイントしたときに表示されるツールチップの文字列を指定します。
getPopupWindowClassポップアップ・ウィンドウのウィジェットのパスを文字列で指定します。必要でない場合は null を指定します。
getPopupWindowTooltipTextポップアップ・ウィンドウのアイコンをマウスでポイントしたときに表示されるツールチップの文字列を指定します。必要でない場合は null を指定します。
isPreloadtrue を指定するとアプリケーションのレイアウト時にフィーチャーもロードされます。false を指定すると遅延ロードされます。

JavaScript ファイルの作成

PluginFeature クラスで指定した JavaScript ファイルを実装することで、フィーチャーの実態であるウィジェットを作成します。このウィジェットが、フィーチャーを開いたときに最初に表示されるウィジェットです。ここから ICN が提供しているウィジェットや Dojo のウィジェット、およびカスタム・ウィジェットを呼び出していくことになります。

図 4 は、画面に ”Hello, <user_name>” を表示するフィーチャー用のウィジェットの実装です。<user_name> にはログインしたユーザー名が表示されます。ここで定義している sample/widget/SamplePane は、ICN が提供している ecm/widget/layout/_LaunchBarPane を継承して実装しています。_LaunchBarPane を継承することで、定義したフィーチャーを開いたときに表示される画面を定義できます。SamplePane ウィジェットが作られたときに呼び出される buildRendering メソッドで、ecm/model/Desktop からユーザー名を取得しています。取得したユーザー名を _setUserName メソッドに渡して、”Hello, <user_name>” をテンプレートの SamplePane.html(図 5)で定義した _messageNode の innerHTML に挿入することで、画面に表示しています。”Hello, <user_name>” というメッセージは、図 6 に示したように messages.js で welcome_user プロパティーとして定義しており、取得したユーザー名で user_name パラメーター部分を置きかえています。なお、同じブラウザで別のユーザーでログインし直す場合などは、SamplePane が既に作成されているため buildRendering メソッドは再度呼び出されません。このようなときにも同様の処理が実行されるように、Desktop の onLogin イベントにハンドラーを登録して _setUserName メソッドを呼び出すようにしています。

図 4. SamplePane.js
define([
	"dojo/_base/declare",
	"dojo/string",
	"ecm/model/Desktop",
	"ecm/widget/layout/_LaunchBarPane",
	"dojo/i18n!../nls/messages",
	"dojo/text!./templates/SamplePane.html"
], function(declare, string, Desktop, _LaunchBarPane, messages, template){

return declare("sample/widget/SamplePane", [ _LaunchBarPane ], {

	templateString: template,

	buildRendering: function(){
		this.inherited(arguments);
		this._setUserName( Desktop.userDisplayName || Desktop.userId );
		this.connect(Desktop, "onLogin", function(){
			this._setUserName(Desktop.userDisplayName);
		});
	},

	_setUserName: function(/* String */name){
		name = name || "anonymous";
		this._messageNode.innerHTML =
			string.substitute(messages.welcome_user, {user_name: name});
	}
});
});

 

図 5. SamplePane.html
<div data-dojo-attach-point="_messageNode"></div>

 

図 6. messages.js
define({root:
({
	welcome_user: "Hello, ${user_name}"
})
});

プラグインの実行

ICN でプラグインを実行するために、JAR ファイル・パッケージを作成して ICN にロードする方法を説明します。実行までの流れは、Java ソース・コードをコンパイルし、Java クラスと Dojo のソース・コードを含んだ JAR ファイルを作成します。その JAR ファイルを ICN にプラグインとしてロードし、新しいデスクトップを定義してロードしたプラグインが提供しているフィーチャーを設定します。これらの設定により、定義したデスクトップでプラグインのフィーチャーを実行することができます。

build.xml ファイルの作成

RAD 上で ANT を実行して、Java ソース・コードのコンパイル、および JAR ファイルの作成をするために、build.xml ファイルを準備します。この資料に添付している zip ファイルから build.xml をコピーして使用できます。各自の環境に合わせて NAVIGATOR_API プロパティーの値を編集してください。NAVIGATOR_API プロパティーは、navigatorAPI.jar のパスです。

下記ステップにより Ant の実行をすると、プラグインに必要なファイルを含んだ JAR ファイルが作成されます。

  1. RAD 上で build.xml を右クリックします
  2. 「実行」 > 「Ant ビルド」をクリックします
  3. SamplePlugin プロジェクト直下に SamplePlugin.jar が作成されたことを確認します(表示されていない場合は、SamplePlugin プロジェクトを更新してください)

SamplePlugin プラグインのロード

まず、実行環境と開発環境が異なる場合は、SamplePlugin.jar を実行環境にコピーしてください。

次のステップにより、JAR ファイルを ICN にロードします。

  1. 管理者デスクトップにアクセスして、管理者権限のあるユーザーでログインします
    http://<host_name>:<port>/navigator/?desktop=admin
  2. 「プラグイン」を開きます
  3. 「新規プラグイン」をクリックします
  4. 「JAR ファイルのパス」を選択して、テキスト・ボックスに実行環境の SamplePlugin.jar のパスを記入します
  5. 「ロード」をクリックします
  6. プラグインがロードされて、図 7 のようにプラグインの情報が表示されます
  7. 「保存」もしくは「保存して閉じる」をクリックしてプラグイン情報を保存します

 

図 7. ICN プラグインのロード

デスクトップの作成

次に、ロードしたプラグインが提供するフィーチャーを指定するデスクトップを新しく定義します。

  1. 管理者デスクトップにアクセスして、管理者権限のあるユーザーでログインします
    http://<host_name>:<port>/navigator/?desktop=admin
  2. 「デスクトップ」を開きます
  3. 「新規デスクトップ」をクリックします
  4. 必須項目を入力して、図 8 のように「外観」の「表示する機能」で、ロードしたプラグインが提供する Sample Feature フィーチャーを「選択した機能」に追加します。この例では、ICN の特徴的なフィーチャーである「参照」および「検索」も追加しています。「選択した機能」のフィーチャーを選択したあと、右にある上矢印および下矢印をクリックすることで、ローンチ・バーに表示するフィーチャーの順番を変更することができます
  5. 図 8 のように「外観」の「表示する機能」で、Sample Feature フィーチャーを「デフォルトの機能」として選択します
  6. 「保存」もしくは「保存して閉じる」をクリックしてデスクトップの設定を保存します

 

図 8. 新規デスクトップでのフィーチャーの設定

実行

新しく作成したデスクトップにアクセスしてログインすると、SamplePlugin プラグインで実装した Sample Feature フィーチャーが実行されて、”Hello, <user_name>” が画面に表示されます。

  1. 定義したデスクトップにアクセスして、ログインします。<desktop_id> は、前節で作成したデスクトップの ID です
    http://<host_name>:<port>/navigator/?desktop=<desktop_id>
  2. 画面に “Hello, <user_name>” が表示されることを確認します

まとめ

この記事では、SamplePlugin を例にして、ICN プラグインの開発環境の準備からサンプル作成および実行までを説明しました。ここで説明した SamplePlugin をベースに、ICN が用意しているウィジェット、Dojo ウィジェット、およびカスタム・ウィジェットを利用して拡張していくことで、ICN 上で動作するアプリケーションの開発が簡単に行えます。


ダウンロード可能なリソース


関連トピック


コメント

コメントを登録するにはサインインあるいは登録してください。

static.content.url=http://www.ibm.com/developerworks/js/artrating/
SITE_ID=60
Zone=Information Management, Web development
ArticleID=957525
ArticleTitle=IBM Content Navigator におけるプラグイン開発手順
publish-date=12192013