You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
137 lines
5.7 KiB
JavaScript
137 lines
5.7 KiB
JavaScript
function initializeModalButtons() {
|
|
// OPEN THE MODAL WITH DIMENSIONS
|
|
function openModalWithDimensions(url, width, height) {
|
|
const iframe = document.getElementById("popupModalFrame");
|
|
openModal(url);
|
|
iframe.style.height = height;
|
|
iframe.style.width = width;
|
|
}
|
|
|
|
// OPEN MODAL
|
|
function openModal(url) {
|
|
const modalContainer = document.getElementById("popUpModal");
|
|
const iframe = document.getElementById("popupModalFrame");
|
|
const body = document.body;
|
|
const loader = document.getElementById("modalLoader");
|
|
|
|
body.style.overflow = "hidden";
|
|
loader.style.display = "flex"; // Show loader
|
|
iframe.src = url;
|
|
modalContainer.style.display = "flex";
|
|
|
|
// Hide loader when iframe content has fully loaded
|
|
iframe.onload = () => {
|
|
loader.style.display = "none"; // Hide loader
|
|
};
|
|
}
|
|
|
|
// CLOSE MODAL
|
|
function closeModal() {
|
|
const modalContainer = document.getElementById("popUpModal");
|
|
const iframe = document.getElementById("popupModalFrame");
|
|
const body = document.body;
|
|
const loader = document.getElementById("modalLoader");
|
|
|
|
iframe.src = "";
|
|
body.style.overflow = "auto";
|
|
modalContainer.style.display = "none";
|
|
loader.style.display = "none"; // Ensure loader is hidden
|
|
}
|
|
|
|
// Function to add a click listener to buttons by class name
|
|
function addButtonClickListener(className, width, height) {
|
|
const buttons = document.querySelectorAll(`.${className}`);
|
|
buttons.forEach(button => {
|
|
button.addEventListener("click", () => {
|
|
const modalUrl = button.getAttribute("data-modal-url");
|
|
openModalWithDimensions(modalUrl, width, height);
|
|
});
|
|
});
|
|
}
|
|
|
|
|
|
addButtonClickListener("addStatusButton", "450px", "200px");
|
|
addButtonClickListener("addNoteButton", "400px", "225px");
|
|
addButtonClickListener("addProjectNoteButton", "400px", "225px");
|
|
addButtonClickListener("updateStatusButton", "fit-content", "160px");
|
|
addButtonClickListener("showPointsButton", "600px", "450px");
|
|
addButtonClickListener("addPointButton", "500px", "170px");
|
|
addButtonClickListener("timelineButton", "600px", "450px");
|
|
addButtonClickListener("addTimeButton", "300px", "270px");
|
|
addButtonClickListener("deleteTaskButton", "fit-content", "130px");
|
|
addButtonClickListener("addFileButton", "500px", "320px");
|
|
addButtonClickListener("addCredentialsButton", "500px", "300px");
|
|
addButtonClickListener("addDepartmentButton", "fit-content", "160px");
|
|
addButtonClickListener("addProjectTypeButton", "fit-content", "260px");
|
|
addButtonClickListener("addBusinessTypeButton", "fit-content", "160px");
|
|
addButtonClickListener("addReferenceButton", "fit-content", "230px");
|
|
addButtonClickListener("addTagButton", "fit-content", "160px");
|
|
addButtonClickListener("addBusinessButton", "550px", "500px");
|
|
addButtonClickListener("addStaffPositionButton", "fit-content", "260px");
|
|
addButtonClickListener("addStatusButtonMobile", "500px", "80px");
|
|
addButtonClickListener("userRecentActivitiesButton", "400px", "600px");
|
|
addButtonClickListener("addUserStoryButton", "400px", "330px");
|
|
addButtonClickListener("reactionDetailsButton", "400px", "300px");
|
|
|
|
addButtonClickListener("addPaymentCommentButton", "500px", "250px");
|
|
addButtonClickListener("addPaymentButton", "500px", "600px");
|
|
addButtonClickListener("editPaymentButton", "500px", "400px");
|
|
|
|
addButtonClickListener("addPaymentMethodButton", "500px", "400px");
|
|
addButtonClickListener("updateOrderStatusButton", "400px", "240px");
|
|
addButtonClickListener("editProjectStatusButton", "400px", "220px");
|
|
addButtonClickListener("editCustomerStatusButton", "400px", "160px");
|
|
addButtonClickListener("addProjectMemberModal", "400px", "280px");
|
|
|
|
addButtonClickListener("updateTicketStatusButton", "400px", "220px");
|
|
addButtonClickListener("closeTicketButton", "400px", "140px");
|
|
|
|
|
|
|
|
// DELETE BUTTONS
|
|
addButtonClickListener("deleteCustomerButton", "400px", "140px");
|
|
addButtonClickListener("deleteBusinessButton", "400px", "140px");
|
|
addButtonClickListener("deleteStaffButton", "400px", "140px");
|
|
addButtonClickListener("deleteProjectButton", "400px", "140px");
|
|
addButtonClickListener("deleteTaskButton", "400px", "140px");
|
|
addButtonClickListener("deleteNoteButton", "400px", "140px");
|
|
addButtonClickListener("deleteProjectNoteButton", "400px", "140px");
|
|
addButtonClickListener("deletePointButton", "400px", "140px");
|
|
addButtonClickListener("deleteTicketButton", "400px", "140px");
|
|
addButtonClickListener("deletePaymentButton", "400px", "140px");
|
|
addButtonClickListener("deletePaymentMethodButton", "400px", "140px");
|
|
addButtonClickListener("delete", "400px", "140px");
|
|
|
|
|
|
|
|
// KNOWLEDGE BASE
|
|
addButtonClickListener("projectKnowledgeButton", "400px", "230px");
|
|
|
|
addButtonClickListener("deleteButton", "400px", "140px");
|
|
|
|
addButtonClickListener("xssmallPopupButton", "400px", "170px");
|
|
addButtonClickListener("xsmallPopupButton", "400px", "220px");
|
|
addButtonClickListener("smallPopupButton", "400px", "320px");
|
|
addButtonClickListener("mediumPopupButton", "400px", "420px");
|
|
addButtonClickListener("largePopupButton", "400px", "520px");
|
|
|
|
|
|
|
|
const closeButton = document.getElementById("closeModalButton");
|
|
closeButton.addEventListener("click", () => {
|
|
closeModal();
|
|
});
|
|
|
|
const modalContainer = document.getElementById("popUpModal");
|
|
window.addEventListener("click", function (event) {
|
|
if (event.target === modalContainer) {
|
|
closeModal();
|
|
}
|
|
});
|
|
}
|
|
|
|
|
|
initializeModalButtons();
|
|
export { initializeModalButtons };
|
|
|