Source: level3/mutation-observer.js

  1. // level 0
  2. import animate from '../level0/animate';
  3. import present from '../level0/present';
  4. import update from '../level0/update';
  6. // level 1
  7. import AnimatedManager from '../level1/animated-manager';
  8. import AnimatedStateFactory from '../level1/animated-state-factory';
  9. import Bus from '../level1/bus';
  10. import BusAnimatedManager from '../level1/bus-animated-manager';
  11. import Matcher from '../level1/matcher';
  12. import RunLoop from '../level1/runloop';
  14. // level 2
  15. import InnerMutationObserver from '../level2/mutation-observer';
  17. /**
  18.  * @example
  19.  *   import BoxartMutationObserver from 'boxart-mutation-observer';
  20.  *
  21.  *   import animations from './animations';
  22.  *
  23.  *   new BoxartMutationObserver({animations})
  24.  *   .observe(rootElment);
  25.  */
  27. class BoxartMutationObserver {
  28.   constructor({loop = RunLoop.main, animations}) {
  29.     this.animations = animations;
  31.     const bus = this.bus = new Bus();
  33.     const animationTypes = {};
  34.     const matcher = this.matcher = new Matcher();
  35.     Object.keys(animations).forEach(key => {
  36.       matcher.add(key, Object.keys(animations[key]));
  37.       const type = animationTypes[key.split(' ')[0]] = animations[key];
  38.       Object.keys(type).forEach(name => {
  39.         const anim = type[name];
  40.         if (anim.update && !anim.update.copy) {
  41.           try {
  42.           const update = update.context(anim.update);
  43.           if (typeof update === 'function') {
  44.             anim.update = update;
  45.           }
  46.           } catch (e) {
  47.             console.error(e);
  48.           }
  49.         }
  50.         if (anim.update && anim.update.compile) {
  51.           try {
  52.           anim.update = anim.update.compile();
  53.           } catch (e) {
  54.             console.error(e);
  55.           }
  56.         }
  57.         if (anim.animate && !anim.animate.done) {
  58.           try {
  59.           const animate = animate.context(anim.animate);
  60.           if (typeof animate === 'function') {
  61.             anim.animate = animate;
  62.           }
  63.           } catch (e) {
  64.             console.error(e);
  65.           }
  66.         }
  67.         if (anim.animate && anim.animate.compile) {
  68.           try {
  69.           anim.animate = anim.animate.compile();
  70.           } catch (e) {
  71.             console.error(e);
  72.           }
  73.         }
  74.         if (anim.present && !anim.present.store) {
  75.           try {
  76.           const present = present.context(anim.present);
  77.           if (typeof present === 'function') {
  78.             anim.present = present;
  79.           }
  80.           } catch (e) {
  81.             console.error(e);
  82.           }
  83.         }
  84.         if (anim.present && anim.present.compile) {
  85.           try {
  86.           anim.present = anim.present.compile();
  87.           } catch (e) {
  88.             console.error(e);
  89.           }
  90.         }
  91.       });
  92.     });
  94.     const {create: factory} = new AnimatedStateFactory(animations);
  96.     const manager = this.manager = new AnimatedManager(factory, loop);
  98.     new BusAnimatedManager(manager, bus);
  100.     this.innerObserver = new InnerMutationObserver({bus, loop, matcher});
  101.   }
  103.   observe(target) {
  104.     this.innerObserver.observe(target);
  105.   }
  107.   disconnect() {
  108.     this.innerObserver.disconnect();
  109.   }
  111.   getManager() {
  112.     return this.manager;
  113.   }
  115.   getAnimated(element) {
  116.     return this.manager.getAnimated(element);
  117.   }
  118. }
  120. export default BoxartMutationObserver;
  122. export {
  123.   animate,
  124.   present,
  125.   update,
  126. };