<!DOCTYPE html>
<html>
<head>
<title>Driving Simulator</title>
<link rel="stylesheet" href="styles.css">
<script type="module" src="map_script.js"></script>
<script type="module" src="movement_script.js"></script>
<script src="https://aframe.io/releases/0.8.2/aframe.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/donmccurdy/aframe-extras@v6.1.1/dist/aframe-extras.min.js"></script>
<script src="https://recast-api.donmccurdy.com/aframe-inspector-plugin-recast.js"></script>
</head>
<body>
<a-scene id="scene" shadow="autoUpdate: true; type: pcfsoft">
<a-assets>
<a-asset-item id="house" src="Assets/NewHouse.gltf"></a-asset-item>
<a-asset-item id="car" src="Assets/ColoredCarDSshad.gltf"></a-asset-item>
<a-asset-item id="border" src="Assets/HouseRedo.gltf"></a-asset-item>
<a-asset-item id="house_2" src="Assets/House_ver2.gltf"></a-asset-item>
<a-asset-item id="sky" src="data:image/jpeg;base64,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"></a-asset-item>
<img id="road" src="Assets/road.jpg">
<img id="roadLines" src="Assets/roadLines.jpg">
<img id="grass" src="Assets/grass.jpg">
<img id="redbrick-image" src="Assets/red_brick.jpg">
<img id="whitewood-image" src="Assets/white_wood.jpg">
<img id="roof-image" src="Assets/roof.jpg">
</a-assets>
<!-- Holds all the Building entities-->
<a-entity id="map" shadow="cast:true; receive:true"></a-entity>
<!-- Sky -->
<a-sky src="#sky" rotation="0 0 -180"></a-sky>
<!-- Ground -->
<a-plane material="color: #999999" rotation="-90 0 0" scale="75 75 0.5" shadow="receive:true"></a-plane>
<!-- Light entities-->
<!--Light Ambient-->
<a-entity light="type: ambient; color: #BBB; intensity: 0.7"></a-entity>
<!--Light Directional: ex. sun -->
<a-entity light="type: directional; color:#FFFFFF; intensity:1.5; castShadow: true; shadowBias:-0.001; shadowCameraBottom: -50; shadowCameraLeft: -50; shadowCameraRight: 50; shadowCameraTop: 50" position="28.5 38.1 16"></a-entity>
<!-- Camera Rig / Car / Controls are held here -->
<a-entity id="car-object" gltf-model="#car" position="0 0.08 0" scale="0.5 0.5 0.5" rotation="0 0 0" extended-wasd-controls="turnEnabled: true; lookEnabled: true; maxLookAngle: 60;">
<!-- Holds all the Text - Gears -->
<a-entity id="text">
<a-text value="1" position="-2.4 1.5 1" rotation="-52.64 90 0"></a-text>
</a-entity>
<!-- Camera -->
<a-entity camera id="camera" position="-1 2 0.6" look-controls active="true">
<a-cursor></a-cursor>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>