deblan/gridstack.js
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Animate widgets. Just for troolee.

Browse source
This commit is contained in:
Dylan Weiss 2016-02-23 21:16:12 -05:00
commit b44308b4ed
1 changed files with 16 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

20
demo/anijs.html
View file

@ -42,7 +42,7 @@
</div>
<div>
<h4 data-anijs="if: added, do: swing animated, on: $gridstack">Widget added</h4>
<h4>Widget added</h4>
</div>
<br/>
@ -57,9 +57,14 @@
$('.grid-stack').gridstack();
var self = this;
this.grid = $('.grid-stack').data('gridstack');
AniJS.run();
self.gridstackNotifier = AniJS.getNotifier('gridstack');
$('.grid-stack').on('added', function(event, items) {
// add anijs data to gridstack item
for (var i = 0; i < items.length; i++) {
$(items[i].el[0]).attr('data-anijs', 'if: added, do: swing animated, after: $removeAnimations, on: $gridstack');
}
AniJS.run();
self.gridstackNotifier = AniJS.getNotifier('gridstack');
// fire added event!
self.gridstackNotifier.dispatchEvent('added');
});
$('#add-widget').click(function() {
@ -68,8 +73,15 @@
function addNewWidget() {
var grid = $('.grid-stack').data('gridstack');
grid.addWidget($('<div class="grid-stack-item-content"></div>'), 0, 0, Math.floor(1 + 3 * Math.random()), Math.floor(1 + 3 * Math.random()), true);
grid.addWidget($('<div><div class="grid-stack-item-content"></div></div>'), 0, 0, Math.floor(1 + 3 * Math.random()), Math.floor(1 + 3 * Math.random()), true);
}
var animationHelper = AniJS.getHelper();
//Defining removeAnimations to remove existing animations
animationHelper.removeAnimations = function(e, animationContext){
$('.grid-stack-item').attr('data-anijs', '');
};
});
</script>
</body>