desktop notifications à la gmail notifications in chrome

[chris.h]

http://gmailblog.blogspot.com/2011/01/d ... s-and.html

It would be awesome if there was an option for turning on desktop notifications for song changes. Something along the lines of how gmail now can notify you of new emails when using chrome.

[station]

This would probably best be implemented as a google chrome extension, or a userscript (like Greasemonkey scripts).

I might poke around and try to figure out how to hook into the javascript events being fired on the page, but I'd love for someone to guide me!

[station]

I didn't end up creating a Chrome extension, but I did modify subsonic's files on the server directly to add notifications.

- Stop subsonic
- Find the subsonic program files. On Windows this was in the "Program Files" folder
- Extract the subsonic.war file somewhere convenient. I used the program 7-Zip for this.
- Open the file WEB-INF\jsp\playlist.jsp for editing
- Add this line to the end of the end of the "skip" function:


Code: Select all

setNotification(song);


- Add the following after that function:


Code: Select all

function setNotification(song)
   {
      var n;

      //webkitNotifications
      if (window.webkitNotifications.checkPermission() != 0)
      {
         setAllowNotification();
         return 0;
      }

      n = window.webkitNotifications.createNotification('/icons/now_playing.png', song.title, song.artist + ' - ' + song.album);
      n.ondisplay = function() {
               setTimeout(function(){
                  n.cancel();
               },5000); };
      n.show();
   }
   
   function setAllowNotification()
   {
      window.webkitNotifications.requestPermission(permissionGranted);
   }

   function permissionGranted()
   {
      if (window.webkitNotifications.checkPermission() == 0)
         setNotification();
   }


- Zip the contents of the unzipped folder back up into subsonic.war and place it in the subsonic program files folder
- Restart subsonic

I used these sites for the notification code:
http://www.210computing.com/google/chro ... tions.html
http://sandbox.gtaero.net/chrome/notifications.php

[Tanner Williamson]

@station

This would be great to have in the Mods forum if it's not there already.

[donpearson]

Moved to Mods

[mmilburn]

Thank you for this modification! It's probably my favorite thus far.

Any idea how I can link to the cover art for the new track?

[achoo5000]

So i've made this into a google chrome userscript (like greasemonkey).

It's a totally terrible hack-job, but it works basically. I just did it so people wouldn't need to edit their subsonic files. It would be much nicer to be built-in though for sure.

I've even updated it from above to put the album art (sort of*) into the popup.

Installation instructions:

1. Copy code below into a file called subsonicchromenotifications.user.js
2. change @match line to point to your subsonic server.
3. drag into chrome and follow instructions given by chrome.

Like above, the first time you listen to a song, it will ask for confirmation to make notifications, click allow.

Code: Select all

// ==UserScript==
// @name           Subsonic Chrome Notifications
// @namespace      http://www.activeobjects.no/subsonic/forum/viewforum.php?f=8
// @description    Uses chrome desktop notifications to display song title information while using Subsonic
// @match          http://<subsonichostname>/*
// ==/UserScript==

var pathname = window.location.pathname

if (pathname.substring(pathname.length-13,pathname.length) == 'playlist.view'){
   
    function addFunction(func, exec) {
        var script = document.createElement("script");
        script.setAttribute("type", "application/javascript");
        script.textContent = (exec ? "(" : "") + func.toString() + (exec ? ")();" : "");
        setTimeout(function() {
            document.head.appendChild(script)
        },500);
    }
   
    // this function is run with access to the real browser environment.
    inject = function() {
        // store the original skip (hopefully to preserve functionality for future changes to subsonic)
        skip_orig = skip;

        // add new skip with notification
        skip = function(index) {
            skip_orig(index);
            setNotification(songs[getCurrentSongIndex()]);
        };

        // notification functions
        setNotification = function(song) {
            var n;

            //webkitNotifications
            if (window.webkitNotifications.checkPermission() != 0) {
                setAllowNotification();
                return 0;
            }
           
            // get album art from nowPlatingService, and create the notification inside the callback
           
            window.parent.right.nowPlayingService.getNowPlaying(function(nowPlaying) {
               
                var imgUrl = 'icons/now_playing.png';
               
                for (var j = 0; j<nowPlaying.length; j++){
                    if(nowPlaying[j].artist == song.artist) {
                        imgUrl = nowPlaying[j].coverArtUrl;
                        break;
                    }
                }
                n = window.webkitNotifications.createNotification(imgUrl, song.title, song.artist + ' - ' + song.album);
               
                n.ondisplay = function() {
                    setTimeout(function() {
                        n.cancel();
                    },5000);
                };

                n.show();
               
            });
        }
           
        setAllowNotification = function() {
            window.webkitNotifications.requestPermission(permissionGranted);
        }

        permissionGranted = function() {
            if (window.webkitNotifications.checkPermission() == 0)
                setNotification();
        }
    } //  end of injected code
   
    addFunction(inject,true);
}



