50 lines
1.3 KiB
HTML
50 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script>
|
|
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.6.0/aframe/build/aframe-ar.js"></script>
|
|
<script src="smooth_script.js"></script>
|
|
<script src="rotation_limit.js"></script>
|
|
</head>
|
|
<body id="gamed" style="margin: 0px; overflow: hidden">
|
|
<div
|
|
class="overlay"
|
|
style="
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(
|
|
138,
|
|
137,
|
|
137,
|
|
0.668
|
|
); /* Change the color and opacity here */
|
|
"
|
|
></div>
|
|
<a-scene embedded arjs="patternRatio:0.8;">
|
|
<a-marker
|
|
lerpsmooth
|
|
id="marker"
|
|
type="pattern"
|
|
url="pattern-WebAR_QR.patt"
|
|
>
|
|
<a-box
|
|
id="second-box-as-comparison"
|
|
position="0 0 0"
|
|
material="opacity: 0"
|
|
></a-box>
|
|
</a-marker>
|
|
<a-entity id="smoothed-box" position="0 0 0" scale="5 5 5">
|
|
<a-entity
|
|
rotation="0 0 0"
|
|
gltf-model="cup_of_cappuccino/scene.gltf"
|
|
rotation-limiter
|
|
></a-entity>
|
|
</a-entity>
|
|
<a-entity camera></a-entity>
|
|
</a-scene>
|
|
</body>
|
|
</html>
|