Skip to content
This repository has been archived by the owner on Mar 10, 2024. It is now read-only.

Problem when use with ngAnimate lib #121

Closed
jbfm21 opened this issue Aug 15, 2015 · 3 comments
Closed

Problem when use with ngAnimate lib #121

jbfm21 opened this issue Aug 15, 2015 · 3 comments
Milestone

Comments

@jbfm21
Copy link

jbfm21 commented Aug 15, 2015

Hello,
if i inject ngAnimate dependency in my application, after i drop an item, this item blink in the source container, this istem is flashing in the source before appear in destination container.

When i remove this line of code
$timeout(function() { element.removeClass("dndDraggingSource"); }, 0)

the item stop flashing in the source container, but if i move the item to a invalid place, the item disappears.

@sgraham3311
Copy link

I can confirm this issue. Having the ngAnimate module causes a delay removing the dragging source if you are using css transitions on the dragging element. This link helped me to disable ng-animate on draggable elements http://stackoverflow.com/a/24542131/5298390. This seems to be the only workaround at the moment.

@marceljuenemann marceljuenemann added this to the 2.0.0 milestone Feb 7, 2016
@marceljuenemann
Copy link
Owner

I think I introduced that problem in #21. I should call element.removeClass("dndDraggingSource"); right away and in addition also call it inside a $timeout.

@jbrady89
Copy link

jbrady89 commented Apr 21, 2016

@sgraham3311 +1 for this workaround that solved the problem for my specific case. I ended up giving the dnd list items a unique class name and added a classNameFilter to ignore that particular class. $animateProvider.classNameFilter(/^((?!(dnd-list-item)).)*$/);

@marceljuenemann marceljuenemann modified the milestones: 2.0.0, 2.2.0, 2.1.0 Dec 25, 2016
marceljuenemann added a commit that referenced this issue Jan 15, 2017
* Some unfinished code for better drop effect handling

* Update README.md

* Some more code

* Add more tests

* Make effectAllowed and dropEffect work in every browser

Details on how this works can be found at https://github.com/marceljuenemann/angular-drag-and-drop-lists/wiki/Drop-Effects-Design

* New dragleave handler

* Remove dndDraggingSource class immediately as well as after a timeout. Fixes #121

* Adds dnd-callback for custom callbacks to source element

This powerful addition allows to move items by reference without serialization. It also enables access to the source element from dnd-dragover callbacks, where the data can not be accessed otherwise.

* Bump versions to 2.1.0

* Ignore effectAllowed from external sources in IE

Unfortunately, accessing effectAllowed from a different document throws an exception (tested on IE 11 on Win7)

* Update README.md

* Update CHANGELOG.md

* Update README.md

* Remove duplicate line
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

4 participants