(()=>{class t{constructor(t={}){this.popupQueue=[],this.isLoading=!1,this.cache=window.jvbCache,this.isProcessingQueue=!1,this.options={maxVisibleNotifications:5,displayDuration:{high:7e3,medium:5e3,low:3e3},position:"bottom-right",pollingInterval:6e4,...t},this.button=document.querySelector(".toggle.notifications"),this.submenu=document.querySelector(".notifications-preview"),this.toasts=document.querySelector(".toasts"),this.notificationsLoaded=!1,this.pollTimer=null,this.lastCheck=null,this.button&&this.submenu&&this.init(),this.clickListeners=this.checkClicks.bind(this),this.updateListeners()}init(){this.submenu.addEventListener("click",t=>{const e=t.target.closest(".mark-read");if(e){const t=e.closest(".notification-preview");t&&this.markAsRead(t.dataset.id)}}),this.loadNotifications(),this.initializePolling()}checkClicks(t){if(t.target.closest(".close-toast")){let e=t.target.closest(".toast");e.classList.add("hiding"),setTimeout(()=>{e.remove(),this.updateListeners()},300)}}updateListeners(){this.toasts.addEventListener("click",this.clickListeners)}toggleDropdown(){this.notificationsLoaded||this.loadNotifications()}async loadNotifications(t=!1){if(!this.isLoading)try{this.isLoading=!0;const t=new URLSearchParams({user:window.auth.getUser(),status:"unread",limit:5}),e=await this.cache.fetchWithCache(`${jvbSettings.api}notifications?${t.toString()}`,{method:"GET",headers:{"X-WP-Nonce":window.auth.getNonce(),"X-Action-Nonce":window.auth.getNonce("notifications")}},{context:"notifications",forceRefresh:!0});this.renderPreviewNotifications(e.notifications),this.updateUnreadCount(e.total),this.notificationsLoaded=!0,this.lastCheck=(new Date).toUTCString()}catch(t){console.error("Error loading notifications:",t),this.renderErrorState(t.message)}}renderErrorState(t){const e=this.submenu.querySelector("#view-all");this.submenu.querySelectorAll("li:not(#view-all)").forEach(t=>t.remove());const i=document.createElement("li");i.className="error-state",i.innerHTML=`\n <p>${t}</p>\n <button onclick="window.jvbNotifications.loadNotifications()">\n Try Again\n </button>\n `,this.submenu.insertBefore(i,e)}renderPreviewNotifications(t){this.submenu.querySelector("#view-all");this.submenu.querySelectorAll("li:not(#view-all)").forEach(t=>t.remove()),t.forEach(t=>{let e=window.getTemplate("notificationItem");e.classList.add(t.status,`priority-${t.priority}`),e.dataset.id=t.id,e.prepend(getIcon(t.icon));let i=e.querySelector("p"),o=e.querySelector("time");[i.textContent,o.datetime,o.textContent]=[t.message,new Date(t.created_at).toISOString(),formatTimeAgo(t.created_at)];let s=window.getTemplate("notificationActions"),n=s.querySelector("button");t.actions.length>0&&(t.actions.forEach(e=>{let i=n.cloneNode(!0);e.primary&&i.classList.add("primary"),[i.dataset.id,i.dataset.action,i.textContent]=[t.id,e.label.toLowerCase(),e.label],s.append(i)}),n.remove()),e.append(s),this.submenu.prepend(e)}),0===t.length&&this.submenu.prepend(window.getTemplate("emptyNotification"))}queuePopupNotification(t){this.popupQueue.push(t),this.processPopupQueue()}async processPopupQueue(){if(!this.isProcessingQueue&&0!==this.popupQueue.length){for(this.isProcessingQueue=!0;this.popupQueue.length>0;){const t=this.popupQueue.shift();await this.showToast(t.message,t.type,t.actions),this.popupQueue.length>0&&await new Promise(t=>setTimeout(t,300))}this.isProcessingQueue=!1}}showToast(t,e="success",i={}){let o=window.getTemplate("notificationPopup");if(o.classList.add(e),o.querySelector("p").textContent=t,Object.entries(i).length>0){let t=window.getTemplate("notificationActions"),e=i.querySelector("button");notification.actions.forEach(i=>{let o=e.cloneNode(!0);i.primary&&o.classList.add("primary"),[o.dataset.action,o.textContent]=[i.label.toLowerCase(),i.label],t.prepend(o)})}this.toasts.append(o),setTimeout(()=>{o.classList.add("show")},10),setTimeout(()=>{o.classList.add("hiding"),setTimeout(()=>{o.remove()},300)},3e3)}createNotificationElement(t){this.showToast(t.message),this.renderPreviewNotifications([t])}removePopupNotification(t){t.classList.remove("show"),setTimeout(()=>{t.remove()},300)}updateUnreadCount(t){let e=this.button.querySelector("span");this.button.classList.remove("has"),[e.textContent,e.ariaLabel]=["","Notifications"],t&&!isNaN(t)&&(t=parseInt(t,10))>0&&(this.button.classList.add("has"),[e.textContent,e.ariaLabel]=[t,t+" unread notification"+(t>1?"s":"")])}async markAsRead(t){try{const e=this.submenu.querySelector(`[data-id="${t}"]`);if(!e)return;e.classList.add("slide-out");const i=await fetch(`${jvbSettings.api}notifications`,{method:"POST",headers:{"X-WP-Nonce":window.auth.getNonce(),"X-Action-Nonce":window.auth.getNonce("dash")},body:{notification:t,user:window.auth.getUser()}});if(!i.ok)throw new Error(notificationSettings.strings.error);const o=await i.json();o.success&&(setTimeout(()=>{e.remove();if(0===this.submenu.querySelectorAll(".notification-preview").length){const t=this.submenu.querySelector("#view-all"),e=document.createElement("li");e.className="empty-state fade-in",e.textContent=notificationSettings.strings.noNotifications,this.submenu.insertBefore(e,t),requestAnimationFrame(()=>{e.classList.remove("fade-in")})}},300),this.updateUnreadCount(o.total))}catch(t){console.error("Error marking notification as read:",t)}}initializePolling(){this.pollTimer=setInterval(()=>{this.checkNotifications()},this.options.pollingInterval),document.addEventListener("visibilitychange",()=>{document.hidden||this.checkNotifications()})}async checkNotifications(){try{const t=new URLSearchParams({user:window.auth.getUser(),status:"unread"}),e=await fetch(`${jvbSettings.api}notifications?${t.toString()}`,{headers:{"X-WP-Nonce":window.auth.getNonce(),"X-Action-Nonce":window.auth.getNonce("dash"),"If-Modified-Since":this.lastCheck}});if(!e.ok)return;(await e.json()).has_new&&await this.loadNotifications(!0)}catch(t){console.error("Check notifications error:",t)}}destroy(){this.pollTimer&&(clearInterval(this.pollTimer),this.pollTimer=null)}}document.addEventListener("DOMContentLoaded",async function(){window.auth.subscribe(e=>{"auth-loaded"===e&&(window.jvbNotifications=new t({position:"bottom-right",maxVisibleNotifications:5,displayDuration:5e3}))})}),window.addNotification=function(t,e="info"){window.jvbNotifications.showToast(t,e)}})();
|
