stylehub/assets/script.js
2024-02-05 22:02:16 +01:00

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 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);