Mathias Panzenböck, a student at the technical university in Vienna, Austria, has been working an entirely Javascript-based Magnatune audio player. Mathias is already notorious for his "Browser Ponies" javascript hack (MUST BE SEEN TO BE BELIEVED!), which draws way-too-cute animated ponies all over your web browser.
I've been talking to Mathias for some weeks now, and I think his project is solid enough for me to show it to you, and for you to give it a try. It's pretty impressive, and very useful as an alternative way of finding and playing Magnatune's music.
You can try his Magnatune player at this URL:
http://greattuneplayer.jit.su//
There is a "take a tour" link which shows you the various features, including a nicely done drag-and-drop playlist feature. I do recommend it.
If you're a member, be sure to click the "[ ] Member" box toward the top and give the player your name and password. You can then listen advertising-free.
There is a collapsing genre-browser on the left side of the page, which shows you artist info (and their albums) when you click on an artist, and then more info about the album when you click on an album. You can play albums directly, or add them to a playing queue.
Here are some screen pictures from Mathias' player:
Mathias' project is open source, based on SQLite, and is an impressive example of what you can do with Javascript these days. Note that some web browsers (such as the iPhone/iPad, and IE) still have some visual glitches). We're also unsure whether his server is up to the task of lots of Magnatune fans using his site at the same time, so this is a good beta test!
-john
Definitely very impressive! Works well so far in Chrome.
Posted by: Daniel Clements | January 30, 2012 at 02:51 PM
Using Chrome 16.0.912.77 on Debian Squeeze, kinda slow to respond, may be even so slow that at times annoying... But must say, it's really awesome JS. If u can make it faster, even better !
Posted by: todd moon | January 30, 2012 at 05:12 PM
@Danial Clements: Scrolling in Chrome under Linux is kinda slow. I guess because of all the rounded corners and box-shadows. It is fast in every other browser or operating system. Kinda ironic, because I myself use Chrome under Linux (I'm Mathias, the guy who wrote it). But my aim was to experiment with HTML 5 audio and to learn jQuery. So my focus wasn't on getting it work perfectly everywhere.
Posted by: panzi | January 30, 2012 at 06:24 PM
Running FF 9.01 on a Windows XP Pro box, I tried the player and it looked really good. I like the drag-and-drop playlists, the graphics, colour scheme..everything. BUT
When I logged in to Magnatune from there and reloaded the page, the page realigned so that the screen was mostly filled with the lower righthand "info" content and the player was cut half-off at the top. The lefthand content is squeezed almost completely off the page and cannot be used. I tried reloading, resizing the page and everything..no change.
I hope this can be fixed because I really liked the interface up until the strangeness following login.
Posted by: Spike Page | January 31, 2012 at 08:02 AM
I have a previous post regarding the player in FF 9.01, and here are my findings in IE 8.
The player works excellently in IE. I love the drag-and-drop and the playlist functions. My only real complaint is appearance. I prefer the rounded-off look that I saw in FF, and it seems in IE there is a considerably wider amount of space between lines of text. In spite of those issues I'd be quite happy using this player except that I am not fond of IE at all.
GREAT job on developing this player. I look forward to seeing the perfected final outcome.
Posted by: Spike Page | January 31, 2012 at 08:26 AM
awesome :D
what about optional eyecandy so slow browsers dont get slow ??
Posted by: Guille | January 31, 2012 at 09:06 AM
FF 9.01 bug update
I cleared cookies, rebooted my computer and reloaded the player in FF. It's displaying fine now, even after I logged in. Must've been a buggy glitch somewhere besides the basic coding. I'll keep you posted if things change, but so far, so good! :)
Posted by: Spike Page | January 31, 2012 at 10:14 AM
@Spike Page: Maybe you just clicked the hide player and hide collection buttons? It's the small triangles at the edge of the player/the collection that should still be visible.
See:
http://web.student.tuwien.ac.at/~e0427417/images/hide_player.png
http://web.student.tuwien.ac.at/~e0427417/images/show_player.png
http://web.student.tuwien.ac.at/~e0427417/images/hide_collection.png
http://web.student.tuwien.ac.at/~e0427417/images/show_collection.png
Posted by: panzi | February 02, 2012 at 04:55 PM
I thought that at first, but the buttons were not displaying. The page would start out with the windows fully visible but as soon as the content loaded the left and top windows would collapse. My only guess is that the script that loads and controls the buttons had downloaded with a bad or missing line. The problem hasn't happened again so I'm not terribly worried.
BTW I love the playlists more and more. This may be a nutty question, but is there a way to export my playlists to other users?
Posted by: Spike Page | February 03, 2012 at 08:19 PM
Another cool player like this is rainwave.cc, which is also open source (if anyone cares to look at it). The site sends icecast streams of video game music/remix music/covers. Impressive JS!
Posted by: Brett Cornwall | February 04, 2012 at 08:44 PM
@Spike Page:
Well, you can export the current playlist as m3u, but I haven't implemented exporting all saved playlists or importing any kind of playlist. Might do that some day, but it will only work on browsers that support the HTML 5 FileReader API.
For now you could use Chromes Inspector or I guess also Firebug to copy the local storage value called "playlist.saved" from one browser profile to another. But I guess you have to be a very advanced user (web developer) to know how to do that.
Posted by: panzi | February 04, 2012 at 10:00 PM
@Spike Page:
I've added a custom JSON based export format and an option to export all saved playlists and an import function. Note that I've disabled export in IE because it does not support long data:-URLs (and not even window.open(a_data_url) anyway) and import is only supported if the browser supports the HTML5 FileReader API (I think only IE 10 will do this). So I would recommend to use any browser that is not IE. I would recommend doing this anyway.
Posted by: panzi | February 05, 2012 at 05:46 PM
I like the idea of option eye candy. My connection is really slow so if anyone could manage this that would be great.
Posted by: Life Insurance Quotes | February 09, 2012 at 03:46 PM
Can't get it to work in my configuration: FF 10.0 linux.
Firebug gives this error:
Security error
(typeof(localStorage) === "undefined" ? "" :
http://web.student.tuwien.ac.at/~e0427417/magnatune-player/javascripts/magnatune.js
Line 3596
Posted by: Pieter | February 10, 2012 at 01:10 AM
@Pieter:
Ok, that's interesting. Why would this ever give a security error? Did you enable some kind of advanced security settings in Firefox? Did you forbid websites to use the local storage? Or do you maybe use some special plugin that might cause this? It works for me in Firefox 10.0.1 in Fedora Linux (64bit) and Max OS X.
Posted by: panzi | February 15, 2012 at 03:14 PM
Just wanted to say that I moved Magnatune Player to: http://magnatuneplayer.jit.su/
The old installation will no longer be updated and will go away shortly. Please export your playlists and import them at the new website.
Posted by: panzi | June 05, 2012 at 05:30 PM
Ignore that last comment, I moved it to: http://greattuneplayer.jit.su/
Posted by: panzi | June 08, 2012 at 05:46 AM