Timmyafolami commited on
Commit
8909122
·
verified ·
1 Parent(s): 06f8aa3

Update static/scripts/app.js

Browse files
Files changed (1) hide show
  1. static/scripts/app.js +63 -63
static/scripts/app.js CHANGED
@@ -1,63 +1,63 @@
1
- document.addEventListener('DOMContentLoaded', () => {
2
- const ws = new WebSocket('ws://127.0.0.1:8000/ws');
3
-
4
- ws.onmessage = (event) => {
5
- const messageDiv = document.getElementById('message');
6
- messageDiv.innerHTML += `<p>${event.data}</p>`;
7
- };
8
-
9
- document.getElementById('uploadButton').addEventListener('click', async () => {
10
- const fileInput = document.getElementById('fileInput');
11
- if (fileInput.files.length === 0) {
12
- alert('Please select a file to upload.');
13
- return;
14
- }
15
-
16
- const file = fileInput.files[0];
17
- const formData = new FormData();
18
- formData.append('file', file);
19
-
20
- const progressBar = document.getElementById('uploadProgressBar');
21
- const progressContainer = document.getElementById('uploadProgress');
22
- const messageDiv = document.getElementById('message');
23
-
24
- progressContainer.style.display = 'block';
25
- progressBar.style.width = '0%';
26
- progressBar.textContent = '0%';
27
- messageDiv.innerHTML = '';
28
-
29
- try {
30
- const response = await fetch('http://127.0.0.1:8000/upload_geotiff/', {
31
- method: 'POST',
32
- body: formData,
33
- headers: {
34
- 'Accept': 'application/json',
35
- }
36
- });
37
-
38
- if (response.ok) {
39
- progressBar.style.width = '50%';
40
- progressBar.textContent = '50%';
41
-
42
- const blob = await response.blob();
43
- const url = window.URL.createObjectURL(blob);
44
- const a = document.createElement('a');
45
- a.style.display = 'none';
46
- a.href = url;
47
- a.download = 'weed_detections.zip';
48
- document.body.appendChild(a);
49
- a.click();
50
- window.URL.revokeObjectURL(url);
51
-
52
- progressBar.style.width = '100%';
53
- progressBar.textContent = '100%';
54
- messageDiv.innerHTML = '<p>Weed detection complete. <a href="' + url + '" download="weed_detections.zip">Download the shapefile ZIP</a></p>';
55
- } else {
56
- messageDiv.innerHTML = '<p>Error uploading file: ' + response.statusText + '</p>';
57
- }
58
- } catch (error) {
59
- console.error('Error:', error);
60
- messageDiv.innerHTML = '<p>Error: ' + error.message + '</p>';
61
- }
62
- });
63
- });
 
1
+ document.addEventListener('DOMContentLoaded', () => {
2
+ const ws = new WebSocket('ws://backend:7860/ws');
3
+
4
+ ws.onmessage = (event) => {
5
+ const messageDiv = document.getElementById('message');
6
+ messageDiv.innerHTML += `<p>${event.data}</p>`;
7
+ };
8
+
9
+ document.getElementById('uploadButton').addEventListener('click', async () => {
10
+ const fileInput = document.getElementById('fileInput');
11
+ if (fileInput.files.length === 0) {
12
+ alert('Please select a file to upload.');
13
+ return;
14
+ }
15
+
16
+ const file = fileInput.files[0];
17
+ const formData = new FormData();
18
+ formData.append('file', file);
19
+
20
+ const progressBar = document.getElementById('uploadProgressBar');
21
+ const progressContainer = document.getElementById('uploadProgress');
22
+ const messageDiv = document.getElementById('message');
23
+
24
+ progressContainer.style.display = 'block';
25
+ progressBar.style.width = '0%';
26
+ progressBar.textContent = '0%';
27
+ messageDiv.innerHTML = '';
28
+
29
+ try {
30
+ const response = await fetch('http://backend:8000/upload_geotiff/', {
31
+ method: 'POST',
32
+ body: formData,
33
+ headers: {
34
+ 'Accept': 'application/json',
35
+ }
36
+ });
37
+
38
+ if (response.ok) {
39
+ progressBar.style.width = '50%';
40
+ progressBar.textContent = '50%';
41
+
42
+ const blob = await response.blob();
43
+ const url = window.URL.createObjectURL(blob);
44
+ const a = document.createElement('a');
45
+ a.style.display = 'none';
46
+ a.href = url;
47
+ a.download = 'weed_detections.zip';
48
+ document.body.appendChild(a);
49
+ a.click();
50
+ window.URL.revokeObjectURL(url);
51
+
52
+ progressBar.style.width = '100%';
53
+ progressBar.textContent = '100%';
54
+ messageDiv.innerHTML = '<p>Weed detection complete. <a href="' + url + '" download="weed_detections.zip">Download the shapefile ZIP</a></p>';
55
+ } else {
56
+ messageDiv.innerHTML = '<p>Error uploading file: ' + response.statusText + '</p>';
57
+ }
58
+ } catch (error) {
59
+ console.error('Error:', error);
60
+ messageDiv.innerHTML = '<p>Error: ' + error.message + '</p>';
61
+ }
62
+ });
63
+ });