jsplash - adobe max 2009
TRANSCRIPT
Satoshi Ueyamaid:gyuque
JSplash swf to javascript converter
Adobe MAX 2009
JSplashとは？
SWFムービーをJavascriptとSVGだけで再生するツール
JSplashとは何か？
とりあえずデモ
詳細
変換ツール
プレーヤー
SVG生成
タグ実行
スクリプト変換
SWF
JSON
タグの例
{
tag:JSplash.tDefineShape,
id: 1,
bounds:{L:2374,R:8582,T:1744,B:5660},
fill_styles:[
{rgb:'000099'},{rgb:'6666cc'},{rgb:'ff6699'}
],
line_styles:[ {w:20,rgb:‘ffffff’},{w:20,rgb:‘000000’},{w:20,rgb:‘000000‘} ],
shape:[
{t:0,p:[6218,2895],f1:3,ls:2},{t:1,p:[290,-501]},{t:1,p:[2064,1192]},{t:1,p:[-
1192,2064]},{t:1,p:[-1162,-671]},{t:0,f1:1},{t:1,p:[0,609]},{t:1,p:[-
3834,0]},{t:1,p:[0,-
3834]},{t:1,p:[3834,0]},{t:1,p:[0,1141]},{t:0,f0:3,f1:2},{t:1,p:[0,2084]},{t:0,f0:1},{t
:1,p:[-902,-521]},{t:1,p:[902,-1563]},{t:0}
]
}
シェイプ定義
塗色
シェイプデータ
シェイプの描画例
{t:0,p:[6218,2895],f1:3,ls:2},
{t:1,p:[290,-501]},
{t:1,p:[2064,1192]},
{t:1,p:[-1192,2064]},
{t:1,p:[-1162,-671]},
{t:0, f1:1},
{t:1,p:[0,609]}
・
・
「右側塗り」設定
「右側塗り」設定
「左側塗り」なし始点
Official Flash Player
JSplash
http://gyu.que.jp/max/
本日のデモ
small G small Q
詳細
JSplashは、バーチャルマシンではありません。JSplashは、ActionScriptインタプリタではありません。
変換ツール
プレーヤー
SVG生成
タグ実行
スクリプト変換
SWF
JSON
もう少し詳しく
変換ツール
プレーヤー
スクリプト変換
SWF
逆コンパイルされたソース
Flare
ブラウザのJSエンジン
After
スクリプト（無理矢理）変換エンジン
function () {
var count;
if (!count) {
count = 0;
}
if (count == 2) {
_parent.gotoAndStop(3);
}
if (++count > 4) {
this.onEnterFrame = function () {if
(++count == 8) {_parent.doNext();}};
stop();
}
}
function () {
var count = this.__locals__.count;
with (this) {
var count;
if (!count) {
count = 0;
}
if (count == 2) {
_parent.gotoAndStop(3);
}
if (++count > 4) {
this.onEnterFrame = function () {if
(++count == 8) {_parent.doNext();}};
stop();
}
}
this.__locals__.count = count;
}Before
AS→JS (1)
var a = 5; trace(++a); trace(++a);
Frame 1 Frame 2 Frame 3
6 7
function() {} function() {} function() {}
保存 復帰 保存 復帰
ローカル変数の「またぎ」
AS→JS (2)
this._x = 0;
v = $version;
ムービークリップへの参照
ムービークリップのふりをするオブジェクトを bind
Global グローバルへの参照
function() {}
var
this / global
こんなんでいいのか？
デモ 「Elastic Santa」by Takayuki Fukatsu
意外と何とかなりました。
thank youhttp://www.libspark.org/svn/ruby/jsplash/trunk/