168 lines
4.9 KiB
JavaScript
168 lines
4.9 KiB
JavaScript
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_link, .navpage_link');
|
|
|
|
// Add click event listener to each link
|
|
links.forEach(function (link) {
|
|
link.addEventListener('click', function (e) {
|
|
e.preventDefault();
|
|
|
|
// Get page and site information
|
|
let page = this.closest('.navpage_item').dataset.page;
|
|
let site = this.closest('.navsite_item').dataset.site;
|
|
|
|
if (site && page) {
|
|
navigateTo(site, page);
|
|
}
|
|
|
|
// You can use this information to update the URL or perform other actions
|
|
});
|
|
});
|
|
}
|
|
document.addEventListener('DOMContentLoaded', initAjax);
|