PWS/src/PersonalWebSpace_frontend/assets/DownloadFileExample.html at 3aa7e2765a7101be9efb537b8231802f08d57a7f · Bebb-Protocol-and-Apps/PWS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<html>
  <head>
    <script src="https://aframe.io/releases/1.3.0/aframe.min.js"></script>
    <script src="//cdn.rawgit.com/donmccurdy/aframe-extras/v3.8.3/dist/aframe-extras.min.js"></script>
    <script src="https://mannymeadows.github.io/Noosa/aframe-sun-sky.min.js"></script>
  </head>
  <body>


    <a-scene cursor="rayOrigin: mouse" gltf-model="dracoDecoderPath: https://www.gstatic.com/draco/v1/decoders/;" inspector="" keyboard-shortcuts="" screenshot="width: 1920; height: 1080;" vr-mode-ui="" device-orientation-permission-ui="" raycaster="direction: 0.9544506796854287 -0.10164039183312146 -0.2805229594810959; origin: -4.846717797159805 5.074580504821491 2.3289351396596443; useWorldCoordinates: true">
      <a-assets>
        <img crossorigin="anonymous" id="groundTexture" src="https://cdn.aframe.io/a-painter/images/floor.jpg">
        <img crossorigin="anonymous" id="skyTexture" src="https://cdn.aframe.io/a-painter/images/sky.jpg">
        <!-- <a-asset-item id="room-glb" src="roomModel.glb"></a-asset-item> -->
        <a-asset-item id="ground-glb" src="ground.glb"></a-asset-item>
      </a-assets>

      <a-light type="directional" intensity="0.9" position="-1 -2 2" light=""></a-light>
      <a-light type="directional" intensity="1.0" position="2 1 -1" light=""></a-light>

      <a-sky color="#ECECEC" material="" geometry=""></a-sky>

      <a-entity gltf-model="ground.glb" position="0 -0.1 -5" rotation="0 -90 0" id="Ground Panel 1"  animation-mixer></a-entity>
      <a-entity gltf-model="ground.glb" position="5 -0.1 -5" rotation="0 -90 0" id="Ground Panel 3"  animation-mixer></a-entity>
      <a-entity gltf-model="ground.glb" position="4.99758 -0.1 -0.00467" rotation="0 -90 0" id="Ground Panel 4"  animation-mixer></a-entity>
      <a-entity gltf-model="ground.glb" id="Ground Panel 2" position="0.02808 -0.1 -0.01568" rotation="0 -90 0"  animation-mixer></a-entity>
      <a-entity id="item2" position="0 -5 -5" rotation="0 45 0"></a-entity>
      <a-entity id="item3" position="0 -5 -5" rotation="0 45 0"></a-entity>


<div class="a-loader-title" style="display: none;"></div>
<div class="a-loader-title" style="display: none;"></div><div class="a-loader-title" style="display: none;"></div><div class="a-loader-title" style="display: none;"></div><div class="a-loader-title" style="display: none;"></div><div class="a-loader-title" style="display: none;"></div></a-scene>

<script>
AFRAME.registerComponent('binary-glb-loader', {
  schema: {
    src: {type: 'asset'}
  },

  init: function () {
    const objectURL = this.data.src;
    const loader = new THREE.GLTFLoader();

    loader.load(
      objectURL,
      (gltf) => {
        console.log("Loading binbary object");
        this.el.setObject3D('mesh', gltf.scene);
      },
      undefined,
      (error) => {
        console.error('An error occurred while loading the GLTF model', error);
      }
    );
  },

  remove: function () {
    this.el.removeObject3D('mesh');
  }
});
</script>
  </body>
</html>