Download List

Project Description

マスカットは Web ブラウザ上で動作する Ajax リッチクライアントアプリケーションの開発を支援するためのフレームワークおよび統合開発環境です。マスカットプロジェクトではこれらのソフトウェアの開発成果をオープンソースで公開しています。

System Requirements

System requirement is not defined

Released at 2009-04-10 19:56
maskat 2.1.0 (2 files Hide)

Release Notes


マスカットフレームワーク 2.1.0
RELNOTES.txt - リリースノート

最終更新日: 2009/4/10

マスカットプロジェクト
http://maskat.sourceforge.jp/


1. 概要
───────────────────────────────────

マスカットフレームワークは Web ブラウザ上で動作するリッチクライアント
アプリケーションのための実行環境および開発フレームワークです。

マスカットフレームワーク バージョン 2.1 は、バージョン 2.0 で一新した
内部アーキテクチャをベースとし、アプリケーション実行時の性能や開発時の
デバッグ容易性を高めたマイナーバージョンアップにあたります。

この文書では、マスカットフレームワーク 2.0 および 1.x の開発者向けに、
マスカットフレームワーク 2.1 における変更点を説明します。


2. コンテナ HTML に関する変更
───────────────────────────────────

2.1 JavaScript ファイルの圧縮によるロード時間の短縮

アプリケーションの初回起動時のロード時間を短縮するため、フレームワーク
・コアやプラグインの JavaScript ファイルを圧縮しました。ファイルサイズ
は圧縮前と比較して 1/3 以下になります。

フレームワークの読み込み方法は従来と同様です。HTML 文書には maskat.js
のみを指定してください。

・例:
<script type="text/javascript"
src="path/to/maskat/core/maskat.js"></script>


2.2 非圧縮版の JavaScript ファイルの利用

圧縮済みの JavaScript ファイルはアプリケーションの性能を高める一方で、
開発中のデバッグを困難にします。このため、マスカットフレームワークでは
非圧縮版の JavaScript ファイルも同梱しています。

非圧縮版のフレームワーク・コア (maskat.js.uncompressed) を HTML 文書で
指定するとアプリケーションがデバッグモードで開始され、プラグインも非圧
縮版 (plugin.js.uncompressed) がロードされます。

・例:
<script type="text/javascript"
src="path/to/maskat/core/maskat.js.uncompressed"></script>


3. フレームワーク・コアに関する変更
───────────────────────────────────

3.1 動作検証済みブラウザの変更

マスカットフレームワーク 2.1 では下記の Web ブラウザを動作検証済み環境
に追加しました。

・Windows Internet Explorer 7
・Mozilla Firefox 3

また、下記の Web ブラウザを動作検証済み環境から除外しました。

・Mozilla Firefox 1.5


3.2 ログメッセージの改善による分析支援

マスカットフレームワーク 2.1 ではイベント処理の各段階でフレームワーク
の動作状況をログ (情報/デバッグ/トレース) に自動的に出力しています。
ログレベルの設定に従って以下の情報を得ることができます。

・イベント処理の開始 (INFO)
・コールバック関数の呼び出し (DEBUG)
・レイアウトから要求メッセージへのデータバインド (TRACE)
・要求メッセージの送信 (DEBUG)
・応答メッセージの受信 (DEBUG)
・応答メッセージからレイアウトへのデータバインド (TRACE)
・イベント処理の終了 (INFO)

イベント処理中にエラーが発生した場合はエラー内容がログに出力されます。
デバッグ時に正常な処理がどこまで行われており、エラーの発生個所や原因が
どこにあるのかを分析するためにログを活用してください。


3.3 window.onerror ハンドラによるエラー処理

マスカットフレームワーク 2.1 はアプリケーションの実行中に補足されない
例外が発生した場合、可能な限り window.onerror ハンドラに通知してエラー
処理を行います。

デフォルトの window.onerror ハンドラではロガーにエラーメッセージを出力
する動作を行います。アプリケーション開発者は maskat.js の読み込み後に
独自の window.onerror ハンドラを設定することで、統一的なポリシーに基づ
いてエラー処理を実装できます。

エラーハンドラの設定例を以下に示します。

