project/apps/transit_service/web/index.html · umn-drone

<html>
	<head>
		<title>3081 Project</title>
		<style>
			body { margin: 0; }
			canvas { display: block; }
			#info {
				position: absolute;
				top: 10px;
				width: 100%;
				text-align: center;
				color: white;
				z-index: 101;
				display:block;
			}

			#menu {
				background-color: black;
				opacity: 0.8;
				position: absolute;
				top: 10px;
				right: 10px;
				text-align: left;
				color: white;
				z-index: 100;
				display:block;
				padding: 10px;
			}


			#scene-container {
			  position: absolute;
			  width: 100%;
			  height: 100%;
			}
			#notification-bar {
				position: absolute;
				z-index: 2;
				opacity: 0.5;
				left: 0;
				height: 100%;
				background-color: black;
				width: 300px;
				color: white;
				font-size: 1em;
				white-space: pre-line;
				padding-left: 15px;
				padding-top: 15px;
			}

		</style>

		<script src="js/jquery-3.5.1.min.js"></script>
		<script src="js/three.js"></script>
		<script src="js/OrbitControls.js"></script>
		<script src="js/GLTFLoader.js"></script>
		<script src="js/OBJLoader.js"></script>
		<script src="js/WSApi.js"></script>
	</head>
	<body>
		<div id="notification-bar"></div>
		<!--div id="info"><select onchange='loadScene($(this).val(), false)'><option value="scenes/umn.json">University of Minnesota</option><option value="scenes/glacier.json">Glacier National Park</option></select></div-->
		<div id="menu">
						<!--input type="button" value="Kill Simulation" onclick='kill()'-->

						<div>Change View:<br>	<select id="entitySelect" onchange='changeView()'>
					<option value="-1">Select entity...</option>
							</select></div>
					<div><br>Simulation Speed:<br>	<input type="range" min="1" max="100" value="10" class="slider" id="simSpeed">
						</div>
						<div><br><input type="checkbox" onclick='togglePaths()' checked> Show Current Routes
						</div>
						<div><br><input type="checkbox" onclick='toggleRoutes()'> Show All Routes
						</div>

			<!--div><input type="checkbox" onclick='kill()' checked>Show Map</div>
			<div><input type="checkbox" onclick='kill()'>Show Routes</div-->
		</div>
		<div id="scene-container"></div>
    <!-- Include the "main" graphics script and run it. -->
		<script src="js/main.js"></script>
	</body>
</html>