CODEWITHSUNDEEP
jquery
localgrr
localgrr

Reputation: 61

Odd behavour with using jQuery draggable AND resizable with jquery collision 1.0.1

I am using:

jquery-1.6.2 jquery-ui-1.8.16 collision 1.0.1

...to build a web-based block painting application. I have a table grid which has selectable cells. Above that layer are the 'marquees'. When a marquee is moved or resized, I wish the overlapping cells in the table below to have special classes applied to them so I started using collision 1.0.1.

It seemed to have exactly the desired effect, however when you drag a marquee and THEN resize it - the cells below no longer reflect collisions from the marquee above until you drag the marquee again. If you create a new marquee and just resize it, the the collisions are calculated accurately, it only goes wrong after a drag.

There is a demo at http://accessibledesign.net/block_painter/client/ (just drag a marquee on the screen)

Cells that are yellow reflect collision with the marquee above.

I have done extensive testing and can confirm that the resizable marquees themselves have all the correct properties, the fault seems to lie with the collision function:

$("#grid td.ui-selected").removeClass("ui-selected");
hits = DATA.elems.curMarquee.collision($("#grid td.col"))
hits.addClass("ui-selected");

This code is run on 'stop' of resizable or draggable - and is triggered at the correct time.

Upvotes: 2

Views: 1045

Answers (1)

eruciform
eruciform

Reputation: 7726

This is a bug in the jquery-ui-draggable-collision module, actually. Or more specifically, it was not designed to handle "resizeable" yet - that was going to be in a future version. If you don't need the draggable-collision stuff, removing that should fix the issue.

However, if you do need it, there is a workaround for now. Just before calling $("#target").collision(".obstacles"), do:

$("#target").removeData("jqueryCollisionCoordinates")
$("#target").removeData("jqueryUiDraggableCollisionRecentPosition")
$(".obstacles").removeData("jqueryCollisionCoordinates")
$(".obstacles").removeData("jqueryUiDraggableCollisionRecentPosition")

And this will delete all the internal caching it does, so that it recalculates the collision from scratch, rather than using the previous version that was not yet updated.

Note: If you can file a bug fix ticket on the sourceforge page, too, please, and link to this page, I'll eventually patch it to work properly, and you'll get a message when I do. You're welcome to add your website to a review there as well, and I'll try to keep posted users' usage in mind when I make changes. Thanks!

Also note: maybe it shouldn't need to be said, but don't depend on this working after version 1.0.1. Also don't futz with the contents of those internals, or it might break in future versions - it's not a public API.

Upvotes: 2

Related Questions