Show Desktop Notifications when available

(Kane York) #1

Gmail has this cool thing where when you get a new email, a notification will pop up on your screen.

two notifications on Mac two notifications on Ubuntu Linux

The Javascript API is documented in multiple places:

The W3C spec:
What’s actually implemented in Chrome:

Also, I found this ‘experimental’ Firefox addon to add support for them:
Desktop Notifications for Android – Add-ons for Firefox
It is supported in Firefox: Using the Notifications API - Web APIs | MDN

I think it would be cool if one of these happened whenever the number on the notification icon changes - i.e. before the email notification gets sent out. This lets me get notified ‘more instantly’ and even avoid the notification email if I want to go check out what it was.

In fact, as I was writing this, the number went from 0 to 1. It really would be nice to have these popups with their short descriptions of what it is :smile:

Option to notify with sound
Discourse Chrome Extension to show unread count
New notification permissions request bar?
Discourse Narrative Bot Alpha Feedback
(Kane York) #2

I made a mockup by editing one of the images:

(I think the text is a little off-center :frowning:)

(Luke Larris) #3

I think it would be a really cool idea, but sadly, the only browser that supports this out of the box is Chrome. While I am a strong Chrome fanboy myself, I think Discourse is trying to make all features of their software work in today’s major browsers (Chrome, Firefox, IE10 maybe).

Edit: I see Firefox is supported, nevermind. I am totally for this feature now.

(Kane York) #4

Also, according to the Mozilla page:

Safari started supporting notification with Safari 6 but only on Mac OSX 10.8+ (Moutain Lion).

(Jeff Atwood) #5

I support it for sure but we’d like to see it as a community PR if possible.

(Claus Strasburger) #6

I would really like that feature. Will put it onto my project heap.
If this branch is still 404, I haven’t started yet (would love to help if somebody decides to do this before me).

//edit: I just realized I pushed to master, so watch the commits on master if you’re interested.

(Claus Strasburger) #7

Sorry I have been so quiet on this, but here’s a little update:

Currently, I have notifications running like this:

  • They can be enabled/disabled with a setting in the user settings panel (I plan to add a button to the notifications dropdown, too).
  • Before displaying, the content of the new post gets fetched and then inserted into the popup itself
  • When the user clicks on the notification, the window is brought to front and the post is opened

If you want to, you can checkout the branch or see the full diff!

There are some things missing:

  • If the user has multiple Discourse tabs open, he gets multiple notifications. Bad.
  • If the user has the topic open, he gets a notification for that topic. Bad.
  • The setting seems a bit hidden

and some things which I am not sure on:

  • Currently, I use window.location to redirect the user. There should be a way to open that link without reloading the whole page, Does someone have an Idea where that might be?
  • I set the NotifcationsEnableButton to switch its appearance based on the Property Discourse.Notifications.enabled, which doesn’t seem to trigger.
    I worked around this with a this.rerender(); in the click hander, but that seems smelly.

(Claus Strasburger) #8

A quick update on the situation:

  • The notifications will be displayed only once now, even if multiple forum windows are open
  • The content of the post has to be fetched seperately now, since we need the raw version. Maybe I could shorten the content if it’s too long.
  • If the window is active (has focus), no notification is shown
  • Now using Discourse.Router.transitionTo() to load a topic after clicking on the popup

Things on TODO heap:

  • The settings could be more refined. Many users will want to only get notifications for private messages and Watched threads.
  • The messate ‘There are x new topics’ on the topic list should have a ‘desktop notification button’ if they are supported, but not enabled
  • The same button could be added subtly to the bottom-right of the notifications dropdown (maybe)

Anyone who is interested should totally check out and test my branch!

(sati) #9

I presume that this is an equivalent implementation similar to the nodebb desktop notification plugin. Will this work with mobile push notifications as well? Also is this something that will be merged into the main branch or as a plugin?

(Claus Strasburger) #10

It is somewhat similiar to that, but with some more complexity – I’ll test the nodebb-plugin at some point to see if it suffers from the same problems my first version did :smile:

As for the mobile notifications: I really do not know how those “just” work – will investigate.
If it’s a core feature of the Notification API, then it should work out-of-the-box.

(Bradley Boven) #11

Is this going to be created as a plugin? My mods would love desktop notifications for new messages but I don’t want to run a separate (older) branch.

(Claus Strasburger) #12

Currently, it’s just a set of patches – I haven’t gotten around to work on it further, yet. It could be converted to a plugin, but that would involve a fair bit of monkey-patching.
I will definitely look into that when I get to it.
On the other hand, it shouldn’t be a problem to apply it to the current master, so maybe it could be merged once it’s complete.

And if you cannot wait, you’re invited to try and help :smiley:

(Michael Downey) #13

Hi @cfstras … very excited about the idea of this being merged … do you think any of your TODO’s are blockers from that happening?

(Claus Strasburger) #14

Probably. I would not consider it stable at this point, and the core functions I added don’t have any (useful) tests.

Migrating to a plugin might be the best idea to get this out.

(Theron Boerner) #15

Just for reference, you should check this out GitHub - ttsvetko/HTML5-Desktop-Notifications: Desktop notifications plugin for Chrome, Safari, Firefox and IE9+. It seems like it adds support for all major browsers.

(Bradley Boven) #16

I’m also very interested in seeing this come to life as a plugin (or merged into master!). We have subject matter experts that are constantly on our forum waiting for questions and having a desktop notification pop up when a new message or topic is posted would be a huge QOL improvement.

(Theron Boerner) #17

Status update please?

(Sam Saffron) #18

Yeah @cfstras what ever happened to this?

@riking is this something you would like to play with? Its really not a “required” feature or anything, but I can get that some people might get a kick out of this.

(Claus Strasburger) #19

It dropped of my table, simply because I’m not that deep into Rails currently and have way too many software projects.

I still deeply want it as a feature though, and would be ecstatically happy if my code was used as a base :smiley:.
However, I could imagine that the changes will be somewhat hard to rebase against the current form of Discourse, which might maaaybe make it easier to start fresh.

@hunterboerner: Sorry, I somehow didn’t see your post until now.

(Kane York) #20

It’s going to need quite the refactor to Notifications. I’d say it’s blocked on getting rid of, or rewriting, PostAlerter and PostAlertObserver.