-
Notifications
You must be signed in to change notification settings - Fork 0
/
gaze.html
92 lines (73 loc) · 4.21 KB
/
gaze.html
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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>MZiQ VR</title>
<script src="laser-bundle.js"></script>
<!--<script src="/lib/aframe-extras.min.js"></script>-->
<!--<script src="https://raw.githubusercontent.com/aframevr/aframe/master/dist/aframe-master.js"></script>-->
</head>
<body>
<a-scene>
<a-assets>
<a-asset-item id="engine" src="/assets/models/engine.dae"></a-asset-item>
<audio id="blip1" src="/assets/sound/plim.wav"></audio>
<audio id="blip2" src="/assets/sound/plup.wav"></audio>
</a-assets>
<a-camera id="human-camera">
<!--<a-cursor></a-cursor>-->
<!--cursor="fuse: true; fuseTimeout: 500"-->
<a-entity cursor position="0 0 -1" geometry="primitive: circle; radius: 0.01;"
material="color: black; shader: flat">
<a-animation begin="click" easing="ease-in" attribute="scale" fill="backwards" from="0.5 0.5 0.5"
to="1 1 1"></a-animation>
<a-animation begin="cursor-fusing" easing="ease-in" attribute="scale" fill="forwards"
from="1 1 1" to="0.5 0.5 0.5"></a-animation>
</a-entity>
</a-camera>
<a-entity position="0 1.5 0" rotation="0 0 0">
<a-entity id="cardInfo" geometry="width:0.44;height:0.35;primitive:plane" material="shader:flat;color:#FFF"
position="0.9 0.002 -0.8">
<a-text id="cardTitle" color="#4B5154" position="0 0.13 0" align="center" width="1"
baseline="top" anchor="align" wrapCount="70" value="Title" color="#4B5154"></a-text>
<a-text id="cardChangeLabel" color="#4B5154" position="-0.12 0.049 0" align="center"
width="0.5" baseline="top" anchor="align" wrapCount="70" value="Change" color="#4B5154"></a-text>
<a-text id="cardChange" color="#4B5154" position="-0.12 0.001 0" align="center" width="1"
baseline="top" anchor="align" wrapCount="70" value="Change" color="#4B5154"></a-text>
<a-text id="cardMarketCapLabel" color="#4B5154" position="0.07 0.049 0" align="center"
width="0.5" baseline="top" anchor="align" wrapCount="70" value="MarketCap"
color="#4B5154"></a-text>
<a-text id="cardMarketCap" color="#4B5154" position="0.07 0.001 0" align="center"
width="1" baseline="top" anchor="align" wrapCount="70" value="MarketCap"
color="#4B5154"></a-text>
<a-text id="cardPriceLabel" color="#4B5154" position="0.07 -0.066 0" align="center"
width="0.5" baseline="top" anchor="align" wrapCount="70" value="Price" color="#4B5154"></a-text>
<a-text id="cardPrice" color="#4B5154" position="0.07 -0.121 0" align="center" width="1"
baseline="top" anchor="align" wrapCount="70" value="Price" color="#4B5154"></a-text>
<a-text id="cardVolumeLabel" color="#4B5154" position="-0.11 -0.066 0" align="center"
width="0.5" baseline="top" anchor="align" wrapCount="70" value="Volume" color="#4B5154"></a-text>
<a-text id="cardVolume" color="#4B5154" position="-0.11 -0.121 0" align="center"
width="1" baseline="top" anchor="align" wrapCount="70" value="Volume" color="#4B5154"></a-text>
<a-plane material="shader:flat" width="0.3" height="0.005" position="0 0.065 0.01"
color="#697982" opacity="0.3" geometry="height:0.003;primitive:plane;width:0.3"></a-plane>
</a-entity>
</a-entity>
<a-entity id="treemapContainer" class="intersectable" treemap-generator drag-rotate="speed: 8;"
position="0 0 -3" rotation="20 0 0"></a-entity>
<a-entity position="0 -0.5 -3">
<a-collada-model src="#engine" rotation="90 0 0" scale="18 18 18"></a-collada-model>
</a-entity>
<!-- Lights. -->
<a-light type="point" color="#94c6ff" distance="15" position="0 0 -12">
<a-animation attribute="intensity" from="0" to="2" delay="750" dur="500" fill="both"></a-animation>
</a-light>
<a-light type="point" color="#94c6ff" distance="17" position="0 0 -6">
<a-animation attribute="intensity" from="0" to="1" delay="500" dur="500" fill="both"></a-animation>
</a-light>
<a-light type="ambient" color="#4f6487"></a-light>
<!-- Sounds. -->
<a-entity sound="autoplay: true; src: #blip1;"></a-entity>
<a-entity sound="autoplay: true; src: #blip2;"></a-entity>
</a-scene>
</body>
</html>