Drag and Drop Using Om

Sometime in 2015 I started playing the Asian board game Go and when I was recently working on a ClojureScript project that involved drag and drop, I thought a virtual Go board, called a goban, would be a good showcase for drag and drop using Om, a ClojureScript interface to Facebook’s React.

Note: I’m using the HTML Drag and Drop API which isn’t supported by mobile browsers. To make this work on touch devices, you’d have to use a library or implement touchstart, touchmove, touchend, etc. yourself.

There’s also no game logic and you can’t add or remove stones. All you get is a simple tech demo with ten stones to move around.

The board consists of 49 droppable cells arranged in a 7×7 grid. The stones are just draggable images, placed randomly on the goban.

If you’re interested in the details, go check out the project on GitHub. I kept the implementation simple so it should be straightforward to understand, assuming you are somewhat familiar with Om and ClojureScript.


Previous: The ClojureScript REPL