

Use HTML5 & jQuery to create a digital boombox. (webkit only–FF soon) - cgcardona
https://audiofile.cc/boombox

======
nixarn
Geez. What's up with the "write 20 lines of trivial javascript, put it on
github, put more effort into making a webpage than the actual code, post it on
HN".

~~~
weixiyen
I don't mind that it's trivial if it saves me from doing some tedious stuff,
but after reading the code it's unusable the way it's written right now.

Some of the things that need to change are:

1) DOM selectors must be defined by user, not the plugin itself.

2) Needs to actually work on more than just Webkit based browsers.

3) Don't use $(document).ready() in the plugin, find another way or design the
API differently.

~~~
robert-boehnke
Can you elaborate why $(document).ready() should not be used?

~~~
weixiyen
It's a matter of best practices.

In particular how it's done in this code, where it's outside the definition of
the plugin and binding events.

Plugins should be built in a way where it is explicitly invoked by the
programmers using them, and the 'proper' way is to invoke them from within a
$(document).ready() function that is specified by the user in the order that
the user wants.

Lets pretend, for example, that this plugin is invoked from within another
$(document).ready(), in which case the document.ready call from within the
plugin is completely redundant and useless.

~~~
cgcardona
Your points are all valid and I'll consider each one in refactoring the code.
Thanks!

------
wccrawford
Can I suggest that the IDs be something a bit less generic if you're going to
hardcode them? People might already have 'next' and 'prev' as IDs for other
things. (Not that they'd be in the right, either.)

~~~
cgcardona
Totally valid. I'll change that and push it on the next nightly. Thanks!

------
ebishop
How is this superior to jplayer (<http://www.jplayer.org/>) ? Jplayer is
implemented in HTML5, but has a fall-back flash implementation for backwards
compatibility, and like this is open-source (GPL/MIT).

~~~
cgcardona
I wasn't aware of this project. Thanks for bringing it to my attention.

Boombox.js has more features in the works. Please check back later for
updates. Thanks!

------
brokentone
This is a good start, but it needs some significant additional features. If
it's gonna work in jQuery, it needs more control, specifically JS control. It
would be nice to do anything I can do from the buttons from JS, and possibly
more. Also playlist support would be nice.

I'll give you a scenario, if I have this autoplaying on a website, and I have
an embeded Vimeo video, I'm gonna want to automatically stop the music when a
user starts playing the video.

~~~
cgcardona
Great ideas. Thanks!

------
k4rizma
Nice and lightweight. I'll give it a try on my site when I find the extra time
;)

~~~
cgcardona
Let me know what you think.

------
jasonkostempski
Only 2 things missing, Turbo Bass button and a "This is not a toy" warning
label.

------
cambriar
I think it's awesome, thanks! I found it really easy to incorporate.

~~~
cgcardona
Thanks!

------
recoiledsnake
>Get a modern browser

>First things first—make sure you’re running a modern browser. My favorite is
Chrome but Safari will also do. This app currently only supports webkit. More
browsers coming soon.

What is Opera or IE9 then? Chopped liver? Am I the only one hating this new
version of "Best viewed with IE5" and browser specific tag soup whose behavior
changes even with the versions of the specified browsers?

~~~
patrickaljord
IE9 is not a modern browser <http://news.ycombinator.com/item?id=2326048>

~~~
cgcardona
I haven't done research into which (if any) html5 audio formats that IE9
supports. I fully plan to add feature detection to serve the correct audio
format to the correct browser—IE9 included.

~~~
cgcardona
Tonight I added support for .ogg in opera.

[https://github.com/cgcardona/boombox.js/commit/931b069c7b253...](https://github.com/cgcardona/boombox.js/commit/931b069c7b2532c39a903f9ce3e7d726670c5fea)

Firefox is working on my local machine so it should be supported in production
by tomorrow.

I need to research more about IE9's HTML5 audio support but it shouldn't be
difficult to add support for it also.

