IBM Extensions to the Dojo Toolkit

Atom ライブラリー、データ・ストア、およびウィジェット

AppStore の使用例:

AppStore データ・ストアは、dojo.data API に準拠した他のあらゆるデータ・ストアと同様に使用できます。 ただし、AppStore データ・ストアでは、 書き込み機能を実行するための作業 APP フィードが必要になります。 次のサンプルのアプリケーションでは、 AppStore データ・ストアの Read および Identity API の機能をデモンストレーションします。

これらのデモンストレーションで使用するフィードは、次のとおりです。 これは、このドキュメンテーション・パッケージでアクセス可能です。

<?xml version='1.0' encoding='utf-8'?>
<feed xmlns='http://www.w3.org/2005/Atom' xml:lang='en-US'>
	<title>Example.com</title>
	<link rel="alternate" type="text/html" href="http://example.com/" hreflang="en" title="Example.com" />
	<subtitle type='text'>Example.com's Sample Feed</subtitle>
	<rights>Copyright Example.com</rights>
	<id>http://example.com/samplefeed.xml</id>
	<updated>2007-08-07T20:00:00-05:00</updated>
	<link rel="self" type="application/atom+xml" href="http://www.example.com/samplefeed.xml"/>
	<entry>
		<title>Test Entry #1</title>
		<id>http://example.com/samplefeed.xml/entry/1</id>
		<link rel='alternate' href='http://example.com/1.html'/>
		<summary type='html'>
			<p>これは Atom フィードのサンプル・エントリーです。これは単に要約の中の大きなパラグラフです。<p>
			<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras cursus. Aliquam eget metus sed leo lacinia 
			rutrum. Nunc lacus lacus, viverra placerat, laoreet nec, placerat vel, eros. Donec nec magna id sem commodo rutrum. 
			Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aenean pede. Quisque vel 
			leo. In vitae nisi. Curabitur sodales congue nibh. Maecenas ultrices ante nec ipsum. Aenean quis nibh. Aenean semper, 
			quam vitae ullamcorper euismod, arcu leo tincidunt nunc, vel pulvinar turpis dolor a elit. Praesent nonummy nunc 
			faucibus nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus laoreet, 
			ante auctor condimentum venenatis, magna quam varius elit, at feugiat dolor metus id quam. Etiam enim.<p>
		</summary>
		<author>
			<name>Test User</name>
			<email>test@example.com</email>
		</author>
		<updated>2007-08-07T04:00:00-05:00</updated>
	</entry>
	<entry>
		<title>Test Entry #2</title>
		<id>http://example.com/samplefeed.xml/entry/2</id>
		<link rel='alternate' href='http://example.com/2.html'/>
		<summary type='text'>
						これは Atom フィードのサンプル・エントリーです。これは単に要約の中の大きなパラグラフです。これは連続したテキストです。
			Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras cursus. Aliquam eget metus sed leo lacinia 
			rutrum. Nunc lacus lacus, viverra placerat, laoreet nec, placerat vel, eros. Donec nec magna id sem commodo rutrum. 
			Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Aenean pede. Quisque vel 
			leo. In vitae nisi. Curabitur sodales congue nibh. Maecenas ultrices ante nec ipsum. Aenean quis nibh. Aenean semper, 
			quam vitae ullamcorper euismod, arcu leo tincidunt nunc, vel pulvinar turpis dolor a elit. Praesent nonummy nunc 
			faucibus nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus laoreet, 
			ante auctor condimentum venenatis, magna quam varius elit, at feugiat dolor metus id quam. Etiam enim.
		</summary>
		<author>
			<email>test@example.com</email>
		</author>
		<updated>2007-08-07T06:00:00-05:00</updated>
	</entry>
</feed>

次に、所定の URL で、フィードから AppStore アプリケーションを マークアップで宣言的に作成します。AppStore データ・ストアを作成するには、次のコードを参照してください。

<div dojoType="ibm_atom.data.AppStore" url="samplefeed.xml" jsId="appStore">

しかし、このマークアップを追加しただけでは、ページに作用しません。dojo ライブラリーを組み込み、 ページを検査してウィジェットをインスタンス化するパーサーを、明示的にロードする必要があります。 これは、ヘッド・エレメント内でスクリプト・タグを使用して行われます。 コードは、次のようになります。

<script type="text/javascript">djConfig = {parseOnLoad: true};</script>
<script type="text/javascript" src="../../../dojo/dojo.js"></script>
<script>
	dojo.require("dojo.parser");
	dojo.require("ibm_atom.data.AppStore");
</script>

これで、ストアがインスタンス化され、フィードがロードされます。 ストアで完了できるより高度な一部のタスクの例として、 次に、ツリー・ウィジェットを加えることができます。 このウィジェットは、AppStore からそのデータを取得し、タイトルのリストを表示します。

<div dojoType="dijit.Tree" id="tree" store="appStore" query="{title:'*t*'}"></div>

ツリー・ウィジェットは、以前のマークアップを検査して、 AppStore で * (つまり、任意のタイトルに一致) というタイトルを持つエントリーを照会します。 これにより、一致した各エントリーのタイトルがツリーに表示されます。

AppStore の単純な関数をいくつか検査します。 最初に、フィードから項目を 取り出します。「Test Entry #1」というタイトルの項目を取り出すとします。 次のようにして、AppStore に対してフェッチを実行することになります。

<script type="text/javascript">
dojo.addOnLoad(function(){
	function callback(items, request){
		console.debug(items.length);
		if(items.length > 0)
			console.debug(items[0].title);
	}
	appStore.fetch({query: {title: "Test Entry #1"}, onComplete: callback});
});
</script>

項目を取り出した後、その項目を使用して呼び出すことができる関数がいくつかあります。これには、 項目の属性を取得すること (以前のコードでは、エントリー・オブジェクトのエレメントに直接アクセスするために これらの呼び出しを使用することはありませんでした)、その項目がストアの項目かどうかを確認すること、 およびその項目の ID を検査することが含まれます。以下の例を参照してください。

<script type="text/javascript">
dojo.addOnLoad(function(){
	function callback(items, request){
		var item = items[0];
		console.debug(appStore.getValue(item, 'summary'));
		console.debug(appStore.isItem(item));
		console.debug(appStore.getIdentity(item));
	}
	appStore.fetch({query: {title: "Test Entry #1"}, onComplete: callback});
});
</script>

dojo.data の Read および Identity API の一部であるその他の関数は、 このドキュメンテーションの参照部分と dojo.data フォルダーにあります。