Show HN: Tetris Implemented in ClojureScript

Show HN: Tetris Implemented in ClojureScript(djblue.github.io)

135 points by djblue 7 years ago | 25 comments

beders 7 years ago |

This is super condensed but still very readable if you know Reagent and Hiccup.

It's interesting to compare this to a lot of tetris clones written in TypeScript. There are a few that take enormous pleasure in defining a type hierarchy and what not.

Contrasting that to the very compact representation of tetrominos

    {:I {:color "#1197dd"
       :dim [4 1]
       :zero [1 0]
       0 [[-1 +0] [+0 +0] [+1 +0] [+2 +0]]
       1 [[+1 -1] [+1 +0] [+1 +1] [+1 +2]]
       2 [[-1 +1] [+0 +1] [+1 +1] [+2 +1]]
       3 [[+0 +1] [+0 +0] [+0 -1] [+0 +2]]}

and the very cute rotate function:

   (defn rotate [r] (-> r inc (mod 4)))

gives you a good idea what a Lisp is about.

djblue 7 years ago | |

Thanks! I really enjoyed the data modeling aspect of this project. I also ended up modeling the board as a mapping of [row, column] -> color which might be different from the traditional 2D array representation.

Scarbutt 7 years ago | |

Why pick Typescript instead of Javascript as a comparison? there's really not that much difference in your example if plain javascript objects/arrays/functions was used.

Clojure has better and more map handling functions in the std lib for sure, but I find that with the help of some libs you can write lots of Javascript in a Clojury way without too much hassle.

beders 7 years ago | | |

Typescript is becoming a popular alternative to JS and is often being chosen to correct the perceived shortcomings of JS. Just like ClojureScript, which is often chosen to correct the perceived shortcomings of JS ;)

ilikehurdles 7 years ago | | |

Its statically typed, object oriented style is a good contrast to cljs.

lispm 7 years ago | |

to create obfuscated and undocumented code? That's known already.

The goal actually is this: being able to write descriptive and understandable code for others and oneself.

Come back to the code a year later and is it still understandable? Lot's of cute character-level operators and fancy control flow is maybe not the way to go.

hota_mazi 7 years ago | |

I don't really see it. A similar approach in any imperative or functional language would read pretty much exactly the same.

Except that with static types, you'd gain a lot of clarity, efficiency, and future maintenance, one of the downfalls of Lisp.

chrisoakman 7 years ago |

Nice work! :)

A few years ago some friends and I wrote a tetris clone to celebrate the 30th anniversary of tetris and learn ClojureScript in the process. Really fun group project.

Playable here: http://t3tr0s.com/

Repo: https://github.com/imalooney/t3tr0s

djblue 7 years ago | |

Your project is substantially superior to mine. It looks so goooooood!

gunn 7 years ago |

Here's my tetris copy: http://wolandbros.com/tetris/

Both the game and the source are much more minimal, it's very easy to customise the rules. You can see the source here: https://github.com/gunn/tetris/blob/master/src/store.js

djblue 7 years ago | |

Sweet! Thanks for sharing. I see you're using pure-store to manage your game state. My implementation also uses a redux pattern for state management :)

gunn 7 years ago | | |

Thank you too! It's fun seeing the different ways we implemented the same things, even pieces and rotation.

pure-store is a library I made for very simple but efficient state management. The entire source is this file: https://github.com/gunn/pure-store/blob/master/src/index.ts

yogthos 7 years ago | |

Here's a shorter cljs version [1], as a bonus it cross-compiles to the JVM and Js reusing the core logic.

[1] https://github.com/yogthos/clj-tetris/blob/master/src/tetris...

rschachte 7 years ago |

This is sick! Link to source: https://github.com/djblue/tetris

djblue 7 years ago | |

Thanks!

city41 7 years ago |

If interested in more ClojureScript games, I made Breakout: http://city41.github.io/reagent-breakout/

soup10 7 years ago |

https://jstris.jezevec10.com/

brabel 7 years ago |

The HTML page, which includes the JS scripts embedded, is only 75KB... not bad for a language so different from JS.

a_t48 7 years ago |

Up being rotate rather than hard drop is tripping me up. I guess I could fork it, though. :)

djblue 7 years ago | |

https://github.com/djblue/tetris/blob/master/src/tetris/core... to update the mapping :)

djblue 7 years ago | |

I was following https://tetris.com/play-tetris, but I would be down to change it. It messes me up when I use the HJKL mapping.

droidist2 7 years ago | | |

I really appreciated that it followed that convention because I was used to it. Also remembering 2 buttons (rotate and hold) makes it harder IMO. Being able to use up for rotate means I can just keep my finger hovered over the hold button. Then again I'm not much of a keyboard gamer.

{:I {:color "#1197dd" :dim [4 1] :zero [1 0] 0 [[-1 +0] [+0 +0] [+1 +0] [+2 +0]] 1 [[+1 -1] [+1 +0] [+1 +1] [+1 +2]] 2 [[-1 +1] [+0 +1] [+1 +1] [+2 +1]] 3 [[+0 +1] [+0 +0] [+0 -1] [+0 +2]]}