ibm software grouppublic.dhe.ibm.com/software/dw/jp/lotus/ldd_tech/... · 2009-07-15 · ibm...

IBM Software Group

®

Lotus Domino Designer 8.5 ご紹介

印刷会社印刷会社

日本アイ･ビー･エム株式会社

ソフトウェア事業Lotusテクニカルセールス

IBM Software Group | Lotus software

2

特記事項

本資料の記載内容は、正式な IBM のテストやレビューを受けておりません。内容について、できる限り正確を期すよう努めてはおりますが、いかなる明示または暗黙の保証も責任も負いかねます。本資料の情報は、使用先の責任において使用されるべきものであることを、あらかじめご了承ください。掲載情報は不定期に変更されることもあります。他のメディア等に無断で転載する事はご遠慮ください。本資料の著作権は日本アイ・ビー・エムにあります。非営利目的の個人利用の場合において、自由に使用してもかまいませんが、営利目的の使用は禁止させていただきます。IBM, AIX, Lotus, Lotus Notes, Lotus Domino, は International Business Machines Corporationの米国およびその他の国における商標。その他、記載された社名および製品名は、それぞれ各社の商標または登録商標です。


3

Lotus Domino Desiger 8.5 拡張点概要Eclipse対応XPage

Agenda


4

Lotus Domino Desiger 8.5 拡張点概要

Eclipse上に実装Lotus製品の共通プラットフォームへの対応

Look & Feel を開発ツールのデファクトと統一

優れたスクリプト記述機能

プラグインによる開発環境の拡張性

オープンなWeb開発環境への対応


5


新しい設計要素 “XPage”の提供リッチなユーザーインターフェースの開発を容易にする

JSF(Java Server Faces)をベースに機能拡張

• ユーザーインターフェースをタグで簡単に記述する仕組み。− UIコンポーネント− 入力値のバリデーション、コンバージョン− JavaBeanとの連携− ページ移動

• XPageを解釈・処理するサーブレットが内部的に実装されている。− 拡張子”xsp”が付くリソース要求に対して動作

− 例） http://myserver/mydb.nsf/mypage.xspCSS, Ajax, Dojo 対応

基本的には、ノンプログラミングで開発可能。

• HTML, CSS, XML, Java, JavaScript, Dojo, JSP, JSFなどの知識がなくてもOK。• XPagesを使い込むには、JavaScript が必須。


6

Lotus Domino Desiger 8.5 拡張点概要Domino Webアプリ開発におけるXPagesの位置づけ

文書データ

コラボレーション・インフラ機能

・全文検索エンジン、ビューインデックス管理・複合ドキュメント（リッチテキスト）・メールルーティング・ユーザー / ロール別セキュリティ制御・ユーザー管理・シングルサインオン・バックエンドシステムコネクター・多言語対応・その他

サーバーサイドロジック

ユーザーインターフェース（画面 + ロジック）

Form View Frame, Page, Navigator, etc

XPages

LotusScript @関数、シンプルアクション Java JavaScript


7


今後のXPages拡張予定各Lotus製品への組み込み

• Lotus Notesクライアント上での稼動• Lotus Quickrのカスタマイズ手段としての提供• Lotus Mashupsのマッシュアップ素材としての利用• Blackberryデバイス上での利用追加のDojoコントロールの提供

追加のリモートデータソースの提供

• RDBMS• その他


8


Dojoの提供Dojoとは、JavaScriptを拡張するJavaScriptライブラリー

• リッチテキストエディターなどのUIコントロールを提供• Ajaxに対応したコントロールを提供

XPage上でコントロールをドラッグ&ドロップで配置して開発

サーバーサイドスクリプト言語の提供

サーバーサイドJavaScript• JavaScriptのインタープリターをサーバ上に実装• @関数を呼び出し可能

• Javaプログラムとのブリッジ

EmpNameEn=Document.getItemValueString("EmpNameEn");nameKanji=@DbLookup(@DbName(),"vEmpByName",EmpNameEn,3);

