Skip to content

Texture and Light issue #134

Description

@ramsestom

I have an issue with texture lightening.

I made an example in babylonjs playground that works fine:
http://www.babylonjs-playground.com/#F3TFY#3

But in babylonHx, here is what I have:
babylonhx_texture_issue

You can see in the center a white square. It is supposed to be blue...

Here is the babylonHX source code of my example:

package;


import com.babylonhx.cameras.FreeCamera;
import com.babylonhx.lights.DirectionalLight;
import com.babylonhx.lights.HemisphericLight;
import com.babylonhx.lights.PointLight;
import com.babylonhx.materials.MultiMaterial;
import com.babylonhx.materials.PBRMaterial;
import com.babylonhx.materials.textures.RawTexture;
import com.babylonhx.math.Color3;
import com.babylonhx.mesh.MeshBuilder;
import com.babylonhx.mesh.SubMesh;
import com.babylonhx.mesh.VertexBuffer;
import com.babylonhx.mesh.primitives.Box;
import com.babylonhx.physics.PhysicsBodyCreationOptions;
import com.babylonhx.tools.EventState;
import com.babylonhx.tools.Tools;
import com.babylonhx.utils.Image;
import com.babylonhx.utils.typedarray.UInt8Array;
import com.babylonhx.cameras.ArcRotateCamera;
import com.babylonhx.Engine;
import com.babylonhx.materials.Material;
import com.babylonhx.materials.StandardMaterial;
import com.babylonhx.materials.textures.Texture;
import com.babylonhx.math.Vector3;
import com.babylonhx.math.Space;
import com.babylonhx.mesh.Mesh;
import com.babylonhx.Scene; 
import com.babylonhx.physics.PhysicsEngine;
import openfl.Assets;
import openfl.display.BitmapData;
import openfl.display.Sprite;
import openfl.events.Event;
import openfl.events.MouseEvent;
import openfl.geom.Point;
import openfl.geom.Vector3D;
import openfl.geom.Matrix3D;
import openfl.Lib;
import openfl.Vector;


class PhysicTextureIssueTest extends Sprite {

    private var scene:Scene;
    private var engine:Engine;

    private var mouse_clicked_start_time:Int;
    private var mouse_clicked_start_pos:Point;

    private var rotationAxis:Vector3;
    private var rotationAngle:Float;
    private var animationSpeed:Float = 0.05; //percent of rotation animation at each frame
    private var animationCount:Float = 0;

    private var _cube:Mesh;
    private var _cube_dimension:Int = 500;

    public function new() 
    {
        super();

        stage.addChild(this);

        engine = new Engine(this, false);   
        scene = new Scene(engine);

        engine.width = stage.stageWidth;
        engine.height = stage.stageHeight;


        //Create camera and light
        var camera = new ArcRotateCamera("Camera", 0, 0, 0, Vector3.Zero(), scene);
        camera.setPosition(new Vector3(0, 0, -_cube_dimension*2.5));
        camera.attachControl();

        var light = new PointLight("Omni", new Vector3( 0, 0, -_cube_dimension * 2.5), scene);

        //create scene objects
        createScene();


        stage.addEventListener(Event.RESIZE, resize);
        stage.addEventListener(Event.ENTER_FRAME, update);
        stage.addEventListener (MouseEvent.MOUSE_DOWN, onMouseDown);
        stage.addEventListener (MouseEvent.MOUSE_UP, onMouseUp);


        scene.registerBeforeRender(function(scene:Scene, ?es:EventState) {
            light.position = camera.position;
        });

        scene.getEngine().runRenderLoop(function () {
            scene.render();
        });

        enableOpenFL2D();
    }


    private function enableOpenFL2D():Void {
        var openflCameraMask:Int = 0xF0E1D2;
        var mainCamera = scene.activeCamera;
        if (scene.activeCameras.indexOf(mainCamera) == -1) {
            scene.activeCameras.push(mainCamera);
        }
        var openflCamera = new FreeCamera("openfl_nme_dummycamera", new Vector3(Math.POSITIVE_INFINITY, Math.POSITIVE_INFINITY, Math.POSITIVE_INFINITY), scene);
        openflCamera.fov = 0;
        openflCamera.layerMask = openflCameraMask; 
        var openflDummyMesh = Mesh.CreatePlane("openfl_nme_dummymesh", 0.1, scene);
        var openflDummyMaterial = new StandardMaterial("openfl_nme_DummyMaterial", scene);
        openflDummyMaterial.backFaceCulling = false;
        openflDummyMesh.material = openflDummyMaterial;
        openflDummyMesh.layerMask = openflCameraMask;
        scene.activeCameras.push(openflCamera);
    }


        private function createScene()
    {
        _cube = new Mesh("cube", scene);
        createInsideMesh();
    }

