Issue #3267185 by ChrisSnyder, sadman: Custom JS Event Listener (fd61b31b) · Commits · project / sitewide_alert

js/init.es6.js

+24 −3

Original line number	Diff line number	Diff line
		@@ -50,7 +50,13 @@
		String(Math.round(new Date().getTime() / 1000)),
		);
		document.querySelectorAll(`[data-uuid="${alert.uuid}"]`)
		.forEach(alert => alert.remove());
		.forEach(alert => {
		alert.dispatchEvent(new CustomEvent('sitewide-alert-dismissed', {
		bubbles: true,
		composed: true
		}));
		removeAlert(alert);
		});
		};

		const buildAlertElement = alert => {
		@@ -67,6 +73,15 @@
		return alertElement.firstElementChild;
		}

		const removeAlert = alert => {
		alert.dispatchEvent(new CustomEvent('sitewide-alert-removed', {
		bubbles: true,
		composed: true
		}));

		alert.remove();
		}

		const fetchAlerts = () => {
		return fetch(
		`${window.location.origin +
		@@ -98,7 +113,7 @@
		alert => !alerts.includes(alert.getAttribute('data-uuid')),
		);

		alertsToBeRemoved.forEach(alert => alert.remove());
		alertsToBeRemoved.forEach(alert => removeAlert(alert));
		});
		};

		@@ -128,12 +143,18 @@
		existingAlertElement
		? root.replaceChild(renderableAlertElement, existingAlertElement)
		: root.appendChild(renderableAlertElement);

		renderableAlertElement.dispatchEvent(new CustomEvent('sitewide-alert-rendered', {
		bubbles: true,
		composed: true
		}));

		return;
		}

		// Remove alert if it is on the page and should no longer be.
		if ((dismissed \|\| !showOnThisPage) && existingAlertElement) {
		existingAlertElement.remove();
		removeAlert(existingAlertElement);
		}
		});
		});

js/init.js

+21 −3

Original line number	Diff line number	Diff line
		@@ -50,7 +50,13 @@

		const dismissAlert = alert => {
		window.localStorage.setItem(`alert-dismissed-${alert.uuid}`, String(Math.round(new Date().getTime() / 1000)));
		document.querySelectorAll(`[data-uuid="${alert.uuid}"]`).forEach(alert => alert.remove());
		document.querySelectorAll(`[data-uuid="${alert.uuid}"]`).forEach(alert => {
		alert.dispatchEvent(new CustomEvent('sitewide-alert-dismissed', {
		bubbles: true,
		composed: true
		}));
		removeAlert(alert);
		});
		};

		const buildAlertElement = alert => {
		@@ -68,6 +74,14 @@
		return alertElement.firstElementChild;
		};

		const removeAlert = alert => {
		alert.dispatchEvent(new CustomEvent('sitewide-alert-removed', {
		bubbles: true,
		composed: true
		}));
		alert.remove();
		};

		const fetchAlerts = () => {
		return fetch(`${window.location.origin + drupalSettings.path.baseUrl + drupalSettings.path.pathPrefix}sitewide_alert/load`).then(res => res.json()).then(result => result.sitewideAlerts, error => {
		console.error(error);
		@@ -79,7 +93,7 @@
		roots.forEach(root => {
		const existingAlerts = root.querySelectorAll('[data-uuid]');
		const alertsToBeRemoved = Array.from(existingAlerts).filter(alert => !alerts.includes(alert.getAttribute('data-uuid')));
		alertsToBeRemoved.forEach(alert => alert.remove());
		alertsToBeRemoved.forEach(alert => removeAlert(alert));
		});
		};

		@@ -96,11 +110,15 @@
		if (showOnThisPage && !dismissed) {
		const renderableAlertElement = buildAlertElement(alert);
		existingAlertElement ? root.replaceChild(renderableAlertElement, existingAlertElement) : root.appendChild(renderableAlertElement);
		renderableAlertElement.dispatchEvent(new CustomEvent('sitewide-alert-rendered', {
		bubbles: true,
		composed: true
		}));
		return;
		}

		if ((dismissed \|\| !showOnThisPage) && existingAlertElement) {
		existingAlertElement.remove();
		removeAlert(existingAlertElement);
		}
		});
		});