EmpNameEn=Document.getItemValueString("EmpNameEn");nameKanji=@DbLookup(@DbName(),"vEmpByName",EmpNameEn,3);

9


より加工のしやすいHTMLの生成データベースプロパティで指定。

HTML中にclass属性が付与されるようになり、CSS対応しやすくなった。

<table class="domino-view" border="0" cellpadding="2" cellspacing="0"> <tr class="domino-view-colhead"><th nowrap="nowrap" align="left">社員番号</th><th nowrap="nowrap" align="left">社員名</th></tr>

<tr valign="top" class="domino-viewentry"><td nowrap="nowrap"><img width="16" height="1" src="/icons/ecblank.gif" border="0" alt="" /><a href="/test85.nsf/e6b54b364318f08a492574c50000b58a/ff97954f29b55930492574c500019958?OpenDocument">AA261966</a></td><td nowrap="nowrap">大川宗之</td></tr>

例）ビューのHTML出力


10


コンポジットアプリケーション機能拡張

Webページ内のフィールドと連携

サイドバーへの統合

ワイアリングパターンの充実

その他


11

Eclipse対応～従来の設計要素

エディターエディター

ビュービュー

ビュービュー

ビュービュー

ビュービュー


12

Eclipse対応～ XPageの編集

ビュービュー

ビュービュー

エディターエディタービュービュー

ビュービュー


13

Eclipse対応～ Eclipseパースペクティブへの切替

ビュービュー

エディターエディター

ビュービュー

ビュービュー


14

Eclipse対応

パースペクティブへの対応

パースペクティブとは、エディタ、使用するビュー、レイアウトの組み合わせのこと。

パースペクティブの切替によって、開発者、開発フェーズに合わせたインターフェースを使用することが出来る。

NSFは仮想ファイルシステムとして扱い、Package Explorerビューに表示。

レイアウトはダイナミックに変更可能

ビュー、エディターの表示、非表示、レイアウト変更

ビューをデタッチして別ウィンドウで表示

Eclipseの持つ様々なエディターを利用可能JavaScript, Java, XML, CSS

LotusScriptエディターを追加


15

XPage～ 7.0 Discussion Template


16

XPage ~ 8.5 Discussion Template

タグ・クラウドタグ・クラウド本文概要のExpand/Collapse本文概要の

Expand/Collapse

ビュー部分だけをリフレッシュ

ビュー部分だけをリフレッシュ

CSSによる色合いの統一

CSSによる色合いの統一


17

XPage

実行環境のセットアップ

Dojo、XPageの導入


18

XPage

実行環境のセットアップ（続き）

サーバーエージェント実行セキュリティの設定

HTTPタスクの実行、XSPコマンド･マネージャーの初期化

2008/09/16 07:03:36 HTTP Server: Using Web Configuration View2008/09/16 07:03:56 JVM: Java Virtual Machine initialized.2008/09/16 07:03:56 HTTP Server: Java Virtual Machine loaded2008/09/16 07:04:02 XSP Command Manager initialized2008/09/16 07:04:03 HTTP Server: Started


19

XPage

データとプレゼンテーションの分離

１つのXPage上に、複数のNSFからのフィールド、フォーム、ビューを配置

自由度の高いアプリケーションを開発可能。

XPage上で使用するアプリケーション、フォーム、ビューを定義。

XPage上で使用するアプリケーション、フォーム、ビューを定義。

データビューには、定義されたフォーム上のフィールド、ビュー上のフィールドが表示される。

データビューには、定義されたフォーム上のフィールド、ビュー上のフィールドが表示される。

データビューから、ドラッグ＆ドロップで配置。

データビューから、ドラッグ＆ドロップで配置。


20

XPage

UIコントロールの提供Controlsビューからエディターにドラッグ＆ドロップで貼り付ける。

ビルトインコントロール

カスタムコントロール

•ビルトインコントロールを組み合わせたりして、独自にコントロールを作成可能。

コア・コントロールコンテナ・コントロールその他のコントロール


21

XPage

TABキーのフォーカス順番、ショートカットキーによるフォーカスを定義

