JuicyDrop – Winamp Music Visualization with JavaScript and Canvas | Hacker News Reader

JuicyDrop – Winamp Music Visualization with JavaScript and Canvas

nihilogic.dk

66 pointsauchenberg44 comments

Actually, no. That's a winamp-like skin with some random audio player. I doubt that skin is in javascript and the player is generic something. Nothing like winamp at all. Audio visualizations in javascript would be a betetr title.

The title does state that it's Winamp music visualisation.

when the OP commented it was: "Winamp in JavaScript. Yes"

Can we just accept that javascript is as practically turing complete as any other language and move on with our lives? :P

Not before coding EVERYTHING in 30 lines of JS or less!

Someone needs to write a js interpreter in 30 lines of js and then maybe we can draw a line under all this.

>eval(x);

Did I win?

    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
      if (xhr.readyState == 4) {
        eval(xhr.responseText)
      }
    }
    xhr.open("GET", "http://mywebsite.com/everything_doer.js", true);
    xhr.send();

Surely you must know that the only acceptable equality checker in JS is "==="?

"==" is for wimps :-)

maybe he was being forward looking. version 2 needs some sort of bug fix and feature list.

Turing completeness has little to do with it. JS was always Turing complete, yet these little exercises were not possible 5 years ago.

Not desirable either. Not sure they are desirable now either.

ars gratia artis

These little exercises that "were not possible 5 years ago" were released... about 5 years ago.

I keep hoping...

UI appears but all boxes are dark on Chrome 31.0, OS X.

Edit: enabled Flash and it's playing. Looks like this is Flash/AS, not JS.

Not sure what you're talking about. This is plain Javascript.

I don't believe it is. I have click-to-play for plugins, which means that JS runs without issue, but I have to specifically allow any plugins, e.g. Flash.

I get the same thing as parent when I visit -- black boxes -- along with an indication in my address bar that plugins have been blocked.

Looking further at the source on index.html, I see this:

    soundManager.url = './'; // path to directory containing SoundManager2 .SWF file

So this is very obviously just a shell around a Flash file.

Same here. I have flash blocked and I cannot see anything.

In the code, I see this (currently blocked by flashblock) srcattribute="./soundmanager2_flash9.swf"

This looks like JavaScript controlling a Flash object, not just JavaScript.

It's not a valid javascript post if it doesn't say how many lines of code did you use.

Edit: grammar

Posted 4 years ago. https://news.ycombinator.com/item?id=532080

Ah yes, Atwood's Law (http://www.codinghorror.com/blog/2007/07/the-principle-of-le...) strikes again.

My first thought ^^

I know everybody is tired of these Javascript POC apps but I think it's a testament to the fact that it's so easy to implement webapps vs desktop stuff, and can perform functionally well.

If Google released a version of Chrome that could camouflage itself as a desktop app (browser-based UI over C++ functionality, but that browser appears as it's own app rather than another damn open tab) I think we would see a flourishing of better desktop apps rather than just everything-you-can-think-of-stuck-in-a-browser.

EDIT: Funny I got downvoted because the responses that follow are probably the greatest amount of insight/interest on the whole page. The rest of the comments are just whining about how this isn't a perfect Winamp emulation lol.

Have you seen the Chrome apps platform?

http://developer.chrome.com/apps/about_apps.html

It's pretty damned close to what you're asking for.

yeah this is close.... i just wish that it could be a layer on top of C++ or Java rather than js only. The point is that I want to make an app as powerful as a desktop app, just with this type of UI.

If you could run a c++/java app in the background and make RPCs to it from browser events, that would be closer...

How about node-webkit?

https://github.com/rogerwang/node-webkit

It's basically Chromium on top of nodejs. Then you can mix your C++ code with nodejs via addons.

http://nodejs.org/api/addons.html

Yeah this is the closest so far -- a fleshed out version of the RPC avenue.

Thanks so much for the responses, these are really great ideas.

I believe Chrome apps can use Native Client, if you want to message between a C/C++ module and your web application. And of course there are increasingly mature tools for compiling C++ to some subset of JavaScript. https://developers.google.com/native-client/

I don't know of a good framework to cache an app in localstorage so its available offline transparently. IE, you want it so once someone runs your "app" once, and adds it as an app (a .desktop file, whatever the equivalent in Windows is, etc) so that it only ever pulls the pages from the network when an update is found.

heh i don't want to build an APP!! that's kinda the point, lol.

i'm not an app developer. i make audio stuff with machine learning tools & I'm a web dev to pay the bills. But in this case all i really want is to build a desktop application (c++,java,whatever) and have a browser-based UI... but not have it appear as a browser tab.

What you just described is pretty much Silverlight. It can do out of browser stuff.

Eh I don't want to program Silverlight though....... I'd rather just use html/css/js for UI.

Likewise. I wasn't saying that :)

Audio visualisation/winamp-like/winamp/take your pick, it's still a cool experiment. I'm digging the music choice too.

Ahhh, the days of milkdrop...

Best viewed via a crap projector thrown onto a hippie's face.

Surely we can simulate that in js as well now?

Fuck, we can probably do it in css.

Speaking of Milkdrop, the sources of milkdrop 1 and 2 have been released [1]. A couple developers have taken the milkdrop 1 sources and built them into a cross platform visualization software called projectM [2]. Milkdrop forever!

[1] http://forums.winamp.com/showthread.php?t=214971 [2] http://projectm.sourceforge.net/

Forget the visualizer go to the article for the visualizer and enjoy pseudo-playing Mario Brother's in the Background!

Looks like it's a bit old if it's still using jQuery 1.2.6 from 2008.

Good eye, see drobati's comment -- it was evidently posted here 4 years ago.

Oh, I hoped that would recreate Winamp's AVC. Sigh ...

The mp3s that are commented out are the best ones.

cool tribute, but yeah... missing all the stuff that made winamp actually cool.

Reply on news.ycombinator.com