NoticeManager.bootstrap - refactor + modernize

This commit is contained in:
abuyoyo 2024-09-01 06:28:05 +03:00
parent ca68f59a28
commit 7cc5b6de5a

View File

@ -2,27 +2,26 @@
* NoticeManager class/module * 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.notice",
"div.updated", "div.updated",
] ]
let selectors_warning = [ const selectors_warning = [
"div.notice-warning", "div.notice-warning",
"div.update-nag", "div.update-nag",
] ]
let selectors_error = [ const selectors_error = [
"div.error", "div.error",
"div.notice-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", ".inline",
".below-h2", ".below-h2",
".theme-info .notice", ".theme-info .notice",
@ -30,29 +29,43 @@ var NoticeManager = (function ($, document) {
] ]
// wait function used with autoCollapse // wait function used with autoCollapse
let wait = function (ms) { const wait = function (ms) {
var dfd = $.Deferred() var dfd = $.Deferred()
setTimeout(dfd.resolve, ms) //callback, timeout till callback setTimeout(dfd.resolve, ms) //callback, timeout till callback
return dfd.promise() return dfd.promise()
} }
const options = window.notice_manager_options
let notices let notices
let button let button
let panel let panel
let haveClosed // set to true on first close/collect
let dismissNoticesButton 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
return {
bootstrap: () => {
// Init selectors
button = $("#meta-link-notices") button = $("#meta-link-notices")
panel = $("#meta-link-notices-wrap") panel = $("#meta-link-notices-wrap")
haveClosed = false
dismissNoticesButton = $("#meta-link-notices-wrap button.notice-dismiss") 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", () => { dismissNoticesButton.on("click", () => {
screenMeta.close(panel, button) screenMeta.close(panel, button)
if (! haveClosed){ if (!haveClosed) {
NoticeManager.collectNotices() NoticeManager.collectNotices()
} }
NoticeManager.addCounter() NoticeManager.addCounter()
@ -83,21 +96,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 * Remove panel if there are no notices on this page
@ -117,7 +129,7 @@ var NoticeManager = (function ($, document) {
/** /**
* auto-open notices panel * auto-open notices panel
*/ */
if (button.length && ! options.distraction_free) { if (button.length && !options.distraction_free) {
panel.toggle() panel.toggle()
button.addClass("screen-meta-active") button.addClass("screen-meta-active")
screenMeta.open(panel, button) screenMeta.open(panel, button)
@ -128,7 +140,7 @@ var NoticeManager = (function ($, document) {
* only auto-close if we have collected notices previously * only auto-close if we have collected notices previously
* only auto-close if no error messages * only auto-close if no error messages
*/ */
if (options.auto_collapse && ! options.distraction_free) { if (options.auto_collapse && !options.distraction_free) {
wait(4000).then(() => { wait(4000).then(() => {
if (haveClosed && NoticeManager.getNoticesTopPriority() != 'error') { if (haveClosed && NoticeManager.getNoticesTopPriority() != 'error') {
screenMeta.close(panel, button) screenMeta.close(panel, button)
@ -141,25 +153,8 @@ var NoticeManager = (function ($, document) {
NoticeManager.addCounterWhenClosed() 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, getNotices: () => notices,
getNoticesTopPriority: () => { getNoticesTopPriority: () => {
@ -210,7 +205,7 @@ var NoticeManager = (function ($, document) {
}, },
addCounter: () => { addCounter: () => {
if (!button.children('.plugin-count').length){ if (!button.children('.plugin-count').length) {
button.append( button.append(
$("<span/>").text(notices.filter(":visible").length).attr({ $("<span/>").text(notices.filter(":visible").length).attr({
class: "plugin-count", class: "plugin-count",
@ -223,7 +218,7 @@ var NoticeManager = (function ($, document) {
* cannot rely on filter(:visible) * cannot rely on filter(:visible)
*/ */
addCounterWhenClosed: () => { addCounterWhenClosed: () => {
if (!button.children('.plugin-count').length){ if (!button.children('.plugin-count').length) {
button.append( button.append(
$("<span/>").text(notices.length).attr({ $("<span/>").text(notices.length).attr({
class: "plugin-count", class: "plugin-count",
@ -247,7 +242,7 @@ var NoticeManager = (function ($, document) {
$("#meta-link-notices-link-wrap").detach() $("#meta-link-notices-link-wrap").detach()
$("#meta-link-notices-wrap").detach() $("#meta-link-notices-wrap").detach()
if ($("#screen-meta-links").children().length == 0){ if ($("#screen-meta-links").children().length == 0) {
$("#screen-meta-links").detach() $("#screen-meta-links").detach()
} }
} }
@ -262,4 +257,6 @@ var NoticeManager = (function ($, document) {
notices.insertBefore(".wrap:first") notices.insertBefore(".wrap:first")
}, },
} }
}(jQuery,document) ) }(jQuery);
jQuery(NoticeManager.bootstrap);