Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Node#setMountPoint() and Node#setAlign() decrement Z-components by 0.5 #450

Open
CompSciFutures opened this issue Jul 25, 2015 · 2 comments
Assignees

Comments

@CompSciFutures
Copy link

Description

Node#setMountPoint() and Node#setAlign() decrements their respective Z-components by 0.5 every time they are called.

Isolation

  • Present in 0.6.2
  • Present in a5d7fd5

Example

Relevant Code Section

    staticNode.setAlign(0.5, 0.5, 10);
    // next line outputs: BEFORE: getMountPoint()= {"0":0,"1":0,"2":0} .getAlign()= {"0":0.5,"1":0.5,"2":9.5}
    console.log("BEFORE:", "getMountPoint()=", JSON.stringify(staticNode.getMountPoint()), ".getAlign()=", JSON.stringify(staticNode.getAlign()))
    var aMountPoint = staticNode.getMountPoint();
    var aAlign = staticNode.getAlign();
    staticNode.setAlign(aAlign[0], aAlign[1]); // note no 3rd (z) component. Problem still occurs
    staticNode.setMountPoint(aMountPoint[0], aMountPoint[1], aMountPoint[2]);
    // next line outputs: AFTER: getMountPoint()= {"0":0,"1":0,"2":-0.5} .getAlign()= {"0":0.5,"1":0.5,"2":9.5}
    console.log("AFTER:", "getMountPoint()=", JSON.stringify(staticNode.getMountPoint()), ".getAlign()=", JSON.stringify(staticNode.getAlign()))

Working Example Code

<!-- @see https://github.com/Famous/engine/issues/439 -->
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="icon" href="favicon.ico?v=1" type="image/x-icon">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
    <meta http-equiv="Pragma" content="no-cache" />
    <meta http-equiv="Expires" content="0" />
    <xxxscript src="http://code.famo.us/famous/0.6.2/famous.min.js"></xxxscript>
    <script src="../FamousBuilds/famous-20150722-a5d7fd552505c0f2d40c4a86aa0a61950736ff16.js"></script>

    <style>
        html, body {
            width: 100%;
            height: 100%;
            margin: 0px;
            padding: 0px;

        }
        body {
            position: absolute;
            -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
            -webkit-font-smoothing: antialiased;
            -webkit-tap-highlight-color: transparent;
            background-color: black;
            -webkit-perspective: 0;
            perspective: none;
            overflow: hidden;
        }
    </style>
</head>

<body>
<script>
    'use strict';

    console.log(famous);
    //var famous = require('famous');
    var DOMElement = famous.domRenderables.DOMElement;
    var FamousEngine = famous.core.FamousEngine;
    var Position = famous.components.Position;

    var scene = FamousEngine.createScene();
    var staticNode = scene.addChild();
    staticNode.setSizeMode('absolute', 'absolute').setAbsoluteSize(50, 50)

    console.clear();

    staticNode.setAlign(0.5, 0.5, 10);
    console.log("BEFORE:", "getMountPoint()=", JSON.stringify(staticNode.getMountPoint()), ".getAlign()=", JSON.stringify(staticNode.getAlign()))
    var aMountPoint = staticNode.getMountPoint();
    var aAlign = staticNode.getAlign();
    staticNode.setAlign(aAlign[0], aAlign[1]); // note no 3rd (z) component. Problem still occurs
    staticNode.setMountPoint(aMountPoint[0], aMountPoint[1], aMountPoint[2]);
    console.log("AFTER:", "getMountPoint()=", JSON.stringify(staticNode.getMountPoint()), ".getAlign()=", JSON.stringify(staticNode.getAlign()))
    staticNode.setAlign(aAlign[0], aAlign[1], aAlign[2]);
    staticNode.setMountPoint(aMountPoint[0], aMountPoint[1], aMountPoint[2]);
    console.log("AFTER:", "getMountPoint()=", JSON.stringify(staticNode.getMountPoint()), ".getAlign()=", JSON.stringify(staticNode.getAlign()))
    staticNode.setAlign(aAlign[0], aAlign[1], aAlign[2]);
    staticNode.setMountPoint(aMountPoint[0], aMountPoint[1], aMountPoint[2]);
    console.log("AFTER:", "getMountPoint()=", JSON.stringify(staticNode.getMountPoint()), ".getAlign()=", JSON.stringify(staticNode.getAlign()))


    var blueDIV = new DOMElement(staticNode, {
        properties:{
            'background-color':'#49afeb'
        }
    });

    FamousEngine.init();
</script>
</body>
</html>

Ouptut

Actual Console Ouptut

BEFORE: getMountPoint()= {"0":0,"1":0,"2":0} .getAlign()= {"0":0.5,"1":0.5,"2":9.5}
AFTER: getMountPoint()= {"0":0,"1":0,"2":-0.5} .getAlign()= {"0":0.5,"1":0.5,"2":9.5}
AFTER: getMountPoint()= {"0":0,"1":0,"2":-1} .getAlign()= {"0":0.5,"1":0.5,"2":9}
AFTER: getMountPoint()= {"0":0,"1":0,"2":-1.5} .getAlign()= {"0":0.5,"1":0.5,"2":8.5}

(note component "2" decrements by 0.5 each time)

Expected Console Output

BEFORE: getMountPoint()= {"0":0,"1":0,"2":0} .getAlign()= {"0":0.5,"1":0.5,"2":10}
AFTER: getMountPoint()= {"0":0,"1":0,"2":0} .getAlign()= {"0":0.5,"1":0.5,"2":10}
AFTER: getMountPoint()= {"0":0,"1":0,"2":0} .getAlign()= {"0":0.5,"1":0.5,"2":10}
AFTER: getMountPoint()= {"0":0,"1":0,"2":0} .getAlign()= {"0":0.5,"1":0.5,"2":10}
@alexanderGugel alexanderGugel self-assigned this Jul 25, 2015
@alexanderGugel
Copy link
Member

Will look into this. This seems rather suspicious to me, since

  1. setAlign needs to be called with values [0, 1], 10 doesn't make sense
  2. Getters don't have side effects (at least they shouldn't)
  3. The references commit can't be the cause, since it's running in a different thread. You can't set the transforms/ offsets from the UI thread. If this is an issue, it's because of something else (maybe a previous change).

That being said, I'm going to look into this, but would ask you to double check if there is something else in your code that mutates the states directly, e.g. the returned offset arrays shouldn't be mutated directly.

@CompSciFutures
Copy link
Author

Hi alex, I checked it very closely hence the minmal working example. I'm pretty sure it's real.

NB, I built a wrapper around it to fix that problem but now it appears that the z axis is in the range [-0.5, +0.5] rather than [0, 1]. I have not investigated that too deeply but just started working with that coordinate system instead.

Why I mention it is that this bug might be caused by an attempt to band-aid over a bigger z-axis problem?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants