Spaces:

muhammadzain
/

portal2

Runtime error

App Files Files Community

portal2 / templates /index.html

muhammadzain

try1

9b35c3f over 1 year ago

raw

history blame

5.05 kB

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Title</title>
	<link rel="stylesheet", type="text/css", href="{{url_for('static',filename = 'style.css')}}">
	</head>
	<body>
	<center><h1>SURVEYING AND MAPPING PORTAL</h1></center>
	<div class="flex-container">
	<div class="column1">
	<div id="actual map"><b id="head1">                            SATELLITE IMAGE        </b></div>
	<div id="floor plan"><b id="head2">                                                  2D STRUCTURAL VIEW           </b></div>
	<div id="googleMap"><img src="" id="map2"></div>
	<div id="maps"> <img src="" id="map"></div>
	<div id="leftdiv"><b id="left">                    LEFT CAMERA VIEW</b></div>
	<div id="frontdiv"><b id="front">                      FRONT CAMERA VIEW</b></div>
	<div id="rightdiv"><b id="right">                RIGHT CAMERA VIEW</b></div>
	<div id="camview"><img src="" id="cam0">
	<img src="" id = "cam1">
	<img src="static/right/1.jpeg" id="cam2"></div>
	<div id="altitudeL"><b id="left">                      3D POINT CLOUD</b></div>
	<div id="altitudeF"><b id="front">                                   BIM</b></div>
	<div id="altitudeR"><b id="right">                                       2D FLOOR PLAN</b></div>
	<div id="altitude"><img src="" id="alt0">
	<img src="static/altitudeB/BIM.jpg" id = "alt1">
	<img src="static/altitudeC/floor plan.jpg" id="alt2"></div>

	</div>
	<div class="column2">
	<h3>CONTROL PANNEL </h3>
	<hr>
	<form class="control panel" action="/" method="POST">

	<label><h4>LATLONG COORDINATES</h4></label>
	<label>Current long</label>
	<input type="text" id="corres_long">
	<br>
	<label>Current Lat  </label>
	<input type="text" id="corres_lat">
	<hr>

	<label><h4>STARTING LOCATION</h4></label>

	<label>Longitude</label>
	<input type="text" name="startlong" id="startlong" >
	<br>
	<label>Latitude   </label>
	<input type="text" name="startlat" id="startlat">
	<hr>
	<label><h4>ENDING LOCATION</h4></label>

	<label>Longitude</label>
	<input type="text" name="endlong">
	<br>
	<label>Latitude   </label>
	<input type="text" name="endlat">
	<hr>
	<label><h4>SELECT AREA BY NAME</h4></label>
	<label>Start    </label>
	<input type="text" name="startplace">
	<br>
	<label>End       </label>
	<input type="text" name="startplace">
	<hr>

	<input type="submit" name="enter" value="SELECT">
	<button id="resetButton" name="reset">RESET</button>

	</form>

	</div>
	</div>





	<script>
	let timer = setInterval(myTimer, 1000);
	let images = {{img_path \| tojson}};
	let cam0 = {{cam0_path \| tojson}};
	let cam1 = {{cam1_path \| tojson}};
	let cam2 = {{cam2_path \| tojson}};
	let altA = {{altitudeA \| tojson}};
	let altB = {{altitudeB \| tojson}};
	let altC = {{altitudeC \| tojson}};
	let current_lat = {{latitudes \| tojson}};
	let current_long = {{longitudes \| tojson}};
	i = 0;


	out_long = [67.11548847479072,67.1154428772399,67.11529803796077,67.11518538518813,67.11500567719366,67.11485279128793,67.11467576550147]
	out_lat = [24.930138476755516, 24.930196851634875,24.930410892622643,24.93056655856212,24.93082194756822,24.931045716548144,24.931045716548144]

	function myTimer() {
	document.getElementById("map").src = "static/map1/"+images[i];
	document.getElementById("cam0").src = "static/left/"+cam0[i];
	document.getElementById("cam1").src = "static/front/"+cam1[i];

	document.getElementById("map2").src = "static/map2/"+images[i];
	document.getElementById("alt0").src = "static/altitudeA/"+images[i];
	document.getElementById("startlat").value = 24.93535571446724
	document.getElementById("startlong").value = 67.11548847479072
	document.getElementById("corres_lat").value = current_lat[i]
	document.getElementById("corres_long").value = current_long[i]
	i++;

	console.log(i===cam1.length+1);

	resetButton.addEventListener("click", () => {
	i = cam1.length-1
	});

	if(i === cam1.length-1 \|\| cam1.length === 0){
	clearInterval(timer);
	i = 0;
	};
	}


	</script>


	</body>
	</html>