-
Notifications
You must be signed in to change notification settings - Fork 4
/
example.html
53 lines (48 loc) · 2.13 KB
/
example.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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>button-controls test - A-Frame</title>
<meta name="description" content="should update when trigger pressed (or screen tapped or mouse clicked)">
<script src="https://aframe.io/releases/1.6.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-environment-component@^1.3.7/dist/aframe-environment-component.min.js"></script>
<script src="aframe-button-controls.js"></script>
<script>
AFRAME.registerComponent('button-controls-test', {
init: function () {
console.log("button-controls-test init");
const signEl = document.getElementById('sign');
signEl.setAttribute('value', "button-controls-test init");
this.handlers = {
buttondown: function (evt) {
console.log(evt);
signEl.setAttribute('value', evt.detail.controllerId + " " + evt.detail.index + " " + evt.type);
},
buttonup: function (evt) {
console.log(evt);
signEl.setAttribute('value', evt.detail.controllerId + " " + evt.detail.index + " " + evt.type);
}
}
},
play: function () {
const controlsEl = document.querySelector('[button-controls]');
controlsEl.addEventListener('buttondown', this.handlers.buttondown);
controlsEl.addEventListener('buttonup', this.handlers.buttonup);
},
pause: function () {
const controlsEl = document.querySelector('[button-controls]');
controlsEl.removeEventListener('buttondown', this.handlers.buttondown);
controlsEl.removeEventListener('buttonup', this.handlers.buttonup);
}
});
</script>
</head>
<body>
<a-scene button-controls-test>
<a-entity environment></a-entity>
<a-text id="sign" width=5 position="-2 1.5 -2" anchor="left" value="Message"
material="color: darkgreen"></a-text>
<a-entity button-controls="debug: true;"></a-entity>
</a-scene>
</body>
</html>