<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Shopping</title>
<meta name="description" content="Shopping - A-Frame">
<script src="../../../dist/aframe-master.js"></script>
</head>
<body>
<a-scene background="color: #ECECEC" renderer="colorManagement: true;">
<a-assets>
<a-asset-item id="why-male-models" src="man.glb"></a-asset-item>
<img id="fall" src="fall.png">
<img id="goggles" src="goggles.png">
<img id="price" src="price.png">
<img id="shadow2" src="../../assets/img/radial-shadow-2.png">
<img id="shoes" src="shoes.png">
</a-assets>
<a-entity id="model" position="0 0 -3" animation="property: rotation; from: 0 -30 0; to: 0 330 0; dur: 15000; easing: linear; loop: true">
<a-gltf-model position="-.35 0 .55" rotation="0 -20 0" scale="1.5 1.5 1.5" src="#why-male-models"></a-gltf-model>
<a-image src="#shadow2" rotation="-90 0 0" scale="0.5 0.5 0.5"></a-image>
</a-entity>
<a-image id="price" src="#price" width="7" height="3.5" scale="0.2 0.2 0.2"
animation="property: position; from: 0 2.8 -6; to: 2.25 2.8 -6; delay: 1000; dur: 1000"></a-image>
<a-cylinder id="goggles" color="#101010" height="0.02" radius="0.8"
animation__rotation="property: rotation; from: -270 0 0; to: -90 0 0; dur: 750; delay: 1000"
animation__position="property: position; from: 8 0 -9; to: 8 3.5 -9; dur: 750; delay: 1000">
<a-image src="#goggles" width="2" height="1" rotation="90 0 0" position="0 -.05 0" scale=".4 .4 .4"></a-image>
</a-cylinder>
<a-curvedimage id="stereoscopic-fall-collection-text" src="#fall" radius="5.7"
theta-length="18" height=".45" position="0 0.9 0" scale=".4 .4 .4"
animation="property: rotation; from: 0 180 0; to: 0 210 0; delay: 750; dur: 1000"></a-curvedimage>
<a-curvedimage id="shoes" src="#shoes" radius="5.7" theta-length="18" height=".8" position="0 0.9 0" scale=".4 .4 .4"
animation="property: rotation; from: 0 180 0; to: 0 130 0; delay: 750; dur: 1000"></a-curvedimage>
<a-cylinder position="0 0.5 0" radius="4" height="1.6" side="back" open-ended="true" color="#FFF"></a-cylinder>
<a-light type="directional" color="#fff" intensity="0.2" position="-1 2 1"></a-light>
<a-light type="ambient" color="#fff"></a-light>
</a-scene>
</body>
</html>
