UIViewとかをjavascriptで書いてみる

デモに必要だった機能しか実装していませんがViewControllerとmainを書くだけで図形を貼れるような物を作りました。

UIView
divエレメントの作成

UIWindow:UIView継承
UIViewやUIButtonで作成したオブジェクトを貼付ける
最下レイヤーのdivエレメント生成

UIButton:UIView継承
指定したイベントに指定したアクションをセットしたボタンの生成

UIViewController
UIViewやUIButtonをコントロール

大元のjsはもうちょっと手直しさせてください
これらを使用すると以下のコードで上の図が描けます。

function MyViewController(){
    var ui1 = new UIView();
    ui1.initWithFrameAndId([200,200],"ui1");
    ui1.setBackgroundcolor("blue");
    this.view.addSubview(ui1);
    
    var ui2 = new UIView();
    ui2.initWithFrameAndId([100,50],"ui2");
    ui2.setBackgroundcolor("green");
    this.view.addSubview(ui2);
    
    var box = new UIView();
    box.initWithFrameAndId([20,20],"box");
    box.setBackgroundcolor("red");
    ui1.addSubview(box);

    var act = function(){
        alert("Button Push!!");
    }

    var bt = new UIButton();
    bt.addActionEventtype(act,"onclick");
    bt.setFrame([30,30]);
    bt.setBackgroundcolor("yellow");
    ui1.addSubview(bt);
}
MyViewController.prototype = new UIViewController();
  
function main(){
    var myViewController = new MyViewController();
    var mywindow = new UIWindow();
    mywindow.addSubview(myViewController.view);
    mywindow.makeKeyAndVisible();
}