Skip to content

Commit 69d33b3

Browse files
Nikola-MircicNikola-Mircic
committed
Merge branch 'feat/ui-design'
2 parents 0af63d3 + 811b6ac commit 69d33b3

15 files changed

Lines changed: 137 additions & 59 deletions

‎client/assets/css/history.css‎

Lines changed: 43 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,49 @@
11
#history{
22
display: block;
33
position: relative;
4+
5+
overflow: hidden;
6+
47
width: 80%;
58
height: fit-content;
9+
margin: 10px auto
10+
}
11+
12+
13+
.file_data{
14+
display: block;
15+
position: relative;
616
margin: 10px auto;
7-
}
17+
18+
width: 100%;
19+
height: fit-content;
20+
21+
border-width: 2px;
22+
border-style: solid;
23+
border-color: rgba(16, 14, 54, 0.9);
24+
border-radius: 0.1rem;
25+
26+
box-sizing: border-box;
27+
}
28+
29+
.file_data p{
30+
display: flex;
31+
justify-content: space-between;
32+
padding: .5rem;
33+
align-items: center;
34+
background-color: rgba(33, 61, 187, 0.486);
35+
36+
font-size: 1.25rem;
37+
}
38+
39+
.file_stats p:nth-child(odd){
40+
background-color: #aaaaaa55;
41+
}
42+
43+
.file_stats{
44+
display: none;
45+
}
46+
47+
.file_stats[visible]{
48+
display: block;
49+
}

‎client/assets/js/history.js‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
2+
function print({logs}){
3+
for(let i=0;i<logs.length-1;++i){
4+
$("#history").append(`<div class="file_data">
5+
<p>
6+
<span style="font-weight: bold">File name:</span>
7+
<span style="color:#eee;">${logs[i].filename}</span>
8+
</p>
9+
<div class="file_stats">
10+
<p>
11+
<span style="font-weight: bold">Sender:</span>
12+
<span style="color:#eee;">${logs[i].from}</span>
13+
</p>
14+
<p>
15+
<span style="font-weight: bold">Receiver:</span>
16+
<span style="color:#eee;">${logs[i].to}</span>
17+
</p>
18+
<p>
19+
<span style="font-weight: bold">Time:</span>
20+
<span style="color:#eee;">${logs[i].time}</span>
21+
</p>
22+
</div>
23+
</div>`);
24+
}
25+
26+
$(".file_data").on("click",(event)=>{
27+
event.currentTarget.children[1].toggleAttribute("visible");
28+
});
29+
}
30+
31+
fetch(window.location.origin+"/get-history")
32+
.then((data)=>data.body)
33+
.then((data)=>{
34+
data.getReader().read().then(({done,value})=>{
35+
value = new TextDecoder().decode(value);
36+
print(JSON.parse(value));
37+
})
38+
});
39+
40+
(function(){
41+
var head = document.getElementsByTagName("head")[0];
42+
var link = document.createElement("link");
43+
link.setAttribute("rel", "stylesheet");
44+
link.setAttribute("type", "text/css");
45+
link.setAttribute("href", "./assets/css/history.css");
46+
link.setAttribute("name", "css");
47+
48+
document.getElementsByName("css").forEach((node)=>node.remove());
49+
50+
head.append(link);
51+
52+
updateUser(window.sessionStorage.getItem("username"));
53+
})();
54+

client/assets/js/FileSaver.min.js renamed to client/assets/js/lib/FileSaver.min.js

File renamed without changes.

client/assets/js/FileSaver.min.js.map renamed to client/assets/js/lib/FileSaver.min.js.map

File renamed without changes.

client/assets/js/jquery.min.js renamed to client/assets/js/lib/jquery.min.js

File renamed without changes.

client/assets/js/jszip.min.js renamed to client/assets/js/lib/jszip.min.js

File renamed without changes.

‎client/assets/js/main.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -394,7 +394,14 @@ function extractFiles(dir){
394394
return dirFiles;
395395
}
396396

