66 lines
1.8 KiB
JavaScript
66 lines
1.8 KiB
JavaScript
// Get references to HTML elements
|
|
const form = document.getElementById('create-room-form');
|
|
const input = document.getElementById('roomName');
|
|
const button = document.getElementById('createRoomBtn');
|
|
const errorMessage = document.getElementById('error-message');
|
|
|
|
// Handle form changes to enable/disable button
|
|
input.addEventListener('input', () => {
|
|
const hasValue = input.value.trim() !== '';
|
|
button.disabled = !hasValue;
|
|
|
|
if (hasValue) {
|
|
errorMessage.textContent = '';
|
|
errorMessage.hidden = true;
|
|
} else {
|
|
errorMessage.textContent = 'Room name is required.';
|
|
errorMessage.hidden = false;
|
|
}
|
|
});
|
|
|
|
// Handle form submission
|
|
form.addEventListener('submit', (event) => {
|
|
event.preventDefault();
|
|
createRoom();
|
|
});
|
|
|
|
// Function to create a new room by calling the backend API
|
|
async function createRoom() {
|
|
// Clear previous error message
|
|
errorMessage.textContent = '';
|
|
errorMessage.hidden = true;
|
|
|
|
try {
|
|
const roomName = input.value;
|
|
const { room } = await httpRequest('POST', '/rooms', {
|
|
roomName
|
|
});
|
|
|
|
// Redirect to the newly created room
|
|
window.location.href = room.moderatorUrl;
|
|
} catch (error) {
|
|
console.error('Error creating room:', error.message);
|
|
errorMessage.textContent = 'Error creating room';
|
|
errorMessage.hidden = false;
|
|
}
|
|
}
|
|
|
|
// Function to make HTTP requests to the backend
|
|
async function httpRequest(method, path, body) {
|
|
const response = await fetch(path, {
|
|
method,
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: body ? JSON.stringify(body) : undefined
|
|
});
|
|
|
|
const responseBody = await response.json();
|
|
|
|
if (!response.ok) {
|
|
throw new Error(responseBody.message || 'Failed to perform request to backend');
|
|
}
|
|
|
|
return responseBody;
|
|
}
|