bitgridio / generator-janus-dist

:straight_ruler: Yeoman generator to distribute assets in Janus VR
1 stars 0 forks source link

Calculate position and direction #1

Closed sirkitree closed 9 years ago

sirkitree commented 9 years ago

Currently we're just writing markup based on a template after gathering which directory the user wants to traverse. Still need to calculate pos, xdir, ydir, zdir

sirkitree commented 9 years ago

In order to calculate this, especially when considering different sized images, we'll need a pixel to grid ratio. The first question is how many pixels are there from coordinate 0,0 to 0,1?

Should be able to find out with a simple experiment. Assuming a scale of 1, create a 1pixel image and place at 0,0, a 10x1 pixel image at 0,1 laying in the x direction and so forth until we start overlapping.

Hopefully this will also answer the question of where an image is actually placed on the grid. If I place a 5x1 pixel image at 0,0, is the first pixel laid on 0,0, the last pixel, or the third pixel?

sirkitree commented 9 years ago

After doing some experimentation along these lines I've learned a lot. janus vr 2014-12-16 21 02 51

Key takeaways:

  1. Pixels do not map. Janus tries to fill the area squared according to the aspect ratio of the image. So for a portrait image it will first fill the width and then bleed over with the height, keeping the aspect ratio of the image. For landscape it will fill the height and bleed over the width.
  2. Images map from the center of the image.
  3. Janus uses the traditional Cartesian grid system, although when you com out through a portal, you're facing +z which confused me a little so I turned the portal direction around.

This makes positioning images quite a lot easier actually, because we can simply increment the coordinates and Janus will take care of putting images in place with minimal overlapping. The default direction is also already optimal so no need to worry about that for the initial "wall of images" configuration.

Code for this experiment:

<!DOCTYPE html>
<html>
<head>
    <title>pixels</title>
</head>
<body>
    <FireBoxRoom>
        <Assets>
            <AssetImage id="1x1" src="1x1.png" />
            <AssetImage id="1x2" src="1x2.png" />
            <AssetImage id="10x10" src="10x10.png" />
            <AssetImage id="rocket" src="499x495.png" />
            <AssetImage id="sally" src="520x746.jpg" />
        </Assets>
        <Room use_local_asset="room_plane" pos="0 0 10" xdir="-1.00 0.00 -0.00" ydir="0.00 1.00 0.00" zdir="0.00 0.00 -1.00">

            <Image id="1x1" pos="-8 8 0" />
            <Image id="1x1" pos="-6 6 0" />
            <Image id="1x1" pos="-4 4 0" />
            <Image id="1x1" pos="-2 2 0" />

            <Image id="1x1" pos="0 0 0" />          

            <Text pos="1 1 0" col="1 .5 .5">1,1,0</Text>
            <Text pos="2 2 0" col="1 .5 .5">2,2,0</Text>
            <Text pos="3 3 0" col="1 .5 .5">3,3,0</Text>
            <Text pos="4 4 0" col="1 .5 .5">4,4,0</Text>
            <Text pos="5 5 0" col="1 .5 .5">5,5,0</Text>
            <Text pos="6 6 0" col="1 .5 .5">6,6,0</Text>
            <Text pos="7 7 0" col="1 .5 .5">7,7,0</Text>
            <Text pos="8 8 0" col="1 .5 .5">8,8,0</Text>

            <Image id="1x2" pos="4 8 0" />
            <Image id="rocket" pos="1 8 0" />
            <Image id="sally" pos="-1 8 0" />

        </Room>
    </FireBoxRoom>
</body>
</html>
sirkitree commented 9 years ago

Calculation for basic wall of images complete in https://github.com/sirkitree/generator-janus-dist/commit/36f88c082be62af50bc0ad29829c0d2d83cb03e6