refactor: restructure web application with modular JavaScript and remove legacy code
- Deleted the `app.js` file and migrated its functionality to a modular structure with multiple JavaScript files for better organization and maintainability. - Updated `index.html` to reference the new `main.js` module, ensuring proper loading of the application. - Introduced new utility modules for API requests, authentication, calendar handling, and DOM manipulation to enhance code clarity and separation of concerns. - Enhanced CSS styles for improved layout and theming consistency across the application. - Added comprehensive comments and documentation to new modules to facilitate future development and understanding.
This commit is contained in:
43
webapp/js/dom.js
Normal file
43
webapp/js/dom.js
Normal file
@@ -0,0 +1,43 @@
|
||||
/**
|
||||
* DOM references and shared application state.
|
||||
*/
|
||||
|
||||
/** @type {HTMLDivElement|null} */
|
||||
export const calendarEl = document.getElementById("calendar");
|
||||
|
||||
/** @type {HTMLElement|null} */
|
||||
export const monthTitleEl = document.getElementById("monthTitle");
|
||||
|
||||
/** @type {HTMLDivElement|null} */
|
||||
export const dutyListEl = document.getElementById("dutyList");
|
||||
|
||||
/** @type {HTMLElement|null} */
|
||||
export const loadingEl = document.getElementById("loading");
|
||||
|
||||
/** @type {HTMLElement|null} */
|
||||
export const errorEl = document.getElementById("error");
|
||||
|
||||
/** @type {HTMLElement|null} */
|
||||
export const accessDeniedEl = document.getElementById("accessDenied");
|
||||
|
||||
/** @type {HTMLElement|null} */
|
||||
export const headerEl = document.querySelector(".header");
|
||||
|
||||
/** @type {HTMLElement|null} */
|
||||
export const weekdaysEl = document.querySelector(".weekdays");
|
||||
|
||||
/** @type {HTMLButtonElement|null} */
|
||||
export const prevBtn = document.getElementById("prevMonth");
|
||||
|
||||
/** @type {HTMLButtonElement|null} */
|
||||
export const nextBtn = document.getElementById("nextMonth");
|
||||
|
||||
/** Currently viewed month (mutable). */
|
||||
export const state = {
|
||||
/** @type {Date} */
|
||||
current: new Date(),
|
||||
/** @type {object[]} */
|
||||
lastDutiesForList: [],
|
||||
/** @type {ReturnType<typeof setInterval>|null} */
|
||||
todayRefreshInterval: null
|
||||
};
|
||||
Reference in New Issue
Block a user