[feature] Dragged center triggers sort

[miro-ux]

The current default behavior is such that the cursor's center causes re-sort. Notice that the dragged has to cover the entire element before it's re-positioned.

cursor-sortable.mp4

What would be really cool is if the dragged's center can trigger it (shown as 🔴 in this case):

dragged-center-sortable_1.mp4

I think it's a lot more natural and responsive in terms of UX.

I have no idea how to do a proper pull request but this is the hack job that I did for this demo:

    _emulateDragOver: function _emulateDragOver() {
      if (touchEvt) {
        this._lastX = touchEvt.clientX;
        this._lastY = touchEvt.clientY;

        _hideGhostForTarget();
        //Emulate Cursor Offet 
        console.log(parseInt(ghostEl.style.width),tapDistanceLeft);
        var emulatedCenterdClientX = touchEvt.clientX - (tapDistanceLeft - parseInt(ghostEl.style.width)/2);
        var emulatedCenterdClientY = touchEvt.clientY - (tapDistanceTop - parseInt(ghostEl.style.height)/2);

        var target = document.elementFromPoint(emulatedCenterdClientX, emulatedCenterdClientY);
        var parent = target;

        while (target && target.shadowRoot) {
          target = target.shadowRoot.elementFromPoint(emulatedCenterdClientX, emulatedCenterdClientY);
          if (target === parent) break;
          parent = target;
        }

        dragEl.parentNode[expando]._isOutsideThisEl(target);

        if (parent) {
          do {
            if (parent[expando]) {
              var inserted = void 0;
              inserted = parent[expando]._onDragOver({
                clientX: emulatedCenterdClientX,
                clientY: emulatedCenterdClientY,
                target: target,
                rootEl: parent
              });

              if (inserted && !this.options.dragoverBubble) {
                break;
              }
            }

            target = parent; // store last element
          }
          /* jshint boss:true */
          while (parent = parent.parentNode);
        }

        _unhideGhostForTarget();
      }
    },

I wish someone who know what they are doing could implement it as a setting or something. (although I'd go as far as to say it should be the default behavior ;)

Thanks for writing such a great alternative to the broken jQuery UI Sortable.