Skip Navigation
Kbin Userstyles and Userscripts @kbin.social blobcat @kbin.social

Kbin Notifications Panel

greasyfork.org Kbin Notifications Panel

Adds a notification panel to the navigation bar

Userscript that adds a notification panel to the navigation bar.

37
37 comments

  • Very nice! looks great

  • Just had to come back after a few days and say that once I got this working and added the other script that highlights the reply in the thread, it made reading notifications so much easier.

    • I'm glad! I just released a small update that automatically closes the panel if you click outside of it, so it's also easier to close now (ﾉ´ヮ´)ﾉ

      • Seems it broke for me. Inspection shows an error "DOMException: Document.querySelector: '.dropdown:has(.login)' is not a valid selector"

  • New request - currently when there's an update I redo a minor change I've been making for the size and location of the window. Maybe that can be added in as a preference? I've been changing the translateX percent number and adding in a width percentage at the end of the iframe CSS line. A huge change would be to make it resizable with the mouse and remember, but I don't know how hard that is.

    • The userscript is going to be a part of KES with the release of 2.0.0, definitely going to keep it in mind for the future (you can probably as well create an issue with adding the preference)

  • @blobcat
    I love this - definitely something that should be in native kbin, albeit supported natively without a frame. I do have a couple notes.

    The first is that I noticed you match multiple instances - which is great! However, you've hard-coded the notification path for kbin.social. To fix this, I've change the following:

    // Line 60 in the original script. Change the following:
iframe.src = 'https://kbin.social/settings/notifications';
// To this:
iframe.src = 'https://' + window.location.hostname + '/settings/notifications';

    The second is more a note for any instance admins who would like to support this...
    The default config for kbin, at least the bare metal (I haven't dug into the docker setup at all), is to set add_header X-Frame-Options DENY; in nginx. First is that X-Frame-Options is obsolete anyway, and the second is that the frame won't work with DENY being the setting.
    More reading: X-Frame-Options | MDN
    More reading: Content-Security-Policy | MDN

    Below are the steps you should take to enable functionality for this and to update away from X-Frame-Options:

    # I'm assuming you followed either the current or the soon-to-be bare-metal configuration.
# First, login to your instance as a user with sudo.
sudo nano /etc/nginx/sites-available/kbin.conf

# Locate the following line near the bottom: add_header X-Frame-Options DENY;
# Comment it out by adding a # in front. Create a new line under it and enter the following (replace domain.tld with your domain):
add_header Content-Security-Policy "from-ancestors 'self' https://domain.tld https://www.domain.tld";
# Save and exit, <CTRL>+x, y, <ENTER>

# Restart nginx
sudo systemctl restart nginx

    • Oh, embarrassing, I completely missed it! Fixed it now, thank you!

  • This is just what I needed.

  • It seems it does not fully fit yet. Generally the menu could be styled more like the other drop down menus.

    • Yeah, while styling it I had my Kbin-it theme enabled, which is why it didn't fit unless you had my userstyle on, I fixed it with 0.2.1.
      I will try to make it more like the other drop downs!

    • 0.2.2 now looks closer to other drop downs and the iframe uses kbin's variables so it's more compatible with custom themes!

      • Ah yes that looks good. The one last issue I immediately saw was that it does not close when you clock outside of it. You have to click the button again to make it close. And I wonder if you can prevent it from showing the full kbin interface for a moment in the frame, that may make the interface quicker in general.

  • This is great, I never knew I needed something like this! One problem I noticed though is that if you have the top bar enabled (the one that shows the list of random magazines), it shows up in the top of the notifications panel.

    • Completely missed me because I never used it, it's now hidden in 0.2.4 (releasing 5 updates in an hour lmao)

      • Sweet, thanks for the quick fix!

        releasing 5 updates in an hour lmao

        Just say you're doing Agile development lmao

  • I can't seem to get it to work. Using Greasemonkey on Firefox/Windows. I've tried disabling all other scripts and styles to make sure there's not something conflicting. I don't see anything coming up like the demo picture. I've got one message currently unread to test it with.

37 comments