gsap-promise

app.js

var gallery = require('./page-gallery')
var popup = require('./info-popup')


gallery.show()
  //once all elements in the page are done animating, do something else
  .then(function() {
      return popup.show()
  })

gallery-grid.js

//a reusable "gallery" grid

module.exports = {
    
    show: function() {
        return animate.staggerTo(items, 1.0, { ... })
    },
    
    ... setup section ...
}

left-nav.js

//a reusable "nav menu" with its own set of animations

module.exports = {
    
    show: function() {
        //animate all tweens in parallel
        return animate.all([
          animate.to(container, 1.0, { ... }),
          animate.fromTo(children, 1.0, { ... }, { ... }),
          ... etc
        ])
    },
    
    ... setup section ...
}

page-gallery.js

//this brings together the nav menu and grid into a single page
var nav = require('./left-nav')
var gallery = require('./gallery-grid')

module.exports = {
    //section is not fully animated in until both nav & gallery is done animating
    show: function() {
        return animate.all([
          nav.show(),
          gallery.show()
        ])
    },
    
    ... setup section ...
}