Replace ``SortableJS``

[Mischback]

During implementation of #40, the actual drag'n'drop operation is handled with SortableJS. However, this adds around 40 - 50kB to the bundle size, which is kind of not acceptable.

After finishing the initial implementation of the contrast grid, which should also allow drag'n'drop operations, SortableJS should be replaced, because I feel like the app is using just a minimal subset of its functions.

v1 / the original implementation had its own drag'n'drop logic already implemented. Should be easily adaptable.

[Mischback]

v1 / the original implementation had its own drag'n'drop logic already implemented. Should be easily adaptable.

Nope

Problem A

Most existing Drag'n'Drop libraries are pure JS implementations, that do not use HTML5's native drag'n'drop API.

This means they are required to implement lots of stuff and add quite some size to a bundle.

Problem B

HTML5's native API requires the draggable elements to have an attribute draggable="true", which is basically fine. But as most of the elements that are meant to be draggable in Colorizer are dynamically created, this may cause some issues.

Possible solution: https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

[Mischback]

ToDo

• [x] prepareItems(itemList) => prepareItems()
  • after fixing an issue in containerMutationCallback(), prepareItems() is now only used with getItems() as input parameter, so the call to getItems() can be internalized (again)
• [x] get rid of createItem(item)
  • createItem() is called in exactly one place, during prepareItems()
  • no need to have a dedicated functions/method
• [x] documentation of type TDragToOrderDragResultCallback (part of the external interface)
• [x] documentation of DragToOrder class
  • [x] constructor parameters
  • [x] general class documentation
  • [x] at least the purpose of all methods
  • [x] keep track of the event.target in the event handler methods (is it the dragged element or the element under the cursor?!)
• [x] styleDropTargetHover is not applied to the correct element! It should always go to another item with draggable="true", these are assumed to be the drop targets. As of now, it might go to child elements of that item.