Babylon.js/typescript/MainClass.js

/// <reference path="simpleinteractionhelper.ts" />
var __extends = (this && this.__extends) || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var Sandbox;
(function (Sandbox) {
    var Vector2 = BABYLON.Vector2;
    var Group2D = BABYLON.Group2D;
    var Canvas2D = BABYLON.Canvas2D;
    var Size = BABYLON.Size;
    var PrimitivePointerInfo = BABYLON.PrimitivePointerInfo;
    var TestA = (function () {
        function TestA() {
        }
        TestA = __decorate([
            className("TestA")
        ], TestA);
        return TestA;
    }());
    Sandbox.TestA = TestA;
    var TestB = (function (_super) {
        __extends(TestB, _super);
        function TestB() {
            _super.apply(this, arguments);
        }
        TestB = __decorate([
            className("TestB")
        ], TestB);
        return TestB;
    }(TestA));
    Sandbox.TestB = TestB;
    function className(name) {
        return function (target) {
            target["__bjsclassName__"] = name;
        };
    }
    Sandbox.className = className;
    function getClassName(object) {
        var name = null;
        if (object instanceof Object) {
            var classObj = Object.getPrototypeOf(object);
            name = classObj.constructor["__bjsclassName__"];
        }
        if (!name) {
            name = typeof object;
        }
        return name;
    }
    Sandbox.getClassName = getClassName;
    var MainClass = (function () {
        function MainClass() {
        }
        MainClass.prototype.start = function () {
            BABYLON.Engine.CodeRepository = "/src/";
            BABYLON.Engine.ShadersRepository = "/src/Shaders/";
            if (BABYLON.Engine.isSupported() === false) {
                console.log("web browser doesn't support WebGL");
                return;
            }
            var tb = new TestB();
            var res = getClassName(tb);
            res = getClassName(12);
            var pb = Object.getPrototypeOf(tb);
            var pa = Object.getPrototypeOf(pb);
            var nameB = pb.constructor["__className__"];
            var nameA = pa.constructor["__className__"];
            // Get the canvas element from our HTML below
            var htmlCanvasElement = document.querySelector("#renderCanvas");
            //var canvas2d = <HTMLCanvasElement>document.querySelector("#canvas2d");
            //var context = canvas2d.getContext("2d");
            //context.font = "8pt Lucida Console";
            //context.fillStyle = "red";
            //context.textBaseline = 'top';
            //context.fillText("ABCDEFGHIJKLMNOPQRSTUVWXYZ", 0, 0);
            // Load the BABYLON 3D engine
            this.engine = new BABYLON.Engine(htmlCanvasElement, true);
            // Now create a basic Babylon Scene object
            this.scene = new BABYLON.Scene(this.engine);
            //this.scene.debugLayer.show();
            //var instData = new BABYLON.Rectangle2DInstanceData();
            //instData._instancesArray = new Float32Array(100);
            //instData._instanceOffset = 0;
            //instData.zBias = 1;
            //instData.transform = Matrix.Identity();
            //instData.properties = new Vector3(1, 2, 3);
            //var effect = this.engine.createEffect({ vertex: "rect2d", fragment: "rect2d" }, ["zBias", "transform", "properties"], [], [], "");
            //var node = instData.getClassTreeInfo();
            //setTimeout(() => {
            //    var offsets = node.classContent.getOffsetLocations(effect);
            //    },
            //    1000);
            // Change the scene background color to green.
            this.scene.clearColor = new BABYLON.Color3(56 / 256, 87 / 256, 145 / 256);
            // This creates and positions a free camera
            var hpi = Math.PI / 2;
            this.camera = new BABYLON.ArcRotateCamera("camera1", -hpi, hpi, 150, new BABYLON.Vector3(0, 0, 0), this.scene);
            this.camera.setTarget(BABYLON.Vector3.Zero());
            this.camera.attachControl(htmlCanvasElement);
            //this.scene.debugLayer.show();
            var canvas = Canvas2D.CreateScreenSpace(this.scene, "ScreenCanvas", new Vector2(0, 100), new Size(600, 600), Canvas2D.CACHESTRATEGY_DONTCACHE);
            canvas.backgroundFill = Canvas2D.GetSolidColorBrushFromHex("#C0808080");
            canvas.backgroundRoundRadius = 50;
            var g1 = Group2D.CreateGroup2D(canvas, "g1", new Vector2(300, 300), new Size(600, 600));
            g1.pointerEventObservable.add(function (d, s) {
                if (s.mask === PrimitivePointerInfo.PointerDown) {
                    canvas.setPointerCapture(d.pointerId, d.relatedTarget);
                }
                else if (s.mask === PrimitivePointerInfo.PointerUp) {
                    canvas.releasePointerCapture(d.pointerId, d.relatedTarget);
                }
                console.log("Pointer Down on " + d.relatedTarget.id);
            }, PrimitivePointerInfo.PointerDown | PrimitivePointerInfo.PointerUp);
            //var text = Text2D.Create(g1, "text", 100, 100, "20pt Lucida Console", "ABCDEFGHIJKLMNOPQRSTUVWXYZ");
            //text.origin = new Vector2(0.0, 1.0);
            var rectList = Array();
            var ss = 600;
            var rs = 100;
            for (var i = 0; i < 50; i++) {
                var posX = Math.random() * ss;
                var posY = Math.random() * ss;
                var w = Math.random() * rs;
                var h = Math.random() * rs;
                var rect = BABYLON.Rectangle2D.Create(g1, "rect" + i.toString(), posX, posY, w, h, BABYLON.Canvas2D.GetSolidColorBrush(new BABYLON.Color4(Math.random(), Math.random(), Math.random(), 1)));
                rect.roundRadius = Math.random() * Math.min(rect.size.width, rect.size.height) * 0.4;
                rect.origin = new Vector2(0.5, 0.5);
                rectList.push(rect);
            }
            var z = canvas.getActualZOffset();
            z = g1.getActualZOffset();
            z = rectList[0].getActualZOffset();
            z = rectList[1].getActualZOffset();
            setInterval(function () {
                //g1.rotation += 0.003;
                //rectList.forEach(r => r.rotation += 0.003);
                //rectList[49].position = new Vector2(rectList[49].position.x + 0.1, rectList[49].position.y+0.6);
                //                sprite.rotation += 0.005;
                //rect.rotation += 0.005;
            }, 10);
            //var ii = new IntersectInfo2D();
            //htmlCanvasElement.addEventListener("pointerdown", (event: PointerEvent) => {
            //    var pickPos = new Vector2(event.offsetX, canvas.actualSize.height - event.offsetY);
            //    ii.pickPosition = pickPos;
            //    ii.findFirstOnly = false;
            //    if (canvas.intersect(ii)) {
            //        console.log(`pickPos: ${pickPos.toString()}, intersect: ${ii.intersectedPrimitives[0].prim.id} at: ${ii.intersectedPrimitives[0].intersectionLocation.toString()}`);
            //    }
            //});
            //var texture = new Texture("assets/rock2.png", this.scene, true, true, Texture.NEAREST_SAMPLINGMODE);
            //var sprite = Sprite2D.Create(canvas, "sprite1", 250, 250, texture, new Size(128, 128), new Vector2(0,0));
            //sprite.origin = Vector2.Zero();
            //var canvas = Canvas2D.CreateWorldSpace(this.scene, "ScreenCanvas", new Vector3(0, 0, 0), Quaternion.RotationYawPitchRoll(Math.PI / 4, Math.PI/4, 0), new Size(100, 100), 4, Mesh.DEFAULTSIDE, Canvas2D.CACHESTRATEGY_CANVAS);
            //canvas.backgroundFill = Canvas2D.GetSolidColorBrushFromHex("#C0C0C040");
            //canvas.backgroundRoundRadius = 50;
            //var g1 = Group2D.CreateGroup2D(canvas, "group", Vector2.Zero(), null);
            //g1.scale = 4;
            //var rect = Rectangle2D.Create(g1, "rect", 50, 50, 25, 25, null, Canvas2D.GetGradientColorBrush(new Color4(0.9, 0.3, 0.9, 1), new Color4(1.0, 1.0, 1.0, 1)));
            //rect.borderThickness = 2;
            //rect.roundRadius = 2;
            //var insideRect = Rectangle2D.Create(rect, "insideRect", 0, 0, 10, 10, Canvas2D.GetSolidColorBrushFromHex("#0040F0FF"));
            //insideRect.roundRadius = 1;
            //setInterval(() => {
            //    rect.rotation += 0.01;
            //}, 10);
            //let canvas2 = Canvas2D.CreateScreenSpace(this.scene, "ScreenCanvas", new Vector2(0, 0), new Size(this.engine.getRenderWidth(), this.engine.getRenderHeight()), Canvas2D.CACHESTRATEGY_DONTCACHE);
            //var g1 = Group2D.CreateGroup2D(canvas2, "g1", new Vector2(0, 100));
            ////g1.rotation = Math.PI / 5;
            //var g2 = Group2D.CreateGroup2D(g1, "g2", new Vector2(0, 0), new Size(500, 500));
            //var texture = new Texture("assets/rock2.png", this.scene, true, true, Texture.NEAREST_SAMPLINGMODE);
            //var sprite = Sprite2D.Create(g2, "sprite1", 250, 250, texture, new Size(128, 128), new Vector2(0,0));
            ////sprite.invertY = true;
            //sprite.origin = Vector2.Zero();
            //var r = Rectangle2D.Create(g1, "rect1", 200, 200, 90, 90, Canvas2D.GetSolidColorBrush(new Color4(0.3, 0.3, 0.9, 1)));
            //r.origin = new Vector2(0, 1);
            //r.roundRadius = 0;
            //var r3 = Rectangle2D.Create(g1, "rect3", 200, 50, 200, 90, Canvas2D.GetSolidColorBrush(new Color4(0.3, 0.9, 0.9, 1)));
            //r3.origin = new Vector2(0, 0);
            //r3.roundRadius = 0;
            //let rrList = new Array<Rectangle2D>();
            //for (let i = 0; i < 20; i++) {
            //    let rr = Rectangle2D.Create(g1, `rr${i}`, 20 + i*20, 50, 40, 40, Canvas2D.GetSolidColorBrush(new Color4(0.3 + i/40, i/20, 0.1, 1)));
            //    rr.origin = new Vector2(0, 0);
            //    rr.roundRadius = 0;
            //    rrList.push(rr);
            //}
            ////var r5 = Rectangle2D.Create(g2, "rect3", 10, 10, 50, 50, null, Canvas2D.GetGradientColorBrush(new Color4(0.9, 0.3, 0.9, 1), new Color4(1.0, 1.0, 1.0, 1)));
            ////r5.origin = new Vector2(0, 0);
            ////r5.roundRadius = 1;
            ////var r2 = Rectangle2D.Create(g2, "rect1", 110, 10, 200, 200, Canvas2D.GetSolidColorBrush(new Color4(0.3, 0.3, 0.9, 1)), Canvas2D.GetGradientColorBrush(new Color4(0.9, 0.3, 0.9, 1), new Color4(1.0, 1.0, 1.0, 1)));
            ////r2.borderThickness = 10;
            ////r2.origin = new Vector2(0, 0);
            ////r2.roundRadius = 10;
            //var text = Text2D.Create(g1, "text", 0, 0, "20pt Lucida Console", "ABCDEFGHIJKLMNOPQRSTUVWXYZ");
            //let wc = Canvas2D.CreateWorldSpace(this.scene, "worldSpace", new Vector3(0, 0, 100), Quaternion.Identity(), new Size(100, 100), 4, Mesh.DEFAULTSIDE, Canvas2D.CACHESTRATEGY_CANVAS);
            //var r4 = Rectangle2D.Create(wc, "rect1", -40, 10, 200, 200, Canvas2D.GetSolidColorBrush(new Color4(0.3, 0.3, 0.9, 1)), Canvas2D.GetGradientColorBrush(new Color4(0.9, 0.3, 0.9, 1), new Color4(1.0, 1.0, 1.0, 1)));
            //r4.borderThickness = 10;
            //r4.rotation = 0.2;
            //r4.origin = new Vector2(0, 0);
            //r4.roundRadius = 10;
            //            setInterval(() => {
            //                rrList.forEach(r => r.rotation += 0.009);
            ////                g2.position = new Vector2(g2.position.x + 0.1, g2.position.y);
            ////                sprite.rotation += 0.005;
            ////                g1.scale += 0.001;
            ////                r3.position = new Vector2(r3.position.x + 0.0, r3.position.y + 0.1);
            //                //text.position = new Vector2(text.position.x + 0.0, text.position.y + 0.1);
            //                //r.rotation += 0.005;
            //                //r3.rotation -= 0.005;
            ////                g1.scale += 0.0001;
            //}, 10);
            // This creates a light, aiming 0,1,0 - to the sky.
            //var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), this.scene);
            //var light = new BABYLON.DirectionalLight("light1", new BABYLON.Vector3(0, 0, 1), this.scene);
            var light = new BABYLON.PointLight("light1", new BABYLON.Vector3(50, 50, -70), this.scene);
            //light.intensity = 10;
            //light.intensity = 0.5;
            //light.specular = new BABYLON.Color3(0, 0, 0);
            var self = this;
            //var box = Mesh.CreateBox("box", 1, this.scene);
            //box.position = new Vector3(1, 2, 3);
            ////this.scene.constantlyUpdateMeshUnderPointer = true;
            //var box2 = Mesh.CreateBox("box", 2, this.scene);
            //box2.position = new Vector3(-5, 0, 0);
            //box2.parent = box;
            //var mtl = new StandardMaterial("mtl", this.scene);
            //mtl.diffuseColor = new Color3(0, 1, 0);
            //box2.material = mtl;
            //var sih = new SimpleInteractionHelper(this.scene);
            //var points = new Array<Vector3>();
            //points.push(new Vector3(0, 0, 0));
            //points.push(new Vector3(0, 1, 0));
            //points.push(new Vector3(1, 1, 0));
            //points.push(new Vector3(1, 0, 0));
            //points.push(new Vector3(0, 0, 0));
            //var lineMesh = Mesh.CreateLines("lines", points, this.scene);
            //lineMesh.geometry.boundingBias = new Vector2(0, 0.01);
            // Register a render loop to repeatedly render the scene
            this.engine.runRenderLoop(function () {
                htmlCanvasElement.width = window.innerWidth - 20;
                htmlCanvasElement.height = window.innerHeight - 20;
                if (self.scene) {
                    self.scene.render();
                }
            });
            // Watch for browser/canvas resize events
            window.addEventListener("resize", function () {
                if (self.scene) {
                    self.engine.resize();
                }
            });
            this.scene.registerBeforeRender(function () {
                //light.position = camera.position;
                //mousemov = false;
            });
            this.scene.afterRender = function () {
            };
        };
        return MainClass;
    }());
    Sandbox.MainClass = MainClass;
})(Sandbox || (Sandbox = {}));
//# sourceMappingURL=MainClass.js.map