例: 独自のエラーハンドラ
--------------------------------------------------------------------
window.onerror = function(message, url, line) {
alert(message + "\nURL: " + url + "\n行番号: " + line);
return false;
}
--------------------------------------------------------------------


3.4 プロパティファイルの書式変更

マスカットフレームワーク 2.0 ではフレームワークインストールフォルダに
置かれた JSON 形式のプロパティファイル (properties.json) を読み込んで
フレームワーク・コアやプラグインを設定する機構が導入されました。

バージョン 2.1 ではプロパティファイルをより簡素な書式に変更しました。
プラグイン識別子ごとにキーを作成し、その内部にプラグインごとの設定値を
記述します。この変更により、フレームワーク・コアのプロパティは "core"
というプロパティキーの内部に集約されました。

以下にプロパティファイルの記述例を示します。

例: プロパティファイル (properties.json)
--------------------------------------------------------------------
{
"core": {
"log.default.level" : "INFO",
"log.factory" : "maskat.log.SimpleLogFactory",
... (省略) ...
},

"compat": { "enabled": true },

"html": { "enabled": false },

"google": { "enabled": false, "key": "ABCDE" },

"rialto": {
"enabled": false,
"isDebug": false,
"traceLevel": 0,
"isTestVersion": false,
"language": "en",
"skin": "standart"
},

... (省略) ...
}
--------------------------------------------------------------------

既存のアプリケーションとの後方互換性および移行のため、従来の形式のプロ
パティファイルも利用可能です。ただし、従来の形式は非推奨として廃止予定
のため、新たに開発するアプリケーションは新しい形式でプロパティファイル
を記述してください。


3.5 アプリケーションごとのプロパティの変更

同一のサーバ上で複数のアプリケーションがフレームワークを共有する場合に
すべて同じ設定値をを使用する必要がありました。マスカットフレームワーク
2.1 では HTML ファイルと同じフォルダにアプリケーションごとのプロパティ
ファイルを配置することで、フレームワーク固有のプロパティファイルの設定
値を上書きすることができます。

例えば、特定のアプリケーションのみ Google Maps 部品を使用したい場合に
HTML ファイルと同じフォルダに以下の内容を持つプロパティファイルを配置
することで、そのアプリケーションのみで Google 部品ライブラリを利用する
ことが可能です。

例: プロパティファイル (properties.json)
--------------------------------------------------------------------
{
"google": { "enabled": true },
}
--------------------------------------------------------------------

ここでは、Google AJAX API を指定する "key" 属性が省略されていることに
注意してください。省略した属性はフレームワークのインストールフォルダに
格納された共通のプロパティファイルの設定値が使用されます。


3.6 レイアウトスコープの導入

マスカットフレームワークは、レイアウト定義 XML のタグで記述された部品
をインスタンス化し、name 属性で指定された名前を持つ変数へ格納します。
以前のバージョンでは変数がグローバルスコープのため、アプリケーションに
含まれるすべてのレイアウトで部品名がユニークである必要がありました。

マスカットフレームワーク 2.1.0 では、各レイアウトが独自の変数スコープ
を持つように設定可能です。この機能を利用するためには、プロパティファイ
ルを以下のように設定してください。

例: プロパティファイル (properties.json)
--------------------------------------------------------------------
{
"core": {
"variable.scope": "layout"
}
}
--------------------------------------------------------------------

以前のバージョンとの互換性のため、このプロパティの既定値は "global" で
あり、変数スコープとしてグローバル変数を使用します。

スコープに格納された変数への参照は maskat.layout.Layout オブジェクトの
getVariable(name), setVariable(name, value) メソッドで取得・設定が可能
です。


3.7 変数によるラッパーオブジェクトの参照

前述のように、マスカットフレームワークはインスタンス化した部品を変数ス
コープに格納するさいに、Rialto コンポーネントなどの Ajax 部品への参照
を格納していました。

マスカットフレームワーク 2.1.0 では、変数にマスカット部品 (ラッパー)
への参照を格納するように設定可能です。この機能を利用するためには、プロ
パティファイルを以下のように設定してください。