397+
$("#register").on('submit', (e)=>{
398+
console.log("Stoped...");
399+
setTimeout(()=>{}, 1000);
400+
e.preventDefault();
401+
});
402+
397403
function registerUser(){
404+
setTimeout(()=>{}, 1000);
398405
if(socket.disconnected)
399406
socket.connect();
400407
let name = $("#register input").val();
@@ -489,3 +496,5 @@ function addFileToList(file){
489496
$("#data ol").html(htmlData);
490497
}
491498

499+
500+

‎client/history.html‎

Lines changed: 11 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@
44
<title>Network file manager</title>
55

66
<link rel="stylesheet" type="text/css" href="./assets/css/main.css">
7-
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, target-densityDpi=device-dpi">
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0, target-densityDpi=device-dpi">
88
<script type="text/javascript" src="/socket.io/socket.io.js"></script>
9-
<script type="text/javascript" src="./assets/js/jquery.min.js"></script>
10-
<script type="text/javascript" src="./assets/js/jszip.min.js"></script>
11-
<script type="text/javascript" src="./assets/js/FileSaver.min.js"></script>
9+
<script type="text/javascript" src="./assets/js/lib/jquery.min.js"></script>
10+
<script type="text/javascript" src="./assets/js/lib/jszip.min.js"></script>
11+
<script type="text/javascript" src="./assets/js/lib/FileSaver.min.js"></script>
1212

1313
<script>
1414
const socket = io();
@@ -24,7 +24,7 @@ <h1 id="headerText">Network file manager</h1>
2424
<div id="userIpAddr" class="headerContainer" style="display: none;">
2525
<h6>Your IPv4: <span id="ipv4">192.168.1.9</span></h6>
2626
</div>
27-
<form id="register" class="profileField">
27+
<form id="register" class="profileField" onsubmit="()=>{return false;}">
2828
<input type="text" name="userName" id="userName" placeholder=" Enter your name / ID">
2929
<button onclick="registerUser();">Register</button>
3030
</form>
@@ -34,48 +34,19 @@ <h3 name="profileName" id="profileName"></h3>
3434
<button onclick="changeUser();">Change</button>
3535
</div>
3636
</div>
37+
3738
<nav class="nav">
3839
<li><a onclick="redirect('/');"><button><i class="fa-regular fa-pen-to-square"></i> Workspace</button></a></li>
39-
<li><a onclick="redirect('/sent');"><button><i class="fa-solid fa-paper-plane"></i> Send</button></a></li>
40+
<li><a onclick="redirect('/sent');"><button><i class="fa-solid fa-paper-plane"></i> Send</i></button></a></li>
4041
<li><a onclick="redirect('/history');"><button active><i class="fa-solid fa-clock-rotate-left"></i> History</button></a></li>
4142
</nav>
4243

43-
<section id="history">
44-
45-
</section>
46-
47-
<script>
48-
function print(data){
49-
document.getElementById("history").innerHTML = data;
50-
}
51-
52-
fetch(window.location+"get-history")
53-
.then((data)=>data.body)
54-
.then((data)=>{
55-
data.getReader().read().then(({done,value})=>{
56-
value = new TextDecoder().decode(value);
57-
console.log(value);
58-
console.log(JSON.parse(value));
59-
print(value);
60-
})
61-
});
62-
63-
(function(){
64-
var head = document.getElementsByTagName("head")[0];
65-
var link = document.createElement("link");
66-
link.setAttribute("rel", "stylesheet");
67-
link.setAttribute("type", "text/css");
68-
link.setAttribute("href", "./assets/css/history.css");
69-
link.setAttribute("name", "css");
44+
<div id="history">
7045

71-
document.getElementsByName("css").forEach((node)=>node.remove());
72-
73-
head.append(link);
74-
75-
updateUser(window.sessionStorage.getItem("username"));
76-
})();
77-
</script>
46+
</div>
7847

7948
<!-- PAGE SPECIFIC SCRIPTS-->
49+
<script src="./assets/js/history.js" defer></script>
50+
8051
</body>
8152
</html>

‎client/index.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@
55
<link rel="stylesheet" type="text/css" href="./assets/css/main.css">
66
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
77
<meta name="viewport" content="width=device-width, initial-scale=1.0, target-densityDpi=device-dpi">
8-
8+
99
<script src="https://kit.fontawesome.com/138f40277e.js" crossorigin="anonymous"></script>
1010
<script type="text/javascript" src="/socket.io/socket.io.js"></script>
11-
<script type="text/javascript" src="./assets/js/jquery.min.js"></script>
12-
<script type="text/javascript" src="./assets/js/jszip.min.js"></script>
13-
<script type="text/javascript" src="./assets/js/FileSaver.min.js"></script>
11+
<script type="text/javascript" src="./assets/js/lib/jquery.min.js"></script>
12+
<script type="text/javascript" src="./assets/js/lib/jszip.min.js"></script>
13+
<script type="text/javascript" src="./assets/js/lib/FileSaver.min.js"></script>
1414

1515
<script>
1616
const socket = io();

‎client/sent.html‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,12 @@
33
<head>
44
<title>Network file manager</title>
55
<link rel="stylesheet" type="text/css" href="./assets/css/main.css">
6-
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, target-densityDpi=device-dpi">
7-
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0, target-densityDpi=device-dpi">
7+
88
<script type="text/javascript" src="/socket.io/socket.io.js" defer></script>
9-
<script type="text/javascript" src="./assets/js/jquery.min.js" defer></script>
10-
<script type="text/javascript" src="./assets/js/jszip.min.js" defer></script>
11-
<script type="text/javascript" src="./assets/js/FileSaver.min.js" defer></script>
9+
<script type="text/javascript" src="./assets/js/lib/jquery.min.js" defer></script>
10+
<script type="text/javascript" src="./assets/js/lib/jszip.min.js" defer></script>
11+
<script type="text/javascript" src="./assets/js/lib/FileSaver.min.js" defer></script>
1212

1313
<script defer>
1414
const socket = io();

0 commit comments

Comments
 (0)