Scheduler-Backend/public/javascripts/schedule.js

"use strict";

/**
 * Import required functions from utils.js
 */
import { fetchRegular, getTimeSpan, parseOrRedirect } from "./utils.js";

let appointment;
const errorParagraph = document.getElementById('appointment-error');
const successParagraph = document.getElementById('appointment-success');

/**
 * Event listener for window load
 */
window.addEventListener("load", async function () {
    document.getElementById("btn-attend").addEventListener("click", async () => {
        await attendEvent();
    })
    
    const urlParams = new URLSearchParams(window.location.search);
    appointment = urlParams.get('appointment');
    
    if (!appointment) {
        window.location.replace("/html/404.html");
    }

    await getAppointment();
});

/**
 * Get appointment details from API
 *
 * @async
 * @returns {Promise<void>}
 */
async function getAppointment() {
    let options = { method: 'GET', headers: {'User-Agent': 'insomnia/10.0.0'} };

    const searchParams = new URLSearchParams({
        appointmentId: appointment,

    });

    const response = await fetchRegular('/api/schedule?' + searchParams.toString(), options)
        .catch(err => console.error('error:' + err));

    const js = await parseOrRedirect(response);
    displayAppointmentDetails(js);
}

/**
 * Display appointment details on page
 *
 * @param {object} appointment - Appointment data from API
 */
function displayAppointmentDetails(appointment) {
    /**
     * Update element values with appointment details
     */
    document.getElementById('appointment-date').innerText = appointment._id;
    document.getElementById('title').innerText = appointment.title;
    document.getElementById('description').innerText = appointment.description;

    const dueDate = new Date(appointment.dueDate).toLocaleDateString();
    const startDate = new Date(appointment.startDate);
    const endDate = new Date(appointment.endDate);
    const startDateFormatted = startDate.toLocaleString();

    document.getElementById('due-date').value = dueDate;
    document.getElementById('appointment-date').value = startDateFormatted;
    document.getElementById('time-span').value = getTimeSpan(startDate, endDate);

    document.getElementById('place').innerText = appointment.place;
}

/**
 * Attend event by creating a new schedule entry in API
 *
 * @async
 * @returns {Promise<void>}
 */
async function attendEvent() {
    const email = document.getElementById('email').value;
    const firstname = document.getElementById('firstname').value;
    const lastname = document.getElementById('lastname').value;

    if (!email || !firstname || !lastname) {

        errorParagraph.innerText = "Fill in all fields.";
        return;
    }

    const response = await fetchRegular("/api/schedule/create",
        {
            method: 'POST',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({
                appointment: appointment,
                email: email,
                firstname: firstname,
                lastname: lastname
            })
        });

    const js = await response.json();

    if (response.status !== 200) {
        errorParagraph.innerText = js["message"];
        successParagraph.innerText = "";
    } else {
        errorParagraph.innerText = "";
        successParagraph.innerText = "Registered successfully.";
    }
}