例: プロパティファイル (properties.json)
--------------------------------------------------------------------
{
"core": {
"variable.widget": "wrapped"
}
}
--------------------------------------------------------------------

以前のバージョンとの互換性のため、このプロパティの既定値は "unwrapped"
であり、変数には Ajax 部品への参照を格納します。また、このプロパティに
"none" を設定した場合には変数を定義しません。


4. レイアウト定義 XML に関する変更
───────────────────────────────────

4.1 メッセージリソースの外部化

レイアウト定義 XML に記述する属性値をユーザの言語設定などに応じて動的
に切り替えるため、maskat.util.Message クラスが管理するメッセージリソー
スを外部化しました。

以下の手順により、実行時にクライアント側でメッセージリソースを置換する
ことができます。

1) メッセージリソースを JSON 形式でサーバ上に配置します。

例: myapp-resources.json
------------------------------------------------------------
{
"addressLabelText" : "住所",
"nameLabelText" : "氏名",
"privacyAgreementText " : "個人情報の取り扱いに同意する",
"submitButtonText" : "送信"
}
------------------------------------------------------------

2) レイアウト定義 XML のロード前に 1) で配置したメッセージリソースを
maskat.util.Messages クラスに読み込みます。

例: JavaScript 処理
------------------------------------------------------------
maskat.util.Messages.loadTemplates("myapp-resources.json");
------------------------------------------------------------

3) レイアウト定義 XML では文字列内に #{key} の形式でメッセージを参照
することができます。例として、Rialto 部品のテキストボックスの初期
値やボタンのタイトルの設定例を以下に示します。

例: レイアウト定義 XML
------------------------------------------------------------
<text name="nameText" left="23" top="23" width="85"
initValue="#{nameLabelText}"/>
<text name="addressText" left="23" top="23" width="85"
initValue="#{addressLabelText}"/>
<button name="remoteCalculateButton" left="23" top="107"
title="#{submitButtonText}" />
------------------------------------------------------------


4.2 データバインド API のデフォルト実装

すべてのマスカット部品の親クラスにあたる maskat.layout.Widget クラスが
規定するデータバインド API (setValue, getValue メソッド) にデフォルト
実装を追加しました。

このデフォルト実装ではイベント定義 XML で source または target 要素の
teleType 属性にマスカット部品のメソッド名またはプロパティ名を指定し、
データバインドにおける値の取得・設定に利用できます。

・例1: Rialto 部品の日付型テキストボックスから「年」「月」「日」を
取得し、それぞれ個別の XML ノードとして送信する
<source obj="dateText" teleType="getYear" node="year" />
<source obj="dateText" teleType="getMonth" node="month" />
<source obj="dateText" teleType="getDay" node="day" />

・例2: Rialto 部品のボタンの "comment" プロパティに応答メッセージに
含まれる文字列をバインドする
<target out="myButton" teleType="comment" in="comment" />

teleType 属性を省略した場合、データバインドで使用する既定のメソッド名
もしくはプロパティ名を defaultSetter, defaultGetter プロパティを用いて
決定します。


4.3 部品の表示/非表示、有効/無効の切り替え

すべてのマスカット部品の親クラスにあたる maskat.layout.Widget クラスに
部品の表示/非表示の状態や、有効/無効の状態を切り替えるためのメソッド
を追加しました。

・isEnabled()
部品が有効である場合に true を返します。

・setEnabled(enabled)
部品の有効/無効を設定します。

・isVisible()
部品が表示されている場合に true を返します。

・setVisible(visible)
部品の表示/非表示を設定します。


4.4 キーイベントの処理

マスカット 2.1.0 ではキーイベントに対する処理を定義する新しい XML 文書
(キーバインド定義 XML) が導入されました。キーバインド定義 XML では特定
のレイアウトや、そのレイアウトに配置された特定の部品がフォーカスされて
いる状況に対して、キーイベント処理を定義します。

キーイベント処理はキー操作、実行タイミング、処理内容の組み合わせで指定
します。

・キー操作
キー操作を表す文字列です。"CTRL+C" のように複数のキーの組み合わせ
を指定可能です。

・実行タイミング
"onkeydown", "onkeypress", "onkeyup" のいずれかのタイミングを指定
します。デフォルトは "onkeydown" です。

