

Scalable CSS-based Playing Cards - donpark
http://donpark.github.com/scalable-css-playing-cards/

======
theonlyroot
Great Work. I love these posts on HN where people show case what they hacked
on during the weekend. These are the real "builders" or creators out there.
And about the negative guys, believe me they have probably never created
anything in their life, so don't bother!

------
singular
Screw these negative guys, this is amazing. Great work! :-)

------
rooster8
Thank you for the great work. I've been thinking about doing a simple web-
based card game for my friends and me, and not having a good way to show cards
in the browser has been my biggest impediment!

------
ben174
How can I use this CardView class? The demo seems to be using the DeckView,
but what if I just want to deal five specific cards?

------
hayksaakian
I get weird clipping on the right fourth of the various card symbols. Chrome
18 on nexus 7.

~~~
donpark
Issue already filed: [https://github.com/donpark/scalable-css-playing-
cards/issues...](https://github.com/donpark/scalable-css-playing-
cards/issues/1)

------
dyscrete
This is what HN is becoming, CSS playing cards on the front page. (sigh)

~~~
donpark
OP and author here. I'm a long time HN reader but this is only my second
submission. I know my weekend hack is no where near amazing but I think it's
useful which is why I intentionally spent extra time making it easy to reuse.

Could you explain what kind of posts you want on HN front page and why my
submission is unfit to be on it so I can avoid making the same mistake?

~~~
duopixel
The face cards appear to be rendering as PNG instead of SVG. Additionally, it
would be cool to render the flip as a CSS 3d transform transition and fall
back to jQuery flippy where not supported.

Also, I'm not sure about the mustache.js + hogan.js + jquery + backbone combo.
That's a whole lotta libraries for something that would take around 20 lines
in d3.js.

I don't mean this to put you down, but there are different ways of thinking of
problems and you are approaching an interface/visualization problem from a
templating background (which is possible, but not ideal).

~~~
donpark
I went with PNG over SVG because I wanted to keep things unfancy until later
given that SVG versions are much bigger than PNG versions and I've heard
rumors of SVG issues on Mobile Safari. Optional SVG support will likely be
added later.

Re unnecessary rigging (hogan.js, jquery, backbone), they're there because
this hack was original built as part of a larger project. I'll be tearing them
out as time allows because they're definitely not needed.

Re d3 and approaching problem differently, I wholeheartedly agree. I'll be
happy to use a 20 line d3.js version if someone comes up with one. :-)

