Using This with Other Click Events

[DerWats]

Firstly, great work!! This is perfect and truly simple to implement. I am new to this and found your documentation really helpful.

I was trying to make certain elements appear on clicking a check-box inside the ng-repeat'ed node. The angular-sortable-view assumes my attempts to click on the check-box as an attempt to reorder the ng-repeat'ed list.

I solved this by placing my display code ahead of the angular-sortable-view. This seems like a very rough solution though. Is there any other way, I can make my display scripts over-ride the angular-sortable-view in some situations?

[kamilkp]

Thank you. Hmm, can you please provide a sample app (a jsfiddle or plunkr is preferred)?

[DerWats]

The JSFiddle is here : http://jsfiddle.net/DerWats/qbtwqtq3/

On clicking the check box, a button is to be displayed. But when I try to click on the check box, it beings to re-order/sort it. Do check it out and let me know if I can correct it.

Thanks

[mbenna]

👍 on the great work building this library! This was indeed a surprisingly easy library to give me drag&drop ability in way less time than I expected to take.

I have a very similar problem to DerWats, but only on touch devices (iPhone, Android tablet, Windows 8.1 touch). I.e. when I try to click a checkbox or select an item, it goes into sort mode immediately. When using the mouse, it works just fine, i.e. I can check/uncheck the checkbox, click on hyperlinks, or otherwise get an ng-click event on the entire div.

I'd like it to not enter sort mode unless I move my finger far enough to trigger it, otherwise I'd like the touch/click events to just flow through as if sv-element was not on the div at all. fwiw, I can make my app behave just fine on touch devices simply by removing sv-element, but of course I don't get sorting :(

Is it as simple as adding a "minimum move amount" before going into sort mode, e.g. "touch or mouse must move at least 10 pixels before switching to sort mode"? Can that be done with the library as it stands, or would that need to be added?

Thanks,
Mike

[franktroia]

I think this is an issue only with Chrome where a click immediately fires a mousemove event.
https://code.google.com/p/chromium/issues/detail?id=161464

Modifying the svElement directive to check that the click and mousemove event don't have the same cursor position seems to work.

var clickEvent = e;

function onMousemove(e) {
    if (clickEvent.clientX === e.clientX &&
        clickEvent.clientY === e.clientY) {
        e.stopPropagation();
        return false;
    }

    touchFix(e);
    if (!moveExecuted) {
        $element.parent().prepend(clone);
        moveExecuted = true;
    }
    $controllers[1].$moveUpdate(opts, {
        x: e.clientX,
        y: e.clientY,
        offset: pointerOffset
    }, clone, $element, placeholder, $controllers[0].getPart(), $scope.$index);
}

[luklapp]

Looks like preventDefault() in touchFix() for onMousedown is also a problem. I added a PR, seems to be working for me now!