« Back to jordanbalagot.com
New Custom Growl and MP3 Download Notification System

Posted on Sunday 22 February 2009

This weekend I wrote and combined some custom statistics software that broadcasts activity onto my site. I’ve been getting lots of direct mp3 traffic from China thanks to the music search engine Soso. I wanted to highlight that activity as well as try to encourage users to browse the rest of my site. I also wanted to access download information easily and make my site more interactive.

jGrowl and MP3 Stats

The first thing I did was wrote a mod_rewrite in my htaccess file to redirect mp3 requests to php. I had the php script store the request to a database, and then serve the file.

From there, I could analyze which of my mp3s were most popular. On my homepage, I visualized this with an open source tool, HTML-Graphs. If you click on an MP3, and then refresh my homepage, the graph will update.

Next, I wanted to broadcast across my site whenever someone downloaded an mp3. I have used Growl for a long time on Mac OS X and it is one of my favorite things about using my computer. I wondered if there was a way to emulate Growl on my website, and quickly came across jGrowl. Amazing! You can generate growl notifications on your website with one line of code–it’s actually easier than using the applescript/shell hooks regular Growl uses.

So I used this helpful tutorial on AJAX polling (in this case for a chat program) to poll my custom site events database for changes. I ended up using jQuery instead of Prototype though because jGrowl uses jQuery and they conflicted with each other. Once I wrote the script, it was easy to include it from my blog template and other pages of my site.

Now, if you open up a new window and click on any MP3 on my site, within 10 seconds every page of my site will broadcast that that mp3 is being downloaded. Try it! It will broadcast to several pages if you have several pages open, and will even work if you use a different computer to download the file. It shows the first two digits of your IP address to show that I’m not “faking” this, but rest of it is masked to protect your privacy.

I imagine this is just the start of new forms of website interaction possibilities. The other jGrowl notifications that come to mind are facebook and twitter status updates and blog posts. Any RSS feed could potentially be imported too. I think I will use this for site news as well. What would you like to see in my website or other website growl notifications? Feel free to leave any comments or suggestions.

Edit: Wow, because it’s just AJAX and javascript, both monitoring and downloading even work on the iPhone!

2 Comments for 'New Custom Growl and MP3 Download Notification System'

    July 8, 2009 | 9:56 pm

    Hey! I saw your site on Lifehacker.

    I love what you did here. It’s a pretty awesome system.

    This is a given application for web-based chat programs. In fact, it’s going to be needed anywhere Growl is used now, as we move the PC desktop to the cloud. I bet Google’s Chrome OS will have something very similar. 🙂


    August 13, 2009 | 10:45 am

    Thanks Ivan!
    Looks like Facebook is using a growl-like notification system now. I wonder when google reader and twitter will do the same!

Leave a comment



Information for comment users
Line and paragraph breaks are implemented automatically. Your e-mail address is never displayed. Please consider what you're posting.

Use the buttons below to customise your comment.

RSS feed for comments on this post | TrackBack URI