Gallery Project is our vision for Art galleries in virtual space.
Here we utilize a set of features that allow users to roam around the gallery and learn more about the art in front of them.
Gallery spaces can be based on existing real world spaces or be completely imaginary. All that needs to be set are locations and directions in which these art pieces are facing the user and how they are intended to be seen.

---

Code sample

--- Header ---

<link rel="stylesheet" href="/vr/vr_css/styles.css">
<script type="module" src="/vr/vr_build/dopevr-core.esm.js"></script>
<script nomodule src="/vr/vr_build/dopevr-core.js"></script>

--- Body ---

<scene-dom id="main-vr-dom"></scene-dom>
<scene-clock clock-name="rand1" app-fps="100">
  <scene-vr dom-id="renderbox">

    <three-core-group>
      <three-camera-perspective></three-camera-perspective>
      <three-camera-orbit></three-camera-orbit>
      <scene-vr-controller controller-id="1" controller-name="right" armed="false"></scene-vr-controller>
      <scene-vr-controller controller-id="0" controller-name="left" armed="false"></scene-vr-controller>
      <three-raycaster left-index="0" right-index="1"></three-raycaster>
    </three-core-group>

    <three-canvas-group>
      <three-canvas-altmenu dom-id="canvasbox" width="0.4" height="0.4" exit="/vr/vr_assets/icons/navigation/open-door.png" default hires></three-canvas-altmenu>
    </three-canvas-group>

    <three-env-group>
      <three-gltf-marker path="/vr/vr_assets/project/gallery/" name="Locator_Holed.glb" dynamic></three-gltf-marker>
      <three-gltf-floor path="/vr/vr_assets/project/gallery/" name="Gallery16_Floor_Collision.glb" link="main" thumbnail="/vr/vr_assets/icons/navigation/home.png"></three-gltf-floor>
    </three-env-group>

    <three-light-group>
      <three-light-hemi sky-color="#dddddd" ground-color="#444444" intensity="0.6"></three-light-hemi>
    </three-light-group>

    <three-mesh-group>
      <three-gltf path="/vr/vr_assets/project/gallery/" name="Gallery16.glb"></three-gltf>
      <three-gltf path="/vr/vr_assets/project/gallery/" name="Gallery16_Plinth_Left.glb"></three-gltf>
      <three-gltf path="/vr/vr_assets/project/gallery/" name="Gallery16_Plinth_Right.glb"></three-gltf>
    </three-mesh-group>

    ...

    <!-- Perimeter wall - Right -->
    <three-mesh-group-gallery path="/vr/vr_assets/project/gallery/" name="Gallery1E_pictures_WR_v2.glb">
      <three-gltf-ui-group>
        <three-mesh-image link="picture_WR_21" path="/vr/vr_assets/project/gallery/images/" name="wall_right_1_sm.jpg" ratio="4:5"></three-mesh-image>
        <three-canvas-tag dom-id="canvasbox" width="0.8" height="0.2" tag='{"headline":"Photoshoot - Seth","author":"Ondrej Blazek"}' hires></three-canvas-tag>
      </three-gltf-ui-group>

      ...

    </three-mesh-group-gallery>

    ...

  </scene-vr>
</scene-clock>