Contenu connexe
Similaire à トップエスイー勉強会2014第1回-INTER-Mediator (17)
Plus de Masayuki Nii (20)
トップエスイー勉強会2014第1回-INTER-Mediator
- 3. Agenda
論文採録実績(ソフトウェア論文)
• 新居 雅行, 顕志,石川 冬樹;エンドユーザーによる保守作業を可
能にするWebアプリケーションフレームワーク;コンピュータソフト
ウェア,pp.60-74,Vol. 31 No. 1 (2014)
開発フレームワークINTER-Mediatorの概要
フレームワークの動作上での特徴
INTER-Mediatorでの開発と保守
INTER-Mediatorの利用実績と今後の開発計画
3
14年6月13日金曜日
- 9. ページファイル
合成するページの
HTMLによるテン
プレート
<!DOCTYPE html>
<html>
<head>
<title>INTER-Mediator - Sample</title>
<script type="text/javascript" src="search_def.php">
</script>
</head>
<body onload="INTERMediator.construct()">
<div id="IM_NAVIGATOR"></div>
<table border="1" id="resultTable">
<thead>...</thead>
<tbody>
<tr>
<td><div data-im="postalcode@f3"></div></td>
<td><div data-im="postalcode@f7"></div></td>
<td><div data-im="postalcode@f8"></div></td>
<td><div data-im="postalcode@f9"></div></td>
</tr>
</tbody>
</table>
</body>
</html>
1.定義ファイ
ルの読み込み
4.ページ合成
の開始処理
2.要素にフィールド
とのバインドを指定
3.ページネーシ
ョンの生成場所
合成したページ
9
14年6月13日金曜日
- 11. バインディングの実装
11
データ
ベース
<input type=“text” data-im=“invoice@issueddt” />
data-im属性を元にデータベースアクセス
クエリー結果をタグにマージ
ページファイルでの記述
<input type=“text” data-im=“invoice@issueddt”
value=“2014-5-22 14:32” />
2014-5-22 14:32発行日:
更新のための情報を記憶
発行日:
レコード:invoiceid=4332
フィールド:issueddt
初期値:2014-5-22 14:32
クエリー結果
{ invoiceid: 4332,
customerid: 3456,
issueddt: 2014-5-22 14:32,
total: 45230 }
invoiceテーブルにアクセス
name: invoice
key: invoiceid
定義ファイルでの記述
作成するファイルへの記述内容
14年6月13日金曜日
- 12. 編集結果からデータベースへの更新
12
ユーザがテキストフィールドを修正
2014-5-21 16:59発行日:
初期値:
2014-5-22 14:32 ?
データベース側で変更があるかをチェック
変更がなければデータベースを更新
現在の値:
2014-5-21 16:59
データ
ベース
コントローラーで
更新を受け付ける
更新処理を呼び出
せるHTMLの構成
一般的なサーバ稼働のフレームワークの場合
データ修
正が可能
なモデル
にする
リクエストに応じて
モデルにアクセスし
てフィールドを変更
できるようにする
ページ上にあ
る同一データ
の別フィールド
表示の更新
INTER-Mediatorの場合
同一データと
バインドした
他の要素に自
動的に反映
様々な機能
をクラス内
に実装する
必要がある
要素へのバ
インディン
グの設定の
みで機能
14年6月13日金曜日
- 14. 繰り返しの実装(2)
クエリー結果
[{ invoiceid: 4332, ssueddt: 2014-5-22 14:32, total: 45230 },
{ invoiceid: 4333, ssueddt: 2014-5-22 14:56, total: 2301 },
….]
リピーターを
削除して別途
保存しておく
<tr><td><span data-im=“invoice@issueddt”></span></td></tr>
<table>
<tbody>
</tbody>
</table>
リピーターを複製し、1レコード分をマージ
マージしたリピーターをエンクロージャーの下位ノードとして追加
<tr><td><span data-im=“invoice@issueddt”>2014-5-22 14:32</span></td></tr>
<table>
<tbody>
<tr><td><span data-im=“invoice@issueddt”>2014-5-22 14:32</span></td></tr>
</tbody>
</table>
レコードの数
だけ繰り返す
<table>
<tbody>
<tr><td><span data-im=“invoice@issueddt”>2014-5-22 14:32</span></td></tr>
<tr><td><span data-im=“invoice@issueddt”>2014-5-22 14:32</span></td></tr>
</tbody>
</table>
14
14年6月13日金曜日
- 20. メンテナンス作業の分類
概要 宣言的な記述でできる作業例 宣言的な記述だけではできない例
1 ページ要素
•文字の色や罫線などスタイルを変更
•要素を表示する順序を変更
•フィールドを新たに追加表示
•計算結果を表示するフィールドを追加
•現実にはスキーマ変更も伴うよう
な改変
•UI要素以外に応答させるなど,イ
ベントへの特別な対応
2
データベース
要求
•レコード取得のための検索や並べ替え
条件の変更
•要求の動的な変更
•副問い合わせを含む要求
3
単一フィールド
応答
•小数以下の桁数を2桁から3桁に増加
•一定の文字列を前後に追加する
•未サポートの変換処理(単位変換処
理など)
4
クライアント
スクリプト
•特別な処理を行うボタンの設置
•未サポートのJavaScriptライブラ
リの利用
5
データベース
応答
•データベースだけで実現できない
ような集計処理
6 スキーマ変更
•テーブルやフィールド,ビューを
新たに作成する
* 新規ページ追加
•スクラッチから作成する
•既存ページを複製後,1∼6の改変をする
•スクラッチから作成する
•既存ページを複製後,1∼6の改変をする
20
14年6月13日金曜日