Tab order : TABキーのフォーカス順番Accelerator : ショートカットキーの定義

例） Edit Boxコントロール


22

XPage

CSS (Cascading Style Sheet) 対応サーバーレベル、アプリケーションレベル、コントロールレベルで指定可能。

アプリケーション・プロパティ上で指定する。

※ Designerからアプリケーション・プロパティを参照

リソースとして作成したCSSを選択


23

XPage

CSS (Cascading Style Sheet) 対応（続き）

XPageや各コントロール毎に、プロパティボックスでCSSを指定する。

XPageや各コントロール毎に、プロパティボックスでCSSを指定する。

個別に指定して、インライン形式でスタイリング可能。

個別に指定して、インライン形式でスタイリング可能。


24

XPage

Ajax対応DojoのAjaxを使用したコントロールを利用して、ノンコーディングで実装可能。

利用パターン１タイプアヘッド

• 宛先入力の時など、入力フィールドに数文字入れると、バックエンドでサーバーと通信して宛先候補を取得し、リアルタイムに自動的に表示する。

• Google Suggest のような動作利用パターン２部分的な更新

• ボタンを押すと、検索して、結果を表示する部分だけを更新する。• ビュー画面で、”次へ”ボタンをクリックすると、ビューの行の部分だけをリフレッシュする。


25

XPage～ Ajaxビルトイン・タイプアヘッド機能の利用例

アルファベットを入力すると、候補となる社員のローマ字がリストされるタイプアヘッドをエディットボックスに定義する。

アルファベットを入力すると、候補となる社員のローマ字がリストされるタイプアヘッドをエディットボックスに定義する。

ダイアモンド・ボタンをクリックすると、計算式の入力ボックスが開く。

ダイアモンド・ボタンをクリックすると、計算式の入力ボックスが開く。

・＠DbColumnで、ローマ字列を全て取ってくるようにコーディング。・候補のマッチングは自動的に行われる。・サーバーサイドで実行されるように指定。

・＠DbColumnで、ローマ字列を全て取ってくるようにコーディング。・候補のマッチングは自動的に行われる。・サーバーサイドで実行されるように指定。


26

XPage～ Ajaxビルトイン・部分更新機能の利用例

ボタンをクリックすると、”Employee Name”をキーにして漢字名と社員番号を取得し、ページ内の一部分だけを更新するイベントを定義する。

ボタンをクリックすると、”Employee Name”をキーにして漢字名と社員番号を取得し、ページ内の一部分だけを更新するイベントを定義する。

テーブルのこのセルに、idタグをつけておいて、更新範囲を指定する時に使う。この例では、id=“refreshCompu”が指定されている

計算結果フィールドが定義されているので、再読み込み時に、値がセットされる。

テーブルのこのセルに、idタグをつけておいて、更新範囲を指定する時に使う。この例では、id=“refreshCompu”が指定されている

計算結果フィールドが定義されているので、再読み込み時に、値がセットされる。

Searchボタンのクリックイベントの動作を定義する。

Searchボタンのクリックイベントの動作を定義する。

部分更新することを指定する。更新範囲は、id=“refreshCompu”が指定されている部分だと設定する。

部分更新することを指定する。更新範囲は、id=“refreshCompu”が指定されている部分だと設定する。


27

参考情報

developerWorks Japanhttp://www.ibm.com/developerworks/jp/lotus/products/lnd/index.html#devapp

XPagesの詳細解説Lotus Notes/Domino Wiki

http://www-10.lotus.com/ldd/ddwiki.nsf/archive?openview&title=XPages&type=cat&cat=XPages&sort=I

XPagesの解説多数（英語）

Step by Stepによるサンプルアプリ構築チュートリアルdojo

http://dojotoolkit.org/Lotus Developer Domain 「Ajaxを使用したLotus Notes文書の操作」

http://www.ibm.com/jp/software/lotus/developer/library/domino-ajax/

ibm software grouppublic.dhe.ibm.com/software/dw/jp/lotus/ldd_tech/... · 2009-07-15 · ibm...

Documents