・処理内容
以下のいずれかの処理を実行します。また、複数の処理を指定して順番に
実行することも可能です。
1) フォーカスの移動 (前/後, 先頭/末尾)
2) フォーカスの設定
3) 部品の状態変更 (有効/無効, 表示/非表示)
4) 部品のイベント実行
5) JavaScript 関数の実行

以下の例では、ログインフォームのレイアウトで [Enter] キーをフォーカス
遷移に使用します。ただし、フォーカスが送信ボタンにある場合は例外として
ボタンの onclick イベントを実行します。

例: キーイベント定義 XML
------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<keybinding layout="loginLayout">
<default>
<bind key="Enter">
<move-focus type="next" />
</bind>
</default>

<component id="submitButton">
<bind key="Enter">
<maskat-event type="onclick" target="submitButton" />
</bind>
</component>
</keybinding>
------------------------------------------------------------

レイアウトのロード後、画面遷移定義 XML の loadKeyBinding タグを用いて
キーイベント定義 XML を読み込みます。


マスカットフレームワーク 2.0 までと同様に、部品クラスで handleKeyEvent
メソッドをオーバーライドし、部品の種類ごとのキーイベント処理を定義する
ことも可能です。


5. イベント定義 XML に関する変更
───────────────────────────────────

5.1 コールバックインターフェースの改善

マスカットフレームワーク 2.1.0 ではイベント処理の各段階で呼び出される
コールバック関数のパラメータが変更されました。

・イベントハンドラ共通のコールバック関数 (start, finish) にはレイア
ウト上で発生したイベントの情報が渡されます。

------------------------------------------------------------------
【書式】
function callback(event)
【引数】
event : maskat.evnt.Event クラスのインスタンス。
レイアウト上で発生したイベントの情報を表します。
------------------------------------------------------------------

・リモートイベントハンドラからのコールバック関数 (before, after,
timeout) ではイベント情報に加え、リモート通信のコンテキストが渡さ
れます。

------------------------------------------------------------------
【書式】
function(event, context)
【引数】
event : maskat.evnt.Event クラスのインスタンス。
レイアウト上で発生したイベントの情報を表します。
context : maskat.event.RemoteEventContext のインスタンス。
サーバとの HTTP 通信の状態を格納しています。
------------------------------------------------------------------

・通信エラー発生時 (onErrorTele) のコールバック関数ではサーバからの
応答を XML DOM 形式で渡していましたが、他のリモートイベントからの
コールバック関数と引数を統一しました。

------------------------------------------------------------------
【書式】
function(event, context)
【引数】
event : maskat.evnt.Event クラスのインスタンス。
レイアウト上で発生したイベントの情報を表します。
context : maskat.event.RemoteEventContext のインスタンス。
サーバとの HTTP 通信の状態を格納しています。
------------------------------------------------------------------

サーバが返却した HTTP 応答が XML 形式であり、ルート要素 errors を
持つ場合にコールバック関数が実行されます。このとき、XML を自動的に
解析して第二引数 context の errorMessages プロパティにオブジェクト
の配列として格納します。

例: HTTP 応答
------------------------------------------------------------------
Content-Type: application/xml

<?xml version="1.0" encoding="UTF-8">
<errors>
<error id="ERR_100">データの登録に失敗しました。</error>
<error id="ERR_101">ID が重複しています。</error>
</errors>
------------------------------------------------------------------

ルート要素は複数の子要素 error を持つことができるため、サーバ側で
発生した複数のエラーを通知できます。また、error 要素では任意の属性
やテキスト要素を用いてエラーの内容を表現することができます。前述の
XML 文書の例では以下のように context オブジェクトが設定されます。

