52 lines
1.4 KiB
HTML
52 lines
1.4 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<style type="text/css">
|
||
|
|
|
||
|
|
body{
|
||
|
|
background: #555;
|
||
|
|
height: 100%;
|
||
|
|
margin: 0;
|
||
|
|
overflow: hidden;
|
||
|
|
padding: 0;
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
img#btn_play:hover {
|
||
|
|
opacity: 1.0;
|
||
|
|
}
|
||
|
|
img#btn_play {
|
||
|
|
position: fixed;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
width:30%;
|
||
|
|
max-width:400px;
|
||
|
|
transform: translate(-50%,-50%);
|
||
|
|
cursor: pointer;
|
||
|
|
opacity: 0.6;
|
||
|
|
transition: 0.3s;
|
||
|
|
z-index: 999;
|
||
|
|
}
|
||
|
|
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<img id="btn_play" src="lib/assets/play.svg"/>
|
||
|
|
|
||
|
|
<a-scene>
|
||
|
|
<a-entity id="scene" animation-mixer_disabled gltf-model></a-entity>
|
||
|
|
|
||
|
|
<a-entity id="player" movement-controls touch-controls="axis:y" wasd-controls="fly:true" look-controls="magicWindowTrackingEnabled:true">
|
||
|
|
<a-entity camera="fov:90" position="0 1.6 0" id="camera"></a-entity>
|
||
|
|
<a-entity id="left-hand" hand-tracking-grab-controls="hand:left;modelColor:#cccccc" raycaster="objects:.ray" blink-controls="cameraRig:#player; teleportOrigin: #camera; collisionEntities: .floor"></a-entity>
|
||
|
|
<a-entity id="right-hand" hand-tracking-grab-controls="hand:right;modelColor:#cccccc" laser-controls="hand: right" raycaster="objects:.ray" blink-controls="cameraRig:#player; teleportOrigin: #camera; collisionEntities: .floor"></a-entity>
|
||
|
|
</a-entity>
|
||
|
|
|
||
|
|
</a-scene>
|
||
|
|
|
||
|
|
<script type="module" src="lib/xrforge/index.js"></script>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|