function doAccountAction(requestData, successMessage, failureMessage, silent=false) { return fetch('/account', { method: 'POST', body: requestData, }) .then(response => { if (!response.ok) { throw new Error(`HTTP error! Status: ${response.status}`); } return response.json(); }) .then(data => { if(!silent) { handleResponse(data, successMessage, failureMessage); } return data; // Returning the response data for further processing }) .catch((error) => { console.error('Error:', error); }); } function handlePageResponse(data){ if(data.Navigation){ document.getElementById("navbar").innerHTML = data.Navigation; } if(data.Page){ document.getElementById("pagearea").innerHTML = data.Page; if(data.PageLocation){ history.pushState({}, "", data.PageLocation); } } } function doPageAction(requestData){ return fetch('/page', { method: 'POST', body: requestData, }) .then(response => { if (!response.ok) { throw new Error(`HTTP error! Status: ${response.status}`); } return response.json(); }) .then(data => { handlePageResponse(data); }) .catch((error) => { console.error('Error:', error); }); } function displayList(data, element_id, delete_function=null) { const tableContainer = document.getElementById(element_id); tableContainer.innerHTML = ""; // Clear previous content const table = document.createElement("table"); table.classList.add("list-table"); // Create header row const headerRow = table.insertRow(0); for (const key in data[0]) { const th = document.createElement("th"); th.appendChild(document.createTextNode(key)); headerRow.appendChild(th); } if(typeof delete_function === "function") { const th = document.createElement("th"); th.appendChild(document.createTextNode("Delete")); headerRow.appendChild(th); } // Create data rows for (const line of data) { const dataRow = table.insertRow(); for (const key in line) { const td = document.createElement("td"); td.appendChild(document.createTextNode(line[key])); dataRow.appendChild(td); } if(typeof delete_function === "function") { const td = document.createElement("td"); let delete_button = document.createElement('button'); delete_button.textContent = "Delete" delete_button.onclick = function (){ delete_function(line.ID); } td.appendChild(delete_button); dataRow.appendChild(td); } } tableContainer.appendChild(table); } function handleResponse(data, SuccessMessage, failureMessage) { const StatusMessageElement = document.getElementById("StatusMessage"); if (data.Status === 'Success') { StatusMessageElement.innerText = SuccessMessage; } else { StatusMessageElement.innerText = failureMessage; } // Show the status message StatusMessageElement.style.display = "block"; setTimeout(() => { // Hide the status message after 3 seconds StatusMessageElement.style.opacity = "0"; setTimeout(() => { StatusMessageElement.style.display = "none"; // Reset opacity for future messages StatusMessageElement.style.opacity = "1"; }, 500); }, 3000); } function navigateTo(site, page){ const data = new URLSearchParams(); data.append("action", "getPage"); data.append("site", site); data.append("page", page); doPageAction(data); } function refreshNavbar(){ const data = new URLSearchParams(); data.append("action", "getNavigation"); doPageAction(data); } function logout() { const data = new URLSearchParams(); data.append("action", "logout"); doAccountAction(data, "Logout Successful!", "Logout failed.").then(() => { refreshNavbar(); navigateTo("", pageData.defaultPage); // Expected output: "Success!" }); } function initAjax() { let links = document.querySelectorAll('.navsite_item, .navpage_item'); // Add click event listener to each link links.forEach(function (link) { link.addEventListener('click', function (e) { e.preventDefault(); // Get page and site information let site = this.dataset.site; let page = this.dataset.page; if (site && page) { navigateTo(site, page); } // You can use this information to update the URL or perform other actions }); }); } document.addEventListener('DOMContentLoaded', initAjax);