例: context オブジェクトに設定される内容
------------------------------------------------------------------
context.errorMessages = [
{ id: "ERR_100", message: "データの登録に失敗しました。" },
{ id: "ERR_101", message: "ID が重複しています。 }
];
------------------------------------------------------------------

後方互換性のため、第一引数 event は従来のフレームワークがコールバック
関数の引数に渡していた param オブジェクトと同じプロパティを持ちます。
これらのプロパティは今後のバージョンで非推奨として廃止する予定のため、
新たに開発するアプリケーションでは新しい形式でコールバック関数を記述し
てください。


以上

───────────────────────────────────
Copyright(C) 2006-2009 マスカットプロジェクト

Changelog


マスカットフレームワーク
CHANGELOG.txt - 変更履歴

最終更新日: 2008/4/10

マスカットプロジェクト
http://maskat.sourceforge.jp/

2.1.0 (リリース日: 2009年4月10日)
───────────────────────────────────

・機能リクエストへの対応
#15216 コールバック関数内で画面遷移の分岐 (branch プロパティ) を指定したい


2.0.0 (リリース日: 2008年5月21日)
───────────────────────────────────

・内部アーキテクチャを変更し、コードベースを一新


1.4.5 (リリース日: 2007年8月8日)
───────────────────────────────────

・ブラウザ版IDEのタブフォルダ表示の不具合を修正


1.4.5 (リリース日: 2007年6月29日)
───────────────────────────────────

・[maskatFW/core/ext/maskat/]配下の拡張JSをmaskat.jsに集約
 以下のファイルをmaskat.jsに集約しました
 - codeLabelTeleConsumer.js
 - googleMapEx.js
 - iFrameEx.js
 - window.js
 - menu.js
・[maskatFW/core/ext/maskat/]配下のCSSファイルを統一してmaskat.cssを追加
 以下のファイルを統一してmaskat.cssを追加しました
 - window.css
 - menu.css
 以下の場所に追加しました
 [maskatFW/core/style/maskat.css]
・Rialto javascript APIv0.9に対応
 v0.9の変更点は以下の通りです
 - グリッドのCSS定義が変更されました
 - GUIオブジェクト「タブフォルダ」でタブの位置を上下左右に配置できるようになりました
 ■ タブ位置変更方法
 ・ tabFolerタグにorientation属性を追加します
 <tabFolder name="tf1" top="80" ... orientation="b">
 orientationに指定する値は、"t"、"b"、"l""、"r"の4つです(省略した場合、t)
 t:上
 b:下
 l:左
 r:右
 ※注意:l、rを指定し、左右にタブを配置した場合、テキストが横に表示され、
 先頭の1文字程度しか表示されません。一文字ごとに改行(&lt;br&gt;)を入れ縦にして下さい
・rialto.js変更
 - テキストボックス入力時に最初に半角空白が入力された場合(下記、例参照)、削除するようにしました
 例) テキストボックス入力文字:「□□マスカット!!」(□は半角空白) → 「マスカット!!」
・maskatConfig.js変更
 - HTMLファイルに記述されていた以下のコードをmaskatConfig.jsに追加し、HTMLファイルから削除しました
 以下、HTMLファイルから削除したコード
 <script type="text/javascript">
 rialtoConfig.pathRialtoE = "../../maskatFW/rialtoEngine/";
 </script>

【バグ対応】
#10422 Layoutのremoveについて
概要:menu.jsを読み込んでいない場合、removeLayoutを使用したときに発生するバグを修正しました


1.4.4 (リリース日: 2007年5月18日)
───────────────────────────────────

・画面遷移機構を実装
・新たに3つのコンポーネントを追加
- screenコンポーネント
- confirmDialogコンポーネント
- endDialogコンポーネント
・eventタグにconfirmDialogとendDialog属性を追加
・textコンポーネントのdatatypeにDAとDTを追加
- datatype="DT": YYYY-MM-DDT00:00:00
- datatype="DA": YYYY-MM-DD

【リクエスト対応】
・9890 Mask@IDEのTree表示について
・9519 空データをgridに読み込ませるとgridがクリアされない
・9957 バリデーションについて
・9290 JavaScript変数のマッピング(in)について
・9312 Gridから送信電文へのマッピングについて

【バグ対応】
・9968 gridクリック時のバグ
・10067 レイアウトの表示順序


1.4.3 (リリース日: 2007年3月9日)
───────────────────────────────────

