<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>酒田版geoguessr</title>
<link rel="stylesheet" type="text/css" href="geoguessr.css">
<script src="https://aframe.io/releases/1.4.0/aframe.min.js"></script>
<script src="geoguessr.js" charset="utf-8"></script>
<script src="https://unpkg.com/aframe-tooltip-component/dist/aframe-tooltip-component.min.js"></script>
</head>
<body id="background">
<a-scene vr-mode-ui="enabled: true">
<a-entity id = "camera">
<a-camera position="0 0 0">
<a-entity cursor="fuse: true; fuseTimeput: 1000"
position="0 0 -1"
geometry="primitive: ring;"
scale="0.01 0.01 0.01"
material="color: blue; shader: flat"
>
<a-animation begin = "cursor-fusing"
easing="ease-in"
attribute = "scale"
fill = "none"
from = "0.03 0.03 0.03"
to = "0.001 0.001 0.001"
>
</a-animation>
</a-entity>
</a-camera>
</a-entity>
<a-sky id="sky" rotation="0 0 0">
<!-- idだけ設定した a-sky を置いて、後で動的にsrc属性を代入する -->
</a-sky>
<!-- これを足すとクリックイベントが取れる -->
<a-entity id="basket">
<!-- ここに自動的に球(a-sphere)が入る.
A-Frameとして動的に出したいものの親要素は a-entity でなければならない -->
</a-entity>
<a-sphere color="#cc3" radius="0.5" opacity="1" position="0 -4 0" id="connect" ></a-sphere>
<a-entity tooltip="foo: bar"></a-entity>
</a-scene>
</body>
</html>