*it tries to get the album-art, but I did it in a very shitty hacky way that should work most of the time but not always.

[runebune]

I have a solution to get it to work more often with your hacky script
I noticed that the player need a little time to update itself. I first through it was a albumart download delay and cache issue.
I have also altered the condition where the albumart should be set:
if(nowPlaying[j].streamUrl == song.streamUrl)
instead of:
if(nowPlaying[j].artist == song.artist)
I will soon try to embed it into my server code

Code: Select all

// ==UserScript==
// @name           Subsonic Chrome Notifications
// @namespace      http://www.activeobjects.no/subsonic/forum/viewforum.php?f=8
// @description    Uses chrome desktop notifications to display song title information while using Subsonic
// @match          http://<subsonichostname>/*
// ==/UserScript==

var pathname = window.location.pathname

if (pathname.substring(pathname.length-13,pathname.length) == 'playlist.view'){
   
    function addFunction(func, exec) {
        var script = document.createElement("script");
        script.setAttribute("type", "application/javascript");
        script.textContent = (exec ? "(" : "") + func.toString() + (exec ? ")();" : "");
        setTimeout(function() {
            document.head.appendChild(script)
        },500);
    }
   
    // this function is run with access to the real browser environment.
    inject = function() {
        // store the original skip (hopefully to preserve functionality for future changes to subsonic)
        skip_orig = skip;

        // add new skip with notification
        skip = function(index) {
            skip_orig(index);
         //insert e small delay to let the player update the albumart url
            setTimeout('setNotification(songs[getCurrentSongIndex()])', 500);         
        };

        // notification functions
        setNotification = function(song) {
            var n;

            //webkitNotifications
            if (window.webkitNotifications.checkPermission() != 0) {
                setAllowNotification();
                return 0;
            }
           
            // get album art from nowPlatingService, and create the notification inside the callback
            window.parent.right.nowPlayingService.getNowPlaying(function(nowPlaying) {
               
                var imgUrl = '/icons/desktop_notification.png';
               
                for (var j = 0; j<nowPlaying.length; j++){
                    if(nowPlaying[j].streamUrl == song.streamUrl) {
                        imgUrl = nowPlaying[j].coverArtUrl;
                        break;
                    }
                }
                n = window.webkitNotifications.createNotification(imgUrl, song.title, song.artist + ' - ' + song.album);
               
                n.ondisplay = function() {
                    setTimeout(function() {
                        n.cancel();
                    },5000);
                };

                n.show();
               
            });
        }
           
        setAllowNotification = function() {
            window.webkitNotifications.requestPermission(permissionGranted);
        }

        permissionGranted = function() {
            if (window.webkitNotifications.checkPermission() == 0)
                setNotification();
        }
    } //  end of injected code
   
    addFunction(inject,true);
}

[achoo5000]

That's beautiful. Well done .

[vividboarder]

This is a great feature and would be awesome to see as an option in the player settings in Subsonic itself!

Sindre read these posts?

I checked out a branch and I might try it out later when I get the chance (a lot on my plate at the moment).

[tricer]

I created the .js file per the instructions and also changed @match. I dragged it into chrome and allowed the program when prompted.

It isn't working for me. Desktop notifications work for me from Gmail, but this doesn't.

Can anyone think of what else I may need to do?

[kermit22]

I created the .js file per the instructions and also changed @match. I dragged it into chrome and allowed the program when prompted.

It isn't working for me. Desktop notifications work for me from Gmail, but this doesn't.

Can anyone think of what else I may need to do?

Are you running Chrome in full screen mode? There is an addon confirmation bar that appears at the top of the screen that doesn't appear correctly while you are in full screen mode.

[jacobthe4th]

I created *js file as stated above, dragged it into my chrome browser. I allowed the install of the extension, as well as, permitted the server to post notifications...

No dice.

I had the previous notification running, no trouble.

Any clues?

I've flushed my cache, both in my browser as well as on my server.

Thanks,

Jacob

[tsquillario]

I just happened to stumble on this thread while Googling for some related stuff. I'm implementing the Desktop Notifications in the MiniSub Chrome App. I'm in the process of coding and testing it right now. It will be included in the next version.

Chrome App
https://chrome.google.com/webstore/detail/jccdpflnecheidefpofmlblgebobbloc

Forum Thread
http://forum.subsonic.org/forum/viewtopic.php?f=8&t=7553

[tsquillario]

I just happened to stumble on this thread while Googling for some related stuff. I'm implementing the Desktop Notifications in the MiniSub Chrome App. I'm in the process of coding and testing it right now. It will be included in the next version.

Chrome App
https://chrome.google.com/webstore/detail/jccdpflnecheidefpofmlblgebobbloc

Forum Thread
http://forum.subsonic.org/forum/viewtopic.php?f=8&t=7553

I pushed this update today, it's on GitHub and the Chrome Web Store, check it out!