
Show HN: Beatbar - Media player that beats in the browser address bar - jaip
http://jaipandya.github.com/beatbar
======
nowarninglabel
If this doesn't work for anyone else, note that beatbar relies on soundcloud,
and thus flash. I had flash blocked so was getting a javacript error because
beatbar was undefined, enabled flash and it worked.

~~~
jaip
It uses soundManager for cross browser audio handling. It first tries with
flash and fallbacks to html5 if flash is not available. Firefox with flash
disabled wouldn't support mp3, and thus won't be able to play it. I am using
SoundCloud api only to fetch streams.

~~~
nowarninglabel
Hmm, that's odd, I'm using Chrome 19.01 and have no other plugins running
asides FlashBlock. Once I disabled flash block everything ran fine. Does this
version of Chrome not support the HTML5 fallback?

Here's the Js error:

Uncaught TypeError: Cannot call method 'init' of undefined /beatbar/:75
(anonymous function) /beatbar/:75 f.event.dispatch jquery.min.js:3
f.event.add.h.handle.i

~~~
jaip
I think soundManager requires some special handling for flashblock cases. I
didn't test with flashblock on. Thanks for reporting the issue.

~~~
pvidler
It doesn't seem to work in Safari with click2flash, either. Possibly because
click2flash doesn't actually disable flash, it just requires a click -- but
there's nothing to click on.

------
mmahemoff
This is using the Ajax-era hash hack to change URL, which is causing problems
with history and makes the reload button and favicon flash.

I'd suggest using HTML5 history, specifically replaceState(). It works on all
modern browsers. Works on IE10, but not IE9 and below. If you want to support
IE, you could fall back to the current location.replace().

~~~
jaip
I started with replaceState only, but later I realized there was no specific
gain that I was having (other than slightly good looking string without hash).
This method also suffers from reload and favicon flashes. If it reliably
doesn't log to history (unlike location.replace()), using it could be a good
idea. But that also comes with a tradeoff of older browser support issues,
which requires using external javascript APIs.

~~~
mmahemoff
I see. Surprised to learn there were still issues as replaceState() (as with
pushState) is purely a transformation in the URL path. There's no reload and
no update of the favicon link tag. Makes me wonder if that's a browser bug you
saw.

------
u4
every once in a while one bumps into something fairly useless(no disrespect)
but insanely creative wow-&-smile-inducing piece of code here on HN. thanks
for this. more power to you.

------
mansoor-s
Very cool indeed, but the title should be more like "Media player that spams
your browser's history DB"

~~~
darklajid
Since it took a minute to figure out how to clean that up, maybe this helps
other Firefox users:

For me (vertical tabs) at least it was impossible to select multiple entries
in the history (ctrl + h) with the mouse. The workaround to remove the entries
was to search for beatbar, tab into the list of entries, ctrl + a and right-
click -> delete.

History clean again.

~~~
RenierZA
I could get rid of it in Firefox by right-clicking one of the links and
selecting "Forget About This Site"

------
flexd
Cool idea! but not cool that it has completely filled my web browsing history,
thanks.

~~~
jaip
Is it? For changing the window location I am doing a location.replace which
doesn't log to the browser history. What browser are you on?

~~~
mahcuz
Filled mine, too. Firefox 11.

------
hsb
This is the biggest "wow" I've seen in a long time for something that was
otherwise completely useless. The ultimate definition of a hack. Absolutely
awesome.

------
julioc
You could use unicode for the controls. I modified the local code to use "‖"
(and, due to a bug I guess, the chrome address bar became monospaced). If you
need, check some reference on <http://copypastecharacter.com/all-characters>
and <http://graphemica.com/>

~~~
jaip
I settled with the standard character sets as I wasn't sure if the fancy
unicode character would be available cross platform or not. I'll look for this
possibility again. Thanks.

------
badboy
Awesome work. Just do me one favour: Add "return false" to the function bound
to "space", otherwise the page scrolls when I hit it to pause.

~~~
jaip
Thanks, fixed.

------
rhizome
The reload button flashes like crazy.

------
captn3m0
On a slightly different note, I liked the choice of font for the main text.
The font is Varela Round, from Google Webfonts.
(<http://www.google.com/webfonts/specimen/Varela+Round>)

------
gghootch
To my surprise, this worked perfectly on my iPhone...

------
prezjordan
Very cool! I think you're limited by the font - strangely enough. But this is
very nice. Creative.

------
jmonegro
I'd argue you could boil ruby down from 'puts "hello world"' to just "hello
world".

------
fldrog
Nice work:)

You could add the name of the artist/melody...

~~~
jaip
If there is a feature to be added, this is the one. On track. Thanks :)

------
ss_ninja
Great Job Jai!! Beatbar rocks!!

------
vishus
Awesome stuff Jai! Way to go!

------
mackyinc
Great Work! Thanks

------
kefs
thx for this. also, good use of comic sans.

------
sohn
Stupidity reachs new highs.

