(function setupCampaignStyleLoadingScreen() { if (typeof window === "undefined") { return; } var LOADING_ID = "loadingScreen"; var HIDE_DELAY_MS = 150; var loadingScreen = document.getElementById(LOADING_ID); if (!loadingScreen) { return; } var isHidden = false; if (typeof window.tailwindLoaded !== "boolean") { window.tailwindLoaded = false; } if (typeof window.appInitialized !== "boolean") { window.appInitialized = false; } console.log("[Momentus loader] setupCampaignStyleLoadingScreen initialized", { timestamp: Date.now(), tailwindLoaded: window.tailwindLoaded, appInitialized: window.appInitialized }); function hideLoadingScreen(trigger) { if (isHidden) { return; } isHidden = true; console.log("[Momentus loader] hideLoadingScreen invoked", { trigger: trigger || "direct", timestamp: Date.now() }); loadingScreen.setAttribute("data-hidden", "true"); loadingScreen.setAttribute("aria-hidden", "true"); loadingScreen.setAttribute("aria-busy", "false"); loadingScreen.classList.add("loading-screen--hidden"); loadingScreen.style.opacity = "0"; loadingScreen.style.transform = "scale(1.05)"; setTimeout(function () { loadingScreen.style.setProperty("display", "none", "important"); if (document.body) { document.body.classList.add("app-ready"); document.body.classList.add("momentus-app-ready"); } }, 700); } function checkAndHideLoadingScreen(source) { console.log("[Momentus loader] checkAndHideLoadingScreen", { source: source || "unspecified", tailwindLoaded: window.tailwindLoaded, appInitialized: window.appInitialized, timestamp: Date.now() }); if (!window.tailwindLoaded || !window.appInitialized) { return; } setTimeout(function () { hideLoadingScreen(source || "checkAndHideLoadingScreen"); }, HIDE_DELAY_MS); } window.hideLoadingScreen = hideLoadingScreen; window.checkAndHideLoadingScreen = checkAndHideLoadingScreen; setTimeout(function markAppInitialized() { window.appInitialized = true; console.log("[Momentus loader] markAppInitialized timeout fired", { tailwindLoaded: window.tailwindLoaded, appInitialized: window.appInitialized, timestamp: Date.now() }); checkAndHideLoadingScreen("appInitializedTimeout"); }, 1000); window.addEventListener("load", function handleWindowLoad() { window.tailwindLoaded = true; window.appInitialized = true; console.log("[Momentus loader] window load fallback fired", { timestamp: Date.now() }); checkAndHideLoadingScreen("windowLoadFallback"); }); })(); (function initializeTailwind() { var scriptId = "momentus-tailwind-script"; console.log("[Momentus loader] initializeTailwind invoked", { timestamp: Date.now() }); var configureTailwind = function () { if (typeof tailwind === "undefined") { return; } var existingScript = document.getElementById(scriptId); if (existingScript && existingScript.getAttribute("data-configured") === "true") { return; } if (existingScript) { existingScript.setAttribute("data-configured", "true"); } tailwind.config = { theme: { extend: { fontFamily: { inter: ["Inter", "sans-serif"], }, colors: { "brand-dark": "#764ba2", "brand-primary": "#667eea", "brand-secondary": "#4f63d2", "brand-light": "#8a9dff", "brand-light-bg": "#f5f3ff", "brand-text": "#2d3748", "brand-text-light": "#4a5568", }, borderRadius: { "4xl": "2rem", }, }, }, }; if (typeof window !== "undefined") { window.tailwindLoaded = true; console.log("[Momentus loader] configureTailwind executed", { timestamp: Date.now(), tailwindLoaded: window.tailwindLoaded, appInitialized: window.appInitialized }); if (typeof window.checkAndHideLoadingScreen === "function") { window.checkAndHideLoadingScreen("tailwindConfigure"); } } }; var existingTailwindScript = document.getElementById(scriptId); if (existingTailwindScript) { if (existingTailwindScript.getAttribute("data-initialized") === "true") { configureTailwind(); return; } if (typeof tailwind !== "undefined") { existingTailwindScript.setAttribute("data-initialized", "true"); configureTailwind(); return; } existingTailwindScript.onload = function () { existingTailwindScript.setAttribute("data-initialized", "true"); configureTailwind(); }; return; } var tailwindScript = document.createElement("script"); tailwindScript.id = scriptId; tailwindScript.src = "https://cdn.tailwindcss.com"; tailwindScript.onload = function () { console.log("[Momentus loader] tailwindScript onload fired", { timestamp: Date.now() }); tailwindScript.setAttribute("data-initialized", "true"); configureTailwind(); }; document.head.prepend(tailwindScript); })(); (function registerJustSignedInHandler() { if (typeof phoros === "undefined") { return; } var DEFAULT_AUTH_PAGE = "dashboard"; var SESSION_KEY_PREFIX = "momentus:routed"; var MAX_POLL_ATTEMPTS = 20; var POLL_INTERVAL_MS = 300; function goToDefaultPage() { if (!phoros) { return false; } if (typeof phoros.change === "function") { try { phoros.change(DEFAULT_AUTH_PAGE); return true; } catch (changeError) { /* Fallback to phoros.page.change when direct change fails */ } } if (!phoros.page || typeof phoros.page.change !== "function") { return false; } try { if (typeof phoros.page.name === "function" && phoros.page.name() === DEFAULT_AUTH_PAGE) { return true; } } catch (pageNameError) { /* Ignore page name lookup issues and still attempt navigation */ } try { phoros.page.change(DEFAULT_AUTH_PAGE); return true; } catch (navigationError) { return false; } } function getActivePerson() { if (!phoros || typeof phoros.person !== "function") { return null; } try { return phoros.person(); } catch (personError) { return null; } } function getPersonId(person) { if (!person) { return null; } return person._id || person.id || person.person_id || null; } function hideRegistrationPrompt() { if (typeof Session === "undefined" || Session === null) { return; } if (typeof Session.set !== "function") { return; } try { Session.set("JMDK_show_registration", false); } catch (sessionError) { /* Session may be unavailable; ignore */ } } function markRouted(personId) { if (!personId) { return; } try { sessionStorage.setItem(SESSION_KEY_PREFIX + ":" + personId, "1"); } catch (storageError) { /* sessionStorage may be unavailable; ignore */ } } function hasRouted(personId) { if (!personId) { return false; } try { return sessionStorage.getItem(SESSION_KEY_PREFIX + ":" + personId) === "1"; } catch (storageError) { return false; } } function handlePostAuthNavigation() { hideRegistrationPrompt(); var person = getActivePerson(); if (!person || !person.emailAddress) { return; } var personId = getPersonId(person); if (!hasRouted(personId)) { if (goToDefaultPage()) { markRouted(personId); } } else { goToDefaultPage(); } } if (typeof phoros.on === "undefined" || phoros.on === null) { phoros.on = {}; } function shouldInvokePreviousHandler(handler) { if (typeof handler !== "function") { return false; } try { var handlerSource = String(handler); if (handlerSource && /demo/i.test(handlerSource)) { return false; } } catch (stringifyError) { /* Ignore stringify issues and assume handler is safe to call */ } return true; } var previousJustSignedIn = phoros.on.justSignedIn; var shouldCallJustSignedIn = shouldInvokePreviousHandler(previousJustSignedIn); phoros.on.justSignedIn = function () { hideRegistrationPrompt(); if (shouldCallJustSignedIn) { try { previousJustSignedIn.apply(this, arguments); } catch (previousError) { /* Ignore errors from existing handlers */ } } handlePostAuthNavigation(); }; var previousJustSignedUp = phoros.on.justSignedUp; var shouldCallJustSignedUp = shouldInvokePreviousHandler(previousJustSignedUp); phoros.on.justSignedUp = function () { hideRegistrationPrompt(); if (shouldCallJustSignedUp) { try { previousJustSignedUp.apply(this, arguments); } catch (previousError) { /* Ignore errors from existing handlers */ } } handlePostAuthNavigation(); }; var pollAttempts = 0; var poller = setInterval(function () { pollAttempts += 1; var person = getActivePerson(); if (person && person.emailAddress) { handlePostAuthNavigation(); clearInterval(poller); return; } if (pollAttempts >= MAX_POLL_ATTEMPTS) { clearInterval(poller); } }, POLL_INTERVAL_MS); setTimeout(handlePostAuthNavigation, POLL_INTERVAL_MS); })(); (function manageMomentusChromeState() { if (typeof document === "undefined") { return; } var body = document.body; if (!body) { return; } var AUTH_ATTR = "data-auth-state"; var AUTH_VALUE = "authenticated"; var AUTH_POLL_INTERVAL_MS = 400; var AUTH_MAX_POLLS = 30; var authPollCount = 0; function isAuthenticated() { if (typeof jmkr_person === "object" && jmkr_person && typeof jmkr_person.firstName === "string" && jmkr_person.firstName.trim()) { return true; } if (typeof phoros !== "undefined" && phoros && typeof phoros.person === "function") { try { var activePerson = phoros.person(); if (activePerson && (activePerson.emailAddress || activePerson._id || activePerson.person_id)) { return true; } } catch (personError) { /* Ignore accessor failures */ } } return false; } function applyAuthState(authenticated) { if (!body) { return; } if (authenticated) { body.setAttribute(AUTH_ATTR, AUTH_VALUE); } else { body.removeAttribute(AUTH_ATTR); } } function evaluateAuthState() { var authed = isAuthenticated(); applyAuthState(authed); if (!authed && authPollCount < AUTH_MAX_POLLS) { authPollCount += 1; setTimeout(evaluateAuthState, AUTH_POLL_INTERVAL_MS); } } evaluateAuthState(); function wrapPhorosEvent(eventName) { if (typeof phoros === "undefined") { return; } var eventSource = phoros.on; if (!eventSource) { return; } var previousHandler = eventSource[eventName]; eventSource[eventName] = function () { applyAuthState(true); if (typeof previousHandler === "function") { try { return previousHandler.apply(this, arguments); } catch (handlerError) { /* Ignore downstream handler issues */ } } }; } wrapPhorosEvent("justSignedIn"); wrapPhorosEvent("justSignedUp"); })(); function handleLeftMenuLogoClick() { var goToLanding = function () { if (typeof phoros !== "undefined" && phoros && phoros.page && typeof phoros.page.change === "function") { phoros.page.change("home"); return; } try { window.location.hash = "#home"; } catch (hashError) { /* Ignore hash errors; navigation fallback unavailable */ } }; if (typeof Swal === "undefined" || typeof Swal.fire !== "function") { goToLanding(); return; } Swal.fire({ icon: "question", title: "Go to landing page?", text: "You can return to your dashboard from the menu at any time.", showCancelButton: true, confirmButtonText: "Yes, take me there", cancelButtonText: "Stay here" }).then(function (result) { if (result && result.isConfirmed) { goToLanding(); } }); } function handleLeftMenuLogoKeyDown(event) { if (!event) { return; } if (event.key === "Enter" || event.key === " ") { event.preventDefault(); handleLeftMenuLogoClick(); } } /** * Closes the lightbox with animation and pauses any playing media. */ function closeLightbox() { var lightboxOverlay = document.getElementById("lightbox-overlay"); var lightboxContent = document.getElementById("lightbox-content"); var lightboxMediaArea = document.getElementById("lightbox-media-area"); if (!lightboxOverlay || !lightboxContent || !lightboxMediaArea) return; // Add closing classes for animation lightboxOverlay.classList.add("lightbox-closing"); lightboxContent.classList.add("lightbox-content-closing"); lightboxOverlay.style.pointerEvents = "none"; // Prevent stray clicks during fade-out setLightboxCommentComposerDisabled(true, LIGHTBOX_COMMENT_PLACEHOLDER_TEXT); handleLightboxCommentInput(); // Pause any playing media when closing var mediaElement = lightboxMediaArea.querySelector("img, video, audio"); if (mediaElement && (mediaElement.tagName === "VIDEO" || mediaElement.tagName === "AUDIO")) { mediaElement.pause(); mediaElement.currentTime = 0; // Reset playback to start } } function handleLightboxOverlayClick(event) { var overlay = document.getElementById("lightbox-overlay"); if (!overlay) { return; } if (event && event.target === overlay) { closeLightbox(); } } // Universal escape key handler - consolidated for Blaze compatibility document.onkeydown = function (event) { if (event.key === "Escape") { // Close lightbox var lightboxOverlay = document.getElementById("lightbox-overlay"); if (lightboxOverlay && lightboxOverlay.classList.contains("lightbox-active")) { closeLightbox(); } // Close calendar modal var calendarModal = document.getElementById("calendar-modal"); if (calendarModal && calendarModal.classList.contains("active")) { closeDatePicker(); } // Close memory modal var memoryModal = document.getElementById("memory-modal"); if (memoryModal && memoryModal.classList.contains("active")) { closeMemoryModal(); } // Close family modal var familyModal = document.getElementById("family-modal"); if (familyModal && familyModal.classList.contains("active")) { closeFamilyModal(); } } }; /* Menu indicator function removed - faulty highlight box eliminated */ // --- FAB Functionality --- function handleGlobalBodyClick(event) { var fabContainer = document.getElementById("fab-container"); if (!fabContainer || !fabContainer.classList.contains("active")) { return; } if (!fabContainer.contains(event.target)) { fabContainer.classList.remove("active"); } } var LIGHTBOX_COMMENT_PLACEHOLDER_TEXT = "Share a memory or leave a note..."; var LIGHTBOX_COMMENT_EMPTY_COPY = "Be the first to leave a reflection on this memory."; var LIGHTBOX_COMMENT_LOADING_COPY = "Loading comments…"; var LIGHTBOX_COMMENT_ERROR_COPY = "Comments are unavailable right now."; var lightboxCommentState = { targetId: null, targetType: null, comments: [], isLoading: false, isSaving: false }; function getLightboxCommentElements() { var list = document.querySelector("[data-lightbox-comments-list]"); var input = document.getElementById("lightbox-comment-input"); var button = document.getElementById("lightbox-comment-submit"); return { list: list, input: input, button: button }; } function renderLightboxCommentPlaceholder(message) { var elements = getLightboxCommentElements(); if (!elements.list) { return; } while (elements.list.firstChild) { elements.list.removeChild(elements.list.firstChild); } var placeholder = document.createElement("div"); placeholder.className = "comment-placeholder"; placeholder.setAttribute("data-lightbox-comments-empty", "true"); placeholder.textContent = message || LIGHTBOX_COMMENT_EMPTY_COPY; elements.list.appendChild(placeholder); } function formatLightboxCommentDate(value) { if (value === null || value === undefined) { return "Just now"; } var date = new Date(value); if (isNaN(date.getTime())) { return "Just now"; } return date.toLocaleString(undefined, { month: "short", day: "numeric", year: "numeric", hour: "numeric", minute: "2-digit" }); } function renderLightboxComments(comments) { var elements = getLightboxCommentElements(); if (!elements.list) { return; } while (elements.list.firstChild) { elements.list.removeChild(elements.list.firstChild); } if (!comments || !comments.length) { renderLightboxCommentPlaceholder(LIGHTBOX_COMMENT_EMPTY_COPY); return; } for (var i = 0; i < comments.length; i++) { var comment = comments[i] || {}; var item = document.createElement("div"); item.className = "comment-item"; if (comment._id) { item.setAttribute("data-comment-id", comment._id); } var meta = document.createElement("div"); meta.className = "comment-meta"; var author = document.createElement("span"); author.className = "comment-author"; author.textContent = comment.authorName || "Family Member"; meta.appendChild(author); var date = document.createElement("span"); date.className = "comment-date"; date.textContent = formatLightboxCommentDate(comment.dateCreate || comment.dateUpdate); meta.appendChild(date); if (comment.canDelete && comment._id) { var deleteButton = document.createElement("button"); deleteButton.type = "button"; deleteButton.className = "comment-delete-button"; deleteButton.setAttribute("data-comment-id", comment._id); deleteButton.setAttribute("onclick", "handleLightboxCommentDelete(this)"); deleteButton.textContent = "Delete"; meta.appendChild(deleteButton); } item.appendChild(meta); var text = document.createElement("p"); text.className = "comment-text"; text.textContent = comment.body || ""; item.appendChild(text); elements.list.appendChild(item); } } function setLightboxCommentComposerDisabled(disabled, placeholderText) { var elements = getLightboxCommentElements(); if (elements.input) { elements.input.disabled = !!disabled; elements.input.setAttribute("placeholder", placeholderText || LIGHTBOX_COMMENT_PLACEHOLDER_TEXT); } if (elements.button) { elements.button.disabled = !!disabled || lightboxCommentState.isSaving || lightboxCommentState.isLoading || !lightboxCommentState.targetId; if (lightboxCommentState.isSaving) { elements.button.textContent = "Posting…"; } else { elements.button.textContent = "Post"; } } } function handleLightboxCommentInput() { var elements = getLightboxCommentElements(); if (!elements.input || !elements.button) { return; } if (lightboxCommentState.isSaving) { elements.button.disabled = true; elements.button.textContent = "Posting…"; return; } var value = elements.input.value || ""; var trimmed = typeof value === "string" ? value.trim() : ""; var allowPost = trimmed.length > 0 && !!lightboxCommentState.targetId && !lightboxCommentState.isLoading && !elements.input.disabled; elements.button.disabled = !allowPost; elements.button.textContent = "Post"; } function isValidLightboxTargetId(value) { if (!value && value !== 0) { return false; } if (typeof value !== "string") { value = String(value); } var trimmed = value.trim(); if (!trimmed || trimmed === "null" || trimmed === "undefined") { return false; } if (trimmed.indexOf("[") !== -1 || trimmed.indexOf("]") !== -1 || trimmed.indexOf("{") !== -1 || trimmed.indexOf("}") !== -1) { return false; } return true; } function resetLightboxCommentView() { lightboxCommentState.targetId = null; lightboxCommentState.targetType = null; lightboxCommentState.comments = []; lightboxCommentState.isLoading = false; lightboxCommentState.isSaving = false; var elements = getLightboxCommentElements(); if (elements.input) { elements.input.value = ""; } setLightboxCommentComposerDisabled(true, LIGHTBOX_COMMENT_PLACEHOLDER_TEXT); renderLightboxCommentPlaceholder(LIGHTBOX_COMMENT_EMPTY_COPY); handleLightboxCommentInput(); } function loadLightboxComments(targetId, targetType) { if (!isValidLightboxTargetId(targetId)) { renderLightboxCommentPlaceholder("Comments unavailable for this media."); setLightboxCommentComposerDisabled(true, "Comments unavailable for this media."); handleLightboxCommentInput(); return; } if (typeof phoros === "undefined" || typeof phoros.processor !== "function") { renderLightboxCommentPlaceholder(LIGHTBOX_COMMENT_ERROR_COPY); setLightboxCommentComposerDisabled(true, "Comments require a network connection."); handleLightboxCommentInput(); return; } lightboxCommentState.isLoading = true; renderLightboxCommentPlaceholder(LIGHTBOX_COMMENT_LOADING_COPY); setLightboxCommentComposerDisabled(true, LIGHTBOX_COMMENT_PLACEHOLDER_TEXT); handleLightboxCommentInput(); var payload = { targetId: targetId }; if (targetType) { payload.targetType = targetType; } phoros.processor("commentAction", { type: "fetch", payload: payload }, function (error, result) { var response = result; var err = error; if (typeof result === "undefined" && error && error.success !== undefined) { response = error; err = null; } lightboxCommentState.isLoading = false; if (err || !response || !response.success || !response.data) { renderLightboxCommentPlaceholder(LIGHTBOX_COMMENT_ERROR_COPY); setLightboxCommentComposerDisabled(true, "Comments are unavailable right now."); if (typeof Swal !== "undefined") { Swal.fire({ icon: "error", title: "Comments unavailable", text: "We could not load comments. Please try again later." }); } else { console.error("Lightbox comments fetch failed:", err || response); } handleLightboxCommentInput(); return; } var comments = response.data.comments || []; lightboxCommentState.comments = comments.slice(); if (lightboxCommentState.comments.length) { lightboxCommentState.comments.sort(function (a, b) { var aDate = (a && (a.dateCreate || a.dateUpdate)) || 0; var bDate = (b && (b.dateCreate || b.dateUpdate)) || 0; return aDate - bDate; }); } lightboxCommentState.targetId = response.data.targetId || targetId; lightboxCommentState.targetType = response.data.targetType || targetType || null; renderLightboxComments(lightboxCommentState.comments); setLightboxCommentComposerDisabled(false, LIGHTBOX_COMMENT_PLACEHOLDER_TEXT); handleLightboxCommentInput(); }); } function submitLightboxComment() { var elements = getLightboxCommentElements(); if (!elements.input || !elements.button) { return; } if (!lightboxCommentState.targetId) { handleLightboxCommentInput(); return; } if (typeof phoros === "undefined" || typeof phoros.processor !== "function") { if (typeof Swal !== "undefined") { Swal.fire({ icon: "error", title: "Unavailable", text: "Unable to submit comments right now." }); } return; } var value = elements.input.value || ""; var trimmed = typeof value === "string" ? value.trim() : ""; if (!trimmed) { handleLightboxCommentInput(); return; } lightboxCommentState.isSaving = true; handleLightboxCommentInput(); var payload = { targetId: lightboxCommentState.targetId, body: trimmed }; if (lightboxCommentState.targetType) { payload.targetType = lightboxCommentState.targetType; } phoros.processor("commentAction", { type: "save", payload: payload }, function (error, result) { var response = result; var err = error; if (typeof result === "undefined" && error && error.success !== undefined) { response = error; err = null; } lightboxCommentState.isSaving = false; if (err || !response || !response.success || !response.data || !response.data.comment) { if (typeof Swal !== "undefined") { Swal.fire({ icon: "error", title: "Unable to post", text: "We could not save your comment. Please try again." }); } handleLightboxCommentInput(); return; } elements.input.value = ""; var newComment = response.data.comment; lightboxCommentState.comments.push(newComment); lightboxCommentState.comments.sort(function (a, b) { var aDate = (a && (a.dateCreate || a.dateUpdate)) || 0; var bDate = (b && (b.dateCreate || b.dateUpdate)) || 0; return aDate - bDate; }); renderLightboxComments(lightboxCommentState.comments); handleLightboxCommentInput(); }); } function handleLightboxCommentDelete(button) { if (!button) { return; } var commentId = button.getAttribute("data-comment-id"); if (!commentId) { return; } if (typeof phoros === "undefined" || typeof phoros.processor !== "function") { if (typeof Swal !== "undefined") { Swal.fire({ icon: "error", title: "Unavailable", text: "Unable to delete comments right now." }); } return; } button.disabled = true; var originalText = button.textContent; button.textContent = "Removing…"; phoros.processor("commentAction", { type: "delete", payload: { commentId: commentId } }, function (error, result) { var response = result; var err = error; if (typeof result === "undefined" && error && error.success !== undefined) { response = error; err = null; } if (err || !response || !response.success) { button.disabled = false; button.textContent = originalText; if (typeof Swal !== "undefined") { Swal.fire({ icon: "error", title: "Unable to delete", text: "We could not remove that comment. Please try again." }); } return; } var nextComments = []; for (var i = 0; i < lightboxCommentState.comments.length; i++) { var existing = lightboxCommentState.comments[i]; if (!existing || existing._id === commentId) { continue; } nextComments.push(existing); } lightboxCommentState.comments = nextComments; renderLightboxComments(lightboxCommentState.comments); handleLightboxCommentInput(); }); } resetLightboxCommentView(); /** * Displays a lightbox with the specified media (image, video, or audio). * @param {string} mediaId - The ID of the media item (e.g., from a database). * @param {string} mediaSrc - The URL of the media file. * @param {'image'|'video'|'audio'} mediaType - The type of media to display. */ function showLightbox(mediaId, mediaSrc, mediaType) { var lightboxOverlay = document.getElementById("lightbox-overlay"); var lightboxMediaArea = document.getElementById("lightbox-media-area"); var lightboxContent = document.getElementById("lightbox-content"); // Clear previous media content while (lightboxMediaArea.firstChild) { lightboxMediaArea.removeChild(lightboxMediaArea.firstChild); } var mediaElement; switch (mediaType) { case "image": mediaElement = document.createElement("img"); mediaElement.src = mediaSrc; mediaElement.alt = "Lightbox Image"; break; case "video": mediaElement = document.createElement("video"); mediaElement.src = mediaSrc; mediaElement.controls = true; mediaElement.autoplay = true; // Autoplay for videos mediaElement.loop = true; // Loop videos for continuous playback mediaElement.muted = true; // Mute by default for autoplay compatibility break; case "audio": mediaElement = document.createElement("audio"); mediaElement.src = mediaSrc; mediaElement.controls = true; mediaElement.autoplay = true; // Autoplay for audio break; default: mediaElement = document.createElement("div"); mediaElement.className = "lightbox-file-preview"; var fileIcon = document.createElement("i"); fileIcon.className = "file outline icon"; var fileLink = document.createElement("a"); fileLink.href = mediaSrc; fileLink.target = "_blank"; fileLink.rel = "noopener noreferrer"; fileLink.textContent = "Open attachment"; mediaElement.appendChild(fileIcon); mediaElement.appendChild(fileLink); break; } lightboxMediaArea.appendChild(mediaElement); var normalizedMediaType = typeof mediaType === "string" ? mediaType.toLowerCase() : null; var hasValidTarget = isValidLightboxTargetId(mediaId); lightboxCommentState.targetId = hasValidTarget ? mediaId : null; lightboxCommentState.targetType = normalizedMediaType; lightboxCommentState.comments = []; lightboxCommentState.isSaving = false; lightboxCommentState.isLoading = false; if (!hasValidTarget) { setLightboxCommentComposerDisabled(true, "Comments unavailable for this media."); renderLightboxCommentPlaceholder("Comments unavailable for this media."); } else { renderLightboxCommentPlaceholder(LIGHTBOX_COMMENT_LOADING_COPY); setLightboxCommentComposerDisabled(true, LIGHTBOX_COMMENT_PLACEHOLDER_TEXT); loadLightboxComments(mediaId, normalizedMediaType); } handleLightboxCommentInput(); // Ensure display is not 'none' before adding active classes for animation lightboxOverlay.style.display = "flex"; lightboxOverlay.classList.remove("lightbox-closing"); lightboxContent.classList.remove("lightbox-content-closing"); lightboxOverlay.style.pointerEvents = "auto"; lightboxOverlay.classList.add("lightbox-active"); lightboxContent.classList.add("lightbox-content-active"); document.body.classList.add("no-scroll"); // Prevent background scrolling // Optional: Log the mediaId for potential comment loading in the future // Debug logging removed for production } // Handle lightbox overlay interactions; close button uses inline onclick for Blaze compatibility // The code is already implicitly wrapped in DOMContentLoaded by the execution environment. // So, direct execution here is equivalent to being inside DOMContentLoaded. var lightboxOverlay = document.getElementById("lightbox-overlay"); var lightboxContent = document.getElementById("lightbox-content"); // Close lightbox when clicking on the overlay, but not on the content itself - converted for Blaze compatibility if (lightboxOverlay) { // New animationend handler to handle final hiding after fade-out animation - converted for Blaze compatibility lightboxOverlay.onanimationend = function (event) { if (event.animationName === "lightboxFadeOutOverlay") { lightboxOverlay.classList.remove("lightbox-active", "lightbox-closing"); lightboxContent.classList.remove("lightbox-content-active", "lightbox-content-closing"); lightboxOverlay.style.display = "none"; // Finally hide it after animation lightboxOverlay.style.pointerEvents = "none"; // Reset interaction guard for next open document.body.classList.remove("no-scroll"); // Re-enable scrolling resetLightboxCommentView(); } }; } // --- Calendar Date Picker Functionality --- var currentCalendarDate = new Date(); var selectedDate = null; var currentContentType = null; var monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; // FAB Toggle Functionality function toggleFab(event) { if (event && typeof event.stopPropagation === "function") { event.stopPropagation(); } var fabContainer = document.getElementById("fab-container"); if (fabContainer) { fabContainer.classList.toggle("active"); } } function closeFab() { var fabContainer = document.getElementById("fab-container"); if (fabContainer) { fabContainer.classList.remove("active"); } } // Note: Click-outside-to-close functionality removed due to codebase restrictions // Users can click the main FAB button again to close or click any sub-button function showDatePickerForContent(contentType) { currentContentType = contentType; selectedDate = null; var modal = document.getElementById("calendar-modal"); if (modal) { modal.classList.add("active"); generateCalendar(); updateContinueButton(); // Close FAB var fabContainer = document.getElementById("fab-container"); if (fabContainer) { fabContainer.classList.remove("active"); } } } function closeDatePicker() { var modal = document.getElementById("calendar-modal"); if (modal) { modal.classList.remove("active"); } selectedDate = null; currentContentType = null; } function createCalendarCellElement(dayValue, offset, markToday) { var element = document.createElement("div"); element.className = offset === 0 ? "calendar-day" : "calendar-day other-month"; element.textContent = dayValue; element.tabIndex = 0; element.dataset.day = String(dayValue); element.dataset.offset = String(offset); element.setAttribute("onkeydown", "handleCalendarDayKeydown(event)"); if (markToday) { element.classList.add("today"); } return element; } function generateCalendar() { var year = currentCalendarDate.getFullYear(); var month = currentCalendarDate.getMonth(); var monthYearElement = document.getElementById("calendar-month-year"); if (monthYearElement) { monthYearElement.textContent = monthNames[month] + " " + year; } var daysContainer = document.getElementById("calendar-days"); if (!daysContainer) { return; } while (daysContainer.firstChild) { daysContainer.removeChild(daysContainer.firstChild); } var firstDay = new Date(year, month, 1).getDay(); var daysInMonth = new Date(year, month + 1, 0).getDate(); var daysInPrevMonth = new Date(year, month, 0).getDate(); var today = new Date(); var isCurrentMonth = today.getFullYear() === year && today.getMonth() === month; var index; for (index = firstDay; index > 0; index -= 1) { var previousDayNumber = daysInPrevMonth - index + 1; daysContainer.appendChild(createCalendarCellElement(previousDayNumber, -1, false)); } for (index = 1; index <= daysInMonth; index += 1) { var isToday = isCurrentMonth && index === today.getDate(); daysContainer.appendChild(createCalendarCellElement(index, 0, isToday)); } var totalCells = daysContainer.children.length; var nextDay = 1; while (totalCells < 42) { daysContainer.appendChild(createCalendarCellElement(nextDay, 1, false)); nextDay += 1; totalCells += 1; } if (isCurrentMonth && !selectedDate) { selectDate(today.getDate()); } } function activateCalendarDay(element) { if (!element) { return; } var offset = parseInt(element.dataset.offset || '0', 10); var dayValue = parseInt(element.dataset.day || '', 10); if (isNaN(dayValue)) { return; } if (offset === 0) { selectDate(dayValue); return; } selectDateFromAdjacentMonth(dayValue, offset); } function handleCalendarDayClick(event) { if (!event) { return; } var target = event.target && typeof event.target.closest === 'function' ? event.target.closest('.calendar-day') : null; if (!target) { return; } activateCalendarDay(target); } function handleCalendarDayKeydown(event) { if (!event) { return; } if (event.key === "Enter" || event.key === " ") { event.preventDefault(); activateCalendarDay(event.currentTarget || event.target); } } function navigateMonth(direction) { currentCalendarDate.setMonth(currentCalendarDate.getMonth() + direction); generateCalendar(); } function selectDate(day) { // Remove previous selection var previousSelected = document.querySelector(".calendar-day.selected"); if (previousSelected) { previousSelected.classList.remove("selected"); } // Set new selection var dayElements = document.querySelectorAll(".calendar-day:not(.other-month)"); for (var i = 0; i < dayElements.length; i++) { if (parseInt(dayElements[i].textContent) === day) { dayElements[i].classList.add("selected"); break; } } // Store selected date selectedDate = new Date(currentCalendarDate.getFullYear(), currentCalendarDate.getMonth(), day); updateContinueButton(); } function selectDateFromAdjacentMonth(day, offset) { var targetDate = new Date(currentCalendarDate.getFullYear(), currentCalendarDate.getMonth() + offset, day); selectedDate = new Date(targetDate); currentCalendarDate = new Date(targetDate.getFullYear(), targetDate.getMonth(), 1); generateCalendar(); selectDate(targetDate.getDate()); } function selectToday() { var today = new Date(); currentCalendarDate = new Date(today); generateCalendar(); selectDate(today.getDate()); } function updateContinueButton() { var continueButton = document.getElementById("calendar-continue"); if (continueButton) { continueButton.disabled = !selectedDate; } } function proceedWithDate() { // Enhanced validation and error handling if (!selectedDate) { alert("Please select a date first"); return; } if (!currentContentType) { alert("Content type not specified. Please try again."); return; } // Store content type locally before closing calendar (which resets it to null) var contentType = currentContentType; // Create date string for form pre-population var dateString = selectedDate.toISOString().split("T")[0]; // Close calendar closeDatePicker(); // Add a small delay to ensure calendar closes before opening next modal setTimeout(function () { // Proceed based on content type (using local variable) switch (contentType) { case "picture": // Open memory modal with pre-selected date createMemoryWithDate(dateString, "Picture"); break; case "audio": // Open memory modal with pre-selected date createMemoryWithDate(dateString, "Audio"); break; case "note": // Open message modal with pre-selected date createMessageWithDate(dateString); break; case "memory-date": // Handle memory date callback if available if (window.memoryDateCallback) { window.memoryDateCallback(selectedDate); window.memoryDateCallback = null; } break; default: alert("Unknown content type: " + contentType + ". Please contact support."); console.error("Unknown content type:", contentType); } }, 100); } // Note: Calendar modal outside click handling moved to inline onclick attributes for Blaze compatibility // Note: Calendar modal escape key handling integrated into main document.onkeydown handler function startMemoryCreationFlow() { if (typeof openCustomMemoryModal === "function") { openCustomMemoryModal(); return true; } if (typeof openMemoryModal === "function") { openMemoryModal(); return true; } var fabButton = document.getElementById("fab-main"); if (fabButton) { fabButton.click(); return true; } return false; } window.startMemoryCreationFlow = startMemoryCreationFlow; // --- Custom CRUD Modal System --- var currentMemoryId = null; var isEditMode = false; // Memory Modal Functions window.openMemoryModal = function (memoryId) { // Debug logging removed for production currentMemoryId = memoryId || null; isEditMode = !!memoryId; // Set modal title var modalTitle = document.getElementById("memory-modal-title"); var saveBtn = document.getElementById("memory-save-btn"); if (isEditMode) { modalTitle.textContent = "Edit Memory"; saveBtn.textContent = "💾 Update Memory"; loadMemoryData(memoryId); } else { modalTitle.textContent = "Create Memory"; saveBtn.textContent = "💾 Save Memory"; resetMemoryForm(); // Pre-populate from session storage if available (from calendar) var selectedDate = sessionStorage.getItem("selectedMemoryDate"); var selectedType = sessionStorage.getItem("selectedMediaType"); if (selectedDate) { document.getElementById("memory-date").value = selectedDate; sessionStorage.removeItem("selectedMemoryDate"); } if (selectedType) { document.getElementById("memory-type").value = selectedType; toggleUploadFields(selectedType); sessionStorage.removeItem("selectedMediaType"); } } // Show modal var modal = document.getElementById("memory-modal"); // Debug logging removed for production if (modal) { // Debug logging removed for production modal.classList.add("active"); // Debug logging removed for production // Focus first input setTimeout(function () { var titleInput = document.getElementById("memory-title"); // Debug logging removed for production if (titleInput) titleInput.focus(); }, 300); } else { // Debug logging removed for production - modal not found } }; window.closeMemoryModal = function () { var modal = document.getElementById("memory-modal"); if (modal) { modal.classList.remove("active"); } // Reset form and state resetMemoryForm(); currentMemoryId = null; isEditMode = false; }; function resetMemoryForm() { var form = document.getElementById("memory-form"); if (form) { form.reset(); // Clear previews var imagePreview = document.getElementById("image-preview"); var audioPreview = document.getElementById("audio-preview"); if (imagePreview) imagePreview.style.display = "none"; if (audioPreview) audioPreview.style.display = "none"; // Set today as default date var memoryDate = document.getElementById("memory-date"); if (memoryDate) { memoryDate.value = new Date().toISOString().split("T")[0]; } // Show image upload by default toggleUploadFields("Picture"); } } function toggleUploadFields(type) { var imageGroup = document.getElementById("image-upload-group"); var audioGroup = document.getElementById("audio-upload-group"); if (imageGroup && audioGroup) { if (type === "Audio") { imageGroup.style.display = "none"; audioGroup.style.display = "block"; } else { imageGroup.style.display = "block"; audioGroup.style.display = "none"; } } } function showCalendarForMemory() { // Close memory modal temporarily var memoryModal = document.getElementById("memory-modal"); if (memoryModal) { memoryModal.classList.remove("active"); } // Set callback for when date is selected window.memoryDateCallback = function (selectedDate) { // Set the date in the memory form var memoryDate = document.getElementById("memory-date"); if (memoryDate) { memoryDate.value = selectedDate.toISOString().split("T")[0]; } // Reopen memory modal setTimeout(function () { if (memoryModal) { memoryModal.classList.add("active"); } }, 100); }; // Show calendar modal currentContentType = "memory-date"; selectedDate = null; var modal = document.getElementById("calendar-modal"); if (modal) { modal.classList.add("active"); generateCalendar(); updateContinueButton(); } } function saveMemory() { var form = document.getElementById("memory-form"); var saveBtn = document.getElementById("memory-save-btn"); if (!form || !saveBtn) return; // Get form data var formData = new FormData(form); var payload = {}; // Extract form fields payload.title = formData.get("title"); payload.type = [formData.get("type")]; // Array format payload.caption = formData.get("caption"); payload.memory_date = formData.get("memory_date"); // Legacy upload_* fields removed. Upload selection handled via CommonForms.uploadFiles building media[] // Validate required fields if (!payload.title || !payload.title.trim()) { showNotification("Please enter a memory title", "error"); return; } // Add memory ID for updates if (isEditMode && currentMemoryId) { payload.memoryId = currentMemoryId; } CommonForms.submit({ button: "#memory-save-btn", processor: "memoryAction", payload: payload, loadingText: isEditMode ? " Updating…" : " Saving…", onSuccess: function () { showNotification(isEditMode ? "Memory updated successfully!" : "Memory created successfully!", "success"); closeMemoryModal(); if (window.location.hash === "#memory" || phoros.page.current === "memory") { loadMemoriesList(); } }, }); } function loadMemoryData(memoryId) { if (!memoryId) return; phoros.processor( "memoryAction", { type: "get", payload: { memoryId: memoryId }, }, function (error, result) { if (error || !result.success) { showNotification("Failed to load memory data", "error"); return; } var memory = result.data.memory; // Populate form document.getElementById("memory-title").value = memory.title || memory.name || ""; document.getElementById("memory-type").value = (memory.type && memory.type[0]) || "Picture"; document.getElementById("memory-caption").value = memory.caption || ""; document.getElementById("memory-date").value = memory.memory_date || memory.dateCreate.split("T")[0]; // Toggle upload fields based on type toggleUploadFields((memory.type && memory.type[0]) || "Picture"); // Show existing media if available (prefer media[]; fallback to legacy fields) var firstMedia = Array.isArray(memory.media) && memory.media.length ? memory.media[0] : null; if (firstMedia && firstMedia.url) { showImagePreview(firstMedia.url); } } ); } // File upload handlers function triggerImageUpload() { document.getElementById("memory-image").click(); } function triggerAudioUpload() { document.getElementById("memory-audio").click(); } // File preview handlers function showImagePreview(imageSrc) { var preview = document.getElementById("memory-image-preview") || document.getElementById("image-preview"); if (!preview) { var dz = document.getElementById("memoryDropZone"); if (dz) { preview = document.createElement("div"); preview.id = "memory-image-preview"; preview.className = "upload-preview"; dz.appendChild(preview); } } var placeholder = (preview && preview.parentElement ? (preview.parentElement.querySelector(".upload-placeholder") || document.querySelector("#memoryDropZone .drop-zone-content")) : null); if (preview) { // Clear existing content while (preview.firstChild) { preview.removeChild(preview.firstChild); } var img = document.createElement("img"); img.src = imageSrc; img.alt = "Preview"; var span = document.createElement("span"); span.textContent = "Image selected"; preview.appendChild(img); preview.appendChild(span); preview.style.display = "flex"; if (placeholder) { placeholder.style.display = "none"; } } } function showAudioPreview(audioSrc) { var preview = document.getElementById("memory-audio-preview") || document.getElementById("audio-preview"); if (!preview) { var dz = document.getElementById("memoryDropZone"); if (dz) { preview = document.createElement("div"); preview.id = "memory-audio-preview"; preview.className = "upload-preview"; dz.appendChild(preview); } } var placeholder = (preview && preview.parentElement ? (preview.parentElement.querySelector(".upload-placeholder") || document.querySelector("#memoryDropZone .drop-zone-content")) : null); if (preview) { // Clear existing content while (preview.firstChild) { preview.removeChild(preview.firstChild); } var icon = document.createElement("i"); icon.className = "music icon"; icon.textContent = "🎵"; var span = document.createElement("span"); span.textContent = "Audio file selected"; preview.appendChild(icon); preview.appendChild(span); preview.style.display = "flex"; if (placeholder) { placeholder.style.display = "none"; } } } function showVideoPreview(videoSrc) { var preview = document.getElementById("memory-video-preview"); if (!preview) { var dz = document.getElementById("memoryDropZone"); if (dz) { preview = document.createElement("div"); preview.id = "memory-video-preview"; preview.className = "upload-preview"; dz.appendChild(preview); } } var placeholder = (preview && preview.parentElement ? (preview.parentElement.querySelector(".upload-placeholder") || document.querySelector("#memoryDropZone .drop-zone-content")) : null); if (preview) { while (preview.firstChild) { preview.removeChild(preview.firstChild); } var video = document.createElement("video"); video.controls = true; video.src = videoSrc; video.style.maxWidth = "100%"; video.style.borderRadius = "12px"; var span = document.createElement("span"); span.textContent = "Video file selected"; preview.appendChild(video); preview.appendChild(span); preview.style.display = "flex"; if (placeholder) { placeholder.style.display = "none"; } } } function showGenericFilePreview(labelText) { var preview = document.getElementById("memory-file-preview"); if (!preview) { var dz = document.getElementById("memoryDropZone"); if (dz) { preview = document.createElement("div"); preview.id = "memory-file-preview"; preview.className = "upload-preview"; dz.appendChild(preview); } } var placeholder = (preview && preview.parentElement ? (preview.parentElement.querySelector(".upload-placeholder") || document.querySelector("#memoryDropZone .drop-zone-content")) : null); if (preview) { while (preview.firstChild) { preview.removeChild(preview.firstChild); } var icon = document.createElement("i"); icon.className = "file outline icon"; var span = document.createElement("span"); span.textContent = labelText || "File attached"; preview.appendChild(icon); preview.appendChild(span); preview.style.display = "flex"; if (placeholder) { placeholder.style.display = "none"; } } } function clearMemoryDropZonePreview() { var previewIds = ["memory-image-preview", "image-preview", "memory-audio-preview", "audio-preview", "memory-video-preview", "memory-file-preview"]; for (var i = 0; i < previewIds.length; i++) { var el = document.getElementById(previewIds[i]); if (!el) continue; while (el.firstChild) { el.removeChild(el.firstChild); } el.style.display = "none"; } var dropContent = document.querySelector('#memoryDropZone .drop-zone-content'); if (dropContent) { dropContent.style.display = ""; } } window._memoryPreviewObjectUrls = window._memoryPreviewObjectUrls || []; function registerMemoryPreviewUrl(url) { if (!url) return; try { window._memoryPreviewObjectUrls.push(url); } catch (e) { window._memoryPreviewObjectUrls = [url]; } } function flushMemoryPreviewUrls() { if (!Array.isArray(window._memoryPreviewObjectUrls)) { window._memoryPreviewObjectUrls = []; return; } for (var i = 0; i < window._memoryPreviewObjectUrls.length; i++) { var url = window._memoryPreviewObjectUrls[i]; if (!url) continue; try { URL.revokeObjectURL(url); } catch (e) { } } window._memoryPreviewObjectUrls.length = 0; } function ensureMemoryPendingMediaArray() { if (!Array.isArray(window._memoryPendingMedia)) { try { window._memoryPendingMedia = []; } catch (error) { window._memoryPendingMedia = []; } } return window._memoryPendingMedia; } function normalizeMemoryMediaItems(list) { var normalized = []; if (!Array.isArray(list)) { return normalized; } for (var i = 0; i < list.length; i++) { var item = list[i] || {}; if (!item.url) { continue; } var mime = item.mimeType || (item.type || ""); var kind = item.kind; if (!kind && mime) { if (mime.indexOf("image/") === 0) kind = "image"; else if (mime.indexOf("video/") === 0) kind = "video"; else if (mime.indexOf("audio/") === 0) kind = "audio"; } if (!kind) { kind = "file"; } normalized.push({ kind: kind, url: item.url, mimeType: mime || null, sizeBytes: typeof item.sizeBytes === "number" ? item.sizeBytes : (typeof item.size === "number" ? item.size : null), milestoneId: item.milestoneId || null, milestoneIds: Array.isArray(item.milestoneIds) ? item.milestoneIds.slice() : undefined, sourceVaultId: item.sourceVaultId || item.vaultId || undefined }); } return normalized; } function updateMemoryMediaLabel(count) { var label = document.getElementById("memoryUploadLabel"); if (!label) { return; } if (!count) { label.textContent = "Selected media will appear below. Everything stays private until you post."; return; } label.textContent = count === 1 ? "1 media item ready to share." : count + " media items ready to share."; } function renderMemoryMediaPreview(mediaItems) { var preview = document.getElementById("memoryUploadPreview"); var clearBtn = document.getElementById("clearMemoryMediaBtn"); if (!preview) { return; } while (preview.firstChild) { preview.removeChild(preview.firstChild); } var normalized = normalizeMemoryMediaItems(mediaItems); updateMemoryMediaLabel(normalized.length); if (!normalized.length) { var emptyHint = document.createElement("span"); emptyHint.className = "memory-upload-empty"; emptyHint.textContent = "No media attached yet."; preview.appendChild(emptyHint); if (clearBtn) { clearBtn.style.display = "none"; } return; } for (var i = 0; i < normalized.length; i++) { (function (index) { var media = normalized[index]; var itemEl = document.createElement("div"); itemEl.className = "memory-preview-item"; itemEl.setAttribute("data-media-index", String(index)); if (media.kind === "image" && media.url) { var img = document.createElement("img"); img.src = media.url; img.alt = "Memory media"; itemEl.appendChild(img); } else if (media.kind === "video" && media.url) { var vid = document.createElement("video"); vid.src = media.url; vid.muted = true; vid.loop = true; vid.playsInline = true; itemEl.appendChild(vid); } else { var chip = document.createElement("span"); chip.textContent = media.kind === "audio" ? "Audio" : "File"; itemEl.appendChild(chip); } var removeBtn = document.createElement("button"); removeBtn.type = "button"; removeBtn.className = "memory-preview-remove"; removeBtn.setAttribute("aria-label", "Remove media item"); removeBtn.onclick = function () { removeMemoryMediaAt(index); }; var icon = document.createElement("i"); icon.className = "times icon"; removeBtn.appendChild(icon); itemEl.appendChild(removeBtn); preview.appendChild(itemEl); })(i); } if (clearBtn) { clearBtn.style.display = "inline-flex"; } } function dedupeMemoryMedia(list) { var seen = {}; var deduped = []; for (var i = 0; i < list.length; i++) { var item = list[i]; if (!item || !item.url) { continue; } var key = String(item.url).trim(); if (!key || seen[key]) { continue; } seen[key] = true; deduped.push(item); } return deduped; } function mergeMemoryMediaItems(newItems, options) { var normalizedNew = normalizeMemoryMediaItems(newItems); var base = options && options.replace ? [] : normalizeMemoryMediaItems(ensureMemoryPendingMediaArray()); var combined = dedupeMemoryMedia(base.concat(normalizedNew)); window._memoryPendingMedia = combined; renderMemoryMediaPreview(combined); return combined; } function clearMemoryMediaSelection() { window._memoryPendingMedia = []; renderMemoryMediaPreview([]); clearMemoryDropZonePreview(); } function removeMemoryMediaAt(index) { var pending = ensureMemoryPendingMediaArray(); if (!pending.length) { return; } var next = []; for (var i = 0; i < pending.length; i++) { if (i === index) { continue; } next.push(pending[i]); } window._memoryPendingMedia = next; renderMemoryMediaPreview(next); } window.clearMemoryMediaSelection = clearMemoryMediaSelection; window.removeMemoryMediaAt = removeMemoryMediaAt; renderMemoryMediaPreview(window._memoryPendingMedia || []); // File input change handlers - converted from DOMContentLoaded for Blaze compatibility var imageInput = document.getElementById("memory-image"); var audioInput = document.getElementById("memory-audio"); var typeSelect = document.getElementById("memory-type"); if (imageInput) { imageInput.onchange = function (e) { var file = e.target.files[0]; if (file) { var reader = new FileReader(); reader.onload = function (e) { showImagePreview(e.target.result); }; reader.readAsDataURL(file); } }; } if (audioInput) { audioInput.onchange = function (e) { var file = e.target.files[0]; if (file) { showAudioPreview("audio-placeholder"); } }; } if (typeSelect) { typeSelect.onchange = function (e) { toggleUploadFields(e.target.value); }; } // Notification system var activeToastTimerId = null; function ensureToastElements() { var toast = document.getElementById("momentusToast"); if (!toast) { return null; } var messageEl = toast.querySelector(".momentus-toast__message"); if (!messageEl) { messageEl = document.createElement("p"); messageEl.className = "momentus-toast__message"; toast.appendChild(messageEl); } return { toast: toast, messageEl: messageEl }; } function hideNotification() { var toast = document.getElementById("momentusToast"); if (!toast) { return; } toast.classList.remove("active", "success", "error", "info"); if (activeToastTimerId) { try { clearTimeout(activeToastTimerId); } catch (e) { } activeToastTimerId = null; } } function trackNotification(type) { try { if (typeof phoros !== "undefined" && phoros.analytics && typeof phoros.analytics.track === "function") { phoros.analytics.track("momentus_notification_shown", { variant: type }); return; } } catch (telemetryError) { console.warn("Telemetry tracking failed", telemetryError); } console.info("Momentus notification", type); } function showNotification(message, type) { var toastElements = ensureToastElements(); if (!toastElements) { alert(message); return; } var toast = toastElements.toast; var messageEl = toastElements.messageEl; var variant = type === "success" ? "success" : (type === "error" ? "error" : "info"); messageEl.textContent = message; toast.classList.remove("success", "error", "info", "active"); toast.classList.add(variant); requestAnimationFrame(function () { toast.classList.add("active"); }); if (activeToastTimerId) { try { clearTimeout(activeToastTimerId); } catch (clearError) { } } activeToastTimerId = setTimeout(function () { hideNotification(); }, 4000); trackNotification(variant); } // Note: proceedWithDate function now handles all cases including memory-date callbacks // Enhanced FAB functions to use custom modals function createMemoryWithDate(dateString, mediaType) { try { if (dateString) { sessionStorage.setItem("selectedMemoryDate", dateString); } } catch (dateError) { /* Ignore storage errors; we'll fall back to manual entry */ } try { if (mediaType) { sessionStorage.setItem("selectedMediaType", mediaType); } } catch (mediaTypeError) { /* Ignore storage errors; default selection can be manual */ } if (!startMemoryCreationFlow()) { alert("Memory creation feature is being loaded. Please try again."); console.error("startMemoryCreationFlow was unable to open the memory modal"); } } function createMessageWithDate(dateString) { try { if (dateString) { sessionStorage.setItem("selectedMessageDate", dateString); } } catch (messageDateError) { /* Ignore storage errors; manual entry will be required */ } if (typeof openMessageModal === "function") { openMessageModal(); return; } alert("Message creation feature is being loaded. Please try again."); console.error("openMessageModal function not found"); } // Memory modal functionality is now handled by direct onclick calls // Note: Modal outside click handling moved to inline onclick attributes for Blaze compatibility // Note: Modal escape key handling integrated into main document.onkeydown handler // --- Family Member CRUD with Baby Tracking --- var currentFamilyMemberId = null; var isFamilyEditMode = false; // Enhanced Predictive Analytics - Personalized Child Development Insights var PREDICTIVE_PROMPTS = { "0-3months": ["At {age} months, has {name} started smiling yet? Social smiles usually appear around 6-8 weeks!", "Is {name} holding their head up during tummy time? This builds crucial neck strength!", "Has {name} begun tracking objects with their eyes? This shows visual development is on track!", "Are you noticing {name} responding to your voice? Early communication skills are developing!", "Is {name} making cooing sounds yet? These early vocalizations are the foundation for speech!"], "3-6months": ["At {age} months, is {name} rolling over from tummy to back? This is a major motor milestone!", "Has {name} started reaching for and grasping toys? Hand-eye coordination is developing beautifully!", "Is {name} laughing yet? Those first giggles usually appear around 3-4 months!", "Are you seeing {name} push up on their arms during tummy time? Building those core muscles!", "Has {name} begun to sit with support? They're getting ready for independent sitting!"], "6-12months": ["At {age} months, is {name} sitting without support? Most babies master this between 6-8 months!", "Has {name} started babbling 'mama' or 'dada'? These first attempts at words are so precious!", "Is {name} crawling or scooting around? Some babies prefer different ways of getting mobile!", "Has {name} begun eating finger foods? This develops fine motor skills and independence!", "Are you noticing {name} playing peek-a-boo or pat-a-cake? Social games show cognitive growth!", "Is {name} pulling themselves up to stand? They're preparing for those first steps!"], "12-18months": ["At {age} months, has {name} taken their first steps yet? Most toddlers walk between 12-15 months!", "Is {name} saying 1-3 clear words besides 'mama' and 'dada'? Vocabulary is expanding!", "Has {name} started showing preferences for certain foods or activities? Personality is emerging!", "Are you seeing {name} point at things they want? This is important for communication!", "Has {name} begun to stack blocks or put objects in containers? Problem-solving skills are developing!", "Is {name} clapping hands or waving bye-bye? Social communication is blossoming!"], "18-24months": ["At {age} months, is {name} putting two words together? 'More milk' or 'Go car' show language growth!", "Has {name} shown interest in potty training? Some toddlers start showing readiness now!", "Is {name} running and climbing stairs with help? Gross motor skills are advancing quickly!", "Are you noticing {name} playing pretend games? Imagination is developing beautifully!", "Has {name} started to show defiance or say 'no'? This is healthy independence developing!", "Is {name} following simple two-step directions? 'Get your shoes and come here' - cognitive growth!"], "2-3years": ["At {age} years, is {name} potty trained during the day? Many children master this by age 3!", "How is {name}'s vocabulary? They should know 200-300+ words and speak in 3-word sentences!", "Is {name} showing independence with dressing? They can likely manage simple clothing items!", "Has {name} started playing with other children, not just alongside them? Social skills developing!", "Are you seeing {name} use 'I', 'me', and 'you' correctly? Language complexity is increasing!", "Is {name} able to pedal a tricycle or balance on one foot briefly? Motor skills are maturing!"], "3-4years": ["At {age} years, is {name} telling stories and asking lots of 'why' questions? Curiosity is exploding!", "Can {name} dress themselves with minimal help? Independence skills are really developing!", "Is {name} playing cooperatively with friends? Social relationships are becoming important!", "Has {name} mastered potty training, including nighttime? Full bladder control usually comes by 4!", "Are you noticing {name} can hop on one foot and climb playground equipment? Physical skills advancing!", "Is {name} beginning to recognize letters or their written name? Pre-literacy skills emerging!"], "4-5years": ["At {age} years, is {name} ready for structured learning activities? School readiness developing!", "Can {name} tell elaborate stories and engage in complex pretend play? Imagination is rich!", "Is {name} showing empathy when others are hurt or sad? Emotional intelligence growing!", "Has {name} developed clear handedness (left or right)? Fine motor preferences are establishing!", "Are you seeing {name} count to 10 and recognize basic shapes? Math readiness is emerging!", "Is {name} able to follow multi-step rules in games? Cognitive complexity increasing!"], "medical-tracking": ["Time for {name}'s next checkup! Track height, weight, and discuss development with your pediatrician.", "Has {name} had their recommended vaccines? Staying up-to-date protects their health!", "Are you tracking {name}'s growth on their growth chart? Consistent patterns are reassuring!", "Consider discussing any developmental concerns with your pediatrician at your next visit.", "Document {name}'s achievements for your doctor - they love to hear about milestone progress!"], }; // OLD window.openFamilyModal function removed - using openFamilyModal() for customFamilyModal // OLD resetFamilyForm function removed - using custom family modal form reset function calculateAgeFromDate(dateOfBirth) { if (!dateOfBirth) return null; var birthDate = new Date(dateOfBirth); var today = new Date(); var ageInMonths = (today.getFullYear() - birthDate.getFullYear()) * 12 + (today.getMonth() - birthDate.getMonth()); if (today.getDate() < birthDate.getDate()) { ageInMonths--; } return { months: ageInMonths, years: Math.floor(ageInMonths / 12), isChild: ageInMonths <= 120, // 10 years }; } function showBabyTrackingSection() { var section = document.getElementById("baby-tracking-section"); if (section) { section.style.display = "block"; } } function hideBabyTrackingSection() { var section = document.getElementById("baby-tracking-section"); if (section) { section.style.display = "none"; } } function showPredictiveAnalytics(age, name) { var section = document.getElementById("baby-tracking-section"); if (!section) return; // Remove existing analytics var existing = section.querySelector(".predictive-analytics"); if (existing) existing.remove(); var ageGroup = getAgeGroup(age.months); var prompts = PREDICTIVE_PROMPTS[ageGroup]; // Add medical tracking prompts for children under 5 if (age.months <= 60 && PREDICTIVE_PROMPTS["medical-tracking"]) { prompts = (prompts || []).concat(PREDICTIVE_PROMPTS["medical-tracking"]); } if (prompts && prompts.length > 0) { var analyticsDiv = document.createElement("div"); analyticsDiv.className = "predictive-analytics enhanced"; var heading = document.createElement("h5"); heading.textContent = "🔮 Development Insights for " + (name || "Your Child"); // Show 2-3 relevant prompts instead of just one var numPromptsToShow = Math.min(3, prompts.length); var selectedPrompts = []; var usedIndices = []; for (var i = 0; i < numPromptsToShow; i++) { var randomIndex; do { randomIndex = Math.floor(Math.random() * prompts.length); } while (usedIndices.includes(randomIndex)); usedIndices.push(randomIndex); selectedPrompts.push(prompts[randomIndex]); } selectedPrompts.forEach(function (prompt, index) { var personalizedPrompt = prompt.replace(/\{name\}/g, name || "your little one").replace(/\{age\}/g, formatAge(age)); var promptDiv = document.createElement("div"); promptDiv.className = "analytics-prompt"; var icon = document.createElement("span"); icon.className = "prompt-icon"; icon.textContent = index === 0 ? "🎯" : index === 1 ? "💡" : "🏥"; var text = document.createElement("p"); text.textContent = personalizedPrompt; promptDiv.appendChild(icon); promptDiv.appendChild(text); analyticsDiv.appendChild(promptDiv); }); // Add age indicator var ageIndicator = document.createElement("div"); ageIndicator.className = "age-indicator enhanced"; ageIndicator.textContent = formatAge(age) + " old"; analyticsDiv.insertBefore(heading, analyticsDiv.firstChild); analyticsDiv.appendChild(ageIndicator); section.appendChild(analyticsDiv); } } function formatAge(age) { if (!age) return "Unknown age"; if (age.years >= 1) { if (age.months % 12 === 0) { return age.years + " year" + (age.years > 1 ? "s" : ""); } else { var remainingMonths = age.months % 12; return age.years + " year" + (age.years > 1 ? "s" : "") + ", " + remainingMonths + " month" + (remainingMonths > 1 ? "s" : ""); } } else { return age.months + " month" + (age.months > 1 ? "s" : ""); } } function hidePredictiveAnalytics() { var existing = document.querySelector(".predictive-analytics"); if (existing) existing.remove(); } function getAgeGroup(ageInMonths) { if (ageInMonths <= 3) return "0-3months"; if (ageInMonths <= 6) return "3-6months"; if (ageInMonths <= 12) return "6-12months"; if (ageInMonths <= 18) return "12-18months"; if (ageInMonths <= 24) return "18-24months"; if (ageInMonths <= 36) return "2-3years"; if (ageInMonths <= 48) return "3-4years"; if (ageInMonths <= 60) return "4-5years"; return "older"; } function updateBabyTrackingVisibility() { var dobInput = document.getElementById("family-dob"); var relationshipInput = document.getElementById("family-relationship"); var firstNameInput = document.getElementById("family-first-name"); if (!dobInput || !relationshipInput) return; var dateOfBirth = dobInput.value; var relationship = relationshipInput.value; var firstName = firstNameInput ? firstNameInput.value : ""; // Show baby tracking for young children or babies var shouldShow = false; var age = null; if (dateOfBirth) { age = calculateAgeFromDate(dateOfBirth); shouldShow = age && age.isChild && age.years <= 5; } // Also show for typical child relationships regardless of age if (["Son", "Daughter"].includes(relationship)) { shouldShow = true; } if (shouldShow) { showBabyTrackingSection(); // Show predictive analytics if we have age data if (age && age.months <= 36 && firstName) { showPredictiveAnalytics(age, firstName); } } else { hideBabyTrackingSection(); hidePredictiveAnalytics(); } } function saveFamilyMember() { var form = document.getElementById("family-form"); var saveBtn = document.getElementById("family-save-btn"); if (!form || !saveBtn) return; var formData = new FormData(form); var payload = {}; // Extract basic fields payload.first_name = formData.get("first_name"); payload.last_name = formData.get("last_name"); payload.date_of_birth = formData.get("date_of_birth"); payload.relationship = formData.get("relationship"); // Extract baby tracking fields payload.current_height = formData.get("current_height") ? parseFloat(formData.get("current_height")) : null; payload.current_weight = formData.get("current_weight") ? parseFloat(formData.get("current_weight")) : null; payload.height_unit = formData.get("height_unit") || "cm"; payload.weight_unit = formData.get("weight_unit") || "kg"; // Extract milestones var milestones = []; var milestoneInputs = form.querySelectorAll('input[name="milestones"]:checked'); milestoneInputs.forEach(function (input) { milestones.push({ type: input.value, date_achieved: payload.date_of_birth || new Date().toISOString().split("T")[0], description: input.nextElementSibling.textContent.trim(), }); }); payload.milestones = milestones; // Validate if (!payload.first_name || !payload.last_name) { showNotification("Please enter both first and last name", "error"); return; } // Add member ID for updates if (isFamilyEditMode && currentFamilyMemberId) { payload.member_id = currentFamilyMemberId; } CommonForms.submit({ // keep manual loading visuals already set on saveBtn processor: "familyAction", payload: payload, onSuccess: function (result) { showNotification(isFamilyEditMode ? "Family member updated successfully!" : "Family member added successfully!", "success"); closeFamilyModal(); if (window.location.hash === "#profile" || phoros.page.current === "profile") { loadFamilyList(); } }, }); } function loadFamilyMemberData(memberId) { if (!memberId) return; phoros.processor( "familyAction", { type: "get", payload: { member_id: memberId }, }, function (error, result) { if (error || !result.success) { showNotification("Failed to load family member data", "error"); return; } var member = result.data.family_member; // Populate basic fields document.getElementById("family-first-name").value = member.firstName || ""; document.getElementById("family-last-name").value = member.lastName || ""; document.getElementById("family-dob").value = member.dateOfBirth || ""; document.getElementById("family-relationship").value = member.relationship || ""; // Populate baby tracking fields if (member.currentHeight) { document.getElementById("current-height").value = member.currentHeight; } if (member.currentWeight) { document.getElementById("current-weight").value = member.currentWeight; } // Populate milestones if (member.milestones && member.milestones.length > 0) { member.milestones.forEach(function (milestone) { var checkbox = document.getElementById(milestone.type); if (checkbox) { checkbox.checked = true; } }); } // Update baby tracking visibility updateBabyTrackingVisibility(); } ); } // Event handlers for family form - converted from DOMContentLoaded for Blaze compatibility var dobInput = document.getElementById("family-dob"); var relationshipInput = document.getElementById("family-relationship"); var firstNameInput = document.getElementById("family-first-name"); if (dobInput) { dobInput.onchange = updateBabyTrackingVisibility; } if (relationshipInput) { relationshipInput.onchange = updateBabyTrackingVisibility; } if (firstNameInput) { firstNameInput.oninput = function () { // Update predictive analytics with name when typing setTimeout(updateBabyTrackingVisibility, 500); }; } // Medical Tracking Functions function addHeightMeasurement() { var height = prompt("Enter height (cm or inches):"); var date = prompt("Enter date (YYYY-MM-DD) or leave empty for today:"); if (height) { date = date || new Date().toISOString().split("T")[0]; addMeasurementEntry("height-history", height, date, "Height"); } } function addWeightMeasurement() { var weight = prompt("Enter weight (kg or lbs):"); var date = prompt("Enter date (YYYY-MM-DD) or leave empty for today:"); if (weight) { date = date || new Date().toISOString().split("T")[0]; addMeasurementEntry("weight-history", weight, date, "Weight"); } } function addMeasurementEntry(containerId, value, date, type) { var container = document.getElementById(containerId); if (!container) return; var addButton = container.querySelector(".add-measurement"); var entry = document.createElement("div"); entry.className = "measurement-entry"; var valueSpan = document.createElement("span"); valueSpan.textContent = value; valueSpan.style.fontWeight = "600"; var dateSpan = document.createElement("span"); dateSpan.className = "measurement-date"; dateSpan.textContent = new Date(date).toLocaleDateString(); entry.appendChild(valueSpan); entry.appendChild(dateSpan); // Insert before the add button container.insertBefore(entry, addButton); } function scheduleAppointment() { alert("Appointment scheduling feature coming soon! For now, please call your pediatrician directly."); } function exportMedicalHistory() { alert("Medical history export feature coming soon! This will generate a PDF summary of all medical visits and growth tracking."); } function shareWithProvider() { alert("Provider sharing feature coming soon! This will allow secure sharing of medical records with your healthcare team."); } // Enhanced family member save function to include medical data var originalSaveFamilyMember = saveFamilyMember; function saveFamilyMember() { var form = document.getElementById("family-form"); var saveBtn = document.getElementById("family-save-btn"); if (!form || !saveBtn) return; var formData = new FormData(form); var payload = {}; // Extract basic fields payload.first_name = formData.get("first_name"); payload.last_name = formData.get("last_name"); payload.date_of_birth = formData.get("date_of_birth"); payload.relationship = formData.get("relationship"); // Extract baby tracking fields payload.current_height = formData.get("current_height") ? parseFloat(formData.get("current_height")) : null; payload.current_weight = formData.get("current_weight") ? parseFloat(formData.get("current_weight")) : null; payload.height_unit = formData.get("height_unit") || "cm"; payload.weight_unit = formData.get("weight_unit") || "kg"; // Extract milestones var milestones = []; var milestoneInputs = form.querySelectorAll('input[name="milestones"]:checked'); milestoneInputs.forEach(function (input) { milestones.push({ type: input.value, date_achieved: payload.date_of_birth || new Date().toISOString().split("T")[0], description: input.nextElementSibling.textContent.trim(), }); }); payload.milestones = milestones; // Extract medical tracking data payload.last_visit_date = formData.get("last_visit_date"); payload.next_visit_date = formData.get("next_visit_date"); payload.medical_notes = formData.get("medical_notes"); // Extract vaccination data var vaccinations = []; var vaccinationInputs = form.querySelectorAll('input[name="vaccinations"]:checked'); vaccinationInputs.forEach(function (input) { vaccinations.push({ type: input.value, date_administered: payload.last_visit_date || new Date().toISOString().split("T")[0], status: "completed", }); }); payload.vaccinations = vaccinations; // Collect height and weight history payload.height_history = collectMeasurementHistory("height-history"); payload.weight_history = collectMeasurementHistory("weight-history"); // Validate if (!payload.first_name || !payload.last_name) { showNotification("Please enter both first and last name", "error"); return; } // Add member ID for updates if (isFamilyEditMode && currentFamilyMemberId) { payload.member_id = currentFamilyMemberId; } CommonForms.submit({ processor: "familyAction", payload: payload, onSuccess: function (result) { showNotification(isFamilyEditMode ? "Family member and medical records updated successfully!" : "Family member and medical records added successfully!", "success"); closeFamilyModal(); if (window.location.hash === "#profile" || phoros.page.current === "profile") { loadFamilyList(); } }, }); } function collectMeasurementHistory(containerId) { var container = document.getElementById(containerId); if (!container) return []; var entries = container.querySelectorAll(".measurement-entry"); var history = []; entries.forEach(function (entry) { var value = entry.querySelector("span:first-child").textContent; var dateText = entry.querySelector(".measurement-date").textContent; history.push({ value: value, date: new Date(dateText).toISOString().split("T")[0], timestamp: Date.now(), }); }); return history; } // Family modal functionality is now handled by direct onclick calls // Note: Family modal outside click handling moved to inline onclick attributes for Blaze compatibility /* ============================================ ACCOUNT BUTTON AVATAR MANAGEMENT ============================================ */ var ACCOUNT_PHOTO_FALLBACK_URL = "https://phoroscloud.com/f/flfldr/kysJdCw7kExkeP7uT.png"; function resolveAccountPhotoUrl(candidate) { if (!candidate) { return null; } if (typeof candidate === "string") { var trimmed = candidate.trim(); return trimmed ? trimmed : null; } if (typeof candidate !== "object") { return null; } var urlKeys = ["url", "photoUrl", "downloadUrl", "downloadURL", "href", "location", "secure_url", "secureUrl"]; for (var i = 0; i < urlKeys.length; i++) { var value = candidate[urlKeys[i]]; if (typeof value === "string") { var valTrimmed = value.trim(); if (valTrimmed) { return valTrimmed; } } } return null; } function extractAccountPhotoFromPerson(person) { if (!person) { return null; } var prioritized = [person.profilePhoto, person.photo, person.avatar, person.image, person.picture]; for (var i = 0; i < prioritized.length; i++) { var resolved = resolveAccountPhotoUrl(prioritized[i]); if (resolved) { return resolved; } if (typeof prioritized[i] === "string") { var candidate = prioritized[i].trim(); if (candidate) { return candidate; } } } if (typeof person.photoUrl === "string") { var fromField = person.photoUrl.trim(); if (fromField) { return fromField; } } if (Array.isArray(person.media) && person.media.length) { var mediaItem = person.media[0]; var mediaResolved = resolveAccountPhotoUrl(mediaItem); if (!mediaResolved && mediaItem && typeof mediaItem.url === "string") { var mediaUrl = mediaItem.url.trim(); if (mediaUrl) { mediaResolved = mediaUrl; } } if (mediaResolved) { return mediaResolved; } } return null; } function buildAccountPersonName(person) { if (!person) { return ""; } var first = ""; var last = ""; if (typeof person.firstName === "string") { first = person.firstName.trim(); } if (typeof person.lastName === "string") { last = person.lastName.trim(); } if (!first && typeof person.name === "string") { return person.name.trim(); } if (first && last) { return first + " " + last; } return first || last || ""; } function resolveAccountPerson() { var activePerson = null; if (typeof getActivePerson === "function") { try { activePerson = getActivePerson(); } catch (activePersonError) { activePerson = null; } } if (!activePerson && typeof phoros !== "undefined" && phoros && typeof phoros.person === "function") { try { activePerson = phoros.person(); } catch (phorosPersonError) { activePerson = null; } } return activePerson; } var MOMENTUS_THUMBNAIL_MIN_SCALE = 1; var MOMENTUS_THUMBNAIL_MAX_SCALE = 3; var MOMENTUS_THUMBNAIL_DEFAULT_SCALE = 1; function clampThumbnailValue(value, min, max) { if (!isFinite(value)) { return min; } if (value < min) { return min; } if (value > max) { return max; } return value; } function roundThumbnailValue(value) { return Math.round(value * 100) / 100; } function sanitizeThumbnailPositioning(raw) { if (!raw || typeof raw !== "object") { return null; } var focusX = clampThumbnailValue(Number(raw.focusX), 0, 100); var focusY = clampThumbnailValue(Number(raw.focusY), 0, 100); var scaleValue = Number(raw.scale); if (!isFinite(scaleValue)) { scaleValue = MOMENTUS_THUMBNAIL_DEFAULT_SCALE; } var scale = clampThumbnailValue(scaleValue, MOMENTUS_THUMBNAIL_MIN_SCALE, MOMENTUS_THUMBNAIL_MAX_SCALE); var sanitized = { focusX: roundThumbnailValue(focusX), focusY: roundThumbnailValue(focusY), scale: roundThumbnailValue(scale) }; if (raw.updatedAt && isFinite(raw.updatedAt)) { sanitized.updatedAt = Number(raw.updatedAt); } return sanitized; } function resolveThumbnailPositioningFromAsset(asset) { if (!asset || typeof asset !== "object") { return null; } if (asset.positioning && typeof asset.positioning === "object") { return sanitizeThumbnailPositioning(asset.positioning); } if (asset.thumbnailPositioning && typeof asset.thumbnailPositioning === "object") { return sanitizeThumbnailPositioning(asset.thumbnailPositioning); } return null; } function applyMomentusThumbnailPositioning(element, asset) { if (!element) { return; } var positioning = resolveThumbnailPositioningFromAsset(asset); if (!positioning) { element.style.removeProperty("object-position"); element.style.removeProperty("transform-origin"); element.style.removeProperty("transform"); element.classList.remove("momentus-thumb-adjusted"); element.removeAttribute("data-thumbnail-focus"); return; } var focusX = positioning.focusX; var focusY = positioning.focusY; var scale = positioning.scale || MOMENTUS_THUMBNAIL_DEFAULT_SCALE; element.style.objectPosition = focusX + "% " + focusY + "%"; element.style.transformOrigin = focusX + "% " + focusY + "%"; if (scale && scale !== 1) { element.style.transform = "scale(" + roundThumbnailValue(scale) + ")"; } else { element.style.removeProperty("transform"); } element.classList.add("momentus-thumb-adjusted"); element.setAttribute("data-thumbnail-focus", focusX + "," + focusY + "," + roundThumbnailValue(scale)); } var thumbnailEditor = { initialized: false, modal: null, preview: null, image: null, zoom: null, resetBtn: null, cancelBtn: null, saveBtn: null, status: null, hint: null, title: null, activeConfig: null, focusX: 50, focusY: 50, scale: MOMENTUS_THUMBNAIL_DEFAULT_SCALE, pointerActive: false, pointerId: null, pointerStartX: 0, pointerStartY: 0, startFocusX: 50, startFocusY: 50, viewAspect: "1 / 1", saving: false, keydownHandler: null }; function setThumbnailEditorStatus(message, tone) { if (!thumbnailEditor.status) { return; } if (!message) { thumbnailEditor.status.textContent = ""; thumbnailEditor.status.removeAttribute("data-tone"); return; } thumbnailEditor.status.textContent = message; if (tone) { thumbnailEditor.status.setAttribute("data-tone", tone); } else { thumbnailEditor.status.removeAttribute("data-tone"); } } function updateThumbnailEditorPreview() { if (!thumbnailEditor.image) { return; } var focusX = roundThumbnailValue(thumbnailEditor.focusX); var focusY = roundThumbnailValue(thumbnailEditor.focusY); var scale = roundThumbnailValue(thumbnailEditor.scale); thumbnailEditor.image.style.objectPosition = focusX + "% " + focusY + "%"; thumbnailEditor.image.style.transformOrigin = focusX + "% " + focusY + "%"; if (scale && scale !== 1) { thumbnailEditor.image.style.transform = "scale(" + scale + ")"; } else { thumbnailEditor.image.style.removeProperty("transform"); } } function updateThumbnailEditorScale(nextScale) { var normalized = clampThumbnailValue(nextScale, MOMENTUS_THUMBNAIL_MIN_SCALE, MOMENTUS_THUMBNAIL_MAX_SCALE); thumbnailEditor.scale = roundThumbnailValue(normalized); if (thumbnailEditor.zoom && thumbnailEditor.zoom.value !== String(thumbnailEditor.scale)) { thumbnailEditor.zoom.value = thumbnailEditor.scale; } updateThumbnailEditorPreview(); } function resetThumbnailEditor() { thumbnailEditor.focusX = 50; thumbnailEditor.focusY = 50; thumbnailEditor.scale = MOMENTUS_THUMBNAIL_DEFAULT_SCALE; if (thumbnailEditor.zoom) { thumbnailEditor.zoom.value = thumbnailEditor.scale; } updateThumbnailEditorPreview(); setThumbnailEditorStatus("Position reset.", "info"); } function closeThumbnailEditor(force) { if (!thumbnailEditor.modal) { return false; } if (thumbnailEditor.saving && !force) { return false; } thumbnailEditor.modal.style.display = "none"; thumbnailEditor.modal.removeAttribute("data-active"); setThumbnailEditorStatus("", null); thumbnailEditor.activeConfig = null; thumbnailEditor.saving = false; thumbnailEditor.pointerActive = false; thumbnailEditor.pointerId = null; if (thumbnailEditor.image) { thumbnailEditor.image.removeAttribute("data-dragging"); } if (thumbnailEditor.keydownHandler) { document.removeEventListener("keydown", thumbnailEditor.keydownHandler, true); } return true; } function ensureThumbnailEditorInitialized() { if (thumbnailEditor.initialized) { return true; } var modal = document.getElementById("thumbnailEditorModal"); if (!modal) { return false; } thumbnailEditor.modal = modal; thumbnailEditor.preview = modal.querySelector("[data-thumbnail-editor-preview]"); thumbnailEditor.image = modal.querySelector("[data-thumbnail-editor-image]"); thumbnailEditor.zoom = modal.querySelector("[data-thumbnail-editor-zoom]"); thumbnailEditor.resetBtn = modal.querySelector("[data-thumbnail-editor-reset]"); thumbnailEditor.cancelBtn = modal.querySelector("[data-thumbnail-editor-cancel]"); thumbnailEditor.saveBtn = modal.querySelector("[data-thumbnail-editor-save]"); thumbnailEditor.status = modal.querySelector("[data-thumbnail-editor-status]"); thumbnailEditor.hint = modal.querySelector("[data-thumbnail-editor-hint]"); thumbnailEditor.title = modal.querySelector("[data-thumbnail-editor-title]"); if (thumbnailEditor.zoom) { thumbnailEditor.zoom.addEventListener("input", function (event) { updateThumbnailEditorScale(event && event.target ? event.target.value : thumbnailEditor.scale); }); } if (thumbnailEditor.resetBtn) { thumbnailEditor.resetBtn.addEventListener("click", function () { resetThumbnailEditor(); }); } if (thumbnailEditor.cancelBtn) { thumbnailEditor.cancelBtn.addEventListener("click", function () { closeThumbnailEditor(true); }); } if (thumbnailEditor.saveBtn) { thumbnailEditor.saveBtn.addEventListener("click", function () { handleThumbnailEditorSave(); }); } if (thumbnailEditor.preview) { var preview = thumbnailEditor.preview; preview.addEventListener("pointerdown", function (event) { if (!thumbnailEditor.image) { return; } if (event.pointerType && event.pointerType !== "mouse" && event.pointerType !== "pen") { return; } event.preventDefault(); thumbnailEditor.pointerActive = true; thumbnailEditor.pointerId = event.pointerId; thumbnailEditor.pointerStartX = event.clientX; thumbnailEditor.pointerStartY = event.clientY; thumbnailEditor.startFocusX = thumbnailEditor.focusX; thumbnailEditor.startFocusY = thumbnailEditor.focusY; thumbnailEditor.image.setAttribute("data-dragging", "true"); try { preview.setPointerCapture(event.pointerId); } catch (_) {} }); preview.addEventListener("pointermove", function (event) { if (!thumbnailEditor.pointerActive || thumbnailEditor.pointerId !== event.pointerId) { return; } event.preventDefault(); var deltaX = event.clientX - thumbnailEditor.pointerStartX; var deltaY = event.clientY - thumbnailEditor.pointerStartY; var width = preview.clientWidth || 1; var height = preview.clientHeight || 1; var scaleFactorX = 100 / width; var scaleFactorY = 100 / height; var nextFocusX = clampThumbnailValue(thumbnailEditor.startFocusX + deltaX * scaleFactorX, 0, 100); var nextFocusY = clampThumbnailValue(thumbnailEditor.startFocusY + deltaY * scaleFactorY, 0, 100); thumbnailEditor.focusX = roundThumbnailValue(nextFocusX); thumbnailEditor.focusY = roundThumbnailValue(nextFocusY); updateThumbnailEditorPreview(); }); preview.addEventListener("pointerup", function (event) { if (thumbnailEditor.pointerActive && thumbnailEditor.pointerId === event.pointerId) { event.preventDefault(); thumbnailEditor.pointerActive = false; thumbnailEditor.pointerId = null; if (thumbnailEditor.image) { thumbnailEditor.image.removeAttribute("data-dragging"); } try { preview.releasePointerCapture(event.pointerId); } catch (_) {} } }); preview.addEventListener("pointercancel", function (event) { if (thumbnailEditor.pointerActive && thumbnailEditor.pointerId === event.pointerId) { thumbnailEditor.pointerActive = false; thumbnailEditor.pointerId = null; if (thumbnailEditor.image) { thumbnailEditor.image.removeAttribute("data-dragging"); } try { preview.releasePointerCapture(event.pointerId); } catch (_) {} } }); preview.addEventListener("wheel", function (event) { if (!thumbnailEditor.image) { return; } event.preventDefault(); var delta = event.deltaY || event.deltaX || 0; var direction = delta > 0 ? -1 : 1; var nextScale = thumbnailEditor.scale + direction * 0.05; updateThumbnailEditorScale(nextScale); }, { passive: false }); } thumbnailEditor.initialized = true; return true; } function openThumbnailEditor(config) { if (!ensureThumbnailEditorInitialized()) { return false; } var editorConfig = config || {}; var sanitized = sanitizeThumbnailPositioning(editorConfig.positioning) || { focusX: 50, focusY: 50, scale: MOMENTUS_THUMBNAIL_DEFAULT_SCALE }; thumbnailEditor.activeConfig = editorConfig; thumbnailEditor.focusX = sanitized.focusX; thumbnailEditor.focusY = sanitized.focusY; thumbnailEditor.scale = sanitized.scale; var aspectRatio = editorConfig.aspectRatio; if (thumbnailEditor.preview) { if (typeof aspectRatio === "string" && aspectRatio.trim()) { thumbnailEditor.preview.style.aspectRatio = aspectRatio; thumbnailEditor.viewAspect = aspectRatio; } else { thumbnailEditor.preview.style.aspectRatio = "1 / 1"; thumbnailEditor.viewAspect = "1 / 1"; } } if (thumbnailEditor.image) { thumbnailEditor.image.src = editorConfig.imageUrl || ""; thumbnailEditor.image.alt = editorConfig.imageAlt || "Thumbnail preview"; } if (thumbnailEditor.title) { thumbnailEditor.title.textContent = editorConfig.title || "Adjust Thumbnail"; } if (thumbnailEditor.hint) { thumbnailEditor.hint.textContent = editorConfig.hint || "Drag to reposition. Use the slider to zoom."; } if (thumbnailEditor.zoom) { thumbnailEditor.zoom.value = thumbnailEditor.scale; } setThumbnailEditorStatus("", null); updateThumbnailEditorPreview(); if (thumbnailEditor.modal) { thumbnailEditor.modal.style.display = "flex"; thumbnailEditor.modal.setAttribute("data-active", "1"); } thumbnailEditor.saving = false; if (!thumbnailEditor.keydownHandler) { thumbnailEditor.keydownHandler = function (event) { if (event && event.key === "Escape") { closeThumbnailEditor(true); } }; } document.addEventListener("keydown", thumbnailEditor.keydownHandler, true); return true; } function handleThumbnailEditorSave() { if (!thumbnailEditor.activeConfig || thumbnailEditor.saving) { return; } thumbnailEditor.saving = true; setThumbnailEditorStatus("Saving thumbnail…", "info"); var payload = sanitizeThumbnailPositioning({ focusX: thumbnailEditor.focusX, focusY: thumbnailEditor.focusY, scale: thumbnailEditor.scale, updatedAt: Date.now() }); if (!thumbnailEditor.activeConfig.onSave || typeof thumbnailEditor.activeConfig.onSave !== "function") { setThumbnailEditorStatus("Thumbnail updated.", "success"); closeThumbnailEditor(true); return; } var saveResult; try { saveResult = thumbnailEditor.activeConfig.onSave(payload); } catch (saveError) { setThumbnailEditorStatus(saveError && saveError.message ? saveError.message : "Unable to save thumbnail.", "error"); thumbnailEditor.saving = false; return; } if (saveResult && typeof saveResult.then === "function") { saveResult.then(function () { setThumbnailEditorStatus("Thumbnail updated.", "success"); closeThumbnailEditor(true); }).catch(function (error) { var message = error && error.message ? error.message : "Unable to save thumbnail."; setThumbnailEditorStatus(message, "error"); thumbnailEditor.saving = false; }); } else { setThumbnailEditorStatus("Thumbnail updated.", "success"); closeThumbnailEditor(true); } } if (typeof window.momentus === "undefined") { window.momentus = {}; } if (!window.momentus.thumbnail) { window.momentus.thumbnail = {}; } window.momentus.thumbnail.apply = applyMomentusThumbnailPositioning; window.momentus.thumbnail.sanitize = sanitizeThumbnailPositioning; window.momentus.thumbnail.open = function (config) { return openThumbnailEditor(config || {}); }; window.momentus.thumbnail.close = function () { return closeThumbnailEditor(true); }; /* ============================================ MENU PAGE HIGHLIGHTING - PHOROS INTEGRATION ============================================ */ // Function to update active menu item based on current page function updateMenuHighlight() { // Get current page name from Phoros API var currentPage = phoros.page.name(); // Remove active class from all menu buttons var menuButtons = document.querySelectorAll("#leftMenu .button"); menuButtons.forEach(function (button) { button.classList.remove("active"); }); var mobileAccountButton = document.querySelector(".mobile-account-button"); if (mobileAccountButton) { mobileAccountButton.classList.remove("active"); } // Add active class to current page button var activeButton = null; // Map page names to menu buttons switch (currentPage) { case "dashboard": activeButton = document.querySelector('#leftMenu .button[onclick*="dashboard"]'); break; case "memory": activeButton = document.querySelector('#leftMenu .button[onclick*="memory"]'); break; case "milestone": activeButton = document.querySelector('#leftMenu .button[onclick*="milestone"]'); break; case "messages": activeButton = document.querySelector('#leftMenu .button[onclick*="messages"]'); break; case "he-she-said": activeButton = document.querySelector('#leftMenu .button[onclick*="he-she-said"]'); break; case "vault": activeButton = document.querySelector('#leftMenu .button[onclick*="vault"]'); break; case "profile": activeButton = document.querySelector("#leftMenu .accountButton"); if (mobileAccountButton) { mobileAccountButton.classList.add("active"); } break; } // Apply active class to matching button if (activeButton) { activeButton.classList.add("active"); } } // Set up Phoros route change event listener if (typeof phoros !== "undefined" && phoros.on) { phoros.on.route = function () { // Update menu highlight when page changes setTimeout(updateMenuHighlight, 100); // Small delay to ensure page change completes }; } // Initial menu highlight on page load setTimeout(function () { if (typeof phoros !== "undefined" && phoros.page && phoros.page.name) { updateMenuHighlight(); } }, 500); // Delay to ensure Phoros is fully initialized /* ============================================ CUSTOM MEMORY MODAL FUNCTIONS ============================================ */ // Custom Memory Modal Functions function openCustomMemoryModal(editData) { var modal = document.getElementById("customMemoryModal"); if (modal) { if (!memoryModalInitialized) { initializeMemoryModal(); } else { ensureMemorySubmitHandler(); } modal.style.display = "flex"; document.body.style.overflow = "hidden"; // Check if this is edit mode var isEditMode = editData && editData._id; // Update modal title and button text based on mode var modalTitle = document.querySelector("#customMemoryModal .modal-title"); var submitBtn = document.getElementById("submitMemoryBtn"); var userNameText = document.querySelector("#customMemoryModal .user-name"); var userTimeText = document.querySelector("#customMemoryModal .user-time"); if (isEditMode) { // Edit mode if (modalTitle) modalTitle.textContent = "Edit Memory"; if (userNameText) userNameText.textContent = "Update Memory"; if (userTimeText) userTimeText.textContent = "Update the details below to modify your memory"; if (submitBtn) { submitBtn.textContent = "Update Memory"; } // Pre-populate form fields document.getElementById("memoryCaption").value = editData.caption || ""; // Pre-populate date field var memoryDateInput = document.getElementById("memoryDate"); if (memoryDateInput && editData.memory_date) { var memoryDate = new Date(editData.memory_date); memoryDateInput.value = memoryDate.toISOString().slice(0, 16); } else if (memoryDateInput && editData.dateCreate) { var createDate = new Date(editData.dateCreate); memoryDateInput.value = createDate.toISOString().slice(0, 16); } // Store edit data for form submission modal.setAttribute("data-edit-id", editData._id); var existingMedia = Array.isArray(editData.media) ? editData.media.slice() : []; mergeMemoryMediaItems(existingMedia, { replace: true }); // Reset previews then show existing media if present try { clearMemoryDropZonePreview(); flushMemoryPreviewUrls(); var firstMedia = Array.isArray(editData.media) && editData.media.length ? editData.media[0] : null; if (firstMedia && firstMedia.url) { var mime = firstMedia.mimeType || ""; if (firstMedia.kind === 'audio' || (mime && mime.indexOf('audio/') === 0)) { showAudioPreview(firstMedia.url); } else if (firstMedia.kind === 'video' || (mime && mime.indexOf('video/') === 0)) { showVideoPreview(firstMedia.url); } else if (firstMedia.kind === 'image' || (mime && mime.indexOf('image/') === 0)) { showImagePreview(firstMedia.url); } else { showGenericFilePreview("File attached"); } } } catch (e) { } } else { // Create mode if (modalTitle) modalTitle.textContent = "Create Post"; if (userNameText) userNameText.textContent = "Share Your Moment"; if (userTimeText) userTimeText.textContent = "Create a beautiful memory to share with your family"; if (submitBtn) { submitBtn.textContent = "Create Memory"; } // Clear form fields for new entry document.getElementById("memoryCaption").value = ""; // Check for pre-selected date from calendar var selectedDate = sessionStorage.getItem("selectedMemoryDate"); var selectedType = sessionStorage.getItem("selectedMediaType"); // Set date - either from calendar selection or current date/time var memoryDateInput = document.getElementById("memoryDate"); if (memoryDateInput) { if (selectedDate) { // Use selected date from calendar and clear it from storage var calendarDate = new Date(selectedDate + "T12:00:00"); // Add noon time memoryDateInput.value = calendarDate.toISOString().slice(0, 16); sessionStorage.removeItem("selectedMemoryDate"); } else { // Use current date/time as default var now = new Date(); memoryDateInput.value = now.toISOString().slice(0, 16); } } // Handle selected media type from calendar if (selectedType) { // TODO: Set media type in the form when that functionality is added sessionStorage.removeItem("selectedMediaType"); } // Clear edit data modal.removeAttribute("data-edit-id"); modal.removeAttribute("data-content-type-id"); clearMemoryMediaSelection(); } // User info UI removed } } function openMemoryModalForEdit(memoryId) { // Fetch the memory data first, then open modal phoros.processor( "memoryAction", { type: "get", payload: { memoryId: memoryId, }, }, function (error, result) { if (!error && result && result.success && result.data && result.data.memory) { var memoryData = result.data.memory; openCustomMemoryModal(memoryData); } else { var msg = (error && (error.message || String(error))) || (result && result.message) || "Could not load memory data for editing."; Swal.fire({ icon: "error", title: "Error", text: msg }); } } ); } function closeCustomMemoryModal() { var modal = document.getElementById("customMemoryModal"); if (modal) { modal.style.display = "none"; document.body.style.overflow = "auto"; // Clear form data var captionEl = document.getElementById("memoryCaption"); var fileInputEl = document.getElementById("memoryFileInput"); if (captionEl) captionEl.value = ""; if (fileInputEl) fileInputEl.value = ""; // Clear previews and any pending media selections clearMemoryMediaSelection(); } } try { window._milestonePendingMedia = window._milestonePendingMedia || []; } catch (milestoneMediaInitError) { window._milestonePendingMedia = []; } try { window._milestoneOriginalMedia = window._milestoneOriginalMedia || []; } catch (milestoneOriginalInitError) { window._milestoneOriginalMedia = []; } var memoryVaultItemsCache = []; var memoryVaultSelection = []; function normalizeVaultMediaItem(vaultItem) { if (!vaultItem) { return null; } var mime = vaultItem.mimeType || vaultItem.mediaType || ""; var url = vaultItem.fileUrl || vaultItem.url || vaultItem.src || ""; if (!url) { return null; } var kind = vaultItem.kind || (mime && mime.indexOf("image/") === 0 ? "image" : (mime && mime.indexOf("audio/") === 0 ? "audio" : (mime && mime.indexOf("video/") === 0 ? "video" : "file"))); return { kind: kind, url: url, mimeType: mime || null, sizeBytes: typeof vaultItem.sizeBytes === "number" ? vaultItem.sizeBytes : (typeof vaultItem.size === "number" ? vaultItem.size : null), }; } function getVaultItemId(item) { return item && (item._id || item.vaultId || item.id || item.fileUrl || item.url || item.src || ""); } function updateMemoryVaultAddButton() { var addBtn = document.getElementById("memoryVaultPickerAddBtn"); if (!addBtn) { return; } addBtn.disabled = memoryVaultSelection.length === 0; } function updateMemoryVaultSelectionUI() { var grid = document.getElementById("memoryVaultPickerGrid"); if (!grid) { return; } var cards = grid.querySelectorAll(".memory-vault-picker-card"); for (var i = 0; i < cards.length; i++) { var card = cards[i]; var itemId = card.getAttribute("data-item-id"); var isSelected = memoryVaultSelection.indexOf(itemId) !== -1; card.setAttribute("aria-pressed", isSelected ? "true" : "false"); if (isSelected) { card.classList.add("selected"); var badge = card.querySelector(".memory-vault-picker-card__select"); if (badge) { badge.textContent = "✓"; } } else { card.classList.remove("selected"); var badgeUnchecked = card.querySelector(".memory-vault-picker-card__select"); if (badgeUnchecked) { badgeUnchecked.textContent = "+"; } } } updateMemoryVaultAddButton(); } function toggleMemoryVaultSelection(itemId) { if (!itemId) { return; } var index = memoryVaultSelection.indexOf(itemId); if (index === -1) { memoryVaultSelection.push(itemId); } else { memoryVaultSelection.splice(index, 1); } updateMemoryVaultSelectionUI(); } function handleMemoryVaultCardClick(element) { if (!element) { return; } var itemId = element.getAttribute("data-item-id") || ""; if (!itemId) { return; } toggleMemoryVaultSelection(itemId); element.setAttribute("aria-pressed", memoryVaultSelection.indexOf(itemId) !== -1 ? "true" : "false"); } function handleMemoryVaultCardKeydown(event) { if (!event) { return; } if (event.key === "Enter" || event.key === " ") { event.preventDefault(); handleMemoryVaultCardClick(event.currentTarget || event.target); } } function renderMemoryVaultCards(items) { var grid = document.getElementById("memoryVaultPickerGrid"); var statusEl = document.getElementById("memoryVaultPickerStatus"); if (!grid) { return; } while (grid.firstChild) { grid.removeChild(grid.firstChild); } if (!Array.isArray(items) || !items.length) { if (statusEl) { statusEl.textContent = "No vault media available yet. Upload files to the vault to reuse them here."; } updateMemoryVaultAddButton(); return; } if (statusEl) { statusEl.textContent = "Select one or more files to attach."; } for (var i = 0; i < items.length; i++) { var item = items[i]; var itemId = getVaultItemId(item); if (!itemId) { continue; } var card = document.createElement("div"); card.className = "memory-vault-picker-card"; card.setAttribute("data-item-id", itemId); card.tabIndex = 0; card.setAttribute("role", "button"); card.setAttribute("aria-pressed", memoryVaultSelection.indexOf(itemId) !== -1 ? "true" : "false"); card.setAttribute("onclick", "handleMemoryVaultCardClick(this)"); card.setAttribute("onkeydown", "handleMemoryVaultCardKeydown(event)"); var mime = item.mimeType || ""; var previewElement; if (mime.indexOf("image/") === 0) { previewElement = document.createElement("img"); previewElement.src = item.fileUrl || item.url || ""; previewElement.alt = item.title || "Vault image"; } else if (mime.indexOf("video/") === 0) { previewElement = document.createElement("video"); previewElement.src = item.fileUrl || item.url || ""; previewElement.muted = true; previewElement.loop = true; previewElement.playsInline = true; previewElement.autoplay = false; previewElement.setAttribute("aria-label", item.title || "Vault video"); } else { previewElement = document.createElement("div"); previewElement.style.display = "flex"; previewElement.style.alignItems = "center"; previewElement.style.justifyContent = "center"; previewElement.style.height = "140px"; previewElement.style.background = "var(--momentus-background)"; previewElement.textContent = item.title || "Vault file"; } card.appendChild(previewElement); var badge = document.createElement("div"); badge.className = "memory-vault-picker-card__select"; badge.textContent = "+"; card.appendChild(badge); var meta = document.createElement("div"); meta.className = "memory-vault-picker-card__meta"; var label = item.title || item.originalName || (item.fileUrl ? item.fileUrl.split("/").pop() : "Vault item"); meta.textContent = label; card.appendChild(meta); grid.appendChild(card); } updateMemoryVaultSelectionUI(); } function openMemoryVaultPicker() { var modal = document.getElementById("memoryVaultPicker"); var statusEl = document.getElementById("memoryVaultPickerStatus"); if (!modal) { return; } memoryVaultSelection = []; modal.style.display = "flex"; if (statusEl) { statusEl.textContent = "Loading vault media…"; } updateMemoryVaultAddButton(); var requestPayload = { category: "gallery_file", limit: 50 }; if (typeof phoros === "undefined" || typeof phoros.processor !== "function") { if (statusEl) { statusEl.textContent = "Vault service unavailable right now."; } return; } phoros.processor( "Get: Vault Items", { payload: requestPayload }, function (err, result) { if (err) { if (statusEl) { statusEl.textContent = "Unable to load vault media."; } return; } var items = []; if (result && result.success && result.data) { if (Array.isArray(result.data.items)) { items = result.data.items; } else if (Array.isArray(result.data)) { items = result.data; } } else if (Array.isArray(result)) { items = result; } memoryVaultItemsCache = items; renderMemoryVaultCards(items); } ); } function closeMemoryVaultPicker() { var modal = document.getElementById("memoryVaultPicker"); if (modal) { modal.style.display = "none"; } memoryVaultSelection = []; updateMemoryVaultAddButton(); } function applyMemoryVaultSelection() { if (!memoryVaultSelection.length) { showNotification("Select at least one vault file to continue.", "error"); return; } var normalized = []; for (var i = 0; i < memoryVaultSelection.length; i++) { var targetId = memoryVaultSelection[i]; for (var j = 0; j < memoryVaultItemsCache.length; j++) { var raw = memoryVaultItemsCache[j]; if (getVaultItemId(raw) === targetId) { var normalizedItem = normalizeVaultMediaItem(raw); if (normalizedItem) { normalized.push(normalizedItem); } break; } } } if (!normalized.length) { showNotification("We could not determine any media to attach.", "error"); return; } if (typeof window.applyMemoryMediaSelection === "function") { window.applyMemoryMediaSelection(normalized); } else { mergeMemoryMediaItems(normalized); } var successMessage = normalized.length > 1 ? "Vault media attached (" + normalized.length + ")." : "Vault media attached."; showNotification(successMessage, "success"); closeMemoryVaultPicker(); } window.openMemoryVaultPicker = openMemoryVaultPicker; window.closeMemoryVaultPicker = closeMemoryVaultPicker; window.applyMemoryVaultSelection = applyMemoryVaultSelection; function handleMemoryFormSubmit(event) { return handleMemoryFormSubmitUnified(event); } function handleMemoryFormSubmitUnified(event) { if (event) { event.preventDefault(); } var caption = document.getElementById("memoryCaption").value; var visibility = "family"; var memoryDate = document.getElementById("memoryDate").value; // pending media selected via phoros.upload var v = CommonForms.validateRequired([ { id: "memoryCaption", value: caption, message: "Please add a caption for your memory." }, { id: "memoryDate", value: memoryDate, message: "Please select a date for your memory." }, ]); if (!v.ok) { Swal.fire({ icon: "error", title: "Required Field", text: v.message }); var el = document.getElementById(v.id); if (el) el.focus(); return; } var modal = document.getElementById("customMemoryModal"); var editId = modal ? modal.getAttribute("data-edit-id") : null; var isEditMode = !!editId; var normalizedDate = CommonForms.formatMsFromInput(memoryDate); var payload = { title: caption.substring(0, 50) + (caption.length > 50 ? "..." : ""), caption: caption, type: ["Picture"], memory_date: normalizedDate, visibility: visibility, }; var pendingMedia = normalizeMemoryMediaItems(ensureMemoryPendingMediaArray()); if (pendingMedia.length) { payload.media = (payload.media || []).concat(pendingMedia); } if (isEditMode) { payload.memoryId = editId; } var uploadCfg = null; // We already handled uploads during selection CommonForms.submit({ button: "#submitMemoryBtn", processor: "memoryAction", payload: payload, uploadConfig: uploadCfg, loadingText: isEditMode ? " Updating…" : " Posting…", onSuccess: function () { closeCustomMemoryModal(); Swal.fire({ icon: "success", title: isEditMode ? "Memory Updated!" : "Memory Posted!", timer: 2000, showConfirmButton: false }); var refreshList = null; if (typeof populateList === "function") refreshList = populateList; // memory list renderer in 02_memoryList.html else if (typeof memoryList === "function") refreshList = memoryList; // legacy name if present if (refreshList) setTimeout(refreshList, 300); }, }); } var memoryModalInitialized = false; function ensureMemorySubmitHandler() { var submitBtn = document.getElementById("submitMemoryBtn"); if (!submitBtn) { return; } if (!submitBtn.getAttribute("data-handler-bound")) { submitBtn.setAttribute("data-handler-bound", "true"); } } // Initialize modal event handlers function initializeMemoryModal() { if (memoryModalInitialized) { ensureMemorySubmitHandler(); return; } // File browse button var browseBtn = document.getElementById("browseFilesBtn"); var fileInput = document.getElementById("memoryFileInput"); var uploadBtn = document.getElementById("uploadFileBtn"); var uploadApiAvailable = typeof phoros !== "undefined" && typeof phoros.upload === "function"; var uploadOptions = { accept: "image/*,audio/*,video/*", multiple: true, storageFolder: "vault/gallery" }; function kindFromFile(file) { if (!file || !file.type) return "file"; if (file.type.indexOf("image/") === 0) return "image"; if (file.type.indexOf("audio/") === 0) return "audio"; if (file.type.indexOf("video/") === 0) return "video"; return "file"; } function renderPreviewForMedia(mediaItem, rawFile) { if (!mediaItem) return; if (mediaItem.kind === "image" && mediaItem.url) { showImagePreview(mediaItem.url); return; } if (mediaItem.kind === "audio") { showAudioPreview(mediaItem.url || ""); return; } if (mediaItem.kind === "video" && mediaItem.url) { showVideoPreview(mediaItem.url); return; } var label = rawFile && rawFile.name ? rawFile.name : "File attached"; showGenericFilePreview(label); } function handleUploadSuccess(res) { var files = (res && res.files) || []; var urls = (res && res.urls) || []; var media = CommonForms.buildMediaItems(files, urls); if (!media.length) { Swal.fire({ icon: "error", title: "Upload Error", text: "No files were uploaded." }); return false; } var merged = mergeMemoryMediaItems(media); clearMemoryDropZonePreview(); flushMemoryPreviewUrls(); renderPreviewForMedia(media[0] || (merged && merged[0]), files[0]); return true; } function openUploadFlow(manualFiles) { if (!uploadApiAvailable) { return Promise.resolve({ success: false, reason: "unavailable" }); } var options = Object.assign({}, uploadOptions); if (manualFiles && manualFiles.length) { options.prefillFiles = manualFiles; } return CommonForms.uploadFiles(options) .then(function (res) { var ok = handleUploadSuccess(res); return ok ? { success: true } : { success: false, reason: "error" }; }) .catch(function (err) { var message = (err && err.message) || "Unable to upload files."; Swal.fire({ icon: "error", title: "Upload Error", text: message }); return { success: false, reason: "error" }; }); } var memoryUploadBridge = window.memoryUploadBridge || {}; memoryUploadBridge.available = uploadApiAvailable; memoryUploadBridge.canUseUploader = uploadApiAvailable; memoryUploadBridge.deferNativeOnce = false; memoryUploadBridge.lastFailureReason = memoryUploadBridge.lastFailureReason || null; memoryUploadBridge.open = function (manualFiles) { return openUploadFlow(manualFiles); }; memoryUploadBridge.requestNativeOnce = function (reason) { memoryUploadBridge.deferNativeOnce = true; memoryUploadBridge.lastFailureReason = reason || null; }; memoryUploadBridge.consumeNativeOnce = function () { var shouldDefer = memoryUploadBridge.deferNativeOnce; memoryUploadBridge.deferNativeOnce = false; return shouldDefer; }; memoryUploadBridge.clearFailure = function () { memoryUploadBridge.lastFailureReason = null; }; window.memoryUploadBridge = memoryUploadBridge; function handleNativeSelection(files, opts) { if (!files || !files.length) return; clearMemoryDropZonePreview(); flushMemoryPreviewUrls(); var first = files[0]; var kind = kindFromFile(first); var previewUrl = null; if ((kind === "image" || kind === "video") && typeof URL !== "undefined" && typeof URL.createObjectURL === "function") { try { previewUrl = URL.createObjectURL(first); registerMemoryPreviewUrl(previewUrl); } catch (e) { } } renderPreviewForMedia({ kind: kind, url: previewUrl }, first); try { window._memoryPendingMedia = []; } catch (e) { window._memoryPendingMedia = []; } renderMemoryMediaPreview([]); if (!opts || !opts.skipWarning) { Swal.fire({ icon: "warning", title: "Upload Unavailable", text: "Files were not uploaded because the Phoros upload service is unavailable." }); } } if (fileInput) { fileInput.addEventListener("change", function (event) { var files = Array.prototype.slice.call((event.target && event.target.files) || []); if (!files.length) return; if (memoryUploadBridge.available && !memoryUploadBridge.deferNativeOnce && typeof memoryUploadBridge.open === "function") { memoryUploadBridge.open(files).then(function (result) { if (!result.success) { handleNativeSelection(files, { skipWarning: result.reason !== "unavailable" }); } }); return; } var failureReason = memoryUploadBridge.lastFailureReason || null; var skipWarning = failureReason && failureReason !== "unavailable"; handleNativeSelection(files, skipWarning ? { skipWarning: true } : null); if (typeof memoryUploadBridge.consumeNativeOnce === "function") { memoryUploadBridge.consumeNativeOnce(); } else { memoryUploadBridge.deferNativeOnce = false; } memoryUploadBridge.clearFailure(); }); } // Submit button var submitBtn = document.getElementById("submitMemoryBtn"); ensureMemorySubmitHandler(); function applyMediaSelection(mediaItems) { if (!Array.isArray(mediaItems) || !mediaItems.length) { return; } var merged = mergeMemoryMediaItems(mediaItems); clearMemoryDropZonePreview(); flushMemoryPreviewUrls(); renderPreviewForMedia(mediaItems[0] || (merged && merged[0])); } window.applyMemoryMediaSelection = applyMediaSelection; memoryModalInitialized = true; } function triggerMemoryNativePicker() { initializeMemoryModal(); var fileInput = document.getElementById("memoryFileInput"); var bridge = window.memoryUploadBridge || {}; if (bridge.available && typeof bridge.open === "function") { try { var uploadPromise = bridge.open(); if (uploadPromise && typeof uploadPromise.then === "function") { uploadPromise .then(function (result) { if (result && result.success) { if (typeof bridge.clearFailure === "function") { bridge.clearFailure(); } return; } if (result && result.reason === "unavailable") { bridge.available = false; if (typeof bridge.requestNativeOnce === "function") { bridge.requestNativeOnce("unavailable"); } else { bridge.deferNativeOnce = true; bridge.lastFailureReason = "unavailable"; } openMemoryNativeDialog(fileInput); return; } if (typeof bridge.requestNativeOnce === "function") { bridge.requestNativeOnce((result && result.reason) || "error"); } else { bridge.deferNativeOnce = true; bridge.lastFailureReason = (result && result.reason) || "error"; } openMemoryNativeDialog(fileInput); }) .catch(function () { if (typeof bridge.requestNativeOnce === "function") { bridge.requestNativeOnce("error"); } else { bridge.deferNativeOnce = true; bridge.lastFailureReason = "error"; } openMemoryNativeDialog(fileInput); }); return; } } catch (memoryUploadError) { if (typeof bridge.requestNativeOnce === "function") { bridge.requestNativeOnce("error"); } else { bridge.deferNativeOnce = true; bridge.lastFailureReason = "error"; } } } openMemoryNativeDialog(fileInput); } function openMemoryNativeDialog(fileInput) { if (!fileInput) { return; } fileInput.value = ""; fileInput.click(); } // Initialize Fomantic UI Components function initializeFomanticUIComponents() { // Initialize all dropdowns in forms setTimeout(function () { if (typeof $ !== "undefined") { // Initialize all UI dropdowns $(".ui.dropdown").dropdown(); // Specific initialization for Family modal dropdown $("#familyRelationship").dropdown({ onChange: function (value, text, $choice) { // Update the select element value for form submission document.getElementById("familyRelationship").value = value; }, }); // Specific initialization for Milestone modal dropdown $("#milestoneCategory").dropdown({ onChange: function (value, text, $choice) { // Update the select element value for form submission document.getElementById("milestoneCategory").value = value; }, }); } }, 100); } // Initialize dropdowns when modals open function initializeModalDropdowns() { if (typeof $ !== "undefined") { setTimeout(function () { $(".ui.dropdown").dropdown(); }, 50); } } // Initialize modal when page loads setTimeout(function () { initializeMemoryModal(); initializeFomanticUIComponents(); }, 600); // Custom Family Modal Functions function resetFamilyPhotoPreview() { var preview = document.getElementById("familyPhotoPreview"); if (preview) { while (preview.firstChild) { preview.removeChild(preview.firstChild); } var placeholder = document.createElement("span"); placeholder.className = "family-photo-placeholder"; placeholder.textContent = "No photo uploaded"; preview.appendChild(placeholder); } var removeBtn = document.getElementById("familyPhotoRemoveBtn"); if (removeBtn) { removeBtn.style.display = "none"; } var adjustBtn = document.getElementById("familyPhotoAdjustBtn"); if (adjustBtn) { adjustBtn.style.display = "none"; } } function resetFamilyPhotoState() { try { window._familyPendingMedia = []; } catch (familyResetError) { window._familyPendingMedia = []; } resetFamilyPhotoPreview(); var modal = document.getElementById("customFamilyModal"); if (modal) { modal.removeAttribute("data-photo-seeded"); modal.removeAttribute("data-photo-removed"); } var fileInput = document.getElementById("familyPhotoFileInput"); if (fileInput) { fileInput.value = ""; } } function setFamilyPhotoPreview(mediaItem, label) { var preview = document.getElementById("familyPhotoPreview"); var removeBtn = document.getElementById("familyPhotoRemoveBtn"); var adjustBtn = document.getElementById("familyPhotoAdjustBtn"); var modal = document.getElementById("customFamilyModal"); if (!preview) { return; } while (preview.firstChild) { preview.removeChild(preview.firstChild); } if (mediaItem && mediaItem.url) { var img = document.createElement("img"); img.src = mediaItem.url; var altText = label && label.trim() ? label.trim() : "Family member profile photo"; img.alt = altText; preview.appendChild(img); if (window.momentus && window.momentus.thumbnail && typeof window.momentus.thumbnail.apply === "function") { window.momentus.thumbnail.apply(img, mediaItem); } if (removeBtn) { removeBtn.style.display = "inline-flex"; } if (adjustBtn) { adjustBtn.style.display = "inline-flex"; } if (modal) { modal.setAttribute("data-photo-seeded", "true"); modal.removeAttribute("data-photo-removed"); } } else { var placeholder = document.createElement("span"); placeholder.className = "family-photo-placeholder"; placeholder.textContent = "No photo uploaded"; preview.appendChild(placeholder); if (removeBtn) { removeBtn.style.display = "none"; } if (adjustBtn) { adjustBtn.style.display = "none"; } if (modal) { modal.removeAttribute("data-photo-seeded"); } } } function resolveFamilyPhotoLabel() { var firstNameInput = document.getElementById("familyFirstName"); var lastNameInput = document.getElementById("familyLastName"); var rawLabel = ""; if (firstNameInput && firstNameInput.value) { rawLabel += firstNameInput.value.trim(); } if (lastNameInput && lastNameInput.value) { if (rawLabel) { rawLabel += " "; } rawLabel += lastNameInput.value.trim(); } return rawLabel.trim(); } function handleFamilyPhotoUploadResult(mediaItems, label) { if (!Array.isArray(mediaItems) || !mediaItems.length || !mediaItems[0] || !mediaItems[0].url) { if (typeof Swal !== "undefined") { Swal.fire({ icon: "error", title: "Upload Error", text: "Unable to attach profile photo." }); } return false; } var firstItem = mediaItems[0]; if (firstItem.thumbnailPositioning) { try { delete firstItem.thumbnailPositioning; } catch (thumbnailClearError) { firstItem.thumbnailPositioning = null; } } try { window._familyPendingMedia = [firstItem]; } catch (familyUploadError) { window._familyPendingMedia = [firstItem]; } var resolvedLabel = label && label.trim() ? label : resolveFamilyPhotoLabel(); setFamilyPhotoPreview(firstItem, resolvedLabel); return true; } function startFamilyPhotoUpload() { var label = resolveFamilyPhotoLabel(); var cfg = { storageFolder: "profiles/family", accept: "image/*", multiple: false, maxSize: 5 * 1024 * 1024, }; if (typeof CommonForms !== "undefined" && typeof CommonForms.uploadFiles === "function") { CommonForms.uploadFiles(cfg) .then(function (res) { var mediaItems = CommonForms.buildMediaItems((res && res.files) || [], (res && res.urls) || []); handleFamilyPhotoUploadResult(mediaItems, label); }) .catch(function (uploadErr) { var message = (uploadErr && uploadErr.message) || "Unable to upload photo."; if (typeof Swal !== "undefined") { Swal.fire({ icon: "error", title: "Upload Error", text: message }); } }); return; } if (typeof phoros !== "undefined" && typeof phoros.upload === "function") { phoros.upload(cfg, function (file, url) { if (!url) { if (typeof Swal !== "undefined") { Swal.fire({ icon: "error", title: "Upload Error", text: "No photo was uploaded." }); } return; } var mediaItem = { kind: "image", url: url, mimeType: file && file.type ? file.type : null, sizeBytes: file && typeof file.size === "number" ? file.size : null, name: file && file.name ? file.name : null, }; handleFamilyPhotoUploadResult([mediaItem], label); }); return; } var nativeInput = document.getElementById("familyPhotoFileInput"); if (nativeInput) { nativeInput.value = ""; nativeInput.click(); } else if (typeof Swal !== "undefined") { Swal.fire({ icon: "warning", title: "Upload Unavailable", text: "Uploads require the Momentus service. Please try again later." }); } } function openFamilyPhotoAdjust() { if (!(window.momentus && window.momentus.thumbnail && typeof window.momentus.thumbnail.open === "function")) { if (typeof Swal !== "undefined") { Swal.fire({ icon: "info", title: "Editor unavailable", text: "Thumbnail editor is loading. Please try again shortly." }); } return; } var pendingMedia = null; try { if (Array.isArray(window._familyPendingMedia) && window._familyPendingMedia.length) { pendingMedia = window._familyPendingMedia[0]; } } catch (pendingError) { pendingMedia = null; } if (!pendingMedia || !pendingMedia.url) { if (typeof Swal !== "undefined") { Swal.fire({ icon: "info", title: "Add a photo first", text: "Upload a family photo before adjusting the frame." }); } return; } var label = resolveFamilyPhotoLabel() || "Family member profile photo"; var positioning = pendingMedia.thumbnailPositioning || pendingMedia.positioning || null; if (positioning && window.momentus.thumbnail && typeof window.momentus.thumbnail.sanitize === "function") { positioning = window.momentus.thumbnail.sanitize(positioning); } window.momentus.thumbnail.open({ title: "Adjust Family Photo", imageUrl: pendingMedia.url, imageAlt: label, positioning: positioning, aspectRatio: "1 / 1", onSave: function (payload) { return new Promise(function (resolve, reject) { if (!payload) { reject(new Error("Invalid thumbnail data.")); return; } var sanitized = payload; if (window.momentus && window.momentus.thumbnail && typeof window.momentus.thumbnail.sanitize === "function") { sanitized = window.momentus.thumbnail.sanitize(payload); } try { pendingMedia.thumbnailPositioning = sanitized; if (Array.isArray(window._familyPendingMedia)) { window._familyPendingMedia[0] = pendingMedia; } } catch (assignError) { console.warn("family photo adjust assignment error", assignError); } setFamilyPhotoPreview(pendingMedia, label); resolve(); }); }, }); } function handleFamilyPhotoFileChange(input) { if (!input || !input.files || !input.files.length) { return; } if (typeof Swal !== "undefined") { Swal.fire({ icon: "warning", title: "Upload Unavailable", text: "Uploads require the Momentus service. Please try again later." }); } input.value = ""; } function clearFamilyPhoto() { try { window._familyPendingMedia = []; } catch (familyClearError) { window._familyPendingMedia = []; } resetFamilyPhotoPreview(); var modal = document.getElementById("customFamilyModal"); if (modal) { modal.setAttribute("data-photo-removed", "true"); modal.removeAttribute("data-photo-seeded"); } } function openFamilyModal(editData) { var modal = document.getElementById("customFamilyModal"); if (modal) { modal.style.display = "flex"; document.body.style.overflow = "hidden"; // Initialize Fomantic UI components when modal opens initializeModalDropdowns(); resetFamilyPhotoState(); // Check if this is edit mode var isEditMode = editData && editData._id; // Update modal title and button text based on mode var modalTitle = document.querySelector("#customFamilyModal .modal-title"); var submitBtn = document.getElementById("submitFamilyBtn"); var userNameText = document.querySelector("#customFamilyModal .user-name"); var userTimeText = document.querySelector("#customFamilyModal .user-time"); // Ensure modal title is visible and has content if (modalTitle) { modalTitle.style.display = "block"; modalTitle.style.visibility = "visible"; } if (isEditMode) { // Edit mode if (modalTitle) modalTitle.textContent = "Edit Family Member"; if (userNameText) userNameText.textContent = "Update Family Member"; if (userTimeText) userTimeText.textContent = "Update the details below to modify family member information"; if (submitBtn) { // Clear existing content while (submitBtn.firstChild) { submitBtn.removeChild(submitBtn.firstChild); } var saveIcon = document.createElement("i"); saveIcon.className = "save icon"; submitBtn.appendChild(saveIcon); submitBtn.appendChild(document.createTextNode(" Update Family Member")); } // Pre-populate form fields document.getElementById("familyFirstName").value = editData.firstName || ""; document.getElementById("familyLastName").value = editData.lastName || ""; document.getElementById("familyDateOfBirth").value = editData.dateOfBirth || ""; document.getElementById("familyRelationship").value = editData.relationship || ""; var seededMedia = Array.isArray(editData.media) ? editData.media.filter(function (item) { return item && item.url; }) : []; if (seededMedia.length) { try { window._familyPendingMedia = seededMedia.slice(0, 1); } catch (seedError) { window._familyPendingMedia = seededMedia.slice(0, 1); } var seededLabel = ((editData.firstName || "") + " " + (editData.lastName || "")).trim(); setFamilyPhotoPreview(seededMedia[0], seededLabel); } // Store edit data for form submission modal.setAttribute("data-edit-id", editData._id); } else { // Create mode if (modalTitle) { modalTitle.textContent = "Add Family Member"; modalTitle.style.display = "block"; modalTitle.style.visibility = "visible"; } if (userNameText) userNameText.textContent = "Add New Family Member"; if (userTimeText) userTimeText.textContent = "Complete the details below to add them to your family"; if (submitBtn) { // Clear existing content while (submitBtn.firstChild) { submitBtn.removeChild(submitBtn.firstChild); } var saveIcon = document.createElement("i"); saveIcon.className = "save icon"; submitBtn.appendChild(saveIcon); submitBtn.appendChild(document.createTextNode(" Add Family Member")); } // Clear edit data modal.removeAttribute("data-edit-id"); modal.removeAttribute("data-content-type-id"); } } } function openFamilyModalForEdit(familyId) { // Fetch the family member data first, then open modal phoros.processor( "familyAction", { type: "get", payload: { member_id: familyId, }, }, function (error, result) { if (!error && result && result.success && result.data && result.data.family_member) { var familyData = result.data.family_member; openFamilyModal(familyData); } else { Swal.fire({ icon: "error", title: "Error", text: (error && (error.message || String(error))) || (result && result.message) || "Could not load family member data for editing.", }); } } ); } function closeFamilyModal() { var modal = document.getElementById("customFamilyModal"); if (modal) { modal.style.display = "none"; document.body.style.overflow = "auto"; resetFamilyPhotoState(); // Clear form data var form = document.getElementById("familyForm"); if (form) { form.reset(); } } } function handleFamilyFormSubmit(event) { if (event) { event.preventDefault(); } // Get form data var firstName = document.getElementById("familyFirstName").value.trim(); var lastName = document.getElementById("familyLastName").value.trim(); var dateOfBirth = document.getElementById("familyDateOfBirth").value; var relationship = document.getElementById("familyRelationship").value; var v = CommonForms.validateRequired([ { id: "familyFirstName", value: firstName, message: "First name is required." }, { id: "familyLastName", value: lastName, message: "Last name is required." }, ]); if (!v.ok) { Swal.fire({ icon: "error", title: "Required Fields", text: v.message }); var el = document.getElementById(v.id); if (el) el.focus(); return; } var modal = document.getElementById("customFamilyModal"); var editId = modal ? modal.getAttribute("data-edit-id") : null; var isEditMode = !!editId; var payload = { // legacy first_name: firstName, last_name: lastName, date_of_birth: dateOfBirth, relationship: relationship, // new schema firstName: firstName, lastName: lastName, dateOfBirth: CommonForms.formatMsFromInput(dateOfBirth), relationshipType: relationship, }; var pendingMedia = []; try { if (Array.isArray(window._familyPendingMedia)) { pendingMedia = window._familyPendingMedia.filter(function (item) { return item && item.url; }); } } catch (familyMediaError) { pendingMedia = []; } if (pendingMedia.length) { payload.media = pendingMedia.slice(0, 1); } else if (modal && modal.getAttribute("data-photo-removed") === "true") { payload.media = []; } if (isEditMode) { payload.member_id = editId; } CommonForms.submit({ button: "#submitFamilyBtn", processor: "familyAction", payload: payload, loadingText: isEditMode ? " Updating…" : " Adding…", onSuccess: function (result) { closeFamilyModal(); var nameText = result && result.data && result.data.member_name ? result.data.member_name : ""; Swal.fire({ icon: "success", title: isEditMode ? "Family Member Updated!" : "Family Member Added!", text: nameText ? "Successfully saved " + nameText + "." : undefined, timer: 2000, showConfirmButton: false }); if (typeof populateList === "function") setTimeout(populateList, 800); }, }); } // Custom Message Modal Functions function openMessageModal(editData) { var modal = document.getElementById("customMessageModal"); if (modal) { modal.style.display = "flex"; document.body.style.overflow = "hidden"; // Check for reply data in session storage var replyToSender = sessionStorage.getItem("replyToSender"); var replyToRecipient = sessionStorage.getItem("replyToRecipient"); var replyToMessageId = sessionStorage.getItem("replyToMessageId"); var selectedMessageDate = sessionStorage.getItem("selectedMessageDate"); var isReplyMode = !!(replyToSender && replyToRecipient); if (isReplyMode) { // Pre-populate for reply document.getElementById("messageSentBy").value = replyToRecipient; document.getElementById("messageAddressedTo").value = replyToSender; document.getElementById("messageContent").value = "Re: "; } // Always clear any reply keys to avoid partial-stale state blocking create mode sessionStorage.removeItem("replyToSender"); sessionStorage.removeItem("replyToRecipient"); sessionStorage.removeItem("replyToMessageId"); // Set due date based on session storage or default to tomorrow var dueDate; if (selectedMessageDate) { dueDate = selectedMessageDate; sessionStorage.removeItem("selectedMessageDate"); } else { var tomorrow = new Date(); tomorrow.setDate(tomorrow.getDate() + 1); dueDate = tomorrow.toISOString().slice(0, 16); } document.getElementById("messageDueDate").value = dueDate; // Check if this is edit mode (separate from session storage) var isEditMode = editData && editData._id; // Update modal title and button text based on mode (only if not already set by session storage) if (isEditMode) { var modalTitle = document.querySelector("#customMessageModal .modal-title"); var submitBtn = document.getElementById("submitMessageBtn"); var userNameText = document.querySelector("#customMessageModal .user-name"); var userTimeText = document.querySelector("#customMessageModal .user-time"); // Edit mode if (modalTitle) modalTitle.textContent = "Edit Message"; if (userNameText) userNameText.textContent = "Update Message"; if (userTimeText) userTimeText.textContent = "Update the message details below"; if (submitBtn) { // Clear existing content while (submitBtn.firstChild) { submitBtn.removeChild(submitBtn.firstChild); } var saveIcon = document.createElement("i"); saveIcon.className = "paper plane icon"; submitBtn.appendChild(saveIcon); submitBtn.appendChild(document.createTextNode(" Update Message")); } // Pre-populate form fields with edit data document.getElementById("messageSentBy").value = editData.sentBy || ""; document.getElementById("messageAddressedTo").value = editData.addressedTo || ""; document.getElementById("messageEmailAddress").value = editData.emailAddress || ""; document.getElementById("messageContent").value = editData.message || ""; if (editData.dueDate) { var editDueDate = new Date(editData.dueDate).toISOString().slice(0, 16); document.getElementById("messageDueDate").value = editDueDate; } // Store edit data for form submission modal.setAttribute("data-edit-id", editData._id); } else if (!isReplyMode) { // Create mode (only if not reply mode) var modalTitle = document.querySelector("#customMessageModal .modal-title"); var submitBtn = document.getElementById("submitMessageBtn"); var userNameText = document.querySelector("#customMessageModal .user-name"); var userTimeText = document.querySelector("#customMessageModal .user-time"); if (modalTitle) modalTitle.textContent = "Send Message"; if (userNameText) userNameText.textContent = "Create New Message"; if (userTimeText) userTimeText.textContent = "Send a message to family members with a delivery date"; if (submitBtn) { // Clear existing content while (submitBtn.firstChild) { submitBtn.removeChild(submitBtn.firstChild); } var sendIcon = document.createElement("i"); sendIcon.className = "paper plane icon"; submitBtn.appendChild(sendIcon); submitBtn.appendChild(document.createTextNode(" Send Message")); } // Clear edit data modal.removeAttribute("data-edit-id"); modal.removeAttribute("data-content-type-id"); } } } function openMessageModalForEdit(messageId) { phoros.processor( "messageAction", { type: "get", payload: { messageId: messageId } }, function (error, result) { if (!error && result && result.success && result.data && result.data.message) { openMessageModal(result.data.message); } else { Swal.fire({ icon: "error", title: "Error", text: (error && (error.message || String(error))) || (result && result.message) || "Could not load message data for editing." }); } } ); } function closeMessageModal() { var modal = document.getElementById("customMessageModal"); if (modal) { modal.style.display = "none"; document.body.style.overflow = "auto"; // Clear form data var form = document.getElementById("messageForm"); if (form) { form.reset(); } } } function handleMessageFormSubmit(event) { if (event) { event.preventDefault(); } // Get form data var sentBy = document.getElementById("messageSentBy").value.trim(); var addressedTo = document.getElementById("messageAddressedTo").value.trim(); var emailAddress = document.getElementById("messageEmailAddress").value.trim(); var message = document.getElementById("messageContent").value.trim(); var dueDate = document.getElementById("messageDueDate").value; var recipientIdEl = document.getElementById("messageRecipientPersonId"); // Unified validation var v = CommonForms.validateRequired([ { id: "messageSentBy", value: sentBy, message: "Please enter who is sending the message." }, { id: "messageAddressedTo", value: addressedTo, message: "Please enter the recipient name." }, { id: "messageEmailAddress", value: emailAddress, message: "Email is required." }, { id: "messageDueDate", value: dueDate, message: "Please select a due date." }, { id: "messageContent", value: message, message: "Please write a message." }, ]); if (!v.ok) { Swal.fire({ icon: "error", title: "Required Fields", text: v.message }); var el = document.getElementById(v.id); if (el) el.focus(); return; } if (!CommonForms.validateEmail(emailAddress)) { Swal.fire({ icon: "error", title: "Invalid Email", text: "Please enter a valid email address." }); var eel = document.getElementById("messageEmailAddress"); if (eel) eel.focus(); return; } // Check if this is edit mode var modal = document.getElementById("customMessageModal"); var editId = modal ? modal.getAttribute("data-edit-id") : null; var isEditMode = !!editId; // Prepare payload (camelCase only per Zero Fallback Policy) var payload = { sentBy: sentBy, addressedTo: addressedTo, emailAddress: emailAddress, message: message, dueDate: CommonForms.formatMsFromInput(dueDate), }; var recipientPersonId = recipientIdEl && recipientIdEl.value ? recipientIdEl.value : null; if (recipientPersonId) { payload.recipientPersonId = recipientPersonId; } if (isEditMode) { payload.messageId = editId; } CommonForms.submit({ button: "#submitMessageBtn", processor: "messageAction", payload: payload, loadingText: isEditMode ? " Updating…" : " Sending…", onSuccess: function () { closeMessageModal(); Swal.fire({ icon: "success", title: isEditMode ? "Message Updated!" : "Message Sent!", timer: 2000, showConfirmButton: false }); if (typeof loadMessages === "function") setTimeout(loadMessages, 800); }, }); } // Custom Milestone Modal Functions function openMilestoneModal(editData) { var modal = document.getElementById("customMilestoneModal"); if (modal) { modal.style.display = "flex"; document.body.style.overflow = "hidden"; // Initialize Fomantic UI components when modal opens initializeModalDropdowns(); // Check if this is edit mode var isEditMode = editData && editData._id; // Update modal title and button text based on mode var modalTitle = document.querySelector("#customMilestoneModal .modal-title"); var submitBtn = document.getElementById("submitMilestoneBtn"); var userNameText = document.querySelector("#customMilestoneModal .user-name"); var userTimeText = document.querySelector("#customMilestoneModal .user-time"); if (isEditMode) { // Edit mode if (modalTitle) modalTitle.textContent = "Edit Milestone"; if (userNameText) userNameText.textContent = "Update Milestone"; if (userTimeText) userTimeText.textContent = "Modify the details of this milestone"; if (submitBtn) { // Clear existing content while (submitBtn.firstChild) { submitBtn.removeChild(submitBtn.firstChild); } var saveIcon = document.createElement("i"); saveIcon.className = "trophy icon"; submitBtn.appendChild(saveIcon); submitBtn.appendChild(document.createTextNode(" Update Milestone")); } // Pre-populate form fields document.getElementById("milestoneTitle").value = editData.title || ""; if (editData.date) { var editDate = new Date(editData.date).toISOString().slice(0, 16); document.getElementById("milestoneDate").value = editDate; } document.getElementById("milestoneDescription").value = editData.description || ""; document.getElementById("milestoneCategory").value = editData.category || ""; // Store edit data for form submission modal.setAttribute("data-edit-id", editData._id); } else { // Create mode if (modalTitle) modalTitle.textContent = "Add Milestone"; if (userNameText) userNameText.textContent = "Record New Milestone"; if (userTimeText) userTimeText.textContent = "Capture a special achievement or memorable moment"; if (submitBtn) { // Clear existing content while (submitBtn.firstChild) { submitBtn.removeChild(submitBtn.firstChild); } var trophyIcon = document.createElement("i"); trophyIcon.className = "trophy icon"; submitBtn.appendChild(trophyIcon); submitBtn.appendChild(document.createTextNode(" Record Milestone")); } // Set default date to now var now = new Date(); var dateString = now.toISOString().slice(0, 16); document.getElementById("milestoneDate").value = dateString; // Clear edit data modal.removeAttribute("data-edit-id"); modal.removeAttribute("data-content-type-id"); } } } function openMilestoneModalForEdit(milestoneId) { // Fetch the milestone data first, then open modal phoros.processor( "milestoneAction", { type: "get", payload: { milestoneId: milestoneId, }, }, function (error, result) { if (!error && result && result.success && result.data && result.data.milestone) { var milestoneData = result.data.milestone; openMilestoneModal(milestoneData); } else { Swal.fire({ icon: "error", title: "Error", text: (error && (error.message || String(error))) || (result && result.message) || "Could not load milestone data for editing.", }); } } ); } function closeMilestoneModal() { var modal = document.getElementById("customMilestoneModal"); if (modal) { modal.style.display = "none"; document.body.style.overflow = "auto"; // Clear form data var form = document.getElementById("milestoneForm"); if (form) { form.reset(); } clearMilestoneMediaSelection(); } } function ensureMilestoneMediaArray(mediaItems) { if (!Array.isArray(mediaItems)) { return []; } return mediaItems.filter(function (item) { return item && item.url; }); } function renderMilestoneMediaPreview(mediaItems) { var preview = document.getElementById("milestoneUploadPreview"); var clearBtn = document.getElementById("clearMilestoneMediaBtn"); if (!preview) { return; } while (preview.firstChild) { preview.removeChild(preview.firstChild); } var normalized = ensureMilestoneMediaArray(mediaItems); if (!normalized.length) { var emptyHint = document.createElement("span"); emptyHint.className = "milestone-upload-empty"; emptyHint.textContent = "No media selected yet."; preview.appendChild(emptyHint); if (clearBtn) { clearBtn.style.display = "none"; } return; } for (var i = 0; i < normalized.length; i++) { var media = normalized[i]; var itemEl = document.createElement("div"); itemEl.className = "milestone-preview-item"; itemEl.title = media.url; if (media.kind === "image" && media.url) { var img = document.createElement("img"); img.src = media.url; img.alt = "Milestone media"; itemEl.appendChild(img); } else if (media.kind === "video" && media.url) { var vid = document.createElement("video"); vid.src = media.url; vid.muted = true; vid.loop = true; vid.playsInline = true; itemEl.appendChild(vid); } else if (media.kind === "audio") { var audioLabel = document.createElement("span"); audioLabel.textContent = "Audio"; itemEl.appendChild(audioLabel); } else { var fileLabel = document.createElement("span"); fileLabel.textContent = "File"; itemEl.appendChild(fileLabel); } preview.appendChild(itemEl); } if (clearBtn) { clearBtn.style.display = "inline-flex"; } } function clearMilestoneMediaSelection() { try { window._milestonePendingMedia = []; } catch (e) { window._milestonePendingMedia = []; } renderMilestoneMediaPreview([]); } function buildMilestoneMediaItems(files, urls) { if (typeof CommonForms !== "undefined" && typeof CommonForms.buildMediaItems === "function") { return CommonForms.buildMediaItems(files, urls); } var items = []; for (var i = 0; i < urls.length; i++) { var file = files && files[i]; var mime = file && file.type ? file.type : null; var kind = mime && mime.indexOf("image/") === 0 ? "image" : (mime && mime.indexOf("video/") === 0 ? "video" : (mime && mime.indexOf("audio/") === 0 ? "audio" : "file")); items.push({ kind: kind, url: urls[i], mimeType: mime, sizeBytes: file && typeof file.size === "number" ? file.size : null, }); } return items; } function openMilestoneMediaPicker() { var cfg = { accept: "image/*,video/*,audio/*", multiple: true, maxSize: 10 * 1024 * 1024, storageFolder: "vault/milestones" }; var uploader; if (typeof CommonForms !== "undefined" && typeof CommonForms.uploadFiles === "function") { uploader = CommonForms.uploadFiles(cfg); } else if (typeof phoros !== "undefined" && typeof phoros.upload === "function") { uploader = new Promise(function (resolve, reject) { phoros.upload(cfg, function (file, url) { if (!url) { reject(new Error("Upload failed")); return; } resolve({ files: [file], urls: [url] }); }); }); } if (!uploader) { Swal.fire({ icon: "error", title: "Upload unavailable", text: "File uploads are not available right now." }); return; } uploader .then(function (result) { var files = (result && result.files) || []; var urls = (result && result.urls) || []; if (!urls.length) { throw new Error("No files returned from upload"); } var mediaItems = buildMilestoneMediaItems(files, urls); if (!mediaItems.length) { throw new Error("We could not prepare those files."); } try { window._milestonePendingMedia = mediaItems; } catch (assignError) { window._milestonePendingMedia = mediaItems; } renderMilestoneMediaPreview(mediaItems); }) .catch(function (error) { var message = (error && error.message) || "Unable to upload files right now."; Swal.fire({ icon: "error", title: "Upload error", text: message }); }); } function syncMilestoneMediaToVault(milestoneId, mediaItems, milestoneDate) { if (!milestoneId) { return; } if (typeof phoros === "undefined" || typeof phoros.processor !== "function") { return; } var normalized = ensureMilestoneMediaArray(mediaItems); if (!normalized.length) { return; } for (var i = 0; i < normalized.length; i++) { (function dispatchToVault(media) { var payload = { category: "gallery_file", fileUrl: media.url, mimeType: media.mimeType || null, sizeBytes: media.sizeBytes || null, sourceType: "milestone", sourceId: milestoneId, milestoneId: milestoneId, date: milestoneDate, }; phoros.processor( "vaultAction", { type: "save", payload: payload }, function (err) { if (err) { console.warn("Failed to sync milestone media to vault", err); } } ); })(normalized[i]); } } function handleMilestoneFormSubmit(event) { if (event) { event.preventDefault(); } // Get form data var title = document.getElementById("milestoneTitle").value.trim(); var date = document.getElementById("milestoneDate").value; var description = document.getElementById("milestoneDescription").value.trim(); var category = document.getElementById("milestoneCategory").value; var pendingMedia = Array.isArray(window._milestonePendingMedia) ? window._milestonePendingMedia.slice() : []; var originalMedia = Array.isArray(window._milestoneOriginalMedia) ? window._milestoneOriginalMedia.slice() : []; var v = CommonForms.validateRequired([{ id: "milestoneTitle", value: title, message: "Please enter a milestone title." }]); if (!v.ok) { Swal.fire({ icon: "error", title: "Required Field", text: v.message }); var el = document.getElementById(v.id); if (el) el.focus(); return; } var modal = document.getElementById("customMilestoneModal"); var editId = modal ? modal.getAttribute("data-edit-id") : null; var isEditMode = !!editId; var payload = { title: title, date: CommonForms.formatMsFromInput(date || new Date().toISOString()), description: description, category: category || undefined, }; if (pendingMedia.length) { payload.media = pendingMedia; } if (isEditMode) { payload.milestoneId = editId; } var mediaForVault = pendingMedia.filter(function (media) { var mediaUrl = media && media.url; if (!mediaUrl) { return false; } for (var index = 0; index < originalMedia.length; index++) { var existing = originalMedia[index]; if (existing && existing.url === mediaUrl) { return false; } } return true; }); CommonForms.submit({ button: "#submitMilestoneBtn", processor: "milestoneAction", payload: payload, loadingText: isEditMode ? " Updating…" : " Recording…", onSuccess: function (result) { closeMilestoneModal(); Swal.fire({ icon: "success", title: isEditMode ? "Milestone Updated!" : "Milestone Recorded!", timer: 2000, showConfirmButton: false }); if (typeof milestoneList === "function") setTimeout(milestoneList, 300); if (typeof populateTimelineMilestones === "function") setTimeout(populateTimelineMilestones, 300); var milestoneId = (result && result.data && (result.data.milestoneId || result.data.id)) || editId; if (milestoneId && mediaForVault.length) { syncMilestoneMediaToVault(milestoneId, mediaForVault, payload.date); } try { window._milestoneOriginalMedia = pendingMedia.slice(); } catch (refreshError) { window._milestoneOriginalMedia = pendingMedia.slice(); } }, }); } // ===== MOMENTUS EMPTY STATE UTILITY ===== var momentusEmptyStateActionSeq = 0; var momentusEmptyStateActionRegistry = {}; function handleMomentusEmptyStateAction(element) { if (!element) { return; } var actionId = element.dataset.actionId || ''; if (!actionId) { return; } var handler = momentusEmptyStateActionRegistry[actionId]; if (typeof handler === 'function') { handler.call(element); } } window.handleMomentusEmptyStateAction = handleMomentusEmptyStateAction; /** * Reliable Empty State Utility - Uses Inline Styling (Working Approach) */ window.createMomentusEmptyState = function (config) { // Default configuration var defaults = { container: null, // jQuery container where empty state should be added icon: "question circle", // Fomantic UI icon class title: "No items yet", // Main heading text description: "Items will appear here when available", // Description text actionText: null, // Optional action button text actionHandler: null, // Optional action button click handler }; // Merge user config with defaults var settings = Object.assign({}, defaults, config); if (!settings.container) { return null; } // Create empty state using DOM elements (original working approach) var emptyStateCard = document.createElement("div"); emptyStateCard.className = "momentus-card"; emptyStateCard.style.cssText = "text-align: center; padding: 20px; background: var(--momentus-surface); border: var(--momentus-card-border); border-radius: var(--momentus-card-radius); width: 100%;"; // Create icon var icon = document.createElement("i"); icon.className = settings.icon + " icon"; icon.style.cssText = "font-size: 3.5em; color: var(--momentus-text-tertiary); margin-bottom: 15px !important; display: block; opacity: 0.8; margin-left: auto !important; margin-right: auto !important; width: fit-content;"; // Create title var title = document.createElement("h3"); title.style.cssText = "margin: 0 0 var(--momentus-space-sm) 0; color: var(--momentus-text-primary); font-size: var(--momentus-text-h3); font-weight: var(--momentus-weight-semibold); line-height: 1.3;"; title.textContent = settings.title; // Create description var description = document.createElement("p"); description.style.cssText = "margin: 0 0 var(--momentus-space-lg) 0; color: var(--momentus-text-secondary); font-size: var(--momentus-text-body); line-height: 1.6; max-width: 400px; margin-left: auto; margin-right: auto;"; description.textContent = settings.description; // Assemble empty state emptyStateCard.appendChild(icon); emptyStateCard.appendChild(title); emptyStateCard.appendChild(description); // Add optional action button if (settings.actionText && settings.actionHandler) { var actionButton = document.createElement("button"); actionButton.className = "upload-btn purple"; actionButton.style.cssText = "margin-top: var(--momentus-space-md); background: var(--momentus-accent); color: white; border: none; padding: 14px var(--momentus-space-lg); border-radius: var(--momentus-button-radius); font-weight: var(--momentus-weight-medium); cursor: pointer; transition: var(--momentus-button-transition); display: inline-flex; align-items: center; gap: var(--momentus-space-xs); justify-content: center;"; // Create button icon var buttonIcon = document.createElement("i"); buttonIcon.className = settings.icon + " icon"; actionButton.appendChild(buttonIcon); actionButton.appendChild(document.createTextNode(settings.actionText)); var actionId = "emptyAction_" + (++momentusEmptyStateActionSeq); momentusEmptyStateActionRegistry[actionId] = settings.actionHandler; actionButton.dataset.actionId = actionId; actionButton.setAttribute("onclick", "handleMomentusEmptyStateAction(this)"); emptyStateCard.appendChild(actionButton); } // Add to container and return element settings.container.append($(emptyStateCard)); return $(emptyStateCard); }; // Simple navigator for Moment page from lists/cards function openMomentForId(contentId) { var id = contentId === undefined || contentId === null ? "" : String(contentId).trim(); if (!id) { Swal.fire({ icon: "error", title: "Nothing to view", text: "We could not determine which moment to open." }); return; } if (typeof phoros !== "undefined" && phoros.page && typeof phoros.page.change === "function") { phoros.page.change("moment", { content_id: id }); return; } window.location.hash = "#moment"; } window.openMomentForId = openMomentForId; window.openMomentOrMemory = window.openMomentOrMemory || function (milestoneId, memoryId) { var milestone = milestoneId === undefined || milestoneId === null ? "" : String(milestoneId).trim(); var memory = memoryId === undefined || memoryId === null ? "" : String(memoryId).trim(); if (milestone) { if (typeof openMomentForId === 'function') { openMomentForId(milestone); return; } if (typeof phoros !== 'undefined' && phoros.page && typeof phoros.page.change === 'function') { phoros.page.change('moment', { content_id: milestone }); return; } } if (memory) { if (typeof openMemoryModalForEdit === 'function') { openMemoryModalForEdit(memory); return; } if (typeof phoros !== 'undefined' && phoros.page && typeof phoros.page.change === 'function') { phoros.page.change('memory', { content_id: memory }); return; } } if (typeof Swal !== 'undefined' && typeof Swal.fire === 'function') { Swal.fire({ icon: 'error', title: 'Nothing to view', text: 'We could not find details for this memory yet.' }); } else { console.warn('No moment or memory identifier provided for navigation.'); } }; // ===== VAULT UPLOAD MODAL FUNCTIONALITY ===== var currentVaultTab = "gallery"; var selectedFiles = { gallery: [], albums: [], important: [] }; var vaultStagedUploads = { gallery: null, albums: null, important: null }; var albumEditorState = { mode: 'create', albumId: null, title: '', description: '', currentCoverUrl: '', currentCoverMimeType: '', currentCoverSize: null, replacementCover: null }; var vaultAlbumDirectory = {}; var vaultDropZoneDefaults = { "#galleryDropZone": { heading: "Select photos & videos to upload", subtext: "Use Browse files to choose what to add." }, "#albumDropZone": { heading: "Select photos & videos for this album", subtext: "Use Browse files to choose additions." }, "#existingAlbumDropZone": { heading: "Select more memories for this album", subtext: "Use Browse files to pick additional items." }, "#importantDropZone": { heading: "Upload important family documents", subtext: "Use Browse files. Accepted formats: PDF, DOC, JPG, PNG." } }; function resetAlbumEditorState() { albumEditorState.mode = 'create'; albumEditorState.albumId = null; albumEditorState.title = ''; albumEditorState.description = ''; albumEditorState.currentCoverUrl = ''; albumEditorState.currentCoverMimeType = ''; albumEditorState.currentCoverSize = null; albumEditorState.replacementCover = null; } function setAlbumEditorFromPayload(payload) { if (!payload) { resetAlbumEditorState(); return; } albumEditorState.mode = payload.mode || 'edit'; albumEditorState.albumId = payload.albumId || null; albumEditorState.title = payload.title || ''; albumEditorState.description = payload.description || ''; albumEditorState.currentCoverUrl = payload.coverUrl || ''; albumEditorState.currentCoverMimeType = payload.coverMimeType || ''; albumEditorState.currentCoverSize = (typeof payload.coverSize === 'number') ? payload.coverSize : (payload.coverSize ? parseInt(payload.coverSize, 10) : null); albumEditorState.replacementCover = null; } function renderAlbumEditorUI() { var nameInput = document.querySelector('.album-form.existing-album input[name="existingAlbumName"]'); if (nameInput) { nameInput.value = albumEditorState.title || ''; } var descriptionInput = document.querySelector('.album-form.existing-album textarea[name="existingAlbumDescription"]'); if (descriptionInput) { descriptionInput.value = albumEditorState.description || ''; } var preview = document.getElementById('existingAlbumCoverPreview'); if (preview) { while (preview.firstChild) { preview.removeChild(preview.firstChild); } var coverSource = albumEditorState.replacementCover && albumEditorState.replacementCover.url ? albumEditorState.replacementCover.url : albumEditorState.currentCoverUrl; if (coverSource) { var img = document.createElement('img'); img.src = coverSource; img.alt = 'Album cover preview'; preview.appendChild(img); } else { var placeholder = document.createElement('p'); placeholder.textContent = 'No cover image selected'; preview.appendChild(placeholder); } } var clearBtn = document.getElementById('clearAlbumCoverBtn'); if (clearBtn) { if (albumEditorState.replacementCover && albumEditorState.replacementCover.url) { clearBtn.removeAttribute('hidden'); } else { clearBtn.setAttribute('hidden', 'hidden'); } } } function triggerAlbumCoverUpload() { CommonForms.uploadFiles({ accept: "image/*", multiple: false, maxSize: 10 * 1024 * 1024, storageFolder: "vault/albums" }) .then(function (res) { var files = Array.isArray(res.files) ? res.files : []; var urls = Array.isArray(res.urls) ? res.urls : []; if (!urls.length) { return; } var file = files[0] || {}; albumEditorState.replacementCover = { url: urls[0], mimeType: file.type || '', sizeBytes: typeof file.size === 'number' ? file.size : null }; renderAlbumEditorUI(); }) .catch(function (err) { var message = (err && err.message) || "Unable to upload cover image."; if (typeof Swal !== 'undefined' && typeof Swal.fire === 'function') { Swal.fire({ icon: 'error', title: 'Upload Error', text: message }); } else { alert(message); } }); } function clearAlbumCoverSelection() { albumEditorState.replacementCover = null; renderAlbumEditorUI(); } function restoreVaultDropZone(selector) { var zone = $(selector); if (!zone || !zone.length) return; var defaults = vaultDropZoneDefaults[selector] || {}; var heading = zone.find("h4"); if (heading && heading.length && defaults.heading) { heading.text(defaults.heading); } var paragraph = zone.find("p"); if (paragraph && paragraph.length && typeof defaults.subtext === "string") { paragraph.text(defaults.subtext); } var previews = zone.find(".upload-previews"); if (previews && previews.length) { previews.empty(); } } function getVaultUploadConfig(tabName, manualFiles) { var cfg; switch (tabName) { case "gallery": cfg = { accept: "image/*,video/*,audio/*", multiple: true, maxSize: 10 * 1024 * 1024, storageFolder: "vault/gallery" }; break; case "albums": cfg = { accept: "image/*,video/*", multiple: true, maxSize: 10 * 1024 * 1024, storageFolder: "vault/albums" }; break; case "important": cfg = { accept: ".pdf,.doc,.docx,.jpg,.jpeg,.png", multiple: true, maxSize: 10 * 1024 * 1024, storageFolder: "vault/documents" }; break; } if (!cfg) return null; if (manualFiles && manualFiles.length) { cfg.prefillFiles = Array.prototype.slice.call(manualFiles); } return cfg; } function stageVaultSelection(tabName, fileList) { return new Promise(function (resolve, reject) { var cfg = getVaultUploadConfig(tabName, fileList); if (!cfg) { reject(new Error("Unsupported vault tab")); return; } CommonForms.uploadFiles(cfg) .then(function (res) { var files = Array.isArray(res.files) ? res.files.slice() : []; var urls = Array.isArray(res.urls) ? res.urls.slice() : []; selectedFiles[tabName] = files; vaultStagedUploads[tabName] = { files: files, urls: urls }; updateFileDisplay(tabName, files); resolve(vaultStagedUploads[tabName]); }) .catch(function (err) { reject(err); }); }); } // Open vault upload modal window.openVaultUploadModal = function (options) { var modal = document.getElementById("vaultUploadModal"); if (!modal) { return; } var opts = options || {}; resetVaultUploadForm(); if (opts.mode === 'edit' && opts.album && opts.album.albumId) { setAlbumEditorFromPayload(Object.assign({}, opts.album, { mode: 'edit' })); } else { resetAlbumEditorState(); } modal.style.display = "flex"; var targetTab = opts.tab || (albumEditorState.mode === 'edit' ? 'albums' : 'gallery'); switchVaultTab(targetTab, { albumEditor: albumEditorState }); setTimeout(function () { $("#vaultUploadModal .ui.dropdown").dropdown(); if (albumEditorState.mode === 'edit' && albumEditorState.albumId) { try { $('#vaultUploadModal select[name="existingAlbum"]').dropdown('set selected', albumEditorState.albumId); } catch (e) { /* dropdown not initialized yet */ } renderAlbumEditorUI(); } }, 150); }; // Close vault upload modal window.closeVaultUploadModal = function () { var modal = document.getElementById("vaultUploadModal"); if (modal) { modal.style.display = "none"; resetVaultUploadForm(); } }; // Switch between vault tabs window.switchVaultTab = function (tabName, options) { currentVaultTab = tabName; var tabOptions = options || {}; // Update tab buttons $("#vaultUploadModal .vault-tab").removeClass("active"); $('#vaultUploadModal .vault-tab[data-tab="' + tabName + '"]').addClass("active"); // Show/hide tab content $("#vaultUploadModal .vault-tab-content").hide(); $('#vaultUploadModal .vault-tab-content[data-tab="' + tabName + '"]').show(); // Update upload button text var btnText = "Upload to "; switch (tabName) { case "gallery": btnText += "Gallery"; break; case "albums": btnText += "Album"; break; case "important": btnText += "Documents"; break; } $("#vaultUploadBtnText").text(btnText); if (!selectedFiles[tabName]) { selectedFiles[tabName] = []; } vaultStagedUploads[tabName] = vaultStagedUploads[tabName] || null; // Load dynamic data for Albums tab if (tabName === "albums") { var isEditMode = !!(tabOptions.albumEditor && tabOptions.albumEditor.mode === 'edit' && tabOptions.albumEditor.albumId); var preselectId = isEditMode ? tabOptions.albumEditor.albumId : null; loadAlbumOptions({ preselectId: preselectId, onAfterPopulate: function (albums) { var hasAlbums = Array.isArray(albums) && albums.length > 0; if (isEditMode) { selectAlbumAction('existing', { skipFileReset: true }); renderAlbumEditorUI(); } else if (hasAlbums) { selectAlbumAction('existing'); } else { selectAlbumAction('new'); } } }); } else { if (tabName !== 'albums') { albumEditorState.mode = 'create'; } } updateFileDisplay(tabName, selectedFiles[tabName]); }; // Open Vault view from modal window.openFromVault = function () { try { closeVaultUploadModal(); } catch (e) { } try { phoros.page.change('vault'); } catch (e) { } }; // Trigger file upload for specific tab window.triggerFileUpload = function (uploadType) { var tabName = uploadType === "important" ? "important" : (uploadType === "gallery" ? "gallery" : "albums"); stageVaultSelection(tabName).catch(function () { var inputId = ""; switch (uploadType) { case "gallery": inputId = "galleryFileInput"; break; case "album": inputId = "albumFileInput"; break; case "existing-album": inputId = "existingAlbumFileInput"; break; case "important": inputId = "importantFileInput"; break; } if (inputId) { var el = document.getElementById(inputId); if (el) el.click(); } }); }; // Handle album action selection window.selectAlbumAction = function (action, opts) { var options = opts || {}; // Update button states $(".album-option").removeClass("active"); $('.album-option[onclick*="' + action + '"]').addClass("active"); var isNew = action === "new"; if (isNew) { $(".album-form.new-album").show(); $(".album-form.existing-album").hide(); if (albumEditorState.mode !== 'edit') { albumEditorState.mode = 'create'; } } else { $(".album-form.new-album").hide(); $(".album-form.existing-album").show(); if (albumEditorState.mode !== 'edit') { albumEditorState.mode = 'existing'; } renderAlbumEditorUI(); } if (!options.skipFileReset) { selectedFiles.albums = []; vaultStagedUploads.albums = null; } updateFileDisplay("albums", []); }; // Update document fields based on category selection window.updateDocumentFields = function (category) { var titleInput = $('input[name="documentTitle"]'); var notesTextarea = $('textarea[name="documentNotes"]'); // Pre-fill suggestions based on category switch (category) { case "family-tree": titleInput.attr("placeholder", "e.g., Smith Family Tree 2025"); notesTextarea.attr("placeholder", "Family lineage, relationships, and important dates..."); break; case "will": titleInput.attr("placeholder", "e.g., Last Will and Testament - John Smith"); notesTextarea.attr("placeholder", "Legal executor, key provisions, location of originals..."); break; case "living-will": titleInput.attr("placeholder", "e.g., Living Will - Medical Directives"); notesTextarea.attr("placeholder", "Medical preferences, emergency contacts, healthcare proxy..."); break; case "medical": titleInput.attr("placeholder", "e.g., Medical Records - Annual Checkup 2025"); notesTextarea.attr("placeholder", "Doctor information, important findings, follow-up needed..."); break; case "legal": titleInput.attr("placeholder", "e.g., Property Deed - Family Home"); notesTextarea.attr("placeholder", "Legal details, important dates, contact information..."); break; case "insurance": titleInput.attr("placeholder", "e.g., Home Insurance Policy 2025"); notesTextarea.attr("placeholder", "Policy details, coverage amounts, agent contact..."); break; default: titleInput.attr("placeholder", "e.g., Important Family Document"); notesTextarea.attr("placeholder", "Important notes about this document..."); } }; // Handle vault upload form submission window.handleVaultUpload = function () { var isValid = true; var errorMessage = ""; // Get current tab's files var files = selectedFiles[currentVaultTab] || []; var stagedUploads = vaultStagedUploads[currentVaultTab]; switch (currentVaultTab) { case "gallery": if (files.length === 0) { errorMessage = "Please select files to upload to the gallery."; isValid = false; } break; case "albums": var isNewAlbum = $('.album-option.active[onclick*="new"]').length > 0; var selectedAlbum = $('select[name="existingAlbum"]').val(); var isEditMode = albumEditorState.mode === 'edit' && albumEditorState.albumId; if (isNewAlbum) { var albumName = $('input[name="albumName"]').val().trim(); if (!albumName) { errorMessage = "Please enter an album name."; isValid = false; } } else { var resolvedAlbumId = selectedAlbum || albumEditorState.albumId; if (!resolvedAlbumId) { errorMessage = "Please select an album."; isValid = false; } } break; case "important": var documentCategory = $('select[name="documentCategory"]').val(); var documentTitle = $('input[name="documentTitle"]').val().trim(); if (!documentCategory) { errorMessage = "Please select a document category."; isValid = false; } else if (!documentTitle) { errorMessage = "Please enter a document title."; isValid = false; } else if (files.length === 0) { errorMessage = "Please select documents to upload."; isValid = false; } break; } if (!isValid) { Swal.fire({ icon: "error", title: "Upload Error", text: errorMessage, }); return; } // Show loading state var uploadBtn = $("#vaultUploadModal .post-btn"); var originalText = uploadBtn.html(); uploadBtn.html('Uploading...').prop("disabled", true); if (currentVaultTab === "gallery") { var galleryCaption = $('textarea[name="galleryCaption"]').val() || ""; var galleryDate = $('input[name="galleryDate"]').val(); var galleryVisibility = $('select[name="galleryVisibility"]').val(); var galleryUploadsPromise = (stagedUploads && stagedUploads.urls && stagedUploads.urls.length) ? Promise.resolve(stagedUploads) : CommonForms.uploadFiles(getVaultUploadConfig("gallery", files)); galleryUploadsPromise .then(function (res) { var filesUploaded = res && res.files ? res.files : []; var urls = res && res.urls ? res.urls : []; var total = urls.length; if (!total) { uploadBtn.html(originalText).prop("disabled", false); Swal.fire({ icon: "error", title: "Upload Error", text: "No files were uploaded." }); return; } var titleFromFirstFile = (filesUploaded[0] && filesUploaded[0].name) ? filesUploaded[0].name.replace(/\.[^/.]+$/, "") : ""; var combinedTitle = (galleryCaption && galleryCaption.substring(0, 50)) || titleFromFirstFile || "Memory"; var mediaAll = CommonForms.buildMediaItems(filesUploaded, urls); var payload = { title: combinedTitle, caption: galleryCaption, type: ["Picture"], memory_date: CommonForms.formatMsFromInput(galleryDate), visibility: galleryVisibility, media: mediaAll, }; CommonForms.submit({ button: null, processor: "memoryAction", payload: payload, onSuccess: function (result) { var createdId = result && result.data && (result.data.memoryId || result.data.id); var completed = 0; var hadError = false; urls.forEach(function (url, index) { var file = filesUploaded && filesUploaded[index]; phoros.processor( "vaultAction", { type: "save", payload: { category: "gallery_file", fileUrl: url, mimeType: file && file.type || null, sizeBytes: file && file.size || null, sourceType: "post", sourceId: createdId, date: payload.memory_date } }, function (err, response) { if (err || !response || response.success !== true) { hadError = true; } completed++; if (completed === urls.length) { uploadBtn.html(originalText).prop("disabled", false); closeVaultUploadModal(); Swal.fire({ icon: hadError ? "warning" : "success", title: hadError ? "Uploaded with some errors" : "Upload Successful", text: hadError ? "Some items could not be saved. Others were added." : "Your files have been added to the vault!", timer: 2500, showConfirmButton: false, }); if (typeof vaultModule !== "undefined" && vaultModule.switchCategory) { setTimeout(function () { vaultModule.switchCategory("gallery"); }, 300); } vaultStagedUploads.gallery = null; selectedFiles.gallery = []; } } ); }); }, onError: function () { uploadBtn.html(originalText).prop("disabled", false); Swal.fire({ icon: "warning", title: "Upload Failed", text: "Unable to create the post for these files.", timer: 2500, showConfirmButton: false }); }, }); }) .catch(function (err) { uploadBtn.html(originalText).prop("disabled", false); var message = (err && err.message) || "Unable to upload files."; Swal.fire({ icon: "error", title: "Upload Error", text: message }); }); } else if (currentVaultTab === "albums") { var isNewAlbum = $('.album-option.active[onclick*="new"]').length > 0; var isEditMode = albumEditorState.mode === 'edit' && albumEditorState.albumId; var existingAlbumId = $('select[name="existingAlbum"]').val() || null; if (!isNewAlbum && isEditMode && albumEditorState.albumId) { existingAlbumId = albumEditorState.albumId; } var directoryEntry = existingAlbumId ? (vaultAlbumDirectory[existingAlbumId] || {}) : {}; var existingAlbumNameInput = $('input[name="existingAlbumName"]').val() || ''; var existingAlbumDescriptionInput = $('textarea[name="existingAlbumDescription"]').val() || ''; var trimmedExistingName = existingAlbumNameInput.trim(); var trimmedExistingDescription = existingAlbumDescriptionInput.trim(); var finalExistingName = isNewAlbum ? '' : (trimmedExistingName || albumEditorState.title || directoryEntry.title || ''); if (!finalExistingName && !isNewAlbum) { finalExistingName = directoryEntry.title || 'Album'; } var finalExistingDescription = isNewAlbum ? '' : (trimmedExistingDescription || albumEditorState.description || directoryEntry.description || ''); var hasReplacementCover = !!(albumEditorState.replacementCover && albumEditorState.replacementCover.url); var nameChanged = !isNewAlbum && existingAlbumId && finalExistingName !== (directoryEntry.title || ''); var descriptionChanged = !isNewAlbum && existingAlbumId && finalExistingDescription !== (directoryEntry.description || ''); var shouldUpdateMetadata = !isNewAlbum && existingAlbumId && (nameChanged || descriptionChanged || hasReplacementCover); if (!isNewAlbum && existingAlbumId) { albumEditorState.albumId = existingAlbumId; albumEditorState.title = finalExistingName; albumEditorState.description = finalExistingDescription; } var stagedAlbumUploads = vaultStagedUploads.albums; var albumUploadsPromise; if (stagedAlbumUploads && stagedAlbumUploads.urls && stagedAlbumUploads.urls.length) { albumUploadsPromise = Promise.resolve(stagedAlbumUploads); } else if (files.length) { albumUploadsPromise = CommonForms.uploadFiles(getVaultUploadConfig("albums", files)); } else { albumUploadsPromise = Promise.resolve({ files: [], urls: [] }); } albumUploadsPromise .then(function (res) { var filesUploaded = res && res.files ? res.files : []; var urls = res && res.urls ? res.urls : []; if (isNewAlbum && !urls.length) { uploadBtn.html(originalText).prop("disabled", false); Swal.fire({ icon: "error", title: "Upload Error", text: "No files were uploaded." }); return; } function finalizeSuccess(hadError, overrideText) { uploadBtn.html(originalText).prop("disabled", false); closeVaultUploadModal(); var messageText = overrideText || (hadError ? "Some items could not be saved." : (urls.length ? "Your files have been added to the album!" : "Album updated.")); Swal.fire({ icon: hadError ? "warning" : "success", title: hadError ? "Uploaded with some errors" : "Upload Successful", text: messageText, timer: 2500, showConfirmButton: false, }); if (typeof vaultModule !== "undefined" && vaultModule.switchCategory) { setTimeout(function () { vaultModule.switchCategory("albums"); }, 300); } vaultStagedUploads.albums = null; selectedFiles.albums = []; } function saveAlbumItems(albumId) { if (!urls.length) { finalizeSuccess(false, "Album updated."); return; } var completed = 0; var hadError = false; urls.forEach(function (url, index) { var file = filesUploaded && filesUploaded[index]; phoros.processor( "vaultAction", { type: "save", payload: { category: "gallery_file", fileUrl: url, mimeType: file && file.type || null, sizeBytes: file && file.size || null, sourceType: "album", sourceId: null, albumId: albumId, date: moment().valueOf() } }, function (err, response) { if (err || !response || response.success !== true) { hadError = true; } completed++; if (completed === urls.length) { finalizeSuccess(hadError); } } ); }); } function updateAlbumMetadata() { if (!shouldUpdateMetadata) { return Promise.resolve(); } return new Promise(function (resolve, reject) { var payload = { vaultId: existingAlbumId }; payload.title = finalExistingName || directoryEntry.title || 'Album'; payload.description = finalExistingDescription || ''; if (hasReplacementCover) { payload.fileUrl = albumEditorState.replacementCover.url; payload.mimeType = albumEditorState.replacementCover.mimeType || null; payload.sizeBytes = albumEditorState.replacementCover.sizeBytes || null; } phoros.processor("vaultAction", { type: "update", payload: payload }, function (err, result) { if (err || !result || result.success === false) { reject(err || result); return; } albumEditorState.title = payload.title; albumEditorState.description = payload.description || ''; if (hasReplacementCover) { albumEditorState.currentCoverUrl = payload.fileUrl; albumEditorState.currentCoverMimeType = payload.mimeType || ''; albumEditorState.currentCoverSize = payload.sizeBytes || null; albumEditorState.replacementCover = null; } renderAlbumEditorUI(); vaultAlbumDirectory[existingAlbumId] = Object.assign({}, directoryEntry, { title: payload.title, description: payload.description || '', coverUrl: payload.fileUrl || directoryEntry.coverUrl || '', coverMimeType: payload.mimeType || directoryEntry.coverMimeType || '', coverSize: typeof payload.sizeBytes === 'number' ? payload.sizeBytes : (directoryEntry.coverSize || null) }); directoryEntry = vaultAlbumDirectory[existingAlbumId]; resolve(result); }); }); } if (isNewAlbum) { var albumName = $('input[name="albumName"]').val() || "Album"; var albumDescription = $('textarea[name="albumDescription"]').val() || ""; var coverFile = filesUploaded[0]; var coverUrl = urls[0]; phoros.processor( "vaultAction", { type: "save", payload: { title: albumName, description: albumDescription, category: "album", fileUrl: coverUrl, mimeType: coverFile && coverFile.type || null, sizeBytes: coverFile && coverFile.size || null, sourceType: "album", sourceId: null, date: moment().valueOf() } }, function (err, result) { if (err || !result || result.success !== true) { finalizeSuccess(true); return; } var newAlbumId = result && result.data && (result.data.vaultId || result.data.id); saveAlbumItems(newAlbumId); } ); } else { if (!existingAlbumId) { uploadBtn.html(originalText).prop("disabled", false); Swal.fire({ icon: "error", title: "Upload Error", text: "Unable to find the selected album." }); return; } updateAlbumMetadata() .then(function () { if (!urls.length) { finalizeSuccess(false, "Album updated."); return; } saveAlbumItems(existingAlbumId); }) .catch(function (updateErr) { uploadBtn.html(originalText).prop("disabled", false); var updateMessage = (updateErr && updateErr.message) || (updateErr && updateErr.error) || "Unable to update album details."; Swal.fire({ icon: "error", title: "Update Error", text: updateMessage }); }); } }) .catch(function (err) { uploadBtn.html(originalText).prop("disabled", false); var message = (err && err.message) || "Unable to upload album files."; Swal.fire({ icon: "error", title: "Upload Error", text: message }); }); } else if (currentVaultTab === "important") { var documentTitle = $('input[name="documentTitle"]').val() || ""; var documentDescription = $('textarea[name="documentNotes"]').val() || ""; var documentCategory = $('select[name="documentCategory"]').val() || "information_file"; var documentDate = $('input[name="documentDate"]').val() || null; var accessLevel = $('select[name="documentAccess"]').val() || null; var documentUploadsPromise = (stagedUploads && stagedUploads.urls && stagedUploads.urls.length) ? Promise.resolve(stagedUploads) : CommonForms.uploadFiles(getVaultUploadConfig("important", files)); documentUploadsPromise .then(function (res) { var filesUploaded = res && res.files ? res.files : []; var urls = res && res.urls ? res.urls : []; var total = urls.length; if (!total) { uploadBtn.html(originalText).prop("disabled", false); Swal.fire({ icon: "error", title: "Upload Error", text: "No files were uploaded." }); return; } var completed = 0; var hadError = false; urls.forEach(function (url, index) { if (!url) { hadError = true; completed++; return; } var file = filesUploaded && filesUploaded[index]; var titleFromFile = file && file.name ? file.name.replace(/\.[^/.]+$/, "") : ""; var finalTitle = documentTitle || titleFromFile || "Document"; phoros.processor( "vaultAction", { type: "save", payload: { title: finalTitle, description: documentDescription, category: "information_file", fileUrl: url, mimeType: file && file.type || null, sizeBytes: file && file.size || null, sourceType: "document", sourceId: null, date: documentDate ? moment(documentDate).valueOf() : moment().valueOf(), documentCategory: documentCategory, accessLevel: accessLevel } }, function (err, response) { if (err || !response || response.success !== true) { hadError = true; } completed++; if (completed === total) { uploadBtn.html(originalText).prop("disabled", false); closeVaultUploadModal(); Swal.fire({ icon: hadError ? "warning" : "success", title: hadError ? "Uploaded with some errors" : "Documents Uploaded", text: hadError ? "Some documents could not be saved. Others were added." : "Your documents have been added to the vault!", timer: 2500, showConfirmButton: false, }); if (typeof vaultModule !== "undefined" && vaultModule.switchCategory) { setTimeout(function () { vaultModule.switchCategory("important"); }, 300); } vaultStagedUploads.important = null; selectedFiles.important = []; } } ); }); }) .catch(function (err) { uploadBtn.html(originalText).prop("disabled", false); var message = (err && err.message) || "Unable to upload documents."; Swal.fire({ icon: "error", title: "Upload Error", text: message }); }); } return; }; // Reset vault upload form function resetVaultUploadForm() { // Clear all form fields var formEl = $("#vaultUploadModal form"); if (formEl && formEl.length && formEl[0]) { formEl[0].reset(); } // Reset file selections selectedFiles = { gallery: [], albums: [], important: [] }; vaultStagedUploads = { gallery: null, albums: null, important: null }; resetAlbumEditorState(); // Reset album options $(".album-option").removeClass("active"); $(".album-form").hide(); // Reset upload button var uploadBtn = $("#vaultUploadModal .post-btn"); if (uploadBtn && uploadBtn.length) { uploadBtn.prop("disabled", false); } var uploadLabel = document.getElementById("vaultUploadBtnText"); if (uploadLabel) { uploadLabel.textContent = "Upload to Gallery"; } // Restore drop zones to their default copy and remove previews restoreVaultDropZone("#galleryDropZone"); restoreVaultDropZone("#albumDropZone"); restoreVaultDropZone("#existingAlbumDropZone"); restoreVaultDropZone("#importantDropZone"); renderAlbumEditorUI(); } // Initialize file input handlers // Handle file selection for all upload inputs $("#galleryFileInput, #albumFileInput, #existingAlbumFileInput, #importantFileInput").on("change", function () { var files = Array.from(this.files || []); var tabName = (this.id === "albumFileInput" || this.id === "existingAlbumFileInput") ? "albums" : currentVaultTab; if (!files.length) { selectedFiles[tabName] = []; vaultStagedUploads[tabName] = null; updateFileDisplay(tabName, []); return; } stageVaultSelection(tabName, files).catch(function () { selectedFiles[tabName] = files; updateFileDisplay(tabName, files); }); }); $('#vaultUploadModal select[name="existingAlbum"]').on('change', function () { var albumId = $(this).val() || null; if (!albumId) { if (albumEditorState.mode !== 'edit') { resetAlbumEditorState(); } else { albumEditorState.albumId = null; albumEditorState.title = ''; albumEditorState.description = ''; albumEditorState.currentCoverUrl = ''; albumEditorState.currentCoverMimeType = ''; albumEditorState.currentCoverSize = null; albumEditorState.replacementCover = null; } renderAlbumEditorUI(); return; } var albumData = vaultAlbumDirectory[albumId]; if (albumData) { if (albumEditorState.mode === 'edit' && albumEditorState.albumId === albumId && albumEditorState.replacementCover) { albumEditorState.albumId = albumId; } else { var modeValue = albumEditorState.mode === 'edit' ? 'edit' : 'existing'; setAlbumEditorFromPayload(Object.assign({}, albumData, { mode: modeValue })); } albumEditorState.albumId = albumId; renderAlbumEditorUI(); } }); // Update file display in upload zones function updateFileDisplay(tabName, files) { var dropZoneSelector = ""; switch (tabName) { case "gallery": dropZoneSelector = "#galleryDropZone"; break; case "albums": var isNewAlbum = $('.album-option.active[onclick*="new"]').length > 0; dropZoneSelector = isNewAlbum ? "#albumDropZone" : "#existingAlbumDropZone"; break; case "important": dropZoneSelector = "#importantDropZone"; break; } if (!files || !files.length) { if (tabName === "albums") { restoreVaultDropZone("#albumDropZone"); restoreVaultDropZone("#existingAlbumDropZone"); } else if (dropZoneSelector) { restoreVaultDropZone(dropZoneSelector); } return; } if (dropZoneSelector) { var zoneDefaults = vaultDropZoneDefaults[dropZoneSelector] || {}; var fileNames = files .map(function (file) { return file.name; }) .join(", "); var displayText = files.length === 1 ? "1 file selected: " + fileNames : files.length + " files selected"; $(dropZoneSelector + " h4").text(displayText); if (dropZoneSelector !== "#importantDropZone") { $(dropZoneSelector + " p").text("Click to select different files"); } else if (zoneDefaults && zoneDefaults.subtext) { $(dropZoneSelector + " p").text(zoneDefaults.subtext); } // Render visual previews var previewContainer = $(dropZoneSelector + " .upload-previews"); if (previewContainer && previewContainer.length) { previewContainer.empty(); files.slice(0, 12).forEach(function (file) { var item = document.createElement("div"); item.className = "preview-item"; item.style.display = "inline-flex"; item.style.alignItems = "center"; item.style.gap = "8px"; item.style.margin = "6px 8px 0 0"; var isImage = file && file.type && file.type.indexOf("image/") === 0; if (isImage) { var img = document.createElement("img"); img.style.width = "48px"; img.style.height = "48px"; img.style.objectFit = "cover"; img.style.borderRadius = "6px"; var reader = new FileReader(); reader.onload = function (e) { img.src = e.target.result; }; reader.readAsDataURL(file); item.appendChild(img); } else { var icon = document.createElement("i"); icon.className = "file icon"; icon.style.fontSize = "24px"; icon.style.color = "#6b46c1"; item.appendChild(icon); } var name = document.createElement("span"); name.textContent = file && file.name ? file.name : "File"; name.style.fontSize = "12px"; name.style.color = "#6b7280"; item.appendChild(name); previewContainer[0].appendChild(item); }); } } } // Load existing albums into the dropdown when Albums tab is active function loadAlbumOptions(config) { var options = config || {}; return new Promise(function (resolve) { try { phoros.processor("Get: Vault Items", { category: "album" }, function (err, res) { if (err) { resolve([]); return; } var select = $('select[name="existingAlbum"]'); vaultAlbumDirectory = {}; if (!select || !select.length) { resolve([]); return; } var selectNode = select[0]; while (selectNode.firstChild) { selectNode.removeChild(selectNode.firstChild); } var defaultOption = document.createElement('option'); defaultOption.value = ''; defaultOption.textContent = 'Choose an album...'; selectNode.appendChild(defaultOption); var albums = Array.isArray(res) ? res : []; albums.forEach(function (album) { if (!album) { return; } var albumId = album._id || album.vaultId || album.id; if (!albumId) { return; } var mapped = { albumId: albumId, title: album.title || album.name || 'Album', description: album.description || '', coverUrl: album.fileUrl || '', coverMimeType: album.mimeType || '', coverSize: (typeof album.sizeBytes === 'number') ? album.sizeBytes : (typeof album.size === 'number' ? album.size : null) }; vaultAlbumDirectory[albumId] = mapped; var optionNode = document.createElement('option'); optionNode.value = albumId; optionNode.textContent = mapped.title; selectNode.appendChild(optionNode); }); try { select.dropdown && select.dropdown('refresh'); } catch (refreshError) { /* ignore */ } if (options.preselectId && vaultAlbumDirectory[options.preselectId]) { select.val(options.preselectId); try { select.dropdown && select.dropdown('set selected', options.preselectId); } catch (setError) { /* ignore */ } } if (typeof options.onAfterPopulate === 'function') { options.onAfterPopulate(albums.slice()); } resolve(albums); }); } catch (error) { resolve([]); } }); } // ===== COMMON FORMS MODULE (Unified Design Language) ===== window.CommonForms = (function () { function getElement(elOrSelector) { if (!elOrSelector) return null; return typeof elOrSelector === "string" ? document.querySelector(elOrSelector) : elOrSelector; } function setLoading(buttonOrSelector, loadingText) { var btn = getElement(buttonOrSelector); if (!btn) return; if (!btn.dataset.originalText) { btn.dataset.originalText = btn.textContent || ""; } btn.disabled = true; while (btn.firstChild) { btn.removeChild(btn.firstChild); } var icon = document.createElement("i"); icon.className = "spinner loading icon"; btn.appendChild(icon); btn.appendChild(document.createTextNode(loadingText || " Saving...")); } function clearLoading(buttonOrSelector, newText) { var btn = getElement(buttonOrSelector); if (!btn) return; btn.disabled = false; while (btn.firstChild) { btn.removeChild(btn.firstChild); } var text = typeof newText === "string" ? newText : btn.dataset.originalText || ""; btn.appendChild(document.createTextNode(text)); } function formatMsFromInput(value) { if (!value) return Date.now(); var d = new Date(value); return isNaN(d.getTime()) ? Date.now() : d.getTime(); } function validateRequired(fields) { for (var i = 0; i < fields.length; i++) { var f = fields[i]; if (!f.value || (typeof f.value === "string" && !f.value.trim())) { return { ok: false, id: f.id, message: f.message || "Required field" }; } } return { ok: true }; } function validateEmail(email) { var re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; return re.test(String(email || "").trim()); } function uploadFiles(config) { return new Promise(function (resolve, reject) { var cfg = config ? Object.assign({}, config) : {}; var manualList = null; if (cfg && cfg.prefillFiles) { manualList = Array.prototype.slice.call(cfg.prefillFiles); delete cfg.prefillFiles; } else if (cfg && cfg.files) { manualList = Array.prototype.slice.call(cfg.files); delete cfg.files; } if (typeof phoros === "undefined" || typeof phoros.upload !== "function") { reject(new Error("Upload system unavailable")); return; } var complete = function (fileOrFiles, urlOrUrls) { var files = Array.isArray(fileOrFiles) ? fileOrFiles : fileOrFiles ? [fileOrFiles] : []; var urls = Array.isArray(urlOrUrls) ? urlOrUrls : urlOrUrls ? [urlOrUrls] : []; resolve({ files: files, urls: urls }); }; try { if (manualList && manualList.length) { if (typeof phoros.uploadFromFiles === "function") { phoros.uploadFromFiles(cfg, manualList, complete); return; } try { phoros.upload(cfg, complete, manualList); return; } catch (manualErr) { reject(new Error("We couldn't process those files. Use Browse files to select again.")); return; } } phoros.upload(cfg, complete); } catch (err) { reject(err); } }); } function buildMediaItems(files, urls) { var items = []; for (var i = 0; i < urls.length; i++) { var f = files[i]; var url = urls[i]; if (!url) continue; var mime = f && f.type ? f.type : ""; var size = f && typeof f.size === "number" ? f.size : null; var kind = "file"; if (mime.indexOf("image/") === 0) kind = "image"; else if (mime.indexOf("video/") === 0) kind = "video"; else if (mime.indexOf("audio/") === 0) kind = "audio"; items.push({ kind: kind, url: url, mimeType: mime, sizeBytes: size }); } return items; } function submit(options) { var button = options.button; var processor = options.processor; var payload = options.payload || {}; var uploadConfig = options.uploadConfig; var onSuccess = options.onSuccess || function () { }; var onError = options.onError || function () { }; setLoading(button, options.loadingText || " Saving..."); var doSave = function () { phoros.processor(processor, { type: "save", payload: payload }, function (error, result) { clearLoading(button); if (!error && result && result.success) { onSuccess(result); } else { var msg = (error && (error.message || String(error))) || (result && (result.message || result.error)) || "Save failed"; Swal.fire({ icon: "error", title: "Error", text: msg }); onError(result || error); } }); }; if (uploadConfig) { uploadFiles(uploadConfig) .then(function (res) { var media = buildMediaItems(res.files, res.urls); if (media.length) { payload.media = (payload.media || []).concat(media); } doSave(); }) .catch(function (err) { clearLoading(button); var msg = (err && err.message) || "File upload failed"; Swal.fire({ icon: "error", title: "Upload Error", text: msg }); onError(err); }); } else { doSave(); } } return { setLoading: setLoading, clearLoading: clearLoading, formatMsFromInput: formatMsFromInput, validateRequired: validateRequired, validateEmail: validateEmail, uploadFiles: uploadFiles, buildMediaItems: buildMediaItems, submit: submit, }; })(); // Populate email autosuggest list for the Messages modal function populateMessageEmailSuggestions() { var datalist = document.getElementById("messageEmailSuggestions"); if (!datalist) return; // Clear existing while (datalist.firstChild) { datalist.removeChild(datalist.firstChild); } var uniqueEmails = {}; var addEmail = function (email) { if (!email || typeof email !== 'string') return; var v = email.trim().toLowerCase(); if (!v || uniqueEmails[v]) return; uniqueEmails[v] = true; var opt = document.createElement('option'); opt.value = v; datalist.appendChild(opt); }; // Source 1: past messages phoros.processor("Get: Messages", { limit: 100 }, function (err, res) { if (!err && Array.isArray(res)) { res.forEach(function (m) { addEmail(m && m.emailAddress); }); } // Source 2: family emails (only when a standard emailAddress field exists) phoros.processor("Get: Family", {}, function (err2, fam) { if (!err2 && Array.isArray(fam)) { fam.forEach(function (member) { addEmail(member && member.emailAddress); }); } }); }); }

Choose a Date for Your Memory

Create Memory

Create Post

Adjust Thumbnail

Add Family Member

Add to Vault

Select photos & videos to upload

Select photos & videos for this album

Select more memories for this album

Upload important family documents

Send Message

Add Milestone