Hugging Face's logo

Spaces:
muhammadzain
/
portal2
Runtime error

App Files Community
portal2
File size: 5,047 Bytes 
9b35c3f
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
 
<!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">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; SATELLITE IMAGE &nbsp; &nbsp; &nbsp; &nbsp;</b></div>
    <div id="floor plan"><b id="head2"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;2D STRUCTURAL VIEW&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</b></div>
    <div id="googleMap"><img src="" id="map2"></div>
    <div id="maps"> <img src="" id="map"></div>
    <div id="leftdiv"><b id="left"> &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;LEFT CAMERA VIEW</b></div>
    <div id="frontdiv"><b id="front"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  &nbsp;FRONT CAMERA VIEW</b></div>
    <div id="rightdiv"><b id="right">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;  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"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;3D POINT CLOUD</b></div>
    <div id="altitudeF"><b id="front">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;BIM</b></div>
    <div id="altitudeR"><b id="right">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;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 &nbsp;</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 &nbsp; </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 &nbsp; </label>
            <input type="text" name="endlat">
            <hr>
            <label><h4>SELECT AREA BY NAME</h4></label>
            <label>Start &nbsp; &nbsp;</label>
            <input type="text" name="startplace">
            <br>
            <label>End &nbsp; &nbsp; &nbsp; </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>