    private function createInsideMesh()
    {
        var _cell_width:Float = _cube_dimension / 10;
        var _cell_height:Float = _cube_dimension / 10;
        var _cell_depth:Float = _cube_dimension / 10;
        var offset_x = 2 * _cell_width;
        var offset_y = 2 * _cell_height;
        var offset_z = 2 * _cell_depth;


        var inside_material:StandardMaterial = new StandardMaterial("inside_mat", scene);
        inside_material.backFaceCulling = false;
        inside_material.diffuseColor=new Color3(0,0,1);

        var cellbox:Mesh = MeshBuilder.CreateBox("cell 1", {width:_cell_width, height: _cell_height, depth: _cell_depth}, scene);
        cellbox.position = new Vector3(
                offset_x,
                offset_y,
                offset_z
        );
        cellbox.material = inside_material;
        cellbox.parent = _cube;

        var cellbox2:Mesh = MeshBuilder.CreateBox("cell 2", {width:_cell_width, height: _cell_height, depth: _cell_depth}, scene);
        cellbox2.position = new Vector3(
                offset_x + _cell_width,
                offset_y,
                offset_z
        );
        cellbox2.material = inside_material;
        cellbox2.parent = _cube;

        var cellbox3:Mesh = MeshBuilder.CreateBox("cell 3", {width:_cell_width, height: _cell_height, depth: _cell_depth}, scene);
        cellbox3.position = new Vector3(
                offset_x - _cell_width,
                offset_y,
                offset_z
        );
        cellbox3.material = inside_material;
        cellbox3.parent = _cube;

        var cellbox4:Mesh = MeshBuilder.CreateBox("cell 4", {width:_cell_width, height: _cell_height, depth: _cell_depth}, scene);
        cellbox4.position = new Vector3(
                offset_x,
                offset_y + _cell_height,
                offset_z
        );
        cellbox4.material = inside_material;
        cellbox4.parent = _cube;

        var cellbox5:Mesh = MeshBuilder.CreateBox("cell 5", {width:_cell_width, height: _cell_height, depth: _cell_depth}, scene);
        cellbox5.position = new Vector3(
                offset_x,
                offset_y - _cell_height,
                offset_z
        );
        cellbox5.material = inside_material;
        cellbox5.parent = _cube;

        var cellbox6:Mesh = MeshBuilder.CreateBox("cell 6", {width:_cell_width, height: _cell_height, depth: _cell_depth}, scene);
        cellbox6.position = new Vector3(
                offset_x,
                offset_y,
                offset_z + _cell_depth
        );
        cellbox6.material = inside_material;
        cellbox6.parent = _cube;

        var cellbox7:Mesh = MeshBuilder.CreateBox("cell 7", {width:_cell_width, height: _cell_height, depth: _cell_depth}, scene);
        cellbox7.position = new Vector3(
                offset_x,
                offset_y,
                offset_z - _cell_depth
        );
        cellbox7.material = inside_material;
        cellbox7.parent = _cube;


        //physics
        var physOpt = new PhysicsBodyCreationOptions();
        physOpt.mass = 0;
        cellbox.setPhysicsState(PhysicsEngine.BoxImpostor, physOpt);
        cellbox2.setPhysicsState(PhysicsEngine.BoxImpostor, physOpt);
        cellbox3.setPhysicsState(PhysicsEngine.BoxImpostor, physOpt);
        cellbox4.setPhysicsState(PhysicsEngine.BoxImpostor, physOpt);
        cellbox5.setPhysicsState(PhysicsEngine.BoxImpostor, physOpt);
        cellbox6.setPhysicsState(PhysicsEngine.BoxImpostor, physOpt);
        cellbox7.setPhysicsState(PhysicsEngine.BoxImpostor, physOpt);


    }


    private function rotateCube(axis:Vector3D, angle:Float):Void
    {
        if (animationCount == 0) //allow rotation only if not already one on going
        {
            rotationAxis = new Vector3(axis.x, axis.y, axis.z);
            rotationAngle = angle;
            animationCount = 0;
            stage.addEventListener(Event.ENTER_FRAME, animationRotationHandler);
        }
    }

    private function animationRotationHandler(e:Event):Void 
    {
        animationCount += animationSpeed;
        if (animationCount > 1) { animationCount = 1; }
        _cube.rotate(rotationAxis, rotationAngle*animationSpeed, Space.WORLD);  

        if (animationCount >= 1) 
        {
            animationCount = 0;
            stage.removeEventListener(Event.ENTER_FRAME, animationRotationHandler);
        }
    }




    private function onMouseDown(event:MouseEvent):Void 
    {

        mouse_clicked_start_pos = new Point(event.stageX, event.stageY);
        mouse_clicked_start_time = Lib.getTimer();
    }


    private function onMouseUp(event:MouseEvent):Void 
    {
        if (mouse_clicked_start_time != 0)
        {
            var deltatime:Int = Lib.getTimer() -  mouse_clicked_start_time;
            if (deltatime > 0 && deltatime < 1000)
            {
                var deltaX:Float = mouse_clicked_start_pos.x - event.stageX;
                var deltaY:Float = mouse_clicked_start_pos.y - event.stageY;

                if (Math.abs(deltaX) > Math.abs(deltaY))
                {
                    if (Math.abs(deltaX)>(Lib.current.stage.stageWidth*0.1)) 
                    {
                        if (deltaX > 0) {rotateCube(new Vector3D(0, 1, 0), Math.PI/2);}
                        else {rotateCube(new Vector3D(0, 1, 0), -Math.PI/2); }
                    }   
                }
                else 
                {
                    if (Math.abs(deltaY)>(Lib.current.stage.stageHeight*0.1)) 
                    {
                        if (deltaY > 0) {rotateCube(new Vector3D(1, 0, 0), Math.PI/2);}
                        else {rotateCube(new Vector3D(1, 0, 0), -Math.PI/2); }
                    }   
                }
            }
        }
        mouse_clicked_start_time = 0;

    }

    function resize(e) {
        engine.width = stage.stageWidth;
        engine.height = stage.stageHeight;
    }

    function update(e) {
        engine._renderLoop();
    }

}

Also, if you rotate the shape (by swapping left-right or up-down in the babylonjs example or the babylonHx one), you can see in babylonHx some issue in regions where one box is in front of another. It is like the boxes are kind of transparents whereas they are not supposed to be...

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions