Draggable Elements

This was an experiment from about a year ago using Metro UI CSS and jQuery. I remember this was a b*tch to write; there were so many things to take into account. I started with a test page where you could drag an element (a name) between two areas of the page. I finished up with the second test that converted the appearance of the element to a colored box with a small image of the person (that's the black area) as well as a checkbox.

Unfortunately the project that I was doing the test pages for got temporarily shelved. Part of me still feels that I did all that research and proof-of-concept design for nothing; a bigger part feels proud I got the whole thing wired up and running perfectly. So, here's the sample code - unlike the previous one this doesn't need Visual Studio; just run it on your browser, really.