

This Developer Harlem Shakes Your Website - wynter
http://www.wamda.com/2013/03/jordanian-developer-harlem-shakes-your-website

======
DigitalSea
Wow. I am speechless. Such a simple, but highly amusing idea. This is going to
be huge, nicely done as well using CSS3 animations. So damn amusing! I tried
putting Hacker News through it and it's funny because it doesn't really work
that well: <http://www.harlemify.com/?url=news.ycombinator.com>

~~~
wynter
Haha - must admit I hadn't tried that. Still gets Hacker News to shake though!
I think it's really smart how Monir built on the Harlem Shake's virality, but
made it fun for everyone.

~~~
DigitalSea
Yes, definitely. I used it for a project presentation the other day and it was
a hit. I started it off with, "So here's what I've been building for the last
few months" and Harlemified the site, people were amused.

~~~
Monir
Thanks for sharing the link, I am glad that you both liked it! :D

as you might know, Technically it's really hard to determine the main logo
element in any web page, since HTML coding styles differ from site to another,
and there is no standard for such a case.

So to overcome this issue I made some assumptions on how can I find the logo
element ( the dance Starter element ).

I assumed logically that I should find the keyword "logo" in 3 possible
Locations on a visible HTML Element 1- in the "id" attribute. 2- in the
"class" attribute. 3- in the "src" attribute of an html <img /> tag.

if I found any, I will simply get the First element found.

But for some websites non of the assumptions will be correct, for this case, I
wrote a simple brute-force like solution to try to find an element that is
currently visible on the screen view area and has a size between ( 40x80 and
380x380 ), again I assumed the size range here since the logos are usually in
this range; based on a simple test that I made.

And I didn't include elements smaller than 40x80 because animating a small
element alone is not as cool as a larger one.

So apparently for Hacker News' website, all of my logo finding assumptions
failed... I fixed it by adding a code block that handles special cases based
on the domain name, and that's by specifying hard-coded jQuery Selectors :)

So it should work fine now, try it again here: <http://bit.ly/ZcxOIc>

------
jamessb
Previously on Hacker News, hsmaker:
<http://news.ycombinator.com/item?id=5235709>

~~~
Monir
I built <http://harlemify.com/> without knowing about this one... and I'm
happy for not knowing about it because seriously If I knew, I wouldn't build a
new website. :)

Anyway, I built it in 7 hours just for fun.

After testing the other site, I felt that I didn't waste my time building it
for nothing, because I believe that I handled much more cases in mine than the
other site :)

Such as: \- Ending the song and animation ( ending the show. ) \- Share
functionality at the end of the show. \- Passing the same user's browser
headers when crawling requested website. \- Handling most of the webpage
character encoding types (including Arabic). \- Handling gzip encoded websites
( for example, try mashable.com on both websites ). \- iOS Browser Support.

Enjoy! :)

