

Show HN: SoundCloud Wall - karangoeluw
http://karan.github.io/SoundWall/index.html

======
JoshTriplett
Interesting UI concept, and nice demo.

On Firefox (version 29 on Linux), the labels for the upper and lower sets of
players are both overlapping on the upper videos, and the lower videos have no
labels.

Also, I assume this is a SoundCloud limitation, but it's disappointing that
this seems to want Flash and does not support HTML5 audio.

Thanks for building this and showing it off!

~~~
karangoeluw
> On Firefox (version 29 on Linux), the labels for the upper and lower sets of
> players are both overlapping on the upper videos, and the lower videos have
> no labels.

Seems like an issue with jquery and certain platforms. I do not know how to
debug it, unfortunately.

> Thanks for building this and showing it off!

No problem. Just share with friends and family. :)

~~~
j-hernandez
Confirming UI behavior in FF 29 on Linux. No audio output in Chromium but both
use HTML5 Audio. Might take a crack at the UI bug later. Great demo and thanks
so much for sharing!

------
karangoeluw
Thought I'd share the source code:
[https://github.com/karan/SoundWall](https://github.com/karan/SoundWall)

------
beecr001
Awesome demo!

While playing around with this, I found an interesting (and perhaps
unintentional) use case.

By hovering over different songs at appropriate times, it mimics a hard cut
using a DJ mixer.

I'm not as technical as I'd like to be, but it seems like a neat bi-product of
very low latency using HTML5 with your simultaneous auto-play.

Might be an interesting opportunity for a new type of cloud DJ platform :)

~~~
karangoeluw
Funny. My friends recommended this exact use case for the app. What he said
was, make the artwork look like rotating vinyls and keep the functionality the
same except add cross-fader (which is extremely hard).

~~~
beecr001
Right on!

The cross-fader would be an interesting project though; using a slider to
adjust volume between sources...

~~~
karangoeluw
Will see if I can work on it.

------
k-mcgrady
Nice concept. I was surprised to see it using HTML5 audio which was nice. Do
you know how that affects the play count on SoundCloud? If you're using your
own player instead of an embed do the artists lose out on the play?

Feature request: It would be nice if I could log in with my SoundCloud account
and have the option to like tracks from your site.

~~~
karangoeluw
Yeah I had to roll out my own player for performance purposes. I have no idea,
but since this is stream I think it just counts as a play?

> Feature request: It would be nice if I could log in with my SoundCloud
> account and have the option to like tracks from your site.

Probably won't happen since that would need a backend, and I want this to be a
client side only app. FWIW I link to SC track so people can like, share,
download, buy the track.

~~~
feralmoan
user sessions would get picked up by if you just injected the oembed player
dom rather than hand-rolling it
([https://developers.soundcloud.com/docs/oembed](https://developers.soundcloud.com/docs/oembed))
- no authentication required.

~~~
karangoeluw
In the initial versions, I was using SC's own widget, but it was not
performant and looked nasty.

------
NathanKP
Very cool... One critique I have is that you should respect the aspect ratio
of the album cover art. At my typical browser dimensions the album art is very
screwed up:

[http://i.imgur.com/5yKPIjZ.jpg](http://i.imgur.com/5yKPIjZ.jpg)

~~~
karangoeluw
So it was between a full-screen view vs aspect ratio and due to the nature of
the app, I had to settle on former.

------
theCricketer
Spotify has a similar preview feature.

If you're logged in to the web player, you can use it by following this link:

[https://play.spotify.com/discover](https://play.spotify.com/discover)

------
pfalke
Great tool, fun for music discovery.

A graph style approach for this is [https://soundcloud-
explore.appspot.com/](https://soundcloud-explore.appspot.com/)

------
Jonovono
Nice! Soundcloud is fun to make things with. The API is awesome. Used it with
a cool visual library to make this: [http://molli.es/](http://molli.es/)

~~~
karangoeluw
I love the SC API. Even though it's somewhat buggy, it just makes your life so
much easier. I can't seem to find a way to change the song in your visualizer.

~~~
Jonovono
The site is pretty buggy but you should be able to click the left arrow! I
made it just to put on the background or chromecast it to my tv when I am
programming!

~~~
Jonovono
ERR, right arrow :p

------
karangoeluw
If anyone's interested, leave your e-mail here [1] and stay tuned about my
projects.

[1] [http://eepurl.com/SRIPT](http://eepurl.com/SRIPT)

------
snake_plissken
Awesome work! It's very responsive.

On a side note, it's incredible how much Armin Van Buuren's style has changed
since the early/mid-2000s.

------
crisnoble
Super cool! I wish I could to go to the next six songs that match a given
query in case I want to explore beyond the first set of results.

~~~
karangoeluw
I did try doing that, but since it's 6 players, it's super hard to manage
events.

If anyone wants to add any features, I'm open to PRs:
[https://github.com/karan/SoundWall](https://github.com/karan/SoundWall)

------
dsschnau
This is sweet! I've been trying to learn how to use the SC wrapper and your
code is a wonderful example. Thanks!

------
mandeepj
Good job. I felt like i have a DJ's control box :-)

------
m00t
Nice UI. I love the concept too.

------
matiasb
Nice!

------
zameericle
fun!

