スポンサーサイト

--年--月--日 --:--

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

iNotes Lite Framework - Common Property

2009年03月12日 00:14

iNotes Lite Framework ではグローバル変数のような仕組みを使う事が出来ます。
これは、Common Property と呼ばれるのですが、今日はこの詳細について見てみます。

バックナンバー
1. iNotes Lite Framework - Frameset
2. iNotes Lite Framework - iNotes Lite Widgets
3. iNotes Lite Framework - Lazy loading code
4. iNotes Lite Framework - Basic Layout
5. iNotes Lite Framework - Common Property

(このエントリは以下の記事を参考に書かれています)
iNotes Lite framework (Notes/Domino Wiki)

iNotes Lite framework では、二つ以上のWidgetが一つのProperty を扱えるような"Common Property"と言う方法を提供しています。 Common propertyは名前つきの値で、どんなWidgetもアタッチする事が出来ます。
Common Property に対して変更が起こった場合、Widget にアタッチしているEYK() [observe()] メソッドが非同期的に実行されます。
p-color と言う名前のCommon Propertyと値を得るには、以下のようにします。

var oProperty = EPx.get('p-color'); 
var vValue = oProperty.BoB;

BoB vValue
EPx com_ibm_dwa_misc_commonProperty
BRW setValue

common propertyに新しい値をセットするには以下のようにします。

var oProperty = EPx.get('p-color');
oProperty.BRW('#808080');


common property を使用すると、以下のようなWidgetを作る事が出来ます。
com_ibm_dwa_ui_colorBox widget がどのように実装されているのかを知ることなく、<select> のonChange属性に書き込む事ができるようになります。


// Box changing color
// ------------------
function com_ibm_dwa_ui_colorBox(sId){
var oElem = AAA.EcK.getElementById(this.sId = sId);
var oProperty = EPx.get(oElem.getAttribute('com_ibm_dwa_misc_observes_color'));
oProperty.attach(this);
this.EYK(oProperty); // Pick up existing value
}

// =====================================
// Observe the color
// Inputs:
// oProperty - The property to observe
// =====================================
com_ibm_dwa_ui_colorBox.prototype.EYK = function com_ibm_dwa_ui_colorBox_observe(oProperty){
// ERD() checks if oProperty represents the latest value - As this function is called asynchronously
if (oProperty.ERD && !oProperty.ERD())
return;
var oElem = AAA.EcK.getElementById(this.sId);
oElem.style.backgroundColor = oProperty.BoB;
};
更に、以下のような要素があります。

<div class="s-stack" style="padding-top:5em;">
<div class="s-basicpanel" style="border:solid black 1px;"
com_ibm_dwa_ui_widget_class="com_ibm_dwa_ui_colorBox" com_ibm_dwa_misc_observes_color="p-e-colorselect-currentselected">
</div>
</div>
<div class="s-toppanel" style="height:5em;">
<form>
<select name="e-colorselect" class="s-label-light" onchange="EPx.get('p-e-colorselect-currentselected').BRW(this.value);">
<option value="#ffffff">Select color</option>
<option value="#ffc0c0">Red</option>
<option value="#c0ffc0">Green</option>
<option value="#c0c0ff">Blue</option>
</select>
</form>
</div>





コメント

    コメントの投稿

    (コメント編集・削除に必要)
    (管理者にだけ表示を許可する)

    トラックバック

    この記事のトラックバックURL
    http://hnagasim.blog8.fc2.com/tb.php/107-423841e5
    この記事へのトラックバック


    最新記事


    上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。