Wallos v0.9
This commit is contained in:
ellite
@@ -0,0 +1,86 @@
|
||||
let isDropdownOpen = false;
|
||||
|
||||
function toggleDropdown() {
|
||||
const dropdown = document.querySelector('.dropdown');
|
||||
dropdown.classList.toggle('is-open');
|
||||
isDropdownOpen = !isDropdownOpen;
|
||||
}
|
||||
|
||||
function showErrorMessage(message) {
|
||||
const toast = document.querySelector(".toast#errorToast");
|
||||
(closeIcon = document.querySelector(".close-error")),
|
||||
(errorMessage = document.querySelector(".errorMessage")),
|
||||
(progress = document.querySelector(".progress.error"));
|
||||
let timer1, timer2;
|
||||
errorMessage.textContent = message;
|
||||
toast.classList.add("active");
|
||||
progress.classList.add("active");
|
||||
timer1 = setTimeout(() => {
|
||||
toast.classList.remove("active");
|
||||
closeIcon.removeEventListener("click", () => {});
|
||||
}, 5000);
|
||||
|
||||
timer2 = setTimeout(() => {
|
||||
progress.classList.remove("active");
|
||||
}, 5300);
|
||||
|
||||
closeIcon.addEventListener("click", () => {
|
||||
toast.classList.remove("active");
|
||||
|
||||
setTimeout(() => {
|
||||
progress.classList.remove("active");
|
||||
}, 300);
|
||||
|
||||
clearTimeout(timer1);
|
||||
clearTimeout(timer2);
|
||||
closeIcon.removeEventListener("click", () => {});
|
||||
});
|
||||
}
|
||||
|
||||
function showSuccessMessage(message) {
|
||||
const toast = document.querySelector(".toast#successToast");
|
||||
(closeIcon = document.querySelector(".close-success")),
|
||||
(successMessage = document.querySelector(".successMessage")),
|
||||
(progress = document.querySelector(".progress.success"));
|
||||
let timer1, timer2;
|
||||
successMessage.textContent = message;
|
||||
toast.classList.add("active");
|
||||
progress.classList.add("active");
|
||||
timer1 = setTimeout(() => {
|
||||
toast.classList.remove("active");
|
||||
closeIcon.removeEventListener("click", () => {});
|
||||
}, 5000);
|
||||
|
||||
timer2 = setTimeout(() => {
|
||||
progress.classList.remove("active");
|
||||
}, 5300);
|
||||
|
||||
closeIcon.addEventListener("click", () => {
|
||||
toast.classList.remove("active");
|
||||
|
||||
setTimeout(() => {
|
||||
progress.classList.remove("active");
|
||||
}, 300);
|
||||
|
||||
clearTimeout(timer1);
|
||||
clearTimeout(timer2);
|
||||
closeIcon.removeEventListener("click", () => {});
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
document.addEventListener('mousedown', function(event) {
|
||||
var dropdown = document.querySelector('.dropdown');
|
||||
var dropdownContent = document.querySelector('.dropdown-content');
|
||||
|
||||
if (!dropdown.contains(event.target) && isDropdownOpen) {
|
||||
dropdown.classList.remove('is-open');
|
||||
isDropdownOpen = false;
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector('.dropdown-content').addEventListener('focus', function() {
|
||||
isDropdownOpen = true;
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,296 @@
|
||||
let isSortOptionsOpen = false;
|
||||
|
||||
function toggleSortOptions() {
|
||||
const sortOptions = document.querySelector("#sort-options");
|
||||
sortOptions.classList.toggle("is-open");
|
||||
isSortOptionsOpen = !isSortOptionsOpen;
|
||||
}
|
||||
|
||||
function resetForm() {
|
||||
const id = document.querySelector("#id");
|
||||
id.value = "";
|
||||
const formTitle = document.querySelector("#form-title");
|
||||
formTitle.textContent = "Add subscription";
|
||||
const logo = document.querySelector("#form-logo");
|
||||
logo.src = "";
|
||||
logo.style = 'display: none';
|
||||
const logoSearchButton = document.querySelector("#logo-search-button");
|
||||
logoSearchButton.classList.add("disabled");
|
||||
const submitButton = document.querySelector("#save-button");
|
||||
submitButton.disabled = false;
|
||||
const form = document.querySelector("#subs-form");
|
||||
form.reset();
|
||||
closeLogoSearch();
|
||||
const deleteButton = document.querySelector("#deletesub");
|
||||
deleteButton.style = 'display: none';
|
||||
deleteButton.removeAttribute("onClick");
|
||||
}
|
||||
|
||||
function fillEditFormFields(subscription) {
|
||||
const formTitle = document.querySelector("#form-title");
|
||||
formTitle.textContent = "Edit subscription";
|
||||
const logo = document.querySelector("#form-logo");
|
||||
const defaultLogo = window.theme && window.theme == "light" ? "images/wallos.png" : "images/walloswhite.png";
|
||||
const logoFile = subscription.logo !== null ? "images/uploads/logos/" + subscription.logo : defaultLogo;
|
||||
logo.src = logoFile;
|
||||
logo.style = 'display: block';
|
||||
const logoSearchButton = document.querySelector("#logo-search-button");
|
||||
logoSearchButton.classList.remove("disabled");
|
||||
const id = document.querySelector("#id");
|
||||
id.value = subscription.id;
|
||||
const name = document.querySelector("#name");
|
||||
name.value = subscription.name;
|
||||
const price = document.querySelector("#price");
|
||||
price.value = subscription.price;
|
||||
|
||||
const currencySelect = document.querySelector("#currency");
|
||||
currencySelect.value = subscription.currency_id.toString();
|
||||
const frequencySelect = document.querySelector("#frequency");
|
||||
frequencySelect.value = subscription.frequency;
|
||||
const cycleSelect = document.querySelector("#cycle");
|
||||
cycleSelect.value = subscription.cycle;
|
||||
const paymentSelect = document.querySelector("#payment_method");
|
||||
paymentSelect.value = subscription.payment_method_id;
|
||||
const categorySelect = document.querySelector("#category");
|
||||
categorySelect.value = subscription.category_id;
|
||||
const payerSelect = document.querySelector("#payer_user");
|
||||
payerSelect.value = subscription.payer_user_id;
|
||||
|
||||
const nextPament = document.querySelector("#next_payment");
|
||||
nextPament.value = subscription.next_payment;
|
||||
const notes = document.querySelector("#notes");
|
||||
notes.value = subscription.notes;
|
||||
|
||||
const deleteButton = document.querySelector("#deletesub");
|
||||
deleteButton.style = 'display: block';
|
||||
deleteButton.setAttribute("onClick", `deleteSubscription(${subscription.id})`);
|
||||
|
||||
const modal = document.getElementById('subscription-form');
|
||||
modal.classList.add("is-open");
|
||||
}
|
||||
|
||||
function openEditSubscription(id) {
|
||||
const url = `endpoints/subscription/get.php?id=${id}`;
|
||||
fetch(url)
|
||||
.then((response) => {
|
||||
if (response.ok) {
|
||||
return response.json();
|
||||
} else {
|
||||
showErrorMessage("Failed to load subscription");
|
||||
}
|
||||
})
|
||||
.then((data) => {
|
||||
if (data.error || data === "Error") {
|
||||
showErrorMessage("Failed to load subscription");
|
||||
} else {
|
||||
const subscription = data;
|
||||
fillEditFormFields(subscription);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
showErrorMessage("Failed to load subscription");
|
||||
});
|
||||
}
|
||||
|
||||
function addSubscription() {
|
||||
resetForm();
|
||||
const modal = document.getElementById('subscription-form');
|
||||
modal.classList.add("is-open");
|
||||
}
|
||||
|
||||
function closeAddSubscription() {
|
||||
const modal = document.getElementById('subscription-form');
|
||||
modal.classList.remove("is-open");
|
||||
resetForm();
|
||||
}
|
||||
|
||||
function handleFileSelect(event) {
|
||||
const fileInput = event.target;
|
||||
const logoPreview = document.querySelector('.logo-preview');
|
||||
const logoImg = logoPreview.querySelector('img');
|
||||
const logoUrl = document.querySelector("#logo-url");
|
||||
logoUrl.value = "";
|
||||
|
||||
if (fileInput.files && fileInput.files[0]) {
|
||||
const reader = new FileReader();
|
||||
|
||||
reader.onload = function (e) {
|
||||
logoImg.src = e.target.result;
|
||||
logoImg.style.display = 'block';
|
||||
};
|
||||
|
||||
reader.readAsDataURL(fileInput.files[0]);
|
||||
}
|
||||
}
|
||||
|
||||
function deleteSubscription(id) {
|
||||
if (confirm("Are you sure you want to delete this subscription?")) {
|
||||
fetch(`endpoints/subscription/delete.php?id=${id}`, {
|
||||
method: 'DELETE',
|
||||
})
|
||||
.then(response => {
|
||||
if (response.ok) {
|
||||
showSuccessMessage("Subscription deleted");
|
||||
fetchSubscriptions();
|
||||
closeAddSubscription();
|
||||
} else {
|
||||
alert("Error deleting the subscription");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error:', error);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function setSearchButtonStatus() {
|
||||
|
||||
const nameInput = document.querySelector("#name");
|
||||
const hasSearchTerm = nameInput.value.trim().length > 0;
|
||||
const logoSearchButton = document.querySelector("#logo-search-button");
|
||||
if (hasSearchTerm) {
|
||||
logoSearchButton.classList.remove("disabled");
|
||||
} else {
|
||||
logoSearchButton.classList.add("disabled");
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function searchLogo() {
|
||||
const nameInput = document.querySelector("#name");
|
||||
const searchTerm = nameInput.value.trim();
|
||||
if (searchTerm !== "") {
|
||||
const logoSearchPopup = document.querySelector("#logo-search-results");
|
||||
logoSearchPopup.classList.add("is-open");
|
||||
const imageSearchUrl = `endpoints/logos/search.php?search=${searchTerm}`;
|
||||
fetch(imageSearchUrl)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.imageUrls) {
|
||||
displayImageResults(data.imageUrls);
|
||||
} else if (data.error) {
|
||||
console.error(data.error);
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error("Error fetching image results:", error);
|
||||
});
|
||||
} else {
|
||||
nameInput.focus();
|
||||
}
|
||||
}
|
||||
|
||||
function displayImageResults(imageSources) {
|
||||
const logoResults = document.querySelector("#logo-search-images");
|
||||
logoResults.innerHTML = "";
|
||||
|
||||
imageSources.forEach(src => {
|
||||
const img = document.createElement("img");
|
||||
img.src = src;
|
||||
img.onclick = function() {
|
||||
selectWebLogo(src);
|
||||
};
|
||||
logoResults.appendChild(img);
|
||||
});
|
||||
}
|
||||
|
||||
function selectWebLogo(url) {
|
||||
closeLogoSearch();
|
||||
const logoPreview = document.querySelector("#form-logo");
|
||||
const logoUrl = document.querySelector("#logo-url");
|
||||
logoPreview.src = url;
|
||||
logoPreview.style.display = 'block';
|
||||
logoUrl.value = url;
|
||||
}
|
||||
|
||||
function closeLogoSearch() {
|
||||
const logoSearchPopup = document.querySelector("#logo-search-results");
|
||||
logoSearchPopup.classList.remove("is-open");
|
||||
const logoResults = document.querySelector("#logo-search-images");
|
||||
logoResults.innerHTML = "";
|
||||
}
|
||||
|
||||
function fetchSubscriptions() {
|
||||
const subscriptionsContainer = document.querySelector("#subscriptions");
|
||||
const getSubscriptions = "endpoints/subscriptions/get.php";
|
||||
|
||||
fetch(getSubscriptions)
|
||||
.then(response => response.text())
|
||||
.then(data => {
|
||||
if (data) {
|
||||
subscriptionsContainer.innerHTML = data;
|
||||
const mainActions = document.querySelector("#main-actions");
|
||||
if (data.includes("empty-page")) {
|
||||
mainActions.classList.add("hidden");
|
||||
} else {
|
||||
mainActions.classList.remove("hidden");
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error("Error reloading subscriptions:", error);
|
||||
});
|
||||
}
|
||||
|
||||
function setSortOption(sortOption) {
|
||||
const sortOptionsContainer = document.querySelector("#sort-options");
|
||||
const sortOptionsList = sortOptionsContainer.querySelectorAll("li");
|
||||
sortOptionsList.forEach((option) => {
|
||||
if (option.getAttribute("id") === "sort-" + sortOption) {
|
||||
option.classList.add("selected");
|
||||
} else {
|
||||
option.classList.remove("selected");
|
||||
}
|
||||
});
|
||||
const daysToExpire = 30;
|
||||
const expirationDate = new Date();
|
||||
expirationDate.setDate(expirationDate.getDate() + daysToExpire);
|
||||
const cookieValue = encodeURIComponent(sortOption) + '; expires=' + expirationDate.toUTCString() + '; path=/';
|
||||
document.cookie = 'sortOrder=' + cookieValue;
|
||||
fetchSubscriptions();
|
||||
toggleSortOptions();
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const subscriptionForm = document.querySelector("#subs-form");
|
||||
const submitButton = document.querySelector("#save-button");
|
||||
const endpoint = "endpoints/subscription/add.php";
|
||||
|
||||
subscriptionForm.addEventListener("submit", function (e) {
|
||||
e.preventDefault();
|
||||
|
||||
submitButton.disabled = true;
|
||||
const formData = new FormData(subscriptionForm);
|
||||
|
||||
fetch(endpoint, {
|
||||
method: "POST",
|
||||
body: formData,
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
if (data.status === "Success") {
|
||||
showSuccessMessage(data.message);
|
||||
fetchSubscriptions();
|
||||
closeAddSubscription();
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
showErrorMessage(error);
|
||||
submitButton.disabled = false;
|
||||
});
|
||||
});
|
||||
|
||||
document.addEventListener('mousedown', function(event) {
|
||||
const sortOptions = document.querySelector('#sort-options');
|
||||
const sortButton = document.querySelector("#sort-button");
|
||||
|
||||
if (!sortOptions.contains(event.target) && !sortButton.contains(event.target) && isSortOptionsOpen) {
|
||||
sortOptions.classList.remove('is-open');
|
||||
isSortOptionsOpen = false;
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector('#sort-options').addEventListener('focus', function() {
|
||||
isSortOptionsOpen = true;
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,501 @@
|
||||
function toggleAvatarSelect() {
|
||||
var avatarSelect = document.getElementById("avatarSelect");
|
||||
if (avatarSelect.classList.contains("is-open")) {
|
||||
avatarSelect.classList.remove("is-open");
|
||||
} else {
|
||||
avatarSelect.classList.add("is-open");
|
||||
}
|
||||
}
|
||||
|
||||
function closeAvatarSelect() {
|
||||
var avatarSelect = document.getElementById("avatarSelect");
|
||||
avatarSelect.classList.remove("is-open");
|
||||
}
|
||||
|
||||
function changeAvatar(number) {
|
||||
document.getElementById("avatarImg").src = "/images/avatars/" + number + ".svg";
|
||||
document.getElementById("avatarUser").value = number;
|
||||
closeAvatarSelect();
|
||||
}
|
||||
|
||||
function addMemberButton(memberId) {
|
||||
document.getElementById("addMember").disabled = true;
|
||||
const url = 'endpoints/household/household.php?action=add';
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok');
|
||||
showErrorMessage("Failed to add member");
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(responseData => {
|
||||
if(responseData.success) {
|
||||
const newMemberId = responseData.householdId;;
|
||||
let container = document.getElementById("householdMembers");
|
||||
let div = document.createElement("div");
|
||||
div.className = "form-group-inline";
|
||||
div.dataset.memberid = newMemberId;
|
||||
|
||||
let input = document.createElement("input");
|
||||
input.type = "text";
|
||||
input.placeholder = "Member";
|
||||
input.name = "member";
|
||||
input.value = "Member";
|
||||
|
||||
let editLink = document.createElement("button");
|
||||
editLink.className = "image-button medium"
|
||||
editLink.name = "save";
|
||||
editLink.onclick = function() {
|
||||
editMember(newMemberId);
|
||||
};
|
||||
|
||||
let editImage = document.createElement("img");
|
||||
editImage.src = "images/siteicons/save.png";
|
||||
editImage.title = "Save Member";
|
||||
|
||||
editLink.appendChild(editImage);
|
||||
|
||||
let deleteLink = document.createElement("button");
|
||||
deleteLink.className = "image-button medium"
|
||||
deleteLink.name = "delete";
|
||||
deleteLink.onclick = function() {
|
||||
removeMember(newMemberId);
|
||||
};
|
||||
|
||||
let deleteImage = document.createElement("img");
|
||||
deleteImage.src = "images/siteicons/delete.png";
|
||||
deleteImage.title = "Delete Member";
|
||||
|
||||
deleteLink.appendChild(deleteImage);
|
||||
|
||||
div.appendChild(input);
|
||||
div.appendChild(editLink);
|
||||
div.appendChild(deleteLink);
|
||||
|
||||
container.appendChild(div);
|
||||
} else {
|
||||
showErrorMessage(responseData.errorMessage);
|
||||
}
|
||||
document.getElementById("addMember").disabled = false;
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage("Failed to add member");
|
||||
document.getElementById("addMember").disabled = false;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function removeMember(memberId) {
|
||||
let url = `endpoints/household/household.php?action=delete&memberId=${memberId}`;
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok');
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(responseData => {
|
||||
if (responseData.success) {
|
||||
let divToRemove = document.querySelector(`[data-memberid="${memberId}"]`);
|
||||
if (divToRemove) {
|
||||
divToRemove.parentNode.removeChild(divToRemove);
|
||||
}
|
||||
showSuccessMessage("Member removed");
|
||||
} else {
|
||||
showErrorMessage(responseData.errorMessage || "Failed to remove member");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage("Failed to remove member");
|
||||
});
|
||||
}
|
||||
|
||||
function editMember(memberId) {
|
||||
var saveButton = document.querySelector(`div[data-memberid="${memberId}"] button[name="save"]`);
|
||||
var inputElement = document.querySelector(`div[data-memberid="${memberId}"] input[name="member"]`);
|
||||
saveButton.classList.add("disabled");
|
||||
saveButton.disabled = true;
|
||||
if (inputElement) {
|
||||
var memberName = encodeURIComponent(inputElement.value);
|
||||
var url = `endpoints/household/household.php?action=edit&memberId=${memberId}&name=${memberName}`;
|
||||
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
saveButton.classList.remove("disabled");
|
||||
if (!response.ok) {
|
||||
showErrorMessage("Failed to save member");
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(responseData => {
|
||||
if (responseData.success) {
|
||||
showSuccessMessage("Member saved");
|
||||
} else {
|
||||
showErrorMessage(responseData.errorMessage || "Failed to save member");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage("Failed to save member");
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function addCategoryButton(categoryId) {
|
||||
document.getElementById("addCategory").disabled = true;
|
||||
const url = 'endpoints/categories/category.php?action=add';
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok');
|
||||
showErrorMessage("Failed to add category");
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(responseData => {
|
||||
if(responseData.success) {
|
||||
const newCategoryId = responseData.categoryId;;
|
||||
let container = document.getElementById("categories");
|
||||
let div = document.createElement("div");
|
||||
div.className = "form-group-inline";
|
||||
div.dataset.categoryid = newCategoryId;
|
||||
|
||||
let input = document.createElement("input");
|
||||
input.type = "text";
|
||||
input.placeholder = "Category";
|
||||
input.name = "category";
|
||||
input.value = "Category";
|
||||
|
||||
let editLink = document.createElement("button");
|
||||
editLink.className = "image-button medium"
|
||||
editLink.name = "save";
|
||||
editLink.onclick = function() {
|
||||
editCategory(newCategoryId);
|
||||
};
|
||||
|
||||
let editImage = document.createElement("img");
|
||||
editImage.src = "images/siteicons/save.png";
|
||||
editImage.title = "Save Category";
|
||||
|
||||
editLink.appendChild(editImage);
|
||||
|
||||
let deleteLink = document.createElement("button");
|
||||
deleteLink.className = "image-button medium"
|
||||
deleteLink.name = "delete";
|
||||
deleteLink.onclick = function() {
|
||||
removeCategory(newCategoryId);
|
||||
};
|
||||
|
||||
let deleteImage = document.createElement("img");
|
||||
deleteImage.src = "images/siteicons/delete.png";
|
||||
deleteImage.title = "Delete Category";
|
||||
|
||||
deleteLink.appendChild(deleteImage);
|
||||
|
||||
div.appendChild(input);
|
||||
div.appendChild(editLink);
|
||||
div.appendChild(deleteLink);
|
||||
|
||||
container.appendChild(div);
|
||||
} else {
|
||||
showErrorMessage(responseData.errorMessage);
|
||||
}
|
||||
document.getElementById("addCategory").disabled = false;
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage("Failed to add category");
|
||||
document.getElementById("addCategory").disabled = false;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function removeCategory(categoryId) {
|
||||
let url = `endpoints/categories/category.php?action=delete&categoryId=${categoryId}`;
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok');
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(responseData => {
|
||||
if (responseData.success) {
|
||||
let divToRemove = document.querySelector(`[data-categoryid="${categoryId}"]`);
|
||||
if (divToRemove) {
|
||||
divToRemove.parentNode.removeChild(divToRemove);
|
||||
}
|
||||
showSuccessMessage("Category removed");
|
||||
} else {
|
||||
showErrorMessage(responseData.errorMessage || "Failed to remove category");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage("Failed to remove category");
|
||||
});
|
||||
}
|
||||
|
||||
function editCategory(categoryId) {
|
||||
var saveButton = document.querySelector(`div[data-categoryid="${categoryId}"] button[name="save"]`);
|
||||
var inputElement = document.querySelector(`div[data-categoryid="${categoryId}"] input[name="category"]`);
|
||||
saveButton.classList.add("disabled");
|
||||
saveButton.disabled = true;
|
||||
if (inputElement) {
|
||||
var categoryName = encodeURIComponent(inputElement.value);
|
||||
var url = `endpoints/categories/category.php?action=edit&categoryId=${categoryId}&name=${categoryName}`;
|
||||
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
saveButton.classList.remove("disabled");
|
||||
if (!response.ok) {
|
||||
showErrorMessage("Failed to save category");
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(responseData => {
|
||||
if (responseData.success) {
|
||||
showSuccessMessage("Category saved");
|
||||
} else {
|
||||
showErrorMessage(responseData.errorMessage || "Failed to save category");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage("Failed to save category");
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function addCurrencyButton(currencyId) {
|
||||
document.getElementById("addCurrency").disabled = true;
|
||||
const url = 'endpoints/currency/currency.php?action=add';
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok');
|
||||
showErrorMessage(response.text());
|
||||
}
|
||||
return response.text();
|
||||
})
|
||||
.then(responseText => {
|
||||
if(responseText !== "Error") {
|
||||
const newCurrencyId = responseText;
|
||||
let container = document.getElementById("currencies");
|
||||
let div = document.createElement("div");
|
||||
div.className = "form-group-inline";
|
||||
div.dataset.currencyid = newCurrencyId;
|
||||
|
||||
let inputSymbol = document.createElement("input");
|
||||
inputSymbol.type = "text";
|
||||
inputSymbol.placeholder = "$";
|
||||
inputSymbol.name = "symbol";
|
||||
inputSymbol.value = "$";
|
||||
inputSymbol.classList.add("short");
|
||||
|
||||
let inputName = document.createElement("input");
|
||||
inputName.type = "text";
|
||||
inputName.placeholder = "Currency";
|
||||
inputName.name = "currency";
|
||||
inputName.value = "Currency";
|
||||
|
||||
let inputCode = document.createElement("input");
|
||||
inputCode.type = "text";
|
||||
inputCode.placeholder = "Currency Code";
|
||||
inputCode.name = "code";
|
||||
inputCode.value = "CODE";
|
||||
|
||||
let editLink = document.createElement("button");
|
||||
editLink.className = "image-button medium"
|
||||
editLink.name = "save";
|
||||
editLink.onclick = function() {
|
||||
editCurrency(newCurrencyId);
|
||||
};
|
||||
|
||||
let editImage = document.createElement("img");
|
||||
editImage.src = "images/siteicons/save.png";
|
||||
editImage.title = "Save Currency";
|
||||
|
||||
editLink.appendChild(editImage);
|
||||
|
||||
let deleteLink = document.createElement("button");
|
||||
deleteLink.className = "image-button medium"
|
||||
deleteLink.name = "delete";
|
||||
deleteLink.onclick = function() {
|
||||
removeCurrency(newCurrencyId);
|
||||
};
|
||||
|
||||
let deleteImage = document.createElement("img");
|
||||
deleteImage.src = "images/siteicons/delete.png";
|
||||
deleteImage.title = "Delete Currency";
|
||||
|
||||
deleteLink.appendChild(deleteImage);
|
||||
|
||||
div.appendChild(inputSymbol);
|
||||
div.appendChild(inputName);
|
||||
div.appendChild(inputCode);
|
||||
div.appendChild(editLink);
|
||||
div.appendChild(deleteLink);
|
||||
|
||||
container.appendChild(div);
|
||||
} else {
|
||||
// TODO: Show error
|
||||
}
|
||||
document.getElementById("addCurrency").disabled = false;
|
||||
})
|
||||
.catch(error => {
|
||||
// TODO: Show error
|
||||
document.getElementById("addCurrency").disabled = false;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
function removeCurrency(currencyId) {
|
||||
let url = `endpoints/currency/currency.php?action=delete¤cyId=${currencyId}`;
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error("There was an error removing the currency");
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
showSuccessMessage("Currency removed");
|
||||
let divToRemove = document.querySelector(`[data-currencyid="${currencyId}"]`);
|
||||
if (divToRemove) {
|
||||
divToRemove.parentNode.removeChild(divToRemove);
|
||||
}
|
||||
} else {
|
||||
showErrorMessage(data.message || "Failed to remove currency");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage(error.message || "There was an error removing the currency");
|
||||
});
|
||||
}
|
||||
|
||||
function editCurrency(currencyId) {
|
||||
var saveButton = document.querySelector(`div[data-currencyid="${currencyId}"] button[name="save"]`);
|
||||
var inputSymbolElement = document.querySelector(`div[data-currencyid="${currencyId}"] input[name="symbol"]`);
|
||||
var inputNameElement = document.querySelector(`div[data-currencyid="${currencyId}"] input[name="currency"]`);
|
||||
var inputCodeElement = document.querySelector(`div[data-currencyid="${currencyId}"] input[name="code"]`);
|
||||
saveButton.classList.add("disabled");
|
||||
saveButton.disabled = true;
|
||||
if (inputNameElement) {
|
||||
var currencyName = encodeURIComponent(inputNameElement.value);
|
||||
var currencySymbol = encodeURIComponent(inputSymbolElement.value);
|
||||
var currencyCode = encodeURIComponent(inputCodeElement.value);
|
||||
var url = `endpoints/currency/currency.php?action=edit¤cyId=${currencyId}&name=${currencyName}&symbol=${currencySymbol}&code=${currencyCode}`;
|
||||
|
||||
fetch(url)
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error("There was an error saving the currency");
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
saveButton.classList.remove("disabled");
|
||||
saveButton.disabled = false;
|
||||
showSuccessMessage(currencyName + " was saved");
|
||||
} else {
|
||||
saveButton.classList.remove("disabled");
|
||||
saveButton.disabled = false;
|
||||
showErrorMessage(data.message || "Failed to save currency");
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
saveButton.classList.remove("disabled");
|
||||
saveButton.disabled = false;
|
||||
showErrorMessage(error.message || "There was an error saving the currency");
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
document.getElementById("userForm").addEventListener("submit", function(event) {
|
||||
event.preventDefault();
|
||||
document.getElementById("userSubmit").disabled = true;
|
||||
const formData = new FormData(event.target);
|
||||
fetch("endpoints/user/save_user.php", {
|
||||
method: "POST",
|
||||
body: formData
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
var newAvatar = document.getElementById("avatarUser").value;
|
||||
document.getElementById("avatar").src = "/images/avatars/" + newAvatar + ".svg";
|
||||
var newUsername = document.getElementById("username").value;
|
||||
document.getElementById("user").textContent = newUsername;
|
||||
showSuccessMessage("User details saved");
|
||||
} else {
|
||||
showErrorMessage(data.errorMessage);
|
||||
}
|
||||
document.getElementById("userSubmit").disabled = false;
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage("Unknown error, please try again");
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
function addFixerKeyButton() {
|
||||
document.getElementById("addFixerKey").disabled = true;
|
||||
const apiKeyInput = document.querySelector("#fixerKey");
|
||||
apiKey = apiKeyInput.value.trim();
|
||||
fetch("endpoints/currency/fixer_api_key.php", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/x-www-form-urlencoded",
|
||||
},
|
||||
body: `api_key=${encodeURIComponent(apiKey)}`,
|
||||
})
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.success) {
|
||||
showSuccessMessage("API key saved successfully");
|
||||
document.getElementById("addFixerKey").disabled = false;
|
||||
} else {
|
||||
showErrorMessage(data.message);
|
||||
document.getElementById("addFixerKey").disabled = false;
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
showErrorMessage(error);
|
||||
document.getElementById("addFixerKey").disabled = false;
|
||||
});
|
||||
}
|
||||
|
||||
function switchTheme() {
|
||||
const darkThemeCss = document.querySelector("#dark-theme");
|
||||
darkThemeCss.disabled = !darkThemeCss.disabled;
|
||||
|
||||
const themeChoice = darkThemeCss.disabled ? 'light' : 'dark';
|
||||
document.cookie = `theme=${themeChoice}; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/`;
|
||||
}
|
||||
|
||||
function setHideNameOnMobileCookie() {
|
||||
const hideNameCheckbox = document.querySelector("#hidename");
|
||||
const value = hideNameCheckbox.checked;
|
||||
document.cookie = `hideNameOnMobile=${value}; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/`;
|
||||
}
|
||||
|
||||
function setShowMonthlyPriceCookie() {
|
||||
const showMonthlyPriceCheckbox = document.querySelector("#monthlyprice");
|
||||
const value = showMonthlyPriceCheckbox.checked;
|
||||
document.cookie = `showMonthlyPrice=${value}; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/`;
|
||||
}
|
||||
|
||||
function setConvertCurrencyCookie() {
|
||||
const convertCurrencyCheckbox = document.querySelector("#convertcurrency");
|
||||
const value = convertCurrencyCheckbox.checked;
|
||||
document.cookie = `convertCurrency=${value}; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/`;
|
||||
}
|
||||
|
||||
function setRemoveBackgroundCookie() {
|
||||
const removeBackgroundCheckbox = document.querySelector("#removebackground");
|
||||
const value = removeBackgroundCheckbox.checked;
|
||||
document.cookie = `removeBackground=${value}; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/`;
|
||||
}
|
||||
Reference in New Issue
Block a user