Magnetic Poetry

Source Text for Tiles





Result

Instructions

It's pretty simple, really; just drag the tiles around. Clicking the "Spellout" button will try to make sense of your new arrangement. To remove a tile, simply drag it off the edge of the board, and let go when it turns grey.

Description

This was something I thought of a couple of years ago, and tried to implement. That first time around, it was a miserable failure. However, come 2005, I found a reference to the DOM-Drag JavaScript library, that allows you to turn any object on a web page into a draggable object. With this library handling half of the hard stuff, I was finally able to implement magentic poetry for the web. Enjoy!

TODO

  • Differential spacing (both horizontally and vetically) in the result text
  • Make hitting [Enter] in the "Add a tile" field add a tile, not submit the form

History

18 April 2005
Not an update to the code (yet), but I found out today that this little experiment seems to be totally broken under Internet Explorer (IE6 over Win XP SP2). Not sure whether it's the CSS, the JavaScript, the heavy reliance on DOM scripting, or what, but it just doesn't work. It doesn't even look right. Oh, well. I might fix this, if it looks like there is a halfway decent way to do it. Or, better yet, get Firefox instead.
16 April 2005
First release

Using the DOM-Drag DHTML library by Aaron Boodman.

Comments and suggestions are welcome.


©2005 by Peter Eichman. All rights reserved.