Skip to content

Commit 9c5b11d

Browse files
ShreeSinghiShreeSinghi
committed
penultimate commit
1 parent e19fb42 commit 9c5b11d

File tree

5 files changed

+134
-34
lines changed

5 files changed

+134
-34
lines changed

‎requirements.txt

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
opencv-python
2+
numpy
3+
moviepy
4+
scipy

‎templates/client.html

+5-4
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929

3030
<div class="row align-items-center justify-content-center">
3131
<button class="btn btn-info col-6 btn-sm mx-1" type="button" disabled>
32-
<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true" id="spinner"></span>
32+
<span class="spinner-border spinner-border-sm d-none" role="status" aria-hidden="true" id="spinner"></span>
3333
<span class="sr-only" id="message">Loading...</span>
3434
</button>
3535

@@ -58,15 +58,16 @@
5858
let get;
5959

6060
try {
61-
const res = await fetch("/client_status");
61+
const res = await fetch("/status");
6262
get = await res.json();
6363
} catch (e) {
6464
console.error("Error: ", e);
6565
}
6666

67-
if (message=="Connected!"){
67+
if (get.message=="Connected!"){
6868
document.getElementById("spinner").classList.add("d-none");
69-
} else {
69+
}
70+
else {
7071
document.getElementById("spinner").classList.remove("d-none");
7172
}
7273
document.getElementById("message").innerHTML = get.message;

‎templates/convert.html

+70
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<title>Menu</title>
6+
<meta charset="utf-8">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
9+
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
10+
</head>
11+
12+
<body class="bg-dark">
13+
14+
<div class="row" style="height: 5vh"></div>
15+
16+
<div class="d-flex row" style="height: 15vh"></div>
17+
18+
<form class="form-group" method="POST" enctype="multipart/form-data" action="/upload_convert">
19+
<div class="d-flex row align-items-center justify-content-center" style="height: 15vh">
20+
<div class="col-4"></div>
21+
<input class="btn btn-outline-info btn-lg col-4" type="file" name="file" multiple="">
22+
<div class="col-4"></div>
23+
</div>
24+
25+
26+
<div class="d-flex row align-items-center justify-content-center" style="height: 15vh">
27+
<div class="col-5"></div>
28+
<input class="btn btn-outline-info btn-lg col-2" type="submit" value="upload" id="upload">
29+
<div class="col-5"></div>
30+
</div>
31+
32+
</form>
33+
34+
<div class="d-flex row" style="height: 10vh"></div>
35+
<h1 class="text-center text-white-50" id="filename"></h1>
36+
37+
</body>
38+
39+
<script>
40+
var timeout;
41+
42+
async function update_connection() {
43+
44+
try {
45+
46+
let get;
47+
const res = await fetch("/status");
48+
get = await res.json();
49+
50+
if (get.message != ""){
51+
document.getElementById("filename").innerHTML = "converting: " + get.message;
52+
} else {
53+
document.getElementById("filename").innerHTML = "";
54+
55+
}
56+
57+
58+
timeout = setTimeout(update_connection, 1000);
59+
60+
} catch (e) {
61+
console.error("Error: ", e);
62+
}
63+
}
64+
65+
update_connection();
66+
67+
</script>
68+
69+
70+
</html>

‎templates/index.html

+41-13
Original file line numberDiff line numberDiff line change
@@ -10,34 +10,36 @@
1010
</head>
1111

1212
<body class="bg-dark">
13+
14+
<div class="row" style="height: 5vh"></div>
1315

14-
<div class="row" style="min-height: 5vh"></div>
16+
<div class="d-flex row" style="height: 5vh"></div>
17+
18+
<form method="POST" enctype="multipart/form-data" action="/upload">
19+
<input class="btn align-items-center justify-content-center btn-outline-info btn-sm" type="file" name="file" multiple="" value="choose files">
20+
<input class="btn align-items-center justify-content-center btn-outline-info btn-sm" type="submit" value="upload .jpg" id="upload">
21+
</form>
1522

16-
<div class="d-flex row" style="min-height: 5vh"></div>
17-
<div class="col-2 text-center">
18-
<button type="button" class="btn align-items-center justify-content-center btn-outline-info btn-sm">choose image folder</button>
19-
</div>
20-
21-
<div class="row" style="min-height: 15vh"></div>
23+
<div class="row" style="height: 15vh"></div>
2224

2325

24-
<div class="d-flex row align-items-center justify-content-center" style="min-height: 30vh">
26+
<div class="d-flex row align-items-center justify-content-center" style="height: 30vh">
2527

2628
<h1 class="text-center text-white-50">what's your purpose?</h1>
27-
<h1></h1><h1></h1><h1></h1><h1></h1><h1></h1><h1></h1>
29+
<div class="row" style="height: 15vh"></div>
2830

2931

3032
<div class="row buttons">
3133
<div class="col-4 text-center">
32-
<a href="server" role="button" class="btn btn-outline-info btn-lg ">SERVER</a>
34+
<a href="/server" role="button" class="btn btn-outline-info btn-lg ">SERVER</a>
3335
</div>
3436

3537
<div class="col-4 text-center">
36-
<a href="/download" role="button" class="btn btn-outline-info btn-lg">CONVERT FILES</a>
38+
<a href="/convert" role="button" class="btn btn-outline-info btn-lg">CONVERT FILES</a>
3739
</div>
3840

3941
<div class="col-4 text-center">
40-
<a href="client" role="button" class="btn btn-outline-info btn-lg ">CLIENT</a>
42+
<a href="/client" role="button" class="btn btn-outline-info btn-lg ">CLIENT</a>
4143
</div>
4244

4345
<!-- add carousel -->
@@ -47,4 +49,30 @@ <h1></h1><h1></h1><h1></h1><h1></h1><h1></h1><h1></h1>
4749

4850
</body>
4951

50-
</html>
52+
<script>
53+
var timeout;
54+
55+
async function update_connection() {
56+
57+
try {
58+
59+
let get;
60+
const res = await fetch("/status");
61+
get = await res.json();
62+
63+
64+
document.getElementById("upload").value = get.message;
65+
66+
timeout = setTimeout(update_connection, 1000);
67+
68+
} catch (e) {
69+
console.error("Error: ", e);
70+
}
71+
}
72+
73+
update_connection();
74+
75+
</script>
76+
77+
78+
</html>

‎templates/server.html

+14-17
Original file line numberDiff line numberDiff line change
@@ -13,21 +13,21 @@
1313

1414
<div class="row" style="height: 5vh"></div>
1515

16-
<div class="text-center border" style="height: 60vh">
17-
<img src="" id="feed" class="img-fluid h-100">
16+
<div class="text-center" style="height: 60vh">
17+
<img src="/feed_server" id="feed" class="img-fluid h-100">
1818
</div>
1919

2020

2121
<div class="d-flex row align-items-center" style="height: 10vh">
2222
<div class="col-1"></div>
2323
<code class="col-5 text-center" id="ip">IP: </code>
24-
<code class="col-5 text-center" id="port">port: </code>
24+
<code class="col-5 text-center" id="port">Port: </code>
2525
</div>
2626

2727
<div class="row" style="height: 5vh"></div>
2828
<div class="d-flex row align-items-center" style="height: 15vh">
2929
<div class="col-4"></div>
30-
<div class="col-4 text-center text-white-50"> enter the IP and port shown above on the client's machine</div>
30+
<div class="col-4 text-center text-white-50" id="message"> enter the IP and port shown above on the client's machine</div>
3131
</div>
3232

3333
<div class="d-flex align-items-center">
@@ -45,22 +45,19 @@
4545
let get;
4646

4747
try {
48-
const res = await fetch("/server_status");
49-
get = await res.json();
48+
const res = await fetch("/status");
49+
get = await res.json();
50+
51+
52+
document.getElementById("ip").innerHTML = "IP: " + get.host_ip;
53+
document.getElementById("port").innerHTML = "Port: " + get.port;
54+
document.getElementById("message").innerHTML = "enter the IP and port shown above on the client's machine\n" + get.message;
55+
56+
timeout = setTimeout(update_connection, 1000);
57+
5058
} catch (e) {
5159
console.error("Error: ", e);
5260
}
53-
54-
if (get.port != ""){
55-
document.getElementById("ip").innerHTML = "IP: " + get.host_ip;
56-
document.getElementById("port").innerHTML = "port: " + get.port;
57-
}
58-
59-
if (get.connected == "True"){
60-
document.getElementById("feed").src = "/feed_server";
61-
return false;
62-
}
63-
timeout = setTimeout(update_connection, 1000);
6461
}
6562

6663
update_connection();

0 commit comments

Comments
 (0)