diff --git a/extension.json b/extension.json index 930158a..39f5805 100644 --- a/extension.json +++ b/extension.json @@ -48,6 +48,9 @@ "styles": [ "styles/ext.networknotice.Notice.less" ], + "scripts": [ + "scripts/ext.networknotice.Notice.js" + ], "position": "bottom" } }, diff --git a/resources/scripts/ext.networknotice.Notice.js b/resources/scripts/ext.networknotice.Notice.js new file mode 100644 index 0000000..fccb94c --- /dev/null +++ b/resources/scripts/ext.networknotice.Notice.js @@ -0,0 +1,56 @@ +( function ( window, document ) { + 'use strict'; + + const LOCAL_STORAGE_KEY = 'networknotice'; + + function init() { + if ( 'localStorage' in window ) { + document.querySelectorAll( '[data-component="network-notice"]' ).forEach( function( notice ) { + const key = notice.dataset.id; + if ( isInStorage( key ) ) { + notice.classList.add( 'd-none' ); + } else { + const closeButton = notice.querySelector( + '[data-component="network-notice-close-button"]' + ); + closeButton.onclick = function() { + notice.classList.add( 'd-none' ); + putIntoStorage( key ); + }; + } + } ); + } + } + + function getItemsFromStorage() { + const items = localStorage.getItem( LOCAL_STORAGE_KEY ); + return items ? JSON.parse( items ) : [ ]; + } + + function putIntoStorage( key ) { + const items = getItemsFromStorage(); + if ( !items.includes( key ) ) { + items.push( key ); + localStorage.setItem( LOCAL_STORAGE_KEY, JSON.stringify( items ) ); + } + } + + function isInStorage( key ) { + const items = getItemsFromStorage(); + return items.includes( key ); + } + + /** + * Check on document readyState + */ + if ( document.readyState === 'complete' ) { + init(); + } else { + document.addEventListener( 'readystatechange', () => { + if ( document.readyState === 'complete' ) { + init(); + } + } ); + } + +} ( window, document ) ); diff --git a/src/Hooks/MainHookHandler.php b/src/Hooks/MainHookHandler.php index e9f23fc..ad61fea 100644 --- a/src/Hooks/MainHookHandler.php +++ b/src/Hooks/MainHookHandler.php @@ -22,6 +22,7 @@ class MainHookHandler implements */ public function onBeforePageDisplay( $out, $skin ): void { $out->addModuleStyles( 'ext.networknotice.Notice' ); + $out->addModules( 'ext.networknotice.Notice' ); } /**