Make a modification in jQuery UI and get a concise version?

Question

JavaScript

Some time ago, I wrote that I was writing some kind of "analogue of jQuery Treeview" . Thanks to nikitammf 's hint, I overcame the "bouncing element" problem.
But there was another problem. To describe it, I'll first explain how the jQuery UI Draggable plugin determines whether a droppable element is currently above a droppable element.

At the moment the transfer of the captured element starts, the method is called$.ui.ddmanager.prepareOffsets(this, event)(line 152 of /development-bundle/ui/jquery.ui.draggable.js). This method caches the absolute coordinates of all droppable elements. Then, in the process of transferring the draggable element, its changing coordinates are constantly checked against the coordinates of the droppable elements from the cache, and when the coordinates intersect, the plugin recognizes that the captured element is above that droppable element (i.e., the “hover” event occurs » ). The coordinate cache of droppable elements is always calculated only once - at the moment the captured element is transferred.

How does this conflict with my code? As I already wrote, at the time of the hover eventI have a request sent to the server that returns a list of child elements that are inserted as a nested list. Since a nested list is being inserted, the coordinates of subsequent (underlying) droppable elements are changed, but the coordinate cache does not know about it.
As a result, if you grab the very first element, hold over the second element (waiting for the nested list to appear) and then drag it down, then the third and subsequent elements will react long before the dragged element actually appears above them (because the old coordinates and it still thinks that all droppable elements are left in their original places).
How to solve this problem is clear in principle: recalculate the coordinate cache (call the method $.ui.ddmanager.prepareOffsets(this, event)) after inserting the child list.
But it's not so easy to call this method: its name has already been changed in the process of linking and minimizing by the jQuery UI constructor (I'm not using a giant archive with a bunch of js files, but a single file assembled by the constructor ).
How to be here? How to call a method whose name is already "obfuscated"?

An online example of my own development is here .

Answer 1

I already found the solution myself. As always, everything turned out to be much simpler: I didn’t notice in the documentation that the jQuery UI draggable has an option refreshPositionsand if it is set to true , then the positions of the droppable elements will be updated with each mouse movement.
On the other hand, to save computer resources, I would still like to learn how to update the positions of elements not with every mouse movement, but only when necessary, by calling the appropriate method.

Answer 2

I suggest you use the automatic javascript writing tool in a beautiful form , which will write the compressed code in a structured form, although, of course, it will not restore the original names of shortened identifiers (variables, fields, functions, methods, and so on).
Then, by looking closely, you can determine the name of the desired method in it (by comparing its contents with the contents of the original uncompressed code of the same method known to you and making sure that they are logically the same). Use the found name in your call, and in this way you will achieve what you want without difficulty.

Answer 3

A more radical method of solving this problem is to abandon the standard packaging constructor offered on the jQuery UI website, and switch to hand-gluing the desired javascript files end-to-end, with further packaging them yourself - moreover, with just such a packaging that does not change the names of the methods, so which does not create the problem you describe.
For this purpose, for example, you can use the famous Dean Edwards packer by checking the "Base62 encode" checkbox in the settings, but unchecking the "Shrink variables" checkbox.

Answer 4

Submit a feature request to their bug tracker :)

Answer 5

And why, if the list was opened and the elements were loaded and then closed, when they are opened again, they are loaded again? Can make a flag, loaded or not? Or is it critical and items are updated so often? (little offquestion) (:

Answer 6

you can use the "option" method of the draggable and set the option to recalculate when updating after loading the elements, then remove it again.