ExpatTech Techblog

In this post we will show an exmaple what happens, if we rethink the drag event. Basically we drag and drop objects to... do what? Usually we do this in the operating system to move files or folders, or to open files by simply dropping them on a program's stage.

But why on Earth would we drag and drop an object in the world of the web? The answer is still the same: you drag an image "down" from the browser to your favourite image editor or desktop to save it.

Further possibilities have to be worked out, what to use drag and drop for? We can simulate windows of course, for sparing space and put more content on a page (or keep it on a static dimension) then it would fit.

On the other hand, dragging can help you organize files, put them in piles, or drop them on some magic machines, where something happens to them.

But the event, how it occurs is still the same: you drag the icon or image of the file, and it follows your mouse. Great. But. In a way that no object would do. It doesn't follow the direction of the force, nothing, just stays unrotated and silent.

To simulate realistic drag and drop, imagine you are pulling something. It can be a paper on your desk, or a log on the ground - it ain't no matter.

But let's play a little game. Put a piece of paper on your desk (next to the screen). Put your finger on one of its corners and start pulling it slowly. What you see is the mystery of physics: your finger tries to pull it, but since it's not a zero-weight object, but basically a rigid body, it slowly starts to turn into the direction of the force. If it's a single paper, then most likely it will turn in a way, that your finger and the center of the page are on the line of the force (direction of the pulling).

Now, how do program this? That's the question, and that is the topic of another post.

But for the results see the link below:

Drag And Drop Differences