Webエリア4Dと会話する (2013)

Transcript

1. Web Area Phone Home Developer Conference Tokyo 2014 Webエリア4Dと会話する original presentation by Laurent Esnault ロホン・エノー
2. Web Area Phone Home Developer Conference Tokyo 2014 どちらのWebエリア?
3. Web Area Phone Home Developer Conference Tokyo 2014 +最新のアップデート +セキュリティ修正 +馴染みの振る舞い - Mac / Windowsで違いあり - OSのバージョンとともに変化 システム実装
4. Web Area Phone Home Developer Conference Tokyo 2014 +Mac / Windowsで同じ +システムに左右されない安定性 +4Dとの⾼い親和性 - セキュリティ修正なし - 振る舞いに違和感 統合WebKit
5. Web Area Phone Home Developer Conference Tokyo 2014 • Webアクセスにはシステム • UIにはWebKit HTML5/CSS3で⾼品質・ダイナミック なインタフェースを実現 判断基準 ユーザーインタフェース
6. Web Area Phone Home Developer Conference Tokyo 2014 使⽤例
7. Web Area Phone Home Developer Conference Tokyo 2014 Wakanda Studio 使⽤例
8. Web Area Phone Home Developer Conference Tokyo 2014 • システムが4Dを呼び，4DがIE/Safari/Webkitを呼び，
 そこからプラグインが呼び出される • プラグインは⾃分がブラウザの内部で動作している,
 と思い込んでいる • 4D，プロセス，ウィンドウ等について，
 まったく意識していない • 隔離性の乏しさは不安定の原因に • 出来る限り避けたほうが無難 対応しているが… プラグインについて
9. Web Area Phone Home Developer Conference Tokyo 2014 • 統合WebKit • HTMLをResourcesフォルダーに • コンテキストメニューを有効に • Web インスペクターを有効に WA SET PREFERENCE(*;“Web”;WA enable Web inspector;True) • $4dを有効に セットアップ
10. Web Area Phone Home Developer Conference Tokyo 2014 選択肢 • ファイルURLを開く o WA OPEN URL • HTML ソースを構築してセット o WA SET PAGE CONTENT 初期化
11. Web Area Phone Home Developer Conference Tokyo 2014 WA Evaluate JavaScript • WA Execute JavaScriptから名称変更 • 戻り値データ型を指定するための引数を追加 C_OBJECT($o) $o:=WA Evaluate JavaScript(*;”web”;”window.location”;Is object) Is boolean Is date Is time Is object Is text Is real Is longInt JavaScriptコール
12. Web Area Phone Home Developer Conference Tokyo 2014 WA EXECUTE JAVASCRIPT FUNCTION • 関数オブジェクトとして評価できるものであれば どんな⽂字列でも渡すことができる • 引数はJSデータ型に変換 • 戻り値は代⼊に合わせて変換 C_REAL($m) $s:="March 21, 2012“ WA EXECUTE JAVASCRIPT FUNCTION(*;”web”;”Date.parse”;$m;$s) JavaScriptコール
13. Web Area Phone Home Developer Conference Tokyo 2014 デモンストレーション Carousel
14. Web Area Phone Home Developer Conference Tokyo 2014 スカラータイプ タイプキャスト C_OBJECT Object C_TEXT String C_STRING String C_REAL Number C_LONGINT Number C_INTEGER Number C_BOOLEAN Boolean C_TIME Number milliseconds C_DATE String ISO 8601
15. Web Area Phone Home Developer Conference Tokyo 2014 •JavaScriptと同じルール •C_TEXTへの型変換はtoString()のコール同じ;
 toJSON()ではないので注意 •Objectは“[object Object]”になる •nullおよびundefinedは， 0, false, “”になる •Array, Object, 空ではない⽂字列，0ではない数値はtrueになる 型変換 タイプキャスト
16. Web Area Phone Home Developer Conference Tokyo 2014 オブジェクトに包んで渡す C_OBJECT($o) ARRAY REAL($prices;0) fillPrices(->$prices) OB SET ARRAY($o;”prices”;$array) WA EXECUTE JAVASCRIPT FUNCTION(*;”web”;”listPrices”;*;$o) タイプキャスト 配列
17. Web Area Phone Home Developer Conference Tokyo 2014 C_DATE <-> Date 変換にはJSONを使⽤ Date.toJSON() はローカルタイムゾーンを反映する (new Date(2014,1,26)).toJSON() => "2014-02-25T15:00:00.000Z" JSON Stringify(!2014/02/26!) => "2014-02-25T15:00:00Z" タイムゾーンを超えてデータを交換する場合は注意! ローカルタイムゾーンを無視したい場合: SET DATABASE PARAMETER(JSON use local time;0) タイプキャスト ⽇付と時間
18. Web Area Phone Home Developer Conference Tokyo 2014 • ファイルURL file://dbResourcesFolder/pict.png • データURI <img src="data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUA AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/ w38GIAXDIBKE0DHxgljNBAAO 9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" /> タイプキャスト ピクチャ
19. Web Area Phone Home Developer Conference Tokyo 2014 $d1:=!2014/2/26! $iso:=String($d1;ISO Date GMT) $d2:=Date($iso) •Date/String関数はISO 8601をサポート •いずれもローカルタイムゾーンを使⽤ •String(ISO Date GMT)とDate() は反対の関係 タイプキャスト ⽇付と時間 $iso=“2014-02-25T15:00:00Z”
20. Web Area Phone Home Developer Conference Tokyo 2014 • JavaScriptエラーを4Dに転送 エラーハンドリング
21. Web Area Phone Home Developer Conference Tokyo 2014 4Dコールバック 普通のJavaScript関数と同じようにプロジェクトメ ソッドをコールすることができる
22. Web Area Phone Home Developer Conference Tokyo 2014 すべてのプロジェクトメソッドは$4dオブジェクト のメソッド（関数プロパティ）として利⽤できる 4Dコールバック <button onclick=“$4d.doBeep()”> Beep </button>
23. Web Area Phone Home Developer Conference Tokyo 2014 4D メソッドの呼び出しは⾮同期 
 $0を受け取るためにはコールバック関数を使⽤する 4Dコールバック $4d.doRequest( “Ͳ͏ͳͷ?”, function( response) { alert( response+“ͩͦ͏Ͱ͢ɻ”); });