-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
121 lines (109 loc) · 4.92 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
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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!-- BEGIN: Top HTML -->
<!DOCTYPE html>
<!-- include aframe -->
<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
<!-- include ar.js -->
<script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar.js"></script>
<!-- to load .ply model -->
<script src="https://rawgit.com/donmccurdy/aframe-extras/v6.0.0/dist/aframe-extras.loaders.min.js"></script>
<!-- END: Top HTML -->
<!-- BEGIN: Unity Compiled Events -->
<script>
var markerFound = 0;
AFRAME.registerComponent('button', {
init: function () {
var elem = document.documentElement;
var marker = document.querySelector("#marker");
var fullbutton = document.querySelector("#fullscreen");
marker.addEventListener("markerFound", function (evt) {
markerFound = 1;
});
marker.addEventListener("markerLost", function (evt) {
markerFound = 0;
});
fullbutton.addEventListener("click", function (evt) {
if (fullscreen == 0) {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) {
/* Firefox */
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) {
/* Chrome, Safari and Opera */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) {
/* IE/Edge */
elem.msRequestFullscreen();
}
fullbutton.setAttribute("src", "../exit_fullscreen.png");
fullscreen = 1;
} else {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
fullbutton.setAttribute("src", "../fullscreen.png");
fullscreen = 0;
}
});
},
tick: function (totalTime, deltaTime) {
var dTime = deltaTime / 1000;
if (markerFound == 1) {
}
function bezierEvaluate(p0, p1, p2, p3, t) {
var u = (1 - t);
var uu = u * u;
var uuu = u * u * u;
var tt = t * t;
var ttt = t * t * t;
//B(t) = (1-t)^3*P0 3*(1-t)^2*t*P1 3*(1-t)*t^2*P2 t^3*P3 , 0 < t < 1
return (uuu * p0 + 3 * uu * t * p1 + 3 * u * tt * p2 + ttt * p3);
}
function bezierPath(p0, p1, p2, p3, t) {
return new THREE.Vector3(
bezierEvaluate(p0.x, p1.x, p2.x, p3.x, t),
bezierEvaluate(p0.y, p1.y, p2.y, p3.y, t),
bezierEvaluate(p0.z, p1.z, p2.z, p3.z, t)
);
}
}
});
</script>
<!-- END: Unity Compiled Events -->
<!-- BEGIN: Middle HTML -->
<body style='margin : 0px; overflow: hidden; font-family: Monospace;'>
<div style='position: absolute; bottom: 5px; left: 30px; width:100%; text-align: right; z-index: 1;'>
<input type="image" id="fullscreen" src="../fullscreen.png" style='position: absolute; bottom: 0px; right: 35px;'>
</input>
</div>
<!-- <a-scene embedded arjs='debugUIEnabled: false; sourceType: video; sourceUrl:../../data/videos/headtracking.mp4;'> -->
<a-scene embedded arjs='debugUIEnabled: false; sourceType: webcam' vr-mode-ui='enabled: false'>
<a-entity id="mouseCursor" cursor="rayOrigin: mouse" raycaster="objects: .intersectable; useWorldCoordinates: true;"></a-entity>
<!-- END: Middle HTML -->
<!-- BEGIN: Unity Compiled Assets -->
<a-assets>
</a-assets>
<!-- END: Unity Compiled Assets -->
<!-- BEGIN: Add Image Target (marker) -->
<a-marker id="marker" type="pattern" preset="custom" src="pattern-WhatsApp Image 2021-09-04 at 12.15.03 PM.patt" url="pattern-WhatsApp Image 2021-09-04 at 12.15.03 PM.patt" emitevents="true" button>
<!-- END: Add Image Target (marker) -->
<!-- BEGIN: Unity Compiled Objects -->
<a-cylinder radius="0.17849" height="0.71396" class="intersectable" position="0 0.178 -0.404" rotation="0 0 0" color="#C82828"
></a-cylinder>
<a-cylinder radius="0.17849" height="0.71396" class="intersectable" position="0 0.178 0.261" rotation="0 0 0" color="#4DCAC3"
></a-cylinder>
<a-cylinder radius="0.181865" height="0.72746" class="intersectable" position="-0.353 0 0" rotation="0 0 0" color="#FFFFFF"
></a-cylinder>
<!-- END: Unity Compiled Objects -->
<!-- BEGIN: Bottom HTML -->
</a-marker>
<a-entity camera></a-entity>
</a-scene>
</body>
</html><!-- END: Bottom HTML -->