aheh/call-me
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[call-me] - update dep, fix ui

Browse Source
This commit is contained in:
Miroslav Pejic
2024-09-19 20:02:09 +02:00
parent 88120caa4a
commit f7f1f5bf77
3 changed files with 74 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package.json
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "call-me",
"version": "1.0.8",
"version": "1.0.9",
"description": "Your Go-To for Instant Video Calls",
"author": "Miroslav Pejic - miroslav.pejic.85@gmail.com",
"license": "AGPLv3",
@@ -26,7 +26,7 @@
"swagger-ui-express": "5.0.1"
},
"devDependencies": {
"nodemon": "^3.1.4",
"nodemon": "^3.1.6",
"prettier": "3.3.3"
}
}
public/index.html
+43 -50
View File
@@ -85,57 +85,50 @@
</div>
<!-- Room Page -->
<div class="container text-center center">
<div id="roomPage">
<!-- Local video element (user's video) -->
<div id="localVideoContainer">
<video id="localVideo"></video>
<span id="localUsername"></span>
</div>
<!-- Remote video element (video from the other user) -->
<video id="remoteVideo"></video>
<div class="row text-center">
<div class="col-md-12">
<div class="mb-3">
<!-- Input field for entering the username to call -->
<input
id="callUsernameIn"
type="text"
class="form-control"
placeholder="Username to call"
/>
</div>
<!-- Button to hide/show the local video -->
<button
id="hideBtn"
class="btn btn-custom btn-primary btn-m"
data-toggle="tooltip"
data-placement="top"
title="Toggle hide me"
>
<i class="fas fa-eye-slash"></i>
</button>
<!-- Button to initiate a video call -->
<button
id="callBtn"
class="btn btn-custom btn-success btn-m"
data-toggle="tooltip"
data-placement="top"
title="Call"
>
<i class="fas fa-phone"></i>
</button>
<!-- Button to hang up the call -->
<button
id="hangUpBtn"
class="btn btn-custom btn-danger btn-m"
data-toggle="tooltip"
data-placement="top"
title="Hang up"
>
<i class="fas fa-phone-slash"></i>
</button>
<div id="roomPage" class="container text-center center">
<!-- Local video element (user's video) -->
<div id="localVideoContainer">
<video id="localVideo"></video>
<span id="localUsername"></span>
</div>
<!-- Remote video element (video from the other user) -->
<video id="remoteVideo"></video>
<div class="row text-center">
<div class="col-md-12">
<div class="mb-3">
<!-- Input field for entering the username to call -->
<input id="callUsernameIn" type="text" class="form-control" placeholder="Username to call" />
</div>
<!-- Button to hide/show the local video -->
<button
id="hideBtn"
class="btn btn-custom btn-primary btn-m"
data-toggle="tooltip"
data-placement="top"
title="Toggle hide me"
>
<i class="fas fa-eye-slash"></i>
</button>
<!-- Button to initiate a video call -->
<button
id="callBtn"
class="btn btn-custom btn-success btn-m"
data-toggle="tooltip"
data-placement="top"
title="Call"
>
<i class="fas fa-phone"></i>
</button>
<!-- Button to hang up the call -->
<button
id="hangUpBtn"
class="btn btn-custom btn-danger btn-m"
data-toggle="tooltip"
data-placement="top"
title="Hang up"
>
<i class="fas fa-phone-slash"></i>
</button>
</div>
</div>
</div>
public/style.css
+29 -3
View File
@@ -14,14 +14,21 @@
html,
body {
top: 0;
bottom: 0;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden; /* Prevent scrolling if the image is larger than the viewport */
margin: auto;
overflow: auto;
background: url('background.jpg') center/cover no-repeat; /* Consolidate background properties */
}
/* Room */
#roomPage {
position: absolute;
display: none;
}
/* Home Sign in */
#signInPage {
position: absolute;
@@ -150,3 +157,22 @@ input {
color: #fff !important;
border: none !important;
}
/* Webkit-Scrollbar Styles */
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-thumb {
background: radial-gradient(#333, #000000);
border-radius: 5px;
cursor: pointer;
}
::-webkit-scrollbar-thumb:hover {
background-color: radial-gradient(#333, #000000);
}
::-webkit-scrollbar-track {
background: #1a1b1f;
}