byte/syncapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Separated files, added Utils class

Browse Source
This commit is contained in:
Daniel
2023-08-04 22:16:09 +03:00
parent 8afb59c0ac
commit e06089d443
4 changed files with 36 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
public/client.html
View File

@@ -32,11 +32,11 @@
<body>
<div id="form-container">
<form id="roomForm">
<h2>Room ID Form</h2>
<h2>Room ID</h2>
<label for="roomId">Room ID:</label>
<input type="text" id="roomId" required />
<br /><br />
<button type="submit" id="submitBtn">Submit</button>
<button type="submit" id="submitBtn">Join</button>
</form>
<div id="mainPage" style="display: none">
<div class="container text-center">
@@ -144,19 +144,19 @@
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</div>
</div>
<script src="/utils.js"></script>
<script src="/client.js"></script>
<script>
const UTL = new Utils();
let ClientInstance;
document.addEventListener('DOMContentLoaded', function () {
const roomForm = document.getElementById('roomForm');
const mainPage = document.getElementById('mainPage');
let hasSubmitted = false;
roomForm.addEventListener('submit', function (event) {
document.addEventListener('DOMContentLoaded', () => {
const roomForm = UTL.$('roomForm');
const mainPage = UTL.$('mainPage');
roomForm.addEventListener('submit', (event) => {
event.preventDefault();
const ID = document.getElementById('roomId').value;
const ID = UTL.$('roomId').value;
mainPage.style.display = 'block';
roomForm.style.display = 'none';
hasSubmitted = true;
ClientInstance = new Client(ID);
ClientInstance.connect();
});

22
public/client.js
View File

@@ -6,16 +6,16 @@ class Client {
this.#ClientData = { name: 'Guest', id: 0, room: room_id };
this.#ClientSocket = new WebSocket('ws://93.116.13.156:3000/ws');
this.host_field = document.getElementById('host_field');
this.name_field = document.getElementById('name_field');
this.clients_field = document.getElementById('clients_field');
this.name_input = document.getElementById('name_input');
this.global_field = document.getElementById('global_field');
this.global_input = document.getElementById('global_input');
this.room_field = document.getElementById('room_field');
this.host_field = UTL.$('host_field');
this.name_field = UTL.$('name_field');
this.clients_field = UTL.$('clients_field');
this.name_input = UTL.$('name_input');
this.global_field = UTL.$('global_field');
this.global_input = UTL.$('global_input');
this.room_field = UTL.$('room_field');
this.video_field = UTL.$('video_field');
this.link_input = UTL.$('link_input');
this.room_field.textContent += room_id;
this.video_field = document.getElementById('video_field');
this.link_input = document.getElementById('link_input');
}
connect() {
@@ -49,7 +49,7 @@ class Client {
});
this.#ClientSocket.addEventListener('open', () => {
console.log('Connected');
console.log('Connected to WebSocket');
});
this.#ClientSocket.addEventListener('message', (event) => {
@@ -179,7 +179,7 @@ class Client {
refreshData() {
axios
.post('/api/getRefreshData', {
.post('/api/refresh', {
id: this.#ClientData.id,
room_id: this.#ClientData.room,
})

5
public/utils.js Normal file
View File

@@ -0,0 +1,5 @@
class Utils {
$(id) {
return document.getElementById(id);
}
}