ANIJS not working with widgets

[crashnick16]

Hi,

i am trying to use ANIJS to animate add/remove of the widgets in the grid but for some reason this would not work. is there any event that gets triggered on add/remove?

the syntax is data-anijs="if: <event_name>, do: animated bounceIn"

thanks,
Nick

[troolee]

I will try to implement support of anijs

[radiolips]

@troolee Nothing special should be required to support anijs. By emitting an event for adding a widget and another for removing it, @crashnick16 should be able to get it working.

[troolee]

it could be some issues with animations delay. Needs to be checked

[radiolips]

gridstack will now emit added and removed. I've successfully run a test. AniJS requires custom code be written for custom events, so I quickly wrote something up that worked okay:

                AniJS.run();
                self.gridstackNotifier = AniJS.getNotifier('gridstack');
                $('.grid-stack').on('removed', function(event, items) {
                    self.gridstackNotifier.dispatchEvent('removed');
                });

and the data-ani-js:
data-anijs="if: removed, do: swing animated, on: $gridstack"

This will swing animated when a widget is removed. By changing removed to added, it'll fire on widgets added. Let me know if you need further help!

[troolee]

@radiolips, could you please make a note about AniJS support in README.md?

[radiolips]

Absolutely! I'm putting a demo together currently.

[AK1979]

Hi
I'm trying to add animation when the widget is closed but the 'removed' event is fired when the widget is not on the DOM.

Can you please attach working example of the removed animation ?

Regards,
Arie.