Famous / engine

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Adding a camera to a scene then resizing the scene deletes all meshes from the scene

CompSciFutures opened this issue · comments

Steps to reproduce

  1. Add some meshes to a `Scene`
  2. Add a `DOMElement` to the Scene (this is required for the bug to occur)
  3. Add a `Camera` to the same Scene
  4. Resize the said Scene with Scene#setScale()
  5. Observe the meshes will disappar

Isolation

Tested against:

  • v0.6.2 (hard to observe in the code example but its there)
  • v0.7.0
  • a5d7fd5

Code Example

    'use strict';

    console.log(famous);
    //var famous = require('famous');
    var DOMElement = famous.domRenderables.DOMElement;
    var FamousEngine = famous.core.FamousEngine;
    var Mesh = famous.webglRenderables.Mesh;
    var Color = famous.utilities.Color;
    var Geometry = famous.webglGeometries.Geometry;
    var Camera = famous.components.Camera;

    var scene = FamousEngine.createScene();
    var centeredOriginNode;

    FamousEngine.init();

    scene
        .setSizeMode('relative', 'relative', 'absolute')
        .setProportionalSize(0.7, 0.7, 0.7)
        .setAbsoluteSize(1000, 1000, 500)
        .setOrigin(0.5,0.5,0.5)
        .setRotation(0.5,0.5,0.5)
        ;

    centeredOriginNode =
        scene.addChild()
            .setSizeMode('relative','relative','relative')
            .setProportionalSize(0.6,0.6,0.6)
            .setAlign(0.5,0.5,0.5)
            .setOrigin(0.5,0.5,0.5)
            .setMountPoint(0.5,0.5,0.5)
            ;

    var oCubeNode = addDebugCube(centeredOriginNode);
    oCubeNode.setOrigin(0.5,0.5,0.5);

    var oDOMElement = new DOMElement(centeredOriginNode, {properties: {'font-size':'100px', 'background-color':'#F00'}}).setContent("hello cruel world!");

    setTimeout(function() {
        var oCamera = new Camera(scene).setDepth(800);
        oDOMElement.setContent("camera added to scene");
        setTimeout(function() {
            scene.setScale(0.5,0.5,0.5);
            oDOMElement.setContent("scene scaled (notice we are now missing the cube mesh)");
        }, 1000 * 3);
    }, 1000 * 3);


    function addDebugCube(parent) {

        var oCube = parent.addChild().setOpacity(0.3);

        // cube
        var oGeometry =
            new Geometry({
                type: 'LINES',
                buffers: [
                    { name: 'a_pos', data: [
                        -1,-1,-1, 1,-1,-1, 1,1,-1, -1,1,-1,
                        -1,-1,1, 1,-1,1, 1,1,1, -1,1,1
                    ], size: 3 },
                    { name: 'indices', data: [
                        0,1, 1,2, 2,3, 3,0, // front face
                        4,5, 5,6, 6,7, 7,4, // back face
                        0,4, 4,7, 7,3, 3,0, // left face
                        1,5, 5,6, 6,2, 2,1 // right face
                    ], size: 2 }
                ]});

        var oMesh =
            new Mesh(oCube)
                .setGeometry(oGeometry)
                .setBaseColor(new Color("#FFFFFF"))
                ;

        return oCube;
    };

Relevant code chunk

        setTimeout(function() {
            scene.setScale(0.5,0.5,0.5);
            oDOMElement.setContent("scene scaled (notice we are now missing the cube mesh)");
        }, 1000 * 3);

Observed Output

After one adds a wireframe cube mesh & a DOM element (correct output):
tick1

After then adding a camera (again correct output):
tick2

Finally, this is the output after scaling the scene. Notice that the wireframe cube has disappeared:
tick3

Expected Output

The red DOM element should be enclosed by a wireframe cube. Instead the cube has disappeared.

Workaround

Add a child node to the scene below the camera then Node#setScale() the child node instead.

May be related to #436 or some of it's associates.