I can't find a usable drag-and-drop JavaScript library, so, as usual, I am forced to write one. I need something that works on mobile, supports both drag and dropzones, and is simple to use. And it shouldn't require an abomination like npm to get the files, one should just be able to download the needed files directly.
I will start by reviewing some of the existing depraved alternatives:
So I wrote my own library in just these two file: dad.js and dad.css. Here are some examples using this library:
When dragging starts, this happens:
original = dad.whatToDrag(draggable);
dragging = original.cloneNode(true);
original.parentNode.appendChild(dragging);
Most drag-and-drop tools drag the original by setting position to relative and moving it by setting left and top. But this breaks if the DOM is changed. So instead I clone the original and set position of the clone to fixed. This way, changing the DOM doesn't affect the location of what is being dragged.
This library is fairly trivial which makes it a good example of reactionary software. And it is purely JavaScript which everyone knows. Just compare the depraved alternatives listed to my code. My code is much simpler and is fully functional and robust. All of the modern alternatives are overcomplicated and fragile garbage. All modern code is like this, all just horrible garbage.
Here is the source of this website. And here is a discussion thread if you want to comment.