drag me anywhere

Detailed Instructions

This page is the foundation to creating some apps that I want to use. It's really to test that I can put elements on a page and have them drag and drop into other places. The page width and height are fixed. They are designed to work on a 3000x2000 display. If your resolution is smaller than this, you will likely not be able to see all the elements as the scrollbars are hidden (on purpose).

Another note - this page will only work on a desktop machine. It is not designed to work on a mobile device as it uses a lot of functions that fire with mouse actions - e.g. onmouseover or ondragstart etc.

Anyway, feel free to fiddle around with the page. Its pretty cool what it does, but probably not the most exiting thing to see. There's a little bit of validation built in, so it should stop you if you're doing something that doesn't make sense, e.g. trying to designate “onion” as a color. So, what should it do? Well, the top bar should update to tell you what's going on, what you've done and if it's trapped an error. The black box can be dragged anywhere on the screen - pretty self explanatory. There are colors that can be dragged into the color pallette to change its color. There's an item list as well. Items and colors can be dragged and dropped into the temp and perm lists. The temp list is destroyed when you leave the page. The perm list is written to a database, so it will be there when the screen refreshes. (Note that in the unlikely event that someone else plays with the page, you will get their last saved items in the perm list. There's no fancy deliniation of who's updated what - it's simply to test that I can drag and drop an item into a database and call it back).

The trash can should speak for itself. If you drag anything from the temp or perm lists into the trash it will be removed from the list.

Last note - you can drag and drop items from any list into anything so, you can pull a color from the perm list and drop it into the color pallette if you want.
Close