HTML5 Notifications API in place of Notifications DIV
-
tl;dr
Use Web Notifications instead of a notification<div>
on the forum.Longer Ramblings
Currently, the forum does notifications in a weird way where a little box appears on the screen. This is fine if the page is currently active, but totally useless if:- The page is open in a background tab
- The page is in a web panel
Right now, I've been using this user script:
// ==UserScript== // @name Vivaldi Notify Alerts // @namespace lonm.vivaldi.net // @include https://forum.vivaldi.net/* // @version 1 // ==/UserScript== (function(){ "use strict"; if(Notification.permission !== "granted"){ Notification.requestPermission(); } const alertObserver = new MutationObserver(alertChanged); const config = {childList: true}; function alertChanged(mutations){ console.log(mutations); mutations.forEach(mutation => { if(mutation.type === 'childList' && mutation.addedNodes.length > 0){ const notify_text = mutation.addedNodes[0].innerText; console.log(mutation); console.log(notify_text); const note = new Notification("Vivaldi Forum", { body: notify_text, icon: "https://forum.vivaldi.net/plugins/nodebb-theme-vivaldi/images/favicon.png" }); setTimeout(function(){note.close();}, 5000); } }); } const alertbox = document.querySelector("body > div.alert-window"); alertObserver.observe(alertbox, config); }());
To auto-create a proper Web Notification instead of the current ones, but this isn't perfect (particularly because the V forum LIKES TO USE ALL CAPS FOR SOME NOTIFICATIONS (despite the fact that this isn't permitted by the rules ;p) - and if I could make a second related request, Proper Cased Notifications would be welcome..
Obviously, as per the general theme of this place, such an implementation ought to be optional. Maybe by showing the
div
notifications if a user doesn't grant Web Notifications permission, of even just hidden away in the user preferences. -
-