This is an amazing rewrite from the Flash version - well worth the time they put into this one. They have some really dedicated staff members and some great talent on the team.
It's nice and probably uses way less system resources, but it definitely isn't as "polished" as the Flash version was. Not sure if that's a limitation of the HTML5/JS/CSS combo or if they just need to work on it more. It's mostly just little things, like missing visual fade transitions or a UI that doesn't look like it's been repeatedly bleached. But they add up to a noticeable difference, I think--the HTML5 app just isn't as vibrant.
That being said, I always thought their Flash app was amazingly slick and polished, so it's a tough act to follow I suppose.
EDIT: Plus if they are going to go this far with HTML5 it'd be awesome if they could cut the Flash cord entirely. Not sure if that's technically possible though.
I know the Grooveshark fans who are Linux users will appreciate the increased stability as well.
On Ubuntu 10.04 x64 Flash is pretty stable for me, except when I've got 40 Firefox tabs open (yes I'm seeing a therapist about that) and then try to run some Flash app that's more complex than a mere Youtube video. No more popping htop to manually kill nspluginwrapper that's in some kind of infinite loop ftw.
I'm not really sure this is HTML5. Looking at the source code, you don't see many of the hallmarks of HTML5. There HTML tag itself is distinctly XHTML 1.0 Strict, and the lack of any true HTML5 tags (e.g. SECTION, NAV) imply to me a hybrid -- a platypus, if you will. They do, interestingly, use HTML5 data tags.
Funny thing - everything works amazingly, until I turn Flashblock on http://i.imgur.com/HFe8h.png then all my stuff disappears (favs, playlists) and this js error hangs my firefox to death.
Besides that, it's awesome, even better than before.
Chrome sandboxes Flash. If Flash is on your machine but disabled for Firefox, you can preserve the configurations that allowed this, and use Chrome as a dedicated Grooveshark / misc. Flash player. Depending on your arrangement, quitting Chrome can mean quitting Flash, so it can be a pretty elegant solution.
Exelent UX, but the flashblock problem is anoying..
I think they sould put some empty flash animation somewhere on the main page so that you could hit "play" on flashblock.
I once tried to convince a medium-sized employer, someone who got significant traffic, to support Opera. They looked up the numbers and had 7 visitors who'd used Opera in the preceding month. They just couldn't justify the expense for such an insignificant percentage of traffic. I think that's going to be your problem everywhere.
The only reason to support Opera is personal good feelings toward Opera. The userbase is insignificant, Opera doesn't further any given political goal as they aren't open-source and they are several more-popular open-source browsers in the market that are tested against. So what's the point of supporting Opera other than just liking Opera and wanting it to be usable with your site? Not that there's anything wrong with that, but rarely is it a cost-efficient procedure.
As mentioned in the other comment, there's no reason to not support Opera. They've spent a significant amount of effort over the past few years to get the browser up to snuff and in most cases will work out of the box if you let it. The problem is that many developers simply exclude it, rather than seeing if it will work.
It's frustrating since I just recently switched to Opera and personally find that it performs great, it feels better to me than Chrome, and overall I really like it. The biggest issue I've experienced and the biggest hurdle Opera has is the wholesale exclusion many sites partake in, usually via a if(opera){ //don't support}, rather than feature testing.
I agree it's not cool to block out browsers like that. Is that what Grooveshark is doing? I didn't test it in Opera.
But then again, maybe they _did_ test it in Opera and saw it didn't work, but couldn't justify fixing it from a cost perspective. So, would you rather have the thing just be all broken or have a sign saying "This is broken in your browser, sorry"?
There is a warning popup displayed telling you that Opera is not officially supported, listing the browsers that are. You can still use the site using Opera, it's just a fair warning saying that Grooveshark as a company doesn't make any guarantees it will work as expected.
You want developers to support Opera because you... like it? As another commenter already said, if opera doesn't even equate to a 1% of your users, you'd be a fool to spend money trying to support a browser most of your users don't even use.
That being said, Opera is a nice browser and has gotten better and better with time. I of course encourage projects that can and should to support opera, but there are plenty of reasons not to support it and in most of those cases they're right not to do so.
We will support Opera, we just didn't have time to test it in Opera before release and didn't want to claim it worked without that.
I've tried it in Opera, and it's perfectly usable apart from some weird scrolling issues where you can scroll the whole site off the page, and sometimes Opera doesn't seem to want to redraw some items in the songlists without scrolling a bit.
Just click the "Let's take a chance" button when the browser compatibility lightbox opens and the site will let you in.
Fair enough, but the phrasing suggests your browser isn't modern enough, rather than Grooveshark hasn't been tested to support it, which can be somewhat frustrating to a user of the browser, which may in fact be modern and up to date.
Our copy writers don't always get the why's exactly correct for this stuff, so I apologize for them for making it seem like Opera isn't modern. In reality, our current temporary lack of support for Opera is entirely Internet Explorer's fault. It took all our available resources to get the site working reliably in IE there was none left for Opera. Which sucks because Opera is /fast/ and standards compliant...but it has very few users.
You can't blame projects for not immediately supporting your specific browser. Most teams develop for the standards. If your browser doesn't conform to the standards that work for major browsers, then it's just harder on the developers.
Opera does conform to standards, it has for some time, sometimes better than the other browsers. For example, there's no need to prefix CSS3 attributes with -moz.
What is unfortunately happening is rather than testing to see if the site will work in Opera, developers just exclude it. They've made lots of progress over the past few years to get their browser up to snuff. I just recently switched to Opera after Chrome started lagging during the 1.6 update.
Chrome constantly runs tests against thousands of the most popular sites to make sure they render right.
It's not the developers' jobs to make their sites work with Opera (especially when it works in IE, Chrome, Firefox, and Safari). It is Opera's job to make sure they render sites comparably to other leading browsers.
If that means they rip out their rendering engine and replace it with Webkit, so be it.
You obviously have no idea about the lengths to which Opera goes to get sites working.
Some quick references
i) They actually fix bugs on popular websites on behalf of the developers: http://www.opera.com/docs/browserjs/
ii) They actually have a position called "Web Openers", whose sole objective is to reach out to web developers.
iii) An idea about the kind of compatibility issues and bugs Opera has to deal with : http://my.opera.com/hallvors/blog
iv) An anecdote demonstrating the lengths to which Opera goes to fix broken websites: http://my.opera.com/ODIN/blog/2009/11/05/the-lengths-to-go-t...
Go through them and let me know if you still believe that Opera doesn't try hard enough. The problem is that being standards complaint is harder than it soudns. A lot of the nitty gritties aren't explained in standards and diff browsers implement them in diff ways. While developers explicitely implement patches for Fx and IE, they generally ignore Opera. And that's why so many websites don't work in Opera.
Sorry but its the developers job to code correctly, so that the site will work properly in the standards compliant browsers (Chrome, Safari, FF and Opera).
Coding wrong and passing the problem to the browser is just mean
BTW, different rendering engines, assure no monopoly, innovation and competence, which is always good.
Okay well I didn't mean to insinuate that they don't conform to standards in general. But you can see that if the developers prioritize their time based on browser usage, Opera might be brushed aside at first.
Idealy, developers could target one set of standards and their product would be functional across all browsers that implement them. In general, the bigger browsers all act relatively the same (not IE) when standards-compliant code is used, so if what works for them doesn't in Opera, then that's a problem.
Prefixing attributes is the preferred W3C way to implement nonstandard attributes, which in my opinion is probably the right way to go, because it means there won't ever be a case where two attributes named the same mean totally different things, there will only be differences in implementation for a spec attribute.
There's more to support than standards. Curretly and in the past Opera has given more grief from the users' POV because of it's iffy rendering. Right now I push a few thousand elements into the page at runtime, this works perfectly fine everywhere else including IE6 yet Opera decides that it needs not redraw the whole page(or something) and when I scroll it causes ink smudges(?) it's rather entertaining to look at because it's as-if Opera thinks it's some kind of photo editor. Keeping the parent div hidden and then showing it after I've done pushing the elemements seems to work around that bug but I now have a visible lag everywhere. What do I do?
How come the RIAA is okay with Grooveshark streaming any music at any time? Pandora has many more restrictions in their free version to qualify for "internet radio" licensing rates.
I'm pretty sure there's a legal loophole occurring here. All of the music on Grooveshark.com is uploaded by the users and Grooveshark is not responsible for the content. If the song is copyright it's user who broke the law, not Grooveshark. It's a similar concept to copyright videos on Youtube.
You're talking about DMCA safe harbor provisions, which would only apply if Grooveshark promptly took down content when requested by copyright owners. Further, Grooveshark isn't even claiming the service is for "user generated music". (YouTube is different on both those points.)
Glad to see that I'm not the only one. I was very confused, I was in a weird mood and was looking for both Pink Floyd and Smashing Pumpkins, but couldn't find either of them. Now I know...
I can't imagine that this will hold up, in the long run. Torrent sites get taken down without even hosting actual content, the way that Grooveshark does. So wouldn't it simply be a matter of time before they either cut some sort of deal with the RIAA, or get shutdown completely?
It worked for YouTube, it its heyday it was all illegal content. They've already got a deal with EMI and prolly Universal soon (they're suing Grooveshark,but that's the same way they got the EMI liscense) Also they supposedly put a chunk of cash in an escrow account for when the labels come knocking.
We tested pretty extensively in Firefox, but there's always things that can go wrong. Also if you think you have any info that will help us fix it, hit up the Contact Us link at the bottom of http://help.grooveshark.com/
Well, if I run FF from a different account it seems OK, so my guess is that the scripting is not playing well with Greasemonkey or Firebug or some other add-on.
So, on the one had, the trouble is at my end, but on the other hand most sites have no trouble with my add-on arrangements, so there's something that's at least a little sensitive in the GS scripting.
Follow up: Disabled add-ons to see if one was causing trouble, and it's Flashblock 1.5.13. Usually it shows a placeholder you can click to allow the Flash object to run, but it doesn't seem to show for me.
This an awesome step for Grooveshark. Now let the greasemonkey or chrome extension customization scripts begin. Would love to see, what users come up with. I already coded new ad remover for my self. Couple ideas I have are as follows,
1. Last.fm scrobbler
2. Lyrics plugin (same as winamp has)
3. put 'now playing' list at the right sidebar
3. make 'now playing' list thinner.
etc.
I am a big big fan of grooveshark. I work in a user interface team for a large blue chip company. The amount of work, time, dedication, motivation that goes into developing an intuitive user interface is huge. This guys just make it look as if it was a breeze.... If you could do a blog post as you have done on the architecture part, it will be great :).
Source? (EDIT: Nevermind, I see the GS devs on here mentioning it)
As a project lead at my last job I championed jmvc for a new project. We had mostly good results but there was always a couple developers who were against it (and who IMO worked to undermine it).
We were building a very ajax-heavy UI for an Ad network. Think.. Adwords UI meets MailChimp UI.
In our case, my biggest worry was how easy it is to write spaghetti JS. A classic example is a page with several JS includes and they all are binding to the same event (or to different events on the same element). You're in one file working and you have funny results and you only then discover the event handlers in the other file and then you have to refactor the whole mess. We actually had that a lot in a previous project.
Also, 2 things jmvc did that excited me:
1. Easier JS unit tests.
2. Fixtures! You can build and test the JS without relying on the server to send you the json you need.
Fantastic -- I'm a Grooveshark VIP member and have been since shortly after launch. I still think it was one of the best investments I've made in the past couple years -- it's completely changed how I listen to music (especially with the mobile versions).
I wish you guys the best of luck and thank you sincerely for continuing to innovate.
One thing I noticed is now the ad blocker (on Chrome) catches the ads and doesn't show them. Since I don't have a VIP account with them and the ads aren't as intrusive as Pandora/Last.fm services, I decided to whitelist listen.grooveshark.com to show ads.
It works beautifully though, Flash on Linux was such a pain.
As far as I can tell, it's written with PHP serverside, Javascript (jQuery JMVC) and HTML/CSS. The actual music player is a hidden flash widget, but the song selection, playback, and entire interface is in HTML/CSS not Adobe flash as previously. (And the adobe flash version had horrible performance on linux).
Hi, I'm one of the developers. You are correct. We have a PHP backend, actually the same one that we were using with the flash frontend, and are using jQuery with JMVC, and slickgrid for the huge lists of things. The invisible flash widget provides both music playback and serves as a proxy for getting around some of javascript's crossdomain restrictions (like the fact that you can't make https ajax requests on a page served on http) and talking to third-party services like facebook and last.fm which have perfectly nice crossdomain.xml files.
Feel free to ask me any questions, though I don't know details on a lot of the deep workings of the backend - I'm an Actionscript/Javascript dev.
Oh and thank you so much for not submitting this as 'Grooveshark switches to HTML5'!! Because it's not. We're not doing anything you couldn't do years ago, except maybe that JS performance wouldn't have been fast enough for such a heavy app.
No Problem.
I think seen the widget before on make your own player page (which I've used because the old flash frontend was so very unstable on linux).
And - the switches to HTML5 part - I would only post that if you somehow worked out how to use the html5 <audio> tag, but that has many drawbacks.
Thanks so much for the work on the frontend - It's one of the few online music streaming services now that is decently fast and doesn't eat resources on linux.
It's not the exact same widget, but it does use the same classes. All our flash playback, in the old flash app, the new invisible player, the even tinier invisible player on the widgets.grooveshark.com page, and the actual widgets on said page are compiled with the same core playback classes.
Great job. Having done something similar for a prototype (using JS to control Flash players), I must say that it takes a great deal of work to get it all nicely. I'm assuming that you're using ExternalInterface to communicate with the player?
Also, is there any reason why you guys didn't replace the Flash with HTML 5's <audio> tag for browsers that can support it? Security issues maybe?
I've been writing Grooveshark's players since the beginning, so I'd pretty much consider myself at an expert at getting flash to communicate with other moving pieces by this point.
We've gone through some pretty crazy revisions, including one (ancient) version, back when the actual playback was performed by a locally installed client application written in java, yet the actual playback controls were located on the website in a small flash widget. That involved the use of the script-tag hack (I think nowadays most people call that JSONP) in javascript to confirm that the local client was running, ExternalInterface to tell flash that it was safe to attempt to load the crossdomain.xml file from the local client (it would quite stubbornly refuse to try again after a failure), and then an XMLSocket connection between the local client and the flash widget on the page in order to pass back and forth user commands and the current playback state.
It actually worked surprisingly well, but I'm really glad we've since moved to centralized server streaming. The current version is just as you said, an invisible flash widget that syncs to the javascript on the page via ExternalInterface.
How do I keep it from timing me out and stopping playback after a few minutes? With the fully flash version, it only did that if I went truly idle - with this version, if I leave it running in another tab while I work I periodically have to tab over and click the "I'm still here!" button.
As a fellow ActionScript developer, I congratulate you and the rest of grooveshark frontend team on doing a brilliant job with the flash UI. I always point people to Grooveshark, for an example flash based UI (and also remind myself, its not that the tool that matters, its the craftsman.)
I had actually just assumed this was all HTML (and thus HTML5) because of the previous html.grooveshark.com subdomain. Doh! Great job and thank you for the great work!
Perhaps eventually. It's something we've looked into, but we have some content security concerns. Obviously it's not impossible to rip our content with flash streaming, but it is more difficult than something that can be written with an <audio> tag.
Someone could easily steal my car's stereo even if I lock the doors, by using a slim jim/lockpick (downloader tool) or smashing my window (rip audio straight from the sound card). There's no way to 100% stop determined people from stealing my stereo, just like there's no 100% way to stop determined people from ripping our content. But that doesn't mean I leave my car unlocked.
Also right now we use the flash piece as a proxy for making service calls that would be otherwise significantly more difficult/impossible through javascript's crossdomain restrictions.
Could you at least make the flash object visible somewhere so that we could un-Flashblock it? (Anyway we can always whitelist in each computer we use it, but it would be nice)
This is one of the major limitations of the HTML5 + Javascript stack, and one that will have to be solved before we see even more widespread use on services like Hulu or Netflix.
It might not say it is encrypted, but I doubt the publishers/who ever they have deals with to stay legal would allow them to transfer copyrighted materials in the clear.
I visited Grooveshark just yesterday, and I just thought it was a flash rewrite. I did like the theme a lot, but the only sad part was my playlist was gone >:( (didn't have an account, it was just saved as cookie or whatever)
Never used GrooveShark before but this is pretty cool. Wonder why they don't have playlist ratings though (as far as I can tell)? When I do a search for playlists I'd like to see what other people thought of them before I click through each one.
This is a totally opaque interface that hardly works at all as far as I can see. Completely uninformative, dumb, not functional in any real way. What is going on? Why do all these other think it is great? It is not.
I would be interested why this is what did it for you? I work at Rdio, which is a competitor that has been HTML/JS/CSS with a flash player since the beginning. What about this makes you like Grooveshark more?
I actually have an Rdio account, because I have a curious bias towards web sites with sexier names/subconsciously believe I am judged by the names of web sites I use. When I joined I had the impression that Rdio would only let me listen to unlimited songs if I paid you money. Now I see that's not the case, so I'll give your service a go.
First thing I don't like is that you don't give me a big search bar. I'm not paying you money. I don't want to log in. I even resent Grooveshark's making me log in to share songs, that's how lazy I am. (I do have a Grooveshark account, which I rarely use.) So the fact that your front page looks more like a product than like an easy service, that scares me away.
I think the two most common-looking site designs are: search bars and product pages. Product pages are universally ugly and I run away from them actively. Search bars I will type in something and see if the engine meets my whims. So Grooveshark's front page sells more.
Rdio fails the Cardiacs test: http://www.rdio.com/#/search/cardiacs/ returns nothing, whereas Grooveshark gives me almost their full catalogue. Cardiacs is my general test of band obscurity: If you have them you're bound to have most of what I want, and if you don't then I trust you less. (You both fail my Victoria Pipe Police Band test, which is pretty sad, because I request my fervent demand for pipe music be sated. >:( )
When I go to a band's page, I get something that looks like informational bullshit. Which is nice — I use Last.fm for my band-related nonsense — but when I want a music player I want small entries that show me as much music as possible. If I search a band I want three albums on my screen simultaneously. Grooveshark gives me a LOT of music, and fast.
But here's the clincher:
When I go to play music, you ask me to sign in or register. BAM! I'm looking for a new site. I don't like giving out my email address. I don't like picking new secure passwords. I will only do it if I think you're worth the effort.
Right now I use three sites to listen to music. I use Grooveshark, or I use Bandcamp, or I use TheSixtyOne. Occasionally I use Pandora but that's WAY rare. Grooveshark's for general music hunting; Bandcamp is for searching for and buying music, and listening to musicians I know use it (like Sufjan Stevens); TheSixtyOne is when I want to explore random music. Each one is designed specifically to mimic my usage pattern. They look the way I want them to look.
Rdio looks like a college design project. (I'm not saying it looks bad. I go to a design college.) While it's pretty, it's not very functional — you have a lot of design choices that go against the way I'm trying to use the site. Kind of like when search engines make gangly content-crammed designs that stop me from actually finding what I'm searching for. I'm going to stick to the stripped-down tool that does what I want when I want it.
If you want to compete with Grooveshark, go slimmer, more efficient, and sexier. Make it easier for me to find the music I want than Grooveshark, easier to share, easier to — anything. If you don't, I have no reason to even contemplate switching. The good news is that I'm not loyal to Grooveshark beyond my affection for its design; because I don't have an account or use more features, I'm not entrenched. If you do something convincing I'd consider moving over.
Feel free to discuss this more with me, either here or in email. I love discussing design philosophy.
I've spent a couple of minutes searching for 'My Music' and 'Favorites' lists. Just click on your username and they are in menu bar left to the search field. Beside that, great interface and fast loading.
Is there any way to make a grooveshark desktop version that uses this same html5 interface? I love how the next/prev buttons on my mac work with that interface (using gs desktop helper)
It is a streaming only website. We do have links out to Amazon mp3 and iTunes...if you right-click a song in the player, there should be a 'buy song' option, or if you are viewing a list of songs, there is a dropdown arrow on each row for options - 'buy song' is listed there as well.
I switched back to http://retro.grooveshark.com It's more refined, runs fine on Windows, and it has more features. The Javascript version is too chunky for my taste. I can't see the song titles, overlays don't work, I'm not getting tips, etc.
Whatever you think of the user interface, please don't use Grooveshark. Their business model is either illegal or immoral. You will get mail from copyright owners telling you cease and desist from accounts that you've closed in the past - Grooveshark will claim that you're sharing the music, and you have legal responsibility, not them. Mails to close accounts go unanswered.
Can you elaborate on that? You make some very inflammatory statements, and you neither cite a source or properly describe your experience. A brief overview of the citations on the Wikipedia page show that they have dealt with legal problems directly and made arrangements with a lot of the concerned parties. As a long time user, what you say flies in the face of everything I've heard and experienced, so can you back up any of your statements?
You are entitled to your opinion, but if you use Youtube you have no place to talk (and Google seems to think Youtube is pretty legit). It's the same business model, just a different market.
While I don't think YouTube was nearly as explicit about it before Google owned it, it does at least now tell you on the upload page not to upload anything to which you don't own the copyright. In a quick glance at Grooveshark the only place I saw any mention of this issue was buried deep in their TOS.
They in essence encourage you to upload copyrighted works so you can access your music anywhere, and from a first glance at the interface it's not even excessively clear that you're sharing your music with others by uploading (as opposed to it being a private library).
This of course is all further complicated by the fact that they apparently have licenses with some labels, and not others. I would presumably be able to legally upload some music, but not all (I guess YouTube actually has the same issue there).
Add to this the fact that the RIAA has shown it doesn't mind suing end users at all, and I wouldn't upload anything to Grooveshark. Incidentally I also wouldn't upload anything copyrighted to YouTube.
I think that there is a Copyright Troll, and we should ignore them. They're getting upset because they don't like that we can hear the music first before we buy it.
