0.26

CHANGELOG.md

@@ -1,5 +1,15 @@
 # Notice Manager Changelog
 
+## 0.26
+
+Release date: Sep 1 2024
+
+### Changed
+- Use Mutation Observer instead of deprecated `DOMNodeRemoved` event.
+
+### Added
+- Add method `NoticeManager.bootstrap()` to initialize Notice manager.
+
 ## 0.25
 
 Release date: Feb 18 2024

composer.json

@@ -2,7 +2,7 @@
 	"name": "abuyoyo/notice-manager",
 	"description": "Manage notices on WordPress admin pages. Adds 'Notices' screen-meta-link.",
 	"type": "wordpress-plugin",
-	"version": "0.25",
+	"version": "0.26",
 	"repositories": [
 		{
 			"type": "vcs",

js/notice_manager_panel.js

@@ -2,27 +2,26 @@
  * NoticeManager class/module
  * 
  */
-var NoticeManager = (function ($, document) {
+const NoticeManager = function ($) {
-	let options = window.notice_manager_options
 
-	let selectors_notice = [
+	const selectors_notice = [
 		"div.notice",
 		"div.updated",
 	]
 
-	let selectors_warning = [
+	const selectors_warning = [
 		"div.notice-warning",
 		"div.update-nag",
 	]
 
-	let selectors_error = [
+	const selectors_error = [
 		"div.error",
 		"div.notice-error",
 	]
 
-	let selectors_all = selectors_notice.concat(selectors_warning, selectors_error)
+	const selectors_all = selectors_notice.concat(selectors_warning, selectors_error)
 
-	let selectors_skip = [
+	const selectors_skip = [
 		".inline",
 		".below-h2",
 		".theme-info .notice",
@@ -30,26 +29,41 @@ var NoticeManager = (function ($, document) {
 	]
 
 	// wait function used with autoCollapse
-	let wait = function (ms) {
+	const wait = function (ms) {
 		var dfd = $.Deferred()
 		setTimeout(dfd.resolve, ms) //callback, timeout till callback
 		return dfd.promise()
 	}
 
+	const options = window.notice_manager_options
+
 	let notices
 
 	let button
 	let panel
-	let haveClosed // set to true on first close/collect
 	let dismissNoticesButton
 
-	// bootstrap
+	let haveClosed // set to true on first close/collect
-	// some of these need to run BEFORE document.ready - don't know why really
+	let panelObserver
+
+	return {
+		bootstrap: () => {
+
+			// Init selectors
 			button = $("#meta-link-notices")
 			panel = $("#meta-link-notices-wrap")
-	haveClosed = false
 			dismissNoticesButton = $("#meta-link-notices-wrap button.notice-dismiss")
 
+			// bootstrap notices
+			// get all notices that are not explicitly marked as `.inline` or `.below-h2`
+			// we add .update-nag.inline for WordPress Update notice
+			notices = $(selectors_all.join(', '))
+				.not(selectors_skip.join(', '))
+				.add("div.update-nag")
+
+			// Set state
+			haveClosed = false
+
 			dismissNoticesButton.on("click", () => {
 				screenMeta.close(panel, button)
 				if (!haveClosed) {
@@ -83,21 +97,20 @@ var NoticeManager = (function ($, document) {
 				}
 			})
 
+			// prevent jumpy scrollRestoration on reload page
+			// fixed below on 'beforeunload'
+			// if (history.scrollRestoration) {
+			//	history.scrollRestoration = 'manual'
+			//}
 			/**
-	 * document.on.ready
+			 * Set history.scrollTop to prevent jump on page refresh when scrollRestoration = auto
 			 */
-	$(() => {
+			$(window).on('beforeunload', () => history.pushState(
-
+					{ scrollTop: document.body.scrollTop },
-		console.log("NoticeManager.on.ready")
+					document.title,
-		console.log("options")
+					document.location.pathname
-		console.log(options)
+				)
-
+			)
-		// bootstrap notices
-		// get all notices that are not explicitly marked as `.inline` or `.below-h2`
-		// we add .update-nag.inline for WordPress Update notice
-		notices = $( selectors_all.join(', ') )
-			.not(selectors_skip.join(', '))
-			.add("div.update-nag")
 
 			/**
 			 * Remove panel if there are no notices on this page
@@ -141,25 +154,8 @@ var NoticeManager = (function ($, document) {
 				NoticeManager.addCounterWhenClosed()
 			}
 
-	}) // end document.on.ready
+		},
 
-	// prevent jumpy scrollRestoration on reload page
-	// fixed below on 'beforeunload'
-	// if (history.scrollRestoration) {
-	//	history.scrollRestoration = 'manual'
-	//}
-	/**
-	 * Set history.scrollTop to prevent jump on page refresh when scrollRestoration = auto
-	 */
-	$(window).on("beforeunload", () => {
-		history.pushState(
-			{ scrollTop: document.body.scrollTop },
-			document.title,
-			document.location.pathname
-		)
-	})
-
-	return {
 		getNotices: () => notices,
 
 		getNoticesTopPriority: () => {
@@ -197,16 +193,14 @@ var NoticeManager = (function ($, document) {
 			 * When dismissible notices are dismissed, check if any notices are left on page.
 			 * If no notices are left - remove Notice Panel entirely
 			 */
-			$(document).on(
+			panelObserver = new MutationObserver(() => {
-				"DOMNodeRemoved",
-				"#meta-link-notices-wrap div.notice",
-				() => {
 				notices = panel
 					.find(selectors_all.join(", "))
 					.filter(":visible")
 				NoticeManager.maybeRemoveNoticesPanel()
-				}
+			});
-			)
+			panelObserver.observe(panel.get(0), { childList: true, subtree: true }); // only run once
+
 		},
 
 		addCounter: () => {
@@ -262,4 +256,6 @@ var NoticeManager = (function ($, document) {
 			notices.insertBefore(".wrap:first")
 		},
 	}
-}(jQuery,document) )
+}(jQuery);
+
+jQuery(NoticeManager.bootstrap);

notice-manager.php

@@ -2,7 +2,7 @@
 /**
  * Plugin Name: Notice Manager
  * Description: Manage notices on WordPress admin pages. Adds 'Notices' screen-meta-link panel to collect notices from page.
- * Version: 0.25
+ * Version: 0.26
  * Author: abuyoyo
  * Author URI: https://github.com/abuyoyo/
  * Plugin URI: https://github.com/abuyoyo/notice-manager