-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
56 lines (48 loc) · 2.29 KB
/
index.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
<!doctype html>
<html>
<meta name="robots" content="noindex">
<!-- Live demo and live coding for http://fabien.benetou.fr/Events/JavascriptLabBrusselsMarch2016 -->
<head>
<title>A-frame in VR presentation component and example</title>
<script src="https://aframe.io/releases/0.3.2/aframe.js"></script>
<script src="https://rawgit.com/ngokevin/aframe-text-component/master/dist/aframe-text-component.min.js"></script>
<script src="https://rawgit.com/ngokevin/aframe-event-set-component/master/dist/aframe-event-set-component.min.js"></script>
<script src="https://raw.githubusercontent.com/Utopiah/aframe-slides-controls-component/master/aframe-slides-controls-component.js"></script>
</head>
<body>
<a-scene slides>
<a-assets>
<!-- cf also https://aframe.io/docs/core/asset-management-system.html -->
<a-mixin id="smalltitle" position="2.5 -2 0" material="color: black" scale="0.5 0.5 0.5"></a-mixin>
<a-mixin id="textcontent" position="-1 2 1" material="color: black" scale="0.2 0.2 0.2"></a-mixin>
<!-- cf https://aframe.io/docs/core/mixin.html -->
</a-assets>
<a-entity position="0 1.8 4" camera id="camera" look-controls>
<a-cursor color="white"></a-cursor>
<!-- example of event generated by the component
<a-animation attribute="position"
begin="slide10"
to="0 1.8 4"
dur="1000"
fill="forwards"></a-animation>
<a-animation attribute="position"
begin="slide11"
to="4 4 5"
dur="1000"
fill="forwards"></a-animation>
-->
</a-entity>
<a-entity position="0 -5 20" scale="1 1 1" rotation="0 180 0">
<!-- world theme -->
<a-sky color="#05c5de"></a-sky>
<a-plane color="#CCC" height="80" width="80" rotation="-90 0 0" position="0 1 0"></a-plane>
</a-entity>
<a-entity class="slide1" id="titletext" text="text: in VR slides by Fabien Benetou" position="-2.5 3 0" material="color: black">
<a-entity mixin="smalltitle" text="text: slide 1"></a-entity>
</a-entity>
<a-entity class="slide2" visible="false" position="-2.5 3 0">
<a-entity mixin="smalltitle" text="text: slide 2"></a-entity>
</a-entity>
</a-scene>
</body>
</html>