・デモコンテンツ「chatClient」を追加
・デモコンテンツ「codeLib」でデータが表示されないバグを修正
・レイアウト定義XML、イベント定義XML、HTMLファイルに記述された
JavaScriptを別ファイルに分離
・JavaScriptのログ出力部品「log4javascript」を追加
デモコンテンツ「PetStore」にlog4javascriptのサンプルを追加

【バグ修正】
・9807 GUIオブジェクトを2回続けて選択すると不具合が発生する


1.4.2 (リリース日: 2007年2月16日)
───────────────────────────────────

・GoogleMapsのデモコンテンツ「お店探し」を追加


1.4.1 (リリース日: 2007年1月19日)
───────────────────────────────────

・rialtoのバージョンが0.8.6にアップ
・マスカット本体のjsファイルを一つ(maskat.js)に統一
・keyNavi機能を追加
・iFrame(拡張部品)を追加


1.2.2 (リリース日: 2006年11月30日)
───────────────────────────────────

・全ての定義ファイル及びhtmlファイルのエンコードをUTF-16から
UTF-8に統一
・レイアウトインタープリターのsplitterタグ処理にdivsplitterの
name属性不具合に対応(div1とdiv2)

【リクエスト対応】
・9466 divHtmlをレイアウト部品のように使いたい

【バグ修正】
・9463 imageがクリッカブルにならない
・9464 ループ内の無名関数
・9465 受信電文にhtmlのソースを含めたい
・9500 imageにaltはつけられますか


1.2.1 (リリース日: 2006年11月10日)
───────────────────────────────────

・googleMapを拡張部品として追加
・イベント定義XMLのsourceタグとtargetタグにteleTypeを追加


1.2.0 (リリース日: 2006年10月6日)
───────────────────────────────────

・マスカットブラウザ版IDEを同パッケージにした
・受信電文をカスタマイズできるように変更
・レイアウト定義とイベント定義XMLファイルのエンコード
をUTF-16に変更
・PHP、JavaEEのサーバサイドを別パッケージに変更

【受信電文カスタマイズの詳細】

(1). 受信電文の階層構造を書き換えることができます。
イベント定義XMLのevent要素のafter属性で、param.recvDOMから
受信電文を取得し、以下の例のように書き換えることができます。

既存のビジネスロジックが、マスカットの仕様外の
xmlを出力する際などにご利用いただけます。

例:
function afterfunction(param){

//myDOMに受信電文を格納
var myDOM = param.recvDOM;

//myDOMに対してDOM操作を記述

//上書き
param.recvDOM = myDOM;
}

(2). 二階層受信電文からgridへのデータバインディングができます。
イベント定義のtarget要素のin属性を省略することで、gridにバインディングされます。

例:
・三階層受信電文からgridへのバインディング
受信電文:
<customers>
<customer><name>xxx</name><address>addressxxx</address></customer>
<customer><name>yyy</name><address>addressyyy</address></customer>
</customers>
イベント定義:
<target out="gridResult" in="customers" inkey="customer">
<bind tokey="0" node="name"/>
<bind tokey="1" node="address"/>
</target>

・二階層受信電文からgridへのバインディング
受信電文:
<customer><name>xxx</name><address>addressxxx</address></customer>
<customer><name>yyy</name><address>addressyyy</address></customer>
イベント定義:
<target out="gridResult" inkey="customer">
<bind tokey="0" node="name"/>
<bind tokey="1" node="address"/>
</target>

(3). 複数型のデータを1階層の送信電文で送信できます。
event定義XMLのsource要素のnode属性を省略することで、1階層で送信できます。

例:
イベント定義:
<source obj="myGrid" childNode="data">
<bind fromkey="0" node="col1"/>
</source>
送信電文:
<data><col1>xxx</col1></data>
<data><col1>yyy</col1></data>


1.1.7 (リリース日: 2006年9月25日)
───────────────────────────────────

2006-09-25 [v1.1.7]
【バグ修正】
・9058 ブラウザ版IDEでスクロールができない
・9059 マスカットが正常にインストールされない
・9062 同期通信のbefore/afterイベントにてポップ
アップが表示されたままになる


1.1.6 (リリース日: 2006年9月15日)
───────────────────────────────────

・初版


以上

───────────────────────────────────
Copyright(C) 2006-2009 マスカットプロジェクト