From c39486091c3f68cf97a2e3c74e1d7874855674ad Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 22 Dec 2018 12:10:18 +0100
Subject: [PATCH 01/65] Rollup and babel

---
 dist/index.html                |   2 +-
 dist/js/chocolat.cjs.js        | 643 ++++++++++++++++++++++
 dist/js/chocolat.esm.js        | 641 ++++++++++++++++++++++
 dist/js/chocolat.iife.js       | 646 +++++++++++++++++++++++
 dist/js/jquery.chocolat.js     | 730 -------------------------
 dist/js/jquery.chocolat.min.js |   1 -
 package.json                   |  20 +-
 rollup.config.js               |  40 ++
 src/js/chocolat.js             | 705 +++++++++++++++++++++++++
 src/js/jquery.chocolat.js      | 730 -------------------------
 src/js/main.esm.js             |  12 +
 src/js/main.iife.js            |  14 +
 yarn.lock                      | 939 ++++++++++++++++++++++++++++++++-
 13 files changed, 3646 insertions(+), 1477 deletions(-)
 create mode 100644 dist/js/chocolat.cjs.js
 create mode 100644 dist/js/chocolat.esm.js
 create mode 100644 dist/js/chocolat.iife.js
 delete mode 100644 dist/js/jquery.chocolat.js
 delete mode 100644 dist/js/jquery.chocolat.min.js
 create mode 100644 rollup.config.js
 create mode 100644 src/js/chocolat.js
 delete mode 100644 src/js/jquery.chocolat.js
 create mode 100644 src/js/main.esm.js
 create mode 100644 src/js/main.iife.js

diff --git a/dist/index.html b/dist/index.html
index 7350612..747ae4b 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -4,7 +4,7 @@
         <meta charset="utf-8" />
         <link rel="stylesheet" href="./css/chocolat.css" />
         <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
-        <script type="text/javascript" src="./js/jquery.chocolat.js"></script>
+        <script type="text/javascript" src="./js/chocolat.umd.js"></script>
         <style>
             body {
                 text-align: center;
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
new file mode 100644
index 0000000..a6be65a
--- /dev/null
+++ b/dist/js/chocolat.cjs.js
@@ -0,0 +1,643 @@
+'use strict';
+
+const defaults = {
+  container: window,
+  // window or jquery object or jquery selector, or element
+  imageSelector: '.chocolat-image',
+  className: '',
+  imageSize: 'default',
+  // 'default', 'contain', 'cover' or 'native'
+  initialZoomState: null,
+  fullScreen: false,
+  loop: false,
+  linkImages: true,
+  duration: 300,
+  setTitle: '',
+  separator2: '/',
+  setIndex: 0,
+  firstImage: 0,
+  lastImage: false,
+  currentImage: false,
+  initialized: false,
+  timer: false,
+  timerDebounce: false,
+  images: [],
+  enableZoom: true,
+  imageSource: 'href',
+
+  afterInitialize() {},
+
+  afterMarkup() {},
+
+  afterImageLoad() {},
+
+  zoomedPaddingX: function (canvasWidth, imgWidth) {
+    return 0;
+  },
+  zoomedPaddingY: function (canvasHeight, imgHeight) {
+    return 0;
+  }
+};
+class Chocolat {
+  constructor(element, settings) {
+    var that = this;
+    this.settings = settings;
+    this.elems = {};
+    this.element = element;
+    this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
+
+    if (!this.settings.setTitle && element.data('chocolat-title')) {
+      this.settings.setTitle = element.data('chocolat-title');
+    }
+
+    this.element.find(this.settings.imageSelector).each(function () {
+      that.settings.images.push({
+        title: $(this).attr('title'),
+        src: $(this).attr(that.settings.imageSource),
+        height: false,
+        width: false
+      });
+    });
+    this.element.find(this.settings.imageSelector).each(function (i) {
+      $(this).off('click.chocolat').on('click.chocolat', function (e) {
+        that.init(i);
+        e.preventDefault();
+      });
+    });
+  }
+
+  init(i) {
+    if (!this.settings.initialized) {
+      this.setDomContainer();
+      this.markup();
+      this.events();
+      this.settings.lastImage = this.settings.images.length - 1;
+      this.settings.initialized = true;
+    }
+
+    this.settings.afterInitialize.call(this);
+    return this.load(i);
+  }
+
+  preload(i) {
+    var def = $.Deferred();
+
+    if (typeof this.settings.images[i] === 'undefined') {
+      return;
+    }
+
+    var imgLoader = new Image();
+
+    imgLoader.onload = function () {
+      def.resolve(imgLoader);
+    };
+
+    imgLoader.src = this.settings.images[i].src;
+    return def;
+  }
+
+  load(i) {
+    var that = this;
+
+    if (this.settings.fullScreen) {
+      this.openFullScreen();
+    }
+
+    if (this.settings.currentImage === i) {
+      return;
+    }
+
+    this.elems.overlay.fadeIn(this.settings.duration);
+    this.elems.wrapper.fadeIn(this.settings.duration);
+    this.elems.domContainer.addClass('chocolat-open');
+    this.settings.timer = setTimeout(function () {
+      if (typeof that.elems != 'undefined') {
+        $.proxy(that.elems.loader.fadeIn(), that);
+      }
+    }, this.settings.duration);
+    var deferred = this.preload(i).then(function (imgLoader) {
+      return that.place(i, imgLoader);
+    }).then(function (imgLoader) {
+      return that.appear(i);
+    }).then(function (imgLoader) {
+      that.zoomable();
+      that.settings.afterImageLoad.call(that);
+    });
+    var nextIndex = i + 1;
+
+    if (typeof this.settings.images[nextIndex] != 'undefined') {
+      this.preload(nextIndex);
+    }
+
+    return deferred;
+  }
+
+  place(i, imgLoader) {
+    var that = this;
+    var fitting;
+    this.settings.currentImage = i;
+    this.description();
+    this.pagination();
+    this.arrows();
+    this.storeImgSize(imgLoader, i);
+    fitting = this.fit(i, that.elems.wrapper);
+    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+  }
+
+  center(width, height, left, top, duration) {
+    return this.elems.content.css('overflow', 'visible').animate({
+      width: width,
+      height: height,
+      left: left,
+      top: top
+    }, duration).promise();
+  }
+
+  appear(i) {
+    var that = this;
+    clearTimeout(this.settings.timer);
+    this.elems.loader.stop().fadeOut(300, function () {
+      that.elems.img.attr('src', that.settings.images[i].src);
+    });
+  }
+
+  fit(i, container) {
+    var height;
+    var width;
+    var imgHeight = this.settings.images[i].height;
+    var imgWidth = this.settings.images[i].width;
+    var holderHeight = $(container).height();
+    var holderWidth = $(container).width();
+    var holderOutMarginH = this.getOutMarginH();
+    var holderOutMarginW = this.getOutMarginW();
+    var holderGlobalWidth = holderWidth - holderOutMarginW;
+    var holderGlobalHeight = holderHeight - holderOutMarginH;
+    var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
+    var holderRatio = holderHeight / holderWidth;
+    var imgRatio = imgHeight / imgWidth;
+
+    if (this.settings.imageSize == 'cover') {
+      if (imgRatio < holderRatio) {
+        height = holderHeight;
+        width = height / imgRatio;
+      } else {
+        width = holderWidth;
+        height = width * imgRatio;
+      }
+    } else if (this.settings.imageSize == 'native') {
+      height = imgHeight;
+      width = imgWidth;
+    } else {
+      if (imgRatio > holderGlobalRatio) {
+        height = holderGlobalHeight;
+        width = height / imgRatio;
+      } else {
+        width = holderGlobalWidth;
+        height = width * imgRatio;
+      }
+
+      if (this.settings.imageSize === 'default' && (width >= imgWidth || height >= imgHeight)) {
+        width = imgWidth;
+        height = imgHeight;
+      }
+    }
+
+    return {
+      height: height,
+      width: width,
+      top: (holderHeight - height) / 2,
+      left: (holderWidth - width) / 2
+    };
+  }
+
+  change(signe) {
+    this.zoomOut(0);
+    this.zoomable();
+    var requestedImage = this.settings.currentImage + parseInt(signe);
+
+    if (requestedImage > this.settings.lastImage) {
+      if (this.settings.loop) {
+        return this.load(0);
+      }
+    } else if (requestedImage < 0) {
+      if (this.settings.loop) {
+        return this.load(this.settings.lastImage);
+      }
+    } else {
+      return this.load(requestedImage);
+    }
+  }
+
+  arrows() {
+    if (this.settings.loop) {
+      $([this.elems.left[0], this.elems.right[0]]).addClass('active');
+    } else if (this.settings.linkImages) {
+      // right
+      if (this.settings.currentImage == this.settings.lastImage) {
+        this.elems.right.removeClass('active');
+      } else {
+        this.elems.right.addClass('active');
+      } // left
+
+
+      if (this.settings.currentImage === 0) {
+        this.elems.left.removeClass('active');
+      } else {
+        this.elems.left.addClass('active');
+      }
+    } else {
+      $([this.elems.left[0], this.elems.right[0]]).removeClass('active');
+    }
+  }
+
+  description() {
+    var that = this;
+    this.elems.description.html(that.settings.images[that.settings.currentImage].title);
+  }
+
+  pagination() {
+    var that = this;
+    var last = this.settings.lastImage + 1;
+    var position = this.settings.currentImage + 1;
+    this.elems.pagination.html(position + ' ' + that.settings.separator2 + last);
+  }
+
+  storeImgSize(img, i) {
+    if (typeof img === 'undefined') {
+      return;
+    }
+
+    if (!this.settings.images[i].height || !this.settings.images[i].width) {
+      this.settings.images[i].height = img.height;
+      this.settings.images[i].width = img.width;
+    }
+  }
+
+  close() {
+    if (this.settings.fullscreenOpen) {
+      this.exitFullScreen();
+      return;
+    }
+
+    var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
+    var that = this;
+    var def = $.when($(els).fadeOut(200)).done(function () {
+      that.elems.domContainer.removeClass('chocolat-open');
+    });
+    this.settings.currentImage = false;
+    return def;
+  }
+
+  destroy() {
+    this.element.removeData();
+    this.element.find(this.settings.imageSelector).off('click.chocolat');
+
+    if (!this.settings.initialized) {
+      return;
+    }
+
+    if (this.settings.fullscreenOpen) {
+      this.exitFullScreen();
+    }
+
+    this.settings.currentImage = false;
+    this.settings.initialized = false;
+    this.elems.domContainer.removeClass(this._cssClasses.join(' '));
+    this.elems.wrapper.remove();
+  }
+
+  getOutMarginW() {
+    var left = this.elems.left.outerWidth(true);
+    var right = this.elems.right.outerWidth(true);
+    return left + right;
+  }
+
+  getOutMarginH() {
+    return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true);
+  }
+
+  markup() {
+    this.elems.domContainer.addClass('chocolat-open ' + this.settings.className);
+
+    if (this.settings.imageSize == 'cover') {
+      this.elems.domContainer.addClass('chocolat-cover');
+    }
+
+    if (this.settings.container !== window) {
+      this.elems.domContainer.addClass('chocolat-in-container');
+    }
+
+    this.elems.wrapper = $('<div/>', {
+      class: 'chocolat-wrapper',
+      id: 'chocolat-content-' + this.settings.setIndex
+    }).appendTo(this.elems.domContainer);
+    this.elems.overlay = $('<div/>', {
+      class: 'chocolat-overlay'
+    }).appendTo(this.elems.wrapper);
+    this.elems.loader = $('<div/>', {
+      class: 'chocolat-loader'
+    }).appendTo(this.elems.wrapper);
+    this.elems.content = $('<div/>', {
+      class: 'chocolat-content'
+    }).appendTo(this.elems.wrapper);
+    this.elems.img = $('<img/>', {
+      class: 'chocolat-img',
+      src: ''
+    }).appendTo(this.elems.content);
+    this.elems.top = $('<div/>', {
+      class: 'chocolat-top'
+    }).appendTo(this.elems.wrapper);
+    this.elems.left = $('<div/>', {
+      class: 'chocolat-left'
+    }).appendTo(this.elems.wrapper);
+    this.elems.right = $('<div/>', {
+      class: 'chocolat-right'
+    }).appendTo(this.elems.wrapper);
+    this.elems.bottom = $('<div/>', {
+      class: 'chocolat-bottom'
+    }).appendTo(this.elems.wrapper);
+    this.elems.close = $('<span/>', {
+      class: 'chocolat-close'
+    }).appendTo(this.elems.top);
+    this.elems.fullscreen = $('<span/>', {
+      class: 'chocolat-fullscreen'
+    }).appendTo(this.elems.bottom);
+    this.elems.description = $('<span/>', {
+      class: 'chocolat-description'
+    }).appendTo(this.elems.bottom);
+    this.elems.pagination = $('<span/>', {
+      class: 'chocolat-pagination'
+    }).appendTo(this.elems.bottom);
+    this.elems.setTitle = $('<span/>', {
+      class: 'chocolat-set-title',
+      html: this.settings.setTitle
+    }).appendTo(this.elems.bottom);
+    this.settings.afterMarkup.call(this);
+  }
+
+  openFullScreen() {
+    var wrapper = this.elems.wrapper[0];
+
+    if (wrapper.requestFullscreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.requestFullscreen();
+    } else if (wrapper.mozRequestFullScreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.mozRequestFullScreen();
+    } else if (wrapper.webkitRequestFullscreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.webkitRequestFullscreen();
+    } else if (wrapper.msRequestFullscreen) {
+      wrapper.msRequestFullscreen();
+      this.settings.fullscreenOpen = true;
+    } else {
+      this.settings.fullscreenOpen = false;
+    }
+  }
+
+  exitFullScreen() {
+    if (document.exitFullscreen) {
+      document.exitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.mozCancelFullScreen) {
+      document.mozCancelFullScreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.webkitExitFullscreen) {
+      document.webkitExitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.msExitFullscreen) {
+      document.msExitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else {
+      this.settings.fullscreenOpen = true;
+    }
+  }
+
+  events() {
+    var that = this;
+    $(document).off('keydown.chocolat').on('keydown.chocolat', function (e) {
+      if (that.settings.initialized) {
+        if (e.keyCode == 37) {
+          that.change(-1);
+        } else if (e.keyCode == 39) {
+          that.change(1);
+        } else if (e.keyCode == 27) {
+          that.close();
+        }
+      }
+    }); // this.elems.wrapper.find('.chocolat-img')
+    //     .off('click.chocolat')
+    //     .on('click.chocolat', function(e) {
+    //         var currentImage = that.settings.images[that.settings.currentImage];
+    //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
+    //             that.toggleZoom(e);
+    //         }
+    // });
+
+    this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', function () {
+      that.change(+1);
+    });
+    this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', function () {
+      return that.change(-1);
+    });
+    $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', function () {
+      return that.close();
+    });
+    this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function () {
+      if (that.settings.fullscreenOpen) {
+        that.exitFullScreen();
+        return;
+      }
+
+      that.openFullScreen();
+    });
+
+    if (that.settings.backgroundClose) {
+      this.elems.overlay.off('click.chocolat').on('click.chocolat', function () {
+        return that.close();
+      });
+    }
+
+    this.elems.wrapper.off('click.chocolat').on('click.chocolat', function (e) {
+      return that.zoomOut(e);
+    });
+    this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', function (e) {
+      if (that.settings.initialZoomState === null && that.elems.domContainer.hasClass('chocolat-zoomable')) {
+        e.stopPropagation();
+        return that.zoomIn(e);
+      }
+    });
+    this.elems.wrapper.mousemove(function (e) {
+      if (that.settings.initialZoomState === null) {
+        return;
+      }
+
+      if (that.elems.img.is(':animated')) {
+        return;
+      }
+
+      var pos = $(this).offset();
+      var height = $(this).height();
+      var width = $(this).width();
+      var currentImage = that.settings.images[that.settings.currentImage];
+      var imgWidth = currentImage.width;
+      var imgHeight = currentImage.height;
+      var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
+      var mvtX = 0;
+
+      if (imgWidth > width) {
+        var paddingX = that.settings.zoomedPaddingX(imgWidth, width);
+        mvtX = coord[0] / (width / 2);
+        mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
+      }
+
+      var mvtY = 0;
+
+      if (imgHeight > height) {
+        var paddingY = that.settings.zoomedPaddingY(imgHeight, height);
+        mvtY = coord[1] / (height / 2);
+        mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
+      }
+
+      var animation = {
+        'margin-left': -mvtX + 'px',
+        'margin-top': -mvtY + 'px'
+      };
+
+      if (typeof e.duration !== 'undefined') {
+        $(that.elems.img).stop(false, true).animate(animation, e.duration);
+      } else {
+        $(that.elems.img).stop(false, true).css(animation);
+      }
+    });
+    $(window).on('resize', function () {
+      if (!that.settings.initialized || that.settings.currentImage === false) {
+        return;
+      }
+
+      that.debounce(50, function () {
+        var fitting = that.fit(that.settings.currentImage, that.elems.wrapper);
+        that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+        that.zoomable();
+      });
+    });
+  }
+
+  zoomable() {
+    var currentImage = this.settings.images[this.settings.currentImage];
+    var wrapperWidth = this.elems.wrapper.width();
+    var wrapperHeight = this.elems.wrapper.height();
+    var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
+    var isImageStretched = this.elems.img.width() > currentImage.width || this.elems.img.height() > currentImage.height;
+
+    if (isImageZoomable && !isImageStretched) {
+      this.elems.domContainer.addClass('chocolat-zoomable');
+    } else {
+      this.elems.domContainer.removeClass('chocolat-zoomable');
+    }
+  }
+
+  zoomIn(e) {
+    this.settings.initialZoomState = this.settings.imageSize;
+    this.settings.imageSize = 'native';
+    var event = $.Event('mousemove');
+    event.pageX = e.pageX;
+    event.pageY = e.pageY;
+    event.duration = this.settings.duration;
+    this.elems.wrapper.trigger(event);
+    this.elems.domContainer.addClass('chocolat-zoomed');
+    var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, this.settings.duration);
+  }
+
+  zoomOut(e, duration) {
+    if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
+      return;
+    }
+
+    duration = duration || this.settings.duration;
+    this.settings.imageSize = this.settings.initialZoomState;
+    this.settings.initialZoomState = null;
+    this.elems.img.animate({
+      margin: 0
+    }, duration);
+    this.elems.domContainer.removeClass('chocolat-zoomed');
+    var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration);
+  }
+
+  setDomContainer() {
+    // if container == window
+    // domContainer = body
+    if (this.settings.container === window) {
+      this.elems.domContainer = $('body');
+    } else {
+      this.elems.domContainer = $(this.settings.container);
+    }
+  }
+
+  debounce(duration, callback) {
+    clearTimeout(this.settings.timerDebounce);
+    this.settings.timerDebounce = setTimeout(function () {
+      callback();
+    }, duration);
+  }
+
+  api() {
+    var that = this;
+    return {
+      open: function (i) {
+        i = parseInt(i) || 0;
+        return that.init(i);
+      },
+      close: function () {
+        return that.close();
+      },
+      next: function () {
+        return that.change(1);
+      },
+      prev: function () {
+        return that.change(-1);
+      },
+      goto: function (i) {
+        // open alias
+        return that.open(i);
+      },
+      current: function () {
+        return that.settings.currentImage;
+      },
+      place: function () {
+        return that.place(that.settings.currentImage, that.settings.duration);
+      },
+      destroy: function () {
+        return that.destroy();
+      },
+      set: function (property, value) {
+        that.settings[property] = value;
+        return value;
+      },
+      get: function (property) {
+        return that.settings[property];
+      },
+      getElem: function (name) {
+        return that.elems[name];
+      }
+    };
+  }
+
+}
+
+function main_esm (options) {
+  return this.each(function () {
+    calls++;
+    var settings = $.extend(true, {}, defaults, options, {
+      setIndex: calls
+    });
+
+    if (!$.data(this, 'chocolat')) {
+      $.data(this, 'chocolat', new Chocolat($(this), settings));
+    }
+  });
+}
+
+module.exports = main_esm;
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
new file mode 100644
index 0000000..fd2e979
--- /dev/null
+++ b/dist/js/chocolat.esm.js
@@ -0,0 +1,641 @@
+const defaults = {
+  container: window,
+  // window or jquery object or jquery selector, or element
+  imageSelector: '.chocolat-image',
+  className: '',
+  imageSize: 'default',
+  // 'default', 'contain', 'cover' or 'native'
+  initialZoomState: null,
+  fullScreen: false,
+  loop: false,
+  linkImages: true,
+  duration: 300,
+  setTitle: '',
+  separator2: '/',
+  setIndex: 0,
+  firstImage: 0,
+  lastImage: false,
+  currentImage: false,
+  initialized: false,
+  timer: false,
+  timerDebounce: false,
+  images: [],
+  enableZoom: true,
+  imageSource: 'href',
+
+  afterInitialize() {},
+
+  afterMarkup() {},
+
+  afterImageLoad() {},
+
+  zoomedPaddingX: function (canvasWidth, imgWidth) {
+    return 0;
+  },
+  zoomedPaddingY: function (canvasHeight, imgHeight) {
+    return 0;
+  }
+};
+class Chocolat {
+  constructor(element, settings) {
+    var that = this;
+    this.settings = settings;
+    this.elems = {};
+    this.element = element;
+    this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
+
+    if (!this.settings.setTitle && element.data('chocolat-title')) {
+      this.settings.setTitle = element.data('chocolat-title');
+    }
+
+    this.element.find(this.settings.imageSelector).each(function () {
+      that.settings.images.push({
+        title: $(this).attr('title'),
+        src: $(this).attr(that.settings.imageSource),
+        height: false,
+        width: false
+      });
+    });
+    this.element.find(this.settings.imageSelector).each(function (i) {
+      $(this).off('click.chocolat').on('click.chocolat', function (e) {
+        that.init(i);
+        e.preventDefault();
+      });
+    });
+  }
+
+  init(i) {
+    if (!this.settings.initialized) {
+      this.setDomContainer();
+      this.markup();
+      this.events();
+      this.settings.lastImage = this.settings.images.length - 1;
+      this.settings.initialized = true;
+    }
+
+    this.settings.afterInitialize.call(this);
+    return this.load(i);
+  }
+
+  preload(i) {
+    var def = $.Deferred();
+
+    if (typeof this.settings.images[i] === 'undefined') {
+      return;
+    }
+
+    var imgLoader = new Image();
+
+    imgLoader.onload = function () {
+      def.resolve(imgLoader);
+    };
+
+    imgLoader.src = this.settings.images[i].src;
+    return def;
+  }
+
+  load(i) {
+    var that = this;
+
+    if (this.settings.fullScreen) {
+      this.openFullScreen();
+    }
+
+    if (this.settings.currentImage === i) {
+      return;
+    }
+
+    this.elems.overlay.fadeIn(this.settings.duration);
+    this.elems.wrapper.fadeIn(this.settings.duration);
+    this.elems.domContainer.addClass('chocolat-open');
+    this.settings.timer = setTimeout(function () {
+      if (typeof that.elems != 'undefined') {
+        $.proxy(that.elems.loader.fadeIn(), that);
+      }
+    }, this.settings.duration);
+    var deferred = this.preload(i).then(function (imgLoader) {
+      return that.place(i, imgLoader);
+    }).then(function (imgLoader) {
+      return that.appear(i);
+    }).then(function (imgLoader) {
+      that.zoomable();
+      that.settings.afterImageLoad.call(that);
+    });
+    var nextIndex = i + 1;
+
+    if (typeof this.settings.images[nextIndex] != 'undefined') {
+      this.preload(nextIndex);
+    }
+
+    return deferred;
+  }
+
+  place(i, imgLoader) {
+    var that = this;
+    var fitting;
+    this.settings.currentImage = i;
+    this.description();
+    this.pagination();
+    this.arrows();
+    this.storeImgSize(imgLoader, i);
+    fitting = this.fit(i, that.elems.wrapper);
+    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+  }
+
+  center(width, height, left, top, duration) {
+    return this.elems.content.css('overflow', 'visible').animate({
+      width: width,
+      height: height,
+      left: left,
+      top: top
+    }, duration).promise();
+  }
+
+  appear(i) {
+    var that = this;
+    clearTimeout(this.settings.timer);
+    this.elems.loader.stop().fadeOut(300, function () {
+      that.elems.img.attr('src', that.settings.images[i].src);
+    });
+  }
+
+  fit(i, container) {
+    var height;
+    var width;
+    var imgHeight = this.settings.images[i].height;
+    var imgWidth = this.settings.images[i].width;
+    var holderHeight = $(container).height();
+    var holderWidth = $(container).width();
+    var holderOutMarginH = this.getOutMarginH();
+    var holderOutMarginW = this.getOutMarginW();
+    var holderGlobalWidth = holderWidth - holderOutMarginW;
+    var holderGlobalHeight = holderHeight - holderOutMarginH;
+    var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
+    var holderRatio = holderHeight / holderWidth;
+    var imgRatio = imgHeight / imgWidth;
+
+    if (this.settings.imageSize == 'cover') {
+      if (imgRatio < holderRatio) {
+        height = holderHeight;
+        width = height / imgRatio;
+      } else {
+        width = holderWidth;
+        height = width * imgRatio;
+      }
+    } else if (this.settings.imageSize == 'native') {
+      height = imgHeight;
+      width = imgWidth;
+    } else {
+      if (imgRatio > holderGlobalRatio) {
+        height = holderGlobalHeight;
+        width = height / imgRatio;
+      } else {
+        width = holderGlobalWidth;
+        height = width * imgRatio;
+      }
+
+      if (this.settings.imageSize === 'default' && (width >= imgWidth || height >= imgHeight)) {
+        width = imgWidth;
+        height = imgHeight;
+      }
+    }
+
+    return {
+      height: height,
+      width: width,
+      top: (holderHeight - height) / 2,
+      left: (holderWidth - width) / 2
+    };
+  }
+
+  change(signe) {
+    this.zoomOut(0);
+    this.zoomable();
+    var requestedImage = this.settings.currentImage + parseInt(signe);
+
+    if (requestedImage > this.settings.lastImage) {
+      if (this.settings.loop) {
+        return this.load(0);
+      }
+    } else if (requestedImage < 0) {
+      if (this.settings.loop) {
+        return this.load(this.settings.lastImage);
+      }
+    } else {
+      return this.load(requestedImage);
+    }
+  }
+
+  arrows() {
+    if (this.settings.loop) {
+      $([this.elems.left[0], this.elems.right[0]]).addClass('active');
+    } else if (this.settings.linkImages) {
+      // right
+      if (this.settings.currentImage == this.settings.lastImage) {
+        this.elems.right.removeClass('active');
+      } else {
+        this.elems.right.addClass('active');
+      } // left
+
+
+      if (this.settings.currentImage === 0) {
+        this.elems.left.removeClass('active');
+      } else {
+        this.elems.left.addClass('active');
+      }
+    } else {
+      $([this.elems.left[0], this.elems.right[0]]).removeClass('active');
+    }
+  }
+
+  description() {
+    var that = this;
+    this.elems.description.html(that.settings.images[that.settings.currentImage].title);
+  }
+
+  pagination() {
+    var that = this;
+    var last = this.settings.lastImage + 1;
+    var position = this.settings.currentImage + 1;
+    this.elems.pagination.html(position + ' ' + that.settings.separator2 + last);
+  }
+
+  storeImgSize(img, i) {
+    if (typeof img === 'undefined') {
+      return;
+    }
+
+    if (!this.settings.images[i].height || !this.settings.images[i].width) {
+      this.settings.images[i].height = img.height;
+      this.settings.images[i].width = img.width;
+    }
+  }
+
+  close() {
+    if (this.settings.fullscreenOpen) {
+      this.exitFullScreen();
+      return;
+    }
+
+    var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
+    var that = this;
+    var def = $.when($(els).fadeOut(200)).done(function () {
+      that.elems.domContainer.removeClass('chocolat-open');
+    });
+    this.settings.currentImage = false;
+    return def;
+  }
+
+  destroy() {
+    this.element.removeData();
+    this.element.find(this.settings.imageSelector).off('click.chocolat');
+
+    if (!this.settings.initialized) {
+      return;
+    }
+
+    if (this.settings.fullscreenOpen) {
+      this.exitFullScreen();
+    }
+
+    this.settings.currentImage = false;
+    this.settings.initialized = false;
+    this.elems.domContainer.removeClass(this._cssClasses.join(' '));
+    this.elems.wrapper.remove();
+  }
+
+  getOutMarginW() {
+    var left = this.elems.left.outerWidth(true);
+    var right = this.elems.right.outerWidth(true);
+    return left + right;
+  }
+
+  getOutMarginH() {
+    return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true);
+  }
+
+  markup() {
+    this.elems.domContainer.addClass('chocolat-open ' + this.settings.className);
+
+    if (this.settings.imageSize == 'cover') {
+      this.elems.domContainer.addClass('chocolat-cover');
+    }
+
+    if (this.settings.container !== window) {
+      this.elems.domContainer.addClass('chocolat-in-container');
+    }
+
+    this.elems.wrapper = $('<div/>', {
+      class: 'chocolat-wrapper',
+      id: 'chocolat-content-' + this.settings.setIndex
+    }).appendTo(this.elems.domContainer);
+    this.elems.overlay = $('<div/>', {
+      class: 'chocolat-overlay'
+    }).appendTo(this.elems.wrapper);
+    this.elems.loader = $('<div/>', {
+      class: 'chocolat-loader'
+    }).appendTo(this.elems.wrapper);
+    this.elems.content = $('<div/>', {
+      class: 'chocolat-content'
+    }).appendTo(this.elems.wrapper);
+    this.elems.img = $('<img/>', {
+      class: 'chocolat-img',
+      src: ''
+    }).appendTo(this.elems.content);
+    this.elems.top = $('<div/>', {
+      class: 'chocolat-top'
+    }).appendTo(this.elems.wrapper);
+    this.elems.left = $('<div/>', {
+      class: 'chocolat-left'
+    }).appendTo(this.elems.wrapper);
+    this.elems.right = $('<div/>', {
+      class: 'chocolat-right'
+    }).appendTo(this.elems.wrapper);
+    this.elems.bottom = $('<div/>', {
+      class: 'chocolat-bottom'
+    }).appendTo(this.elems.wrapper);
+    this.elems.close = $('<span/>', {
+      class: 'chocolat-close'
+    }).appendTo(this.elems.top);
+    this.elems.fullscreen = $('<span/>', {
+      class: 'chocolat-fullscreen'
+    }).appendTo(this.elems.bottom);
+    this.elems.description = $('<span/>', {
+      class: 'chocolat-description'
+    }).appendTo(this.elems.bottom);
+    this.elems.pagination = $('<span/>', {
+      class: 'chocolat-pagination'
+    }).appendTo(this.elems.bottom);
+    this.elems.setTitle = $('<span/>', {
+      class: 'chocolat-set-title',
+      html: this.settings.setTitle
+    }).appendTo(this.elems.bottom);
+    this.settings.afterMarkup.call(this);
+  }
+
+  openFullScreen() {
+    var wrapper = this.elems.wrapper[0];
+
+    if (wrapper.requestFullscreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.requestFullscreen();
+    } else if (wrapper.mozRequestFullScreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.mozRequestFullScreen();
+    } else if (wrapper.webkitRequestFullscreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.webkitRequestFullscreen();
+    } else if (wrapper.msRequestFullscreen) {
+      wrapper.msRequestFullscreen();
+      this.settings.fullscreenOpen = true;
+    } else {
+      this.settings.fullscreenOpen = false;
+    }
+  }
+
+  exitFullScreen() {
+    if (document.exitFullscreen) {
+      document.exitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.mozCancelFullScreen) {
+      document.mozCancelFullScreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.webkitExitFullscreen) {
+      document.webkitExitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.msExitFullscreen) {
+      document.msExitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else {
+      this.settings.fullscreenOpen = true;
+    }
+  }
+
+  events() {
+    var that = this;
+    $(document).off('keydown.chocolat').on('keydown.chocolat', function (e) {
+      if (that.settings.initialized) {
+        if (e.keyCode == 37) {
+          that.change(-1);
+        } else if (e.keyCode == 39) {
+          that.change(1);
+        } else if (e.keyCode == 27) {
+          that.close();
+        }
+      }
+    }); // this.elems.wrapper.find('.chocolat-img')
+    //     .off('click.chocolat')
+    //     .on('click.chocolat', function(e) {
+    //         var currentImage = that.settings.images[that.settings.currentImage];
+    //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
+    //             that.toggleZoom(e);
+    //         }
+    // });
+
+    this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', function () {
+      that.change(+1);
+    });
+    this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', function () {
+      return that.change(-1);
+    });
+    $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', function () {
+      return that.close();
+    });
+    this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function () {
+      if (that.settings.fullscreenOpen) {
+        that.exitFullScreen();
+        return;
+      }
+
+      that.openFullScreen();
+    });
+
+    if (that.settings.backgroundClose) {
+      this.elems.overlay.off('click.chocolat').on('click.chocolat', function () {
+        return that.close();
+      });
+    }
+
+    this.elems.wrapper.off('click.chocolat').on('click.chocolat', function (e) {
+      return that.zoomOut(e);
+    });
+    this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', function (e) {
+      if (that.settings.initialZoomState === null && that.elems.domContainer.hasClass('chocolat-zoomable')) {
+        e.stopPropagation();
+        return that.zoomIn(e);
+      }
+    });
+    this.elems.wrapper.mousemove(function (e) {
+      if (that.settings.initialZoomState === null) {
+        return;
+      }
+
+      if (that.elems.img.is(':animated')) {
+        return;
+      }
+
+      var pos = $(this).offset();
+      var height = $(this).height();
+      var width = $(this).width();
+      var currentImage = that.settings.images[that.settings.currentImage];
+      var imgWidth = currentImage.width;
+      var imgHeight = currentImage.height;
+      var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
+      var mvtX = 0;
+
+      if (imgWidth > width) {
+        var paddingX = that.settings.zoomedPaddingX(imgWidth, width);
+        mvtX = coord[0] / (width / 2);
+        mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
+      }
+
+      var mvtY = 0;
+
+      if (imgHeight > height) {
+        var paddingY = that.settings.zoomedPaddingY(imgHeight, height);
+        mvtY = coord[1] / (height / 2);
+        mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
+      }
+
+      var animation = {
+        'margin-left': -mvtX + 'px',
+        'margin-top': -mvtY + 'px'
+      };
+
+      if (typeof e.duration !== 'undefined') {
+        $(that.elems.img).stop(false, true).animate(animation, e.duration);
+      } else {
+        $(that.elems.img).stop(false, true).css(animation);
+      }
+    });
+    $(window).on('resize', function () {
+      if (!that.settings.initialized || that.settings.currentImage === false) {
+        return;
+      }
+
+      that.debounce(50, function () {
+        var fitting = that.fit(that.settings.currentImage, that.elems.wrapper);
+        that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+        that.zoomable();
+      });
+    });
+  }
+
+  zoomable() {
+    var currentImage = this.settings.images[this.settings.currentImage];
+    var wrapperWidth = this.elems.wrapper.width();
+    var wrapperHeight = this.elems.wrapper.height();
+    var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
+    var isImageStretched = this.elems.img.width() > currentImage.width || this.elems.img.height() > currentImage.height;
+
+    if (isImageZoomable && !isImageStretched) {
+      this.elems.domContainer.addClass('chocolat-zoomable');
+    } else {
+      this.elems.domContainer.removeClass('chocolat-zoomable');
+    }
+  }
+
+  zoomIn(e) {
+    this.settings.initialZoomState = this.settings.imageSize;
+    this.settings.imageSize = 'native';
+    var event = $.Event('mousemove');
+    event.pageX = e.pageX;
+    event.pageY = e.pageY;
+    event.duration = this.settings.duration;
+    this.elems.wrapper.trigger(event);
+    this.elems.domContainer.addClass('chocolat-zoomed');
+    var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, this.settings.duration);
+  }
+
+  zoomOut(e, duration) {
+    if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
+      return;
+    }
+
+    duration = duration || this.settings.duration;
+    this.settings.imageSize = this.settings.initialZoomState;
+    this.settings.initialZoomState = null;
+    this.elems.img.animate({
+      margin: 0
+    }, duration);
+    this.elems.domContainer.removeClass('chocolat-zoomed');
+    var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration);
+  }
+
+  setDomContainer() {
+    // if container == window
+    // domContainer = body
+    if (this.settings.container === window) {
+      this.elems.domContainer = $('body');
+    } else {
+      this.elems.domContainer = $(this.settings.container);
+    }
+  }
+
+  debounce(duration, callback) {
+    clearTimeout(this.settings.timerDebounce);
+    this.settings.timerDebounce = setTimeout(function () {
+      callback();
+    }, duration);
+  }
+
+  api() {
+    var that = this;
+    return {
+      open: function (i) {
+        i = parseInt(i) || 0;
+        return that.init(i);
+      },
+      close: function () {
+        return that.close();
+      },
+      next: function () {
+        return that.change(1);
+      },
+      prev: function () {
+        return that.change(-1);
+      },
+      goto: function (i) {
+        // open alias
+        return that.open(i);
+      },
+      current: function () {
+        return that.settings.currentImage;
+      },
+      place: function () {
+        return that.place(that.settings.currentImage, that.settings.duration);
+      },
+      destroy: function () {
+        return that.destroy();
+      },
+      set: function (property, value) {
+        that.settings[property] = value;
+        return value;
+      },
+      get: function (property) {
+        return that.settings[property];
+      },
+      getElem: function (name) {
+        return that.elems[name];
+      }
+    };
+  }
+
+}
+
+function main_esm (options) {
+  return this.each(function () {
+    calls++;
+    var settings = $.extend(true, {}, defaults, options, {
+      setIndex: calls
+    });
+
+    if (!$.data(this, 'chocolat')) {
+      $.data(this, 'chocolat', new Chocolat($(this), settings));
+    }
+  });
+}
+
+export default main_esm;
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
new file mode 100644
index 0000000..7a87361
--- /dev/null
+++ b/dist/js/chocolat.iife.js
@@ -0,0 +1,646 @@
+(function () {
+    'use strict';
+
+    const defaults = {
+      container: window,
+      // window or jquery object or jquery selector, or element
+      imageSelector: '.chocolat-image',
+      className: '',
+      imageSize: 'default',
+      // 'default', 'contain', 'cover' or 'native'
+      initialZoomState: null,
+      fullScreen: false,
+      loop: false,
+      linkImages: true,
+      duration: 300,
+      setTitle: '',
+      separator2: '/',
+      setIndex: 0,
+      firstImage: 0,
+      lastImage: false,
+      currentImage: false,
+      initialized: false,
+      timer: false,
+      timerDebounce: false,
+      images: [],
+      enableZoom: true,
+      imageSource: 'href',
+
+      afterInitialize() {},
+
+      afterMarkup() {},
+
+      afterImageLoad() {},
+
+      zoomedPaddingX: function (canvasWidth, imgWidth) {
+        return 0;
+      },
+      zoomedPaddingY: function (canvasHeight, imgHeight) {
+        return 0;
+      }
+    };
+    class Chocolat {
+      constructor(element, settings) {
+        var that = this;
+        this.settings = settings;
+        this.elems = {};
+        this.element = element;
+        this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
+
+        if (!this.settings.setTitle && element.data('chocolat-title')) {
+          this.settings.setTitle = element.data('chocolat-title');
+        }
+
+        this.element.find(this.settings.imageSelector).each(function () {
+          that.settings.images.push({
+            title: $(this).attr('title'),
+            src: $(this).attr(that.settings.imageSource),
+            height: false,
+            width: false
+          });
+        });
+        this.element.find(this.settings.imageSelector).each(function (i) {
+          $(this).off('click.chocolat').on('click.chocolat', function (e) {
+            that.init(i);
+            e.preventDefault();
+          });
+        });
+      }
+
+      init(i) {
+        if (!this.settings.initialized) {
+          this.setDomContainer();
+          this.markup();
+          this.events();
+          this.settings.lastImage = this.settings.images.length - 1;
+          this.settings.initialized = true;
+        }
+
+        this.settings.afterInitialize.call(this);
+        return this.load(i);
+      }
+
+      preload(i) {
+        var def = $.Deferred();
+
+        if (typeof this.settings.images[i] === 'undefined') {
+          return;
+        }
+
+        var imgLoader = new Image();
+
+        imgLoader.onload = function () {
+          def.resolve(imgLoader);
+        };
+
+        imgLoader.src = this.settings.images[i].src;
+        return def;
+      }
+
+      load(i) {
+        var that = this;
+
+        if (this.settings.fullScreen) {
+          this.openFullScreen();
+        }
+
+        if (this.settings.currentImage === i) {
+          return;
+        }
+
+        this.elems.overlay.fadeIn(this.settings.duration);
+        this.elems.wrapper.fadeIn(this.settings.duration);
+        this.elems.domContainer.addClass('chocolat-open');
+        this.settings.timer = setTimeout(function () {
+          if (typeof that.elems != 'undefined') {
+            $.proxy(that.elems.loader.fadeIn(), that);
+          }
+        }, this.settings.duration);
+        var deferred = this.preload(i).then(function (imgLoader) {
+          return that.place(i, imgLoader);
+        }).then(function (imgLoader) {
+          return that.appear(i);
+        }).then(function (imgLoader) {
+          that.zoomable();
+          that.settings.afterImageLoad.call(that);
+        });
+        var nextIndex = i + 1;
+
+        if (typeof this.settings.images[nextIndex] != 'undefined') {
+          this.preload(nextIndex);
+        }
+
+        return deferred;
+      }
+
+      place(i, imgLoader) {
+        var that = this;
+        var fitting;
+        this.settings.currentImage = i;
+        this.description();
+        this.pagination();
+        this.arrows();
+        this.storeImgSize(imgLoader, i);
+        fitting = this.fit(i, that.elems.wrapper);
+        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+      }
+
+      center(width, height, left, top, duration) {
+        return this.elems.content.css('overflow', 'visible').animate({
+          width: width,
+          height: height,
+          left: left,
+          top: top
+        }, duration).promise();
+      }
+
+      appear(i) {
+        var that = this;
+        clearTimeout(this.settings.timer);
+        this.elems.loader.stop().fadeOut(300, function () {
+          that.elems.img.attr('src', that.settings.images[i].src);
+        });
+      }
+
+      fit(i, container) {
+        var height;
+        var width;
+        var imgHeight = this.settings.images[i].height;
+        var imgWidth = this.settings.images[i].width;
+        var holderHeight = $(container).height();
+        var holderWidth = $(container).width();
+        var holderOutMarginH = this.getOutMarginH();
+        var holderOutMarginW = this.getOutMarginW();
+        var holderGlobalWidth = holderWidth - holderOutMarginW;
+        var holderGlobalHeight = holderHeight - holderOutMarginH;
+        var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
+        var holderRatio = holderHeight / holderWidth;
+        var imgRatio = imgHeight / imgWidth;
+
+        if (this.settings.imageSize == 'cover') {
+          if (imgRatio < holderRatio) {
+            height = holderHeight;
+            width = height / imgRatio;
+          } else {
+            width = holderWidth;
+            height = width * imgRatio;
+          }
+        } else if (this.settings.imageSize == 'native') {
+          height = imgHeight;
+          width = imgWidth;
+        } else {
+          if (imgRatio > holderGlobalRatio) {
+            height = holderGlobalHeight;
+            width = height / imgRatio;
+          } else {
+            width = holderGlobalWidth;
+            height = width * imgRatio;
+          }
+
+          if (this.settings.imageSize === 'default' && (width >= imgWidth || height >= imgHeight)) {
+            width = imgWidth;
+            height = imgHeight;
+          }
+        }
+
+        return {
+          height: height,
+          width: width,
+          top: (holderHeight - height) / 2,
+          left: (holderWidth - width) / 2
+        };
+      }
+
+      change(signe) {
+        this.zoomOut(0);
+        this.zoomable();
+        var requestedImage = this.settings.currentImage + parseInt(signe);
+
+        if (requestedImage > this.settings.lastImage) {
+          if (this.settings.loop) {
+            return this.load(0);
+          }
+        } else if (requestedImage < 0) {
+          if (this.settings.loop) {
+            return this.load(this.settings.lastImage);
+          }
+        } else {
+          return this.load(requestedImage);
+        }
+      }
+
+      arrows() {
+        if (this.settings.loop) {
+          $([this.elems.left[0], this.elems.right[0]]).addClass('active');
+        } else if (this.settings.linkImages) {
+          // right
+          if (this.settings.currentImage == this.settings.lastImage) {
+            this.elems.right.removeClass('active');
+          } else {
+            this.elems.right.addClass('active');
+          } // left
+
+
+          if (this.settings.currentImage === 0) {
+            this.elems.left.removeClass('active');
+          } else {
+            this.elems.left.addClass('active');
+          }
+        } else {
+          $([this.elems.left[0], this.elems.right[0]]).removeClass('active');
+        }
+      }
+
+      description() {
+        var that = this;
+        this.elems.description.html(that.settings.images[that.settings.currentImage].title);
+      }
+
+      pagination() {
+        var that = this;
+        var last = this.settings.lastImage + 1;
+        var position = this.settings.currentImage + 1;
+        this.elems.pagination.html(position + ' ' + that.settings.separator2 + last);
+      }
+
+      storeImgSize(img, i) {
+        if (typeof img === 'undefined') {
+          return;
+        }
+
+        if (!this.settings.images[i].height || !this.settings.images[i].width) {
+          this.settings.images[i].height = img.height;
+          this.settings.images[i].width = img.width;
+        }
+      }
+
+      close() {
+        if (this.settings.fullscreenOpen) {
+          this.exitFullScreen();
+          return;
+        }
+
+        var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
+        var that = this;
+        var def = $.when($(els).fadeOut(200)).done(function () {
+          that.elems.domContainer.removeClass('chocolat-open');
+        });
+        this.settings.currentImage = false;
+        return def;
+      }
+
+      destroy() {
+        this.element.removeData();
+        this.element.find(this.settings.imageSelector).off('click.chocolat');
+
+        if (!this.settings.initialized) {
+          return;
+        }
+
+        if (this.settings.fullscreenOpen) {
+          this.exitFullScreen();
+        }
+
+        this.settings.currentImage = false;
+        this.settings.initialized = false;
+        this.elems.domContainer.removeClass(this._cssClasses.join(' '));
+        this.elems.wrapper.remove();
+      }
+
+      getOutMarginW() {
+        var left = this.elems.left.outerWidth(true);
+        var right = this.elems.right.outerWidth(true);
+        return left + right;
+      }
+
+      getOutMarginH() {
+        return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true);
+      }
+
+      markup() {
+        this.elems.domContainer.addClass('chocolat-open ' + this.settings.className);
+
+        if (this.settings.imageSize == 'cover') {
+          this.elems.domContainer.addClass('chocolat-cover');
+        }
+
+        if (this.settings.container !== window) {
+          this.elems.domContainer.addClass('chocolat-in-container');
+        }
+
+        this.elems.wrapper = $('<div/>', {
+          class: 'chocolat-wrapper',
+          id: 'chocolat-content-' + this.settings.setIndex
+        }).appendTo(this.elems.domContainer);
+        this.elems.overlay = $('<div/>', {
+          class: 'chocolat-overlay'
+        }).appendTo(this.elems.wrapper);
+        this.elems.loader = $('<div/>', {
+          class: 'chocolat-loader'
+        }).appendTo(this.elems.wrapper);
+        this.elems.content = $('<div/>', {
+          class: 'chocolat-content'
+        }).appendTo(this.elems.wrapper);
+        this.elems.img = $('<img/>', {
+          class: 'chocolat-img',
+          src: ''
+        }).appendTo(this.elems.content);
+        this.elems.top = $('<div/>', {
+          class: 'chocolat-top'
+        }).appendTo(this.elems.wrapper);
+        this.elems.left = $('<div/>', {
+          class: 'chocolat-left'
+        }).appendTo(this.elems.wrapper);
+        this.elems.right = $('<div/>', {
+          class: 'chocolat-right'
+        }).appendTo(this.elems.wrapper);
+        this.elems.bottom = $('<div/>', {
+          class: 'chocolat-bottom'
+        }).appendTo(this.elems.wrapper);
+        this.elems.close = $('<span/>', {
+          class: 'chocolat-close'
+        }).appendTo(this.elems.top);
+        this.elems.fullscreen = $('<span/>', {
+          class: 'chocolat-fullscreen'
+        }).appendTo(this.elems.bottom);
+        this.elems.description = $('<span/>', {
+          class: 'chocolat-description'
+        }).appendTo(this.elems.bottom);
+        this.elems.pagination = $('<span/>', {
+          class: 'chocolat-pagination'
+        }).appendTo(this.elems.bottom);
+        this.elems.setTitle = $('<span/>', {
+          class: 'chocolat-set-title',
+          html: this.settings.setTitle
+        }).appendTo(this.elems.bottom);
+        this.settings.afterMarkup.call(this);
+      }
+
+      openFullScreen() {
+        var wrapper = this.elems.wrapper[0];
+
+        if (wrapper.requestFullscreen) {
+          this.settings.fullscreenOpen = true;
+          wrapper.requestFullscreen();
+        } else if (wrapper.mozRequestFullScreen) {
+          this.settings.fullscreenOpen = true;
+          wrapper.mozRequestFullScreen();
+        } else if (wrapper.webkitRequestFullscreen) {
+          this.settings.fullscreenOpen = true;
+          wrapper.webkitRequestFullscreen();
+        } else if (wrapper.msRequestFullscreen) {
+          wrapper.msRequestFullscreen();
+          this.settings.fullscreenOpen = true;
+        } else {
+          this.settings.fullscreenOpen = false;
+        }
+      }
+
+      exitFullScreen() {
+        if (document.exitFullscreen) {
+          document.exitFullscreen();
+          this.settings.fullscreenOpen = false;
+        } else if (document.mozCancelFullScreen) {
+          document.mozCancelFullScreen();
+          this.settings.fullscreenOpen = false;
+        } else if (document.webkitExitFullscreen) {
+          document.webkitExitFullscreen();
+          this.settings.fullscreenOpen = false;
+        } else if (document.msExitFullscreen) {
+          document.msExitFullscreen();
+          this.settings.fullscreenOpen = false;
+        } else {
+          this.settings.fullscreenOpen = true;
+        }
+      }
+
+      events() {
+        var that = this;
+        $(document).off('keydown.chocolat').on('keydown.chocolat', function (e) {
+          if (that.settings.initialized) {
+            if (e.keyCode == 37) {
+              that.change(-1);
+            } else if (e.keyCode == 39) {
+              that.change(1);
+            } else if (e.keyCode == 27) {
+              that.close();
+            }
+          }
+        }); // this.elems.wrapper.find('.chocolat-img')
+        //     .off('click.chocolat')
+        //     .on('click.chocolat', function(e) {
+        //         var currentImage = that.settings.images[that.settings.currentImage];
+        //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
+        //             that.toggleZoom(e);
+        //         }
+        // });
+
+        this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', function () {
+          that.change(+1);
+        });
+        this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', function () {
+          return that.change(-1);
+        });
+        $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', function () {
+          return that.close();
+        });
+        this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function () {
+          if (that.settings.fullscreenOpen) {
+            that.exitFullScreen();
+            return;
+          }
+
+          that.openFullScreen();
+        });
+
+        if (that.settings.backgroundClose) {
+          this.elems.overlay.off('click.chocolat').on('click.chocolat', function () {
+            return that.close();
+          });
+        }
+
+        this.elems.wrapper.off('click.chocolat').on('click.chocolat', function (e) {
+          return that.zoomOut(e);
+        });
+        this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', function (e) {
+          if (that.settings.initialZoomState === null && that.elems.domContainer.hasClass('chocolat-zoomable')) {
+            e.stopPropagation();
+            return that.zoomIn(e);
+          }
+        });
+        this.elems.wrapper.mousemove(function (e) {
+          if (that.settings.initialZoomState === null) {
+            return;
+          }
+
+          if (that.elems.img.is(':animated')) {
+            return;
+          }
+
+          var pos = $(this).offset();
+          var height = $(this).height();
+          var width = $(this).width();
+          var currentImage = that.settings.images[that.settings.currentImage];
+          var imgWidth = currentImage.width;
+          var imgHeight = currentImage.height;
+          var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
+          var mvtX = 0;
+
+          if (imgWidth > width) {
+            var paddingX = that.settings.zoomedPaddingX(imgWidth, width);
+            mvtX = coord[0] / (width / 2);
+            mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
+          }
+
+          var mvtY = 0;
+
+          if (imgHeight > height) {
+            var paddingY = that.settings.zoomedPaddingY(imgHeight, height);
+            mvtY = coord[1] / (height / 2);
+            mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
+          }
+
+          var animation = {
+            'margin-left': -mvtX + 'px',
+            'margin-top': -mvtY + 'px'
+          };
+
+          if (typeof e.duration !== 'undefined') {
+            $(that.elems.img).stop(false, true).animate(animation, e.duration);
+          } else {
+            $(that.elems.img).stop(false, true).css(animation);
+          }
+        });
+        $(window).on('resize', function () {
+          if (!that.settings.initialized || that.settings.currentImage === false) {
+            return;
+          }
+
+          that.debounce(50, function () {
+            var fitting = that.fit(that.settings.currentImage, that.elems.wrapper);
+            that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+            that.zoomable();
+          });
+        });
+      }
+
+      zoomable() {
+        var currentImage = this.settings.images[this.settings.currentImage];
+        var wrapperWidth = this.elems.wrapper.width();
+        var wrapperHeight = this.elems.wrapper.height();
+        var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
+        var isImageStretched = this.elems.img.width() > currentImage.width || this.elems.img.height() > currentImage.height;
+
+        if (isImageZoomable && !isImageStretched) {
+          this.elems.domContainer.addClass('chocolat-zoomable');
+        } else {
+          this.elems.domContainer.removeClass('chocolat-zoomable');
+        }
+      }
+
+      zoomIn(e) {
+        this.settings.initialZoomState = this.settings.imageSize;
+        this.settings.imageSize = 'native';
+        var event = $.Event('mousemove');
+        event.pageX = e.pageX;
+        event.pageY = e.pageY;
+        event.duration = this.settings.duration;
+        this.elems.wrapper.trigger(event);
+        this.elems.domContainer.addClass('chocolat-zoomed');
+        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, this.settings.duration);
+      }
+
+      zoomOut(e, duration) {
+        if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
+          return;
+        }
+
+        duration = duration || this.settings.duration;
+        this.settings.imageSize = this.settings.initialZoomState;
+        this.settings.initialZoomState = null;
+        this.elems.img.animate({
+          margin: 0
+        }, duration);
+        this.elems.domContainer.removeClass('chocolat-zoomed');
+        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration);
+      }
+
+      setDomContainer() {
+        // if container == window
+        // domContainer = body
+        if (this.settings.container === window) {
+          this.elems.domContainer = $('body');
+        } else {
+          this.elems.domContainer = $(this.settings.container);
+        }
+      }
+
+      debounce(duration, callback) {
+        clearTimeout(this.settings.timerDebounce);
+        this.settings.timerDebounce = setTimeout(function () {
+          callback();
+        }, duration);
+      }
+
+      api() {
+        var that = this;
+        return {
+          open: function (i) {
+            i = parseInt(i) || 0;
+            return that.init(i);
+          },
+          close: function () {
+            return that.close();
+          },
+          next: function () {
+            return that.change(1);
+          },
+          prev: function () {
+            return that.change(-1);
+          },
+          goto: function (i) {
+            // open alias
+            return that.open(i);
+          },
+          current: function () {
+            return that.settings.currentImage;
+          },
+          place: function () {
+            return that.place(that.settings.currentImage, that.settings.duration);
+          },
+          destroy: function () {
+            return that.destroy();
+          },
+          set: function (property, value) {
+            that.settings[property] = value;
+            return value;
+          },
+          get: function (property) {
+            return that.settings[property];
+          },
+          getElem: function (name) {
+            return that.elems[name];
+          }
+        };
+      }
+
+    }
+
+    let calls = 0;
+
+    $.fn.Chocolat = function (options) {
+      return this.each(function () {
+        calls++;
+        var settings = $.extend(true, {}, defaults, options, {
+          setIndex: calls
+        });
+
+        if (!$.data(this, 'chocolat')) {
+          $.data(this, 'chocolat', new Chocolat($(this), settings));
+        }
+      });
+    };
+
+}());
diff --git a/dist/js/jquery.chocolat.js b/dist/js/jquery.chocolat.js
deleted file mode 100644
index e0caa74..0000000
--- a/dist/js/jquery.chocolat.js
+++ /dev/null
@@ -1,730 +0,0 @@
-;(function(factory) {
-    if (typeof module === 'object' && typeof module.exports === 'object') {
-        module.exports = factory(require('jquery'), window, document)
-    } else {
-        factory(jQuery, window, document)
-    }
-})(function($, window, document, undefined) {
-    var calls = 0
-
-    function Chocolat(element, settings) {
-        var that = this
-
-        this.settings = settings
-        this.elems = {}
-        this.element = element
-
-        this._cssClasses = [
-            'chocolat-open',
-            'chocolat-in-container',
-            'chocolat-cover',
-            'chocolat-zoomable',
-            'chocolat-zoomed',
-        ]
-
-        if (!this.settings.setTitle && element.data('chocolat-title')) {
-            this.settings.setTitle = element.data('chocolat-title')
-        }
-
-        this.element.find(this.settings.imageSelector).each(function() {
-            that.settings.images.push({
-                title: $(this).attr('title'),
-                src: $(this).attr(that.settings.imageSource),
-                height: false,
-                width: false,
-            })
-        })
-
-        this.element.find(this.settings.imageSelector).each(function(i) {
-            $(this)
-                .off('click.chocolat')
-                .on('click.chocolat', function(e) {
-                    that.init(i)
-                    e.preventDefault()
-                })
-        })
-
-        return this
-    }
-
-    $.extend(Chocolat.prototype, {
-        init: function(i) {
-            if (!this.settings.initialized) {
-                this.setDomContainer()
-                this.markup()
-                this.events()
-                this.settings.lastImage = this.settings.images.length - 1
-                this.settings.initialized = true
-            }
-
-            this.settings.afterInitialize.call(this)
-
-            return this.load(i)
-        },
-
-        preload: function(i) {
-            var def = $.Deferred()
-
-            if (typeof this.settings.images[i] === 'undefined') {
-                return
-            }
-            var imgLoader = new Image()
-            imgLoader.onload = function() {
-                def.resolve(imgLoader)
-            }
-            imgLoader.src = this.settings.images[i].src
-
-            return def
-        },
-
-        load: function(i) {
-            var that = this
-            if (this.settings.fullScreen) {
-                this.openFullScreen()
-            }
-
-            if (this.settings.currentImage === i) {
-                return
-            }
-
-            this.elems.overlay.fadeIn(this.settings.duration)
-            this.elems.wrapper.fadeIn(this.settings.duration)
-            this.elems.domContainer.addClass('chocolat-open')
-
-            this.settings.timer = setTimeout(function() {
-                if (typeof that.elems != 'undefined') {
-                    $.proxy(that.elems.loader.fadeIn(), that)
-                }
-            }, this.settings.duration)
-
-            var deferred = this.preload(i)
-                .then(function(imgLoader) {
-                    return that.place(i, imgLoader)
-                })
-                .then(function(imgLoader) {
-                    return that.appear(i)
-                })
-                .then(function(imgLoader) {
-                    that.zoomable()
-                    that.settings.afterImageLoad.call(that)
-                })
-
-            var nextIndex = i + 1
-            if (typeof this.settings.images[nextIndex] != 'undefined') {
-                this.preload(nextIndex)
-            }
-
-            return deferred
-        },
-
-        place: function(i, imgLoader) {
-            var that = this
-            var fitting
-
-            this.settings.currentImage = i
-            this.description()
-            this.pagination()
-            this.arrows()
-
-            this.storeImgSize(imgLoader, i)
-            fitting = this.fit(i, that.elems.wrapper)
-
-            return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
-        },
-
-        center: function(width, height, left, top, duration) {
-            return this.elems.content
-                .css('overflow', 'visible')
-                .animate(
-                    {
-                        width: width,
-                        height: height,
-                        left: left,
-                        top: top,
-                    },
-                    duration
-                )
-                .promise()
-        },
-
-        appear: function(i) {
-            var that = this
-            clearTimeout(this.settings.timer)
-
-            this.elems.loader.stop().fadeOut(300, function() {
-                that.elems.img.attr('src', that.settings.images[i].src)
-            })
-        },
-
-        fit: function(i, container) {
-            var height
-            var width
-
-            var imgHeight = this.settings.images[i].height
-            var imgWidth = this.settings.images[i].width
-            var holderHeight = $(container).height()
-            var holderWidth = $(container).width()
-            var holderOutMarginH = this.getOutMarginH()
-            var holderOutMarginW = this.getOutMarginW()
-
-            var holderGlobalWidth = holderWidth - holderOutMarginW
-            var holderGlobalHeight = holderHeight - holderOutMarginH
-            var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth
-            var holderRatio = holderHeight / holderWidth
-            var imgRatio = imgHeight / imgWidth
-
-            if (this.settings.imageSize == 'cover') {
-                if (imgRatio < holderRatio) {
-                    height = holderHeight
-                    width = height / imgRatio
-                } else {
-                    width = holderWidth
-                    height = width * imgRatio
-                }
-            } else if (this.settings.imageSize == 'native') {
-                height = imgHeight
-                width = imgWidth
-            } else {
-                if (imgRatio > holderGlobalRatio) {
-                    height = holderGlobalHeight
-                    width = height / imgRatio
-                } else {
-                    width = holderGlobalWidth
-                    height = width * imgRatio
-                }
-                if (
-                    this.settings.imageSize === 'default' &&
-                    (width >= imgWidth || height >= imgHeight)
-                ) {
-                    width = imgWidth
-                    height = imgHeight
-                }
-            }
-
-            return {
-                height: height,
-                width: width,
-                top: (holderHeight - height) / 2,
-                left: (holderWidth - width) / 2,
-            }
-        },
-
-        change: function(signe) {
-            this.zoomOut(0)
-            this.zoomable()
-
-            var requestedImage = this.settings.currentImage + parseInt(signe)
-            if (requestedImage > this.settings.lastImage) {
-                if (this.settings.loop) {
-                    return this.load(0)
-                }
-            } else if (requestedImage < 0) {
-                if (this.settings.loop) {
-                    return this.load(this.settings.lastImage)
-                }
-            } else {
-                return this.load(requestedImage)
-            }
-        },
-
-        arrows: function() {
-            if (this.settings.loop) {
-                $([this.elems.left[0], this.elems.right[0]]).addClass('active')
-            } else if (this.settings.linkImages) {
-                // right
-                if (this.settings.currentImage == this.settings.lastImage) {
-                    this.elems.right.removeClass('active')
-                } else {
-                    this.elems.right.addClass('active')
-                }
-                // left
-                if (this.settings.currentImage === 0) {
-                    this.elems.left.removeClass('active')
-                } else {
-                    this.elems.left.addClass('active')
-                }
-            } else {
-                $([this.elems.left[0], this.elems.right[0]]).removeClass('active')
-            }
-        },
-
-        description: function() {
-            var that = this
-            this.elems.description.html(that.settings.images[that.settings.currentImage].title)
-        },
-
-        pagination: function() {
-            var that = this
-            var last = this.settings.lastImage + 1
-            var position = this.settings.currentImage + 1
-
-            this.elems.pagination.html(position + ' ' + that.settings.separator2 + last)
-        },
-
-        storeImgSize: function(img, i) {
-            if (typeof img === 'undefined') {
-                return
-            }
-            if (!this.settings.images[i].height || !this.settings.images[i].width) {
-                this.settings.images[i].height = img.height
-                this.settings.images[i].width = img.width
-            }
-        },
-
-        close: function() {
-            if (this.settings.fullscreenOpen) {
-                this.exitFullScreen()
-                return
-            }
-
-            var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]]
-            var that = this
-            var def = $.when($(els).fadeOut(200)).done(function() {
-                that.elems.domContainer.removeClass('chocolat-open')
-            })
-            this.settings.currentImage = false
-
-            return def
-        },
-
-        destroy: function() {
-            this.element.removeData()
-            this.element.find(this.settings.imageSelector).off('click.chocolat')
-
-            if (!this.settings.initialized) {
-                return
-            }
-            if (this.settings.fullscreenOpen) {
-                this.exitFullScreen()
-            }
-            this.settings.currentImage = false
-            this.settings.initialized = false
-            this.elems.domContainer.removeClass(this._cssClasses.join(' '))
-            this.elems.wrapper.remove()
-        },
-
-        getOutMarginW: function() {
-            var left = this.elems.left.outerWidth(true)
-            var right = this.elems.right.outerWidth(true)
-            return left + right
-        },
-
-        getOutMarginH: function() {
-            return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true)
-        },
-
-        markup: function() {
-            this.elems.domContainer.addClass('chocolat-open ' + this.settings.className)
-            if (this.settings.imageSize == 'cover') {
-                this.elems.domContainer.addClass('chocolat-cover')
-            }
-            if (this.settings.container !== window) {
-                this.elems.domContainer.addClass('chocolat-in-container')
-            }
-
-            this.elems.wrapper = $('<div/>', {
-                class: 'chocolat-wrapper',
-                id: 'chocolat-content-' + this.settings.setIndex,
-            }).appendTo(this.elems.domContainer)
-
-            this.elems.overlay = $('<div/>', {
-                class: 'chocolat-overlay',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.loader = $('<div/>', {
-                class: 'chocolat-loader',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.content = $('<div/>', {
-                class: 'chocolat-content',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.img = $('<img/>', {
-                class: 'chocolat-img',
-                src: '',
-            }).appendTo(this.elems.content)
-
-            this.elems.top = $('<div/>', {
-                class: 'chocolat-top',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.left = $('<div/>', {
-                class: 'chocolat-left',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.right = $('<div/>', {
-                class: 'chocolat-right',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.bottom = $('<div/>', {
-                class: 'chocolat-bottom',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.close = $('<span/>', {
-                class: 'chocolat-close',
-            }).appendTo(this.elems.top)
-
-            this.elems.fullscreen = $('<span/>', {
-                class: 'chocolat-fullscreen',
-            }).appendTo(this.elems.bottom)
-
-            this.elems.description = $('<span/>', {
-                class: 'chocolat-description',
-            }).appendTo(this.elems.bottom)
-
-            this.elems.pagination = $('<span/>', {
-                class: 'chocolat-pagination',
-            }).appendTo(this.elems.bottom)
-
-            this.elems.setTitle = $('<span/>', {
-                class: 'chocolat-set-title',
-                html: this.settings.setTitle,
-            }).appendTo(this.elems.bottom)
-
-            this.settings.afterMarkup.call(this)
-        },
-
-        openFullScreen: function() {
-            var wrapper = this.elems.wrapper[0]
-
-            if (wrapper.requestFullscreen) {
-                this.settings.fullscreenOpen = true
-                wrapper.requestFullscreen()
-            } else if (wrapper.mozRequestFullScreen) {
-                this.settings.fullscreenOpen = true
-                wrapper.mozRequestFullScreen()
-            } else if (wrapper.webkitRequestFullscreen) {
-                this.settings.fullscreenOpen = true
-                wrapper.webkitRequestFullscreen()
-            } else if (wrapper.msRequestFullscreen) {
-                wrapper.msRequestFullscreen()
-                this.settings.fullscreenOpen = true
-            } else {
-                this.settings.fullscreenOpen = false
-            }
-        },
-
-        exitFullScreen: function() {
-            if (document.exitFullscreen) {
-                document.exitFullscreen()
-                this.settings.fullscreenOpen = false
-            } else if (document.mozCancelFullScreen) {
-                document.mozCancelFullScreen()
-                this.settings.fullscreenOpen = false
-            } else if (document.webkitExitFullscreen) {
-                document.webkitExitFullscreen()
-                this.settings.fullscreenOpen = false
-            } else if (document.msExitFullscreen) {
-                document.msExitFullscreen()
-                this.settings.fullscreenOpen = false
-            } else {
-                this.settings.fullscreenOpen = true
-            }
-        },
-
-        events: function() {
-            var that = this
-
-            $(document)
-                .off('keydown.chocolat')
-                .on('keydown.chocolat', function(e) {
-                    if (that.settings.initialized) {
-                        if (e.keyCode == 37) {
-                            that.change(-1)
-                        } else if (e.keyCode == 39) {
-                            that.change(1)
-                        } else if (e.keyCode == 27) {
-                            that.close()
-                        }
-                    }
-                })
-            // this.elems.wrapper.find('.chocolat-img')
-            //     .off('click.chocolat')
-            //     .on('click.chocolat', function(e) {
-            //         var currentImage = that.settings.images[that.settings.currentImage];
-            //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
-            //             that.toggleZoom(e);
-            //         }
-            // });
-
-            this.elems.wrapper
-                .find('.chocolat-right')
-                .off('click.chocolat')
-                .on('click.chocolat', function() {
-                    that.change(+1)
-                })
-
-            this.elems.wrapper
-                .find('.chocolat-left')
-                .off('click.chocolat')
-                .on('click.chocolat', function() {
-                    return that.change(-1)
-                })
-
-            $([this.elems.overlay[0], this.elems.close[0]])
-                .off('click.chocolat')
-                .on('click.chocolat', function() {
-                    return that.close()
-                })
-
-            this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function() {
-                if (that.settings.fullscreenOpen) {
-                    that.exitFullScreen()
-                    return
-                }
-
-                that.openFullScreen()
-            })
-
-            if (that.settings.backgroundClose) {
-                this.elems.overlay.off('click.chocolat').on('click.chocolat', function() {
-                    return that.close()
-                })
-            }
-            this.elems.wrapper.off('click.chocolat').on('click.chocolat', function(e) {
-                return that.zoomOut(e)
-            })
-
-            this.elems.wrapper
-                .find('.chocolat-img')
-                .off('click.chocolat')
-                .on('click.chocolat', function(e) {
-                    if (
-                        that.settings.initialZoomState === null &&
-                        that.elems.domContainer.hasClass('chocolat-zoomable')
-                    ) {
-                        e.stopPropagation()
-                        return that.zoomIn(e)
-                    }
-                })
-
-            this.elems.wrapper.mousemove(function(e) {
-                if (that.settings.initialZoomState === null) {
-                    return
-                }
-                if (that.elems.img.is(':animated')) {
-                    return
-                }
-
-                var pos = $(this).offset()
-                var height = $(this).height()
-                var width = $(this).width()
-
-                var currentImage = that.settings.images[that.settings.currentImage]
-                var imgWidth = currentImage.width
-                var imgHeight = currentImage.height
-
-                var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top]
-
-                var mvtX = 0
-                if (imgWidth > width) {
-                    var paddingX = that.settings.zoomedPaddingX(imgWidth, width)
-                    mvtX = coord[0] / (width / 2)
-                    mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX
-                }
-
-                var mvtY = 0
-                if (imgHeight > height) {
-                    var paddingY = that.settings.zoomedPaddingY(imgHeight, height)
-                    mvtY = coord[1] / (height / 2)
-                    mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY
-                }
-
-                var animation = {
-                    'margin-left': -mvtX + 'px',
-                    'margin-top': -mvtY + 'px',
-                }
-                if (typeof e.duration !== 'undefined') {
-                    $(that.elems.img)
-                        .stop(false, true)
-                        .animate(animation, e.duration)
-                } else {
-                    $(that.elems.img)
-                        .stop(false, true)
-                        .css(animation)
-                }
-            })
-            $(window).on('resize', function() {
-                if (!that.settings.initialized || that.settings.currentImage === false) {
-                    return
-                }
-                that.debounce(50, function() {
-                    var fitting = that.fit(that.settings.currentImage, that.elems.wrapper)
-                    that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
-                    that.zoomable()
-                })
-            })
-        },
-
-        zoomable: function() {
-            var currentImage = this.settings.images[this.settings.currentImage]
-            var wrapperWidth = this.elems.wrapper.width()
-            var wrapperHeight = this.elems.wrapper.height()
-
-            var isImageZoomable =
-                this.settings.enableZoom &&
-                (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight)
-                    ? true
-                    : false
-            var isImageStretched =
-                this.elems.img.width() > currentImage.width ||
-                this.elems.img.height() > currentImage.height
-
-            if (isImageZoomable && !isImageStretched) {
-                this.elems.domContainer.addClass('chocolat-zoomable')
-            } else {
-                this.elems.domContainer.removeClass('chocolat-zoomable')
-            }
-        },
-
-        zoomIn: function(e) {
-            this.settings.initialZoomState = this.settings.imageSize
-            this.settings.imageSize = 'native'
-
-            var event = $.Event('mousemove')
-            event.pageX = e.pageX
-            event.pageY = e.pageY
-            event.duration = this.settings.duration
-            this.elems.wrapper.trigger(event)
-
-            this.elems.domContainer.addClass('chocolat-zoomed')
-            var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
-            return this.center(
-                fitting.width,
-                fitting.height,
-                fitting.left,
-                fitting.top,
-                this.settings.duration
-            )
-        },
-
-        zoomOut: function(e, duration) {
-            if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
-                return
-            }
-            duration = duration || this.settings.duration
-
-            this.settings.imageSize = this.settings.initialZoomState
-            this.settings.initialZoomState = null
-            this.elems.img.animate({ margin: 0 }, duration)
-
-            this.elems.domContainer.removeClass('chocolat-zoomed')
-            var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
-            return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration)
-        },
-
-        setDomContainer: function() {
-            // if container == window
-            // domContainer = body
-            if (this.settings.container === window) {
-                this.elems.domContainer = $('body')
-            } else {
-                this.elems.domContainer = $(this.settings.container)
-            }
-        },
-
-        debounce: function(duration, callback) {
-            clearTimeout(this.settings.timerDebounce)
-            this.settings.timerDebounce = setTimeout(function() {
-                callback()
-            }, duration)
-        },
-
-        api: function() {
-            var that = this
-            return {
-                open: function(i) {
-                    i = parseInt(i) || 0
-                    return that.init(i)
-                },
-
-                close: function() {
-                    return that.close()
-                },
-
-                next: function() {
-                    return that.change(1)
-                },
-
-                prev: function() {
-                    return that.change(-1)
-                },
-
-                goto: function(i) {
-                    // open alias
-                    return that.open(i)
-                },
-                current: function() {
-                    return that.settings.currentImage
-                },
-
-                place: function() {
-                    return that.place(that.settings.currentImage, that.settings.duration)
-                },
-
-                destroy: function() {
-                    return that.destroy()
-                },
-
-                set: function(property, value) {
-                    that.settings[property] = value
-                    return value
-                },
-
-                get: function(property) {
-                    return that.settings[property]
-                },
-
-                getElem: function(name) {
-                    return that.elems[name]
-                },
-            }
-        },
-    })
-
-    var defaults = {
-        container: window, // window or jquery object or jquery selector, or element
-        imageSelector: '.chocolat-image',
-        className: '',
-        imageSize: 'default', // 'default', 'contain', 'cover' or 'native'
-        initialZoomState: null,
-        fullScreen: false,
-        loop: false,
-        linkImages: true,
-        duration: 300,
-        setTitle: '',
-        separator2: '/',
-        setIndex: 0,
-        firstImage: 0,
-        lastImage: false,
-        currentImage: false,
-        initialized: false,
-        timer: false,
-        timerDebounce: false,
-        images: [],
-        enableZoom: true,
-        imageSource: 'href',
-        afterInitialize: function() {},
-        afterMarkup: function() {},
-        afterImageLoad: function() {},
-        zoomedPaddingX: function(canvasWidth, imgWidth) {
-            return 0
-        },
-        zoomedPaddingY: function(canvasHeight, imgHeight) {
-            return 0
-        },
-    }
-
-    $.fn.Chocolat = function(options) {
-        return this.each(function() {
-            calls++
-            var settings = $.extend(true, {}, defaults, options, { setIndex: calls })
-
-            if (!$.data(this, 'chocolat')) {
-                $.data(this, 'chocolat', new Chocolat($(this), settings))
-            }
-        })
-    }
-
-    return $.fn.Chocolat
-})
diff --git a/dist/js/jquery.chocolat.min.js b/dist/js/jquery.chocolat.min.js
deleted file mode 100644
index bc422f7..0000000
--- a/dist/js/jquery.chocolat.min.js
+++ /dev/null
@@ -1 +0,0 @@
-!function(t){"object"==typeof module&&"object"==typeof module.exports?module.exports=t(require("jquery"),window,document):t(jQuery,window,document)}(function(t,e,i,s){function n(e,i){var s=this;return this.settings=i,this.elems={},this.element=e,this._cssClasses=["chocolat-open","chocolat-in-container","chocolat-cover","chocolat-zoomable","chocolat-zoomed"],!this.settings.setTitle&&e.data("chocolat-title")&&(this.settings.setTitle=e.data("chocolat-title")),this.element.find(this.settings.imageSelector).each(function(){s.settings.images.push({title:t(this).attr("title"),src:t(this).attr(s.settings.imageSource),height:!1,width:!1})}),this.element.find(this.settings.imageSelector).each(function(e){t(this).off("click.chocolat").on("click.chocolat",function(t){s.init(e),t.preventDefault()})}),this}var o=0;t.extend(n.prototype,{init:function(t){return this.settings.initialized||(this.setDomContainer(),this.markup(),this.events(),this.settings.lastImage=this.settings.images.length-1,this.settings.initialized=!0),this.settings.afterInitialize.call(this),this.load(t)},preload:function(e){var i=t.Deferred();if("undefined"!=typeof this.settings.images[e]){var s=new Image;return s.onload=function(){i.resolve(s)},s.src=this.settings.images[e].src,i}},load:function(e){var i=this;if(this.settings.fullScreen&&this.openFullScreen(),this.settings.currentImage!==e){this.elems.overlay.fadeIn(this.settings.duration),this.elems.wrapper.fadeIn(this.settings.duration),this.elems.domContainer.addClass("chocolat-open"),this.settings.timer=setTimeout(function(){"undefined"!=typeof i.elems&&t.proxy(i.elems.loader.fadeIn(),i)},this.settings.duration);var s=this.preload(e).then(function(t){return i.place(e,t)}).then(function(t){return i.appear(e)}).then(function(t){i.zoomable(),i.settings.afterImageLoad.call(i)}),n=e+1;return"undefined"!=typeof this.settings.images[n]&&this.preload(n),s}},place:function(t,e){var i,s=this;return this.settings.currentImage=t,this.description(),this.pagination(),this.arrows(),this.storeImgSize(e,t),i=this.fit(t,s.elems.wrapper),this.center(i.width,i.height,i.left,i.top,0)},center:function(t,e,i,s,n){return this.elems.content.css("overflow","visible").animate({width:t,height:e,left:i,top:s},n).promise()},appear:function(t){var e=this;clearTimeout(this.settings.timer),this.elems.loader.stop().fadeOut(300,function(){e.elems.img.attr("src",e.settings.images[t].src)})},fit:function(e,i){var s,n,o=this.settings.images[e].height,a=this.settings.images[e].width,l=t(i).height(),r=t(i).width(),c=this.getOutMarginH(),h=this.getOutMarginW(),m=r-h,g=l-c,u=g/m,d=l/r,f=o/a;return"cover"==this.settings.imageSize?f<d?(s=l,n=s/f):(n=r,s=n*f):"native"==this.settings.imageSize?(s=o,n=a):(f>u?(s=g,n=s/f):(n=m,s=n*f),"default"===this.settings.imageSize&&(n>=a||s>=o)&&(n=a,s=o)),{height:s,width:n,top:(l-s)/2,left:(r-n)/2}},change:function(t){this.zoomOut(0),this.zoomable();var e=this.settings.currentImage+parseInt(t);if(e>this.settings.lastImage){if(this.settings.loop)return this.load(0)}else{if(!(e<0))return this.load(e);if(this.settings.loop)return this.load(this.settings.lastImage)}},arrows:function(){this.settings.loop?t([this.elems.left[0],this.elems.right[0]]).addClass("active"):this.settings.linkImages?(this.settings.currentImage==this.settings.lastImage?this.elems.right.removeClass("active"):this.elems.right.addClass("active"),0===this.settings.currentImage?this.elems.left.removeClass("active"):this.elems.left.addClass("active")):t([this.elems.left[0],this.elems.right[0]]).removeClass("active")},description:function(){var t=this;this.elems.description.html(t.settings.images[t.settings.currentImage].title)},pagination:function(){var t=this,e=this.settings.lastImage+1,i=this.settings.currentImage+1;this.elems.pagination.html(i+" "+t.settings.separator2+e)},storeImgSize:function(t,e){"undefined"!=typeof t&&(this.settings.images[e].height&&this.settings.images[e].width||(this.settings.images[e].height=t.height,this.settings.images[e].width=t.width))},close:function(){if(this.settings.fullscreenOpen)return void this.exitFullScreen();var e=[this.elems.overlay[0],this.elems.loader[0],this.elems.wrapper[0]],i=this,s=t.when(t(e).fadeOut(200)).done(function(){i.elems.domContainer.removeClass("chocolat-open")});return this.settings.currentImage=!1,s},destroy:function(){this.element.removeData(),this.element.find(this.settings.imageSelector).off("click.chocolat"),this.settings.initialized&&(this.settings.fullscreenOpen&&this.exitFullScreen(),this.settings.currentImage=!1,this.settings.initialized=!1,this.elems.domContainer.removeClass(this._cssClasses.join(" ")),this.elems.wrapper.remove())},getOutMarginW:function(){var t=this.elems.left.outerWidth(!0),e=this.elems.right.outerWidth(!0);return t+e},getOutMarginH:function(){return this.elems.top.outerHeight(!0)+this.elems.bottom.outerHeight(!0)},markup:function(){this.elems.domContainer.addClass("chocolat-open "+this.settings.className),"cover"==this.settings.imageSize&&this.elems.domContainer.addClass("chocolat-cover"),this.settings.container!==e&&this.elems.domContainer.addClass("chocolat-in-container"),this.elems.wrapper=t("<div/>",{"class":"chocolat-wrapper",id:"chocolat-content-"+this.settings.setIndex}).appendTo(this.elems.domContainer),this.elems.overlay=t("<div/>",{"class":"chocolat-overlay"}).appendTo(this.elems.wrapper),this.elems.loader=t("<div/>",{"class":"chocolat-loader"}).appendTo(this.elems.wrapper),this.elems.content=t("<div/>",{"class":"chocolat-content"}).appendTo(this.elems.wrapper),this.elems.img=t("<img/>",{"class":"chocolat-img",src:""}).appendTo(this.elems.content),this.elems.top=t("<div/>",{"class":"chocolat-top"}).appendTo(this.elems.wrapper),this.elems.left=t("<div/>",{"class":"chocolat-left"}).appendTo(this.elems.wrapper),this.elems.right=t("<div/>",{"class":"chocolat-right"}).appendTo(this.elems.wrapper),this.elems.bottom=t("<div/>",{"class":"chocolat-bottom"}).appendTo(this.elems.wrapper),this.elems.close=t("<span/>",{"class":"chocolat-close"}).appendTo(this.elems.top),this.elems.fullscreen=t("<span/>",{"class":"chocolat-fullscreen"}).appendTo(this.elems.bottom),this.elems.description=t("<span/>",{"class":"chocolat-description"}).appendTo(this.elems.bottom),this.elems.pagination=t("<span/>",{"class":"chocolat-pagination"}).appendTo(this.elems.bottom),this.elems.setTitle=t("<span/>",{"class":"chocolat-set-title",html:this.settings.setTitle}).appendTo(this.elems.bottom),this.settings.afterMarkup.call(this)},openFullScreen:function(){var t=this.elems.wrapper[0];t.requestFullscreen?(this.settings.fullscreenOpen=!0,t.requestFullscreen()):t.mozRequestFullScreen?(this.settings.fullscreenOpen=!0,t.mozRequestFullScreen()):t.webkitRequestFullscreen?(this.settings.fullscreenOpen=!0,t.webkitRequestFullscreen()):t.msRequestFullscreen?(t.msRequestFullscreen(),this.settings.fullscreenOpen=!0):this.settings.fullscreenOpen=!1},exitFullScreen:function(){i.exitFullscreen?(i.exitFullscreen(),this.settings.fullscreenOpen=!1):i.mozCancelFullScreen?(i.mozCancelFullScreen(),this.settings.fullscreenOpen=!1):i.webkitExitFullscreen?(i.webkitExitFullscreen(),this.settings.fullscreenOpen=!1):i.msExitFullscreen?(i.msExitFullscreen(),this.settings.fullscreenOpen=!1):this.settings.fullscreenOpen=!0},events:function(){var s=this;t(i).off("keydown.chocolat").on("keydown.chocolat",function(t){s.settings.initialized&&(37==t.keyCode?s.change(-1):39==t.keyCode?s.change(1):27==t.keyCode&&s.close())}),this.elems.wrapper.find(".chocolat-right").off("click.chocolat").on("click.chocolat",function(){s.change(1)}),this.elems.wrapper.find(".chocolat-left").off("click.chocolat").on("click.chocolat",function(){return s.change(-1)}),t([this.elems.overlay[0],this.elems.close[0]]).off("click.chocolat").on("click.chocolat",function(){return s.close()}),this.elems.fullscreen.off("click.chocolat").on("click.chocolat",function(){return s.settings.fullscreenOpen?void s.exitFullScreen():void s.openFullScreen()}),s.settings.backgroundClose&&this.elems.overlay.off("click.chocolat").on("click.chocolat",function(){return s.close()}),this.elems.wrapper.off("click.chocolat").on("click.chocolat",function(t){return s.zoomOut(t)}),this.elems.wrapper.find(".chocolat-img").off("click.chocolat").on("click.chocolat",function(t){if(null===s.settings.initialZoomState&&s.elems.domContainer.hasClass("chocolat-zoomable"))return t.stopPropagation(),s.zoomIn(t)}),this.elems.wrapper.mousemove(function(e){if(null!==s.settings.initialZoomState&&!s.elems.img.is(":animated")){var i=t(this).offset(),n=t(this).height(),o=t(this).width(),a=s.settings.images[s.settings.currentImage],l=a.width,r=a.height,c=[e.pageX-o/2-i.left,e.pageY-n/2-i.top],h=0;if(l>o){var m=s.settings.zoomedPaddingX(l,o);h=c[0]/(o/2),h=((l-o)/2+m)*h}var g=0;if(r>n){var u=s.settings.zoomedPaddingY(r,n);g=c[1]/(n/2),g=((r-n)/2+u)*g}var d={"margin-left":-h+"px","margin-top":-g+"px"};"undefined"!=typeof e.duration?t(s.elems.img).stop(!1,!0).animate(d,e.duration):t(s.elems.img).stop(!1,!0).css(d)}}),t(e).on("resize",function(){s.settings.initialized&&s.settings.currentImage!==!1&&s.debounce(50,function(){var t=s.fit(s.settings.currentImage,s.elems.wrapper);s.center(t.width,t.height,t.left,t.top,0),s.zoomable()})})},zoomable:function(){var t=this.settings.images[this.settings.currentImage],e=this.elems.wrapper.width(),i=this.elems.wrapper.height(),s=!(!this.settings.enableZoom||!(t.width>e||t.height>i)),n=this.elems.img.width()>t.width||this.elems.img.height()>t.height;s&&!n?this.elems.domContainer.addClass("chocolat-zoomable"):this.elems.domContainer.removeClass("chocolat-zoomable")},zoomIn:function(e){this.settings.initialZoomState=this.settings.imageSize,this.settings.imageSize="native";var i=t.Event("mousemove");i.pageX=e.pageX,i.pageY=e.pageY,i.duration=this.settings.duration,this.elems.wrapper.trigger(i),this.elems.domContainer.addClass("chocolat-zoomed");var s=this.fit(this.settings.currentImage,this.elems.wrapper);return this.center(s.width,s.height,s.left,s.top,this.settings.duration)},zoomOut:function(t,e){if(null!==this.settings.initialZoomState&&this.settings.currentImage!==!1){e=e||this.settings.duration,this.settings.imageSize=this.settings.initialZoomState,this.settings.initialZoomState=null,this.elems.img.animate({margin:0},e),this.elems.domContainer.removeClass("chocolat-zoomed");var i=this.fit(this.settings.currentImage,this.elems.wrapper);return this.center(i.width,i.height,i.left,i.top,e)}},setDomContainer:function(){this.settings.container===e?this.elems.domContainer=t("body"):this.elems.domContainer=t(this.settings.container)},debounce:function(t,e){clearTimeout(this.settings.timerDebounce),this.settings.timerDebounce=setTimeout(function(){e()},t)},api:function(){var t=this;return{open:function(e){return e=parseInt(e)||0,t.init(e)},close:function(){return t.close()},next:function(){return t.change(1)},prev:function(){return t.change(-1)},"goto":function(e){return t.open(e)},current:function(){return t.settings.currentImage},place:function(){return t.place(t.settings.currentImage,t.settings.duration)},destroy:function(){return t.destroy()},set:function(e,i){return t.settings[e]=i,i},get:function(e){return t.settings[e]},getElem:function(e){return t.elems[e]}}}});var a={container:e,imageSelector:".chocolat-image",className:"",imageSize:"default",initialZoomState:null,fullScreen:!1,loop:!1,linkImages:!0,duration:300,setTitle:"",separator2:"/",setIndex:0,firstImage:0,lastImage:!1,currentImage:!1,initialized:!1,timer:!1,timerDebounce:!1,images:[],enableZoom:!0,imageSource:"href",afterInitialize:function(){},afterMarkup:function(){},afterImageLoad:function(){},zoomedPaddingX:function(t,e){return 0},zoomedPaddingY:function(t,e){return 0}};return t.fn.Chocolat=function(e){return this.each(function(){o++;var i=t.extend(!0,{},a,e,{setIndex:o});t.data(this,"chocolat")||t.data(this,"chocolat",new n(t(this),i))})},t.fn.Chocolat});
\ No newline at end of file
diff --git a/package.json b/package.json
index d5392f7..11c975a 100644
--- a/package.json
+++ b/package.json
@@ -1,20 +1,26 @@
 {
   "name": "chocolat",
-  "version": "0.4.21",
-  "description": " Responsive jQuery Lightbox Plugin",
-  "main": "dist/js/jquery.chocolat.js",
+  "version": "0.5.0",
+  "description": "Responsive jQuery Lightbox Plugin",
+  "main": "dist/js/chocolat.cjs.js",
+  "module": "dist/js/chocolat.esm.js",
+  "browser": "dist/js/chocolat.iife.js",
   "directories": {
     "test": "test"
   },
   "scripts": {
-    "build": "gulp build",
+    "build": "rollup -c",
+    "dev": "rollup -c -w",
     "test": "./node_modules/.bin/mocha-phantomjs test/index.html",
     "prettier": "./node_modules/.bin/prettier src/js/*.js test/*.js --write"
   },
   "dependencies": {
+    "es6-promise": "^4.2.5",
     "jquery": "^3.0"
   },
   "devDependencies": {
+    "@babel/core": "^7.2.2",
+    "babel-preset-env": "^1.7.0",
     "chai": "^3.0.0",
     "gulp": "^3.9.0",
     "gulp-bump": "^0.3.1",
@@ -25,7 +31,11 @@
     "mocha-phantomjs": "3.5.3",
     "phantomjs": "^1.9.1",
     "prettier": "1.15.2",
-    "prettier-check": "^2.0.0"
+    "prettier-check": "^2.0.0",
+    "rollup": "^0.68.1",
+    "rollup-plugin-babel": "^4.1.0",
+    "rollup-plugin-commonjs": "^9.2.0",
+    "rollup-plugin-node-resolve": "^4.0.0"
   },
   "repository": {
     "type": "git",
diff --git a/rollup.config.js b/rollup.config.js
new file mode 100644
index 0000000..ee0d05e
--- /dev/null
+++ b/rollup.config.js
@@ -0,0 +1,40 @@
+import resolve from 'rollup-plugin-node-resolve';
+import commonjs from 'rollup-plugin-commonjs';
+import babel from 'rollup-plugin-babel';
+import pkg from './package.json';
+
+export default [
+	// browser-friendly UMD build
+	{
+		entry: 'src/js/main.iife.js',
+		dest: pkg.browser,
+		format: 'iife',
+		moduleName: 'chocolat',
+		plugins: [
+			resolve(), // so Rollup can find `jquery`
+			commonjs(), // so Rollup can convert `jquery` to an ES module
+			babel({
+				exclude: ['node_modules/**']
+			})
+		]
+	},
+
+	// CommonJS (for Node) and ES module (for bundlers) build.
+	// (We could have three entries in the configuration array
+	// instead of two, but it's quicker to generate multiple
+	// builds from a single configuration where possible, using
+	// the `targets` option which can specify `dest` and `format`)
+	{
+		entry: 'src/js/main.esm.js',
+		external: ['jquery', 'es6-promise/auto'],
+		targets: [
+			{ dest: pkg.main, format: 'cjs' },
+			{ dest: pkg.module, format: 'es' }
+		],
+		plugins: [
+			babel({
+				exclude: ['node_modules/**']
+			})
+		]
+	}
+];
\ No newline at end of file
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
new file mode 100644
index 0000000..4826a06
--- /dev/null
+++ b/src/js/chocolat.js
@@ -0,0 +1,705 @@
+export const defaults = {
+    container: window, // window or jquery object or jquery selector, or element
+    imageSelector: '.chocolat-image',
+    className: '',
+    imageSize: 'default', // 'default', 'contain', 'cover' or 'native'
+    initialZoomState: null,
+    fullScreen: false,
+    loop: false,
+    linkImages: true,
+    duration: 300,
+    setTitle: '',
+    separator2: '/',
+    setIndex: 0,
+    firstImage: 0,
+    lastImage: false,
+    currentImage: false,
+    initialized: false,
+    timer: false,
+    timerDebounce: false,
+    images: [],
+    enableZoom: true,
+    imageSource: 'href',
+    afterInitialize() {},
+    afterMarkup() {},
+    afterImageLoad() {},
+    zoomedPaddingX: function(canvasWidth, imgWidth) {
+        return 0
+    },
+    zoomedPaddingY: function(canvasHeight, imgHeight) {
+        return 0
+    },
+}
+
+export class Chocolat {
+    constructor(element, settings) {
+        var that = this
+
+        this.settings = settings
+        this.elems = {}
+        this.element = element
+
+        this._cssClasses = [
+            'chocolat-open',
+            'chocolat-in-container',
+            'chocolat-cover',
+            'chocolat-zoomable',
+            'chocolat-zoomed',
+        ]
+
+        if (!this.settings.setTitle && element.data('chocolat-title')) {
+            this.settings.setTitle = element.data('chocolat-title')
+        }
+
+        this.element.find(this.settings.imageSelector).each(function() {
+            that.settings.images.push({
+                title: $(this).attr('title'),
+                src: $(this).attr(that.settings.imageSource),
+                height: false,
+                width: false,
+            })
+        })
+
+        this.element.find(this.settings.imageSelector).each(function(i) {
+            $(this)
+                .off('click.chocolat')
+                .on('click.chocolat', function(e) {
+                    that.init(i)
+                    e.preventDefault()
+                })
+        })
+    }
+
+    init(i) {
+        if (!this.settings.initialized) {
+            this.setDomContainer()
+            this.markup()
+            this.events()
+            this.settings.lastImage = this.settings.images.length - 1
+            this.settings.initialized = true
+        }
+
+        this.settings.afterInitialize.call(this)
+
+        return this.load(i)
+    }
+
+    preload(i) {
+        var def = $.Deferred()
+
+        if (typeof this.settings.images[i] === 'undefined') {
+            return
+        }
+        var imgLoader = new Image()
+        imgLoader.onload = function() {
+            def.resolve(imgLoader)
+        }
+        imgLoader.src = this.settings.images[i].src
+
+        return def
+    }
+
+    load(i) {
+        var that = this
+        if (this.settings.fullScreen) {
+            this.openFullScreen()
+        }
+
+        if (this.settings.currentImage === i) {
+            return
+        }
+
+        this.elems.overlay.fadeIn(this.settings.duration)
+        this.elems.wrapper.fadeIn(this.settings.duration)
+        this.elems.domContainer.addClass('chocolat-open')
+
+        this.settings.timer = setTimeout(function() {
+            if (typeof that.elems != 'undefined') {
+                $.proxy(that.elems.loader.fadeIn(), that)
+            }
+        }, this.settings.duration)
+
+        var deferred = this.preload(i)
+            .then(function(imgLoader) {
+                return that.place(i, imgLoader)
+            })
+            .then(function(imgLoader) {
+                return that.appear(i)
+            })
+            .then(function(imgLoader) {
+                that.zoomable()
+                that.settings.afterImageLoad.call(that)
+            })
+
+        var nextIndex = i + 1
+        if (typeof this.settings.images[nextIndex] != 'undefined') {
+            this.preload(nextIndex)
+        }
+
+        return deferred
+    }
+
+    place(i, imgLoader) {
+        var that = this
+        var fitting
+
+        this.settings.currentImage = i
+        this.description()
+        this.pagination()
+        this.arrows()
+
+        this.storeImgSize(imgLoader, i)
+        fitting = this.fit(i, that.elems.wrapper)
+
+        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
+    }
+
+    center(width, height, left, top, duration) {
+        return this.elems.content
+            .css('overflow', 'visible')
+            .animate(
+                {
+                    width: width,
+                    height: height,
+                    left: left,
+                    top: top,
+                },
+                duration
+            )
+            .promise()
+    }
+
+    appear(i) {
+        var that = this
+        clearTimeout(this.settings.timer)
+
+        this.elems.loader.stop().fadeOut(300, function() {
+            that.elems.img.attr('src', that.settings.images[i].src)
+        })
+    }
+
+    fit(i, container) {
+        var height
+        var width
+
+        var imgHeight = this.settings.images[i].height
+        var imgWidth = this.settings.images[i].width
+        var holderHeight = $(container).height()
+        var holderWidth = $(container).width()
+        var holderOutMarginH = this.getOutMarginH()
+        var holderOutMarginW = this.getOutMarginW()
+
+        var holderGlobalWidth = holderWidth - holderOutMarginW
+        var holderGlobalHeight = holderHeight - holderOutMarginH
+        var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth
+        var holderRatio = holderHeight / holderWidth
+        var imgRatio = imgHeight / imgWidth
+
+        if (this.settings.imageSize == 'cover') {
+            if (imgRatio < holderRatio) {
+                height = holderHeight
+                width = height / imgRatio
+            } else {
+                width = holderWidth
+                height = width * imgRatio
+            }
+        } else if (this.settings.imageSize == 'native') {
+            height = imgHeight
+            width = imgWidth
+        } else {
+            if (imgRatio > holderGlobalRatio) {
+                height = holderGlobalHeight
+                width = height / imgRatio
+            } else {
+                width = holderGlobalWidth
+                height = width * imgRatio
+            }
+            if (
+                this.settings.imageSize === 'default' &&
+                (width >= imgWidth || height >= imgHeight)
+            ) {
+                width = imgWidth
+                height = imgHeight
+            }
+        }
+
+        return {
+            height: height,
+            width: width,
+            top: (holderHeight - height) / 2,
+            left: (holderWidth - width) / 2,
+        }
+    }
+
+    change(signe) {
+        this.zoomOut(0)
+        this.zoomable()
+
+        var requestedImage = this.settings.currentImage + parseInt(signe)
+        if (requestedImage > this.settings.lastImage) {
+            if (this.settings.loop) {
+                return this.load(0)
+            }
+        } else if (requestedImage < 0) {
+            if (this.settings.loop) {
+                return this.load(this.settings.lastImage)
+            }
+        } else {
+            return this.load(requestedImage)
+        }
+    }
+
+    arrows() {
+        if (this.settings.loop) {
+            $([this.elems.left[0], this.elems.right[0]]).addClass('active')
+        } else if (this.settings.linkImages) {
+            // right
+            if (this.settings.currentImage == this.settings.lastImage) {
+                this.elems.right.removeClass('active')
+            } else {
+                this.elems.right.addClass('active')
+            }
+            // left
+            if (this.settings.currentImage === 0) {
+                this.elems.left.removeClass('active')
+            } else {
+                this.elems.left.addClass('active')
+            }
+        } else {
+            $([this.elems.left[0], this.elems.right[0]]).removeClass('active')
+        }
+    }
+
+    description() {
+        var that = this
+        this.elems.description.html(that.settings.images[that.settings.currentImage].title)
+    }
+
+    pagination() {
+        var that = this
+        var last = this.settings.lastImage + 1
+        var position = this.settings.currentImage + 1
+
+        this.elems.pagination.html(position + ' ' + that.settings.separator2 + last)
+    }
+
+    storeImgSize(img, i) {
+        if (typeof img === 'undefined') {
+            return
+        }
+        if (!this.settings.images[i].height || !this.settings.images[i].width) {
+            this.settings.images[i].height = img.height
+            this.settings.images[i].width = img.width
+        }
+    }
+
+    close() {
+        if (this.settings.fullscreenOpen) {
+            this.exitFullScreen()
+            return
+        }
+
+        var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]]
+        var that = this
+        var def = $.when($(els).fadeOut(200)).done(function() {
+            that.elems.domContainer.removeClass('chocolat-open')
+        })
+        this.settings.currentImage = false
+
+        return def
+    }
+
+    destroy() {
+        this.element.removeData()
+        this.element.find(this.settings.imageSelector).off('click.chocolat')
+
+        if (!this.settings.initialized) {
+            return
+        }
+        if (this.settings.fullscreenOpen) {
+            this.exitFullScreen()
+        }
+        this.settings.currentImage = false
+        this.settings.initialized = false
+        this.elems.domContainer.removeClass(this._cssClasses.join(' '))
+        this.elems.wrapper.remove()
+    }
+
+    getOutMarginW() {
+        var left = this.elems.left.outerWidth(true)
+        var right = this.elems.right.outerWidth(true)
+        return left + right
+    }
+
+    getOutMarginH() {
+        return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true)
+    }
+
+    markup() {
+        this.elems.domContainer.addClass('chocolat-open ' + this.settings.className)
+        if (this.settings.imageSize == 'cover') {
+            this.elems.domContainer.addClass('chocolat-cover')
+        }
+        if (this.settings.container !== window) {
+            this.elems.domContainer.addClass('chocolat-in-container')
+        }
+
+        this.elems.wrapper = $('<div/>', {
+            class: 'chocolat-wrapper',
+            id: 'chocolat-content-' + this.settings.setIndex,
+        }).appendTo(this.elems.domContainer)
+
+        this.elems.overlay = $('<div/>', {
+            class: 'chocolat-overlay',
+        }).appendTo(this.elems.wrapper)
+
+        this.elems.loader = $('<div/>', {
+            class: 'chocolat-loader',
+        }).appendTo(this.elems.wrapper)
+
+        this.elems.content = $('<div/>', {
+            class: 'chocolat-content',
+        }).appendTo(this.elems.wrapper)
+
+        this.elems.img = $('<img/>', {
+            class: 'chocolat-img',
+            src: '',
+        }).appendTo(this.elems.content)
+
+        this.elems.top = $('<div/>', {
+            class: 'chocolat-top',
+        }).appendTo(this.elems.wrapper)
+
+        this.elems.left = $('<div/>', {
+            class: 'chocolat-left',
+        }).appendTo(this.elems.wrapper)
+
+        this.elems.right = $('<div/>', {
+            class: 'chocolat-right',
+        }).appendTo(this.elems.wrapper)
+
+        this.elems.bottom = $('<div/>', {
+            class: 'chocolat-bottom',
+        }).appendTo(this.elems.wrapper)
+
+        this.elems.close = $('<span/>', {
+            class: 'chocolat-close',
+        }).appendTo(this.elems.top)
+
+        this.elems.fullscreen = $('<span/>', {
+            class: 'chocolat-fullscreen',
+        }).appendTo(this.elems.bottom)
+
+        this.elems.description = $('<span/>', {
+            class: 'chocolat-description',
+        }).appendTo(this.elems.bottom)
+
+        this.elems.pagination = $('<span/>', {
+            class: 'chocolat-pagination',
+        }).appendTo(this.elems.bottom)
+
+        this.elems.setTitle = $('<span/>', {
+            class: 'chocolat-set-title',
+            html: this.settings.setTitle,
+        }).appendTo(this.elems.bottom)
+
+        this.settings.afterMarkup.call(this)
+    }
+
+    openFullScreen() {
+        var wrapper = this.elems.wrapper[0]
+
+        if (wrapper.requestFullscreen) {
+            this.settings.fullscreenOpen = true
+            wrapper.requestFullscreen()
+        } else if (wrapper.mozRequestFullScreen) {
+            this.settings.fullscreenOpen = true
+            wrapper.mozRequestFullScreen()
+        } else if (wrapper.webkitRequestFullscreen) {
+            this.settings.fullscreenOpen = true
+            wrapper.webkitRequestFullscreen()
+        } else if (wrapper.msRequestFullscreen) {
+            wrapper.msRequestFullscreen()
+            this.settings.fullscreenOpen = true
+        } else {
+            this.settings.fullscreenOpen = false
+        }
+    }
+
+    exitFullScreen() {
+        if (document.exitFullscreen) {
+            document.exitFullscreen()
+            this.settings.fullscreenOpen = false
+        } else if (document.mozCancelFullScreen) {
+            document.mozCancelFullScreen()
+            this.settings.fullscreenOpen = false
+        } else if (document.webkitExitFullscreen) {
+            document.webkitExitFullscreen()
+            this.settings.fullscreenOpen = false
+        } else if (document.msExitFullscreen) {
+            document.msExitFullscreen()
+            this.settings.fullscreenOpen = false
+        } else {
+            this.settings.fullscreenOpen = true
+        }
+    }
+
+    events() {
+        var that = this
+
+        $(document)
+            .off('keydown.chocolat')
+            .on('keydown.chocolat', function(e) {
+                if (that.settings.initialized) {
+                    if (e.keyCode == 37) {
+                        that.change(-1)
+                    } else if (e.keyCode == 39) {
+                        that.change(1)
+                    } else if (e.keyCode == 27) {
+                        that.close()
+                    }
+                }
+            })
+        // this.elems.wrapper.find('.chocolat-img')
+        //     .off('click.chocolat')
+        //     .on('click.chocolat', function(e) {
+        //         var currentImage = that.settings.images[that.settings.currentImage];
+        //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
+        //             that.toggleZoom(e);
+        //         }
+        // });
+
+        this.elems.wrapper
+            .find('.chocolat-right')
+            .off('click.chocolat')
+            .on('click.chocolat', function() {
+                that.change(+1)
+            })
+
+        this.elems.wrapper
+            .find('.chocolat-left')
+            .off('click.chocolat')
+            .on('click.chocolat', function() {
+                return that.change(-1)
+            })
+
+        $([this.elems.overlay[0], this.elems.close[0]])
+            .off('click.chocolat')
+            .on('click.chocolat', function() {
+                return that.close()
+            })
+
+        this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function() {
+            if (that.settings.fullscreenOpen) {
+                that.exitFullScreen()
+                return
+            }
+
+            that.openFullScreen()
+        })
+
+        if (that.settings.backgroundClose) {
+            this.elems.overlay.off('click.chocolat').on('click.chocolat', function() {
+                return that.close()
+            })
+        }
+        this.elems.wrapper.off('click.chocolat').on('click.chocolat', function(e) {
+            return that.zoomOut(e)
+        })
+
+        this.elems.wrapper
+            .find('.chocolat-img')
+            .off('click.chocolat')
+            .on('click.chocolat', function(e) {
+                if (
+                    that.settings.initialZoomState === null &&
+                    that.elems.domContainer.hasClass('chocolat-zoomable')
+                ) {
+                    e.stopPropagation()
+                    return that.zoomIn(e)
+                }
+            })
+
+        this.elems.wrapper.mousemove(function(e) {
+            if (that.settings.initialZoomState === null) {
+                return
+            }
+            if (that.elems.img.is(':animated')) {
+                return
+            }
+
+            var pos = $(this).offset()
+            var height = $(this).height()
+            var width = $(this).width()
+
+            var currentImage = that.settings.images[that.settings.currentImage]
+            var imgWidth = currentImage.width
+            var imgHeight = currentImage.height
+
+            var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top]
+
+            var mvtX = 0
+            if (imgWidth > width) {
+                var paddingX = that.settings.zoomedPaddingX(imgWidth, width)
+                mvtX = coord[0] / (width / 2)
+                mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX
+            }
+
+            var mvtY = 0
+            if (imgHeight > height) {
+                var paddingY = that.settings.zoomedPaddingY(imgHeight, height)
+                mvtY = coord[1] / (height / 2)
+                mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY
+            }
+
+            var animation = {
+                'margin-left': -mvtX + 'px',
+                'margin-top': -mvtY + 'px',
+            }
+            if (typeof e.duration !== 'undefined') {
+                $(that.elems.img)
+                    .stop(false, true)
+                    .animate(animation, e.duration)
+            } else {
+                $(that.elems.img)
+                    .stop(false, true)
+                    .css(animation)
+            }
+        })
+        $(window).on('resize', function() {
+            if (!that.settings.initialized || that.settings.currentImage === false) {
+                return
+            }
+            that.debounce(50, function() {
+                var fitting = that.fit(that.settings.currentImage, that.elems.wrapper)
+                that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
+                that.zoomable()
+            })
+        })
+    }
+
+    zoomable() {
+        var currentImage = this.settings.images[this.settings.currentImage]
+        var wrapperWidth = this.elems.wrapper.width()
+        var wrapperHeight = this.elems.wrapper.height()
+
+        var isImageZoomable =
+            this.settings.enableZoom &&
+            (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight)
+                ? true
+                : false
+        var isImageStretched =
+            this.elems.img.width() > currentImage.width ||
+            this.elems.img.height() > currentImage.height
+
+        if (isImageZoomable && !isImageStretched) {
+            this.elems.domContainer.addClass('chocolat-zoomable')
+        } else {
+            this.elems.domContainer.removeClass('chocolat-zoomable')
+        }
+    }
+
+    zoomIn(e) {
+        this.settings.initialZoomState = this.settings.imageSize
+        this.settings.imageSize = 'native'
+
+        var event = $.Event('mousemove')
+        event.pageX = e.pageX
+        event.pageY = e.pageY
+        event.duration = this.settings.duration
+        this.elems.wrapper.trigger(event)
+
+        this.elems.domContainer.addClass('chocolat-zoomed')
+        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
+        return this.center(
+            fitting.width,
+            fitting.height,
+            fitting.left,
+            fitting.top,
+            this.settings.duration
+        )
+    }
+
+    zoomOut(e, duration) {
+        if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
+            return
+        }
+        duration = duration || this.settings.duration
+
+        this.settings.imageSize = this.settings.initialZoomState
+        this.settings.initialZoomState = null
+        this.elems.img.animate({ margin: 0 }, duration)
+
+        this.elems.domContainer.removeClass('chocolat-zoomed')
+        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
+        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration)
+    }
+
+    setDomContainer() {
+        // if container == window
+        // domContainer = body
+        if (this.settings.container === window) {
+            this.elems.domContainer = $('body')
+        } else {
+            this.elems.domContainer = $(this.settings.container)
+        }
+    }
+
+    debounce(duration, callback) {
+        clearTimeout(this.settings.timerDebounce)
+        this.settings.timerDebounce = setTimeout(function() {
+            callback()
+        }, duration)
+    }
+
+    api() {
+        var that = this
+        return {
+            open: function(i) {
+                i = parseInt(i) || 0
+                return that.init(i)
+            },
+
+            close: function() {
+                return that.close()
+            },
+
+            next: function() {
+                return that.change(1)
+            },
+
+            prev: function() {
+                return that.change(-1)
+            },
+
+            goto: function(i) {
+                // open alias
+                return that.open(i)
+            },
+            current: function() {
+                return that.settings.currentImage
+            },
+
+            place: function() {
+                return that.place(that.settings.currentImage, that.settings.duration)
+            },
+
+            destroy: function() {
+                return that.destroy()
+            },
+
+            set: function(property, value) {
+                that.settings[property] = value
+                return value
+            },
+
+            get: function(property) {
+                return that.settings[property]
+            },
+
+            getElem: function(name) {
+                return that.elems[name]
+            },
+        }
+    }
+}
diff --git a/src/js/jquery.chocolat.js b/src/js/jquery.chocolat.js
deleted file mode 100644
index aa3cd2c..0000000
--- a/src/js/jquery.chocolat.js
+++ /dev/null
@@ -1,730 +0,0 @@
-;(function(factory) {
-    if (typeof module === 'object' && typeof module.exports === 'object') {
-        module.exports = factory(require('jquery'), window, document)
-    } else {
-        factory(jQuery, window, document)
-    }
-})(function($, window, document, undefined) {
-    var calls = 0
-
-    function Chocolat(element, settings) {
-        var that = this
-
-        this.settings = settings
-        this.elems = {}
-        this.element = element
-
-        this._cssClasses = [
-            'chocolat-open',
-            'chocolat-in-container',
-            'chocolat-cover',
-            'chocolat-zoomable',
-            'chocolat-zoomed',
-        ]
-
-        if (!this.settings.setTitle && element.data('chocolat-title')) {
-            this.settings.setTitle = element.data('chocolat-title')
-        }
-
-        this.element.find(this.settings.imageSelector).each(function() {
-            that.settings.images.push({
-                title: $(this).attr('title'),
-                src: $(this).attr(that.settings.imageSource),
-                height: false,
-                width: false,
-            })
-        })
-
-        this.element.find(this.settings.imageSelector).each(function(i) {
-            $(this)
-                .off('click.chocolat')
-                .on('click.chocolat', function(e) {
-                    that.init(i)
-                    e.preventDefault()
-                })
-        })
-
-        return this
-    }
-
-    $.extend(Chocolat.prototype, {
-        init: function(i) {
-            if (!this.settings.initialized) {
-                this.setDomContainer()
-                this.markup()
-                this.events()
-                this.settings.lastImage = this.settings.images.length - 1
-                this.settings.initialized = true
-            }
-
-            this.settings.afterInitialize.call(this)
-
-            return this.load(i)
-        },
-
-        preload: function(i) {
-            var def = $.Deferred()
-
-            if (typeof this.settings.images[i] === 'undefined') {
-                return
-            }
-            var imgLoader = new Image()
-            imgLoader.onload = function() {
-                def.resolve(imgLoader)
-            }
-            imgLoader.src = this.settings.images[i].src
-
-            return def
-        },
-
-        load: function(i) {
-            var that = this
-            if (this.settings.fullScreen) {
-                this.openFullScreen()
-            }
-
-            if (this.settings.currentImage === i) {
-                return
-            }
-
-            this.elems.overlay.fadeIn(this.settings.duration)
-            this.elems.wrapper.fadeIn(this.settings.duration)
-            this.elems.domContainer.addClass('chocolat-open')
-
-            this.settings.timer = setTimeout(function() {
-                if (typeof that.elems != 'undefined') {
-                    $.proxy(that.elems.loader.fadeIn(), that)
-                }
-            }, this.settings.duration)
-
-            var deferred = this.preload(i)
-                .then(function(imgLoader) {
-                    return that.place(i, imgLoader)
-                })
-                .then(function(imgLoader) {
-                    return that.appear(i)
-                })
-                .then(function(imgLoader) {
-                    that.zoomable()
-                    that.settings.afterImageLoad.call(that)
-                })
-
-            var nextIndex = i + 1
-            if (typeof this.settings.images[nextIndex] != 'undefined') {
-                this.preload(nextIndex)
-            }
-
-            return deferred
-        },
-
-        place: function(i, imgLoader) {
-            var that = this
-            var fitting
-
-            this.settings.currentImage = i
-            this.description()
-            this.pagination()
-            this.arrows()
-
-            this.storeImgSize(imgLoader, i)
-            fitting = this.fit(i, that.elems.wrapper)
-
-            return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
-        },
-
-        center: function(width, height, left, top, duration) {
-            return this.elems.content
-                .css('overflow', 'visible')
-                .animate(
-                    {
-                        width: width,
-                        height: height,
-                        left: left,
-                        top: top,
-                    },
-                    duration
-                )
-                .promise()
-        },
-
-        appear: function(i) {
-            var that = this
-            clearTimeout(this.settings.timer)
-
-            this.elems.loader.stop().fadeOut(300, function() {
-                that.elems.img.attr('src', that.settings.images[i].src)
-            })
-        },
-
-        fit: function(i, container) {
-            var height
-            var width
-
-            var imgHeight = this.settings.images[i].height
-            var imgWidth = this.settings.images[i].width
-            var holderHeight = $(container).height()
-            var holderWidth = $(container).width()
-            var holderOutMarginH = this.getOutMarginH()
-            var holderOutMarginW = this.getOutMarginW()
-
-            var holderGlobalWidth = holderWidth - holderOutMarginW
-            var holderGlobalHeight = holderHeight - holderOutMarginH
-            var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth
-            var holderRatio = holderHeight / holderWidth
-            var imgRatio = imgHeight / imgWidth
-
-            if (this.settings.imageSize == 'cover') {
-                if (imgRatio < holderRatio) {
-                    height = holderHeight
-                    width = height / imgRatio
-                } else {
-                    width = holderWidth
-                    height = width * imgRatio
-                }
-            } else if (this.settings.imageSize == 'native') {
-                height = imgHeight
-                width = imgWidth
-            } else {
-                if (imgRatio > holderGlobalRatio) {
-                    height = holderGlobalHeight
-                    width = height / imgRatio
-                } else {
-                    width = holderGlobalWidth
-                    height = width * imgRatio
-                }
-                if (
-                    this.settings.imageSize === 'default' &&
-                    (width >= imgWidth || height >= imgHeight)
-                ) {
-                    width = imgWidth
-                    height = imgHeight
-                }
-            }
-
-            return {
-                height: height,
-                width: width,
-                top: (holderHeight - height) / 2,
-                left: (holderWidth - width) / 2,
-            }
-        },
-
-        change: function(signe) {
-            this.zoomOut(0)
-            this.zoomable()
-
-            var requestedImage = this.settings.currentImage + parseInt(signe)
-            if (requestedImage > this.settings.lastImage) {
-                if (this.settings.loop) {
-                    return this.load(0)
-                }
-            } else if (requestedImage < 0) {
-                if (this.settings.loop) {
-                    return this.load(this.settings.lastImage)
-                }
-            } else {
-                return this.load(requestedImage)
-            }
-        },
-
-        arrows: function() {
-            if (this.settings.loop) {
-                $([this.elems.left[0], this.elems.right[0]]).addClass('active')
-            } else if (this.settings.linkImages) {
-                // right
-                if (this.settings.currentImage == this.settings.lastImage) {
-                    this.elems.right.removeClass('active')
-                } else {
-                    this.elems.right.addClass('active')
-                }
-                // left
-                if (this.settings.currentImage === 0) {
-                    this.elems.left.removeClass('active')
-                } else {
-                    this.elems.left.addClass('active')
-                }
-            } else {
-                $([this.elems.left[0], this.elems.right[0]]).removeClass('active')
-            }
-        },
-
-        description: function() {
-            var that = this
-            this.elems.description.html(that.settings.images[that.settings.currentImage].title)
-        },
-
-        pagination: function() {
-            var that = this
-            var last = this.settings.lastImage + 1
-            var position = this.settings.currentImage + 1
-
-            this.elems.pagination.html(position + ' ' + that.settings.separator2 + last)
-        },
-
-        storeImgSize: function(img, i) {
-            if (typeof img === 'undefined') {
-                return
-            }
-            if (!this.settings.images[i].height || !this.settings.images[i].width) {
-                this.settings.images[i].height = img.height
-                this.settings.images[i].width = img.width
-            }
-        },
-
-        close: function() {
-            if (this.settings.fullscreenOpen) {
-                this.exitFullScreen()
-                return
-            }
-
-            var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]]
-            var that = this
-            var def = $.when($(els).fadeOut(200)).done(function() {
-                that.elems.domContainer.removeClass('chocolat-open')
-            })
-            this.settings.currentImage = false
-
-            return def
-        },
-
-        destroy: function() {
-            this.element.removeData()
-            this.element.find(this.settings.imageSelector).off('click.chocolat')
-
-            if (!this.settings.initialized) {
-                return
-            }
-            if (this.settings.fullscreenOpen) {
-                this.exitFullScreen()
-            }
-            this.settings.currentImage = false
-            this.settings.initialized = false
-            this.elems.domContainer.removeClass(this._cssClasses.join(' '))
-            this.elems.wrapper.remove()
-        },
-
-        getOutMarginW: function() {
-            var left = this.elems.left.outerWidth(true)
-            var right = this.elems.right.outerWidth(true)
-            return left + right
-        },
-
-        getOutMarginH: function() {
-            return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true)
-        },
-
-        markup: function() {
-            this.elems.domContainer.addClass('chocolat-open ' + this.settings.className)
-            if (this.settings.imageSize == 'cover') {
-                this.elems.domContainer.addClass('chocolat-cover')
-            }
-            if (this.settings.container !== window) {
-                this.elems.domContainer.addClass('chocolat-in-container')
-            }
-
-            this.elems.wrapper = $('<div/>', {
-                class: 'chocolat-wrapper',
-                id: 'chocolat-content-' + this.settings.setIndex,
-            }).appendTo(this.elems.domContainer)
-
-            this.elems.overlay = $('<div/>', {
-                class: 'chocolat-overlay',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.loader = $('<div/>', {
-                class: 'chocolat-loader',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.content = $('<div/>', {
-                class: 'chocolat-content',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.img = $('<img/>', {
-                class: 'chocolat-img',
-                src: '',
-            }).appendTo(this.elems.content)
-
-            this.elems.top = $('<div/>', {
-                class: 'chocolat-top',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.left = $('<div/>', {
-                class: 'chocolat-left',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.right = $('<div/>', {
-                class: 'chocolat-right',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.bottom = $('<div/>', {
-                class: 'chocolat-bottom',
-            }).appendTo(this.elems.wrapper)
-
-            this.elems.close = $('<span/>', {
-                class: 'chocolat-close',
-            }).appendTo(this.elems.top)
-
-            this.elems.fullscreen = $('<span/>', {
-                class: 'chocolat-fullscreen',
-            }).appendTo(this.elems.bottom)
-
-            this.elems.description = $('<span/>', {
-                class: 'chocolat-description',
-            }).appendTo(this.elems.bottom)
-
-            this.elems.pagination = $('<span/>', {
-                class: 'chocolat-pagination',
-            }).appendTo(this.elems.bottom)
-
-            this.elems.setTitle = $('<span/>', {
-                class: 'chocolat-set-title',
-                html: this.settings.setTitle,
-            }).appendTo(this.elems.bottom)
-
-            this.settings.afterMarkup.call(this)
-        },
-
-        openFullScreen: function() {
-            var wrapper = this.elems.wrapper[0]
-
-            if (wrapper.requestFullscreen) {
-                this.settings.fullscreenOpen = true
-                wrapper.requestFullscreen()
-            } else if (wrapper.mozRequestFullScreen) {
-                this.settings.fullscreenOpen = true
-                wrapper.mozRequestFullScreen()
-            } else if (wrapper.webkitRequestFullscreen) {
-                this.settings.fullscreenOpen = true
-                wrapper.webkitRequestFullscreen()
-            } else if (wrapper.msRequestFullscreen) {
-                wrapper.msRequestFullscreen()
-                this.settings.fullscreenOpen = true
-            } else {
-                this.settings.fullscreenOpen = false
-            }
-        },
-
-        exitFullScreen: function() {
-            if (document.exitFullscreen) {
-                document.exitFullscreen()
-                this.settings.fullscreenOpen = false
-            } else if (document.mozCancelFullScreen) {
-                document.mozCancelFullScreen()
-                this.settings.fullscreenOpen = false
-            } else if (document.webkitExitFullscreen) {
-                document.webkitExitFullscreen()
-                this.settings.fullscreenOpen = false
-            } else if (document.msExitFullscreen) {
-                document.msExitFullscreen()
-                this.settings.fullscreenOpen = false
-            } else {
-                this.settings.fullscreenOpen = true
-            }
-        },
-
-        events: function() {
-            var that = this
-
-            $(document)
-                .off('keydown.chocolat')
-                .on('keydown.chocolat', function(e) {
-                    if (that.settings.initialized) {
-                        if (e.keyCode == 37) {
-                            that.change(-1)
-                        } else if (e.keyCode == 39) {
-                            that.change(1)
-                        } else if (e.keyCode == 27) {
-                            that.close()
-                        }
-                    }
-                })
-            // this.elems.wrapper.find('.chocolat-img')
-            //     .off('click.chocolat')
-            //     .on('click.chocolat', function(e) {
-            //         var currentImage = that.settings.images[that.settings.currentImage];
-            //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
-            //             that.toggleZoom(e);
-            //         }
-            // });
-
-            this.elems.wrapper
-                .find('.chocolat-right')
-                .off('click.chocolat')
-                .on('click.chocolat', function() {
-                    that.change(+1)
-                })
-
-            this.elems.wrapper
-                .find('.chocolat-left')
-                .off('click.chocolat')
-                .on('click.chocolat', function() {
-                    return that.change(-1)
-                })
-
-            $([this.elems.overlay[0], this.elems.close[0]])
-                .off('click.chocolat')
-                .on('click.chocolat', function() {
-                    return that.close()
-                })
-
-            this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function() {
-                if (that.settings.fullscreenOpen) {
-                    that.exitFullScreen()
-                    return
-                }
-
-                that.openFullScreen()
-            })
-
-            if (that.settings.backgroundClose) {
-                this.elems.overlay.off('click.chocolat').on('click.chocolat', function() {
-                    return that.close()
-                })
-            }
-            this.elems.wrapper.off('click.chocolat').on('click.chocolat', function(e) {
-                return that.zoomOut(e)
-            })
-
-            this.elems.wrapper
-                .find('.chocolat-img')
-                .off('click.chocolat')
-                .on('click.chocolat', function(e) {
-                    if (
-                        that.settings.initialZoomState === null &&
-                        that.elems.domContainer.hasClass('chocolat-zoomable')
-                    ) {
-                        e.stopPropagation()
-                        return that.zoomIn(e)
-                    }
-                })
-
-            this.elems.wrapper.mousemove(function(e) {
-                if (that.settings.initialZoomState === null) {
-                    return
-                }
-                if (that.elems.img.is(':animated')) {
-                    return
-                }
-
-                var pos = $(this).offset()
-                var height = $(this).height()
-                var width = $(this).width()
-
-                var currentImage = that.settings.images[that.settings.currentImage]
-                var imgWidth = currentImage.width
-                var imgHeight = currentImage.height
-
-                var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top]
-
-                var mvtX = 0
-                if (imgWidth > width) {
-                    var paddingX = that.settings.zoomedPaddingX(imgWidth, width)
-                    mvtX = coord[0] / (width / 2)
-                    mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX
-                }
-
-                var mvtY = 0
-                if (imgHeight > height) {
-                    var paddingY = that.settings.zoomedPaddingY(imgHeight, height)
-                    mvtY = coord[1] / (height / 2)
-                    mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY
-                }
-
-                var animation = {
-                    'margin-left': -mvtX + 'px',
-                    'margin-top': -mvtY + 'px',
-                }
-                if (typeof e.duration !== 'undefined') {
-                    $(that.elems.img)
-                        .stop(false, true)
-                        .animate(animation, e.duration)
-                } else {
-                    $(that.elems.img)
-                        .stop(false, true)
-                        .css(animation)
-                }
-            })
-            $(window).on('resize', function() {
-                if (!that.settings.initialized || that.settings.currentImage === false) {
-                    return
-                }
-                that.debounce(50, function() {
-                    var fitting = that.fit(that.settings.currentImage, that.elems.wrapper)
-                    that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
-                    that.zoomable()
-                })
-            })
-        },
-
-        zoomable: function() {
-            var currentImage = this.settings.images[this.settings.currentImage]
-            var wrapperWidth = this.elems.wrapper.width()
-            var wrapperHeight = this.elems.wrapper.height()
-
-            var isImageZoomable =
-                this.settings.enableZoom &&
-                (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight)
-                    ? true
-                    : false
-            var isImageStretched =
-                this.elems.img.width() > currentImage.width ||
-                this.elems.img.height() > currentImage.height
-
-            if (isImageZoomable && !isImageStretched) {
-                this.elems.domContainer.addClass('chocolat-zoomable')
-            } else {
-                this.elems.domContainer.removeClass('chocolat-zoomable')
-            }
-        },
-
-        zoomIn: function(e) {
-            this.settings.initialZoomState = this.settings.imageSize
-            this.settings.imageSize = 'native'
-
-            var event = $.Event('mousemove')
-            event.pageX = e.pageX
-            event.pageY = e.pageY
-            event.duration = this.settings.duration
-            this.elems.wrapper.trigger(event)
-
-            this.elems.domContainer.addClass('chocolat-zoomed')
-            var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
-            return this.center(
-                fitting.width,
-                fitting.height,
-                fitting.left,
-                fitting.top,
-                this.settings.duration
-            )
-        },
-
-        zoomOut: function(e, duration) {
-            if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
-                return
-            }
-            duration = duration || this.settings.duration
-
-            this.settings.imageSize = this.settings.initialZoomState
-            this.settings.initialZoomState = null
-            this.elems.img.animate({ margin: 0 }, duration)
-
-            this.elems.domContainer.removeClass('chocolat-zoomed')
-            var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
-            return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration)
-        },
-
-        setDomContainer: function() {
-            // if container == window
-            // domContainer = body
-            if (this.settings.container === window) {
-                this.elems.domContainer = $('body')
-            } else {
-                this.elems.domContainer = $(this.settings.container)
-            }
-        },
-
-        debounce: function(duration, callback) {
-            clearTimeout(this.settings.timerDebounce)
-            this.settings.timerDebounce = setTimeout(function() {
-                callback()
-            }, duration)
-        },
-
-        api: function() {
-            var that = this
-            return {
-                open: function(i) {
-                    i = parseInt(i) || 0
-                    return that.init(i)
-                },
-
-                close: function() {
-                    return that.close()
-                },
-
-                next: function() {
-                    return that.change(1)
-                },
-
-                prev: function() {
-                    return that.change(-1)
-                },
-
-                goto: function(i) {
-                    // open alias
-                    return that.open(i)
-                },
-                current: function() {
-                    return that.settings.currentImage
-                },
-
-                place: function() {
-                    return that.place(that.settings.currentImage, that.settings.duration)
-                },
-
-                destroy: function() {
-                    return that.destroy()
-                },
-
-                set: function(property, value) {
-                    that.settings[property] = value
-                    return value
-                },
-
-                get: function(property) {
-                    return that.settings[property]
-                },
-
-                getElem: function(name) {
-                    return that.elems[name]
-                },
-            }
-        },
-    })
-
-    var defaults = {
-        container: window, // window or jquery object or jquery selector, or element
-        imageSelector: '.chocolat-image',
-        className: '',
-        imageSize: 'default', // 'default', 'contain', 'cover' or 'native'
-        initialZoomState: null,
-        fullScreen: false,
-        loop: false,
-        linkImages: true,
-        duration: 300,
-        setTitle: '',
-        separator2: '/',
-        setIndex: 0,
-        firstImage: 0,
-        lastImage: false,
-        currentImage: false,
-        initialized: false,
-        timer: false,
-        timerDebounce: false,
-        images: [],
-        enableZoom: true,
-        imageSource: 'href',
-        afterInitialize: function() {},
-        afterMarkup: function() {},
-        afterImageLoad: function() {},
-        zoomedPaddingX: function(canvasWidth, imgWidth) {
-            return 0
-        },
-        zoomedPaddingY: function(canvasHeight, imgHeight) {
-            return 0
-        },
-    }
-
-    $.fn.Chocolat = function(options) {
-        return this.each(function() {
-            calls++
-            var settings = $.extend(true, {}, defaults, options, { setIndex: calls })
-
-            if (!$.data(this, 'chocolat')) {
-                $.data(this, 'chocolat', new Chocolat($(this), settings))
-            }
-        })
-    }
-
-    return $.fn.Chocolat
-})
diff --git a/src/js/main.esm.js b/src/js/main.esm.js
new file mode 100644
index 0000000..16bdb6f
--- /dev/null
+++ b/src/js/main.esm.js
@@ -0,0 +1,12 @@
+import { Chocolat, defaults } from './chocolat.js'
+
+export default function(options) {
+    return this.each(function() {
+        calls++
+        var settings = $.extend(true, {}, defaults, options, { setIndex: calls })
+
+        if (!$.data(this, 'chocolat')) {
+            $.data(this, 'chocolat', new Chocolat($(this), settings))
+        }
+    })
+}
diff --git a/src/js/main.iife.js b/src/js/main.iife.js
new file mode 100644
index 0000000..706b093
--- /dev/null
+++ b/src/js/main.iife.js
@@ -0,0 +1,14 @@
+import { Chocolat, defaults } from './chocolat.js'
+
+let calls = 0
+
+$.fn.Chocolat = function(options) {
+    return this.each(function() {
+        calls++
+        var settings = $.extend(true, {}, defaults, options, { setIndex: calls })
+
+        if (!$.data(this, 'chocolat')) {
+            $.data(this, 'chocolat', new Chocolat($(this), settings))
+        }
+    })
+}
diff --git a/yarn.lock b/yarn.lock
index 753dc5e..5ed749b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2,6 +2,125 @@
 # yarn lockfile v1
 
 
+"@babel/code-frame@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.0.0.tgz#06e2ab19bdb535385559aabb5ba59729482800f8"
+  dependencies:
+    "@babel/highlight" "^7.0.0"
+
+"@babel/core@^7.2.2":
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.2.2.tgz#07adba6dde27bb5ad8d8672f15fde3e08184a687"
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    "@babel/generator" "^7.2.2"
+    "@babel/helpers" "^7.2.0"
+    "@babel/parser" "^7.2.2"
+    "@babel/template" "^7.2.2"
+    "@babel/traverse" "^7.2.2"
+    "@babel/types" "^7.2.2"
+    convert-source-map "^1.1.0"
+    debug "^4.1.0"
+    json5 "^2.1.0"
+    lodash "^4.17.10"
+    resolve "^1.3.2"
+    semver "^5.4.1"
+    source-map "^0.5.0"
+
+"@babel/generator@^7.2.2":
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.2.2.tgz#18c816c70962640eab42fe8cae5f3947a5c65ccc"
+  dependencies:
+    "@babel/types" "^7.2.2"
+    jsesc "^2.5.1"
+    lodash "^4.17.10"
+    source-map "^0.5.0"
+    trim-right "^1.0.1"
+
+"@babel/helper-function-name@^7.1.0":
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.1.0.tgz#a0ceb01685f73355d4360c1247f582bfafc8ff53"
+  dependencies:
+    "@babel/helper-get-function-arity" "^7.0.0"
+    "@babel/template" "^7.1.0"
+    "@babel/types" "^7.0.0"
+
+"@babel/helper-get-function-arity@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.0.0.tgz#83572d4320e2a4657263734113c42868b64e49c3"
+  dependencies:
+    "@babel/types" "^7.0.0"
+
+"@babel/helper-module-imports@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.0.0.tgz#96081b7111e486da4d2cd971ad1a4fe216cc2e3d"
+  dependencies:
+    "@babel/types" "^7.0.0"
+
+"@babel/helper-split-export-declaration@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.0.0.tgz#3aae285c0311c2ab095d997b8c9a94cad547d813"
+  dependencies:
+    "@babel/types" "^7.0.0"
+
+"@babel/helpers@^7.2.0":
+  version "7.2.0"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.2.0.tgz#8335f3140f3144270dc63c4732a4f8b0a50b7a21"
+  dependencies:
+    "@babel/template" "^7.1.2"
+    "@babel/traverse" "^7.1.5"
+    "@babel/types" "^7.2.0"
+
+"@babel/highlight@^7.0.0":
+  version "7.0.0"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.0.0.tgz#f710c38c8d458e6dd9a201afb637fcb781ce99e4"
+  dependencies:
+    chalk "^2.0.0"
+    esutils "^2.0.2"
+    js-tokens "^4.0.0"
+
+"@babel/parser@^7.2.2", "@babel/parser@^7.2.3":
+  version "7.2.3"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.2.3.tgz#32f5df65744b70888d17872ec106b02434ba1489"
+
+"@babel/template@^7.1.0", "@babel/template@^7.1.2", "@babel/template@^7.2.2":
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.2.2.tgz#005b3fdf0ed96e88041330379e0da9a708eb2907"
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    "@babel/parser" "^7.2.2"
+    "@babel/types" "^7.2.2"
+
+"@babel/traverse@^7.1.5", "@babel/traverse@^7.2.2":
+  version "7.2.3"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.2.3.tgz#7ff50cefa9c7c0bd2d81231fdac122f3957748d8"
+  dependencies:
+    "@babel/code-frame" "^7.0.0"
+    "@babel/generator" "^7.2.2"
+    "@babel/helper-function-name" "^7.1.0"
+    "@babel/helper-split-export-declaration" "^7.0.0"
+    "@babel/parser" "^7.2.3"
+    "@babel/types" "^7.2.2"
+    debug "^4.1.0"
+    globals "^11.1.0"
+    lodash "^4.17.10"
+
+"@babel/types@^7.0.0", "@babel/types@^7.2.0", "@babel/types@^7.2.2":
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.2.2.tgz#44e10fc24e33af524488b716cdaee5360ea8ed1e"
+  dependencies:
+    esutils "^2.0.2"
+    lodash "^4.17.10"
+    to-fast-properties "^2.0.0"
+
+"@types/estree@0.0.39":
+  version "0.0.39"
+  resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.39.tgz#e177e699ee1b8c22d23174caaa7422644389509f"
+
+"@types/node@*":
+  version "10.12.18"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.18.tgz#1d3ca764718915584fcd9f6344621b7672665c67"
+
 ajv@^6.5.5:
   version "6.5.5"
   resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.5.5.tgz#cf97cdade71c6399a92c6d6c4177381291b781a1"
@@ -33,6 +152,12 @@ ansi-styles@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-2.2.1.tgz#b432dd3358b634cf75e1e4664368240533c1ddbe"
 
+ansi-styles@^3.2.1:
+  version "3.2.1"
+  resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d"
+  dependencies:
+    color-convert "^1.9.0"
+
 ansi-wrap@0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/ansi-wrap/-/ansi-wrap-0.1.0.tgz#a82250ddb0015e9a27ca82e82ea603bbfa45efaf"
@@ -41,11 +166,17 @@ archy@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/archy/-/archy-1.0.0.tgz#f9c8c13757cc1dd7bc379ac77b2c62a5c2868c40"
 
+arr-diff@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-2.0.0.tgz#8f3b827f955a8bd669697e4a4256ac3ceae356cf"
+  dependencies:
+    arr-flatten "^1.0.1"
+
 arr-diff@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520"
 
-arr-flatten@^1.1.0:
+arr-flatten@^1.0.1, arr-flatten@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/arr-flatten/-/arr-flatten-1.1.0.tgz#36048bbff4e7b47e136644316c99669ea5ae91f1"
 
@@ -69,6 +200,10 @@ array-uniq@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/array-uniq/-/array-uniq-1.0.3.tgz#af6ac877a25cc7f74e058894753858dfdb24fdb6"
 
+array-unique@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.2.1.tgz#a1d97ccafcbc2625cc70fadceb36a50c58b01a53"
+
 array-unique@^0.3.2:
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
@@ -125,6 +260,408 @@ aws4@^1.8.0:
   version "1.8.0"
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.8.0.tgz#f0e003d9ca9e7f59c7a508945d7b2ef9a04a542f"
 
+babel-code-frame@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
+  dependencies:
+    chalk "^1.1.3"
+    esutils "^2.0.2"
+    js-tokens "^3.0.2"
+
+babel-helper-builder-binary-assignment-operator-visitor@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-builder-binary-assignment-operator-visitor/-/babel-helper-builder-binary-assignment-operator-visitor-6.24.1.tgz#cce4517ada356f4220bcae8a02c2b346f9a56664"
+  dependencies:
+    babel-helper-explode-assignable-expression "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-helper-call-delegate@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-call-delegate/-/babel-helper-call-delegate-6.24.1.tgz#ece6aacddc76e41c3461f88bfc575bd0daa2df8d"
+  dependencies:
+    babel-helper-hoist-variables "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-traverse "^6.24.1"
+    babel-types "^6.24.1"
+
+babel-helper-define-map@^6.24.1:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-helper-define-map/-/babel-helper-define-map-6.26.0.tgz#a5f56dab41a25f97ecb498c7ebaca9819f95be5f"
+  dependencies:
+    babel-helper-function-name "^6.24.1"
+    babel-runtime "^6.26.0"
+    babel-types "^6.26.0"
+    lodash "^4.17.4"
+
+babel-helper-explode-assignable-expression@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-explode-assignable-expression/-/babel-helper-explode-assignable-expression-6.24.1.tgz#f25b82cf7dc10433c55f70592d5746400ac22caa"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-traverse "^6.24.1"
+    babel-types "^6.24.1"
+
+babel-helper-function-name@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-function-name/-/babel-helper-function-name-6.24.1.tgz#d3475b8c03ed98242a25b48351ab18399d3580a9"
+  dependencies:
+    babel-helper-get-function-arity "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+    babel-traverse "^6.24.1"
+    babel-types "^6.24.1"
+
+babel-helper-get-function-arity@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-get-function-arity/-/babel-helper-get-function-arity-6.24.1.tgz#8f7782aa93407c41d3aa50908f89b031b1b6853d"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-helper-hoist-variables@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-hoist-variables/-/babel-helper-hoist-variables-6.24.1.tgz#1ecb27689c9d25513eadbc9914a73f5408be7a76"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-helper-optimise-call-expression@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-optimise-call-expression/-/babel-helper-optimise-call-expression-6.24.1.tgz#f7a13427ba9f73f8f4fa993c54a97882d1244257"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-helper-regex@^6.24.1:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-helper-regex/-/babel-helper-regex-6.26.0.tgz#325c59f902f82f24b74faceed0363954f6495e72"
+  dependencies:
+    babel-runtime "^6.26.0"
+    babel-types "^6.26.0"
+    lodash "^4.17.4"
+
+babel-helper-remap-async-to-generator@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-remap-async-to-generator/-/babel-helper-remap-async-to-generator-6.24.1.tgz#5ec581827ad723fecdd381f1c928390676e4551b"
+  dependencies:
+    babel-helper-function-name "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+    babel-traverse "^6.24.1"
+    babel-types "^6.24.1"
+
+babel-helper-replace-supers@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helper-replace-supers/-/babel-helper-replace-supers-6.24.1.tgz#bf6dbfe43938d17369a213ca8a8bf74b6a90ab1a"
+  dependencies:
+    babel-helper-optimise-call-expression "^6.24.1"
+    babel-messages "^6.23.0"
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+    babel-traverse "^6.24.1"
+    babel-types "^6.24.1"
+
+babel-messages@^6.23.0:
+  version "6.23.0"
+  resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.23.0.tgz#f3cdf4703858035b2a2951c6ec5edf6c62f2630e"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-check-es2015-constants@^6.22.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-check-es2015-constants/-/babel-plugin-check-es2015-constants-6.22.0.tgz#35157b101426fd2ffd3da3f75c7d1e91835bbf8a"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-syntax-async-functions@^6.8.0:
+  version "6.13.0"
+  resolved "http://registry.npmjs.org/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
+
+babel-plugin-syntax-exponentiation-operator@^6.8.0:
+  version "6.13.0"
+  resolved "http://registry.npmjs.org/babel-plugin-syntax-exponentiation-operator/-/babel-plugin-syntax-exponentiation-operator-6.13.0.tgz#9ee7e8337290da95288201a6a57f4170317830de"
+
+babel-plugin-syntax-trailing-function-commas@^6.22.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-syntax-trailing-function-commas/-/babel-plugin-syntax-trailing-function-commas-6.22.0.tgz#ba0360937f8d06e40180a43fe0d5616fff532cf3"
+
+babel-plugin-transform-async-to-generator@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-async-to-generator/-/babel-plugin-transform-async-to-generator-6.24.1.tgz#6536e378aff6cb1d5517ac0e40eb3e9fc8d08761"
+  dependencies:
+    babel-helper-remap-async-to-generator "^6.24.1"
+    babel-plugin-syntax-async-functions "^6.8.0"
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-arrow-functions@^6.22.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-arrow-functions/-/babel-plugin-transform-es2015-arrow-functions-6.22.0.tgz#452692cb711d5f79dc7f85e440ce41b9f244d221"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-block-scoped-functions@^6.22.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-block-scoped-functions/-/babel-plugin-transform-es2015-block-scoped-functions-6.22.0.tgz#bbc51b49f964d70cb8d8e0b94e820246ce3a6141"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-block-scoping@^6.23.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-block-scoping/-/babel-plugin-transform-es2015-block-scoping-6.26.0.tgz#d70f5299c1308d05c12f463813b0a09e73b1895f"
+  dependencies:
+    babel-runtime "^6.26.0"
+    babel-template "^6.26.0"
+    babel-traverse "^6.26.0"
+    babel-types "^6.26.0"
+    lodash "^4.17.4"
+
+babel-plugin-transform-es2015-classes@^6.23.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-classes/-/babel-plugin-transform-es2015-classes-6.24.1.tgz#5a4c58a50c9c9461e564b4b2a3bfabc97a2584db"
+  dependencies:
+    babel-helper-define-map "^6.24.1"
+    babel-helper-function-name "^6.24.1"
+    babel-helper-optimise-call-expression "^6.24.1"
+    babel-helper-replace-supers "^6.24.1"
+    babel-messages "^6.23.0"
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+    babel-traverse "^6.24.1"
+    babel-types "^6.24.1"
+
+babel-plugin-transform-es2015-computed-properties@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-computed-properties/-/babel-plugin-transform-es2015-computed-properties-6.24.1.tgz#6fe2a8d16895d5634f4cd999b6d3480a308159b3"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+
+babel-plugin-transform-es2015-destructuring@^6.23.0:
+  version "6.23.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-destructuring/-/babel-plugin-transform-es2015-destructuring-6.23.0.tgz#997bb1f1ab967f682d2b0876fe358d60e765c56d"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-duplicate-keys@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-duplicate-keys/-/babel-plugin-transform-es2015-duplicate-keys-6.24.1.tgz#73eb3d310ca969e3ef9ec91c53741a6f1576423e"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-plugin-transform-es2015-for-of@^6.23.0:
+  version "6.23.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-for-of/-/babel-plugin-transform-es2015-for-of-6.23.0.tgz#f47c95b2b613df1d3ecc2fdb7573623c75248691"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-function-name@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-function-name/-/babel-plugin-transform-es2015-function-name-6.24.1.tgz#834c89853bc36b1af0f3a4c5dbaa94fd8eacaa8b"
+  dependencies:
+    babel-helper-function-name "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-plugin-transform-es2015-literals@^6.22.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-literals/-/babel-plugin-transform-es2015-literals-6.22.0.tgz#4f54a02d6cd66cf915280019a31d31925377ca2e"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-modules-amd@^6.22.0, babel-plugin-transform-es2015-modules-amd@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-amd/-/babel-plugin-transform-es2015-modules-amd-6.24.1.tgz#3b3e54017239842d6d19c3011c4bd2f00a00d154"
+  dependencies:
+    babel-plugin-transform-es2015-modules-commonjs "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+
+babel-plugin-transform-es2015-modules-commonjs@^6.23.0, babel-plugin-transform-es2015-modules-commonjs@^6.24.1:
+  version "6.26.2"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-commonjs/-/babel-plugin-transform-es2015-modules-commonjs-6.26.2.tgz#58a793863a9e7ca870bdc5a881117ffac27db6f3"
+  dependencies:
+    babel-plugin-transform-strict-mode "^6.24.1"
+    babel-runtime "^6.26.0"
+    babel-template "^6.26.0"
+    babel-types "^6.26.0"
+
+babel-plugin-transform-es2015-modules-systemjs@^6.23.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-systemjs/-/babel-plugin-transform-es2015-modules-systemjs-6.24.1.tgz#ff89a142b9119a906195f5f106ecf305d9407d23"
+  dependencies:
+    babel-helper-hoist-variables "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+
+babel-plugin-transform-es2015-modules-umd@^6.23.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-modules-umd/-/babel-plugin-transform-es2015-modules-umd-6.24.1.tgz#ac997e6285cd18ed6176adb607d602344ad38468"
+  dependencies:
+    babel-plugin-transform-es2015-modules-amd "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+
+babel-plugin-transform-es2015-object-super@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-object-super/-/babel-plugin-transform-es2015-object-super-6.24.1.tgz#24cef69ae21cb83a7f8603dad021f572eb278f8d"
+  dependencies:
+    babel-helper-replace-supers "^6.24.1"
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-parameters@^6.23.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz#57ac351ab49caf14a97cd13b09f66fdf0a625f2b"
+  dependencies:
+    babel-helper-call-delegate "^6.24.1"
+    babel-helper-get-function-arity "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+    babel-traverse "^6.24.1"
+    babel-types "^6.24.1"
+
+babel-plugin-transform-es2015-shorthand-properties@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-shorthand-properties/-/babel-plugin-transform-es2015-shorthand-properties-6.24.1.tgz#24f875d6721c87661bbd99a4622e51f14de38aa0"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-plugin-transform-es2015-spread@^6.22.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-spread/-/babel-plugin-transform-es2015-spread-6.22.0.tgz#d6d68a99f89aedc4536c81a542e8dd9f1746f8d1"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-sticky-regex@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-sticky-regex/-/babel-plugin-transform-es2015-sticky-regex-6.24.1.tgz#00c1cdb1aca71112cdf0cf6126c2ed6b457ccdbc"
+  dependencies:
+    babel-helper-regex "^6.24.1"
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-plugin-transform-es2015-template-literals@^6.22.0:
+  version "6.22.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-template-literals/-/babel-plugin-transform-es2015-template-literals-6.22.0.tgz#a84b3450f7e9f8f1f6839d6d687da84bb1236d8d"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-typeof-symbol@^6.23.0:
+  version "6.23.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-typeof-symbol/-/babel-plugin-transform-es2015-typeof-symbol-6.23.0.tgz#dec09f1cddff94b52ac73d505c84df59dcceb372"
+  dependencies:
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-es2015-unicode-regex@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-unicode-regex/-/babel-plugin-transform-es2015-unicode-regex-6.24.1.tgz#d38b12f42ea7323f729387f18a7c5ae1faeb35e9"
+  dependencies:
+    babel-helper-regex "^6.24.1"
+    babel-runtime "^6.22.0"
+    regexpu-core "^2.0.0"
+
+babel-plugin-transform-exponentiation-operator@^6.22.0:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-exponentiation-operator/-/babel-plugin-transform-exponentiation-operator-6.24.1.tgz#2ab0c9c7f3098fa48907772bb813fe41e8de3a0e"
+  dependencies:
+    babel-helper-builder-binary-assignment-operator-visitor "^6.24.1"
+    babel-plugin-syntax-exponentiation-operator "^6.8.0"
+    babel-runtime "^6.22.0"
+
+babel-plugin-transform-regenerator@^6.22.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-regenerator/-/babel-plugin-transform-regenerator-6.26.0.tgz#e0703696fbde27f0a3efcacf8b4dca2f7b3a8f2f"
+  dependencies:
+    regenerator-transform "^0.10.0"
+
+babel-plugin-transform-strict-mode@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-plugin-transform-strict-mode/-/babel-plugin-transform-strict-mode-6.24.1.tgz#d5faf7aa578a65bbe591cf5edae04a0c67020758"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-types "^6.24.1"
+
+babel-preset-env@^1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/babel-preset-env/-/babel-preset-env-1.7.0.tgz#dea79fa4ebeb883cd35dab07e260c1c9c04df77a"
+  dependencies:
+    babel-plugin-check-es2015-constants "^6.22.0"
+    babel-plugin-syntax-trailing-function-commas "^6.22.0"
+    babel-plugin-transform-async-to-generator "^6.22.0"
+    babel-plugin-transform-es2015-arrow-functions "^6.22.0"
+    babel-plugin-transform-es2015-block-scoped-functions "^6.22.0"
+    babel-plugin-transform-es2015-block-scoping "^6.23.0"
+    babel-plugin-transform-es2015-classes "^6.23.0"
+    babel-plugin-transform-es2015-computed-properties "^6.22.0"
+    babel-plugin-transform-es2015-destructuring "^6.23.0"
+    babel-plugin-transform-es2015-duplicate-keys "^6.22.0"
+    babel-plugin-transform-es2015-for-of "^6.23.0"
+    babel-plugin-transform-es2015-function-name "^6.22.0"
+    babel-plugin-transform-es2015-literals "^6.22.0"
+    babel-plugin-transform-es2015-modules-amd "^6.22.0"
+    babel-plugin-transform-es2015-modules-commonjs "^6.23.0"
+    babel-plugin-transform-es2015-modules-systemjs "^6.23.0"
+    babel-plugin-transform-es2015-modules-umd "^6.23.0"
+    babel-plugin-transform-es2015-object-super "^6.22.0"
+    babel-plugin-transform-es2015-parameters "^6.23.0"
+    babel-plugin-transform-es2015-shorthand-properties "^6.22.0"
+    babel-plugin-transform-es2015-spread "^6.22.0"
+    babel-plugin-transform-es2015-sticky-regex "^6.22.0"
+    babel-plugin-transform-es2015-template-literals "^6.22.0"
+    babel-plugin-transform-es2015-typeof-symbol "^6.23.0"
+    babel-plugin-transform-es2015-unicode-regex "^6.22.0"
+    babel-plugin-transform-exponentiation-operator "^6.22.0"
+    babel-plugin-transform-regenerator "^6.22.0"
+    browserslist "^3.2.6"
+    invariant "^2.2.2"
+    semver "^5.3.0"
+
+babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
+  dependencies:
+    core-js "^2.4.0"
+    regenerator-runtime "^0.11.0"
+
+babel-template@^6.24.1, babel-template@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.26.0.tgz#de03e2d16396b069f46dd9fff8521fb1a0e35e02"
+  dependencies:
+    babel-runtime "^6.26.0"
+    babel-traverse "^6.26.0"
+    babel-types "^6.26.0"
+    babylon "^6.18.0"
+    lodash "^4.17.4"
+
+babel-traverse@^6.24.1, babel-traverse@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-traverse/-/babel-traverse-6.26.0.tgz#46a9cbd7edcc62c8e5c064e2d2d8d0f4035766ee"
+  dependencies:
+    babel-code-frame "^6.26.0"
+    babel-messages "^6.23.0"
+    babel-runtime "^6.26.0"
+    babel-types "^6.26.0"
+    babylon "^6.18.0"
+    debug "^2.6.8"
+    globals "^9.18.0"
+    invariant "^2.2.2"
+    lodash "^4.17.4"
+
+babel-types@^6.19.0, babel-types@^6.24.1, babel-types@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.26.0.tgz#a3b073f94ab49eb6fa55cd65227a334380632497"
+  dependencies:
+    babel-runtime "^6.26.0"
+    esutils "^2.0.2"
+    lodash "^4.17.4"
+    to-fast-properties "^1.0.3"
+
+babylon@^6.18.0:
+  version "6.18.0"
+  resolved "https://registry.yarnpkg.com/babylon/-/babylon-6.18.0.tgz#af2f3b88fa6f5c1e4c634d1a0f8eac4f55b395e3"
+
 balanced-match@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
@@ -170,6 +707,14 @@ brace-expansion@^1.0.0, brace-expansion@^1.1.7:
     balanced-match "^1.0.0"
     concat-map "0.0.1"
 
+braces@^1.8.2:
+  version "1.8.5"
+  resolved "https://registry.yarnpkg.com/braces/-/braces-1.8.5.tgz#ba77962e12dff969d6b76711e914b737857bf6a7"
+  dependencies:
+    expand-range "^1.8.1"
+    preserve "^0.2.0"
+    repeat-element "^1.1.2"
+
 braces@^2.3.1:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/braces/-/braces-2.3.2.tgz#5979fd3f14cd531565e5fa2df1abfff1dfaee729"
@@ -185,10 +730,21 @@ braces@^2.3.1:
     split-string "^3.0.2"
     to-regex "^3.0.1"
 
+browserslist@^3.2.6:
+  version "3.2.8"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-3.2.8.tgz#b0005361d6471f0f5952797a76fc985f1f978fc6"
+  dependencies:
+    caniuse-lite "^1.0.30000844"
+    electron-to-chromium "^1.3.47"
+
 buffer-from@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
 
+builtin-modules@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-3.0.0.tgz#1e587d44b006620d90286cc7a9238bbc6129cab1"
+
 cache-base@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/cache-base/-/cache-base-1.0.1.tgz#0a7f46416831c8b662ee36fe4e7c59d76f666ab2"
@@ -207,6 +763,10 @@ camelcase@^1.0.2:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-1.2.1.tgz#9bb5304d2e0b56698b2c758b08a3eaa9daa58a39"
 
+caniuse-lite@^1.0.30000844:
+  version "1.0.30000923"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000923.tgz#148f9bda508024b5ce957b463ae2e8302b451bb2"
+
 caseless@~0.11.0:
   version "0.11.0"
   resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.11.0.tgz#715b96ea9841593cc33067923f5ec60ebda4f7d7"
@@ -230,7 +790,7 @@ chai@^3.0.0:
     deep-eql "^0.1.3"
     type-detect "^1.0.0"
 
-chalk@^1.0.0, chalk@^1.1.1:
+chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3:
   version "1.1.3"
   resolved "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
   dependencies:
@@ -240,6 +800,14 @@ chalk@^1.0.0, chalk@^1.1.1:
     strip-ansi "^3.0.0"
     supports-color "^2.0.0"
 
+chalk@^2.0.0:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.1.tgz#18c49ab16a037b6eb0152cc83e3471338215b66e"
+  dependencies:
+    ansi-styles "^3.2.1"
+    escape-string-regexp "^1.0.5"
+    supports-color "^5.3.0"
+
 class-utils@^0.3.5:
   version "0.3.6"
   resolved "https://registry.yarnpkg.com/class-utils/-/class-utils-0.3.6.tgz#f93369ae8b9a7ce02fd41faad0ca83033190c463"
@@ -276,6 +844,16 @@ collection-visit@^1.0.0:
     map-visit "^1.0.0"
     object-visit "^1.0.0"
 
+color-convert@^1.9.0:
+  version "1.9.3"
+  resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
+  dependencies:
+    color-name "1.1.3"
+
+color-name@1.1.3:
+  version "1.1.3"
+  resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
+
 color-support@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
@@ -323,10 +901,20 @@ concat-stream@1.6.2:
     readable-stream "^2.2.2"
     typedarray "^0.0.6"
 
+convert-source-map@^1.1.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.6.0.tgz#51b537a8c43e0f04dec1993bffcdd504e758ac20"
+  dependencies:
+    safe-buffer "~5.1.1"
+
 copy-descriptor@^0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d"
 
+core-js@^2.4.0:
+  version "2.6.1"
+  resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.1.tgz#87416ae817de957a3f249b3b5ca475d4aaed6042"
+
 core-util-is@1.0.2, core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
@@ -359,7 +947,7 @@ deap@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/deap/-/deap-1.0.1.tgz#0646e9e1a095ffe8a9e404d68d1f76dcf57e66fb"
 
-debug@*:
+debug@*, debug@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.0.tgz#373687bffa678b38b1cd91f861b63850035ddc87"
   dependencies:
@@ -369,7 +957,7 @@ debug@0.7.4:
   version "0.7.4"
   resolved "http://registry.npmjs.org/debug/-/debug-0.7.4.tgz#06e1ea8082c2cb14e39806e22e2f6f757f92af39"
 
-debug@2.6.9, debug@^2.2.0, debug@^2.3.3:
+debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
   dependencies:
@@ -449,20 +1037,32 @@ ecc-jsbn@~0.1.1:
     jsbn "~0.1.0"
     safer-buffer "^2.1.0"
 
+electron-to-chromium@^1.3.47:
+  version "1.3.96"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.96.tgz#25770ec99b8b07706dedf3a5f43fa50cb54c4f9a"
+
 end-of-stream@~0.1.5:
   version "0.1.5"
   resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-0.1.5.tgz#8e177206c3c80837d85632e8b9359dfe8b2f6eaf"
   dependencies:
     once "~1.3.0"
 
-es6-promise@^4.0.3:
+es6-promise@^4.0.3, es6-promise@^4.2.5:
   version "4.2.5"
   resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.5.tgz#da6d0d5692efb461e082c14817fe2427d8f5d054"
 
-escape-string-regexp@^1.0.2:
+escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
 
+estree-walker@^0.5.2:
+  version "0.5.2"
+  resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-0.5.2.tgz#d3850be7529c9580d815600b53126515e146dd39"
+
+esutils@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.2.tgz#0abf4f1caa5bcb1f7a9d8acc6dea4faaa04bac9b"
+
 execa@^0.6.0:
   version "0.6.3"
   resolved "https://registry.yarnpkg.com/execa/-/execa-0.6.3.tgz#57b69a594f081759c69e5370f0d17b9cb11658fe"
@@ -475,6 +1075,12 @@ execa@^0.6.0:
     signal-exit "^3.0.0"
     strip-eof "^1.0.0"
 
+expand-brackets@^0.1.4:
+  version "0.1.5"
+  resolved "https://registry.yarnpkg.com/expand-brackets/-/expand-brackets-0.1.5.tgz#df07284e342a807cd733ac5af72411e581d1177b"
+  dependencies:
+    is-posix-bracket "^0.1.0"
+
 expand-brackets@^2.1.4:
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/expand-brackets/-/expand-brackets-2.1.4.tgz#b77735e315ce30f6b6eff0f83b04151a22449622"
@@ -487,6 +1093,12 @@ expand-brackets@^2.1.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
+expand-range@^1.8.1:
+  version "1.8.2"
+  resolved "http://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz#a299effd335fe2721ebae8e257ec79644fc85337"
+  dependencies:
+    fill-range "^2.1.0"
+
 expand-tilde@^2.0.0, expand-tilde@^2.0.2:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/expand-tilde/-/expand-tilde-2.0.2.tgz#97e801aa052df02454de46b02bf621642cdc8502"
@@ -510,6 +1122,12 @@ extend@^3.0.0, extend@~3.0.0, extend@~3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa"
 
+extglob@^0.3.1:
+  version "0.3.2"
+  resolved "https://registry.yarnpkg.com/extglob/-/extglob-0.3.2.tgz#2e18ff3d2f49ab2765cec9023f011daa8d8349a1"
+  dependencies:
+    is-extglob "^1.0.0"
+
 extglob@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/extglob/-/extglob-2.0.4.tgz#ad00fe4dc612a9232e8718711dc5cb5ab0285543"
@@ -571,6 +1189,20 @@ fd-slicer@~1.0.1:
   dependencies:
     pend "~1.2.0"
 
+filename-regex@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/filename-regex/-/filename-regex-2.0.1.tgz#c1c4b9bee3e09725ddb106b75c1e301fe2f18b26"
+
+fill-range@^2.1.0:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-2.2.4.tgz#eb1e773abb056dcd8df2bfdf6af59b8b3a936565"
+  dependencies:
+    is-number "^2.1.0"
+    isobject "^2.0.0"
+    randomatic "^3.0.0"
+    repeat-element "^1.1.2"
+    repeat-string "^1.5.2"
+
 fill-range@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-4.0.0.tgz#d544811d428f98eb06a63dc402d2403c328c38f7"
@@ -615,6 +1247,12 @@ for-in@^1.0.1, for-in@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"
 
+for-own@^0.1.4:
+  version "0.1.5"
+  resolved "https://registry.yarnpkg.com/for-own/-/for-own-0.1.5.tgz#5265c681a4f294dabbf17c9509b6763aa84510ce"
+  dependencies:
+    for-in "^1.0.1"
+
 for-own@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/for-own/-/for-own-1.0.0.tgz#c63332f415cedc4b04dbfe70cf836494c53cb44b"
@@ -701,6 +1339,19 @@ getpass@^0.1.1:
   dependencies:
     assert-plus "^1.0.0"
 
+glob-base@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/glob-base/-/glob-base-0.3.0.tgz#dbb164f6221b1c0b1ccf82aea328b497df0ea3c4"
+  dependencies:
+    glob-parent "^2.0.0"
+    is-glob "^2.0.0"
+
+glob-parent@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/glob-parent/-/glob-parent-2.0.0.tgz#81383d72db054fcccf5336daa902f182f6edbb28"
+  dependencies:
+    is-glob "^2.0.0"
+
 glob-stream@^3.1.5:
   version "3.1.18"
   resolved "https://registry.yarnpkg.com/glob-stream/-/glob-stream-3.1.18.tgz#9170a5f12b790306fdfe598f313f8f7954fd143b"
@@ -778,6 +1429,14 @@ global-prefix@^1.0.1:
     is-windows "^1.0.1"
     which "^1.2.14"
 
+globals@^11.1.0:
+  version "11.9.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-11.9.0.tgz#bde236808e987f290768a93d065060d78e6ab249"
+
+globals@^9.18.0:
+  version "9.18.0"
+  resolved "https://registry.yarnpkg.com/globals/-/globals-9.18.0.tgz#aa3896b3e69b487f17e31ed2143d69a8e30c2d8a"
+
 globule@~0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/globule/-/globule-0.1.0.tgz#d9c8edde1da79d125a151b79533b978676346ae5"
@@ -922,6 +1581,10 @@ has-ansi@^2.0.0:
   dependencies:
     ansi-regex "^2.0.0"
 
+has-flag@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
+
 has-gulplog@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/has-gulplog/-/has-gulplog-0.1.0.tgz#6414c82913697da51590397dafb12f22967811ce"
@@ -1020,6 +1683,12 @@ interpret@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614"
 
+invariant@^2.2.2:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
+  dependencies:
+    loose-envify "^1.0.0"
+
 is-absolute@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-absolute/-/is-absolute-1.0.0.tgz#395e1ae84b11f26ad1795e73c17378e48a301576"
@@ -1071,6 +1740,16 @@ is-descriptor@^1.0.0, is-descriptor@^1.0.2:
     is-data-descriptor "^1.0.0"
     kind-of "^6.0.2"
 
+is-dotfile@^1.0.0:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/is-dotfile/-/is-dotfile-1.0.3.tgz#a6a2f32ffd2dfb04f5ca25ecd0f6b83cf798a1e1"
+
+is-equal-shallow@^0.1.3:
+  version "0.1.3"
+  resolved "https://registry.yarnpkg.com/is-equal-shallow/-/is-equal-shallow-0.1.3.tgz#2238098fc221de0bcfa5d9eac4c45d638aa1c534"
+  dependencies:
+    is-primitive "^2.0.0"
+
 is-extendable@^0.1.0, is-extendable@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/is-extendable/-/is-extendable-0.1.1.tgz#62b110e289a471418e3ec36a617d472e301dfc89"
@@ -1081,16 +1760,30 @@ is-extendable@^1.0.1:
   dependencies:
     is-plain-object "^2.0.4"
 
+is-extglob@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-1.0.0.tgz#ac468177c4943405a092fc8f29760c6ffc6206c0"
+
 is-extglob@^2.1.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
 
+is-glob@^2.0.0, is-glob@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-2.0.1.tgz#d096f926a3ded5600f3fdfd91198cb0888c2d863"
+  dependencies:
+    is-extglob "^1.0.0"
+
 is-glob@^3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-3.1.0.tgz#7ba5ae24217804ac70707b96922567486cc3e84a"
   dependencies:
     is-extglob "^2.1.0"
 
+is-module@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/is-module/-/is-module-1.0.0.tgz#3258fb69f78c14d5b815d664336b4cffb6441591"
+
 is-my-ip-valid@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-my-ip-valid/-/is-my-ip-valid-1.0.0.tgz#7b351b8e8edd4d3995d4d066680e664d94696824"
@@ -1105,18 +1798,36 @@ is-my-json-valid@^2.12.4:
     jsonpointer "^4.0.0"
     xtend "^4.0.0"
 
+is-number@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/is-number/-/is-number-2.1.0.tgz#01fcbbb393463a548f2f466cce16dece49db908f"
+  dependencies:
+    kind-of "^3.0.2"
+
 is-number@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195"
   dependencies:
     kind-of "^3.0.2"
 
+is-number@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/is-number/-/is-number-4.0.0.tgz#0026e37f5454d73e356dfe6564699867c6a7f0ff"
+
 is-plain-object@^2.0.1, is-plain-object@^2.0.3, is-plain-object@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-2.0.4.tgz#2c163b3fafb1b606d9d17928f05c2a1c38e07677"
   dependencies:
     isobject "^3.0.1"
 
+is-posix-bracket@^0.1.0:
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz#3334dc79774368e92f016e6fbc0a88f5cd6e6bc4"
+
+is-primitive@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/is-primitive/-/is-primitive-2.0.0.tgz#207bab91638499c07b2adf240a41a87210034575"
+
 is-property@^1.0.0, is-property@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/is-property/-/is-property-1.0.2.tgz#57fe1c4e48474edd65b09911f26b1cd4095dda84"
@@ -1186,10 +1897,26 @@ jquery@^3.0:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.3.1.tgz#958ce29e81c9790f31be7792df5d4d95fc57fbca"
 
+"js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
+
+js-tokens@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
+
 jsbn@~0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
 
+jsesc@^2.5.1:
+  version "2.5.2"
+  resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4"
+
+jsesc@~0.5.0:
+  version "0.5.0"
+  resolved "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d"
+
 json-schema-traverse@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660"
@@ -1202,6 +1929,12 @@ json-stringify-safe@~5.0.1:
   version "5.0.1"
   resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
 
+json5@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/json5/-/json5-2.1.0.tgz#e7a0c62c48285c628d20a10b85c89bb807c32850"
+  dependencies:
+    minimist "^1.2.0"
+
 jsonfile@^2.1.0:
   version "2.4.0"
   resolved "http://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz#3736a2b428b87bbda0cc83b53fa3d633a35c2ae8"
@@ -1351,7 +2084,7 @@ lodash.templatesettings@^3.0.0:
     lodash._reinterpolate "^3.0.0"
     lodash.escape "^3.0.0"
 
-lodash@^4.17.10:
+lodash@^4.17.10, lodash@^4.17.4:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
 
@@ -1363,6 +2096,12 @@ longest@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/longest/-/longest-1.0.1.tgz#30a0b2da38f73770e8294a0d22e6625ed77d0097"
 
+loose-envify@^1.0.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
+  dependencies:
+    js-tokens "^3.0.0 || ^4.0.0"
+
 lru-cache@2:
   version "2.7.3"
   resolved "http://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz#6d4524e8b955f95d4f5b58851ce21dd72fb4e952"
@@ -1374,6 +2113,12 @@ lru-cache@^4.0.1:
     pseudomap "^1.0.2"
     yallist "^3.0.2"
 
+magic-string@^0.25.1:
+  version "0.25.1"
+  resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.1.tgz#b1c248b399cd7485da0fe7385c2fc7011843266e"
+  dependencies:
+    sourcemap-codec "^1.4.1"
+
 make-iterator@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/make-iterator/-/make-iterator-1.0.1.tgz#29b33f312aa8f547c4a5e490f56afcec99133ad6"
@@ -1390,6 +2135,28 @@ map-visit@^1.0.0:
   dependencies:
     object-visit "^1.0.0"
 
+math-random@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/math-random/-/math-random-1.0.1.tgz#8b3aac588b8a66e4975e3cdea67f7bb329601fac"
+
+micromatch@^2.3.11:
+  version "2.3.11"
+  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-2.3.11.tgz#86677c97d1720b363431d04d0d15293bd38c1565"
+  dependencies:
+    arr-diff "^2.0.0"
+    array-unique "^0.2.1"
+    braces "^1.8.2"
+    expand-brackets "^0.1.4"
+    extglob "^0.3.1"
+    filename-regex "^2.0.0"
+    is-extglob "^1.0.0"
+    is-glob "^2.0.1"
+    kind-of "^3.0.2"
+    normalize-path "^2.0.1"
+    object.omit "^2.0.0"
+    parse-glob "^3.0.4"
+    regex-cache "^0.4.2"
+
 micromatch@^3.0.4:
   version "3.1.10"
   resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-3.1.10.tgz#70859bc95c9840952f359a068a3fc49f9ecfac23"
@@ -1441,7 +2208,7 @@ minimist@0.0.8:
   version "0.0.8"
   resolved "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
 
-minimist@^1.1.0:
+minimist@^1.1.0, minimist@^1.2.0:
   version "1.2.0"
   resolved "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
 
@@ -1533,6 +2300,12 @@ node-uuid@~1.4.7:
   version "1.4.8"
   resolved "https://registry.yarnpkg.com/node-uuid/-/node-uuid-1.4.8.tgz#b040eb0923968afabf8d32fb1f17f1167fdab907"
 
+normalize-path@^2.0.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/normalize-path/-/normalize-path-2.1.1.tgz#1ab28b556e198363a8c1a6f7e6fa20137fe6aed9"
+  dependencies:
+    remove-trailing-separator "^1.0.1"
+
 npm-run-path@^2.0.0:
   version "2.0.2"
   resolved "https://registry.yarnpkg.com/npm-run-path/-/npm-run-path-2.0.2.tgz#35a9232dfa35d7067b4cb2ddf2357b1871536c5f"
@@ -1581,6 +2354,13 @@ object.map@^1.0.0:
     for-own "^1.0.0"
     make-iterator "^1.0.0"
 
+object.omit@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/object.omit/-/object.omit-2.0.1.tgz#1a9c744829f39dbb858c76ca3579ae2a54ebd1fa"
+  dependencies:
+    for-own "^0.1.4"
+    is-extendable "^0.1.1"
+
 object.pick@^1.2.0, object.pick@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/object.pick/-/object.pick-1.3.0.tgz#87a10ac4c1694bd2e1cbf53591a66141fb5dd747"
@@ -1627,6 +2407,15 @@ parse-filepath@^1.0.1:
     map-cache "^0.2.0"
     path-root "^0.1.1"
 
+parse-glob@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/parse-glob/-/parse-glob-3.0.4.tgz#b2c376cfb11f35513badd173ef0bb6e3a388391c"
+  dependencies:
+    glob-base "^0.3.0"
+    is-dotfile "^1.0.0"
+    is-extglob "^1.0.0"
+    is-glob "^2.0.0"
+
 parse-passwd@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6"
@@ -1643,7 +2432,7 @@ path-key@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/path-key/-/path-key-2.0.1.tgz#411cadb574c5a140d3a4b1910d40d80cc9f40b40"
 
-path-parse@^1.0.5:
+path-parse@^1.0.5, path-parse@^1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.6.tgz#d62dbb5679405d72c4737ec58600e9ddcf06d24c"
 
@@ -1706,6 +2495,10 @@ posix-character-classes@^0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"
 
+preserve@^0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
+
 prettier-check@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/prettier-check/-/prettier-check-2.0.0.tgz#edd086ee12d270579233ccb136a16e6afcfba1ae"
@@ -1720,6 +2513,10 @@ pretty-hrtime@^1.0.0:
   version "1.0.3"
   resolved "http://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"
 
+private@^0.1.6:
+  version "0.1.8"
+  resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
+
 process-nextick-args@~1.0.6:
   version "1.0.7"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-1.0.7.tgz#150e20b756590ad3f91093f25a4f2ad8bff30ba3"
@@ -1756,6 +2553,14 @@ qs@~6.5.2:
   version "6.5.2"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"
 
+randomatic@^3.0.0:
+  version "3.1.1"
+  resolved "https://registry.yarnpkg.com/randomatic/-/randomatic-3.1.1.tgz#b776efc59375984e36c537b2f51a1f0aff0da1ed"
+  dependencies:
+    is-number "^4.0.0"
+    kind-of "^6.0.0"
+    math-random "^1.0.1"
+
 "readable-stream@>=1.0.33-1 <1.1.0-0", readable-stream@~1.0.17:
   version "1.0.34"
   resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
@@ -1803,6 +2608,28 @@ rechoir@^0.6.2:
   dependencies:
     resolve "^1.1.6"
 
+regenerate@^1.2.1:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.0.tgz#4a856ec4b56e4077c557589cae85e7a4c8869a11"
+
+regenerator-runtime@^0.11.0:
+  version "0.11.1"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
+
+regenerator-transform@^0.10.0:
+  version "0.10.1"
+  resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.10.1.tgz#1e4996837231da8b7f3cf4114d71b5691a0680dd"
+  dependencies:
+    babel-runtime "^6.18.0"
+    babel-types "^6.19.0"
+    private "^0.1.6"
+
+regex-cache@^0.4.2:
+  version "0.4.4"
+  resolved "https://registry.yarnpkg.com/regex-cache/-/regex-cache-0.4.4.tgz#75bdc58a2a1496cec48a12835bc54c8d562336dd"
+  dependencies:
+    is-equal-shallow "^0.1.3"
+
 regex-not@^1.0.0, regex-not@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/regex-not/-/regex-not-1.0.2.tgz#1f4ece27e00b0b65e0247a6810e6a85d83a5752c"
@@ -1810,6 +2637,28 @@ regex-not@^1.0.0, regex-not@^1.0.2:
     extend-shallow "^3.0.2"
     safe-regex "^1.1.0"
 
+regexpu-core@^2.0.0:
+  version "2.0.0"
+  resolved "http://registry.npmjs.org/regexpu-core/-/regexpu-core-2.0.0.tgz#49d038837b8dcf8bfa5b9a42139938e6ea2ae240"
+  dependencies:
+    regenerate "^1.2.1"
+    regjsgen "^0.2.0"
+    regjsparser "^0.1.4"
+
+regjsgen@^0.2.0:
+  version "0.2.0"
+  resolved "http://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz#6c016adeac554f75823fe37ac05b92d5a4edb1f7"
+
+regjsparser@^0.1.4:
+  version "0.1.5"
+  resolved "http://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz#7ee8f84dc6fa792d3fd0ae228d24bd949ead205c"
+  dependencies:
+    jsesc "~0.5.0"
+
+remove-trailing-separator@^1.0.1:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz#c24bce2a283adad5bc3f58e0d48249b92379d8ef"
+
 repeat-element@^1.1.2:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.3.tgz#782e0d825c0c5a3bb39731f84efee6b742e6b1ce"
@@ -1895,6 +2744,12 @@ resolve@^1.1.6, resolve@^1.1.7:
   dependencies:
     path-parse "^1.0.5"
 
+resolve@^1.3.2, resolve@^1.8.1:
+  version "1.9.0"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.9.0.tgz#a14c6fdfa8f92a7df1d996cb7105fa744658ea06"
+  dependencies:
+    path-parse "^1.0.6"
+
 ret@~0.1.10:
   version "0.1.15"
   resolved "https://registry.yarnpkg.com/ret/-/ret-0.1.15.tgz#b8a4825d5bdb1fc3f6f53c2bc33f81388681c7bc"
@@ -1911,6 +2766,44 @@ rimraf@^2.2.8:
   dependencies:
     glob "^7.0.5"
 
+rollup-plugin-babel@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-babel/-/rollup-plugin-babel-4.1.0.tgz#c97f50c82aa8e89ddaa116cdc5c832b8ba74db17"
+  dependencies:
+    "@babel/helper-module-imports" "^7.0.0"
+    rollup-pluginutils "^2.3.0"
+
+rollup-plugin-commonjs@^9.2.0:
+  version "9.2.0"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-commonjs/-/rollup-plugin-commonjs-9.2.0.tgz#4604e25069e0c78a09e08faa95dc32dec27f7c89"
+  dependencies:
+    estree-walker "^0.5.2"
+    magic-string "^0.25.1"
+    resolve "^1.8.1"
+    rollup-pluginutils "^2.3.3"
+
+rollup-plugin-node-resolve@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-node-resolve/-/rollup-plugin-node-resolve-4.0.0.tgz#9bc6b8205e9936cc0e26bba2415f1ecf1e64d9b2"
+  dependencies:
+    builtin-modules "^3.0.0"
+    is-module "^1.0.0"
+    resolve "^1.8.1"
+
+rollup-pluginutils@^2.3.0, rollup-pluginutils@^2.3.3:
+  version "2.3.3"
+  resolved "https://registry.yarnpkg.com/rollup-pluginutils/-/rollup-pluginutils-2.3.3.tgz#3aad9b1eb3e7fe8262820818840bf091e5ae6794"
+  dependencies:
+    estree-walker "^0.5.2"
+    micromatch "^2.3.11"
+
+rollup@^0.68.1:
+  version "0.68.1"
+  resolved "https://registry.yarnpkg.com/rollup/-/rollup-0.68.1.tgz#40d03872d3b05848fb023b12ebf7c6d69cab84c5"
+  dependencies:
+    "@types/estree" "0.0.39"
+    "@types/node" "*"
+
 safe-buffer@^5.0.1, safe-buffer@^5.1.2, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
@@ -1929,6 +2822,10 @@ semver@^4.1.0, semver@^4.3.1:
   version "4.3.6"
   resolved "http://registry.npmjs.org/semver/-/semver-4.3.6.tgz#300bc6e0e86374f7ba61068b5b1ecd57fc6532da"
 
+semver@^5.3.0, semver@^5.4.1:
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
+
 sequencify@~0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/sequencify/-/sequencify-0.0.7.tgz#90cff19d02e07027fd767f5ead3e7b95d1e7380c"
@@ -2016,10 +2913,14 @@ source-map-url@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
 
-source-map@^0.5.1, source-map@^0.5.6, source-map@~0.5.1:
+source-map@^0.5.0, source-map@^0.5.1, source-map@^0.5.6, source-map@~0.5.1:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
 
+sourcemap-codec@^1.4.1:
+  version "1.4.4"
+  resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.4.tgz#c63ea927c029dd6bd9a2b7fa03b3fec02ad56e9f"
+
 sparkles@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/sparkles/-/sparkles-1.0.1.tgz#008db65edce6c50eec0c5e228e1945061dd0437c"
@@ -2090,6 +2991,12 @@ supports-color@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
 
+supports-color@^5.3.0:
+  version "5.5.0"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
+  dependencies:
+    has-flag "^3.0.0"
+
 throttleit@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/throttleit/-/throttleit-1.0.0.tgz#9e785836daf46743145a5984b6268d828528ac6c"
@@ -2125,6 +3032,14 @@ time-stamp@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-1.1.0.tgz#764a5a11af50561921b133f3b44e618687e0f5c3"
 
+to-fast-properties@^1.0.3:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.3.tgz#b83571fa4d8c25b82e231b06e3a3055de4ca1a47"
+
+to-fast-properties@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"
+
 to-object-path@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/to-object-path/-/to-object-path-0.3.0.tgz#297588b7b0e7e0ac08e04e672f85c1f4999e17af"
@@ -2158,6 +3073,10 @@ tough-cookie@~2.4.3:
     psl "^1.1.24"
     punycode "^1.4.1"
 
+trim-right@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"
+
 tunnel-agent@^0.6.0:
   version "0.6.0"
   resolved "https://registry.yarnpkg.com/tunnel-agent/-/tunnel-agent-0.6.0.tgz#27a5dea06b36b04a0a9966774b290868f0fc40fd"

From a69748d2ace6954565f8f7b5fd3226abfe4590d8 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 22 Dec 2018 12:16:45 +0100
Subject: [PATCH 02/65] New iife file used for tests

---
 test/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/index.html b/test/index.html
index 560c22a..ab1ba1e 100644
--- a/test/index.html
+++ b/test/index.html
@@ -28,7 +28,7 @@
     <script src="lib/sinon.js"></script>
     <script src="lib/chai.js"></script>
     <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
-    <script src="../dist/js/jquery.chocolat.js"></script>
+    <script src="../dist/js/chocolat.iife.js"></script>
     <script>
       mocha.setup('bdd')
       mocha.reporter('html');

From 65946bf6519adf27d41a018e059cd10e5cf1a606 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 22 Dec 2018 21:05:59 +0100
Subject: [PATCH 03/65] Removed mocha-phantomjs in favor of mocha-chrome

---
 .travis.yml                        |    8 +-
 dist/index.html                    |    2 +-
 dist/js/chocolat.cjs.js            |    9 +-
 dist/js/chocolat.esm.js            |    9 +-
 dist/js/chocolat.iife.js           |    8 +-
 gulpfile.js                        |    1 -
 package.json                       |   14 +-
 src/js/chocolat.js                 |    6 +-
 src/js/main.esm.js                 |    4 +-
 src/js/main.iife.js                |    3 +-
 test/index.html                    |   24 +-
 test/lib/chai.js                   | 5332 ----------------------
 test/lib/mocha.css                 |  305 --
 test/lib/mocha.js                  | 6564 ----------------------------
 test/lib/sinon.js                  | 4299 ------------------
 test/{test.chocolat.js => test.js} |   94 +-
 yarn.lock                          | 1398 +++---
 17 files changed, 782 insertions(+), 17298 deletions(-)
 delete mode 100644 test/lib/chai.js
 delete mode 100644 test/lib/mocha.css
 delete mode 100644 test/lib/mocha.js
 delete mode 100644 test/lib/sinon.js
 rename test/{test.chocolat.js => test.js} (92%)

diff --git a/.travis.yml b/.travis.yml
index 0018b21..7153999 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,14 +1,10 @@
 language: node_js
 node_js:
-  - "8"
   - "10"
 install:
-  - npm install
+  - yarn install
 before_script:
-  - phantomjs --version
-  - mocha-phantomjs --version
-  - gulp compile-coffee &
   - sleep 5
 script:
   - prettier-check src/js/*.js test/*.js
-  - mocha-phantomjs test/index.html
+  - yarn test
diff --git a/dist/index.html b/dist/index.html
index 747ae4b..0de91c5 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -4,7 +4,7 @@
         <meta charset="utf-8" />
         <link rel="stylesheet" href="./css/chocolat.css" />
         <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
-        <script type="text/javascript" src="./js/chocolat.umd.js"></script>
+        <script type="text/javascript" src="./js/chocolat.iife.js"></script>
         <style>
             body {
                 text-align: center;
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index a6be65a..1dc099d 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -43,11 +43,11 @@ class Chocolat {
     var that = this;
     this.settings = settings;
     this.elems = {};
-    this.element = element;
+    this.element = $(element);
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
-    if (!this.settings.setTitle && element.data('chocolat-title')) {
-      this.settings.setTitle = element.data('chocolat-title');
+    if (!this.settings.setTitle && this.element.data('chocolat-title')) {
+      this.settings.setTitle = this.element.data('chocolat-title');
     }
 
     this.element.find(this.settings.imageSelector).each(function () {
@@ -627,10 +627,11 @@ class Chocolat {
 
 }
 
+let calls = 0;
 function main_esm (options) {
   return this.each(function () {
     calls++;
-    var settings = $.extend(true, {}, defaults, options, {
+    var settings = Object.assign({}, defaults, options, {
       setIndex: calls
     });
 
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index fd2e979..8fe1391 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -41,11 +41,11 @@ class Chocolat {
     var that = this;
     this.settings = settings;
     this.elems = {};
-    this.element = element;
+    this.element = $(element);
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
-    if (!this.settings.setTitle && element.data('chocolat-title')) {
-      this.settings.setTitle = element.data('chocolat-title');
+    if (!this.settings.setTitle && this.element.data('chocolat-title')) {
+      this.settings.setTitle = this.element.data('chocolat-title');
     }
 
     this.element.find(this.settings.imageSelector).each(function () {
@@ -625,10 +625,11 @@ class Chocolat {
 
 }
 
+let calls = 0;
 function main_esm (options) {
   return this.each(function () {
     calls++;
-    var settings = $.extend(true, {}, defaults, options, {
+    var settings = Object.assign({}, defaults, options, {
       setIndex: calls
     });
 
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 7a87361..3c688c1 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -44,11 +44,11 @@
         var that = this;
         this.settings = settings;
         this.elems = {};
-        this.element = element;
+        this.element = $(element);
         this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
-        if (!this.settings.setTitle && element.data('chocolat-title')) {
-          this.settings.setTitle = element.data('chocolat-title');
+        if (!this.settings.setTitle && this.element.data('chocolat-title')) {
+          this.settings.setTitle = this.element.data('chocolat-title');
         }
 
         this.element.find(this.settings.imageSelector).each(function () {
@@ -633,7 +633,7 @@
     $.fn.Chocolat = function (options) {
       return this.each(function () {
         calls++;
-        var settings = $.extend(true, {}, defaults, options, {
+        var settings = Object.assign({}, defaults, options, {
           setIndex: calls
         });
 
diff --git a/gulpfile.js b/gulpfile.js
index c416637..4dfd460 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -3,7 +3,6 @@ const gutil = require('gulp-util');
 const rename = require('gulp-rename');
 const uglify = require('gulp-uglify');
 const bump = require('gulp-bump');
-const mochaPhantomJS = require('gulp-mocha-phantomjs');
 
 gulp.task('testing', () =>
     gulp.src('./test/index.html')
diff --git a/package.json b/package.json
index 11c975a..c04cb74 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,7 @@
   "scripts": {
     "build": "rollup -c",
     "dev": "rollup -c -w",
-    "test": "./node_modules/.bin/mocha-phantomjs test/index.html",
+    "test": "mocha-chrome test/index.html",
     "prettier": "./node_modules/.bin/prettier src/js/*.js test/*.js --write"
   },
   "dependencies": {
@@ -21,21 +21,21 @@
   "devDependencies": {
     "@babel/core": "^7.2.2",
     "babel-preset-env": "^1.7.0",
-    "chai": "^3.0.0",
+    "chai": "^4.2.0",
     "gulp": "^3.9.0",
     "gulp-bump": "^0.3.1",
-    "gulp-mocha-phantomjs": "^0.12.2",
     "gulp-rename": "^1.2.2",
     "gulp-uglify": "^1.2.0",
     "gulp-util": "^3.0.6",
-    "mocha-phantomjs": "3.5.3",
-    "phantomjs": "^1.9.1",
+    "mocha": "^5.2.0",
+    "mocha-chrome": "^1.1.0",
     "prettier": "1.15.2",
     "prettier-check": "^2.0.0",
     "rollup": "^0.68.1",
     "rollup-plugin-babel": "^4.1.0",
     "rollup-plugin-commonjs": "^9.2.0",
-    "rollup-plugin-node-resolve": "^4.0.0"
+    "rollup-plugin-node-resolve": "^4.0.0",
+    "sinon": "^7.2.2"
   },
   "repository": {
     "type": "git",
@@ -51,7 +51,7 @@
   "licenses": [
     {
       "type": "GPLv3",
-      "url": "http://chocolat.insipi.de"
+      "url": "https://github.com/nicolas-t/Chocolat/blob/master/LICENSE"
     }
   ],
   "bugs": {
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 4826a06..f9cd165 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -37,7 +37,7 @@ export class Chocolat {
 
         this.settings = settings
         this.elems = {}
-        this.element = element
+        this.element = $(element)
 
         this._cssClasses = [
             'chocolat-open',
@@ -47,8 +47,8 @@ export class Chocolat {
             'chocolat-zoomed',
         ]
 
-        if (!this.settings.setTitle && element.data('chocolat-title')) {
-            this.settings.setTitle = element.data('chocolat-title')
+        if (!this.settings.setTitle && this.element.data('chocolat-title')) {
+            this.settings.setTitle = this.element.data('chocolat-title')
         }
 
         this.element.find(this.settings.imageSelector).each(function() {
diff --git a/src/js/main.esm.js b/src/js/main.esm.js
index 16bdb6f..2c43f19 100644
--- a/src/js/main.esm.js
+++ b/src/js/main.esm.js
@@ -1,9 +1,11 @@
 import { Chocolat, defaults } from './chocolat.js'
 
+let calls = 0
+
 export default function(options) {
     return this.each(function() {
         calls++
-        var settings = $.extend(true, {}, defaults, options, { setIndex: calls })
+        var settings = Object.assign({}, defaults, options, { setIndex: calls })
 
         if (!$.data(this, 'chocolat')) {
             $.data(this, 'chocolat', new Chocolat($(this), settings))
diff --git a/src/js/main.iife.js b/src/js/main.iife.js
index 706b093..756541a 100644
--- a/src/js/main.iife.js
+++ b/src/js/main.iife.js
@@ -1,11 +1,10 @@
 import { Chocolat, defaults } from './chocolat.js'
 
 let calls = 0
-
 $.fn.Chocolat = function(options) {
     return this.each(function() {
         calls++
-        var settings = $.extend(true, {}, defaults, options, { setIndex: calls })
+        var settings = Object.assign({}, defaults, options, { setIndex: calls })
 
         if (!$.data(this, 'chocolat')) {
             $.data(this, 'chocolat', new Chocolat($(this), settings))
diff --git a/test/index.html b/test/index.html
index ab1ba1e..2673fa3 100644
--- a/test/index.html
+++ b/test/index.html
@@ -3,7 +3,7 @@
 <head>
     <meta charset="utf-8">
     <title>Chocolat tests</title>
-    <link rel="stylesheet" media="all" href="lib/mocha.css">
+    <link rel="stylesheet" media="all" href="../node_modules/mocha/mocha.css">
     <link rel="stylesheet" media="all" href="../dist/css/chocolat.css">
 </head>
 <body>
@@ -22,22 +22,20 @@
     </div>
 
     <div id="mocha"><p><a href=".">Index</a></p></div>
-    <div id="messages"></div>
-    <div id="fixtures"></div>
-    <script src="lib/mocha.js"></script>
-    <script src="lib/sinon.js"></script>
-    <script src="lib/chai.js"></script>
-    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
+
+    <script src="../node_modules/mocha/mocha.js"></script>
+    <script src="../node_modules/chai/chai.js"></script>
+    <script src="../node_modules/sinon/pkg/sinon.js"></script>
+    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
     <script src="../dist/js/chocolat.iife.js"></script>
     <script>
-      mocha.setup('bdd')
-      mocha.reporter('html');
-      expect = chai.expect;
+        mocha.setup('bdd')
+        mocha.reporter('html');
+        expect = chai.expect;
     </script>
-    <script src="test.chocolat.js"></script>
+    <script src="test.js"></script>
     <script>
-      if (window.mochaPhantomJS) { mochaPhantomJS.run(); }
-      else { mocha.run(); }
+        mocha.run()
     </script>
 </body>
 </html>
\ No newline at end of file
diff --git a/test/lib/chai.js b/test/lib/chai.js
deleted file mode 100644
index ffe12c4..0000000
--- a/test/lib/chai.js
+++ /dev/null
@@ -1,5332 +0,0 @@
-
-;(function(){
-
-/**
- * Require the module at `name`.
- *
- * @param {String} name
- * @return {Object} exports
- * @api public
- */
-
-function require(name) {
-  var module = require.modules[name];
-  if (!module) throw new Error('failed to require "' + name + '"');
-
-  if (!('exports' in module) && typeof module.definition === 'function') {
-    module.client = module.component = true;
-    module.definition.call(this, module.exports = {}, module);
-    delete module.definition;
-  }
-
-  return module.exports;
-}
-
-/**
- * Meta info, accessible in the global scope unless you use AMD option.
- */
-
-require.loader = 'component';
-
-/**
- * Internal helper object, contains a sorting function for semantiv versioning
- */
-require.helper = {};
-require.helper.semVerSort = function(a, b) {
-  var aArray = a.version.split('.');
-  var bArray = b.version.split('.');
-  for (var i=0; i<aArray.length; ++i) {
-    var aInt = parseInt(aArray[i], 10);
-    var bInt = parseInt(bArray[i], 10);
-    if (aInt === bInt) {
-      var aLex = aArray[i].substr((""+aInt).length);
-      var bLex = bArray[i].substr((""+bInt).length);
-      if (aLex === '' && bLex !== '') return 1;
-      if (aLex !== '' && bLex === '') return -1;
-      if (aLex !== '' && bLex !== '') return aLex > bLex ? 1 : -1;
-      continue;
-    } else if (aInt > bInt) {
-      return 1;
-    } else {
-      return -1;
-    }
-  }
-  return 0;
-}
-
-/**
- * Find and require a module which name starts with the provided name.
- * If multiple modules exists, the highest semver is used. 
- * This function can only be used for remote dependencies.
-
- * @param {String} name - module name: `user~repo`
- * @param {Boolean} returnPath - returns the canonical require path if true, 
- *                               otherwise it returns the epxorted module
- */
-require.latest = function (name, returnPath) {
-  function showError(name) {
-    throw new Error('failed to find latest module of "' + name + '"');
-  }
-  // only remotes with semvers, ignore local files conataining a '/'
-  var versionRegexp = /(.*)~(.*)@v?(\d+\.\d+\.\d+[^\/]*)$/;
-  var remoteRegexp = /(.*)~(.*)/;
-  if (!remoteRegexp.test(name)) showError(name);
-  var moduleNames = Object.keys(require.modules);
-  var semVerCandidates = [];
-  var otherCandidates = []; // for instance: name of the git branch
-  for (var i=0; i<moduleNames.length; i++) {
-    var moduleName = moduleNames[i];
-    if (new RegExp(name + '@').test(moduleName)) {
-        var version = moduleName.substr(name.length+1);
-        var semVerMatch = versionRegexp.exec(moduleName);
-        if (semVerMatch != null) {
-          semVerCandidates.push({version: version, name: moduleName});
-        } else {
-          otherCandidates.push({version: version, name: moduleName});
-        } 
-    }
-  }
-  if (semVerCandidates.concat(otherCandidates).length === 0) {
-    showError(name);
-  }
-  if (semVerCandidates.length > 0) {
-    var module = semVerCandidates.sort(require.helper.semVerSort).pop().name;
-    if (returnPath === true) {
-      return module;
-    }
-    return require(module);
-  }
-  // if the build contains more than one branch of the same module
-  // you should not use this funciton
-  var module = otherCandidates.sort(function(a, b) {return a.name > b.name})[0].name;
-  if (returnPath === true) {
-    return module;
-  }
-  return require(module);
-}
-
-/**
- * Registered modules.
- */
-
-require.modules = {};
-
-/**
- * Register module at `name` with callback `definition`.
- *
- * @param {String} name
- * @param {Function} definition
- * @api private
- */
-
-require.register = function (name, definition) {
-  require.modules[name] = {
-    definition: definition
-  };
-};
-
-/**
- * Define a module's exports immediately with `exports`.
- *
- * @param {String} name
- * @param {Generic} exports
- * @api private
- */
-
-require.define = function (name, exports) {
-  require.modules[name] = {
-    exports: exports
-  };
-};
-require.register("chaijs~assertion-error@1.0.0", function (exports, module) {
-/*!
- * assertion-error
- * Copyright(c) 2013 Jake Luer <jake@qualiancy.com>
- * MIT Licensed
- */
-
-/*!
- * Return a function that will copy properties from
- * one object to another excluding any originally
- * listed. Returned function will create a new `{}`.
- *
- * @param {String} excluded properties ...
- * @return {Function}
- */
-
-function exclude () {
-  var excludes = [].slice.call(arguments);
-
-  function excludeProps (res, obj) {
-    Object.keys(obj).forEach(function (key) {
-      if (!~excludes.indexOf(key)) res[key] = obj[key];
-    });
-  }
-
-  return function extendExclude () {
-    var args = [].slice.call(arguments)
-      , i = 0
-      , res = {};
-
-    for (; i < args.length; i++) {
-      excludeProps(res, args[i]);
-    }
-
-    return res;
-  };
-};
-
-/*!
- * Primary Exports
- */
-
-module.exports = AssertionError;
-
-/**
- * ### AssertionError
- *
- * An extension of the JavaScript `Error` constructor for
- * assertion and validation scenarios.
- *
- * @param {String} message
- * @param {Object} properties to include (optional)
- * @param {callee} start stack function (optional)
- */
-
-function AssertionError (message, _props, ssf) {
-  var extend = exclude('name', 'message', 'stack', 'constructor', 'toJSON')
-    , props = extend(_props || {});
-
-  // default values
-  this.message = message || 'Unspecified AssertionError';
-  this.showDiff = false;
-
-  // copy from properties
-  for (var key in props) {
-    this[key] = props[key];
-  }
-
-  // capture stack trace
-  ssf = ssf || arguments.callee;
-  if (ssf && Error.captureStackTrace) {
-    Error.captureStackTrace(this, ssf);
-  }
-}
-
-/*!
- * Inherit from Error.prototype
- */
-
-AssertionError.prototype = Object.create(Error.prototype);
-
-/*!
- * Statically set name
- */
-
-AssertionError.prototype.name = 'AssertionError';
-
-/*!
- * Ensure correct constructor
- */
-
-AssertionError.prototype.constructor = AssertionError;
-
-/**
- * Allow errors to be converted to JSON for static transfer.
- *
- * @param {Boolean} include stack (default: `true`)
- * @return {Object} object that can be `JSON.stringify`
- */
-
-AssertionError.prototype.toJSON = function (stack) {
-  var extend = exclude('constructor', 'toJSON', 'stack')
-    , props = extend({ name: this.name }, this);
-
-  // include stack if exists and not turned off
-  if (false !== stack && this.stack) {
-    props.stack = this.stack;
-  }
-
-  return props;
-};
-
-});
-
-require.register("chaijs~type-detect@0.1.1", function (exports, module) {
-/*!
- * type-detect
- * Copyright(c) 2013 jake luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/*!
- * Primary Exports
- */
-
-var exports = module.exports = getType;
-
-/*!
- * Detectable javascript natives
- */
-
-var natives = {
-    '[object Array]': 'array'
-  , '[object RegExp]': 'regexp'
-  , '[object Function]': 'function'
-  , '[object Arguments]': 'arguments'
-  , '[object Date]': 'date'
-};
-
-/**
- * ### typeOf (obj)
- *
- * Use several different techniques to determine
- * the type of object being tested.
- *
- *
- * @param {Mixed} object
- * @return {String} object type
- * @api public
- */
-
-function getType (obj) {
-  var str = Object.prototype.toString.call(obj);
-  if (natives[str]) return natives[str];
-  if (obj === null) return 'null';
-  if (obj === undefined) return 'undefined';
-  if (obj === Object(obj)) return 'object';
-  return typeof obj;
-}
-
-exports.Library = Library;
-
-/**
- * ### Library
- *
- * Create a repository for custom type detection.
- *
- * ```js
- * var lib = new type.Library;
- * ```
- *
- */
-
-function Library () {
-  this.tests = {};
-}
-
-/**
- * #### .of (obj)
- *
- * Expose replacement `typeof` detection to the library.
- *
- * ```js
- * if ('string' === lib.of('hello world')) {
- *   // ...
- * }
- * ```
- *
- * @param {Mixed} object to test
- * @return {String} type
- */
-
-Library.prototype.of = getType;
-
-/**
- * #### .define (type, test)
- *
- * Add a test to for the `.test()` assertion.
- *
- * Can be defined as a regular expression:
- *
- * ```js
- * lib.define('int', /^[0-9]+$/);
- * ```
- *
- * ... or as a function:
- *
- * ```js
- * lib.define('bln', function (obj) {
- *   if ('boolean' === lib.of(obj)) return true;
- *   var blns = [ 'yes', 'no', 'true', 'false', 1, 0 ];
- *   if ('string' === lib.of(obj)) obj = obj.toLowerCase();
- *   return !! ~blns.indexOf(obj);
- * });
- * ```
- *
- * @param {String} type
- * @param {RegExp|Function} test
- * @api public
- */
-
-Library.prototype.define = function (type, test) {
-  if (arguments.length === 1) return this.tests[type];
-  this.tests[type] = test;
-  return this;
-};
-
-/**
- * #### .test (obj, test)
- *
- * Assert that an object is of type. Will first
- * check natives, and if that does not pass it will
- * use the user defined custom tests.
- *
- * ```js
- * assert(lib.test('1', 'int'));
- * assert(lib.test('yes', 'bln'));
- * ```
- *
- * @param {Mixed} object
- * @param {String} type
- * @return {Boolean} result
- * @api public
- */
-
-Library.prototype.test = function (obj, type) {
-  if (type === getType(obj)) return true;
-  var test = this.tests[type];
-
-  if (test && 'regexp' === getType(test)) {
-    return test.test(obj);
-  } else if (test && 'function' === getType(test)) {
-    return test(obj);
-  } else {
-    throw new ReferenceError('Type test "' + type + '" not defined or invalid.');
-  }
-};
-
-});
-
-require.register("chaijs~deep-eql@0.1.3", function (exports, module) {
-/*!
- * deep-eql
- * Copyright(c) 2013 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/*!
- * Module dependencies
- */
-
-var type = require('chaijs~type-detect@0.1.1');
-
-/*!
- * Buffer.isBuffer browser shim
- */
-
-var Buffer;
-try { Buffer = require('buffer').Buffer; }
-catch(ex) {
-  Buffer = {};
-  Buffer.isBuffer = function() { return false; }
-}
-
-/*!
- * Primary Export
- */
-
-module.exports = deepEqual;
-
-/**
- * Assert super-strict (egal) equality between
- * two objects of any type.
- *
- * @param {Mixed} a
- * @param {Mixed} b
- * @param {Array} memoised (optional)
- * @return {Boolean} equal match
- */
-
-function deepEqual(a, b, m) {
-  if (sameValue(a, b)) {
-    return true;
-  } else if ('date' === type(a)) {
-    return dateEqual(a, b);
-  } else if ('regexp' === type(a)) {
-    return regexpEqual(a, b);
-  } else if (Buffer.isBuffer(a)) {
-    return bufferEqual(a, b);
-  } else if ('arguments' === type(a)) {
-    return argumentsEqual(a, b, m);
-  } else if (!typeEqual(a, b)) {
-    return false;
-  } else if (('object' !== type(a) && 'object' !== type(b))
-  && ('array' !== type(a) && 'array' !== type(b))) {
-    return sameValue(a, b);
-  } else {
-    return objectEqual(a, b, m);
-  }
-}
-
-/*!
- * Strict (egal) equality test. Ensures that NaN always
- * equals NaN and `-0` does not equal `+0`.
- *
- * @param {Mixed} a
- * @param {Mixed} b
- * @return {Boolean} equal match
- */
-
-function sameValue(a, b) {
-  if (a === b) return a !== 0 || 1 / a === 1 / b;
-  return a !== a && b !== b;
-}
-
-/*!
- * Compare the types of two given objects and
- * return if they are equal. Note that an Array
- * has a type of `array` (not `object`) and arguments
- * have a type of `arguments` (not `array`/`object`).
- *
- * @param {Mixed} a
- * @param {Mixed} b
- * @return {Boolean} result
- */
-
-function typeEqual(a, b) {
-  return type(a) === type(b);
-}
-
-/*!
- * Compare two Date objects by asserting that
- * the time values are equal using `saveValue`.
- *
- * @param {Date} a
- * @param {Date} b
- * @return {Boolean} result
- */
-
-function dateEqual(a, b) {
-  if ('date' !== type(b)) return false;
-  return sameValue(a.getTime(), b.getTime());
-}
-
-/*!
- * Compare two regular expressions by converting them
- * to string and checking for `sameValue`.
- *
- * @param {RegExp} a
- * @param {RegExp} b
- * @return {Boolean} result
- */
-
-function regexpEqual(a, b) {
-  if ('regexp' !== type(b)) return false;
-  return sameValue(a.toString(), b.toString());
-}
-
-/*!
- * Assert deep equality of two `arguments` objects.
- * Unfortunately, these must be sliced to arrays
- * prior to test to ensure no bad behavior.
- *
- * @param {Arguments} a
- * @param {Arguments} b
- * @param {Array} memoize (optional)
- * @return {Boolean} result
- */
-
-function argumentsEqual(a, b, m) {
-  if ('arguments' !== type(b)) return false;
-  a = [].slice.call(a);
-  b = [].slice.call(b);
-  return deepEqual(a, b, m);
-}
-
-/*!
- * Get enumerable properties of a given object.
- *
- * @param {Object} a
- * @return {Array} property names
- */
-
-function enumerable(a) {
-  var res = [];
-  for (var key in a) res.push(key);
-  return res;
-}
-
-/*!
- * Simple equality for flat iterable objects
- * such as Arrays or Node.js buffers.
- *
- * @param {Iterable} a
- * @param {Iterable} b
- * @return {Boolean} result
- */
-
-function iterableEqual(a, b) {
-  if (a.length !==  b.length) return false;
-
-  var i = 0;
-  var match = true;
-
-  for (; i < a.length; i++) {
-    if (a[i] !== b[i]) {
-      match = false;
-      break;
-    }
-  }
-
-  return match;
-}
-
-/*!
- * Extension to `iterableEqual` specifically
- * for Node.js Buffers.
- *
- * @param {Buffer} a
- * @param {Mixed} b
- * @return {Boolean} result
- */
-
-function bufferEqual(a, b) {
-  if (!Buffer.isBuffer(b)) return false;
-  return iterableEqual(a, b);
-}
-
-/*!
- * Block for `objectEqual` ensuring non-existing
- * values don't get in.
- *
- * @param {Mixed} object
- * @return {Boolean} result
- */
-
-function isValue(a) {
-  return a !== null && a !== undefined;
-}
-
-/*!
- * Recursively check the equality of two objects.
- * Once basic sameness has been established it will
- * defer to `deepEqual` for each enumerable key
- * in the object.
- *
- * @param {Mixed} a
- * @param {Mixed} b
- * @return {Boolean} result
- */
-
-function objectEqual(a, b, m) {
-  if (!isValue(a) || !isValue(b)) {
-    return false;
-  }
-
-  if (a.prototype !== b.prototype) {
-    return false;
-  }
-
-  var i;
-  if (m) {
-    for (i = 0; i < m.length; i++) {
-      if ((m[i][0] === a && m[i][1] === b)
-      ||  (m[i][0] === b && m[i][1] === a)) {
-        return true;
-      }
-    }
-  } else {
-    m = [];
-  }
-
-  try {
-    var ka = enumerable(a);
-    var kb = enumerable(b);
-  } catch (ex) {
-    return false;
-  }
-
-  ka.sort();
-  kb.sort();
-
-  if (!iterableEqual(ka, kb)) {
-    return false;
-  }
-
-  m.push([ a, b ]);
-
-  var key;
-  for (i = ka.length - 1; i >= 0; i--) {
-    key = ka[i];
-    if (!deepEqual(a[key], b[key], m)) {
-      return false;
-    }
-  }
-
-  return true;
-}
-
-});
-
-require.register("chai", function (exports, module) {
-module.exports = require('chai/lib/chai.js');
-
-});
-
-require.register("chai/lib/chai.js", function (exports, module) {
-/*!
- * chai
- * Copyright(c) 2011-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-var used = []
-  , exports = module.exports = {};
-
-/*!
- * Chai version
- */
-
-exports.version = '2.1.0';
-
-/*!
- * Assertion Error
- */
-
-exports.AssertionError = require('chaijs~assertion-error@1.0.0');
-
-/*!
- * Utils for plugins (not exported)
- */
-
-var util = require('chai/lib/chai/utils/index.js');
-
-/**
- * # .use(function)
- *
- * Provides a way to extend the internals of Chai
- *
- * @param {Function}
- * @returns {this} for chaining
- * @api public
- */
-
-exports.use = function (fn) {
-  if (!~used.indexOf(fn)) {
-    fn(this, util);
-    used.push(fn);
-  }
-
-  return this;
-};
-
-/*!
- * Utility Functions
- */
-
-exports.util = util;
-
-/*!
- * Configuration
- */
-
-var config = require('chai/lib/chai/config.js');
-exports.config = config;
-
-/*!
- * Primary `Assertion` prototype
- */
-
-var assertion = require('chai/lib/chai/assertion.js');
-exports.use(assertion);
-
-/*!
- * Core Assertions
- */
-
-var core = require('chai/lib/chai/core/assertions.js');
-exports.use(core);
-
-/*!
- * Expect interface
- */
-
-var expect = require('chai/lib/chai/interface/expect.js');
-exports.use(expect);
-
-/*!
- * Should interface
- */
-
-var should = require('chai/lib/chai/interface/should.js');
-exports.use(should);
-
-/*!
- * Assert interface
- */
-
-var assert = require('chai/lib/chai/interface/assert.js');
-exports.use(assert);
-
-});
-
-require.register("chai/lib/chai/assertion.js", function (exports, module) {
-/*!
- * chai
- * http://chaijs.com
- * Copyright(c) 2011-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-var config = require('chai/lib/chai/config.js');
-
-module.exports = function (_chai, util) {
-  /*!
-   * Module dependencies.
-   */
-
-  var AssertionError = _chai.AssertionError
-    , flag = util.flag;
-
-  /*!
-   * Module export.
-   */
-
-  _chai.Assertion = Assertion;
-
-  /*!
-   * Assertion Constructor
-   *
-   * Creates object for chaining.
-   *
-   * @api private
-   */
-
-  function Assertion (obj, msg, stack) {
-    flag(this, 'ssfi', stack || arguments.callee);
-    flag(this, 'object', obj);
-    flag(this, 'message', msg);
-  }
-
-  Object.defineProperty(Assertion, 'includeStack', {
-    get: function() {
-      console.warn('Assertion.includeStack is deprecated, use chai.config.includeStack instead.');
-      return config.includeStack;
-    },
-    set: function(value) {
-      console.warn('Assertion.includeStack is deprecated, use chai.config.includeStack instead.');
-      config.includeStack = value;
-    }
-  });
-
-  Object.defineProperty(Assertion, 'showDiff', {
-    get: function() {
-      console.warn('Assertion.showDiff is deprecated, use chai.config.showDiff instead.');
-      return config.showDiff;
-    },
-    set: function(value) {
-      console.warn('Assertion.showDiff is deprecated, use chai.config.showDiff instead.');
-      config.showDiff = value;
-    }
-  });
-
-  Assertion.addProperty = function (name, fn) {
-    util.addProperty(this.prototype, name, fn);
-  };
-
-  Assertion.addMethod = function (name, fn) {
-    util.addMethod(this.prototype, name, fn);
-  };
-
-  Assertion.addChainableMethod = function (name, fn, chainingBehavior) {
-    util.addChainableMethod(this.prototype, name, fn, chainingBehavior);
-  };
-
-  Assertion.overwriteProperty = function (name, fn) {
-    util.overwriteProperty(this.prototype, name, fn);
-  };
-
-  Assertion.overwriteMethod = function (name, fn) {
-    util.overwriteMethod(this.prototype, name, fn);
-  };
-
-  Assertion.overwriteChainableMethod = function (name, fn, chainingBehavior) {
-    util.overwriteChainableMethod(this.prototype, name, fn, chainingBehavior);
-  };
-
-  /*!
-   * ### .assert(expression, message, negateMessage, expected, actual)
-   *
-   * Executes an expression and check expectations. Throws AssertionError for reporting if test doesn't pass.
-   *
-   * @name assert
-   * @param {Philosophical} expression to be tested
-   * @param {String or Function} message or function that returns message to display if fails
-   * @param {String or Function} negatedMessage or function that returns negatedMessage to display if negated expression fails
-   * @param {Mixed} expected value (remember to check for negation)
-   * @param {Mixed} actual (optional) will default to `this.obj`
-   * @api private
-   */
-
-  Assertion.prototype.assert = function (expr, msg, negateMsg, expected, _actual, showDiff) {
-    var ok = util.test(this, arguments);
-    if (true !== showDiff) showDiff = false;
-    if (true !== config.showDiff) showDiff = false;
-
-    if (!ok) {
-      var msg = util.getMessage(this, arguments)
-        , actual = util.getActual(this, arguments);
-      throw new AssertionError(msg, {
-          actual: actual
-        , expected: expected
-        , showDiff: showDiff
-      }, (config.includeStack) ? this.assert : flag(this, 'ssfi'));
-    }
-  };
-
-  /*!
-   * ### ._obj
-   *
-   * Quick reference to stored `actual` value for plugin developers.
-   *
-   * @api private
-   */
-
-  Object.defineProperty(Assertion.prototype, '_obj',
-    { get: function () {
-        return flag(this, 'object');
-      }
-    , set: function (val) {
-        flag(this, 'object', val);
-      }
-  });
-};
-
-});
-
-require.register("chai/lib/chai/config.js", function (exports, module) {
-module.exports = {
-
-  /**
-   * ### config.includeStack
-   *
-   * User configurable property, influences whether stack trace
-   * is included in Assertion error message. Default of false
-   * suppresses stack trace in the error message.
-   *
-   *     chai.config.includeStack = true;  // enable stack on error
-   *
-   * @param {Boolean}
-   * @api public
-   */
-
-   includeStack: false,
-
-  /**
-   * ### config.showDiff
-   *
-   * User configurable property, influences whether or not
-   * the `showDiff` flag should be included in the thrown
-   * AssertionErrors. `false` will always be `false`; `true`
-   * will be true when the assertion has requested a diff
-   * be shown.
-   *
-   * @param {Boolean}
-   * @api public
-   */
-
-  showDiff: true,
-
-  /**
-   * ### config.truncateThreshold
-   *
-   * User configurable property, sets length threshold for actual and
-   * expected values in assertion errors. If this threshold is exceeded,
-   * the value is truncated.
-   *
-   * Set it to zero if you want to disable truncating altogether.
-   *
-   *     chai.config.truncateThreshold = 0;  // disable truncating
-   *
-   * @param {Number}
-   * @api public
-   */
-
-  truncateThreshold: 40
-
-};
-
-});
-
-require.register("chai/lib/chai/core/assertions.js", function (exports, module) {
-/*!
- * chai
- * http://chaijs.com
- * Copyright(c) 2011-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-module.exports = function (chai, _) {
-  var Assertion = chai.Assertion
-    , toString = Object.prototype.toString
-    , flag = _.flag;
-
-  /**
-   * ### Language Chains
-   *
-   * The following are provided as chainable getters to
-   * improve the readability of your assertions. They
-   * do not provide testing capabilities unless they
-   * have been overwritten by a plugin.
-   *
-   * **Chains**
-   *
-   * - to
-   * - be
-   * - been
-   * - is
-   * - that
-   * - which
-   * - and
-   * - has
-   * - have
-   * - with
-   * - at
-   * - of
-   * - same
-   *
-   * @name language chains
-   * @api public
-   */
-
-  [ 'to', 'be', 'been'
-  , 'is', 'and', 'has', 'have'
-  , 'with', 'that', 'which', 'at'
-  , 'of', 'same' ].forEach(function (chain) {
-    Assertion.addProperty(chain, function () {
-      return this;
-    });
-  });
-
-  /**
-   * ### .not
-   *
-   * Negates any of assertions following in the chain.
-   *
-   *     expect(foo).to.not.equal('bar');
-   *     expect(goodFn).to.not.throw(Error);
-   *     expect({ foo: 'baz' }).to.have.property('foo')
-   *       .and.not.equal('bar');
-   *
-   * @name not
-   * @api public
-   */
-
-  Assertion.addProperty('not', function () {
-    flag(this, 'negate', true);
-  });
-
-  /**
-   * ### .deep
-   *
-   * Sets the `deep` flag, later used by the `equal` and
-   * `property` assertions.
-   *
-   *     expect(foo).to.deep.equal({ bar: 'baz' });
-   *     expect({ foo: { bar: { baz: 'quux' } } })
-   *       .to.have.deep.property('foo.bar.baz', 'quux');
-   *
-   * @name deep
-   * @api public
-   */
-
-  Assertion.addProperty('deep', function () {
-    flag(this, 'deep', true);
-  });
-
-  /**
-   * ### .any
-   *
-   * Sets the `any` flag, (opposite of the `all` flag)
-   * later used in the `keys` assertion. 
-   *
-   *     expect(foo).to.have.any.keys('bar', 'baz');
-   *
-   * @name any
-   * @api public
-   */
-
-  Assertion.addProperty('any', function () {
-    flag(this, 'any', true);
-    flag(this, 'all', false)
-  });
-
-
-  /**
-   * ### .all
-   *
-   * Sets the `all` flag (opposite of the `any` flag) 
-   * later used by the `keys` assertion.
-   *
-   *     expect(foo).to.have.all.keys('bar', 'baz');
-   *
-   * @name all
-   * @api public
-   */
-
-  Assertion.addProperty('all', function () {
-    flag(this, 'all', true);
-    flag(this, 'any', false);
-  });
-
-  /**
-   * ### .a(type)
-   *
-   * The `a` and `an` assertions are aliases that can be
-   * used either as language chains or to assert a value's
-   * type.
-   *
-   *     // typeof
-   *     expect('test').to.be.a('string');
-   *     expect({ foo: 'bar' }).to.be.an('object');
-   *     expect(null).to.be.a('null');
-   *     expect(undefined).to.be.an('undefined');
-   *
-   *     // language chain
-   *     expect(foo).to.be.an.instanceof(Foo);
-   *
-   * @name a
-   * @alias an
-   * @param {String} type
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function an (type, msg) {
-    if (msg) flag(this, 'message', msg);
-    type = type.toLowerCase();
-    var obj = flag(this, 'object')
-      , article = ~[ 'a', 'e', 'i', 'o', 'u' ].indexOf(type.charAt(0)) ? 'an ' : 'a ';
-
-    this.assert(
-        type === _.type(obj)
-      , 'expected #{this} to be ' + article + type
-      , 'expected #{this} not to be ' + article + type
-    );
-  }
-
-  Assertion.addChainableMethod('an', an);
-  Assertion.addChainableMethod('a', an);
-
-  /**
-   * ### .include(value)
-   *
-   * The `include` and `contain` assertions can be used as either property
-   * based language chains or as methods to assert the inclusion of an object
-   * in an array or a substring in a string. When used as language chains,
-   * they toggle the `contains` flag for the `keys` assertion.
-   *
-   *     expect([1,2,3]).to.include(2);
-   *     expect('foobar').to.contain('foo');
-   *     expect({ foo: 'bar', hello: 'universe' }).to.include.keys('foo');
-   *
-   * @name include
-   * @alias contain
-   * @alias includes
-   * @alias contains
-   * @param {Object|String|Number} obj
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function includeChainingBehavior () {
-    flag(this, 'contains', true);
-  }
-
-  function include (val, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    var expected = false;
-    if (_.type(obj) === 'array' && _.type(val) === 'object') {
-      for (var i in obj) {
-        if (_.eql(obj[i], val)) {
-          expected = true;
-          break;
-        }
-      }
-    } else if (_.type(val) === 'object') {
-      if (!flag(this, 'negate')) {
-        for (var k in val) new Assertion(obj).property(k, val[k]);
-        return;
-      }
-      var subset = {};
-      for (var k in val) subset[k] = obj[k];
-      expected = _.eql(subset, val);
-    } else {
-      expected = obj && ~obj.indexOf(val);
-    }
-    this.assert(
-        expected
-      , 'expected #{this} to include ' + _.inspect(val)
-      , 'expected #{this} to not include ' + _.inspect(val));
-  }
-
-  Assertion.addChainableMethod('include', include, includeChainingBehavior);
-  Assertion.addChainableMethod('contain', include, includeChainingBehavior);
-  Assertion.addChainableMethod('contains', include, includeChainingBehavior);
-  Assertion.addChainableMethod('includes', include, includeChainingBehavior);
-
-  /**
-   * ### .ok
-   *
-   * Asserts that the target is truthy.
-   *
-   *     expect('everthing').to.be.ok;
-   *     expect(1).to.be.ok;
-   *     expect(false).to.not.be.ok;
-   *     expect(undefined).to.not.be.ok;
-   *     expect(null).to.not.be.ok;
-   *
-   * @name ok
-   * @api public
-   */
-
-  Assertion.addProperty('ok', function () {
-    this.assert(
-        flag(this, 'object')
-      , 'expected #{this} to be truthy'
-      , 'expected #{this} to be falsy');
-  });
-
-  /**
-   * ### .true
-   *
-   * Asserts that the target is `true`.
-   *
-   *     expect(true).to.be.true;
-   *     expect(1).to.not.be.true;
-   *
-   * @name true
-   * @api public
-   */
-
-  Assertion.addProperty('true', function () {
-    this.assert(
-        true === flag(this, 'object')
-      , 'expected #{this} to be true'
-      , 'expected #{this} to be false'
-      , this.negate ? false : true
-    );
-  });
-
-  /**
-   * ### .false
-   *
-   * Asserts that the target is `false`.
-   *
-   *     expect(false).to.be.false;
-   *     expect(0).to.not.be.false;
-   *
-   * @name false
-   * @api public
-   */
-
-  Assertion.addProperty('false', function () {
-    this.assert(
-        false === flag(this, 'object')
-      , 'expected #{this} to be false'
-      , 'expected #{this} to be true'
-      , this.negate ? true : false
-    );
-  });
-
-  /**
-   * ### .null
-   *
-   * Asserts that the target is `null`.
-   *
-   *     expect(null).to.be.null;
-   *     expect(undefined).not.to.be.null;
-   *
-   * @name null
-   * @api public
-   */
-
-  Assertion.addProperty('null', function () {
-    this.assert(
-        null === flag(this, 'object')
-      , 'expected #{this} to be null'
-      , 'expected #{this} not to be null'
-    );
-  });
-
-  /**
-   * ### .undefined
-   *
-   * Asserts that the target is `undefined`.
-   *
-   *     expect(undefined).to.be.undefined;
-   *     expect(null).to.not.be.undefined;
-   *
-   * @name undefined
-   * @api public
-   */
-
-  Assertion.addProperty('undefined', function () {
-    this.assert(
-        undefined === flag(this, 'object')
-      , 'expected #{this} to be undefined'
-      , 'expected #{this} not to be undefined'
-    );
-  });
-
-  /**
-   * ### .exist
-   *
-   * Asserts that the target is neither `null` nor `undefined`.
-   *
-   *     var foo = 'hi'
-   *       , bar = null
-   *       , baz;
-   *
-   *     expect(foo).to.exist;
-   *     expect(bar).to.not.exist;
-   *     expect(baz).to.not.exist;
-   *
-   * @name exist
-   * @api public
-   */
-
-  Assertion.addProperty('exist', function () {
-    this.assert(
-        null != flag(this, 'object')
-      , 'expected #{this} to exist'
-      , 'expected #{this} to not exist'
-    );
-  });
-
-
-  /**
-   * ### .empty
-   *
-   * Asserts that the target's length is `0`. For arrays, it checks
-   * the `length` property. For objects, it gets the count of
-   * enumerable keys.
-   *
-   *     expect([]).to.be.empty;
-   *     expect('').to.be.empty;
-   *     expect({}).to.be.empty;
-   *
-   * @name empty
-   * @api public
-   */
-
-  Assertion.addProperty('empty', function () {
-    var obj = flag(this, 'object')
-      , expected = obj;
-
-    if (Array.isArray(obj) || 'string' === typeof object) {
-      expected = obj.length;
-    } else if (typeof obj === 'object') {
-      expected = Object.keys(obj).length;
-    }
-
-    this.assert(
-        !expected
-      , 'expected #{this} to be empty'
-      , 'expected #{this} not to be empty'
-    );
-  });
-
-  /**
-   * ### .arguments
-   *
-   * Asserts that the target is an arguments object.
-   *
-   *     function test () {
-   *       expect(arguments).to.be.arguments;
-   *     }
-   *
-   * @name arguments
-   * @alias Arguments
-   * @api public
-   */
-
-  function checkArguments () {
-    var obj = flag(this, 'object')
-      , type = Object.prototype.toString.call(obj);
-    this.assert(
-        '[object Arguments]' === type
-      , 'expected #{this} to be arguments but got ' + type
-      , 'expected #{this} to not be arguments'
-    );
-  }
-
-  Assertion.addProperty('arguments', checkArguments);
-  Assertion.addProperty('Arguments', checkArguments);
-
-  /**
-   * ### .equal(value)
-   *
-   * Asserts that the target is strictly equal (`===`) to `value`.
-   * Alternately, if the `deep` flag is set, asserts that
-   * the target is deeply equal to `value`.
-   *
-   *     expect('hello').to.equal('hello');
-   *     expect(42).to.equal(42);
-   *     expect(1).to.not.equal(true);
-   *     expect({ foo: 'bar' }).to.not.equal({ foo: 'bar' });
-   *     expect({ foo: 'bar' }).to.deep.equal({ foo: 'bar' });
-   *
-   * @name equal
-   * @alias equals
-   * @alias eq
-   * @alias deep.equal
-   * @param {Mixed} value
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertEqual (val, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    if (flag(this, 'deep')) {
-      return this.eql(val);
-    } else {
-      this.assert(
-          val === obj
-        , 'expected #{this} to equal #{exp}'
-        , 'expected #{this} to not equal #{exp}'
-        , val
-        , this._obj
-        , true
-      );
-    }
-  }
-
-  Assertion.addMethod('equal', assertEqual);
-  Assertion.addMethod('equals', assertEqual);
-  Assertion.addMethod('eq', assertEqual);
-
-  /**
-   * ### .eql(value)
-   *
-   * Asserts that the target is deeply equal to `value`.
-   *
-   *     expect({ foo: 'bar' }).to.eql({ foo: 'bar' });
-   *     expect([ 1, 2, 3 ]).to.eql([ 1, 2, 3 ]);
-   *
-   * @name eql
-   * @alias eqls
-   * @param {Mixed} value
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertEql(obj, msg) {
-    if (msg) flag(this, 'message', msg);
-    this.assert(
-        _.eql(obj, flag(this, 'object'))
-      , 'expected #{this} to deeply equal #{exp}'
-      , 'expected #{this} to not deeply equal #{exp}'
-      , obj
-      , this._obj
-      , true
-    );
-  }
-
-  Assertion.addMethod('eql', assertEql);
-  Assertion.addMethod('eqls', assertEql);
-
-  /**
-   * ### .above(value)
-   *
-   * Asserts that the target is greater than `value`.
-   *
-   *     expect(10).to.be.above(5);
-   *
-   * Can also be used in conjunction with `length` to
-   * assert a minimum length. The benefit being a
-   * more informative error message than if the length
-   * was supplied directly.
-   *
-   *     expect('foo').to.have.length.above(2);
-   *     expect([ 1, 2, 3 ]).to.have.length.above(2);
-   *
-   * @name above
-   * @alias gt
-   * @alias greaterThan
-   * @param {Number} value
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertAbove (n, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    if (flag(this, 'doLength')) {
-      new Assertion(obj, msg).to.have.property('length');
-      var len = obj.length;
-      this.assert(
-          len > n
-        , 'expected #{this} to have a length above #{exp} but got #{act}'
-        , 'expected #{this} to not have a length above #{exp}'
-        , n
-        , len
-      );
-    } else {
-      this.assert(
-          obj > n
-        , 'expected #{this} to be above ' + n
-        , 'expected #{this} to be at most ' + n
-      );
-    }
-  }
-
-  Assertion.addMethod('above', assertAbove);
-  Assertion.addMethod('gt', assertAbove);
-  Assertion.addMethod('greaterThan', assertAbove);
-
-  /**
-   * ### .least(value)
-   *
-   * Asserts that the target is greater than or equal to `value`.
-   *
-   *     expect(10).to.be.at.least(10);
-   *
-   * Can also be used in conjunction with `length` to
-   * assert a minimum length. The benefit being a
-   * more informative error message than if the length
-   * was supplied directly.
-   *
-   *     expect('foo').to.have.length.of.at.least(2);
-   *     expect([ 1, 2, 3 ]).to.have.length.of.at.least(3);
-   *
-   * @name least
-   * @alias gte
-   * @param {Number} value
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertLeast (n, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    if (flag(this, 'doLength')) {
-      new Assertion(obj, msg).to.have.property('length');
-      var len = obj.length;
-      this.assert(
-          len >= n
-        , 'expected #{this} to have a length at least #{exp} but got #{act}'
-        , 'expected #{this} to have a length below #{exp}'
-        , n
-        , len
-      );
-    } else {
-      this.assert(
-          obj >= n
-        , 'expected #{this} to be at least ' + n
-        , 'expected #{this} to be below ' + n
-      );
-    }
-  }
-
-  Assertion.addMethod('least', assertLeast);
-  Assertion.addMethod('gte', assertLeast);
-
-  /**
-   * ### .below(value)
-   *
-   * Asserts that the target is less than `value`.
-   *
-   *     expect(5).to.be.below(10);
-   *
-   * Can also be used in conjunction with `length` to
-   * assert a maximum length. The benefit being a
-   * more informative error message than if the length
-   * was supplied directly.
-   *
-   *     expect('foo').to.have.length.below(4);
-   *     expect([ 1, 2, 3 ]).to.have.length.below(4);
-   *
-   * @name below
-   * @alias lt
-   * @alias lessThan
-   * @param {Number} value
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertBelow (n, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    if (flag(this, 'doLength')) {
-      new Assertion(obj, msg).to.have.property('length');
-      var len = obj.length;
-      this.assert(
-          len < n
-        , 'expected #{this} to have a length below #{exp} but got #{act}'
-        , 'expected #{this} to not have a length below #{exp}'
-        , n
-        , len
-      );
-    } else {
-      this.assert(
-          obj < n
-        , 'expected #{this} to be below ' + n
-        , 'expected #{this} to be at least ' + n
-      );
-    }
-  }
-
-  Assertion.addMethod('below', assertBelow);
-  Assertion.addMethod('lt', assertBelow);
-  Assertion.addMethod('lessThan', assertBelow);
-
-  /**
-   * ### .most(value)
-   *
-   * Asserts that the target is less than or equal to `value`.
-   *
-   *     expect(5).to.be.at.most(5);
-   *
-   * Can also be used in conjunction with `length` to
-   * assert a maximum length. The benefit being a
-   * more informative error message than if the length
-   * was supplied directly.
-   *
-   *     expect('foo').to.have.length.of.at.most(4);
-   *     expect([ 1, 2, 3 ]).to.have.length.of.at.most(3);
-   *
-   * @name most
-   * @alias lte
-   * @param {Number} value
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertMost (n, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    if (flag(this, 'doLength')) {
-      new Assertion(obj, msg).to.have.property('length');
-      var len = obj.length;
-      this.assert(
-          len <= n
-        , 'expected #{this} to have a length at most #{exp} but got #{act}'
-        , 'expected #{this} to have a length above #{exp}'
-        , n
-        , len
-      );
-    } else {
-      this.assert(
-          obj <= n
-        , 'expected #{this} to be at most ' + n
-        , 'expected #{this} to be above ' + n
-      );
-    }
-  }
-
-  Assertion.addMethod('most', assertMost);
-  Assertion.addMethod('lte', assertMost);
-
-  /**
-   * ### .within(start, finish)
-   *
-   * Asserts that the target is within a range.
-   *
-   *     expect(7).to.be.within(5,10);
-   *
-   * Can also be used in conjunction with `length` to
-   * assert a length range. The benefit being a
-   * more informative error message than if the length
-   * was supplied directly.
-   *
-   *     expect('foo').to.have.length.within(2,4);
-   *     expect([ 1, 2, 3 ]).to.have.length.within(2,4);
-   *
-   * @name within
-   * @param {Number} start lowerbound inclusive
-   * @param {Number} finish upperbound inclusive
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  Assertion.addMethod('within', function (start, finish, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object')
-      , range = start + '..' + finish;
-    if (flag(this, 'doLength')) {
-      new Assertion(obj, msg).to.have.property('length');
-      var len = obj.length;
-      this.assert(
-          len >= start && len <= finish
-        , 'expected #{this} to have a length within ' + range
-        , 'expected #{this} to not have a length within ' + range
-      );
-    } else {
-      this.assert(
-          obj >= start && obj <= finish
-        , 'expected #{this} to be within ' + range
-        , 'expected #{this} to not be within ' + range
-      );
-    }
-  });
-
-  /**
-   * ### .instanceof(constructor)
-   *
-   * Asserts that the target is an instance of `constructor`.
-   *
-   *     var Tea = function (name) { this.name = name; }
-   *       , Chai = new Tea('chai');
-   *
-   *     expect(Chai).to.be.an.instanceof(Tea);
-   *     expect([ 1, 2, 3 ]).to.be.instanceof(Array);
-   *
-   * @name instanceof
-   * @param {Constructor} constructor
-   * @param {String} message _optional_
-   * @alias instanceOf
-   * @api public
-   */
-
-  function assertInstanceOf (constructor, msg) {
-    if (msg) flag(this, 'message', msg);
-    var name = _.getName(constructor);
-    this.assert(
-        flag(this, 'object') instanceof constructor
-      , 'expected #{this} to be an instance of ' + name
-      , 'expected #{this} to not be an instance of ' + name
-    );
-  };
-
-  Assertion.addMethod('instanceof', assertInstanceOf);
-  Assertion.addMethod('instanceOf', assertInstanceOf);
-
-  /**
-   * ### .property(name, [value])
-   *
-   * Asserts that the target has a property `name`, optionally asserting that
-   * the value of that property is strictly equal to  `value`.
-   * If the `deep` flag is set, you can use dot- and bracket-notation for deep
-   * references into objects and arrays.
-   *
-   *     // simple referencing
-   *     var obj = { foo: 'bar' };
-   *     expect(obj).to.have.property('foo');
-   *     expect(obj).to.have.property('foo', 'bar');
-   *
-   *     // deep referencing
-   *     var deepObj = {
-   *         green: { tea: 'matcha' }
-   *       , teas: [ 'chai', 'matcha', { tea: 'konacha' } ]
-   *     };
-
-   *     expect(deepObj).to.have.deep.property('green.tea', 'matcha');
-   *     expect(deepObj).to.have.deep.property('teas[1]', 'matcha');
-   *     expect(deepObj).to.have.deep.property('teas[2].tea', 'konacha');
-   *
-   * You can also use an array as the starting point of a `deep.property`
-   * assertion, or traverse nested arrays.
-   *
-   *     var arr = [
-   *         [ 'chai', 'matcha', 'konacha' ]
-   *       , [ { tea: 'chai' }
-   *         , { tea: 'matcha' }
-   *         , { tea: 'konacha' } ]
-   *     ];
-   *
-   *     expect(arr).to.have.deep.property('[0][1]', 'matcha');
-   *     expect(arr).to.have.deep.property('[1][2].tea', 'konacha');
-   *
-   * Furthermore, `property` changes the subject of the assertion
-   * to be the value of that property from the original object. This
-   * permits for further chainable assertions on that property.
-   *
-   *     expect(obj).to.have.property('foo')
-   *       .that.is.a('string');
-   *     expect(deepObj).to.have.property('green')
-   *       .that.is.an('object')
-   *       .that.deep.equals({ tea: 'matcha' });
-   *     expect(deepObj).to.have.property('teas')
-   *       .that.is.an('array')
-   *       .with.deep.property('[2]')
-   *         .that.deep.equals({ tea: 'konacha' });
-   *
-   * @name property
-   * @alias deep.property
-   * @param {String} name
-   * @param {Mixed} value (optional)
-   * @param {String} message _optional_
-   * @returns value of property for chaining
-   * @api public
-   */
-
-  Assertion.addMethod('property', function (name, val, msg) {
-    if (msg) flag(this, 'message', msg);
-
-    var isDeep = !!flag(this, 'deep')
-      , descriptor = isDeep ? 'deep property ' : 'property '
-      , negate = flag(this, 'negate')
-      , obj = flag(this, 'object')
-      , pathInfo = isDeep ? _.getPathInfo(name, obj) : null
-      , hasProperty = isDeep
-        ? pathInfo.exists
-        : _.hasProperty(name, obj)
-      , value = isDeep
-        ? pathInfo.value
-        : obj[name];
-
-    if (negate && undefined !== val) {
-      if (undefined === value) {
-        msg = (msg != null) ? msg + ': ' : '';
-        throw new Error(msg + _.inspect(obj) + ' has no ' + descriptor + _.inspect(name));
-      }
-    } else {
-      this.assert(
-          hasProperty
-        , 'expected #{this} to have a ' + descriptor + _.inspect(name)
-        , 'expected #{this} to not have ' + descriptor + _.inspect(name));
-    }
-
-    if (undefined !== val) {
-      this.assert(
-          val === value
-        , 'expected #{this} to have a ' + descriptor + _.inspect(name) + ' of #{exp}, but got #{act}'
-        , 'expected #{this} to not have a ' + descriptor + _.inspect(name) + ' of #{act}'
-        , val
-        , value
-      );
-    }
-
-    flag(this, 'object', value);
-  });
-
-
-  /**
-   * ### .ownProperty(name)
-   *
-   * Asserts that the target has an own property `name`.
-   *
-   *     expect('test').to.have.ownProperty('length');
-   *
-   * @name ownProperty
-   * @alias haveOwnProperty
-   * @param {String} name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertOwnProperty (name, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    this.assert(
-        obj.hasOwnProperty(name)
-      , 'expected #{this} to have own property ' + _.inspect(name)
-      , 'expected #{this} to not have own property ' + _.inspect(name)
-    );
-  }
-
-  Assertion.addMethod('ownProperty', assertOwnProperty);
-  Assertion.addMethod('haveOwnProperty', assertOwnProperty);
-
-  /**
-   * ### .length(value)
-   *
-   * Asserts that the target's `length` property has
-   * the expected value.
-   *
-   *     expect([ 1, 2, 3]).to.have.length(3);
-   *     expect('foobar').to.have.length(6);
-   *
-   * Can also be used as a chain precursor to a value
-   * comparison for the length property.
-   *
-   *     expect('foo').to.have.length.above(2);
-   *     expect([ 1, 2, 3 ]).to.have.length.above(2);
-   *     expect('foo').to.have.length.below(4);
-   *     expect([ 1, 2, 3 ]).to.have.length.below(4);
-   *     expect('foo').to.have.length.within(2,4);
-   *     expect([ 1, 2, 3 ]).to.have.length.within(2,4);
-   *
-   * @name length
-   * @alias lengthOf
-   * @param {Number} length
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertLengthChain () {
-    flag(this, 'doLength', true);
-  }
-
-  function assertLength (n, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    new Assertion(obj, msg).to.have.property('length');
-    var len = obj.length;
-
-    this.assert(
-        len == n
-      , 'expected #{this} to have a length of #{exp} but got #{act}'
-      , 'expected #{this} to not have a length of #{act}'
-      , n
-      , len
-    );
-  }
-
-  Assertion.addChainableMethod('length', assertLength, assertLengthChain);
-  Assertion.addMethod('lengthOf', assertLength);
-
-  /**
-   * ### .match(regexp)
-   *
-   * Asserts that the target matches a regular expression.
-   *
-   *     expect('foobar').to.match(/^foo/);
-   *
-   * @name match
-   * @param {RegExp} RegularExpression
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  Assertion.addMethod('match', function (re, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    this.assert(
-        re.exec(obj)
-      , 'expected #{this} to match ' + re
-      , 'expected #{this} not to match ' + re
-    );
-  });
-
-  /**
-   * ### .string(string)
-   *
-   * Asserts that the string target contains another string.
-   *
-   *     expect('foobar').to.have.string('bar');
-   *
-   * @name string
-   * @param {String} string
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  Assertion.addMethod('string', function (str, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    new Assertion(obj, msg).is.a('string');
-
-    this.assert(
-        ~obj.indexOf(str)
-      , 'expected #{this} to contain ' + _.inspect(str)
-      , 'expected #{this} to not contain ' + _.inspect(str)
-    );
-  });
-
-
-  /**
-   * ### .keys(key1, [key2], [...])
-   *
-   * Asserts that the target contains any or all of the passed-in keys.
-   * Use in combination with `any`, `all`, `contains`, or `have` will affect 
-   * what will pass.
-   * 
-   * When used in conjunction with `any`, at least one key that is passed 
-   * in must exist in the target object. This is regardless whether or not 
-   * the `have` or `contain` qualifiers are used. Note, either `any` or `all`
-   * should be used in the assertion. If neither are used, the assertion is
-   * defaulted to `all`.
-   * 
-   * When both `all` and `contain` are used, the target object must have at 
-   * least all of the passed-in keys but may have more keys not listed.
-   * 
-   * When both `all` and `have` are used, the target object must both contain
-   * all of the passed-in keys AND the number of keys in the target object must
-   * match the number of keys passed in (in other words, a target object must 
-   * have all and only all of the passed-in keys).
-   * 
-   *     expect({ foo: 1, bar: 2 }).to.have.any.keys('foo', 'baz');
-   *     expect({ foo: 1, bar: 2 }).to.have.any.keys('foo');
-   *     expect({ foo: 1, bar: 2 }).to.contain.any.keys('bar', 'baz');
-   *     expect({ foo: 1, bar: 2 }).to.contain.any.keys(['foo']);
-   *     expect({ foo: 1, bar: 2 }).to.contain.any.keys({'foo': 6});
-   *     expect({ foo: 1, bar: 2 }).to.have.all.keys(['bar', 'foo']);
-   *     expect({ foo: 1, bar: 2 }).to.have.all.keys({'bar': 6, 'foo', 7});
-   *     expect({ foo: 1, bar: 2, baz: 3 }).to.contain.all.keys(['bar', 'foo']);
-   *     expect({ foo: 1, bar: 2, baz: 3 }).to.contain.all.keys([{'bar': 6}}]);
-   *
-   *
-   * @name keys
-   * @alias key
-   * @param {String...|Array|Object} keys
-   * @api public
-   */
-
-  function assertKeys (keys) {
-    var obj = flag(this, 'object')
-      , str
-      , ok = true
-      , mixedArgsMsg = 'keys must be given single argument of Array|Object|String, or multiple String arguments';
-
-    switch (_.type(keys)) {
-      case "array":
-        if (arguments.length > 1) throw (new Error(mixedArgsMsg));
-        break;
-      case "object":
-        if (arguments.length > 1) throw (new Error(mixedArgsMsg));
-        keys = Object.keys(keys);
-        break;
-      default:
-        keys = Array.prototype.slice.call(arguments);
-    }
-
-    if (!keys.length) throw new Error('keys required');
-
-    var actual = Object.keys(obj)
-      , expected = keys
-      , len = keys.length
-      , any = flag(this, 'any')
-      , all = flag(this, 'all');
-
-    if (!any && !all) {
-      all = true;
-    }
-
-    // Has any
-    if (any) {
-      var intersection = expected.filter(function(key) {
-        return ~actual.indexOf(key);
-      });
-      ok = intersection.length > 0;
-    }
-
-    // Has all
-    if (all) {
-      ok = keys.every(function(key){
-        return ~actual.indexOf(key);
-      });
-      if (!flag(this, 'negate') && !flag(this, 'contains')) {
-        ok = ok && keys.length == actual.length;
-      }
-    }
-
-    // Key string
-    if (len > 1) {
-      keys = keys.map(function(key){
-        return _.inspect(key);
-      });
-      var last = keys.pop();
-      if (all) {
-        str = keys.join(', ') + ', and ' + last;
-      }
-      if (any) {
-        str = keys.join(', ') + ', or ' + last;
-      }
-    } else {
-      str = _.inspect(keys[0]);
-    }
-
-    // Form
-    str = (len > 1 ? 'keys ' : 'key ') + str;
-
-    // Have / include
-    str = (flag(this, 'contains') ? 'contain ' : 'have ') + str;
-
-    // Assertion
-    this.assert(
-        ok
-      , 'expected #{this} to ' + str
-      , 'expected #{this} to not ' + str
-      , expected.slice(0).sort()
-      , actual.sort()
-      , true
-    );
-  }
-
-  Assertion.addMethod('keys', assertKeys);
-  Assertion.addMethod('key', assertKeys);
-
-  /**
-   * ### .throw(constructor)
-   *
-   * Asserts that the function target will throw a specific error, or specific type of error
-   * (as determined using `instanceof`), optionally with a RegExp or string inclusion test
-   * for the error's message.
-   *
-   *     var err = new ReferenceError('This is a bad function.');
-   *     var fn = function () { throw err; }
-   *     expect(fn).to.throw(ReferenceError);
-   *     expect(fn).to.throw(Error);
-   *     expect(fn).to.throw(/bad function/);
-   *     expect(fn).to.not.throw('good function');
-   *     expect(fn).to.throw(ReferenceError, /bad function/);
-   *     expect(fn).to.throw(err);
-   *     expect(fn).to.not.throw(new RangeError('Out of range.'));
-   *
-   * Please note that when a throw expectation is negated, it will check each
-   * parameter independently, starting with error constructor type. The appropriate way
-   * to check for the existence of a type of error but for a message that does not match
-   * is to use `and`.
-   *
-   *     expect(fn).to.throw(ReferenceError)
-   *        .and.not.throw(/good function/);
-   *
-   * @name throw
-   * @alias throws
-   * @alias Throw
-   * @param {ErrorConstructor} constructor
-   * @param {String|RegExp} expected error message
-   * @param {String} message _optional_
-   * @see https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Error#Error_types
-   * @returns error for chaining (null if no error)
-   * @api public
-   */
-
-  function assertThrows (constructor, errMsg, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    new Assertion(obj, msg).is.a('function');
-
-    var thrown = false
-      , desiredError = null
-      , name = null
-      , thrownError = null;
-
-    if (arguments.length === 0) {
-      errMsg = null;
-      constructor = null;
-    } else if (constructor && (constructor instanceof RegExp || 'string' === typeof constructor)) {
-      errMsg = constructor;
-      constructor = null;
-    } else if (constructor && constructor instanceof Error) {
-      desiredError = constructor;
-      constructor = null;
-      errMsg = null;
-    } else if (typeof constructor === 'function') {
-      name = constructor.prototype.name || constructor.name;
-      if (name === 'Error' && constructor !== Error) {
-        name = (new constructor()).name;
-      }
-    } else {
-      constructor = null;
-    }
-
-    try {
-      obj();
-    } catch (err) {
-      // first, check desired error
-      if (desiredError) {
-        this.assert(
-            err === desiredError
-          , 'expected #{this} to throw #{exp} but #{act} was thrown'
-          , 'expected #{this} to not throw #{exp}'
-          , (desiredError instanceof Error ? desiredError.toString() : desiredError)
-          , (err instanceof Error ? err.toString() : err)
-        );
-
-        flag(this, 'object', err);
-        return this;
-      }
-
-      // next, check constructor
-      if (constructor) {
-        this.assert(
-            err instanceof constructor
-          , 'expected #{this} to throw #{exp} but #{act} was thrown'
-          , 'expected #{this} to not throw #{exp} but #{act} was thrown'
-          , name
-          , (err instanceof Error ? err.toString() : err)
-        );
-
-        if (!errMsg) {
-          flag(this, 'object', err);
-          return this;
-        }
-      }
-
-      // next, check message
-      var message = 'object' === _.type(err) && "message" in err
-        ? err.message
-        : '' + err;
-
-      if ((message != null) && errMsg && errMsg instanceof RegExp) {
-        this.assert(
-            errMsg.exec(message)
-          , 'expected #{this} to throw error matching #{exp} but got #{act}'
-          , 'expected #{this} to throw error not matching #{exp}'
-          , errMsg
-          , message
-        );
-
-        flag(this, 'object', err);
-        return this;
-      } else if ((message != null) && errMsg && 'string' === typeof errMsg) {
-        this.assert(
-            ~message.indexOf(errMsg)
-          , 'expected #{this} to throw error including #{exp} but got #{act}'
-          , 'expected #{this} to throw error not including #{act}'
-          , errMsg
-          , message
-        );
-
-        flag(this, 'object', err);
-        return this;
-      } else {
-        thrown = true;
-        thrownError = err;
-      }
-    }
-
-    var actuallyGot = ''
-      , expectedThrown = name !== null
-        ? name
-        : desiredError
-          ? '#{exp}' //_.inspect(desiredError)
-          : 'an error';
-
-    if (thrown) {
-      actuallyGot = ' but #{act} was thrown'
-    }
-
-    this.assert(
-        thrown === true
-      , 'expected #{this} to throw ' + expectedThrown + actuallyGot
-      , 'expected #{this} to not throw ' + expectedThrown + actuallyGot
-      , (desiredError instanceof Error ? desiredError.toString() : desiredError)
-      , (thrownError instanceof Error ? thrownError.toString() : thrownError)
-    );
-
-    flag(this, 'object', thrownError);
-  };
-
-  Assertion.addMethod('throw', assertThrows);
-  Assertion.addMethod('throws', assertThrows);
-  Assertion.addMethod('Throw', assertThrows);
-
-  /**
-   * ### .respondTo(method)
-   *
-   * Asserts that the object or class target will respond to a method.
-   *
-   *     Klass.prototype.bar = function(){};
-   *     expect(Klass).to.respondTo('bar');
-   *     expect(obj).to.respondTo('bar');
-   *
-   * To check if a constructor will respond to a static function,
-   * set the `itself` flag.
-   *
-   *     Klass.baz = function(){};
-   *     expect(Klass).itself.to.respondTo('baz');
-   *
-   * @name respondTo
-   * @param {String} method
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  Assertion.addMethod('respondTo', function (method, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object')
-      , itself = flag(this, 'itself')
-      , context = ('function' === _.type(obj) && !itself)
-        ? obj.prototype[method]
-        : obj[method];
-
-    this.assert(
-        'function' === typeof context
-      , 'expected #{this} to respond to ' + _.inspect(method)
-      , 'expected #{this} to not respond to ' + _.inspect(method)
-    );
-  });
-
-  /**
-   * ### .itself
-   *
-   * Sets the `itself` flag, later used by the `respondTo` assertion.
-   *
-   *     function Foo() {}
-   *     Foo.bar = function() {}
-   *     Foo.prototype.baz = function() {}
-   *
-   *     expect(Foo).itself.to.respondTo('bar');
-   *     expect(Foo).itself.not.to.respondTo('baz');
-   *
-   * @name itself
-   * @api public
-   */
-
-  Assertion.addProperty('itself', function () {
-    flag(this, 'itself', true);
-  });
-
-  /**
-   * ### .satisfy(method)
-   *
-   * Asserts that the target passes a given truth test.
-   *
-   *     expect(1).to.satisfy(function(num) { return num > 0; });
-   *
-   * @name satisfy
-   * @param {Function} matcher
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  Assertion.addMethod('satisfy', function (matcher, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-    var result = matcher(obj);
-    this.assert(
-        result
-      , 'expected #{this} to satisfy ' + _.objDisplay(matcher)
-      , 'expected #{this} to not satisfy' + _.objDisplay(matcher)
-      , this.negate ? false : true
-      , result
-    );
-  });
-
-  /**
-   * ### .closeTo(expected, delta)
-   *
-   * Asserts that the target is equal `expected`, to within a +/- `delta` range.
-   *
-   *     expect(1.5).to.be.closeTo(1, 0.5);
-   *
-   * @name closeTo
-   * @param {Number} expected
-   * @param {Number} delta
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  Assertion.addMethod('closeTo', function (expected, delta, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-
-    new Assertion(obj, msg).is.a('number');
-    if (_.type(expected) !== 'number' || _.type(delta) !== 'number') {
-      throw new Error('the arguments to closeTo must be numbers');
-    }
-
-    this.assert(
-        Math.abs(obj - expected) <= delta
-      , 'expected #{this} to be close to ' + expected + ' +/- ' + delta
-      , 'expected #{this} not to be close to ' + expected + ' +/- ' + delta
-    );
-  });
-
-  function isSubsetOf(subset, superset, cmp) {
-    return subset.every(function(elem) {
-      if (!cmp) return superset.indexOf(elem) !== -1;
-
-      return superset.some(function(elem2) {
-        return cmp(elem, elem2);
-      });
-    })
-  }
-
-  /**
-   * ### .members(set)
-   *
-   * Asserts that the target is a superset of `set`,
-   * or that the target and `set` have the same strictly-equal (===) members.
-   * Alternately, if the `deep` flag is set, set members are compared for deep
-   * equality.
-   *
-   *     expect([1, 2, 3]).to.include.members([3, 2]);
-   *     expect([1, 2, 3]).to.not.include.members([3, 2, 8]);
-   *
-   *     expect([4, 2]).to.have.members([2, 4]);
-   *     expect([5, 2]).to.not.have.members([5, 2, 1]);
-   *
-   *     expect([{ id: 1 }]).to.deep.include.members([{ id: 1 }]);
-   *
-   * @name members
-   * @param {Array} set
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  Assertion.addMethod('members', function (subset, msg) {
-    if (msg) flag(this, 'message', msg);
-    var obj = flag(this, 'object');
-
-    new Assertion(obj).to.be.an('array');
-    new Assertion(subset).to.be.an('array');
-
-    var cmp = flag(this, 'deep') ? _.eql : undefined;
-
-    if (flag(this, 'contains')) {
-      return this.assert(
-          isSubsetOf(subset, obj, cmp)
-        , 'expected #{this} to be a superset of #{act}'
-        , 'expected #{this} to not be a superset of #{act}'
-        , obj
-        , subset
-      );
-    }
-
-    this.assert(
-        isSubsetOf(obj, subset, cmp) && isSubsetOf(subset, obj, cmp)
-        , 'expected #{this} to have the same members as #{act}'
-        , 'expected #{this} to not have the same members as #{act}'
-        , obj
-        , subset
-    );
-  });
-
-  /**
-   * ### .change(function)
-   *
-   * Asserts that a function changes an object property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { obj.val += 3 };
-   *     var noChangeFn = function() { return 'foo' + 'bar'; }
-   *     expect(fn).to.change(obj, 'val');
-   *     expect(noChangFn).to.not.change(obj, 'val')
-   *
-   * @name change
-   * @alias changes
-   * @alias Change
-   * @param {String} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertChanges (object, prop, msg) {
-    if (msg) flag(this, 'message', msg);
-    var fn = flag(this, 'object');
-    new Assertion(object, msg).to.have.property(prop);
-    new Assertion(fn).is.a('function');
-
-    var initial = object[prop];
-    fn();
-
-    this.assert(
-      initial !== object[prop]
-      , 'expected .' + prop + ' to change'
-      , 'expected .' + prop + ' to not change'
-    );
-  }
-
-  Assertion.addChainableMethod('change', assertChanges);
-  Assertion.addChainableMethod('changes', assertChanges);
-
-  /**
-   * ### .increase(function)
-   *
-   * Asserts that a function increases an object property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { obj.val = 15 };
-   *     expect(fn).to.increase(obj, 'val');
-   *
-   * @name increase
-   * @alias increases
-   * @alias Increase
-   * @param {String} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertIncreases (object, prop, msg) {
-    if (msg) flag(this, 'message', msg);
-    var fn = flag(this, 'object');
-    new Assertion(object, msg).to.have.property(prop);
-    new Assertion(fn).is.a('function');
-
-    var initial = object[prop];
-    fn();
-
-    this.assert(
-      object[prop] - initial > 0
-      , 'expected .' + prop + ' to increase'
-      , 'expected .' + prop + ' to not increase'
-    );
-  }
-
-  Assertion.addChainableMethod('increase', assertIncreases);
-  Assertion.addChainableMethod('increases', assertIncreases);
-
-  /**
-   * ### .decrease(function)
-   *
-   * Asserts that a function decreases an object property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { obj.val = 5 };
-   *     expect(fn).to.decrease(obj, 'val');
-   *
-   * @name decrease
-   * @alias decreases
-   * @alias Decrease
-   * @param {String} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  function assertDecreases (object, prop, msg) {
-    if (msg) flag(this, 'message', msg);
-    var fn = flag(this, 'object');
-    new Assertion(object, msg).to.have.property(prop);
-    new Assertion(fn).is.a('function');
-
-    var initial = object[prop];
-    fn();
-
-    this.assert(
-      object[prop] - initial < 0
-      , 'expected .' + prop + ' to decrease'
-      , 'expected .' + prop + ' to not decrease'
-    );
-  }
-
-  Assertion.addChainableMethod('decrease', assertDecreases);
-  Assertion.addChainableMethod('decreases', assertDecreases);
-
-};
-
-});
-
-require.register("chai/lib/chai/interface/assert.js", function (exports, module) {
-/*!
- * chai
- * Copyright(c) 2011-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-
-module.exports = function (chai, util) {
-
-  /*!
-   * Chai dependencies.
-   */
-
-  var Assertion = chai.Assertion
-    , flag = util.flag;
-
-  /*!
-   * Module export.
-   */
-
-  /**
-   * ### assert(expression, message)
-   *
-   * Write your own test expressions.
-   *
-   *     assert('foo' !== 'bar', 'foo is not bar');
-   *     assert(Array.isArray([]), 'empty arrays are arrays');
-   *
-   * @param {Mixed} expression to test for truthiness
-   * @param {String} message to display on error
-   * @name assert
-   * @api public
-   */
-
-  var assert = chai.assert = function (express, errmsg) {
-    var test = new Assertion(null, null, chai.assert);
-    test.assert(
-        express
-      , errmsg
-      , '[ negation message unavailable ]'
-    );
-  };
-
-  /**
-   * ### .fail(actual, expected, [message], [operator])
-   *
-   * Throw a failure. Node.js `assert` module-compatible.
-   *
-   * @name fail
-   * @param {Mixed} actual
-   * @param {Mixed} expected
-   * @param {String} message
-   * @param {String} operator
-   * @api public
-   */
-
-  assert.fail = function (actual, expected, message, operator) {
-    message = message || 'assert.fail()';
-    throw new chai.AssertionError(message, {
-        actual: actual
-      , expected: expected
-      , operator: operator
-    }, assert.fail);
-  };
-
-  /**
-   * ### .ok(object, [message])
-   *
-   * Asserts that `object` is truthy.
-   *
-   *     assert.ok('everything', 'everything is ok');
-   *     assert.ok(false, 'this will fail');
-   *
-   * @name ok
-   * @param {Mixed} object to test
-   * @param {String} message
-   * @api public
-   */
-
-  assert.ok = function (val, msg) {
-    new Assertion(val, msg).is.ok;
-  };
-
-  /**
-   * ### .notOk(object, [message])
-   *
-   * Asserts that `object` is falsy.
-   *
-   *     assert.notOk('everything', 'this will fail');
-   *     assert.notOk(false, 'this will pass');
-   *
-   * @name notOk
-   * @param {Mixed} object to test
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notOk = function (val, msg) {
-    new Assertion(val, msg).is.not.ok;
-  };
-
-  /**
-   * ### .equal(actual, expected, [message])
-   *
-   * Asserts non-strict equality (`==`) of `actual` and `expected`.
-   *
-   *     assert.equal(3, '3', '== coerces values to strings');
-   *
-   * @name equal
-   * @param {Mixed} actual
-   * @param {Mixed} expected
-   * @param {String} message
-   * @api public
-   */
-
-  assert.equal = function (act, exp, msg) {
-    var test = new Assertion(act, msg, assert.equal);
-
-    test.assert(
-        exp == flag(test, 'object')
-      , 'expected #{this} to equal #{exp}'
-      , 'expected #{this} to not equal #{act}'
-      , exp
-      , act
-    );
-  };
-
-  /**
-   * ### .notEqual(actual, expected, [message])
-   *
-   * Asserts non-strict inequality (`!=`) of `actual` and `expected`.
-   *
-   *     assert.notEqual(3, 4, 'these numbers are not equal');
-   *
-   * @name notEqual
-   * @param {Mixed} actual
-   * @param {Mixed} expected
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notEqual = function (act, exp, msg) {
-    var test = new Assertion(act, msg, assert.notEqual);
-
-    test.assert(
-        exp != flag(test, 'object')
-      , 'expected #{this} to not equal #{exp}'
-      , 'expected #{this} to equal #{act}'
-      , exp
-      , act
-    );
-  };
-
-  /**
-   * ### .strictEqual(actual, expected, [message])
-   *
-   * Asserts strict equality (`===`) of `actual` and `expected`.
-   *
-   *     assert.strictEqual(true, true, 'these booleans are strictly equal');
-   *
-   * @name strictEqual
-   * @param {Mixed} actual
-   * @param {Mixed} expected
-   * @param {String} message
-   * @api public
-   */
-
-  assert.strictEqual = function (act, exp, msg) {
-    new Assertion(act, msg).to.equal(exp);
-  };
-
-  /**
-   * ### .notStrictEqual(actual, expected, [message])
-   *
-   * Asserts strict inequality (`!==`) of `actual` and `expected`.
-   *
-   *     assert.notStrictEqual(3, '3', 'no coercion for strict equality');
-   *
-   * @name notStrictEqual
-   * @param {Mixed} actual
-   * @param {Mixed} expected
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notStrictEqual = function (act, exp, msg) {
-    new Assertion(act, msg).to.not.equal(exp);
-  };
-
-  /**
-   * ### .deepEqual(actual, expected, [message])
-   *
-   * Asserts that `actual` is deeply equal to `expected`.
-   *
-   *     assert.deepEqual({ tea: 'green' }, { tea: 'green' });
-   *
-   * @name deepEqual
-   * @param {Mixed} actual
-   * @param {Mixed} expected
-   * @param {String} message
-   * @api public
-   */
-
-  assert.deepEqual = function (act, exp, msg) {
-    new Assertion(act, msg).to.eql(exp);
-  };
-
-  /**
-   * ### .notDeepEqual(actual, expected, [message])
-   *
-   * Assert that `actual` is not deeply equal to `expected`.
-   *
-   *     assert.notDeepEqual({ tea: 'green' }, { tea: 'jasmine' });
-   *
-   * @name notDeepEqual
-   * @param {Mixed} actual
-   * @param {Mixed} expected
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notDeepEqual = function (act, exp, msg) {
-    new Assertion(act, msg).to.not.eql(exp);
-  };
-
-  /**
-   * ### .isTrue(value, [message])
-   *
-   * Asserts that `value` is true.
-   *
-   *     var teaServed = true;
-   *     assert.isTrue(teaServed, 'the tea has been served');
-   *
-   * @name isTrue
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isAbove = function (val, abv, msg) {
-    new Assertion(val, msg).to.be.above(abv);
-  };
-
-   /**
-   * ### .isAbove(valueToCheck, valueToBeAbove, [message])
-   *
-   * Asserts `valueToCheck` is strictly greater than (>) `valueToBeAbove`
-   *
-   *     assert.isAbove(5, 2, '5 is strictly greater than 2');
-   *
-   * @name isAbove
-   * @param {Mixed} valueToCheck
-   * @param {Mixed} valueToBeAbove
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isBelow = function (val, blw, msg) {
-    new Assertion(val, msg).to.be.below(blw);
-  };
-
-   /**
-   * ### .isBelow(valueToCheck, valueToBeBelow, [message])
-   *
-   * Asserts `valueToCheck` is strictly less than (<) `valueToBeBelow`
-   *
-   *     assert.isBelow(3, 6, '3 is strictly less than 6');
-   *
-   * @name isBelow
-   * @param {Mixed} valueToCheck
-   * @param {Mixed} valueToBeBelow
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isTrue = function (val, msg) {
-    new Assertion(val, msg).is['true'];
-  };
-
-  /**
-   * ### .isFalse(value, [message])
-   *
-   * Asserts that `value` is false.
-   *
-   *     var teaServed = false;
-   *     assert.isFalse(teaServed, 'no tea yet? hmm...');
-   *
-   * @name isFalse
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isFalse = function (val, msg) {
-    new Assertion(val, msg).is['false'];
-  };
-
-  /**
-   * ### .isNull(value, [message])
-   *
-   * Asserts that `value` is null.
-   *
-   *     assert.isNull(err, 'there was no error');
-   *
-   * @name isNull
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNull = function (val, msg) {
-    new Assertion(val, msg).to.equal(null);
-  };
-
-  /**
-   * ### .isNotNull(value, [message])
-   *
-   * Asserts that `value` is not null.
-   *
-   *     var tea = 'tasty chai';
-   *     assert.isNotNull(tea, 'great, time for tea!');
-   *
-   * @name isNotNull
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNotNull = function (val, msg) {
-    new Assertion(val, msg).to.not.equal(null);
-  };
-
-  /**
-   * ### .isUndefined(value, [message])
-   *
-   * Asserts that `value` is `undefined`.
-   *
-   *     var tea;
-   *     assert.isUndefined(tea, 'no tea defined');
-   *
-   * @name isUndefined
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isUndefined = function (val, msg) {
-    new Assertion(val, msg).to.equal(undefined);
-  };
-
-  /**
-   * ### .isDefined(value, [message])
-   *
-   * Asserts that `value` is not `undefined`.
-   *
-   *     var tea = 'cup of chai';
-   *     assert.isDefined(tea, 'tea has been defined');
-   *
-   * @name isDefined
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isDefined = function (val, msg) {
-    new Assertion(val, msg).to.not.equal(undefined);
-  };
-
-  /**
-   * ### .isFunction(value, [message])
-   *
-   * Asserts that `value` is a function.
-   *
-   *     function serveTea() { return 'cup of tea'; };
-   *     assert.isFunction(serveTea, 'great, we can have tea now');
-   *
-   * @name isFunction
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isFunction = function (val, msg) {
-    new Assertion(val, msg).to.be.a('function');
-  };
-
-  /**
-   * ### .isNotFunction(value, [message])
-   *
-   * Asserts that `value` is _not_ a function.
-   *
-   *     var serveTea = [ 'heat', 'pour', 'sip' ];
-   *     assert.isNotFunction(serveTea, 'great, we have listed the steps');
-   *
-   * @name isNotFunction
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNotFunction = function (val, msg) {
-    new Assertion(val, msg).to.not.be.a('function');
-  };
-
-  /**
-   * ### .isObject(value, [message])
-   *
-   * Asserts that `value` is an object (as revealed by
-   * `Object.prototype.toString`).
-   *
-   *     var selection = { name: 'Chai', serve: 'with spices' };
-   *     assert.isObject(selection, 'tea selection is an object');
-   *
-   * @name isObject
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isObject = function (val, msg) {
-    new Assertion(val, msg).to.be.a('object');
-  };
-
-  /**
-   * ### .isNotObject(value, [message])
-   *
-   * Asserts that `value` is _not_ an object.
-   *
-   *     var selection = 'chai'
-   *     assert.isNotObject(selection, 'tea selection is not an object');
-   *     assert.isNotObject(null, 'null is not an object');
-   *
-   * @name isNotObject
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNotObject = function (val, msg) {
-    new Assertion(val, msg).to.not.be.a('object');
-  };
-
-  /**
-   * ### .isArray(value, [message])
-   *
-   * Asserts that `value` is an array.
-   *
-   *     var menu = [ 'green', 'chai', 'oolong' ];
-   *     assert.isArray(menu, 'what kind of tea do we want?');
-   *
-   * @name isArray
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isArray = function (val, msg) {
-    new Assertion(val, msg).to.be.an('array');
-  };
-
-  /**
-   * ### .isNotArray(value, [message])
-   *
-   * Asserts that `value` is _not_ an array.
-   *
-   *     var menu = 'green|chai|oolong';
-   *     assert.isNotArray(menu, 'what kind of tea do we want?');
-   *
-   * @name isNotArray
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNotArray = function (val, msg) {
-    new Assertion(val, msg).to.not.be.an('array');
-  };
-
-  /**
-   * ### .isString(value, [message])
-   *
-   * Asserts that `value` is a string.
-   *
-   *     var teaOrder = 'chai';
-   *     assert.isString(teaOrder, 'order placed');
-   *
-   * @name isString
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isString = function (val, msg) {
-    new Assertion(val, msg).to.be.a('string');
-  };
-
-  /**
-   * ### .isNotString(value, [message])
-   *
-   * Asserts that `value` is _not_ a string.
-   *
-   *     var teaOrder = 4;
-   *     assert.isNotString(teaOrder, 'order placed');
-   *
-   * @name isNotString
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNotString = function (val, msg) {
-    new Assertion(val, msg).to.not.be.a('string');
-  };
-
-  /**
-   * ### .isNumber(value, [message])
-   *
-   * Asserts that `value` is a number.
-   *
-   *     var cups = 2;
-   *     assert.isNumber(cups, 'how many cups');
-   *
-   * @name isNumber
-   * @param {Number} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNumber = function (val, msg) {
-    new Assertion(val, msg).to.be.a('number');
-  };
-
-  /**
-   * ### .isNotNumber(value, [message])
-   *
-   * Asserts that `value` is _not_ a number.
-   *
-   *     var cups = '2 cups please';
-   *     assert.isNotNumber(cups, 'how many cups');
-   *
-   * @name isNotNumber
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNotNumber = function (val, msg) {
-    new Assertion(val, msg).to.not.be.a('number');
-  };
-
-  /**
-   * ### .isBoolean(value, [message])
-   *
-   * Asserts that `value` is a boolean.
-   *
-   *     var teaReady = true
-   *       , teaServed = false;
-   *
-   *     assert.isBoolean(teaReady, 'is the tea ready');
-   *     assert.isBoolean(teaServed, 'has tea been served');
-   *
-   * @name isBoolean
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isBoolean = function (val, msg) {
-    new Assertion(val, msg).to.be.a('boolean');
-  };
-
-  /**
-   * ### .isNotBoolean(value, [message])
-   *
-   * Asserts that `value` is _not_ a boolean.
-   *
-   *     var teaReady = 'yep'
-   *       , teaServed = 'nope';
-   *
-   *     assert.isNotBoolean(teaReady, 'is the tea ready');
-   *     assert.isNotBoolean(teaServed, 'has tea been served');
-   *
-   * @name isNotBoolean
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.isNotBoolean = function (val, msg) {
-    new Assertion(val, msg).to.not.be.a('boolean');
-  };
-
-  /**
-   * ### .typeOf(value, name, [message])
-   *
-   * Asserts that `value`'s type is `name`, as determined by
-   * `Object.prototype.toString`.
-   *
-   *     assert.typeOf({ tea: 'chai' }, 'object', 'we have an object');
-   *     assert.typeOf(['chai', 'jasmine'], 'array', 'we have an array');
-   *     assert.typeOf('tea', 'string', 'we have a string');
-   *     assert.typeOf(/tea/, 'regexp', 'we have a regular expression');
-   *     assert.typeOf(null, 'null', 'we have a null');
-   *     assert.typeOf(undefined, 'undefined', 'we have an undefined');
-   *
-   * @name typeOf
-   * @param {Mixed} value
-   * @param {String} name
-   * @param {String} message
-   * @api public
-   */
-
-  assert.typeOf = function (val, type, msg) {
-    new Assertion(val, msg).to.be.a(type);
-  };
-
-  /**
-   * ### .notTypeOf(value, name, [message])
-   *
-   * Asserts that `value`'s type is _not_ `name`, as determined by
-   * `Object.prototype.toString`.
-   *
-   *     assert.notTypeOf('tea', 'number', 'strings are not numbers');
-   *
-   * @name notTypeOf
-   * @param {Mixed} value
-   * @param {String} typeof name
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notTypeOf = function (val, type, msg) {
-    new Assertion(val, msg).to.not.be.a(type);
-  };
-
-  /**
-   * ### .instanceOf(object, constructor, [message])
-   *
-   * Asserts that `value` is an instance of `constructor`.
-   *
-   *     var Tea = function (name) { this.name = name; }
-   *       , chai = new Tea('chai');
-   *
-   *     assert.instanceOf(chai, Tea, 'chai is an instance of tea');
-   *
-   * @name instanceOf
-   * @param {Object} object
-   * @param {Constructor} constructor
-   * @param {String} message
-   * @api public
-   */
-
-  assert.instanceOf = function (val, type, msg) {
-    new Assertion(val, msg).to.be.instanceOf(type);
-  };
-
-  /**
-   * ### .notInstanceOf(object, constructor, [message])
-   *
-   * Asserts `value` is not an instance of `constructor`.
-   *
-   *     var Tea = function (name) { this.name = name; }
-   *       , chai = new String('chai');
-   *
-   *     assert.notInstanceOf(chai, Tea, 'chai is not an instance of tea');
-   *
-   * @name notInstanceOf
-   * @param {Object} object
-   * @param {Constructor} constructor
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notInstanceOf = function (val, type, msg) {
-    new Assertion(val, msg).to.not.be.instanceOf(type);
-  };
-
-  /**
-   * ### .include(haystack, needle, [message])
-   *
-   * Asserts that `haystack` includes `needle`. Works
-   * for strings and arrays.
-   *
-   *     assert.include('foobar', 'bar', 'foobar contains string "bar"');
-   *     assert.include([ 1, 2, 3 ], 3, 'array contains value');
-   *
-   * @name include
-   * @param {Array|String} haystack
-   * @param {Mixed} needle
-   * @param {String} message
-   * @api public
-   */
-
-  assert.include = function (exp, inc, msg) {
-    new Assertion(exp, msg, assert.include).include(inc);
-  };
-
-  /**
-   * ### .notInclude(haystack, needle, [message])
-   *
-   * Asserts that `haystack` does not include `needle`. Works
-   * for strings and arrays.
-   *i
-   *     assert.notInclude('foobar', 'baz', 'string not include substring');
-   *     assert.notInclude([ 1, 2, 3 ], 4, 'array not include contain value');
-   *
-   * @name notInclude
-   * @param {Array|String} haystack
-   * @param {Mixed} needle
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notInclude = function (exp, inc, msg) {
-    new Assertion(exp, msg, assert.notInclude).not.include(inc);
-  };
-
-  /**
-   * ### .match(value, regexp, [message])
-   *
-   * Asserts that `value` matches the regular expression `regexp`.
-   *
-   *     assert.match('foobar', /^foo/, 'regexp matches');
-   *
-   * @name match
-   * @param {Mixed} value
-   * @param {RegExp} regexp
-   * @param {String} message
-   * @api public
-   */
-
-  assert.match = function (exp, re, msg) {
-    new Assertion(exp, msg).to.match(re);
-  };
-
-  /**
-   * ### .notMatch(value, regexp, [message])
-   *
-   * Asserts that `value` does not match the regular expression `regexp`.
-   *
-   *     assert.notMatch('foobar', /^foo/, 'regexp does not match');
-   *
-   * @name notMatch
-   * @param {Mixed} value
-   * @param {RegExp} regexp
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notMatch = function (exp, re, msg) {
-    new Assertion(exp, msg).to.not.match(re);
-  };
-
-  /**
-   * ### .property(object, property, [message])
-   *
-   * Asserts that `object` has a property named by `property`.
-   *
-   *     assert.property({ tea: { green: 'matcha' }}, 'tea');
-   *
-   * @name property
-   * @param {Object} object
-   * @param {String} property
-   * @param {String} message
-   * @api public
-   */
-
-  assert.property = function (obj, prop, msg) {
-    new Assertion(obj, msg).to.have.property(prop);
-  };
-
-  /**
-   * ### .notProperty(object, property, [message])
-   *
-   * Asserts that `object` does _not_ have a property named by `property`.
-   *
-   *     assert.notProperty({ tea: { green: 'matcha' }}, 'coffee');
-   *
-   * @name notProperty
-   * @param {Object} object
-   * @param {String} property
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notProperty = function (obj, prop, msg) {
-    new Assertion(obj, msg).to.not.have.property(prop);
-  };
-
-  /**
-   * ### .deepProperty(object, property, [message])
-   *
-   * Asserts that `object` has a property named by `property`, which can be a
-   * string using dot- and bracket-notation for deep reference.
-   *
-   *     assert.deepProperty({ tea: { green: 'matcha' }}, 'tea.green');
-   *
-   * @name deepProperty
-   * @param {Object} object
-   * @param {String} property
-   * @param {String} message
-   * @api public
-   */
-
-  assert.deepProperty = function (obj, prop, msg) {
-    new Assertion(obj, msg).to.have.deep.property(prop);
-  };
-
-  /**
-   * ### .notDeepProperty(object, property, [message])
-   *
-   * Asserts that `object` does _not_ have a property named by `property`, which
-   * can be a string using dot- and bracket-notation for deep reference.
-   *
-   *     assert.notDeepProperty({ tea: { green: 'matcha' }}, 'tea.oolong');
-   *
-   * @name notDeepProperty
-   * @param {Object} object
-   * @param {String} property
-   * @param {String} message
-   * @api public
-   */
-
-  assert.notDeepProperty = function (obj, prop, msg) {
-    new Assertion(obj, msg).to.not.have.deep.property(prop);
-  };
-
-  /**
-   * ### .propertyVal(object, property, value, [message])
-   *
-   * Asserts that `object` has a property named by `property` with value given
-   * by `value`.
-   *
-   *     assert.propertyVal({ tea: 'is good' }, 'tea', 'is good');
-   *
-   * @name propertyVal
-   * @param {Object} object
-   * @param {String} property
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.propertyVal = function (obj, prop, val, msg) {
-    new Assertion(obj, msg).to.have.property(prop, val);
-  };
-
-  /**
-   * ### .propertyNotVal(object, property, value, [message])
-   *
-   * Asserts that `object` has a property named by `property`, but with a value
-   * different from that given by `value`.
-   *
-   *     assert.propertyNotVal({ tea: 'is good' }, 'tea', 'is bad');
-   *
-   * @name propertyNotVal
-   * @param {Object} object
-   * @param {String} property
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.propertyNotVal = function (obj, prop, val, msg) {
-    new Assertion(obj, msg).to.not.have.property(prop, val);
-  };
-
-  /**
-   * ### .deepPropertyVal(object, property, value, [message])
-   *
-   * Asserts that `object` has a property named by `property` with value given
-   * by `value`. `property` can use dot- and bracket-notation for deep
-   * reference.
-   *
-   *     assert.deepPropertyVal({ tea: { green: 'matcha' }}, 'tea.green', 'matcha');
-   *
-   * @name deepPropertyVal
-   * @param {Object} object
-   * @param {String} property
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.deepPropertyVal = function (obj, prop, val, msg) {
-    new Assertion(obj, msg).to.have.deep.property(prop, val);
-  };
-
-  /**
-   * ### .deepPropertyNotVal(object, property, value, [message])
-   *
-   * Asserts that `object` has a property named by `property`, but with a value
-   * different from that given by `value`. `property` can use dot- and
-   * bracket-notation for deep reference.
-   *
-   *     assert.deepPropertyNotVal({ tea: { green: 'matcha' }}, 'tea.green', 'konacha');
-   *
-   * @name deepPropertyNotVal
-   * @param {Object} object
-   * @param {String} property
-   * @param {Mixed} value
-   * @param {String} message
-   * @api public
-   */
-
-  assert.deepPropertyNotVal = function (obj, prop, val, msg) {
-    new Assertion(obj, msg).to.not.have.deep.property(prop, val);
-  };
-
-  /**
-   * ### .lengthOf(object, length, [message])
-   *
-   * Asserts that `object` has a `length` property with the expected value.
-   *
-   *     assert.lengthOf([1,2,3], 3, 'array has length of 3');
-   *     assert.lengthOf('foobar', 5, 'string has length of 6');
-   *
-   * @name lengthOf
-   * @param {Mixed} object
-   * @param {Number} length
-   * @param {String} message
-   * @api public
-   */
-
-  assert.lengthOf = function (exp, len, msg) {
-    new Assertion(exp, msg).to.have.length(len);
-  };
-
-  /**
-   * ### .throws(function, [constructor/string/regexp], [string/regexp], [message])
-   *
-   * Asserts that `function` will throw an error that is an instance of
-   * `constructor`, or alternately that it will throw an error with message
-   * matching `regexp`.
-   *
-   *     assert.throw(fn, 'function throws a reference error');
-   *     assert.throw(fn, /function throws a reference error/);
-   *     assert.throw(fn, ReferenceError);
-   *     assert.throw(fn, ReferenceError, 'function throws a reference error');
-   *     assert.throw(fn, ReferenceError, /function throws a reference error/);
-   *
-   * @name throws
-   * @alias throw
-   * @alias Throw
-   * @param {Function} function
-   * @param {ErrorConstructor} constructor
-   * @param {RegExp} regexp
-   * @param {String} message
-   * @see https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Error#Error_types
-   * @api public
-   */
-
-  assert.Throw = function (fn, errt, errs, msg) {
-    if ('string' === typeof errt || errt instanceof RegExp) {
-      errs = errt;
-      errt = null;
-    }
-
-    var assertErr = new Assertion(fn, msg).to.Throw(errt, errs);
-    return flag(assertErr, 'object');
-  };
-
-  /**
-   * ### .doesNotThrow(function, [constructor/regexp], [message])
-   *
-   * Asserts that `function` will _not_ throw an error that is an instance of
-   * `constructor`, or alternately that it will not throw an error with message
-   * matching `regexp`.
-   *
-   *     assert.doesNotThrow(fn, Error, 'function does not throw');
-   *
-   * @name doesNotThrow
-   * @param {Function} function
-   * @param {ErrorConstructor} constructor
-   * @param {RegExp} regexp
-   * @param {String} message
-   * @see https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Error#Error_types
-   * @api public
-   */
-
-  assert.doesNotThrow = function (fn, type, msg) {
-    if ('string' === typeof type) {
-      msg = type;
-      type = null;
-    }
-
-    new Assertion(fn, msg).to.not.Throw(type);
-  };
-
-  /**
-   * ### .operator(val1, operator, val2, [message])
-   *
-   * Compares two values using `operator`.
-   *
-   *     assert.operator(1, '<', 2, 'everything is ok');
-   *     assert.operator(1, '>', 2, 'this will fail');
-   *
-   * @name operator
-   * @param {Mixed} val1
-   * @param {String} operator
-   * @param {Mixed} val2
-   * @param {String} message
-   * @api public
-   */
-
-  assert.operator = function (val, operator, val2, msg) {
-    if (!~['==', '===', '>', '>=', '<', '<=', '!=', '!=='].indexOf(operator)) {
-      throw new Error('Invalid operator "' + operator + '"');
-    }
-    var test = new Assertion(eval(val + operator + val2), msg);
-    test.assert(
-        true === flag(test, 'object')
-      , 'expected ' + util.inspect(val) + ' to be ' + operator + ' ' + util.inspect(val2)
-      , 'expected ' + util.inspect(val) + ' to not be ' + operator + ' ' + util.inspect(val2) );
-  };
-
-  /**
-   * ### .closeTo(actual, expected, delta, [message])
-   *
-   * Asserts that the target is equal `expected`, to within a +/- `delta` range.
-   *
-   *     assert.closeTo(1.5, 1, 0.5, 'numbers are close');
-   *
-   * @name closeTo
-   * @param {Number} actual
-   * @param {Number} expected
-   * @param {Number} delta
-   * @param {String} message
-   * @api public
-   */
-
-  assert.closeTo = function (act, exp, delta, msg) {
-    new Assertion(act, msg).to.be.closeTo(exp, delta);
-  };
-
-  /**
-   * ### .sameMembers(set1, set2, [message])
-   *
-   * Asserts that `set1` and `set2` have the same members.
-   * Order is not taken into account.
-   *
-   *     assert.sameMembers([ 1, 2, 3 ], [ 2, 1, 3 ], 'same members');
-   *
-   * @name sameMembers
-   * @param {Array} set1
-   * @param {Array} set2
-   * @param {String} message
-   * @api public
-   */
-
-  assert.sameMembers = function (set1, set2, msg) {
-    new Assertion(set1, msg).to.have.same.members(set2);
-  }
-
-  /**
-   * ### .sameDeepMembers(set1, set2, [message])
-   *
-   * Asserts that `set1` and `set2` have the same members - using a deep equality checking.
-   * Order is not taken into account.
-   *
-   *     assert.sameDeepMembers([ {b: 3}, {a: 2}, {c: 5} ], [ {c: 5}, {b: 3}, {a: 2} ], 'same deep members');
-   *
-   * @name sameDeepMembers
-   * @param {Array} set1
-   * @param {Array} set2
-   * @param {String} message
-   * @api public
-   */
-
-  assert.sameDeepMembers = function (set1, set2, msg) {
-    new Assertion(set1, msg).to.have.same.deep.members(set2);
-  }
-
-  /**
-   * ### .includeMembers(superset, subset, [message])
-   *
-   * Asserts that `subset` is included in `superset`.
-   * Order is not taken into account.
-   *
-   *     assert.includeMembers([ 1, 2, 3 ], [ 2, 1 ], 'include members');
-   *
-   * @name includeMembers
-   * @param {Array} superset
-   * @param {Array} subset
-   * @param {String} message
-   * @api public
-   */
-
-  assert.includeMembers = function (superset, subset, msg) {
-    new Assertion(superset, msg).to.include.members(subset);
-  }
-
-   /**
-   * ### .changes(function, object, property)
-   *
-   * Asserts that a function changes the value of a property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { obj.val = 22 };
-   *     assert.changes(fn, obj, 'val');
-   *
-   * @name changes
-   * @param {Function} modifier function
-   * @param {Object} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  assert.changes = function (fn, obj, prop) {
-    new Assertion(fn).to.change(obj, prop);
-  }
-
-   /**
-   * ### .doesNotChange(function, object, property)
-   *
-   * Asserts that a function does not changes the value of a property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { console.log('foo'); };
-   *     assert.doesNotChange(fn, obj, 'val');
-   *
-   * @name doesNotChange
-   * @param {Function} modifier function
-   * @param {Object} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  assert.doesNotChange = function (fn, obj, prop) {
-    new Assertion(fn).to.not.change(obj, prop);
-  }
-
-   /**
-   * ### .increases(function, object, property)
-   *
-   * Asserts that a function increases an object property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { obj.val = 13 };
-   *     assert.increases(fn, obj, 'val');
-   *
-   * @name increases
-   * @param {Function} modifier function
-   * @param {Object} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  assert.increases = function (fn, obj, prop) {
-    new Assertion(fn).to.increase(obj, prop);
-  }
-
-   /**
-   * ### .doesNotIncrease(function, object, property)
-   *
-   * Asserts that a function does not increase object property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { obj.val = 8 };
-   *     assert.doesNotIncrease(fn, obj, 'val');
-   *
-   * @name doesNotIncrease
-   * @param {Function} modifier function
-   * @param {Object} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  assert.doesNotIncrease = function (fn, obj, prop) {
-    new Assertion(fn).to.not.increase(obj, prop);
-  }
-
-   /**
-   * ### .decreases(function, object, property)
-   *
-   * Asserts that a function decreases an object property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { obj.val = 5 };
-   *     assert.decreases(fn, obj, 'val');
-   *
-   * @name decreases
-   * @param {Function} modifier function
-   * @param {Object} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  assert.decreases = function (fn, obj, prop) {
-    new Assertion(fn).to.decrease(obj, prop);
-  }
-
-   /**
-   * ### .doesNotDecrease(function, object, property)
-   *
-   * Asserts that a function does not decreases an object property
-   *
-   *     var obj = { val: 10 };
-   *     var fn = function() { obj.val = 15 };
-   *     assert.doesNotDecrease(fn, obj, 'val');
-   *
-   * @name doesNotDecrease
-   * @param {Function} modifier function
-   * @param {Object} object
-   * @param {String} property name
-   * @param {String} message _optional_
-   * @api public
-   */
-
-  assert.doesNotDecrease = function (fn, obj, prop) {
-    new Assertion(fn).to.not.decrease(obj, prop);
-  }
-
-  /*!
-   * Undocumented / untested
-   */
-
-  assert.ifError = function (val, msg) {
-    new Assertion(val, msg).to.not.be.ok;
-  };
-
-  /*!
-   * Aliases.
-   */
-
-  (function alias(name, as){
-    assert[as] = assert[name];
-    return alias;
-  })
-  ('Throw', 'throw')
-  ('Throw', 'throws');
-};
-
-});
-
-require.register("chai/lib/chai/interface/expect.js", function (exports, module) {
-/*!
- * chai
- * Copyright(c) 2011-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-module.exports = function (chai, util) {
-  chai.expect = function (val, message) {
-    return new chai.Assertion(val, message);
-  };
-
-  /**
-   * ### .fail(actual, expected, [message], [operator])
-   *
-   * Throw a failure.
-   *
-   * @name fail
-   * @param {Mixed} actual
-   * @param {Mixed} expected
-   * @param {String} message
-   * @param {String} operator
-   * @api public
-   */
-
-  chai.expect.fail = function (actual, expected, message, operator) {
-    message = message || 'expect.fail()';
-    throw new chai.AssertionError(message, {
-        actual: actual
-      , expected: expected
-      , operator: operator
-    }, chai.expect.fail);
-  };
-};
-
-});
-
-require.register("chai/lib/chai/interface/should.js", function (exports, module) {
-/*!
- * chai
- * Copyright(c) 2011-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-module.exports = function (chai, util) {
-  var Assertion = chai.Assertion;
-
-  function loadShould () {
-    // explicitly define this method as function as to have it's name to include as `ssfi`
-    function shouldGetter() {
-      if (this instanceof String || this instanceof Number) {
-        return new Assertion(this.constructor(this), null, shouldGetter);
-      } else if (this instanceof Boolean) {
-        return new Assertion(this == true, null, shouldGetter);
-      }
-      return new Assertion(this, null, shouldGetter);
-    }
-    function shouldSetter(value) {
-      // See https://github.com/chaijs/chai/issues/86: this makes
-      // `whatever.should = someValue` actually set `someValue`, which is
-      // especially useful for `global.should = require('chai').should()`.
-      //
-      // Note that we have to use [[DefineProperty]] instead of [[Put]]
-      // since otherwise we would trigger this very setter!
-      Object.defineProperty(this, 'should', {
-        value: value,
-        enumerable: true,
-        configurable: true,
-        writable: true
-      });
-    }
-    // modify Object.prototype to have `should`
-    Object.defineProperty(Object.prototype, 'should', {
-      set: shouldSetter
-      , get: shouldGetter
-      , configurable: true
-    });
-
-    var should = {};
-
-    /**
-     * ### .fail(actual, expected, [message], [operator])
-     *
-     * Throw a failure.
-     *
-     * @name fail
-     * @param {Mixed} actual
-     * @param {Mixed} expected
-     * @param {String} message
-     * @param {String} operator
-     * @api public
-     */
-
-    should.fail = function (actual, expected, message, operator) {
-      message = message || 'should.fail()';
-      throw new chai.AssertionError(message, {
-          actual: actual
-        , expected: expected
-        , operator: operator
-      }, should.fail);
-    };
-
-    should.equal = function (val1, val2, msg) {
-      new Assertion(val1, msg).to.equal(val2);
-    };
-
-    should.Throw = function (fn, errt, errs, msg) {
-      new Assertion(fn, msg).to.Throw(errt, errs);
-    };
-
-    should.exist = function (val, msg) {
-      new Assertion(val, msg).to.exist;
-    }
-
-    // negation
-    should.not = {}
-
-    should.not.equal = function (val1, val2, msg) {
-      new Assertion(val1, msg).to.not.equal(val2);
-    };
-
-    should.not.Throw = function (fn, errt, errs, msg) {
-      new Assertion(fn, msg).to.not.Throw(errt, errs);
-    };
-
-    should.not.exist = function (val, msg) {
-      new Assertion(val, msg).to.not.exist;
-    }
-
-    should['throw'] = should['Throw'];
-    should.not['throw'] = should.not['Throw'];
-
-    return should;
-  };
-
-  chai.should = loadShould;
-  chai.Should = loadShould;
-};
-
-});
-
-require.register("chai/lib/chai/utils/addChainableMethod.js", function (exports, module) {
-/*!
- * Chai - addChainingMethod utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/*!
- * Module dependencies
- */
-
-var transferFlags = require('chai/lib/chai/utils/transferFlags.js');
-var flag = require('chai/lib/chai/utils/flag.js');
-var config = require('chai/lib/chai/config.js');
-
-/*!
- * Module variables
- */
-
-// Check whether `__proto__` is supported
-var hasProtoSupport = '__proto__' in Object;
-
-// Without `__proto__` support, this module will need to add properties to a function.
-// However, some Function.prototype methods cannot be overwritten,
-// and there seems no easy cross-platform way to detect them (@see chaijs/chai/issues/69).
-var excludeNames = /^(?:length|name|arguments|caller)$/;
-
-// Cache `Function` properties
-var call  = Function.prototype.call,
-    apply = Function.prototype.apply;
-
-/**
- * ### addChainableMethod (ctx, name, method, chainingBehavior)
- *
- * Adds a method to an object, such that the method can also be chained.
- *
- *     utils.addChainableMethod(chai.Assertion.prototype, 'foo', function (str) {
- *       var obj = utils.flag(this, 'object');
- *       new chai.Assertion(obj).to.be.equal(str);
- *     });
- *
- * Can also be accessed directly from `chai.Assertion`.
- *
- *     chai.Assertion.addChainableMethod('foo', fn, chainingBehavior);
- *
- * The result can then be used as both a method assertion, executing both `method` and
- * `chainingBehavior`, or as a language chain, which only executes `chainingBehavior`.
- *
- *     expect(fooStr).to.be.foo('bar');
- *     expect(fooStr).to.be.foo.equal('foo');
- *
- * @param {Object} ctx object to which the method is added
- * @param {String} name of method to add
- * @param {Function} method function to be used for `name`, when called
- * @param {Function} chainingBehavior function to be called every time the property is accessed
- * @name addChainableMethod
- * @api public
- */
-
-module.exports = function (ctx, name, method, chainingBehavior) {
-  if (typeof chainingBehavior !== 'function') {
-    chainingBehavior = function () { };
-  }
-
-  var chainableBehavior = {
-      method: method
-    , chainingBehavior: chainingBehavior
-  };
-
-  // save the methods so we can overwrite them later, if we need to.
-  if (!ctx.__methods) {
-    ctx.__methods = {};
-  }
-  ctx.__methods[name] = chainableBehavior;
-
-  Object.defineProperty(ctx, name,
-    { get: function () {
-        chainableBehavior.chainingBehavior.call(this);
-
-        var assert = function assert() {
-          var old_ssfi = flag(this, 'ssfi');
-          if (old_ssfi && config.includeStack === false)
-            flag(this, 'ssfi', assert);
-          var result = chainableBehavior.method.apply(this, arguments);
-          return result === undefined ? this : result;
-        };
-
-        // Use `__proto__` if available
-        if (hasProtoSupport) {
-          // Inherit all properties from the object by replacing the `Function` prototype
-          var prototype = assert.__proto__ = Object.create(this);
-          // Restore the `call` and `apply` methods from `Function`
-          prototype.call = call;
-          prototype.apply = apply;
-        }
-        // Otherwise, redefine all properties (slow!)
-        else {
-          var asserterNames = Object.getOwnPropertyNames(ctx);
-          asserterNames.forEach(function (asserterName) {
-            if (!excludeNames.test(asserterName)) {
-              var pd = Object.getOwnPropertyDescriptor(ctx, asserterName);
-              Object.defineProperty(assert, asserterName, pd);
-            }
-          });
-        }
-
-        transferFlags(this, assert);
-        return assert;
-      }
-    , configurable: true
-  });
-};
-
-});
-
-require.register("chai/lib/chai/utils/addMethod.js", function (exports, module) {
-/*!
- * Chai - addMethod utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-var config = require('chai/lib/chai/config.js');
-
-/**
- * ### .addMethod (ctx, name, method)
- *
- * Adds a method to the prototype of an object.
- *
- *     utils.addMethod(chai.Assertion.prototype, 'foo', function (str) {
- *       var obj = utils.flag(this, 'object');
- *       new chai.Assertion(obj).to.be.equal(str);
- *     });
- *
- * Can also be accessed directly from `chai.Assertion`.
- *
- *     chai.Assertion.addMethod('foo', fn);
- *
- * Then can be used as any other assertion.
- *
- *     expect(fooStr).to.be.foo('bar');
- *
- * @param {Object} ctx object to which the method is added
- * @param {String} name of method to add
- * @param {Function} method function to be used for name
- * @name addMethod
- * @api public
- */
-var flag = require('chai/lib/chai/utils/flag.js');
-
-module.exports = function (ctx, name, method) {
-  ctx[name] = function () {
-    var old_ssfi = flag(this, 'ssfi');
-    if (old_ssfi && config.includeStack === false)
-      flag(this, 'ssfi', ctx[name]);
-    var result = method.apply(this, arguments);
-    return result === undefined ? this : result;
-  };
-};
-
-});
-
-require.register("chai/lib/chai/utils/addProperty.js", function (exports, module) {
-/*!
- * Chai - addProperty utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * ### addProperty (ctx, name, getter)
- *
- * Adds a property to the prototype of an object.
- *
- *     utils.addProperty(chai.Assertion.prototype, 'foo', function () {
- *       var obj = utils.flag(this, 'object');
- *       new chai.Assertion(obj).to.be.instanceof(Foo);
- *     });
- *
- * Can also be accessed directly from `chai.Assertion`.
- *
- *     chai.Assertion.addProperty('foo', fn);
- *
- * Then can be used as any other assertion.
- *
- *     expect(myFoo).to.be.foo;
- *
- * @param {Object} ctx object to which the property is added
- * @param {String} name of property to add
- * @param {Function} getter function to be used for name
- * @name addProperty
- * @api public
- */
-
-module.exports = function (ctx, name, getter) {
-  Object.defineProperty(ctx, name,
-    { get: function () {
-        var result = getter.call(this);
-        return result === undefined ? this : result;
-      }
-    , configurable: true
-  });
-};
-
-});
-
-require.register("chai/lib/chai/utils/flag.js", function (exports, module) {
-/*!
- * Chai - flag utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * ### flag(object, key, [value])
- *
- * Get or set a flag value on an object. If a
- * value is provided it will be set, else it will
- * return the currently set value or `undefined` if
- * the value is not set.
- *
- *     utils.flag(this, 'foo', 'bar'); // setter
- *     utils.flag(this, 'foo'); // getter, returns `bar`
- *
- * @param {Object} object constructed Assertion
- * @param {String} key
- * @param {Mixed} value (optional)
- * @name flag
- * @api private
- */
-
-module.exports = function (obj, key, value) {
-  var flags = obj.__flags || (obj.__flags = Object.create(null));
-  if (arguments.length === 3) {
-    flags[key] = value;
-  } else {
-    return flags[key];
-  }
-};
-
-});
-
-require.register("chai/lib/chai/utils/getActual.js", function (exports, module) {
-/*!
- * Chai - getActual utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * # getActual(object, [actual])
- *
- * Returns the `actual` value for an Assertion
- *
- * @param {Object} object (constructed Assertion)
- * @param {Arguments} chai.Assertion.prototype.assert arguments
- */
-
-module.exports = function (obj, args) {
-  return args.length > 4 ? args[4] : obj._obj;
-};
-
-});
-
-require.register("chai/lib/chai/utils/getEnumerableProperties.js", function (exports, module) {
-/*!
- * Chai - getEnumerableProperties utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * ### .getEnumerableProperties(object)
- *
- * This allows the retrieval of enumerable property names of an object,
- * inherited or not.
- *
- * @param {Object} object
- * @returns {Array}
- * @name getEnumerableProperties
- * @api public
- */
-
-module.exports = function getEnumerableProperties(object) {
-  var result = [];
-  for (var name in object) {
-    result.push(name);
-  }
-  return result;
-};
-
-});
-
-require.register("chai/lib/chai/utils/getMessage.js", function (exports, module) {
-/*!
- * Chai - message composition utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/*!
- * Module dependancies
- */
-
-var flag = require('chai/lib/chai/utils/flag.js')
-  , getActual = require('chai/lib/chai/utils/getActual.js')
-  , inspect = require('chai/lib/chai/utils/inspect.js')
-  , objDisplay = require('chai/lib/chai/utils/objDisplay.js');
-
-/**
- * ### .getMessage(object, message, negateMessage)
- *
- * Construct the error message based on flags
- * and template tags. Template tags will return
- * a stringified inspection of the object referenced.
- *
- * Message template tags:
- * - `#{this}` current asserted object
- * - `#{act}` actual value
- * - `#{exp}` expected value
- *
- * @param {Object} object (constructed Assertion)
- * @param {Arguments} chai.Assertion.prototype.assert arguments
- * @name getMessage
- * @api public
- */
-
-module.exports = function (obj, args) {
-  var negate = flag(obj, 'negate')
-    , val = flag(obj, 'object')
-    , expected = args[3]
-    , actual = getActual(obj, args)
-    , msg = negate ? args[2] : args[1]
-    , flagMsg = flag(obj, 'message');
-
-  if(typeof msg === "function") msg = msg();
-  msg = msg || '';
-  msg = msg
-    .replace(/#{this}/g, objDisplay(val))
-    .replace(/#{act}/g, objDisplay(actual))
-    .replace(/#{exp}/g, objDisplay(expected));
-
-  return flagMsg ? flagMsg + ': ' + msg : msg;
-};
-
-});
-
-require.register("chai/lib/chai/utils/getName.js", function (exports, module) {
-/*!
- * Chai - getName utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * # getName(func)
- *
- * Gets the name of a function, in a cross-browser way.
- *
- * @param {Function} a function (usually a constructor)
- */
-
-module.exports = function (func) {
-  if (func.name) return func.name;
-
-  var match = /^\s?function ([^(]*)\(/.exec(func);
-  return match && match[1] ? match[1] : "";
-};
-
-});
-
-require.register("chai/lib/chai/utils/getPathValue.js", function (exports, module) {
-/*!
- * Chai - getPathValue utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * @see https://github.com/logicalparadox/filtr
- * MIT Licensed
- */
-
-var getPathInfo = require('chai/lib/chai/utils/getPathInfo.js');
-
-/**
- * ### .getPathValue(path, object)
- *
- * This allows the retrieval of values in an
- * object given a string path.
- *
- *     var obj = {
- *         prop1: {
- *             arr: ['a', 'b', 'c']
- *           , str: 'Hello'
- *         }
- *       , prop2: {
- *             arr: [ { nested: 'Universe' } ]
- *           , str: 'Hello again!'
- *         }
- *     }
- *
- * The following would be the results.
- *
- *     getPathValue('prop1.str', obj); // Hello
- *     getPathValue('prop1.att[2]', obj); // b
- *     getPathValue('prop2.arr[0].nested', obj); // Universe
- *
- * @param {String} path
- * @param {Object} object
- * @returns {Object} value or `undefined`
- * @name getPathValue
- * @api public
- */
-module.exports = function(path, obj) {
-  var info = getPathInfo(path, obj);
-  return info.value;
-}; 
-
-});
-
-require.register("chai/lib/chai/utils/getPathInfo.js", function (exports, module) {
-/*!
- * Chai - getPathInfo utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-var hasProperty = require('chai/lib/chai/utils/hasProperty.js');
-
-/**
- * ### .getPathInfo(path, object)
- *
- * This allows the retrieval of property info in an
- * object given a string path.
- *
- * The path info consists of an object with the
- * following properties:
- *
- * * parent - The parent object of the property referenced by `path`
- * * name - The name of the final property, a number if it was an array indexer
- * * value - The value of the property, if it exists, otherwise `undefined`
- * * exists - Whether the property exists or not
- *
- * @param {String} path
- * @param {Object} object
- * @returns {Object} info
- * @name getPathInfo
- * @api public
- */
-
-module.exports = function getPathInfo(path, obj) {
-  var parsed = parsePath(path),
-      last = parsed[parsed.length - 1];
-
-  var info = {
-    parent: _getPathValue(parsed, obj, parsed.length - 1),
-    name: last.p || last.i,
-    value: _getPathValue(parsed, obj),
-  };
-  info.exists = hasProperty(info.name, info.parent);
-
-  return info;
-};
-
-
-/*!
- * ## parsePath(path)
- *
- * Helper function used to parse string object
- * paths. Use in conjunction with `_getPathValue`.
- *
- *      var parsed = parsePath('myobject.property.subprop');
- *
- * ### Paths:
- *
- * * Can be as near infinitely deep and nested
- * * Arrays are also valid using the formal `myobject.document[3].property`.
- *
- * @param {String} path
- * @returns {Object} parsed
- * @api private
- */
-
-function parsePath (path) {
-  var str = path.replace(/\[/g, '.[')
-    , parts = str.match(/(\\\.|[^.]+?)+/g);
-  return parts.map(function (value) {
-    var re = /\[(\d+)\]$/
-      , mArr = re.exec(value);
-    if (mArr) return { i: parseFloat(mArr[1]) };
-    else return { p: value };
-  });
-}
-
-
-/*!
- * ## _getPathValue(parsed, obj)
- *
- * Helper companion function for `.parsePath` that returns
- * the value located at the parsed address.
- *
- *      var value = getPathValue(parsed, obj);
- *
- * @param {Object} parsed definition from `parsePath`.
- * @param {Object} object to search against
- * @param {Number} object to search against
- * @returns {Object|Undefined} value
- * @api private
- */
-
-function _getPathValue (parsed, obj, index) {
-  var tmp = obj
-    , res;
-
-  index = (index === undefined ? parsed.length : index);
-
-  for (var i = 0, l = index; i < l; i++) {
-    var part = parsed[i];
-    if (tmp) {
-      if ('undefined' !== typeof part.p)
-        tmp = tmp[part.p];
-      else if ('undefined' !== typeof part.i)
-        tmp = tmp[part.i];
-      if (i == (l - 1)) res = tmp;
-    } else {
-      res = undefined;
-    }
-  }
-  return res;
-}
-
-});
-
-require.register("chai/lib/chai/utils/hasProperty.js", function (exports, module) {
-/*!
- * Chai - hasProperty utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-var type = require('chai/lib/chai/utils/type.js');
-
-/**
- * ### .hasProperty(object, name)
- *
- * This allows checking whether an object has
- * named property or numeric array index.
- *
- * Basically does the same thing as the `in`
- * operator but works properly with natives
- * and null/undefined values.
- *
- *     var obj = {
- *         arr: ['a', 'b', 'c']
- *       , str: 'Hello'
- *     }
- *
- * The following would be the results.
- *
- *     hasProperty('str', obj);  // true
- *     hasProperty('constructor', obj);  // true
- *     hasProperty('bar', obj);  // false
- *     
- *     hasProperty('length', obj.str); // true
- *     hasProperty(1, obj.str);  // true
- *     hasProperty(5, obj.str);  // false
- *
- *     hasProperty('length', obj.arr);  // true
- *     hasProperty(2, obj.arr);  // true
- *     hasProperty(3, obj.arr);  // false
- *
- * @param {Objuect} object
- * @param {String|Number} name
- * @returns {Boolean} whether it exists
- * @name getPathInfo
- * @api public
- */
-
-var literals = {
-    'number': Number
-  , 'string': String
-};
-
-module.exports = function hasProperty(name, obj) {
-  var ot = type(obj);
-
-  // Bad Object, obviously no props at all
-  if(ot === 'null' || ot === 'undefined')
-    return false;
-
-  // The `in` operator does not work with certain literals
-  // box these before the check
-  if(literals[ot] && typeof obj !== 'object')
-    obj = new literals[ot](obj);
-
-  return name in obj;
-};
-
-});
-
-require.register("chai/lib/chai/utils/getProperties.js", function (exports, module) {
-/*!
- * Chai - getProperties utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * ### .getProperties(object)
- *
- * This allows the retrieval of property names of an object, enumerable or not,
- * inherited or not.
- *
- * @param {Object} object
- * @returns {Array}
- * @name getProperties
- * @api public
- */
-
-module.exports = function getProperties(object) {
-  var result = Object.getOwnPropertyNames(subject);
-
-  function addProperty(property) {
-    if (result.indexOf(property) === -1) {
-      result.push(property);
-    }
-  }
-
-  var proto = Object.getPrototypeOf(subject);
-  while (proto !== null) {
-    Object.getOwnPropertyNames(proto).forEach(addProperty);
-    proto = Object.getPrototypeOf(proto);
-  }
-
-  return result;
-};
-
-});
-
-require.register("chai/lib/chai/utils/index.js", function (exports, module) {
-/*!
- * chai
- * Copyright(c) 2011 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/*!
- * Main exports
- */
-
-var exports = module.exports = {};
-
-/*!
- * test utility
- */
-
-exports.test = require('chai/lib/chai/utils/test.js');
-
-/*!
- * type utility
- */
-
-exports.type = require('chai/lib/chai/utils/type.js');
-
-/*!
- * message utility
- */
-
-exports.getMessage = require('chai/lib/chai/utils/getMessage.js');
-
-/*!
- * actual utility
- */
-
-exports.getActual = require('chai/lib/chai/utils/getActual.js');
-
-/*!
- * Inspect util
- */
-
-exports.inspect = require('chai/lib/chai/utils/inspect.js');
-
-/*!
- * Object Display util
- */
-
-exports.objDisplay = require('chai/lib/chai/utils/objDisplay.js');
-
-/*!
- * Flag utility
- */
-
-exports.flag = require('chai/lib/chai/utils/flag.js');
-
-/*!
- * Flag transferring utility
- */
-
-exports.transferFlags = require('chai/lib/chai/utils/transferFlags.js');
-
-/*!
- * Deep equal utility
- */
-
-exports.eql = require('chaijs~deep-eql@0.1.3');
-
-/*!
- * Deep path value
- */
-
-exports.getPathValue = require('chai/lib/chai/utils/getPathValue.js');
-
-/*!
- * Deep path info
- */
-
-exports.getPathInfo = require('chai/lib/chai/utils/getPathInfo.js');
-
-/*!
- * Check if a property exists
- */
-
-exports.hasProperty = require('chai/lib/chai/utils/hasProperty.js');
-
-/*!
- * Function name
- */
-
-exports.getName = require('chai/lib/chai/utils/getName.js');
-
-/*!
- * add Property
- */
-
-exports.addProperty = require('chai/lib/chai/utils/addProperty.js');
-
-/*!
- * add Method
- */
-
-exports.addMethod = require('chai/lib/chai/utils/addMethod.js');
-
-/*!
- * overwrite Property
- */
-
-exports.overwriteProperty = require('chai/lib/chai/utils/overwriteProperty.js');
-
-/*!
- * overwrite Method
- */
-
-exports.overwriteMethod = require('chai/lib/chai/utils/overwriteMethod.js');
-
-/*!
- * Add a chainable method
- */
-
-exports.addChainableMethod = require('chai/lib/chai/utils/addChainableMethod.js');
-
-/*!
- * Overwrite chainable method
- */
-
-exports.overwriteChainableMethod = require('chai/lib/chai/utils/overwriteChainableMethod.js');
-
-
-});
-
-require.register("chai/lib/chai/utils/inspect.js", function (exports, module) {
-// This is (almost) directly from Node.js utils
-// https://github.com/joyent/node/blob/f8c335d0caf47f16d31413f89aa28eda3878e3aa/lib/util.js
-
-var getName = require('chai/lib/chai/utils/getName.js');
-var getProperties = require('chai/lib/chai/utils/getProperties.js');
-var getEnumerableProperties = require('chai/lib/chai/utils/getEnumerableProperties.js');
-
-module.exports = inspect;
-
-/**
- * Echos the value of a value. Trys to print the value out
- * in the best way possible given the different types.
- *
- * @param {Object} obj The object to print out.
- * @param {Boolean} showHidden Flag that shows hidden (not enumerable)
- *    properties of objects.
- * @param {Number} depth Depth in which to descend in object. Default is 2.
- * @param {Boolean} colors Flag to turn on ANSI escape codes to color the
- *    output. Default is false (no coloring).
- */
-function inspect(obj, showHidden, depth, colors) {
-  var ctx = {
-    showHidden: showHidden,
-    seen: [],
-    stylize: function (str) { return str; }
-  };
-  return formatValue(ctx, obj, (typeof depth === 'undefined' ? 2 : depth));
-}
-
-// Returns true if object is a DOM element.
-var isDOMElement = function (object) {
-  if (typeof HTMLElement === 'object') {
-    return object instanceof HTMLElement;
-  } else {
-    return object &&
-      typeof object === 'object' &&
-      object.nodeType === 1 &&
-      typeof object.nodeName === 'string';
-  }
-};
-
-function formatValue(ctx, value, recurseTimes) {
-  // Provide a hook for user-specified inspect functions.
-  // Check that value is an object with an inspect function on it
-  if (value && typeof value.inspect === 'function' &&
-      // Filter out the util module, it's inspect function is special
-      value.inspect !== exports.inspect &&
-      // Also filter out any prototype objects using the circular check.
-      !(value.constructor && value.constructor.prototype === value)) {
-    var ret = value.inspect(recurseTimes);
-    if (typeof ret !== 'string') {
-      ret = formatValue(ctx, ret, recurseTimes);
-    }
-    return ret;
-  }
-
-  // Primitive types cannot have properties
-  var primitive = formatPrimitive(ctx, value);
-  if (primitive) {
-    return primitive;
-  }
-
-  // If this is a DOM element, try to get the outer HTML.
-  if (isDOMElement(value)) {
-    if ('outerHTML' in value) {
-      return value.outerHTML;
-      // This value does not have an outerHTML attribute,
-      //   it could still be an XML element
-    } else {
-      // Attempt to serialize it
-      try {
-        if (document.xmlVersion) {
-          var xmlSerializer = new XMLSerializer();
-          return xmlSerializer.serializeToString(value);
-        } else {
-          // Firefox 11- do not support outerHTML
-          //   It does, however, support innerHTML
-          //   Use the following to render the element
-          var ns = "http://www.w3.org/1999/xhtml";
-          var container = document.createElementNS(ns, '_');
-
-          container.appendChild(value.cloneNode(false));
-          html = container.innerHTML
-            .replace('><', '>' + value.innerHTML + '<');
-          container.innerHTML = '';
-          return html;
-        }
-      } catch (err) {
-        // This could be a non-native DOM implementation,
-        //   continue with the normal flow:
-        //   printing the element as if it is an object.
-      }
-    }
-  }
-
-  // Look up the keys of the object.
-  var visibleKeys = getEnumerableProperties(value);
-  var keys = ctx.showHidden ? getProperties(value) : visibleKeys;
-
-  // Some type of object without properties can be shortcutted.
-  // In IE, errors have a single `stack` property, or if they are vanilla `Error`,
-  // a `stack` plus `description` property; ignore those for consistency.
-  if (keys.length === 0 || (isError(value) && (
-      (keys.length === 1 && keys[0] === 'stack') ||
-      (keys.length === 2 && keys[0] === 'description' && keys[1] === 'stack')
-     ))) {
-    if (typeof value === 'function') {
-      var name = getName(value);
-      var nameSuffix = name ? ': ' + name : '';
-      return ctx.stylize('[Function' + nameSuffix + ']', 'special');
-    }
-    if (isRegExp(value)) {
-      return ctx.stylize(RegExp.prototype.toString.call(value), 'regexp');
-    }
-    if (isDate(value)) {
-      return ctx.stylize(Date.prototype.toUTCString.call(value), 'date');
-    }
-    if (isError(value)) {
-      return formatError(value);
-    }
-  }
-
-  var base = '', array = false, braces = ['{', '}'];
-
-  // Make Array say that they are Array
-  if (isArray(value)) {
-    array = true;
-    braces = ['[', ']'];
-  }
-
-  // Make functions say that they are functions
-  if (typeof value === 'function') {
-    var name = getName(value);
-    var nameSuffix = name ? ': ' + name : '';
-    base = ' [Function' + nameSuffix + ']';
-  }
-
-  // Make RegExps say that they are RegExps
-  if (isRegExp(value)) {
-    base = ' ' + RegExp.prototype.toString.call(value);
-  }
-
-  // Make dates with properties first say the date
-  if (isDate(value)) {
-    base = ' ' + Date.prototype.toUTCString.call(value);
-  }
-
-  // Make error with message first say the error
-  if (isError(value)) {
-    return formatError(value);
-  }
-
-  if (keys.length === 0 && (!array || value.length == 0)) {
-    return braces[0] + base + braces[1];
-  }
-
-  if (recurseTimes < 0) {
-    if (isRegExp(value)) {
-      return ctx.stylize(RegExp.prototype.toString.call(value), 'regexp');
-    } else {
-      return ctx.stylize('[Object]', 'special');
-    }
-  }
-
-  ctx.seen.push(value);
-
-  var output;
-  if (array) {
-    output = formatArray(ctx, value, recurseTimes, visibleKeys, keys);
-  } else {
-    output = keys.map(function(key) {
-      return formatProperty(ctx, value, recurseTimes, visibleKeys, key, array);
-    });
-  }
-
-  ctx.seen.pop();
-
-  return reduceToSingleString(output, base, braces);
-}
-
-
-function formatPrimitive(ctx, value) {
-  switch (typeof value) {
-    case 'undefined':
-      return ctx.stylize('undefined', 'undefined');
-
-    case 'string':
-      var simple = '\'' + JSON.stringify(value).replace(/^"|"$/g, '')
-                                               .replace(/'/g, "\\'")
-                                               .replace(/\\"/g, '"') + '\'';
-      return ctx.stylize(simple, 'string');
-
-    case 'number':
-      if (value === 0 && (1/value) === -Infinity) {
-        return ctx.stylize('-0', 'number');
-      }
-      return ctx.stylize('' + value, 'number');
-
-    case 'boolean':
-      return ctx.stylize('' + value, 'boolean');
-  }
-  // For some reason typeof null is "object", so special case here.
-  if (value === null) {
-    return ctx.stylize('null', 'null');
-  }
-}
-
-
-function formatError(value) {
-  return '[' + Error.prototype.toString.call(value) + ']';
-}
-
-
-function formatArray(ctx, value, recurseTimes, visibleKeys, keys) {
-  var output = [];
-  for (var i = 0, l = value.length; i < l; ++i) {
-    if (Object.prototype.hasOwnProperty.call(value, String(i))) {
-      output.push(formatProperty(ctx, value, recurseTimes, visibleKeys,
-          String(i), true));
-    } else {
-      output.push('');
-    }
-  }
-  keys.forEach(function(key) {
-    if (!key.match(/^\d+$/)) {
-      output.push(formatProperty(ctx, value, recurseTimes, visibleKeys,
-          key, true));
-    }
-  });
-  return output;
-}
-
-
-function formatProperty(ctx, value, recurseTimes, visibleKeys, key, array) {
-  var name, str;
-  if (value.__lookupGetter__) {
-    if (value.__lookupGetter__(key)) {
-      if (value.__lookupSetter__(key)) {
-        str = ctx.stylize('[Getter/Setter]', 'special');
-      } else {
-        str = ctx.stylize('[Getter]', 'special');
-      }
-    } else {
-      if (value.__lookupSetter__(key)) {
-        str = ctx.stylize('[Setter]', 'special');
-      }
-    }
-  }
-  if (visibleKeys.indexOf(key) < 0) {
-    name = '[' + key + ']';
-  }
-  if (!str) {
-    if (ctx.seen.indexOf(value[key]) < 0) {
-      if (recurseTimes === null) {
-        str = formatValue(ctx, value[key], null);
-      } else {
-        str = formatValue(ctx, value[key], recurseTimes - 1);
-      }
-      if (str.indexOf('\n') > -1) {
-        if (array) {
-          str = str.split('\n').map(function(line) {
-            return '  ' + line;
-          }).join('\n').substr(2);
-        } else {
-          str = '\n' + str.split('\n').map(function(line) {
-            return '   ' + line;
-          }).join('\n');
-        }
-      }
-    } else {
-      str = ctx.stylize('[Circular]', 'special');
-    }
-  }
-  if (typeof name === 'undefined') {
-    if (array && key.match(/^\d+$/)) {
-      return str;
-    }
-    name = JSON.stringify('' + key);
-    if (name.match(/^"([a-zA-Z_][a-zA-Z_0-9]*)"$/)) {
-      name = name.substr(1, name.length - 2);
-      name = ctx.stylize(name, 'name');
-    } else {
-      name = name.replace(/'/g, "\\'")
-                 .replace(/\\"/g, '"')
-                 .replace(/(^"|"$)/g, "'");
-      name = ctx.stylize(name, 'string');
-    }
-  }
-
-  return name + ': ' + str;
-}
-
-
-function reduceToSingleString(output, base, braces) {
-  var numLinesEst = 0;
-  var length = output.reduce(function(prev, cur) {
-    numLinesEst++;
-    if (cur.indexOf('\n') >= 0) numLinesEst++;
-    return prev + cur.length + 1;
-  }, 0);
-
-  if (length > 60) {
-    return braces[0] +
-           (base === '' ? '' : base + '\n ') +
-           ' ' +
-           output.join(',\n  ') +
-           ' ' +
-           braces[1];
-  }
-
-  return braces[0] + base + ' ' + output.join(', ') + ' ' + braces[1];
-}
-
-function isArray(ar) {
-  return Array.isArray(ar) ||
-         (typeof ar === 'object' && objectToString(ar) === '[object Array]');
-}
-
-function isRegExp(re) {
-  return typeof re === 'object' && objectToString(re) === '[object RegExp]';
-}
-
-function isDate(d) {
-  return typeof d === 'object' && objectToString(d) === '[object Date]';
-}
-
-function isError(e) {
-  return typeof e === 'object' && objectToString(e) === '[object Error]';
-}
-
-function objectToString(o) {
-  return Object.prototype.toString.call(o);
-}
-
-});
-
-require.register("chai/lib/chai/utils/objDisplay.js", function (exports, module) {
-/*!
- * Chai - flag utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/*!
- * Module dependancies
- */
-
-var inspect = require('chai/lib/chai/utils/inspect.js');
-var config = require('chai/lib/chai/config.js');
-
-/**
- * ### .objDisplay (object)
- *
- * Determines if an object or an array matches
- * criteria to be inspected in-line for error
- * messages or should be truncated.
- *
- * @param {Mixed} javascript object to inspect
- * @name objDisplay
- * @api public
- */
-
-module.exports = function (obj) {
-  var str = inspect(obj)
-    , type = Object.prototype.toString.call(obj);
-
-  if (config.truncateThreshold && str.length >= config.truncateThreshold) {
-    if (type === '[object Function]') {
-      return !obj.name || obj.name === ''
-        ? '[Function]'
-        : '[Function: ' + obj.name + ']';
-    } else if (type === '[object Array]') {
-      return '[ Array(' + obj.length + ') ]';
-    } else if (type === '[object Object]') {
-      var keys = Object.keys(obj)
-        , kstr = keys.length > 2
-          ? keys.splice(0, 2).join(', ') + ', ...'
-          : keys.join(', ');
-      return '{ Object (' + kstr + ') }';
-    } else {
-      return str;
-    }
-  } else {
-    return str;
-  }
-};
-
-});
-
-require.register("chai/lib/chai/utils/overwriteMethod.js", function (exports, module) {
-/*!
- * Chai - overwriteMethod utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * ### overwriteMethod (ctx, name, fn)
- *
- * Overwites an already existing method and provides
- * access to previous function. Must return function
- * to be used for name.
- *
- *     utils.overwriteMethod(chai.Assertion.prototype, 'equal', function (_super) {
- *       return function (str) {
- *         var obj = utils.flag(this, 'object');
- *         if (obj instanceof Foo) {
- *           new chai.Assertion(obj.value).to.equal(str);
- *         } else {
- *           _super.apply(this, arguments);
- *         }
- *       }
- *     });
- *
- * Can also be accessed directly from `chai.Assertion`.
- *
- *     chai.Assertion.overwriteMethod('foo', fn);
- *
- * Then can be used as any other assertion.
- *
- *     expect(myFoo).to.equal('bar');
- *
- * @param {Object} ctx object whose method is to be overwritten
- * @param {String} name of method to overwrite
- * @param {Function} method function that returns a function to be used for name
- * @name overwriteMethod
- * @api public
- */
-
-module.exports = function (ctx, name, method) {
-  var _method = ctx[name]
-    , _super = function () { return this; };
-
-  if (_method && 'function' === typeof _method)
-    _super = _method;
-
-  ctx[name] = function () {
-    var result = method(_super).apply(this, arguments);
-    return result === undefined ? this : result;
-  }
-};
-
-});
-
-require.register("chai/lib/chai/utils/overwriteProperty.js", function (exports, module) {
-/*!
- * Chai - overwriteProperty utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * ### overwriteProperty (ctx, name, fn)
- *
- * Overwites an already existing property getter and provides
- * access to previous value. Must return function to use as getter.
- *
- *     utils.overwriteProperty(chai.Assertion.prototype, 'ok', function (_super) {
- *       return function () {
- *         var obj = utils.flag(this, 'object');
- *         if (obj instanceof Foo) {
- *           new chai.Assertion(obj.name).to.equal('bar');
- *         } else {
- *           _super.call(this);
- *         }
- *       }
- *     });
- *
- *
- * Can also be accessed directly from `chai.Assertion`.
- *
- *     chai.Assertion.overwriteProperty('foo', fn);
- *
- * Then can be used as any other assertion.
- *
- *     expect(myFoo).to.be.ok;
- *
- * @param {Object} ctx object whose property is to be overwritten
- * @param {String} name of property to overwrite
- * @param {Function} getter function that returns a getter function to be used for name
- * @name overwriteProperty
- * @api public
- */
-
-module.exports = function (ctx, name, getter) {
-  var _get = Object.getOwnPropertyDescriptor(ctx, name)
-    , _super = function () {};
-
-  if (_get && 'function' === typeof _get.get)
-    _super = _get.get
-
-  Object.defineProperty(ctx, name,
-    { get: function () {
-        var result = getter(_super).call(this);
-        return result === undefined ? this : result;
-      }
-    , configurable: true
-  });
-};
-
-});
-
-require.register("chai/lib/chai/utils/overwriteChainableMethod.js", function (exports, module) {
-/*!
- * Chai - overwriteChainableMethod utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * ### overwriteChainableMethod (ctx, name, method, chainingBehavior)
- *
- * Overwites an already existing chainable method
- * and provides access to the previous function or
- * property.  Must return functions to be used for
- * name.
- *
- *     utils.overwriteChainableMethod(chai.Assertion.prototype, 'length',
- *       function (_super) {
- *       }
- *     , function (_super) {
- *       }
- *     );
- *
- * Can also be accessed directly from `chai.Assertion`.
- *
- *     chai.Assertion.overwriteChainableMethod('foo', fn, fn);
- *
- * Then can be used as any other assertion.
- *
- *     expect(myFoo).to.have.length(3);
- *     expect(myFoo).to.have.length.above(3);
- *
- * @param {Object} ctx object whose method / property is to be overwritten
- * @param {String} name of method / property to overwrite
- * @param {Function} method function that returns a function to be used for name
- * @param {Function} chainingBehavior function that returns a function to be used for property
- * @name overwriteChainableMethod
- * @api public
- */
-
-module.exports = function (ctx, name, method, chainingBehavior) {
-  var chainableBehavior = ctx.__methods[name];
-
-  var _chainingBehavior = chainableBehavior.chainingBehavior;
-  chainableBehavior.chainingBehavior = function () {
-    var result = chainingBehavior(_chainingBehavior).call(this);
-    return result === undefined ? this : result;
-  };
-
-  var _method = chainableBehavior.method;
-  chainableBehavior.method = function () {
-    var result = method(_method).apply(this, arguments);
-    return result === undefined ? this : result;
-  };
-};
-
-});
-
-require.register("chai/lib/chai/utils/test.js", function (exports, module) {
-/*!
- * Chai - test utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/*!
- * Module dependancies
- */
-
-var flag = require('chai/lib/chai/utils/flag.js');
-
-/**
- * # test(object, expression)
- *
- * Test and object for expression.
- *
- * @param {Object} object (constructed Assertion)
- * @param {Arguments} chai.Assertion.prototype.assert arguments
- */
-
-module.exports = function (obj, args) {
-  var negate = flag(obj, 'negate')
-    , expr = args[0];
-  return negate ? !expr : expr;
-};
-
-});
-
-require.register("chai/lib/chai/utils/transferFlags.js", function (exports, module) {
-/*!
- * Chai - transferFlags utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/**
- * ### transferFlags(assertion, object, includeAll = true)
- *
- * Transfer all the flags for `assertion` to `object`. If
- * `includeAll` is set to `false`, then the base Chai
- * assertion flags (namely `object`, `ssfi`, and `message`)
- * will not be transferred.
- *
- *
- *     var newAssertion = new Assertion();
- *     utils.transferFlags(assertion, newAssertion);
- *
- *     var anotherAsseriton = new Assertion(myObj);
- *     utils.transferFlags(assertion, anotherAssertion, false);
- *
- * @param {Assertion} assertion the assertion to transfer the flags from
- * @param {Object} object the object to transfer the flags to; usually a new assertion
- * @param {Boolean} includeAll
- * @name transferFlags
- * @api private
- */
-
-module.exports = function (assertion, object, includeAll) {
-  var flags = assertion.__flags || (assertion.__flags = Object.create(null));
-
-  if (!object.__flags) {
-    object.__flags = Object.create(null);
-  }
-
-  includeAll = arguments.length === 3 ? includeAll : true;
-
-  for (var flag in flags) {
-    if (includeAll ||
-        (flag !== 'object' && flag !== 'ssfi' && flag != 'message')) {
-      object.__flags[flag] = flags[flag];
-    }
-  }
-};
-
-});
-
-require.register("chai/lib/chai/utils/type.js", function (exports, module) {
-/*!
- * Chai - type utility
- * Copyright(c) 2012-2014 Jake Luer <jake@alogicalparadox.com>
- * MIT Licensed
- */
-
-/*!
- * Detectable javascript natives
- */
-
-var natives = {
-    '[object Arguments]': 'arguments'
-  , '[object Array]': 'array'
-  , '[object Date]': 'date'
-  , '[object Function]': 'function'
-  , '[object Number]': 'number'
-  , '[object RegExp]': 'regexp'
-  , '[object String]': 'string'
-};
-
-/**
- * ### type(object)
- *
- * Better implementation of `typeof` detection that can
- * be used cross-browser. Handles the inconsistencies of
- * Array, `null`, and `undefined` detection.
- *
- *     utils.type({}) // 'object'
- *     utils.type(null) // `null'
- *     utils.type(undefined) // `undefined`
- *     utils.type([]) // `array`
- *
- * @param {Mixed} object to detect type of
- * @name type
- * @api private
- */
-
-module.exports = function (obj) {
-  var str = Object.prototype.toString.call(obj);
-  if (natives[str]) return natives[str];
-  if (obj === null) return 'null';
-  if (obj === undefined) return 'undefined';
-  if (obj === Object(obj)) return 'object';
-  return typeof obj;
-};
-
-});
-
-if (typeof exports == "object") {
-  module.exports = require("chai");
-} else if (typeof define == "function" && define.amd) {
-  define("chai", [], function(){ return require("chai"); });
-} else {
-  (this || window)["chai"] = require("chai");
-}
-})()
diff --git a/test/lib/mocha.css b/test/lib/mocha.css
deleted file mode 100644
index 3b82ae9..0000000
--- a/test/lib/mocha.css
+++ /dev/null
@@ -1,305 +0,0 @@
-@charset "utf-8";
-
-body {
-  margin:0;
-}
-
-#mocha {
-  font: 20px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
-  margin: 60px 50px;
-}
-
-#mocha ul,
-#mocha li {
-  margin: 0;
-  padding: 0;
-}
-
-#mocha ul {
-  list-style: none;
-}
-
-#mocha h1,
-#mocha h2 {
-  margin: 0;
-}
-
-#mocha h1 {
-  margin-top: 15px;
-  font-size: 1em;
-  font-weight: 200;
-}
-
-#mocha h1 a {
-  text-decoration: none;
-  color: inherit;
-}
-
-#mocha h1 a:hover {
-  text-decoration: underline;
-}
-
-#mocha .suite .suite h1 {
-  margin-top: 0;
-  font-size: .8em;
-}
-
-#mocha .hidden {
-  display: none;
-}
-
-#mocha h2 {
-  font-size: 12px;
-  font-weight: normal;
-  cursor: pointer;
-}
-
-#mocha .suite {
-  margin-left: 15px;
-}
-
-#mocha .test {
-  margin-left: 15px;
-  overflow: hidden;
-}
-
-#mocha .test.pending:hover h2::after {
-  content: '(pending)';
-  font-family: arial, sans-serif;
-}
-
-#mocha .test.pass.medium .duration {
-  background: #c09853;
-}
-
-#mocha .test.pass.slow .duration {
-  background: #b94a48;
-}
-
-#mocha .test.pass::before {
-  content: '✓';
-  font-size: 12px;
-  display: block;
-  float: left;
-  margin-right: 5px;
-  color: #00d6b2;
-}
-
-#mocha .test.pass .duration {
-  font-size: 9px;
-  margin-left: 5px;
-  padding: 2px 5px;
-  color: #fff;
-  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
-  -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
-  box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
-  -webkit-border-radius: 5px;
-  -moz-border-radius: 5px;
-  -ms-border-radius: 5px;
-  -o-border-radius: 5px;
-  border-radius: 5px;
-}
-
-#mocha .test.pass.fast .duration {
-  display: none;
-}
-
-#mocha .test.pending {
-  color: #0b97c4;
-}
-
-#mocha .test.pending::before {
-  content: '◦';
-  color: #0b97c4;
-}
-
-#mocha .test.fail {
-  color: #c00;
-}
-
-#mocha .test.fail pre {
-  color: black;
-}
-
-#mocha .test.fail::before {
-  content: '✖';
-  font-size: 12px;
-  display: block;
-  float: left;
-  margin-right: 5px;
-  color: #c00;
-}
-
-#mocha .test pre.error {
-  color: #c00;
-  max-height: 300px;
-  overflow: auto;
-}
-
-#mocha .test .html-error {
-  overflow: auto;
-  color: black;
-  line-height: 1.5;
-  display: block;
-  float: left;
-  clear: left;
-  font: 12px/1.5 monaco, monospace;
-  margin: 5px;
-  padding: 15px;
-  border: 1px solid #eee;
-  max-width: 85%; /*(1)*/
-  max-width: calc(100% - 42px); /*(2)*/
-  max-height: 300px;
-  word-wrap: break-word;
-  border-bottom-color: #ddd;
-  -webkit-border-radius: 3px;
-  -webkit-box-shadow: 0 1px 3px #eee;
-  -moz-border-radius: 3px;
-  -moz-box-shadow: 0 1px 3px #eee;
-  border-radius: 3px;
-}
-
-#mocha .test .html-error pre.error {
-  border: none;
-  -webkit-border-radius: none;
-  -webkit-box-shadow: none;
-  -moz-border-radius: none;
-  -moz-box-shadow: none;
-  padding: 0;
-  margin: 0;
-  margin-top: 18px;
-  max-height: none;
-}
-
-/**
- * (1): approximate for browsers not supporting calc
- * (2): 42 = 2*15 + 2*10 + 2*1 (padding + margin + border)
- *      ^^ seriously
- */
-#mocha .test pre {
-  display: block;
-  float: left;
-  clear: left;
-  font: 12px/1.5 monaco, monospace;
-  margin: 5px;
-  padding: 15px;
-  border: 1px solid #eee;
-  max-width: 85%; /*(1)*/
-  max-width: calc(100% - 42px); /*(2)*/
-  word-wrap: break-word;
-  border-bottom-color: #ddd;
-  -webkit-border-radius: 3px;
-  -webkit-box-shadow: 0 1px 3px #eee;
-  -moz-border-radius: 3px;
-  -moz-box-shadow: 0 1px 3px #eee;
-  border-radius: 3px;
-}
-
-#mocha .test h2 {
-  position: relative;
-}
-
-#mocha .test a.replay {
-  position: absolute;
-  top: 3px;
-  right: 0;
-  text-decoration: none;
-  vertical-align: middle;
-  display: block;
-  width: 15px;
-  height: 15px;
-  line-height: 15px;
-  text-align: center;
-  background: #eee;
-  font-size: 15px;
-  -moz-border-radius: 15px;
-  border-radius: 15px;
-  -webkit-transition: opacity 200ms;
-  -moz-transition: opacity 200ms;
-  transition: opacity 200ms;
-  opacity: 0.3;
-  color: #888;
-}
-
-#mocha .test:hover a.replay {
-  opacity: 1;
-}
-
-#mocha-report.pass .test.fail {
-  display: none;
-}
-
-#mocha-report.fail .test.pass {
-  display: none;
-}
-
-#mocha-report.pending .test.pass,
-#mocha-report.pending .test.fail {
-  display: none;
-}
-#mocha-report.pending .test.pass.pending {
-  display: block;
-}
-
-#mocha-error {
-  color: #c00;
-  font-size: 1.5em;
-  font-weight: 100;
-  letter-spacing: 1px;
-}
-
-#mocha-stats {
-  position: fixed;
-  top: 15px;
-  right: 10px;
-  font-size: 12px;
-  margin: 0;
-  color: #888;
-  z-index: 1;
-}
-
-#mocha-stats .progress {
-  float: right;
-  padding-top: 0;
-}
-
-#mocha-stats em {
-  color: black;
-}
-
-#mocha-stats a {
-  text-decoration: none;
-  color: inherit;
-}
-
-#mocha-stats a:hover {
-  border-bottom: 1px solid #eee;
-}
-
-#mocha-stats li {
-  display: inline-block;
-  margin: 0 5px;
-  list-style: none;
-  padding-top: 11px;
-}
-
-#mocha-stats canvas {
-  width: 40px;
-  height: 40px;
-}
-
-#mocha code .comment { color: #ddd; }
-#mocha code .init { color: #2f6fad; }
-#mocha code .string { color: #5890ad; }
-#mocha code .keyword { color: #8a6343; }
-#mocha code .number { color: #2f6fad; }
-
-@media screen and (max-device-width: 480px) {
-  #mocha {
-    margin: 60px 0px;
-  }
-
-  #mocha #stats {
-    position: absolute;
-  }
-}
diff --git a/test/lib/mocha.js b/test/lib/mocha.js
deleted file mode 100644
index 5ff1385..0000000
--- a/test/lib/mocha.js
+++ /dev/null
@@ -1,6564 +0,0 @@
-;(function(){
-
-// CommonJS require()
-
-function require(p){
-    var path = require.resolve(p)
-      , mod = require.modules[path];
-    if (!mod) throw new Error('failed to require "' + p + '"');
-    if (!mod.exports) {
-      mod.exports = {};
-      mod.call(mod.exports, mod, mod.exports, require.relative(path));
-    }
-    return mod.exports;
-  }
-
-require.modules = {};
-
-require.resolve = function (path){
-    var orig = path
-      , reg = path + '.js'
-      , index = path + '/index.js';
-    return require.modules[reg] && reg
-      || require.modules[index] && index
-      || orig;
-  };
-
-require.register = function (path, fn){
-    require.modules[path] = fn;
-  };
-
-require.relative = function (parent) {
-    return function(p){
-      if ('.' != p.charAt(0)) return require(p);
-
-      var path = parent.split('/')
-        , segs = p.split('/');
-      path.pop();
-
-      for (var i = 0; i < segs.length; i++) {
-        var seg = segs[i];
-        if ('..' == seg) path.pop();
-        else if ('.' != seg) path.push(seg);
-      }
-
-      return require(path.join('/'));
-    };
-  };
-
-
-require.register("browser/debug.js", function(module, exports, require){
-module.exports = function(type){
-  return function(){
-  }
-};
-
-}); // module: browser/debug.js
-
-require.register("browser/diff.js", function(module, exports, require){
-/* See LICENSE file for terms of use */
-
-/*
- * Text diff implementation.
- *
- * This library supports the following APIS:
- * JsDiff.diffChars: Character by character diff
- * JsDiff.diffWords: Word (as defined by \b regex) diff which ignores whitespace
- * JsDiff.diffLines: Line based diff
- *
- * JsDiff.diffCss: Diff targeted at CSS content
- *
- * These methods are based on the implementation proposed in
- * "An O(ND) Difference Algorithm and its Variations" (Myers, 1986).
- * http://citeseerx.ist.psu.edu/viewdoc/summary?doi=10.1.1.4.6927
- */
-var JsDiff = (function() {
-  /*jshint maxparams: 5*/
-  function clonePath(path) {
-    return { newPos: path.newPos, components: path.components.slice(0) };
-  }
-  function removeEmpty(array) {
-    var ret = [];
-    for (var i = 0; i < array.length; i++) {
-      if (array[i]) {
-        ret.push(array[i]);
-      }
-    }
-    return ret;
-  }
-  function escapeHTML(s) {
-    var n = s;
-    n = n.replace(/&/g, '&amp;');
-    n = n.replace(/</g, '&lt;');
-    n = n.replace(/>/g, '&gt;');
-    n = n.replace(/"/g, '&quot;');
-
-    return n;
-  }
-
-  var Diff = function(ignoreWhitespace) {
-    this.ignoreWhitespace = ignoreWhitespace;
-  };
-  Diff.prototype = {
-      diff: function(oldString, newString) {
-        // Handle the identity case (this is due to unrolling editLength == 0
-        if (newString === oldString) {
-          return [{ value: newString }];
-        }
-        if (!newString) {
-          return [{ value: oldString, removed: true }];
-        }
-        if (!oldString) {
-          return [{ value: newString, added: true }];
-        }
-
-        newString = this.tokenize(newString);
-        oldString = this.tokenize(oldString);
-
-        var newLen = newString.length, oldLen = oldString.length;
-        var maxEditLength = newLen + oldLen;
-        var bestPath = [{ newPos: -1, components: [] }];
-
-        // Seed editLength = 0
-        var oldPos = this.extractCommon(bestPath[0], newString, oldString, 0);
-        if (bestPath[0].newPos+1 >= newLen && oldPos+1 >= oldLen) {
-          return bestPath[0].components;
-        }
-
-        for (var editLength = 1; editLength <= maxEditLength; editLength++) {
-          for (var diagonalPath = -1*editLength; diagonalPath <= editLength; diagonalPath+=2) {
-            var basePath;
-            var addPath = bestPath[diagonalPath-1],
-                removePath = bestPath[diagonalPath+1];
-            oldPos = (removePath ? removePath.newPos : 0) - diagonalPath;
-            if (addPath) {
-              // No one else is going to attempt to use this value, clear it
-              bestPath[diagonalPath-1] = undefined;
-            }
-
-            var canAdd = addPath && addPath.newPos+1 < newLen;
-            var canRemove = removePath && 0 <= oldPos && oldPos < oldLen;
-            if (!canAdd && !canRemove) {
-              bestPath[diagonalPath] = undefined;
-              continue;
-            }
-
-            // Select the diagonal that we want to branch from. We select the prior
-            // path whose position in the new string is the farthest from the origin
-            // and does not pass the bounds of the diff graph
-            if (!canAdd || (canRemove && addPath.newPos < removePath.newPos)) {
-              basePath = clonePath(removePath);
-              this.pushComponent(basePath.components, oldString[oldPos], undefined, true);
-            } else {
-              basePath = clonePath(addPath);
-              basePath.newPos++;
-              this.pushComponent(basePath.components, newString[basePath.newPos], true, undefined);
-            }
-
-            var oldPos = this.extractCommon(basePath, newString, oldString, diagonalPath);
-
-            if (basePath.newPos+1 >= newLen && oldPos+1 >= oldLen) {
-              return basePath.components;
-            } else {
-              bestPath[diagonalPath] = basePath;
-            }
-          }
-        }
-      },
-
-      pushComponent: function(components, value, added, removed) {
-        var last = components[components.length-1];
-        if (last && last.added === added && last.removed === removed) {
-          // We need to clone here as the component clone operation is just
-          // as shallow array clone
-          components[components.length-1] =
-            {value: this.join(last.value, value), added: added, removed: removed };
-        } else {
-          components.push({value: value, added: added, removed: removed });
-        }
-      },
-      extractCommon: function(basePath, newString, oldString, diagonalPath) {
-        var newLen = newString.length,
-            oldLen = oldString.length,
-            newPos = basePath.newPos,
-            oldPos = newPos - diagonalPath;
-        while (newPos+1 < newLen && oldPos+1 < oldLen && this.equals(newString[newPos+1], oldString[oldPos+1])) {
-          newPos++;
-          oldPos++;
-
-          this.pushComponent(basePath.components, newString[newPos], undefined, undefined);
-        }
-        basePath.newPos = newPos;
-        return oldPos;
-      },
-
-      equals: function(left, right) {
-        var reWhitespace = /\S/;
-        if (this.ignoreWhitespace && !reWhitespace.test(left) && !reWhitespace.test(right)) {
-          return true;
-        } else {
-          return left === right;
-        }
-      },
-      join: function(left, right) {
-        return left + right;
-      },
-      tokenize: function(value) {
-        return value;
-      }
-  };
-
-  var CharDiff = new Diff();
-
-  var WordDiff = new Diff(true);
-  var WordWithSpaceDiff = new Diff();
-  WordDiff.tokenize = WordWithSpaceDiff.tokenize = function(value) {
-    return removeEmpty(value.split(/(\s+|\b)/));
-  };
-
-  var CssDiff = new Diff(true);
-  CssDiff.tokenize = function(value) {
-    return removeEmpty(value.split(/([{}:;,]|\s+)/));
-  };
-
-  var LineDiff = new Diff();
-  LineDiff.tokenize = function(value) {
-    var retLines = [],
-        lines = value.split(/^/m);
-
-    for(var i = 0; i < lines.length; i++) {
-      var line = lines[i],
-          lastLine = lines[i - 1];
-
-      // Merge lines that may contain windows new lines
-      if (line == '\n' && lastLine && lastLine[lastLine.length - 1] === '\r') {
-        retLines[retLines.length - 1] += '\n';
-      } else if (line) {
-        retLines.push(line);
-      }
-    }
-
-    return retLines;
-  };
-
-  return {
-    Diff: Diff,
-
-    diffChars: function(oldStr, newStr) { return CharDiff.diff(oldStr, newStr); },
-    diffWords: function(oldStr, newStr) { return WordDiff.diff(oldStr, newStr); },
-    diffWordsWithSpace: function(oldStr, newStr) { return WordWithSpaceDiff.diff(oldStr, newStr); },
-    diffLines: function(oldStr, newStr) { return LineDiff.diff(oldStr, newStr); },
-
-    diffCss: function(oldStr, newStr) { return CssDiff.diff(oldStr, newStr); },
-
-    createPatch: function(fileName, oldStr, newStr, oldHeader, newHeader) {
-      var ret = [];
-
-      ret.push('Index: ' + fileName);
-      ret.push('===================================================================');
-      ret.push('--- ' + fileName + (typeof oldHeader === 'undefined' ? '' : '\t' + oldHeader));
-      ret.push('+++ ' + fileName + (typeof newHeader === 'undefined' ? '' : '\t' + newHeader));
-
-      var diff = LineDiff.diff(oldStr, newStr);
-      if (!diff[diff.length-1].value) {
-        diff.pop();   // Remove trailing newline add
-      }
-      diff.push({value: '', lines: []});   // Append an empty value to make cleanup easier
-
-      function contextLines(lines) {
-        return lines.map(function(entry) { return ' ' + entry; });
-      }
-      function eofNL(curRange, i, current) {
-        var last = diff[diff.length-2],
-            isLast = i === diff.length-2,
-            isLastOfType = i === diff.length-3 && (current.added !== last.added || current.removed !== last.removed);
-
-        // Figure out if this is the last line for the given file and missing NL
-        if (!/\n$/.test(current.value) && (isLast || isLastOfType)) {
-          curRange.push('\\ No newline at end of file');
-        }
-      }
-
-      var oldRangeStart = 0, newRangeStart = 0, curRange = [],
-          oldLine = 1, newLine = 1;
-      for (var i = 0; i < diff.length; i++) {
-        var current = diff[i],
-            lines = current.lines || current.value.replace(/\n$/, '').split('\n');
-        current.lines = lines;
-
-        if (current.added || current.removed) {
-          if (!oldRangeStart) {
-            var prev = diff[i-1];
-            oldRangeStart = oldLine;
-            newRangeStart = newLine;
-
-            if (prev) {
-              curRange = contextLines(prev.lines.slice(-4));
-              oldRangeStart -= curRange.length;
-              newRangeStart -= curRange.length;
-            }
-          }
-          curRange.push.apply(curRange, lines.map(function(entry) { return (current.added?'+':'-') + entry; }));
-          eofNL(curRange, i, current);
-
-          if (current.added) {
-            newLine += lines.length;
-          } else {
-            oldLine += lines.length;
-          }
-        } else {
-          if (oldRangeStart) {
-            // Close out any changes that have been output (or join overlapping)
-            if (lines.length <= 8 && i < diff.length-2) {
-              // Overlapping
-              curRange.push.apply(curRange, contextLines(lines));
-            } else {
-              // end the range and output
-              var contextSize = Math.min(lines.length, 4);
-              ret.push(
-                  '@@ -' + oldRangeStart + ',' + (oldLine-oldRangeStart+contextSize)
-                  + ' +' + newRangeStart + ',' + (newLine-newRangeStart+contextSize)
-                  + ' @@');
-              ret.push.apply(ret, curRange);
-              ret.push.apply(ret, contextLines(lines.slice(0, contextSize)));
-              if (lines.length <= 4) {
-                eofNL(ret, i, current);
-              }
-
-              oldRangeStart = 0;  newRangeStart = 0; curRange = [];
-            }
-          }
-          oldLine += lines.length;
-          newLine += lines.length;
-        }
-      }
-
-      return ret.join('\n') + '\n';
-    },
-
-    applyPatch: function(oldStr, uniDiff) {
-      var diffstr = uniDiff.split('\n');
-      var diff = [];
-      var remEOFNL = false,
-          addEOFNL = false;
-
-      for (var i = (diffstr[0][0]==='I'?4:0); i < diffstr.length; i++) {
-        if(diffstr[i][0] === '@') {
-          var meh = diffstr[i].split(/@@ -(\d+),(\d+) \+(\d+),(\d+) @@/);
-          diff.unshift({
-            start:meh[3],
-            oldlength:meh[2],
-            oldlines:[],
-            newlength:meh[4],
-            newlines:[]
-          });
-        } else if(diffstr[i][0] === '+') {
-          diff[0].newlines.push(diffstr[i].substr(1));
-        } else if(diffstr[i][0] === '-') {
-          diff[0].oldlines.push(diffstr[i].substr(1));
-        } else if(diffstr[i][0] === ' ') {
-          diff[0].newlines.push(diffstr[i].substr(1));
-          diff[0].oldlines.push(diffstr[i].substr(1));
-        } else if(diffstr[i][0] === '\\') {
-          if (diffstr[i-1][0] === '+') {
-            remEOFNL = true;
-          } else if(diffstr[i-1][0] === '-') {
-            addEOFNL = true;
-          }
-        }
-      }
-
-      var str = oldStr.split('\n');
-      for (var i = diff.length - 1; i >= 0; i--) {
-        var d = diff[i];
-        for (var j = 0; j < d.oldlength; j++) {
-          if(str[d.start-1+j] !== d.oldlines[j]) {
-            return false;
-          }
-        }
-        Array.prototype.splice.apply(str,[d.start-1,+d.oldlength].concat(d.newlines));
-      }
-
-      if (remEOFNL) {
-        while (!str[str.length-1]) {
-          str.pop();
-        }
-      } else if (addEOFNL) {
-        str.push('');
-      }
-      return str.join('\n');
-    },
-
-    convertChangesToXML: function(changes){
-      var ret = [];
-      for ( var i = 0; i < changes.length; i++) {
-        var change = changes[i];
-        if (change.added) {
-          ret.push('<ins>');
-        } else if (change.removed) {
-          ret.push('<del>');
-        }
-
-        ret.push(escapeHTML(change.value));
-
-        if (change.added) {
-          ret.push('</ins>');
-        } else if (change.removed) {
-          ret.push('</del>');
-        }
-      }
-      return ret.join('');
-    },
-
-    // See: http://code.google.com/p/google-diff-match-patch/wiki/API
-    convertChangesToDMP: function(changes){
-      var ret = [], change;
-      for ( var i = 0; i < changes.length; i++) {
-        change = changes[i];
-        ret.push([(change.added ? 1 : change.removed ? -1 : 0), change.value]);
-      }
-      return ret;
-    }
-  };
-})();
-
-if (typeof module !== 'undefined') {
-    module.exports = JsDiff;
-}
-
-}); // module: browser/diff.js
-
-require.register("browser/escape-string-regexp.js", function(module, exports, require){
-'use strict';
-
-var matchOperatorsRe = /[|\\{}()[\]^$+*?.]/g;
-
-module.exports = function (str) {
-  if (typeof str !== 'string') {
-    throw new TypeError('Expected a string');
-  }
-
-  return str.replace(matchOperatorsRe,  '\\$&');
-};
-
-}); // module: browser/escape-string-regexp.js
-
-require.register("browser/events.js", function(module, exports, require){
-/**
- * Module exports.
- */
-
-exports.EventEmitter = EventEmitter;
-
-/**
- * Check if `obj` is an array.
- */
-
-function isArray(obj) {
-  return '[object Array]' == {}.toString.call(obj);
-}
-
-/**
- * Event emitter constructor.
- *
- * @api public
- */
-
-function EventEmitter(){};
-
-/**
- * Adds a listener.
- *
- * @api public
- */
-
-EventEmitter.prototype.on = function (name, fn) {
-  if (!this.$events) {
-    this.$events = {};
-  }
-
-  if (!this.$events[name]) {
-    this.$events[name] = fn;
-  } else if (isArray(this.$events[name])) {
-    this.$events[name].push(fn);
-  } else {
-    this.$events[name] = [this.$events[name], fn];
-  }
-
-  return this;
-};
-
-EventEmitter.prototype.addListener = EventEmitter.prototype.on;
-
-/**
- * Adds a volatile listener.
- *
- * @api public
- */
-
-EventEmitter.prototype.once = function (name, fn) {
-  var self = this;
-
-  function on () {
-    self.removeListener(name, on);
-    fn.apply(this, arguments);
-  };
-
-  on.listener = fn;
-  this.on(name, on);
-
-  return this;
-};
-
-/**
- * Removes a listener.
- *
- * @api public
- */
-
-EventEmitter.prototype.removeListener = function (name, fn) {
-  if (this.$events && this.$events[name]) {
-    var list = this.$events[name];
-
-    if (isArray(list)) {
-      var pos = -1;
-
-      for (var i = 0, l = list.length; i < l; i++) {
-        if (list[i] === fn || (list[i].listener && list[i].listener === fn)) {
-          pos = i;
-          break;
-        }
-      }
-
-      if (pos < 0) {
-        return this;
-      }
-
-      list.splice(pos, 1);
-
-      if (!list.length) {
-        delete this.$events[name];
-      }
-    } else if (list === fn || (list.listener && list.listener === fn)) {
-      delete this.$events[name];
-    }
-  }
-
-  return this;
-};
-
-/**
- * Removes all listeners for an event.
- *
- * @api public
- */
-
-EventEmitter.prototype.removeAllListeners = function (name) {
-  if (name === undefined) {
-    this.$events = {};
-    return this;
-  }
-
-  if (this.$events && this.$events[name]) {
-    this.$events[name] = null;
-  }
-
-  return this;
-};
-
-/**
- * Gets all listeners for a certain event.
- *
- * @api public
- */
-
-EventEmitter.prototype.listeners = function (name) {
-  if (!this.$events) {
-    this.$events = {};
-  }
-
-  if (!this.$events[name]) {
-    this.$events[name] = [];
-  }
-
-  if (!isArray(this.$events[name])) {
-    this.$events[name] = [this.$events[name]];
-  }
-
-  return this.$events[name];
-};
-
-/**
- * Emits an event.
- *
- * @api public
- */
-
-EventEmitter.prototype.emit = function (name) {
-  if (!this.$events) {
-    return false;
-  }
-
-  var handler = this.$events[name];
-
-  if (!handler) {
-    return false;
-  }
-
-  var args = [].slice.call(arguments, 1);
-
-  if ('function' == typeof handler) {
-    handler.apply(this, args);
-  } else if (isArray(handler)) {
-    var listeners = handler.slice();
-
-    for (var i = 0, l = listeners.length; i < l; i++) {
-      listeners[i].apply(this, args);
-    }
-  } else {
-    return false;
-  }
-
-  return true;
-};
-
-}); // module: browser/events.js
-
-require.register("browser/fs.js", function(module, exports, require){
-
-}); // module: browser/fs.js
-
-require.register("browser/glob.js", function(module, exports, require){
-
-}); // module: browser/glob.js
-
-require.register("browser/path.js", function(module, exports, require){
-
-}); // module: browser/path.js
-
-require.register("browser/progress.js", function(module, exports, require){
-/**
- * Expose `Progress`.
- */
-
-module.exports = Progress;
-
-/**
- * Initialize a new `Progress` indicator.
- */
-
-function Progress() {
-  this.percent = 0;
-  this.size(0);
-  this.fontSize(11);
-  this.font('helvetica, arial, sans-serif');
-}
-
-/**
- * Set progress size to `n`.
- *
- * @param {Number} n
- * @return {Progress} for chaining
- * @api public
- */
-
-Progress.prototype.size = function(n){
-  this._size = n;
-  return this;
-};
-
-/**
- * Set text to `str`.
- *
- * @param {String} str
- * @return {Progress} for chaining
- * @api public
- */
-
-Progress.prototype.text = function(str){
-  this._text = str;
-  return this;
-};
-
-/**
- * Set font size to `n`.
- *
- * @param {Number} n
- * @return {Progress} for chaining
- * @api public
- */
-
-Progress.prototype.fontSize = function(n){
-  this._fontSize = n;
-  return this;
-};
-
-/**
- * Set font `family`.
- *
- * @param {String} family
- * @return {Progress} for chaining
- */
-
-Progress.prototype.font = function(family){
-  this._font = family;
-  return this;
-};
-
-/**
- * Update percentage to `n`.
- *
- * @param {Number} n
- * @return {Progress} for chaining
- */
-
-Progress.prototype.update = function(n){
-  this.percent = n;
-  return this;
-};
-
-/**
- * Draw on `ctx`.
- *
- * @param {CanvasRenderingContext2d} ctx
- * @return {Progress} for chaining
- */
-
-Progress.prototype.draw = function(ctx){
-  try {
-    var percent = Math.min(this.percent, 100)
-      , size = this._size
-      , half = size / 2
-      , x = half
-      , y = half
-      , rad = half - 1
-      , fontSize = this._fontSize;
-
-    ctx.font = fontSize + 'px ' + this._font;
-
-    var angle = Math.PI * 2 * (percent / 100);
-    ctx.clearRect(0, 0, size, size);
-
-    // outer circle
-    ctx.strokeStyle = '#9f9f9f';
-    ctx.beginPath();
-    ctx.arc(x, y, rad, 0, angle, false);
-    ctx.stroke();
-
-    // inner circle
-    ctx.strokeStyle = '#eee';
-    ctx.beginPath();
-    ctx.arc(x, y, rad - 1, 0, angle, true);
-    ctx.stroke();
-
-    // text
-    var text = this._text || (percent | 0) + '%'
-      , w = ctx.measureText(text).width;
-
-    ctx.fillText(
-        text
-      , x - w / 2 + 1
-      , y + fontSize / 2 - 1);
-  } catch (ex) {} //don't fail if we can't render progress
-  return this;
-};
-
-}); // module: browser/progress.js
-
-require.register("browser/tty.js", function(module, exports, require){
-exports.isatty = function(){
-  return true;
-};
-
-exports.getWindowSize = function(){
-  if ('innerHeight' in global) {
-    return [global.innerHeight, global.innerWidth];
-  } else {
-    // In a Web Worker, the DOM Window is not available.
-    return [640, 480];
-  }
-};
-
-}); // module: browser/tty.js
-
-require.register("context.js", function(module, exports, require){
-/**
- * Expose `Context`.
- */
-
-module.exports = Context;
-
-/**
- * Initialize a new `Context`.
- *
- * @api private
- */
-
-function Context(){}
-
-/**
- * Set or get the context `Runnable` to `runnable`.
- *
- * @param {Runnable} runnable
- * @return {Context}
- * @api private
- */
-
-Context.prototype.runnable = function(runnable){
-  if (0 == arguments.length) return this._runnable;
-  this.test = this._runnable = runnable;
-  return this;
-};
-
-/**
- * Set test timeout `ms`.
- *
- * @param {Number} ms
- * @return {Context} self
- * @api private
- */
-
-Context.prototype.timeout = function(ms){
-  if (arguments.length === 0) return this.runnable().timeout();
-  this.runnable().timeout(ms);
-  return this;
-};
-
-/**
- * Set test timeout `enabled`.
- *
- * @param {Boolean} enabled
- * @return {Context} self
- * @api private
- */
-
-Context.prototype.enableTimeouts = function (enabled) {
-  this.runnable().enableTimeouts(enabled);
-  return this;
-};
-
-
-/**
- * Set test slowness threshold `ms`.
- *
- * @param {Number} ms
- * @return {Context} self
- * @api private
- */
-
-Context.prototype.slow = function(ms){
-  this.runnable().slow(ms);
-  return this;
-};
-
-/**
- * Mark a test as skipped.
- *
- * @return {Context} self
- * @api private
- */
-
-Context.prototype.skip = function(){
-    this.runnable().skip();
-    return this;
-};
-
-/**
- * Inspect the context void of `._runnable`.
- *
- * @return {String}
- * @api private
- */
-
-Context.prototype.inspect = function(){
-  return JSON.stringify(this, function(key, val){
-    if ('_runnable' == key) return;
-    if ('test' == key) return;
-    return val;
-  }, 2);
-};
-
-}); // module: context.js
-
-require.register("hook.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Runnable = require('./runnable');
-
-/**
- * Expose `Hook`.
- */
-
-module.exports = Hook;
-
-/**
- * Initialize a new `Hook` with the given `title` and callback `fn`.
- *
- * @param {String} title
- * @param {Function} fn
- * @api private
- */
-
-function Hook(title, fn) {
-  Runnable.call(this, title, fn);
-  this.type = 'hook';
-}
-
-/**
- * Inherit from `Runnable.prototype`.
- */
-
-function F(){};
-F.prototype = Runnable.prototype;
-Hook.prototype = new F;
-Hook.prototype.constructor = Hook;
-
-
-/**
- * Get or set the test `err`.
- *
- * @param {Error} err
- * @return {Error}
- * @api public
- */
-
-Hook.prototype.error = function(err){
-  if (0 == arguments.length) {
-    var err = this._error;
-    this._error = null;
-    return err;
-  }
-
-  this._error = err;
-};
-
-}); // module: hook.js
-
-require.register("interfaces/bdd.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Suite = require('../suite')
-  , Test = require('../test')
-  , utils = require('../utils')
-  , escapeRe = require('browser/escape-string-regexp');
-
-/**
- * BDD-style interface:
- *
- *      describe('Array', function(){
- *        describe('#indexOf()', function(){
- *          it('should return -1 when not present', function(){
- *
- *          });
- *
- *          it('should return the index when present', function(){
- *
- *          });
- *        });
- *      });
- *
- */
-
-module.exports = function(suite){
-  var suites = [suite];
-
-  suite.on('pre-require', function(context, file, mocha){
-
-    var common = require('./common')(suites, context);
-
-    context.before = common.before;
-    context.after = common.after;
-    context.beforeEach = common.beforeEach;
-    context.afterEach = common.afterEach;
-    context.run = mocha.options.delay && common.runWithSuite(suite);
-    /**
-     * Describe a "suite" with the given `title`
-     * and callback `fn` containing nested suites
-     * and/or tests.
-     */
-
-    context.describe = context.context = function(title, fn){
-      var suite = Suite.create(suites[0], title);
-      suite.file = file;
-      suites.unshift(suite);
-      fn.call(suite);
-      suites.shift();
-      return suite;
-    };
-
-    /**
-     * Pending describe.
-     */
-
-    context.xdescribe =
-    context.xcontext =
-    context.describe.skip = function(title, fn){
-      var suite = Suite.create(suites[0], title);
-      suite.pending = true;
-      suites.unshift(suite);
-      fn.call(suite);
-      suites.shift();
-    };
-
-    /**
-     * Exclusive suite.
-     */
-
-    context.describe.only = function(title, fn){
-      var suite = context.describe(title, fn);
-      mocha.grep(suite.fullTitle());
-      return suite;
-    };
-
-    /**
-     * Describe a specification or test-case
-     * with the given `title` and callback `fn`
-     * acting as a thunk.
-     */
-
-    context.it = context.specify = function(title, fn){
-      var suite = suites[0];
-      if (suite.pending) fn = null;
-      var test = new Test(title, fn);
-      test.file = file;
-      suite.addTest(test);
-      return test;
-    };
-
-    /**
-     * Exclusive test-case.
-     */
-
-    context.it.only = function(title, fn){
-      var test = context.it(title, fn);
-      var reString = '^' + escapeRe(test.fullTitle()) + '$';
-      mocha.grep(new RegExp(reString));
-      return test;
-    };
-
-    /**
-     * Pending test case.
-     */
-
-    context.xit =
-    context.xspecify =
-    context.it.skip = function(title){
-      context.it(title);
-    };
-
-  });
-};
-
-}); // module: interfaces/bdd.js
-
-require.register("interfaces/common.js", function(module, exports, require){
-/**
- * Functions common to more than one interface
- * @module lib/interfaces/common
- */
-
-'use strict';
-
-module.exports = function (suites, context) {
-
-  return {
-    /**
-     * This is only present if flag --delay is passed into Mocha.  It triggers
-     * root suite execution.  Returns a function which runs the root suite.
-     */
-    runWithSuite: function runWithSuite(suite) {
-      return function run() {
-        suite.run();
-      };
-    },
-
-    /**
-     * Execute before running tests.
-     */
-    before: function (name, fn) {
-      suites[0].beforeAll(name, fn);
-    },
-
-    /**
-     * Execute after running tests.
-     */
-    after: function (name, fn) {
-      suites[0].afterAll(name, fn);
-    },
-
-    /**
-     * Execute before each test case.
-     */
-    beforeEach: function (name, fn) {
-      suites[0].beforeEach(name, fn);
-    },
-
-    /**
-     * Execute after each test case.
-     */
-    afterEach: function (name, fn) {
-      suites[0].afterEach(name, fn);
-    },
-
-    test: {
-      /**
-       * Pending test case.
-       */
-      skip: function (title) {
-        context.test(title);
-      }
-    }
-  }
-};
-
-}); // module: interfaces/common.js
-
-require.register("interfaces/exports.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Suite = require('../suite')
-  , Test = require('../test');
-
-/**
- * TDD-style interface:
- *
- *     exports.Array = {
- *       '#indexOf()': {
- *         'should return -1 when the value is not present': function(){
- *
- *         },
- *
- *         'should return the correct index when the value is present': function(){
- *
- *         }
- *       }
- *     };
- *
- */
-
-module.exports = function(suite){
-  var suites = [suite];
-
-  suite.on('require', visit);
-
-  function visit(obj, file) {
-    var suite;
-    for (var key in obj) {
-      if ('function' == typeof obj[key]) {
-        var fn = obj[key];
-        switch (key) {
-          case 'before':
-            suites[0].beforeAll(fn);
-            break;
-          case 'after':
-            suites[0].afterAll(fn);
-            break;
-          case 'beforeEach':
-            suites[0].beforeEach(fn);
-            break;
-          case 'afterEach':
-            suites[0].afterEach(fn);
-            break;
-          default:
-            var test = new Test(key, fn);
-            test.file = file;
-            suites[0].addTest(test);
-        }
-      } else {
-        suite = Suite.create(suites[0], key);
-        suites.unshift(suite);
-        visit(obj[key]);
-        suites.shift();
-      }
-    }
-  }
-};
-
-}); // module: interfaces/exports.js
-
-require.register("interfaces/index.js", function(module, exports, require){
-exports.bdd = require('./bdd');
-exports.tdd = require('./tdd');
-exports.qunit = require('./qunit');
-exports.exports = require('./exports');
-
-}); // module: interfaces/index.js
-
-require.register("interfaces/qunit.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Suite = require('../suite')
-  , Test = require('../test')
-  , escapeRe = require('browser/escape-string-regexp')
-  , utils = require('../utils');
-
-/**
- * QUnit-style interface:
- *
- *     suite('Array');
- *
- *     test('#length', function(){
- *       var arr = [1,2,3];
- *       ok(arr.length == 3);
- *     });
- *
- *     test('#indexOf()', function(){
- *       var arr = [1,2,3];
- *       ok(arr.indexOf(1) == 0);
- *       ok(arr.indexOf(2) == 1);
- *       ok(arr.indexOf(3) == 2);
- *     });
- *
- *     suite('String');
- *
- *     test('#length', function(){
- *       ok('foo'.length == 3);
- *     });
- *
- */
-
-module.exports = function(suite){
-  var suites = [suite];
-
-  suite.on('pre-require', function(context, file, mocha){
-
-    var common = require('./common')(suites, context);
-
-    context.before = common.before;
-    context.after = common.after;
-    context.beforeEach = common.beforeEach;
-    context.afterEach = common.afterEach;
-    context.run = mocha.options.delay && common.runWithSuite(suite);
-    /**
-     * Describe a "suite" with the given `title`.
-     */
-
-    context.suite = function(title){
-      if (suites.length > 1) suites.shift();
-      var suite = Suite.create(suites[0], title);
-      suite.file = file;
-      suites.unshift(suite);
-      return suite;
-    };
-
-    /**
-     * Exclusive test-case.
-     */
-
-    context.suite.only = function(title, fn){
-      var suite = context.suite(title, fn);
-      mocha.grep(suite.fullTitle());
-    };
-
-    /**
-     * Describe a specification or test-case
-     * with the given `title` and callback `fn`
-     * acting as a thunk.
-     */
-
-    context.test = function(title, fn){
-      var test = new Test(title, fn);
-      test.file = file;
-      suites[0].addTest(test);
-      return test;
-    };
-
-    /**
-     * Exclusive test-case.
-     */
-
-    context.test.only = function(title, fn){
-      var test = context.test(title, fn);
-      var reString = '^' + escapeRe(test.fullTitle()) + '$';
-      mocha.grep(new RegExp(reString));
-    };
-
-    context.test.skip = common.test.skip;
-
-  });
-};
-
-}); // module: interfaces/qunit.js
-
-require.register("interfaces/tdd.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Suite = require('../suite')
-  , Test = require('../test')
-  , escapeRe = require('browser/escape-string-regexp')
-  , utils = require('../utils');
-
-/**
- * TDD-style interface:
- *
- *      suite('Array', function(){
- *        suite('#indexOf()', function(){
- *          suiteSetup(function(){
- *
- *          });
- *
- *          test('should return -1 when not present', function(){
- *
- *          });
- *
- *          test('should return the index when present', function(){
- *
- *          });
- *
- *          suiteTeardown(function(){
- *
- *          });
- *        });
- *      });
- *
- */
-
-module.exports = function(suite){
-  var suites = [suite];
-
-  suite.on('pre-require', function(context, file, mocha){
-
-    var common = require('./common')(suites, context);
-
-    context.setup = common.beforeEach;
-    context.teardown = common.afterEach;
-    context.suiteSetup = common.before;
-    context.suiteTeardown = common.after;
-    context.run = mocha.options.delay && common.runWithSuite(suite);
-    /**
-     * Describe a "suite" with the given `title`
-     * and callback `fn` containing nested suites
-     * and/or tests.
-     */
-
-    context.suite = function(title, fn){
-      var suite = Suite.create(suites[0], title);
-      suite.file = file;
-      suites.unshift(suite);
-      fn.call(suite);
-      suites.shift();
-      return suite;
-    };
-
-    /**
-     * Pending suite.
-     */
-    context.suite.skip = function(title, fn) {
-      var suite = Suite.create(suites[0], title);
-      suite.pending = true;
-      suites.unshift(suite);
-      fn.call(suite);
-      suites.shift();
-    };
-
-    /**
-     * Exclusive test-case.
-     */
-
-    context.suite.only = function(title, fn){
-      var suite = context.suite(title, fn);
-      mocha.grep(suite.fullTitle());
-    };
-
-    /**
-     * Describe a specification or test-case
-     * with the given `title` and callback `fn`
-     * acting as a thunk.
-     */
-
-    context.test = function(title, fn){
-      var suite = suites[0];
-      if (suite.pending) fn = null;
-      var test = new Test(title, fn);
-      test.file = file;
-      suite.addTest(test);
-      return test;
-    };
-
-    /**
-     * Exclusive test-case.
-     */
-
-    context.test.only = function(title, fn){
-      var test = context.test(title, fn);
-      var reString = '^' + escapeRe(test.fullTitle()) + '$';
-      mocha.grep(new RegExp(reString));
-    };
-
-    context.test.skip = common.test.skip;
-  });
-};
-
-}); // module: interfaces/tdd.js
-
-require.register("mocha.js", function(module, exports, require){
-/*!
- * mocha
- * Copyright(c) 2011 TJ Holowaychuk <tj@vision-media.ca>
- * MIT Licensed
- */
-
-/**
- * Module dependencies.
- */
-
-var path = require('browser/path')
-  , escapeRe = require('browser/escape-string-regexp')
-  , utils = require('./utils');
-
-/**
- * Expose `Mocha`.
- */
-
-exports = module.exports = Mocha;
-
-/**
- * To require local UIs and reporters when running in node.
- */
-
-if (typeof process !== 'undefined' && typeof process.cwd === 'function') {
-  var join = path.join
-    , cwd = process.cwd();
-  module.paths.push(cwd, join(cwd, 'node_modules'));
-}
-
-/**
- * Expose internals.
- */
-
-exports.utils = utils;
-exports.interfaces = require('./interfaces');
-exports.reporters = require('./reporters');
-exports.Runnable = require('./runnable');
-exports.Context = require('./context');
-exports.Runner = require('./runner');
-exports.Suite = require('./suite');
-exports.Hook = require('./hook');
-exports.Test = require('./test');
-
-/**
- * Return image `name` path.
- *
- * @param {String} name
- * @return {String}
- * @api private
- */
-
-function image(name) {
-  return __dirname + '/../images/' + name + '.png';
-}
-
-/**
- * Setup mocha with `options`.
- *
- * Options:
- *
- *   - `ui` name "bdd", "tdd", "exports" etc
- *   - `reporter` reporter instance, defaults to `mocha.reporters.spec`
- *   - `globals` array of accepted globals
- *   - `timeout` timeout in milliseconds
- *   - `bail` bail on the first test failure
- *   - `slow` milliseconds to wait before considering a test slow
- *   - `ignoreLeaks` ignore global leaks
- *   - `fullTrace` display the full stack-trace on failing
- *   - `grep` string or regexp to filter tests with
- *
- * @param {Object} options
- * @api public
- */
-
-function Mocha(options) {
-  options = options || {};
-  this.files = [];
-  this.options = options;
-  if (options.grep) this.grep(new RegExp(options.grep));
-  if (options.fgrep) this.grep(options.fgrep);
-  this.suite = new exports.Suite('', new exports.Context);
-  this.ui(options.ui);
-  this.bail(options.bail);
-  this.reporter(options.reporter, options.reporterOptions);
-  if (null != options.timeout) this.timeout(options.timeout);
-  this.useColors(options.useColors);
-  if (options.enableTimeouts !== null) this.enableTimeouts(options.enableTimeouts);
-  if (options.slow) this.slow(options.slow);
-
-  this.suite.on('pre-require', function (context) {
-    exports.afterEach = context.afterEach || context.teardown;
-    exports.after = context.after || context.suiteTeardown;
-    exports.beforeEach = context.beforeEach || context.setup;
-    exports.before = context.before || context.suiteSetup;
-    exports.describe = context.describe || context.suite;
-    exports.it = context.it || context.test;
-    exports.setup = context.setup || context.beforeEach;
-    exports.suiteSetup = context.suiteSetup || context.before;
-    exports.suiteTeardown = context.suiteTeardown || context.after;
-    exports.suite = context.suite || context.describe;
-    exports.teardown = context.teardown || context.afterEach;
-    exports.test = context.test || context.it;
-    exports.run = context.run;
-  });
-}
-
-/**
- * Enable or disable bailing on the first failure.
- *
- * @param {Boolean} [bail]
- * @api public
- */
-
-Mocha.prototype.bail = function(bail){
-  if (0 == arguments.length) bail = true;
-  this.suite.bail(bail);
-  return this;
-};
-
-/**
- * Add test `file`.
- *
- * @param {String} file
- * @api public
- */
-
-Mocha.prototype.addFile = function(file){
-  this.files.push(file);
-  return this;
-};
-
-/**
- * Set reporter to `reporter`, defaults to "spec".
- *
- * @param {String|Function} reporter name or constructor
- * @param {Object} reporterOptions optional options
- * @api public
- */
-Mocha.prototype.reporter = function(reporter, reporterOptions){
-  if ('function' == typeof reporter) {
-    this._reporter = reporter;
-  } else {
-    reporter = reporter || 'spec';
-    var _reporter;
-    try { _reporter = require('./reporters/' + reporter); } catch (err) {}
-    if (!_reporter) try { _reporter = require(reporter); } catch (err) {
-      err.message.indexOf('Cannot find module') !== -1
-        ? console.warn('"' + reporter + '" reporter not found')
-        : console.warn('"' + reporter + '" reporter blew up with error:\n' + err.stack);
-    }
-    if (!_reporter && reporter === 'teamcity')
-      console.warn('The Teamcity reporter was moved to a package named ' +
-        'mocha-teamcity-reporter ' +
-        '(https://npmjs.org/package/mocha-teamcity-reporter).');
-    if (!_reporter) throw new Error('invalid reporter "' + reporter + '"');
-    this._reporter = _reporter;
-  }
-  this.options.reporterOptions = reporterOptions;
-  return this;
-};
-
-/**
- * Set test UI `name`, defaults to "bdd".
- *
- * @param {String} bdd
- * @api public
- */
-
-Mocha.prototype.ui = function(name){
-  name = name || 'bdd';
-  this._ui = exports.interfaces[name];
-  if (!this._ui) try { this._ui = require(name); } catch (err) {}
-  if (!this._ui) throw new Error('invalid interface "' + name + '"');
-  this._ui = this._ui(this.suite);
-  return this;
-};
-
-/**
- * Load registered files.
- *
- * @api private
- */
-
-Mocha.prototype.loadFiles = function(fn){
-  var self = this;
-  var suite = this.suite;
-  var pending = this.files.length;
-  this.files.forEach(function(file){
-    file = path.resolve(file);
-    suite.emit('pre-require', global, file, self);
-    suite.emit('require', require(file), file, self);
-    suite.emit('post-require', global, file, self);
-    --pending || (fn && fn());
-  });
-};
-
-/**
- * Enable growl support.
- *
- * @api private
- */
-
-Mocha.prototype._growl = function(runner, reporter) {
-  var notify = require('growl');
-
-  runner.on('end', function(){
-    var stats = reporter.stats;
-    if (stats.failures) {
-      var msg = stats.failures + ' of ' + runner.total + ' tests failed';
-      notify(msg, { name: 'mocha', title: 'Failed', image: image('error') });
-    } else {
-      notify(stats.passes + ' tests passed in ' + stats.duration + 'ms', {
-          name: 'mocha'
-        , title: 'Passed'
-        , image: image('ok')
-      });
-    }
-  });
-};
-
-/**
- * Add regexp to grep, if `re` is a string it is escaped.
- *
- * @param {RegExp|String} re
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.grep = function(re){
-  this.options.grep = 'string' == typeof re
-    ? new RegExp(escapeRe(re))
-    : re;
-  return this;
-};
-
-/**
- * Invert `.grep()` matches.
- *
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.invert = function(){
-  this.options.invert = true;
-  return this;
-};
-
-/**
- * Ignore global leaks.
- *
- * @param {Boolean} ignore
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.ignoreLeaks = function(ignore){
-  this.options.ignoreLeaks = !!ignore;
-  return this;
-};
-
-/**
- * Enable global leak checking.
- *
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.checkLeaks = function(){
-  this.options.ignoreLeaks = false;
-  return this;
-};
-
-/**
- * Display long stack-trace on failing
- *
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.fullTrace = function() {
-  this.options.fullStackTrace = true;
-  return this;
-};
-
-/**
- * Enable growl support.
- *
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.growl = function(){
-  this.options.growl = true;
-  return this;
-};
-
-/**
- * Ignore `globals` array or string.
- *
- * @param {Array|String} globals
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.globals = function(globals){
-  this.options.globals = (this.options.globals || []).concat(globals);
-  return this;
-};
-
-/**
- * Emit color output.
- *
- * @param {Boolean} colors
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.useColors = function(colors){
-  if (colors !== undefined) {
-    this.options.useColors = colors;
-  }
-  return this;
-};
-
-/**
- * Use inline diffs rather than +/-.
- *
- * @param {Boolean} inlineDiffs
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.useInlineDiffs = function(inlineDiffs) {
-  this.options.useInlineDiffs = arguments.length && inlineDiffs != undefined
-  ? inlineDiffs
-  : false;
-  return this;
-};
-
-/**
- * Set the timeout in milliseconds.
- *
- * @param {Number} timeout
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.timeout = function(timeout){
-  this.suite.timeout(timeout);
-  return this;
-};
-
-/**
- * Set slowness threshold in milliseconds.
- *
- * @param {Number} slow
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.slow = function(slow){
-  this.suite.slow(slow);
-  return this;
-};
-
-/**
- * Enable timeouts.
- *
- * @param {Boolean} enabled
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.enableTimeouts = function(enabled) {
-  this.suite.enableTimeouts(arguments.length && enabled !== undefined
-    ? enabled
-    : true);
-  return this
-};
-
-/**
- * Makes all tests async (accepting a callback)
- *
- * @return {Mocha}
- * @api public
- */
-
-Mocha.prototype.asyncOnly = function(){
-  this.options.asyncOnly = true;
-  return this;
-};
-
-/**
- * Disable syntax highlighting (in browser).
- * @returns {Mocha}
- * @api public
- */
-Mocha.prototype.noHighlighting = function() {
-  this.options.noHighlighting = true;
-  return this;
-};
-
-/**
- * Delay root suite execution.
- * @returns {Mocha}
- * @api public
- */
-Mocha.prototype.delay = function delay() {
-  this.options.delay = true;
-  return this;
-};
-
-/**
- * Run tests and invoke `fn()` when complete.
- *
- * @param {Function} fn
- * @return {Runner}
- * @api public
- */
-Mocha.prototype.run = function(fn){
-  if (this.files.length) this.loadFiles();
-  var suite = this.suite;
-  var options = this.options;
-  options.files = this.files;
-  var runner = new exports.Runner(suite, options.delay);
-  var reporter = new this._reporter(runner, options);
-  runner.ignoreLeaks = false !== options.ignoreLeaks;
-  runner.fullStackTrace = options.fullStackTrace;
-  runner.asyncOnly = options.asyncOnly;
-  if (options.grep) runner.grep(options.grep, options.invert);
-  if (options.globals) runner.globals(options.globals);
-  if (options.growl) this._growl(runner, reporter);
-  if (options.useColors !== undefined) {
-    exports.reporters.Base.useColors = options.useColors;
-  }
-  exports.reporters.Base.inlineDiffs = options.useInlineDiffs;
-
-  function done(failures) {
-      if (reporter.done) {
-          reporter.done(failures, fn);
-      } else fn && fn(failures);
-  }
-
-  return runner.run(done);
-};
-
-}); // module: mocha.js
-
-require.register("ms.js", function(module, exports, require){
-/**
- * Helpers.
- */
-
-var s = 1000;
-var m = s * 60;
-var h = m * 60;
-var d = h * 24;
-var y = d * 365.25;
-
-/**
- * Parse or format the given `val`.
- *
- * Options:
- *
- *  - `long` verbose formatting [false]
- *
- * @param {String|Number} val
- * @param {Object} options
- * @return {String|Number}
- * @api public
- */
-
-module.exports = function(val, options){
-  options = options || {};
-  if ('string' == typeof val) return parse(val);
-  return options['long'] ? longFormat(val) : shortFormat(val);
-};
-
-/**
- * Parse the given `str` and return milliseconds.
- *
- * @param {String} str
- * @return {Number}
- * @api private
- */
-
-function parse(str) {
-  var match = /^((?:\d+)?\.?\d+) *(ms|seconds?|s|minutes?|m|hours?|h|days?|d|years?|y)?$/i.exec(str);
-  if (!match) return;
-  var n = parseFloat(match[1]);
-  var type = (match[2] || 'ms').toLowerCase();
-  switch (type) {
-    case 'years':
-    case 'year':
-    case 'y':
-      return n * y;
-    case 'days':
-    case 'day':
-    case 'd':
-      return n * d;
-    case 'hours':
-    case 'hour':
-    case 'h':
-      return n * h;
-    case 'minutes':
-    case 'minute':
-    case 'm':
-      return n * m;
-    case 'seconds':
-    case 'second':
-    case 's':
-      return n * s;
-    case 'ms':
-      return n;
-  }
-}
-
-/**
- * Short format for `ms`.
- *
- * @param {Number} ms
- * @return {String}
- * @api private
- */
-
-function shortFormat(ms) {
-  if (ms >= d) return Math.round(ms / d) + 'd';
-  if (ms >= h) return Math.round(ms / h) + 'h';
-  if (ms >= m) return Math.round(ms / m) + 'm';
-  if (ms >= s) return Math.round(ms / s) + 's';
-  return ms + 'ms';
-}
-
-/**
- * Long format for `ms`.
- *
- * @param {Number} ms
- * @return {String}
- * @api private
- */
-
-function longFormat(ms) {
-  return plural(ms, d, 'day')
-    || plural(ms, h, 'hour')
-    || plural(ms, m, 'minute')
-    || plural(ms, s, 'second')
-    || ms + ' ms';
-}
-
-/**
- * Pluralization helper.
- */
-
-function plural(ms, n, name) {
-  if (ms < n) return;
-  if (ms < n * 1.5) return Math.floor(ms / n) + ' ' + name;
-  return Math.ceil(ms / n) + ' ' + name + 's';
-}
-
-}); // module: ms.js
-
-require.register("pending.js", function(module, exports, require){
-
-/**
- * Expose `Pending`.
- */
-
-module.exports = Pending;
-
-/**
- * Initialize a new `Pending` error with the given message.
- *
- * @param {String} message
- */
-
-function Pending(message) {
-    this.message = message;
-}
-
-}); // module: pending.js
-
-require.register("reporters/base.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var tty = require('browser/tty')
-  , diff = require('browser/diff')
-  , ms = require('../ms')
-  , utils = require('../utils')
-  , supportsColor = process.env ? require('supports-color') : null;
-
-/**
- * Save timer references to avoid Sinon interfering (see GH-237).
- */
-
-var Date = global.Date
-  , setTimeout = global.setTimeout
-  , setInterval = global.setInterval
-  , clearTimeout = global.clearTimeout
-  , clearInterval = global.clearInterval;
-
-/**
- * Check if both stdio streams are associated with a tty.
- */
-
-var isatty = tty.isatty(1) && tty.isatty(2);
-
-/**
- * Expose `Base`.
- */
-
-exports = module.exports = Base;
-
-/**
- * Enable coloring by default, except in the browser interface.
- */
-
-exports.useColors = process.env
-  ? (supportsColor || (process.env.MOCHA_COLORS !== undefined))
-  : false;
-
-/**
- * Inline diffs instead of +/-
- */
-
-exports.inlineDiffs = false;
-
-/**
- * Default color map.
- */
-
-exports.colors = {
-    'pass': 90
-  , 'fail': 31
-  , 'bright pass': 92
-  , 'bright fail': 91
-  , 'bright yellow': 93
-  , 'pending': 36
-  , 'suite': 0
-  , 'error title': 0
-  , 'error message': 31
-  , 'error stack': 90
-  , 'checkmark': 32
-  , 'fast': 90
-  , 'medium': 33
-  , 'slow': 31
-  , 'green': 32
-  , 'light': 90
-  , 'diff gutter': 90
-  , 'diff added': 42
-  , 'diff removed': 41
-};
-
-/**
- * Default symbol map.
- */
-
-exports.symbols = {
-  ok: '✓',
-  err: '✖',
-  dot: '․'
-};
-
-// With node.js on Windows: use symbols available in terminal default fonts
-if ('win32' == process.platform) {
-  exports.symbols.ok = '\u221A';
-  exports.symbols.err = '\u00D7';
-  exports.symbols.dot = '.';
-}
-
-/**
- * Color `str` with the given `type`,
- * allowing colors to be disabled,
- * as well as user-defined color
- * schemes.
- *
- * @param {String} type
- * @param {String} str
- * @return {String}
- * @api private
- */
-
-var color = exports.color = function(type, str) {
-  if (!exports.useColors) return String(str);
-  return '\u001b[' + exports.colors[type] + 'm' + str + '\u001b[0m';
-};
-
-/**
- * Expose term window size, with some
- * defaults for when stderr is not a tty.
- */
-
-exports.window = {
-  width: isatty
-    ? process.stdout.getWindowSize
-      ? process.stdout.getWindowSize(1)[0]
-      : tty.getWindowSize()[1]
-    : 75
-};
-
-/**
- * Expose some basic cursor interactions
- * that are common among reporters.
- */
-
-exports.cursor = {
-  hide: function(){
-    isatty && process.stdout.write('\u001b[?25l');
-  },
-
-  show: function(){
-    isatty && process.stdout.write('\u001b[?25h');
-  },
-
-  deleteLine: function(){
-    isatty && process.stdout.write('\u001b[2K');
-  },
-
-  beginningOfLine: function(){
-    isatty && process.stdout.write('\u001b[0G');
-  },
-
-  CR: function(){
-    if (isatty) {
-      exports.cursor.deleteLine();
-      exports.cursor.beginningOfLine();
-    } else {
-      process.stdout.write('\r');
-    }
-  }
-};
-
-/**
- * Outut the given `failures` as a list.
- *
- * @param {Array} failures
- * @api public
- */
-
-exports.list = function(failures){
-  console.log();
-  failures.forEach(function(test, i){
-    // format
-    var fmt = color('error title', '  %s) %s:\n')
-      + color('error message', '     %s')
-      + color('error stack', '\n%s\n');
-
-    // msg
-    var err = test.err
-      , message = err.message || ''
-      , stack = err.stack || message
-      , index = stack.indexOf(message)
-      , actual = err.actual
-      , expected = err.expected
-      , escape = true;
-    if (index === -1) {
-      msg = message;
-    } else {
-      index += message.length;
-      msg = stack.slice(0, index);
-      // remove msg from stack
-      stack = stack.slice(index + 1);
-    }
-
-    // uncaught
-    if (err.uncaught) {
-      msg = 'Uncaught ' + msg;
-    }
-    // explicitly show diff
-    if (err.showDiff !== false && sameType(actual, expected)
-        && expected !== undefined) {
-
-      if ('string' !== typeof actual) {
-        escape = false;
-        err.actual = actual = utils.stringify(actual);
-        err.expected = expected = utils.stringify(expected);
-      }
-
-      fmt = color('error title', '  %s) %s:\n%s') + color('error stack', '\n%s\n');
-      var match = message.match(/^([^:]+): expected/);
-      msg = '\n      ' + color('error message', match ? match[1] : msg);
-
-      if (exports.inlineDiffs) {
-        msg += inlineDiff(err, escape);
-      } else {
-        msg += unifiedDiff(err, escape);
-      }
-    }
-
-    // indent stack trace
-    stack = stack.replace(/^/gm, '  ');
-
-    console.log(fmt, (i + 1), test.fullTitle(), msg, stack);
-  });
-};
-
-/**
- * Initialize a new `Base` reporter.
- *
- * All other reporters generally
- * inherit from this reporter, providing
- * stats such as test duration, number
- * of tests passed / failed etc.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function Base(runner) {
-  var self = this
-    , stats = this.stats = { suites: 0, tests: 0, passes: 0, pending: 0, failures: 0 }
-    , failures = this.failures = [];
-
-  if (!runner) return;
-  this.runner = runner;
-
-  runner.stats = stats;
-
-  runner.on('start', function(){
-    stats.start = new Date;
-  });
-
-  runner.on('suite', function(suite){
-    stats.suites = stats.suites || 0;
-    suite.root || stats.suites++;
-  });
-
-  runner.on('test end', function(test){
-    stats.tests = stats.tests || 0;
-    stats.tests++;
-  });
-
-  runner.on('pass', function(test){
-    stats.passes = stats.passes || 0;
-
-    var medium = test.slow() / 2;
-    test.speed = test.duration > test.slow()
-      ? 'slow'
-      : test.duration > medium
-        ? 'medium'
-        : 'fast';
-
-    stats.passes++;
-  });
-
-  runner.on('fail', function(test, err){
-    stats.failures = stats.failures || 0;
-    stats.failures++;
-    test.err = err;
-    failures.push(test);
-  });
-
-  runner.on('end', function(){
-    stats.end = new Date;
-    stats.duration = new Date - stats.start;
-  });
-
-  runner.on('pending', function(){
-    stats.pending++;
-  });
-}
-
-/**
- * Output common epilogue used by many of
- * the bundled reporters.
- *
- * @api public
- */
-
-Base.prototype.epilogue = function(){
-  var stats = this.stats;
-  var tests;
-  var fmt;
-
-  console.log();
-
-  // passes
-  fmt = color('bright pass', ' ')
-    + color('green', ' %d passing')
-    + color('light', ' (%s)');
-
-  console.log(fmt,
-    stats.passes || 0,
-    ms(stats.duration));
-
-  // pending
-  if (stats.pending) {
-    fmt = color('pending', ' ')
-      + color('pending', ' %d pending');
-
-    console.log(fmt, stats.pending);
-  }
-
-  // failures
-  if (stats.failures) {
-    fmt = color('fail', '  %d failing');
-
-    console.log(fmt, stats.failures);
-
-    Base.list(this.failures);
-    console.log();
-  }
-
-  console.log();
-};
-
-/**
- * Pad the given `str` to `len`.
- *
- * @param {String} str
- * @param {String} len
- * @return {String}
- * @api private
- */
-
-function pad(str, len) {
-  str = String(str);
-  return Array(len - str.length + 1).join(' ') + str;
-}
-
-
-/**
- * Returns an inline diff between 2 strings with coloured ANSI output
- *
- * @param {Error} Error with actual/expected
- * @return {String} Diff
- * @api private
- */
-
-function inlineDiff(err, escape) {
-  var msg = errorDiff(err, 'WordsWithSpace', escape);
-
-  // linenos
-  var lines = msg.split('\n');
-  if (lines.length > 4) {
-    var width = String(lines.length).length;
-    msg = lines.map(function(str, i){
-      return pad(++i, width) + ' |' + ' ' + str;
-    }).join('\n');
-  }
-
-  // legend
-  msg = '\n'
-    + color('diff removed', 'actual')
-    + ' '
-    + color('diff added', 'expected')
-    + '\n\n'
-    + msg
-    + '\n';
-
-  // indent
-  msg = msg.replace(/^/gm, '      ');
-  return msg;
-}
-
-/**
- * Returns a unified diff between 2 strings
- *
- * @param {Error} Error with actual/expected
- * @return {String} Diff
- * @api private
- */
-
-function unifiedDiff(err, escape) {
-  var indent = '      ';
-  function cleanUp(line) {
-    if (escape) {
-      line = escapeInvisibles(line);
-    }
-    if (line[0] === '+') return indent + colorLines('diff added', line);
-    if (line[0] === '-') return indent + colorLines('diff removed', line);
-    if (line.match(/\@\@/)) return null;
-    if (line.match(/\\ No newline/)) return null;
-    else return indent + line;
-  }
-  function notBlank(line) {
-    return line != null;
-  }
-  var msg = diff.createPatch('string', err.actual, err.expected);
-  var lines = msg.split('\n').splice(4);
-  return '\n      '
-         + colorLines('diff added',   '+ expected') + ' '
-         + colorLines('diff removed', '- actual')
-         + '\n\n'
-         + lines.map(cleanUp).filter(notBlank).join('\n');
-}
-
-/**
- * Return a character diff for `err`.
- *
- * @param {Error} err
- * @return {String}
- * @api private
- */
-
-function errorDiff(err, type, escape) {
-  var actual   = escape ? escapeInvisibles(err.actual)   : err.actual;
-  var expected = escape ? escapeInvisibles(err.expected) : err.expected;
-  return diff['diff' + type](actual, expected).map(function(str){
-    if (str.added) return colorLines('diff added', str.value);
-    if (str.removed) return colorLines('diff removed', str.value);
-    return str.value;
-  }).join('');
-}
-
-/**
- * Returns a string with all invisible characters in plain text
- *
- * @param {String} line
- * @return {String}
- * @api private
- */
-function escapeInvisibles(line) {
-    return line.replace(/\t/g, '<tab>')
-               .replace(/\r/g, '<CR>')
-               .replace(/\n/g, '<LF>\n');
-}
-
-/**
- * Color lines for `str`, using the color `name`.
- *
- * @param {String} name
- * @param {String} str
- * @return {String}
- * @api private
- */
-
-function colorLines(name, str) {
-  return str.split('\n').map(function(str){
-    return color(name, str);
-  }).join('\n');
-}
-
-/**
- * Check that a / b have the same type.
- *
- * @param {Object} a
- * @param {Object} b
- * @return {Boolean}
- * @api private
- */
-
-function sameType(a, b) {
-  a = Object.prototype.toString.call(a);
-  b = Object.prototype.toString.call(b);
-  return a == b;
-}
-
-}); // module: reporters/base.js
-
-require.register("reporters/doc.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , utils = require('../utils');
-
-/**
- * Expose `Doc`.
- */
-
-exports = module.exports = Doc;
-
-/**
- * Initialize a new `Doc` reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function Doc(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , total = runner.total
-    , indents = 2;
-
-  function indent() {
-    return Array(indents).join('  ');
-  }
-
-  runner.on('suite', function(suite){
-    if (suite.root) return;
-    ++indents;
-    console.log('%s<section class="suite">', indent());
-    ++indents;
-    console.log('%s<h1>%s</h1>', indent(), utils.escape(suite.title));
-    console.log('%s<dl>', indent());
-  });
-
-  runner.on('suite end', function(suite){
-    if (suite.root) return;
-    console.log('%s</dl>', indent());
-    --indents;
-    console.log('%s</section>', indent());
-    --indents;
-  });
-
-  runner.on('pass', function(test){
-    console.log('%s  <dt>%s</dt>', indent(), utils.escape(test.title));
-    var code = utils.escape(utils.clean(test.fn.toString()));
-    console.log('%s  <dd><pre><code>%s</code></pre></dd>', indent(), code);
-  });
-
-  runner.on('fail', function(test, err){
-    console.log('%s  <dt class="error">%s</dt>', indent(), utils.escape(test.title));
-    var code = utils.escape(utils.clean(test.fn.toString()));
-    console.log('%s  <dd class="error"><pre><code>%s</code></pre></dd>', indent(), code);
-    console.log('%s  <dd class="error">%s</dd>', indent(), utils.escape(err));
-  });
-}
-
-}); // module: reporters/doc.js
-
-require.register("reporters/dot.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , color = Base.color;
-
-/**
- * Expose `Dot`.
- */
-
-exports = module.exports = Dot;
-
-/**
- * Initialize a new `Dot` matrix test reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function Dot(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , width = Base.window.width * .75 | 0
-    , n = -1;
-
-  runner.on('start', function(){
-    process.stdout.write('\n');
-  });
-
-  runner.on('pending', function(test){
-    if (++n % width == 0) process.stdout.write('\n  ');
-    process.stdout.write(color('pending', Base.symbols.dot));
-  });
-
-  runner.on('pass', function(test){
-    if (++n % width == 0) process.stdout.write('\n  ');
-    if ('slow' == test.speed) {
-      process.stdout.write(color('bright yellow', Base.symbols.dot));
-    } else {
-      process.stdout.write(color(test.speed, Base.symbols.dot));
-    }
-  });
-
-  runner.on('fail', function(test, err){
-    if (++n % width == 0) process.stdout.write('\n  ');
-    process.stdout.write(color('fail', Base.symbols.dot));
-  });
-
-  runner.on('end', function(){
-    console.log();
-    self.epilogue();
-  });
-}
-
-/**
- * Inherit from `Base.prototype`.
- */
-
-function F(){};
-F.prototype = Base.prototype;
-Dot.prototype = new F;
-Dot.prototype.constructor = Dot;
-
-
-}); // module: reporters/dot.js
-
-require.register("reporters/html-cov.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var JSONCov = require('./json-cov')
-  , fs = require('browser/fs');
-
-/**
- * Expose `HTMLCov`.
- */
-
-exports = module.exports = HTMLCov;
-
-/**
- * Initialize a new `JsCoverage` reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function HTMLCov(runner) {
-  var jade = require('jade')
-    , file = __dirname + '/templates/coverage.jade'
-    , str = fs.readFileSync(file, 'utf8')
-    , fn = jade.compile(str, { filename: file })
-    , self = this;
-
-  JSONCov.call(this, runner, false);
-
-  runner.on('end', function(){
-    process.stdout.write(fn({
-        cov: self.cov
-      , coverageClass: coverageClass
-    }));
-  });
-}
-
-/**
- * Return coverage class for `n`.
- *
- * @return {String}
- * @api private
- */
-
-function coverageClass(n) {
-  if (n >= 75) return 'high';
-  if (n >= 50) return 'medium';
-  if (n >= 25) return 'low';
-  return 'terrible';
-}
-
-}); // module: reporters/html-cov.js
-
-require.register("reporters/html.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , utils = require('../utils')
-  , Progress = require('../browser/progress')
-  , escape = utils.escape;
-
-/**
- * Save timer references to avoid Sinon interfering (see GH-237).
- */
-
-var Date = global.Date
-  , setTimeout = global.setTimeout
-  , setInterval = global.setInterval
-  , clearTimeout = global.clearTimeout
-  , clearInterval = global.clearInterval;
-
-/**
- * Expose `HTML`.
- */
-
-exports = module.exports = HTML;
-
-/**
- * Stats template.
- */
-
-var statsTemplate = '<ul id="mocha-stats">'
-  + '<li class="progress"><canvas width="40" height="40"></canvas></li>'
-  + '<li class="passes"><a href="#">passes:</a> <em>0</em></li>'
-  + '<li class="failures"><a href="#">failures:</a> <em>0</em></li>'
-  + '<li class="duration">duration: <em>0</em>s</li>'
-  + '</ul>';
-
-/**
- * Initialize a new `HTML` reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function HTML(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , total = runner.total
-    , stat = fragment(statsTemplate)
-    , items = stat.getElementsByTagName('li')
-    , passes = items[1].getElementsByTagName('em')[0]
-    , passesLink = items[1].getElementsByTagName('a')[0]
-    , failures = items[2].getElementsByTagName('em')[0]
-    , failuresLink = items[2].getElementsByTagName('a')[0]
-    , duration = items[3].getElementsByTagName('em')[0]
-    , canvas = stat.getElementsByTagName('canvas')[0]
-    , report = fragment('<ul id="mocha-report"></ul>')
-    , stack = [report]
-    , progress
-    , ctx
-    , root = document.getElementById('mocha');
-
-  if (canvas.getContext) {
-    var ratio = window.devicePixelRatio || 1;
-    canvas.style.width = canvas.width;
-    canvas.style.height = canvas.height;
-    canvas.width *= ratio;
-    canvas.height *= ratio;
-    ctx = canvas.getContext('2d');
-    ctx.scale(ratio, ratio);
-    progress = new Progress;
-  }
-
-  if (!root) return error('#mocha div missing, add it to your document');
-
-  // pass toggle
-  on(passesLink, 'click', function(){
-    unhide();
-    var name = /pass/.test(report.className) ? '' : ' pass';
-    report.className = report.className.replace(/fail|pass/g, '') + name;
-    if (report.className.trim()) hideSuitesWithout('test pass');
-  });
-
-  // failure toggle
-  on(failuresLink, 'click', function(){
-    unhide();
-    var name = /fail/.test(report.className) ? '' : ' fail';
-    report.className = report.className.replace(/fail|pass/g, '') + name;
-    if (report.className.trim()) hideSuitesWithout('test fail');
-  });
-
-  root.appendChild(stat);
-  root.appendChild(report);
-
-  if (progress) progress.size(40);
-
-  runner.on('suite', function(suite){
-    if (suite.root) return;
-
-    // suite
-    var url = self.suiteURL(suite);
-    var el = fragment('<li class="suite"><h1><a href="%s">%s</a></h1></li>', url, escape(suite.title));
-
-    // container
-    stack[0].appendChild(el);
-    stack.unshift(document.createElement('ul'));
-    el.appendChild(stack[0]);
-  });
-
-  runner.on('suite end', function(suite){
-    if (suite.root) return;
-    stack.shift();
-  });
-
-  runner.on('fail', function(test, err){
-    if ('hook' == test.type) runner.emit('test end', test);
-  });
-
-  runner.on('test end', function(test){
-    // TODO: add to stats
-    var percent = stats.tests / this.total * 100 | 0;
-    if (progress) progress.update(percent).draw(ctx);
-
-    // update stats
-    var ms = new Date - stats.start;
-    text(passes, stats.passes);
-    text(failures, stats.failures);
-    text(duration, (ms / 1000).toFixed(2));
-
-    // test
-    if ('passed' == test.state) {
-      var url = self.testURL(test);
-      var el = fragment('<li class="test pass %e"><h2>%e<span class="duration">%ems</span> <a href="%s" class="replay">‣</a></h2></li>', test.speed, test.title, test.duration, url);
-    } else if (test.pending) {
-      var el = fragment('<li class="test pass pending"><h2>%e</h2></li>', test.title);
-    } else {
-      var el = fragment('<li class="test fail"><h2>%e <a href="%e" class="replay">‣</a></h2></li>', test.title, self.testURL(test));
-      var str = test.err.stack || test.err.toString();
-
-      // FF / Opera do not add the message
-      if (!~str.indexOf(test.err.message)) {
-        str = test.err.message + '\n' + str;
-      }
-
-      // <=IE7 stringifies to [Object Error]. Since it can be overloaded, we
-      // check for the result of the stringifying.
-      if ('[object Error]' == str) str = test.err.message;
-
-      // Safari doesn't give you a stack. Let's at least provide a source line.
-      if (!test.err.stack && test.err.sourceURL && test.err.line !== undefined) {
-        str += "\n(" + test.err.sourceURL + ":" + test.err.line + ")";
-      }
-
-      el.appendChild(fragment('<pre class="error">%e</pre>', str));
-    }
-
-    // toggle code
-    // TODO: defer
-    if (!test.pending) {
-      var h2 = el.getElementsByTagName('h2')[0];
-
-      on(h2, 'click', function(){
-        pre.style.display = 'none' == pre.style.display
-          ? 'block'
-          : 'none';
-      });
-
-      var pre = fragment('<pre><code>%e</code></pre>', utils.clean(test.fn.toString()));
-      el.appendChild(pre);
-      pre.style.display = 'none';
-    }
-
-    // Don't call .appendChild if #mocha-report was already .shift()'ed off the stack.
-    if (stack[0]) stack[0].appendChild(el);
-  });
-}
-
-/**
- * Makes a URL, preserving querystring ("search") parameters.
- * @param {string} s
- * @returns {string} your new URL
- */
-var makeUrl = function makeUrl(s) {
-  var search = window.location.search;
-
-  // Remove previous grep query parameter if present
-  if (search) {
-    search = search.replace(/[?&]grep=[^&\s]*/g, '').replace(/^&/, '?');
-  }
-
-  return window.location.pathname + (search ? search + '&' : '?' ) + 'grep=' + encodeURIComponent(s);
-};
-
-/**
- * Provide suite URL
- *
- * @param {Object} [suite]
- */
-HTML.prototype.suiteURL = function(suite){
-  return makeUrl(suite.fullTitle());
-};
-
-/**
- * Provide test URL
- *
- * @param {Object} [test]
- */
-
-HTML.prototype.testURL = function(test){
-  return makeUrl(test.fullTitle());
-};
-
-/**
- * Display error `msg`.
- */
-
-function error(msg) {
-  document.body.appendChild(fragment('<div id="mocha-error">%s</div>', msg));
-}
-
-/**
- * Return a DOM fragment from `html`.
- */
-
-function fragment(html) {
-  var args = arguments
-    , div = document.createElement('div')
-    , i = 1;
-
-  div.innerHTML = html.replace(/%([se])/g, function(_, type){
-    switch (type) {
-      case 's': return String(args[i++]);
-      case 'e': return escape(args[i++]);
-    }
-  });
-
-  return div.firstChild;
-}
-
-/**
- * Check for suites that do not have elements
- * with `classname`, and hide them.
- */
-
-function hideSuitesWithout(classname) {
-  var suites = document.getElementsByClassName('suite');
-  for (var i = 0; i < suites.length; i++) {
-    var els = suites[i].getElementsByClassName(classname);
-    if (0 == els.length) suites[i].className += ' hidden';
-  }
-}
-
-/**
- * Unhide .hidden suites.
- */
-
-function unhide() {
-  var els = document.getElementsByClassName('suite hidden');
-  for (var i = 0; i < els.length; ++i) {
-    els[i].className = els[i].className.replace('suite hidden', 'suite');
-  }
-}
-
-/**
- * Set `el` text to `str`.
- */
-
-function text(el, str) {
-  if (el.textContent) {
-    el.textContent = str;
-  } else {
-    el.innerText = str;
-  }
-}
-
-/**
- * Listen on `event` with callback `fn`.
- */
-
-function on(el, event, fn) {
-  if (el.addEventListener) {
-    el.addEventListener(event, fn, false);
-  } else {
-    el.attachEvent('on' + event, fn);
-  }
-}
-
-}); // module: reporters/html.js
-
-require.register("reporters/index.js", function(module, exports, require){
-exports.Base = require('./base');
-exports.Dot = require('./dot');
-exports.Doc = require('./doc');
-exports.TAP = require('./tap');
-exports.JSON = require('./json');
-exports.HTML = require('./html');
-exports.List = require('./list');
-exports.Min = require('./min');
-exports.Spec = require('./spec');
-exports.Nyan = require('./nyan');
-exports.XUnit = require('./xunit');
-exports.Markdown = require('./markdown');
-exports.Progress = require('./progress');
-exports.Landing = require('./landing');
-exports.JSONCov = require('./json-cov');
-exports.HTMLCov = require('./html-cov');
-exports.JSONStream = require('./json-stream');
-
-}); // module: reporters/index.js
-
-require.register("reporters/json-cov.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base');
-
-/**
- * Expose `JSONCov`.
- */
-
-exports = module.exports = JSONCov;
-
-/**
- * Initialize a new `JsCoverage` reporter.
- *
- * @param {Runner} runner
- * @param {Boolean} output
- * @api public
- */
-
-function JSONCov(runner, output) {
-  var self = this
-    , output = 1 == arguments.length ? true : output;
-
-  Base.call(this, runner);
-
-  var tests = []
-    , failures = []
-    , passes = [];
-
-  runner.on('test end', function(test){
-    tests.push(test);
-  });
-
-  runner.on('pass', function(test){
-    passes.push(test);
-  });
-
-  runner.on('fail', function(test){
-    failures.push(test);
-  });
-
-  runner.on('end', function(){
-    var cov = global._$jscoverage || {};
-    var result = self.cov = map(cov);
-    result.stats = self.stats;
-    result.tests = tests.map(clean);
-    result.failures = failures.map(clean);
-    result.passes = passes.map(clean);
-    if (!output) return;
-    process.stdout.write(JSON.stringify(result, null, 2 ));
-  });
-}
-
-/**
- * Map jscoverage data to a JSON structure
- * suitable for reporting.
- *
- * @param {Object} cov
- * @return {Object}
- * @api private
- */
-
-function map(cov) {
-  var ret = {
-      instrumentation: 'node-jscoverage'
-    , sloc: 0
-    , hits: 0
-    , misses: 0
-    , coverage: 0
-    , files: []
-  };
-
-  for (var filename in cov) {
-    var data = coverage(filename, cov[filename]);
-    ret.files.push(data);
-    ret.hits += data.hits;
-    ret.misses += data.misses;
-    ret.sloc += data.sloc;
-  }
-
-  ret.files.sort(function(a, b) {
-    return a.filename.localeCompare(b.filename);
-  });
-
-  if (ret.sloc > 0) {
-    ret.coverage = (ret.hits / ret.sloc) * 100;
-  }
-
-  return ret;
-}
-
-/**
- * Map jscoverage data for a single source file
- * to a JSON structure suitable for reporting.
- *
- * @param {String} filename name of the source file
- * @param {Object} data jscoverage coverage data
- * @return {Object}
- * @api private
- */
-
-function coverage(filename, data) {
-  var ret = {
-    filename: filename,
-    coverage: 0,
-    hits: 0,
-    misses: 0,
-    sloc: 0,
-    source: {}
-  };
-
-  data.source.forEach(function(line, num){
-    num++;
-
-    if (data[num] === 0) {
-      ret.misses++;
-      ret.sloc++;
-    } else if (data[num] !== undefined) {
-      ret.hits++;
-      ret.sloc++;
-    }
-
-    ret.source[num] = {
-        source: line
-      , coverage: data[num] === undefined
-        ? ''
-        : data[num]
-    };
-  });
-
-  ret.coverage = ret.hits / ret.sloc * 100;
-
-  return ret;
-}
-
-/**
- * Return a plain-object representation of `test`
- * free of cyclic properties etc.
- *
- * @param {Object} test
- * @return {Object}
- * @api private
- */
-
-function clean(test) {
-  return {
-      title: test.title
-    , fullTitle: test.fullTitle()
-    , duration: test.duration
-  }
-}
-
-}); // module: reporters/json-cov.js
-
-require.register("reporters/json-stream.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , color = Base.color;
-
-/**
- * Expose `List`.
- */
-
-exports = module.exports = List;
-
-/**
- * Initialize a new `List` test reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function List(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , total = runner.total;
-
-  runner.on('start', function(){
-    console.log(JSON.stringify(['start', { total: total }]));
-  });
-
-  runner.on('pass', function(test){
-    console.log(JSON.stringify(['pass', clean(test)]));
-  });
-
-  runner.on('fail', function(test, err){
-    test = clean(test);
-    test.err = err.message;
-    console.log(JSON.stringify(['fail', test]));
-  });
-
-  runner.on('end', function(){
-    process.stdout.write(JSON.stringify(['end', self.stats]));
-  });
-}
-
-/**
- * Return a plain-object representation of `test`
- * free of cyclic properties etc.
- *
- * @param {Object} test
- * @return {Object}
- * @api private
- */
-
-function clean(test) {
-  return {
-      title: test.title
-    , fullTitle: test.fullTitle()
-    , duration: test.duration
-  }
-}
-
-}); // module: reporters/json-stream.js
-
-require.register("reporters/json.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , cursor = Base.cursor
-  , color = Base.color;
-
-/**
- * Expose `JSON`.
- */
-
-exports = module.exports = JSONReporter;
-
-/**
- * Initialize a new `JSON` reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function JSONReporter(runner) {
-  var self = this;
-  Base.call(this, runner);
-
-  var tests = []
-    , pending = []
-    , failures = []
-    , passes = [];
-
-  runner.on('test end', function(test){
-    tests.push(test);
-  });
-
-  runner.on('pass', function(test){
-    passes.push(test);
-  });
-
-  runner.on('fail', function(test){
-    failures.push(test);
-  });
-
-  runner.on('pending', function(test){
-    pending.push(test);
-  });
-
-  runner.on('end', function(){
-    var obj = {
-      stats: self.stats,
-      tests: tests.map(clean),
-      pending: pending.map(clean),
-      failures: failures.map(clean),
-      passes: passes.map(clean)
-    };
-
-    runner.testResults = obj;
-
-    process.stdout.write(JSON.stringify(obj, null, 2));
-  });
-}
-
-/**
- * Return a plain-object representation of `test`
- * free of cyclic properties etc.
- *
- * @param {Object} test
- * @return {Object}
- * @api private
- */
-
-function clean(test) {
-  return {
-    title: test.title,
-    fullTitle: test.fullTitle(),
-    duration: test.duration,
-    err: errorJSON(test.err || {})
-  }
-}
-
-/**
- * Transform `error` into a JSON object.
- * @param {Error} err
- * @return {Object}
- */
-
-function errorJSON(err) {
-  var res = {};
-  Object.getOwnPropertyNames(err).forEach(function(key) {
-    res[key] = err[key];
-  }, err);
-  return res;
-}
-
-}); // module: reporters/json.js
-
-require.register("reporters/landing.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , cursor = Base.cursor
-  , color = Base.color;
-
-/**
- * Expose `Landing`.
- */
-
-exports = module.exports = Landing;
-
-/**
- * Airplane color.
- */
-
-Base.colors.plane = 0;
-
-/**
- * Airplane crash color.
- */
-
-Base.colors['plane crash'] = 31;
-
-/**
- * Runway color.
- */
-
-Base.colors.runway = 90;
-
-/**
- * Initialize a new `Landing` reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function Landing(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , width = Base.window.width * .75 | 0
-    , total = runner.total
-    , stream = process.stdout
-    , plane = color('plane', '✈')
-    , crashed = -1
-    , n = 0;
-
-  function runway() {
-    var buf = Array(width).join('-');
-    return '  ' + color('runway', buf);
-  }
-
-  runner.on('start', function(){
-    stream.write('\n\n\n  ');
-    cursor.hide();
-  });
-
-  runner.on('test end', function(test){
-    // check if the plane crashed
-    var col = -1 == crashed
-      ? width * ++n / total | 0
-      : crashed;
-
-    // show the crash
-    if ('failed' == test.state) {
-      plane = color('plane crash', '✈');
-      crashed = col;
-    }
-
-    // render landing strip
-    stream.write('\u001b['+(width+1)+'D\u001b[2A');
-    stream.write(runway());
-    stream.write('\n  ');
-    stream.write(color('runway', Array(col).join('⋅')));
-    stream.write(plane)
-    stream.write(color('runway', Array(width - col).join('⋅') + '\n'));
-    stream.write(runway());
-    stream.write('\u001b[0m');
-  });
-
-  runner.on('end', function(){
-    cursor.show();
-    console.log();
-    self.epilogue();
-  });
-}
-
-/**
- * Inherit from `Base.prototype`.
- */
-
-function F(){};
-F.prototype = Base.prototype;
-Landing.prototype = new F;
-Landing.prototype.constructor = Landing;
-
-
-}); // module: reporters/landing.js
-
-require.register("reporters/list.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , cursor = Base.cursor
-  , color = Base.color;
-
-/**
- * Expose `List`.
- */
-
-exports = module.exports = List;
-
-/**
- * Initialize a new `List` test reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function List(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , n = 0;
-
-  runner.on('start', function(){
-    console.log();
-  });
-
-  runner.on('test', function(test){
-    process.stdout.write(color('pass', '    ' + test.fullTitle() + ': '));
-  });
-
-  runner.on('pending', function(test){
-    var fmt = color('checkmark', '  -')
-      + color('pending', ' %s');
-    console.log(fmt, test.fullTitle());
-  });
-
-  runner.on('pass', function(test){
-    var fmt = color('checkmark', '  '+Base.symbols.dot)
-      + color('pass', ' %s: ')
-      + color(test.speed, '%dms');
-    cursor.CR();
-    console.log(fmt, test.fullTitle(), test.duration);
-  });
-
-  runner.on('fail', function(test, err){
-    cursor.CR();
-    console.log(color('fail', '  %d) %s'), ++n, test.fullTitle());
-  });
-
-  runner.on('end', self.epilogue.bind(self));
-}
-
-/**
- * Inherit from `Base.prototype`.
- */
-
-function F(){};
-F.prototype = Base.prototype;
-List.prototype = new F;
-List.prototype.constructor = List;
-
-
-}); // module: reporters/list.js
-
-require.register("reporters/markdown.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , utils = require('../utils');
-
-/**
- * Constants
- */
-
-var SUITE_PREFIX = '$';
-
-/**
- * Expose `Markdown`.
- */
-
-exports = module.exports = Markdown;
-
-/**
- * Initialize a new `Markdown` reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function Markdown(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , level = 0
-    , buf = '';
-
-  function title(str) {
-    return Array(level).join('#') + ' ' + str;
-  }
-
-  function indent() {
-    return Array(level).join('  ');
-  }
-
-  function mapTOC(suite, obj) {
-    var ret = obj,
-        key = SUITE_PREFIX + suite.title;
-    obj = obj[key] = obj[key] || { suite: suite };
-    suite.suites.forEach(function(suite){
-      mapTOC(suite, obj);
-    });
-    return ret;
-  }
-
-  function stringifyTOC(obj, level) {
-    ++level;
-    var buf = '';
-    var link;
-    for (var key in obj) {
-      if ('suite' == key) continue;
-      if (key !== SUITE_PREFIX) {
-        link = ' - [' + key.substring(1) + ']';
-        link += '(#' + utils.slug(obj[key].suite.fullTitle()) + ')\n';
-        buf += Array(level).join('  ') + link;
-      }
-      buf += stringifyTOC(obj[key], level);
-    }
-    return buf;
-  }
-
-  function generateTOC(suite) {
-    var obj = mapTOC(suite, {});
-    return stringifyTOC(obj, 0);
-  }
-
-  generateTOC(runner.suite);
-
-  runner.on('suite', function(suite){
-    ++level;
-    var slug = utils.slug(suite.fullTitle());
-    buf += '<a name="' + slug + '"></a>' + '\n';
-    buf += title(suite.title) + '\n';
-  });
-
-  runner.on('suite end', function(suite){
-    --level;
-  });
-
-  runner.on('pass', function(test){
-    var code = utils.clean(test.fn.toString());
-    buf += test.title + '.\n';
-    buf += '\n```js\n';
-    buf += code + '\n';
-    buf += '```\n\n';
-  });
-
-  runner.on('end', function(){
-    process.stdout.write('# TOC\n');
-    process.stdout.write(generateTOC(runner.suite));
-    process.stdout.write(buf);
-  });
-}
-
-}); // module: reporters/markdown.js
-
-require.register("reporters/min.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base');
-
-/**
- * Expose `Min`.
- */
-
-exports = module.exports = Min;
-
-/**
- * Initialize a new `Min` minimal test reporter (best used with --watch).
- *
- * @param {Runner} runner
- * @api public
- */
-
-function Min(runner) {
-  Base.call(this, runner);
-
-  runner.on('start', function(){
-    // clear screen
-    process.stdout.write('\u001b[2J');
-    // set cursor position
-    process.stdout.write('\u001b[1;3H');
-  });
-
-  runner.on('end', this.epilogue.bind(this));
-}
-
-/**
- * Inherit from `Base.prototype`.
- */
-
-function F(){};
-F.prototype = Base.prototype;
-Min.prototype = new F;
-Min.prototype.constructor = Min;
-
-
-}); // module: reporters/min.js
-
-require.register("reporters/nyan.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base');
-
-/**
- * Expose `Dot`.
- */
-
-exports = module.exports = NyanCat;
-
-/**
- * Initialize a new `Dot` matrix test reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function NyanCat(runner) {
-  Base.call(this, runner);
-  var self = this
-    , stats = this.stats
-    , width = Base.window.width * .75 | 0
-    , rainbowColors = this.rainbowColors = self.generateColors()
-    , colorIndex = this.colorIndex = 0
-    , numerOfLines = this.numberOfLines = 4
-    , trajectories = this.trajectories = [[], [], [], []]
-    , nyanCatWidth = this.nyanCatWidth = 11
-    , trajectoryWidthMax = this.trajectoryWidthMax = (width - nyanCatWidth)
-    , scoreboardWidth = this.scoreboardWidth = 5
-    , tick = this.tick = 0
-    , n = 0;
-
-  runner.on('start', function(){
-    Base.cursor.hide();
-    self.draw();
-  });
-
-  runner.on('pending', function(test){
-    self.draw();
-  });
-
-  runner.on('pass', function(test){
-    self.draw();
-  });
-
-  runner.on('fail', function(test, err){
-    self.draw();
-  });
-
-  runner.on('end', function(){
-    Base.cursor.show();
-    for (var i = 0; i < self.numberOfLines; i++) write('\n');
-    self.epilogue();
-  });
-}
-
-/**
- * Draw the nyan cat
- *
- * @api private
- */
-
-NyanCat.prototype.draw = function(){
-  this.appendRainbow();
-  this.drawScoreboard();
-  this.drawRainbow();
-  this.drawNyanCat();
-  this.tick = !this.tick;
-};
-
-/**
- * Draw the "scoreboard" showing the number
- * of passes, failures and pending tests.
- *
- * @api private
- */
-
-NyanCat.prototype.drawScoreboard = function(){
-  var stats = this.stats;
-
-  function draw(type, n) {
-    write(' ');
-    write(Base.color(type, n));
-    write('\n');
-  }
-
-  draw('green', stats.passes);
-  draw('fail', stats.failures);
-  draw('pending', stats.pending);
-  write('\n');
-
-  this.cursorUp(this.numberOfLines);
-};
-
-/**
- * Append the rainbow.
- *
- * @api private
- */
-
-NyanCat.prototype.appendRainbow = function(){
-  var segment = this.tick ? '_' : '-';
-  var rainbowified = this.rainbowify(segment);
-
-  for (var index = 0; index < this.numberOfLines; index++) {
-    var trajectory = this.trajectories[index];
-    if (trajectory.length >= this.trajectoryWidthMax) trajectory.shift();
-    trajectory.push(rainbowified);
-  }
-};
-
-/**
- * Draw the rainbow.
- *
- * @api private
- */
-
-NyanCat.prototype.drawRainbow = function(){
-  var self = this;
-
-  this.trajectories.forEach(function(line, index) {
-    write('\u001b[' + self.scoreboardWidth + 'C');
-    write(line.join(''));
-    write('\n');
-  });
-
-  this.cursorUp(this.numberOfLines);
-};
-
-/**
- * Draw the nyan cat
- *
- * @api private
- */
-
-NyanCat.prototype.drawNyanCat = function() {
-  var self = this;
-  var startWidth = this.scoreboardWidth + this.trajectories[0].length;
-  var dist = '\u001b[' + startWidth + 'C';
-  var padding = '';
-
-  write(dist);
-  write('_,------,');
-  write('\n');
-
-  write(dist);
-  padding = self.tick ? '  ' : '   ';
-  write('_|' + padding + '/\\_/\\ ');
-  write('\n');
-
-  write(dist);
-  padding = self.tick ? '_' : '__';
-  var tail = self.tick ? '~' : '^';
-  var face;
-  write(tail + '|' + padding + this.face() + ' ');
-  write('\n');
-
-  write(dist);
-  padding = self.tick ? ' ' : '  ';
-  write(padding + '""  "" ');
-  write('\n');
-
-  this.cursorUp(this.numberOfLines);
-};
-
-/**
- * Draw nyan cat face.
- *
- * @return {String}
- * @api private
- */
-
-NyanCat.prototype.face = function() {
-  var stats = this.stats;
-  if (stats.failures) {
-    return '( x .x)';
-  } else if (stats.pending) {
-    return '( o .o)';
-  } else if(stats.passes) {
-    return '( ^ .^)';
-  } else {
-    return '( - .-)';
-  }
-};
-
-/**
- * Move cursor up `n`.
- *
- * @param {Number} n
- * @api private
- */
-
-NyanCat.prototype.cursorUp = function(n) {
-  write('\u001b[' + n + 'A');
-};
-
-/**
- * Move cursor down `n`.
- *
- * @param {Number} n
- * @api private
- */
-
-NyanCat.prototype.cursorDown = function(n) {
-  write('\u001b[' + n + 'B');
-};
-
-/**
- * Generate rainbow colors.
- *
- * @return {Array}
- * @api private
- */
-
-NyanCat.prototype.generateColors = function(){
-  var colors = [];
-
-  for (var i = 0; i < (6 * 7); i++) {
-    var pi3 = Math.floor(Math.PI / 3);
-    var n = (i * (1.0 / 6));
-    var r = Math.floor(3 * Math.sin(n) + 3);
-    var g = Math.floor(3 * Math.sin(n + 2 * pi3) + 3);
-    var b = Math.floor(3 * Math.sin(n + 4 * pi3) + 3);
-    colors.push(36 * r + 6 * g + b + 16);
-  }
-
-  return colors;
-};
-
-/**
- * Apply rainbow to the given `str`.
- *
- * @param {String} str
- * @return {String}
- * @api private
- */
-
-NyanCat.prototype.rainbowify = function(str){
-  if (!Base.useColors)
-    return str;
-  var color = this.rainbowColors[this.colorIndex % this.rainbowColors.length];
-  this.colorIndex += 1;
-  return '\u001b[38;5;' + color + 'm' + str + '\u001b[0m';
-};
-
-/**
- * Stdout helper.
- */
-
-function write(string) {
-  process.stdout.write(string);
-}
-
-/**
- * Inherit from `Base.prototype`.
- */
-
-function F(){};
-F.prototype = Base.prototype;
-NyanCat.prototype = new F;
-NyanCat.prototype.constructor = NyanCat;
-
-
-}); // module: reporters/nyan.js
-
-require.register("reporters/progress.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , cursor = Base.cursor
-  , color = Base.color;
-
-/**
- * Expose `Progress`.
- */
-
-exports = module.exports = Progress;
-
-/**
- * General progress bar color.
- */
-
-Base.colors.progress = 90;
-
-/**
- * Initialize a new `Progress` bar test reporter.
- *
- * @param {Runner} runner
- * @param {Object} options
- * @api public
- */
-
-function Progress(runner, options) {
-  Base.call(this, runner);
-
-  var self = this
-    , options = options || {}
-    , stats = this.stats
-    , width = Base.window.width * .50 | 0
-    , total = runner.total
-    , complete = 0
-    , max = Math.max
-    , lastN = -1;
-
-  // default chars
-  options.open = options.open || '[';
-  options.complete = options.complete || '▬';
-  options.incomplete = options.incomplete || Base.symbols.dot;
-  options.close = options.close || ']';
-  options.verbose = false;
-
-  // tests started
-  runner.on('start', function(){
-    console.log();
-    cursor.hide();
-  });
-
-  // tests complete
-  runner.on('test end', function(){
-    complete++;
-    var incomplete = total - complete
-      , percent = complete / total
-      , n = width * percent | 0
-      , i = width - n;
-
-    if (lastN === n && !options.verbose) {
-      // Don't re-render the line if it hasn't changed
-      return;
-    }
-    lastN = n;
-
-    cursor.CR();
-    process.stdout.write('\u001b[J');
-    process.stdout.write(color('progress', '  ' + options.open));
-    process.stdout.write(Array(n).join(options.complete));
-    process.stdout.write(Array(i).join(options.incomplete));
-    process.stdout.write(color('progress', options.close));
-    if (options.verbose) {
-      process.stdout.write(color('progress', ' ' + complete + ' of ' + total));
-    }
-  });
-
-  // tests are complete, output some stats
-  // and the failures if any
-  runner.on('end', function(){
-    cursor.show();
-    console.log();
-    self.epilogue();
-  });
-}
-
-/**
- * Inherit from `Base.prototype`.
- */
-
-function F(){};
-F.prototype = Base.prototype;
-Progress.prototype = new F;
-Progress.prototype.constructor = Progress;
-
-
-}); // module: reporters/progress.js
-
-require.register("reporters/spec.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , cursor = Base.cursor
-  , color = Base.color;
-
-/**
- * Expose `Spec`.
- */
-
-exports = module.exports = Spec;
-
-/**
- * Initialize a new `Spec` test reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function Spec(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , indents = 0
-    , n = 0;
-
-  function indent() {
-    return Array(indents).join('  ')
-  }
-
-  runner.on('start', function(){
-    console.log();
-  });
-
-  runner.on('suite', function(suite){
-    ++indents;
-    console.log(color('suite', '%s%s'), indent(), suite.title);
-  });
-
-  runner.on('suite end', function(suite){
-    --indents;
-    if (1 == indents) console.log();
-  });
-
-  runner.on('pending', function(test){
-    var fmt = indent() + color('pending', '  - %s');
-    console.log(fmt, test.title);
-  });
-
-  runner.on('pass', function(test){
-    if ('fast' == test.speed) {
-      var fmt = indent()
-        + color('checkmark', '  ' + Base.symbols.ok)
-        + color('pass', ' %s');
-      cursor.CR();
-      console.log(fmt, test.title);
-    } else {
-      var fmt = indent()
-        + color('checkmark', '  ' + Base.symbols.ok)
-        + color('pass', ' %s')
-        + color(test.speed, ' (%dms)');
-      cursor.CR();
-      console.log(fmt, test.title, test.duration);
-    }
-  });
-
-  runner.on('fail', function(test, err){
-    cursor.CR();
-    console.log(indent() + color('fail', '  %d) %s'), ++n, test.title);
-  });
-
-  runner.on('end', self.epilogue.bind(self));
-}
-
-/**
- * Inherit from `Base.prototype`.
- */
-
-function F(){};
-F.prototype = Base.prototype;
-Spec.prototype = new F;
-Spec.prototype.constructor = Spec;
-
-
-}); // module: reporters/spec.js
-
-require.register("reporters/tap.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , cursor = Base.cursor
-  , color = Base.color;
-
-/**
- * Expose `TAP`.
- */
-
-exports = module.exports = TAP;
-
-/**
- * Initialize a new `TAP` reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function TAP(runner) {
-  Base.call(this, runner);
-
-  var self = this
-    , stats = this.stats
-    , n = 1
-    , passes = 0
-    , failures = 0;
-
-  runner.on('start', function(){
-    var total = runner.grepTotal(runner.suite);
-    console.log('%d..%d', 1, total);
-  });
-
-  runner.on('test end', function(){
-    ++n;
-  });
-
-  runner.on('pending', function(test){
-    console.log('ok %d %s # SKIP -', n, title(test));
-  });
-
-  runner.on('pass', function(test){
-    passes++;
-    console.log('ok %d %s', n, title(test));
-  });
-
-  runner.on('fail', function(test, err){
-    failures++;
-    console.log('not ok %d %s', n, title(test));
-    if (err.stack) console.log(err.stack.replace(/^/gm, '  '));
-  });
-
-  runner.on('end', function(){
-    console.log('# tests ' + (passes + failures));
-    console.log('# pass ' + passes);
-    console.log('# fail ' + failures);
-  });
-}
-
-/**
- * Return a TAP-safe title of `test`
- *
- * @param {Object} test
- * @return {String}
- * @api private
- */
-
-function title(test) {
-  return test.fullTitle().replace(/#/g, '');
-}
-
-}); // module: reporters/tap.js
-
-require.register("reporters/xunit.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Base = require('./base')
-  , utils = require('../utils')
-  , fs = require('browser/fs')
-  , escape = utils.escape;
-
-/**
- * Save timer references to avoid Sinon interfering (see GH-237).
- */
-
-var Date = global.Date
-  , setTimeout = global.setTimeout
-  , setInterval = global.setInterval
-  , clearTimeout = global.clearTimeout
-  , clearInterval = global.clearInterval;
-
-/**
- * Expose `XUnit`.
- */
-
-exports = module.exports = XUnit;
-
-/**
- * Initialize a new `XUnit` reporter.
- *
- * @param {Runner} runner
- * @api public
- */
-
-function XUnit(runner, options) {
-  Base.call(this, runner);
-  var stats = this.stats
-    , tests = []
-    , self = this;
-
-  if (options.reporterOptions && options.reporterOptions.output) {
-      if (! fs.createWriteStream) {
-          throw new Error('file output not supported in browser');
-      }
-      self.fileStream = fs.createWriteStream(options.reporterOptions.output);
-  }
-
-  runner.on('pending', function(test){
-    tests.push(test);
-  });
-
-  runner.on('pass', function(test){
-    tests.push(test);
-  });
-
-  runner.on('fail', function(test){
-    tests.push(test);
-  });
-
-  runner.on('end', function(){
-    self.write(tag('testsuite', {
-        name: 'Mocha Tests'
-      , tests: stats.tests
-      , failures: stats.failures
-      , errors: stats.failures
-      , skipped: stats.tests - stats.failures - stats.passes
-      , timestamp: (new Date).toUTCString()
-      , time: (stats.duration / 1000) || 0
-    }, false));
-
-    tests.forEach(function(t) { self.test(t); });
-    self.write('</testsuite>');
-  });
-}
-
-/**
- * Override done to close the stream (if it's a file).
- */
-XUnit.prototype.done = function(failures, fn) {
-    if (this.fileStream) {
-        this.fileStream.end(function() {
-            fn(failures);
-        });
-    } else {
-        fn(failures);
-    }
-};
-
-/**
- * Inherit from `Base.prototype`.
- */
-
-function F(){};
-F.prototype = Base.prototype;
-XUnit.prototype = new F;
-XUnit.prototype.constructor = XUnit;
-
-
-/**
- * Write out the given line
- */
-XUnit.prototype.write = function(line) {
-    if (this.fileStream) {
-        this.fileStream.write(line + '\n');
-    } else {
-        console.log(line);
-    }
-};
-
-/**
- * Output tag for the given `test.`
- */
-
-XUnit.prototype.test = function(test, ostream) {
-  var attrs = {
-      classname: test.parent.fullTitle()
-    , name: test.title
-    , time: (test.duration / 1000) || 0
-  };
-
-  if ('failed' == test.state) {
-    var err = test.err;
-    this.write(tag('testcase', attrs, false, tag('failure', {}, false, cdata(escape(err.message) + "\n" + err.stack))));
-  } else if (test.pending) {
-    this.write(tag('testcase', attrs, false, tag('skipped', {}, true)));
-  } else {
-    this.write(tag('testcase', attrs, true) );
-  }
-};
-
-/**
- * HTML tag helper.
- */
-
-function tag(name, attrs, close, content) {
-  var end = close ? '/>' : '>'
-    , pairs = []
-    , tag;
-
-  for (var key in attrs) {
-    pairs.push(key + '="' + escape(attrs[key]) + '"');
-  }
-
-  tag = '<' + name + (pairs.length ? ' ' + pairs.join(' ') : '') + end;
-  if (content) tag += content + '</' + name + end;
-  return tag;
-}
-
-/**
- * Return cdata escaped CDATA `str`.
- */
-
-function cdata(str) {
-  return '<![CDATA[' + escape(str) + ']]>';
-}
-
-}); // module: reporters/xunit.js
-
-require.register("runnable.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var EventEmitter = require('browser/events').EventEmitter
-  , debug = require('browser/debug')('mocha:runnable')
-  , Pending = require('./pending')
-  , milliseconds = require('./ms')
-  , utils = require('./utils');
-
-/**
- * Save timer references to avoid Sinon interfering (see GH-237).
- */
-
-var Date = global.Date
-  , setTimeout = global.setTimeout
-  , setInterval = global.setInterval
-  , clearTimeout = global.clearTimeout
-  , clearInterval = global.clearInterval;
-
-/**
- * Object#toString().
- */
-
-var toString = Object.prototype.toString;
-
-/**
- * Expose `Runnable`.
- */
-
-module.exports = Runnable;
-
-/**
- * Initialize a new `Runnable` with the given `title` and callback `fn`.
- *
- * @param {String} title
- * @param {Function} fn
- * @api private
- */
-
-function Runnable(title, fn) {
-  this.title = title;
-  this.fn = fn;
-  this.async = fn && fn.length;
-  this.sync = ! this.async;
-  this._timeout = 2000;
-  this._slow = 75;
-  this._enableTimeouts = true;
-  this.timedOut = false;
-  this._trace = new Error('done() called multiple times')
-}
-
-/**
- * Inherit from `EventEmitter.prototype`.
- */
-
-function F(){};
-F.prototype = EventEmitter.prototype;
-Runnable.prototype = new F;
-Runnable.prototype.constructor = Runnable;
-
-
-/**
- * Set & get timeout `ms`.
- *
- * @param {Number|String} ms
- * @return {Runnable|Number} ms or self
- * @api private
- */
-
-Runnable.prototype.timeout = function(ms){
-  if (0 == arguments.length) return this._timeout;
-  if (ms === 0) this._enableTimeouts = false;
-  if ('string' == typeof ms) ms = milliseconds(ms);
-  debug('timeout %d', ms);
-  this._timeout = ms;
-  if (this.timer) this.resetTimeout();
-  return this;
-};
-
-/**
- * Set & get slow `ms`.
- *
- * @param {Number|String} ms
- * @return {Runnable|Number} ms or self
- * @api private
- */
-
-Runnable.prototype.slow = function(ms){
-  if (0 === arguments.length) return this._slow;
-  if ('string' == typeof ms) ms = milliseconds(ms);
-  debug('timeout %d', ms);
-  this._slow = ms;
-  return this;
-};
-
-/**
- * Set and & get timeout `enabled`.
- *
- * @param {Boolean} enabled
- * @return {Runnable|Boolean} enabled or self
- * @api private
- */
-
-Runnable.prototype.enableTimeouts = function(enabled){
-  if (arguments.length === 0) return this._enableTimeouts;
-  debug('enableTimeouts %s', enabled);
-  this._enableTimeouts = enabled;
-  return this;
-};
-
-/**
- * Halt and mark as pending.
- *
- * @api private
- */
-
-Runnable.prototype.skip = function(){
-    throw new Pending();
-};
-
-/**
- * Return the full title generated by recursively
- * concatenating the parent's full title.
- *
- * @return {String}
- * @api public
- */
-
-Runnable.prototype.fullTitle = function(){
-  return this.parent.fullTitle() + ' ' + this.title;
-};
-
-/**
- * Clear the timeout.
- *
- * @api private
- */
-
-Runnable.prototype.clearTimeout = function(){
-  clearTimeout(this.timer);
-};
-
-/**
- * Inspect the runnable void of private properties.
- *
- * @return {String}
- * @api private
- */
-
-Runnable.prototype.inspect = function(){
-  return JSON.stringify(this, function(key, val){
-    if ('_' == key[0]) return;
-    if ('parent' == key) return '#<Suite>';
-    if ('ctx' == key) return '#<Context>';
-    return val;
-  }, 2);
-};
-
-/**
- * Reset the timeout.
- *
- * @api private
- */
-
-Runnable.prototype.resetTimeout = function(){
-  var self = this;
-  var ms = this.timeout() || 1e9;
-
-  if (!this._enableTimeouts) return;
-  this.clearTimeout();
-  this.timer = setTimeout(function(){
-    if (!self._enableTimeouts) return;
-    self.callback(new Error('timeout of ' + ms + 'ms exceeded. Ensure the done() callback is being called in this test.'));
-    self.timedOut = true;
-  }, ms);
-};
-
-/**
- * Whitelist these globals for this test run
- *
- * @api private
- */
-Runnable.prototype.globals = function(arr){
-  var self = this;
-  this._allowedGlobals = arr;
-};
-
-/**
- * Run the test and invoke `fn(err)`.
- *
- * @param {Function} fn
- * @api private
- */
-
-Runnable.prototype.run = function(fn){
-  var self = this
-    , start = new Date
-    , ctx = this.ctx
-    , finished
-    , emitted;
-
-  // Some times the ctx exists but it is not runnable
-  if (ctx && ctx.runnable) ctx.runnable(this);
-
-  // called multiple times
-  function multiple(err) {
-    if (emitted) return;
-    emitted = true;
-    self.emit('error', err || new Error('done() called multiple times; stacktrace may be inaccurate'));
-  }
-
-  // finished
-  function done(err) {
-    var ms = self.timeout();
-    if (self.timedOut) return;
-    if (finished) return multiple(err || self._trace);
-
-    // Discard the resolution if this test has already failed asynchronously
-    if (self.state) return;
-
-    self.clearTimeout();
-    self.duration = new Date - start;
-    finished = true;
-    if (!err && self.duration > ms && self._enableTimeouts) err = new Error('timeout of ' + ms + 'ms exceeded. Ensure the done() callback is being called in this test.');
-    fn(err);
-  }
-
-  // for .resetTimeout()
-  this.callback = done;
-
-  // explicit async with `done` argument
-  if (this.async) {
-    this.resetTimeout();
-
-    try {
-      this.fn.call(ctx, function(err){
-        if (err instanceof Error || toString.call(err) === "[object Error]") return done(err);
-        if (null != err) {
-          if (Object.prototype.toString.call(err) === '[object Object]') {
-            return done(new Error('done() invoked with non-Error: ' + JSON.stringify(err)));
-          } else {
-            return done(new Error('done() invoked with non-Error: ' + err));
-          }
-        }
-        done();
-      });
-    } catch (err) {
-      done(utils.getError(err));
-    }
-    return;
-  }
-
-  if (this.asyncOnly) {
-    return done(new Error('--async-only option in use without declaring `done()`'));
-  }
-
-  // sync or promise-returning
-  try {
-    if (this.pending) {
-      done();
-    } else {
-      callFn(this.fn);
-    }
-  } catch (err) {
-    done(utils.getError(err));
-  }
-
-  function callFn(fn) {
-    var result = fn.call(ctx);
-    if (result && typeof result.then === 'function') {
-      self.resetTimeout();
-      result
-        .then(function() {
-          done()
-        },
-        function(reason) {
-          done(reason || new Error('Promise rejected with no or falsy reason'))
-        });
-    } else {
-      done();
-    }
-  }
-};
-
-}); // module: runnable.js
-
-require.register("runner.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var EventEmitter = require('browser/events').EventEmitter
-  , debug = require('browser/debug')('mocha:runner')
-  , Pending = require('./pending')
-  , Test = require('./test')
-  , utils = require('./utils')
-  , filter = utils.filter
-  , keys = utils.keys
-  , type = utils.type
-  , stringify = utils.stringify
-  , stackFilter = utils.stackTraceFilter();
-
-/**
- * Non-enumerable globals.
- */
-
-var globals = [
-  'setTimeout',
-  'clearTimeout',
-  'setInterval',
-  'clearInterval',
-  'XMLHttpRequest',
-  'Date',
-  'setImmediate',
-  'clearImmediate'
-];
-
-/**
- * Expose `Runner`.
- */
-
-module.exports = Runner;
-
-/**
- * Initialize a `Runner` for the given `suite`.
- *
- * Events:
- *
- *   - `start`  execution started
- *   - `end`  execution complete
- *   - `suite`  (suite) test suite execution started
- *   - `suite end`  (suite) all tests (and sub-suites) have finished
- *   - `test`  (test) test execution started
- *   - `test end`  (test) test completed
- *   - `hook`  (hook) hook execution started
- *   - `hook end`  (hook) hook complete
- *   - `pass`  (test) test passed
- *   - `fail`  (test, err) test failed
- *   - `pending`  (test) test pending
- *
- * @param {Suite} suite Root suite
- * @param {boolean} [delay] Whether or not to delay execution of root suite
- *   until ready.
- * @api public
- */
-
-function Runner(suite, delay) {
-  var self = this;
-  this._globals = [];
-  this._abort = false;
-  this._delay = delay;
-  this.suite = suite;
-  this.total = suite.total();
-  this.failures = 0;
-  this.on('test end', function(test){ self.checkGlobals(test); });
-  this.on('hook end', function(hook){ self.checkGlobals(hook); });
-  this.grep(/.*/);
-  this.globals(this.globalProps().concat(extraGlobals()));
-}
-
-/**
- * Wrapper for setImmediate, process.nextTick, or browser polyfill.
- *
- * @param {Function} fn
- * @api private
- */
-
-Runner.immediately = global.setImmediate || process.nextTick;
-
-/**
- * Inherit from `EventEmitter.prototype`.
- */
-
-function F(){};
-F.prototype = EventEmitter.prototype;
-Runner.prototype = new F;
-Runner.prototype.constructor = Runner;
-
-
-/**
- * Run tests with full titles matching `re`. Updates runner.total
- * with number of tests matched.
- *
- * @param {RegExp} re
- * @param {Boolean} invert
- * @return {Runner} for chaining
- * @api public
- */
-
-Runner.prototype.grep = function(re, invert){
-  debug('grep %s', re);
-  this._grep = re;
-  this._invert = invert;
-  this.total = this.grepTotal(this.suite);
-  return this;
-};
-
-/**
- * Returns the number of tests matching the grep search for the
- * given suite.
- *
- * @param {Suite} suite
- * @return {Number}
- * @api public
- */
-
-Runner.prototype.grepTotal = function(suite) {
-  var self = this;
-  var total = 0;
-
-  suite.eachTest(function(test){
-    var match = self._grep.test(test.fullTitle());
-    if (self._invert) match = !match;
-    if (match) total++;
-  });
-
-  return total;
-};
-
-/**
- * Return a list of global properties.
- *
- * @return {Array}
- * @api private
- */
-
-Runner.prototype.globalProps = function() {
-  var props = utils.keys(global);
-
-  // non-enumerables
-  for (var i = 0; i < globals.length; ++i) {
-    if (~utils.indexOf(props, globals[i])) continue;
-    props.push(globals[i]);
-  }
-
-  return props;
-};
-
-/**
- * Allow the given `arr` of globals.
- *
- * @param {Array} arr
- * @return {Runner} for chaining
- * @api public
- */
-
-Runner.prototype.globals = function(arr){
-  if (0 == arguments.length) return this._globals;
-  debug('globals %j', arr);
-  this._globals = this._globals.concat(arr);
-  return this;
-};
-
-/**
- * Check for global variable leaks.
- *
- * @api private
- */
-
-Runner.prototype.checkGlobals = function(test){
-  if (this.ignoreLeaks) return;
-  var ok = this._globals;
-
-  var globals = this.globalProps();
-  var leaks;
-
-  if (test) {
-    ok = ok.concat(test._allowedGlobals || []);
-  }
-
-  if(this.prevGlobalsLength == globals.length) return;
-  this.prevGlobalsLength = globals.length;
-
-  leaks = filterLeaks(ok, globals);
-  this._globals = this._globals.concat(leaks);
-
-  if (leaks.length > 1) {
-    this.fail(test, new Error('global leaks detected: ' + leaks.join(', ') + ''));
-  } else if (leaks.length) {
-    this.fail(test, new Error('global leak detected: ' + leaks[0]));
-  }
-};
-
-/**
- * Fail the given `test`.
- *
- * @param {Test} test
- * @param {Error} err
- * @api private
- */
-
-Runner.prototype.fail = function(test, err) {
-  ++this.failures;
-  test.state = 'failed';
-
-  if (!(err instanceof Error)) {
-    err = new Error('the ' + type(err) + ' ' + stringify(err) + ' was thrown, throw an Error :)');
-  }
-
-  err.stack = (this.fullStackTrace || !err.stack)
-    ? err.stack
-    : stackFilter(err.stack);
-
-  this.emit('fail', test, err);
-};
-
-/**
- * Fail the given `hook` with `err`.
- *
- * Hook failures work in the following pattern:
- * - If bail, then exit
- * - Failed `before` hook skips all tests in a suite and subsuites,
- *   but jumps to corresponding `after` hook
- * - Failed `before each` hook skips remaining tests in a
- *   suite and jumps to corresponding `after each` hook,
- *   which is run only once
- * - Failed `after` hook does not alter
- *   execution order
- * - Failed `after each` hook skips remaining tests in a
- *   suite and subsuites, but executes other `after each`
- *   hooks
- *
- * @param {Hook} hook
- * @param {Error} err
- * @api private
- */
-
-Runner.prototype.failHook = function(hook, err){
-  this.fail(hook, err);
-  if (this.suite.bail()) {
-    this.emit('end');
-  }
-};
-
-/**
- * Run hook `name` callbacks and then invoke `fn()`.
- *
- * @param {String} name
- * @param {Function} function
- * @api private
- */
-
-Runner.prototype.hook = function(name, fn){
-  var suite = this.suite
-    , hooks = suite['_' + name]
-    , self = this
-    , timer;
-
-  function next(i) {
-    var hook = hooks[i];
-    if (!hook) return fn();
-    self.currentRunnable = hook;
-
-    hook.ctx.currentTest = self.test;
-
-    self.emit('hook', hook);
-
-    hook.on('error', function(err){
-      self.failHook(hook, err);
-    });
-
-    hook.run(function(err){
-      hook.removeAllListeners('error');
-      var testError = hook.error();
-      if (testError) self.fail(self.test, testError);
-      if (err) {
-        if (err instanceof Pending) {
-          suite.pending = true;
-        } else {
-          self.failHook(hook, err);
-
-          // stop executing hooks, notify callee of hook err
-          return fn(err);
-        }
-      }
-      self.emit('hook end', hook);
-      delete hook.ctx.currentTest;
-      next(++i);
-    });
-  }
-
-  Runner.immediately(function(){
-    next(0);
-  });
-};
-
-/**
- * Run hook `name` for the given array of `suites`
- * in order, and callback `fn(err, errSuite)`.
- *
- * @param {String} name
- * @param {Array} suites
- * @param {Function} fn
- * @api private
- */
-
-Runner.prototype.hooks = function(name, suites, fn){
-  var self = this
-    , orig = this.suite;
-
-  function next(suite) {
-    self.suite = suite;
-
-    if (!suite) {
-      self.suite = orig;
-      return fn();
-    }
-
-    self.hook(name, function(err){
-      if (err) {
-        var errSuite = self.suite;
-        self.suite = orig;
-        return fn(err, errSuite);
-      }
-
-      next(suites.pop());
-    });
-  }
-
-  next(suites.pop());
-};
-
-/**
- * Run hooks from the top level down.
- *
- * @param {String} name
- * @param {Function} fn
- * @api private
- */
-
-Runner.prototype.hookUp = function(name, fn){
-  var suites = [this.suite].concat(this.parents()).reverse();
-  this.hooks(name, suites, fn);
-};
-
-/**
- * Run hooks from the bottom up.
- *
- * @param {String} name
- * @param {Function} fn
- * @api private
- */
-
-Runner.prototype.hookDown = function(name, fn){
-  var suites = [this.suite].concat(this.parents());
-  this.hooks(name, suites, fn);
-};
-
-/**
- * Return an array of parent Suites from
- * closest to furthest.
- *
- * @return {Array}
- * @api private
- */
-
-Runner.prototype.parents = function(){
-  var suite = this.suite
-    , suites = [];
-  while (suite = suite.parent) suites.push(suite);
-  return suites;
-};
-
-/**
- * Run the current test and callback `fn(err)`.
- *
- * @param {Function} fn
- * @api private
- */
-
-Runner.prototype.runTest = function(fn){
-  var test = this.test
-    , self = this;
-
-  if (this.asyncOnly) test.asyncOnly = true;
-
-  try {
-    test.on('error', function(err){
-      self.fail(test, err);
-    });
-    test.run(fn);
-  } catch (err) {
-    fn(err);
-  }
-};
-
-/**
- * Run tests in the given `suite` and invoke
- * the callback `fn()` when complete.
- *
- * @param {Suite} suite
- * @param {Function} fn
- * @api private
- */
-
-Runner.prototype.runTests = function(suite, fn){
-  var self = this
-    , tests = suite.tests.slice()
-    , test;
-
-
-  function hookErr(err, errSuite, after) {
-    // before/after Each hook for errSuite failed:
-    var orig = self.suite;
-
-    // for failed 'after each' hook start from errSuite parent,
-    // otherwise start from errSuite itself
-    self.suite = after ? errSuite.parent : errSuite;
-
-    if (self.suite) {
-      // call hookUp afterEach
-      self.hookUp('afterEach', function(err2, errSuite2) {
-        self.suite = orig;
-        // some hooks may fail even now
-        if (err2) return hookErr(err2, errSuite2, true);
-        // report error suite
-        fn(errSuite);
-      });
-    } else {
-      // there is no need calling other 'after each' hooks
-      self.suite = orig;
-      fn(errSuite);
-    }
-  }
-
-  function next(err, errSuite) {
-    // if we bail after first err
-    if (self.failures && suite._bail) return fn();
-
-    if (self._abort) return fn();
-
-    if (err) return hookErr(err, errSuite, true);
-
-    // next test
-    test = tests.shift();
-
-    // all done
-    if (!test) return fn();
-
-    // grep
-    var match = self._grep.test(test.fullTitle());
-    if (self._invert) match = !match;
-    if (!match) return next();
-
-    // pending
-    if (test.pending) {
-      self.emit('pending', test);
-      self.emit('test end', test);
-      return next();
-    }
-
-    // execute test and hook(s)
-    self.emit('test', self.test = test);
-    self.hookDown('beforeEach', function(err, errSuite){
-
-      if (suite.pending) {
-        self.emit('pending', test);
-        self.emit('test end', test);
-        return next();
-      }
-      if (err) return hookErr(err, errSuite, false);
-
-      self.currentRunnable = self.test;
-      self.runTest(function(err){
-        test = self.test;
-
-        if (err) {
-          if (err instanceof Pending) {
-            self.emit('pending', test);
-          } else {
-            self.fail(test, err);
-          }
-          self.emit('test end', test);
-
-          if (err instanceof Pending) {
-            return next();
-          }
-
-          return self.hookUp('afterEach', next);
-        }
-
-        test.state = 'passed';
-        self.emit('pass', test);
-        self.emit('test end', test);
-        self.hookUp('afterEach', next);
-      });
-    });
-  }
-
-  this.next = next;
-  next();
-};
-
-/**
- * Run the given `suite` and invoke the
- * callback `fn()` when complete.
- *
- * @param {Suite} suite
- * @param {Function} fn
- * @api private
- */
-
-Runner.prototype.runSuite = function(suite, fn){
-  var total = this.grepTotal(suite)
-    , self = this
-    , i = 0;
-
-  debug('run suite %s', suite.fullTitle());
-
-  if (!total) return fn();
-
-  this.emit('suite', this.suite = suite);
-
-  function next(errSuite) {
-    if (errSuite) {
-      // current suite failed on a hook from errSuite
-      if (errSuite == suite) {
-        // if errSuite is current suite
-        // continue to the next sibling suite
-        return done();
-      } else {
-        // errSuite is among the parents of current suite
-        // stop execution of errSuite and all sub-suites
-        return done(errSuite);
-      }
-    }
-
-    if (self._abort) return done();
-
-    var curr = suite.suites[i++];
-    if (!curr) return done();
-    self.runSuite(curr, next);
-  }
-
-  function done(errSuite) {
-    self.suite = suite;
-    self.hook('afterAll', function(){
-      self.emit('suite end', suite);
-      fn(errSuite);
-    });
-  }
-
-  this.hook('beforeAll', function(err){
-    if (err) return done();
-    self.runTests(suite, next);
-  });
-};
-
-/**
- * Handle uncaught exceptions.
- *
- * @param {Error} err
- * @api private
- */
-
-Runner.prototype.uncaught = function(err){
-  if (err) {
-    debug('uncaught exception %s', err !== function () {
-      return this;
-    }.call(err) ? err : ( err.message || err ));
-  } else {
-    debug('uncaught undefined exception');
-    err = utils.undefinedError();
-  }
-  err.uncaught = true;
-
-  var runnable = this.currentRunnable;
-  if (!runnable) return;
-
-  runnable.clearTimeout();
-
-  // Ignore errors if complete
-  if (runnable.state) return;
-  this.fail(runnable, err);
-
-  // recover from test
-  if ('test' == runnable.type) {
-    this.emit('test end', runnable);
-    this.hookUp('afterEach', this.next);
-    return;
-  }
-
-  // bail on hooks
-  this.emit('end');
-};
-
-/**
- * Run the root suite and invoke `fn(failures)`
- * on completion.
- *
- * @param {Function} fn
- * @return {Runner} for chaining
- * @api public
- */
-
-Runner.prototype.run = function(fn){
-  var self = this,
-    rootSuite = this.suite;
-
-  fn = fn || function(){};
-
-  function uncaught(err){
-    self.uncaught(err);
-  }
-
-  function start() {
-    self.emit('start');
-    self.runSuite(rootSuite, function(){
-      debug('finished running');
-      self.emit('end');
-    });
-  }
-
-  debug('start');
-
-  // callback
-  this.on('end', function(){
-    debug('end');
-    process.removeListener('uncaughtException', uncaught);
-    fn(self.failures);
-  });
-
-  // uncaught exception
-  process.on('uncaughtException', uncaught);
-
-  if (this._delay) {
-    // for reporters, I guess.
-    // might be nice to debounce some dots while we wait.
-    this.emit('waiting', rootSuite);
-    rootSuite.once('run', start);
-  }
-  else {
-    start();
-  }
-
-  return this;
-};
-
-/**
- * Cleanly abort execution
- *
- * @return {Runner} for chaining
- * @api public
- */
-Runner.prototype.abort = function(){
-  debug('aborting');
-  this._abort = true;
-};
-
-/**
- * Filter leaks with the given globals flagged as `ok`.
- *
- * @param {Array} ok
- * @param {Array} globals
- * @return {Array}
- * @api private
- */
-
-function filterLeaks(ok, globals) {
-  return filter(globals, function(key){
-    // Firefox and Chrome exposes iframes as index inside the window object
-    if (/^d+/.test(key)) return false;
-
-    // in firefox
-    // if runner runs in an iframe, this iframe's window.getInterface method not init at first
-    // it is assigned in some seconds
-    if (global.navigator && /^getInterface/.test(key)) return false;
-
-    // an iframe could be approached by window[iframeIndex]
-    // in ie6,7,8 and opera, iframeIndex is enumerable, this could cause leak
-    if (global.navigator && /^\d+/.test(key)) return false;
-
-    // Opera and IE expose global variables for HTML element IDs (issue #243)
-    if (/^mocha-/.test(key)) return false;
-
-    var matched = filter(ok, function(ok){
-      if (~ok.indexOf('*')) return 0 == key.indexOf(ok.split('*')[0]);
-      return key == ok;
-    });
-    return matched.length == 0 && (!global.navigator || 'onerror' !== key);
-  });
-}
-
-/**
- * Array of globals dependent on the environment.
- *
- * @return {Array}
- * @api private
- */
-
-function extraGlobals() {
- if (typeof(process) === 'object' &&
-     typeof(process.version) === 'string') {
-
-   var nodeVersion = process.version.split('.').reduce(function(a, v) {
-     return a << 8 | v;
-   });
-
-   // 'errno' was renamed to process._errno in v0.9.11.
-
-   if (nodeVersion < 0x00090B) {
-     return ['errno'];
-   }
- }
-
- return [];
-}
-
-}); // module: runner.js
-
-require.register("suite.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var EventEmitter = require('browser/events').EventEmitter
-  , debug = require('browser/debug')('mocha:suite')
-  , milliseconds = require('./ms')
-  , utils = require('./utils')
-  , Hook = require('./hook');
-
-/**
- * Expose `Suite`.
- */
-
-exports = module.exports = Suite;
-
-/**
- * Create a new `Suite` with the given `title`
- * and parent `Suite`. When a suite with the
- * same title is already present, that suite
- * is returned to provide nicer reporter
- * and more flexible meta-testing.
- *
- * @param {Suite} parent
- * @param {String} title
- * @return {Suite}
- * @api public
- */
-
-exports.create = function(parent, title){
-  var suite = new Suite(title, parent.ctx);
-  suite.parent = parent;
-  if (parent.pending) suite.pending = true;
-  title = suite.fullTitle();
-  parent.addSuite(suite);
-  return suite;
-};
-
-/**
- * Initialize a new `Suite` with the given
- * `title` and `ctx`.
- *
- * @param {String} title
- * @param {Context} ctx
- * @api private
- */
-
-function Suite(title, parentContext) {
-  this.title = title;
-  var context = function() {};
-  context.prototype = parentContext;
-  this.ctx = new context();
-  this.suites = [];
-  this.tests = [];
-  this.pending = false;
-  this._beforeEach = [];
-  this._beforeAll = [];
-  this._afterEach = [];
-  this._afterAll = [];
-  this.root = !title;
-  this._timeout = 2000;
-  this._enableTimeouts = true;
-  this._slow = 75;
-  this._bail = false;
-  this.delayed = false;
-}
-
-/**
- * Inherit from `EventEmitter.prototype`.
- */
-
-function F(){};
-F.prototype = EventEmitter.prototype;
-Suite.prototype = new F;
-Suite.prototype.constructor = Suite;
-
-
-/**
- * Return a clone of this `Suite`.
- *
- * @return {Suite}
- * @api private
- */
-
-Suite.prototype.clone = function(){
-  var suite = new Suite(this.title);
-  debug('clone');
-  suite.ctx = this.ctx;
-  suite.timeout(this.timeout());
-  suite.enableTimeouts(this.enableTimeouts());
-  suite.slow(this.slow());
-  suite.bail(this.bail());
-  return suite;
-};
-
-/**
- * Set timeout `ms` or short-hand such as "2s".
- *
- * @param {Number|String} ms
- * @return {Suite|Number} for chaining
- * @api private
- */
-
-Suite.prototype.timeout = function(ms){
-  if (0 == arguments.length) return this._timeout;
-  if (ms.toString() === '0') this._enableTimeouts = false;
-  if ('string' == typeof ms) ms = milliseconds(ms);
-  debug('timeout %d', ms);
-  this._timeout = parseInt(ms, 10);
-  return this;
-};
-
-/**
-  * Set timeout `enabled`.
-  *
-  * @param {Boolean} enabled
-  * @return {Suite|Boolean} self or enabled
-  * @api private
-  */
-
-Suite.prototype.enableTimeouts = function(enabled){
-  if (arguments.length === 0) return this._enableTimeouts;
-  debug('enableTimeouts %s', enabled);
-  this._enableTimeouts = enabled;
-  return this;
-};
-
-/**
- * Set slow `ms` or short-hand such as "2s".
- *
- * @param {Number|String} ms
- * @return {Suite|Number} for chaining
- * @api private
- */
-
-Suite.prototype.slow = function(ms){
-  if (0 === arguments.length) return this._slow;
-  if ('string' == typeof ms) ms = milliseconds(ms);
-  debug('slow %d', ms);
-  this._slow = ms;
-  return this;
-};
-
-/**
- * Sets whether to bail after first error.
- *
- * @param {Boolean} bail
- * @return {Suite|Number} for chaining
- * @api private
- */
-
-Suite.prototype.bail = function(bail){
-  if (0 == arguments.length) return this._bail;
-  debug('bail %s', bail);
-  this._bail = bail;
-  return this;
-};
-
-/**
- * Run `fn(test[, done])` before running tests.
- *
- * @param {Function} fn
- * @return {Suite} for chaining
- * @api private
- */
-
-Suite.prototype.beforeAll = function(title, fn){
-  if (this.pending) return this;
-  if ('function' === typeof title) {
-    fn = title;
-    title = fn.name;
-  }
-  title = '"before all" hook' + (title ? ': ' + title : '');
-
-  var hook = new Hook(title, fn);
-  hook.parent = this;
-  hook.timeout(this.timeout());
-  hook.enableTimeouts(this.enableTimeouts());
-  hook.slow(this.slow());
-  hook.ctx = this.ctx;
-  this._beforeAll.push(hook);
-  this.emit('beforeAll', hook);
-  return this;
-};
-
-/**
- * Run `fn(test[, done])` after running tests.
- *
- * @param {Function} fn
- * @return {Suite} for chaining
- * @api private
- */
-
-Suite.prototype.afterAll = function(title, fn){
-  if (this.pending) return this;
-  if ('function' === typeof title) {
-    fn = title;
-    title = fn.name;
-  }
-  title = '"after all" hook' + (title ? ': ' + title : '');
-
-  var hook = new Hook(title, fn);
-  hook.parent = this;
-  hook.timeout(this.timeout());
-  hook.enableTimeouts(this.enableTimeouts());
-  hook.slow(this.slow());
-  hook.ctx = this.ctx;
-  this._afterAll.push(hook);
-  this.emit('afterAll', hook);
-  return this;
-};
-
-/**
- * Run `fn(test[, done])` before each test case.
- *
- * @param {Function} fn
- * @return {Suite} for chaining
- * @api private
- */
-
-Suite.prototype.beforeEach = function(title, fn){
-  if (this.pending) return this;
-  if ('function' === typeof title) {
-    fn = title;
-    title = fn.name;
-  }
-  title = '"before each" hook' + (title ? ': ' + title : '');
-
-  var hook = new Hook(title, fn);
-  hook.parent = this;
-  hook.timeout(this.timeout());
-  hook.enableTimeouts(this.enableTimeouts());
-  hook.slow(this.slow());
-  hook.ctx = this.ctx;
-  this._beforeEach.push(hook);
-  this.emit('beforeEach', hook);
-  return this;
-};
-
-/**
- * Run `fn(test[, done])` after each test case.
- *
- * @param {Function} fn
- * @return {Suite} for chaining
- * @api private
- */
-
-Suite.prototype.afterEach = function(title, fn){
-  if (this.pending) return this;
-  if ('function' === typeof title) {
-    fn = title;
-    title = fn.name;
-  }
-  title = '"after each" hook' + (title ? ': ' + title : '');
-
-  var hook = new Hook(title, fn);
-  hook.parent = this;
-  hook.timeout(this.timeout());
-  hook.enableTimeouts(this.enableTimeouts());
-  hook.slow(this.slow());
-  hook.ctx = this.ctx;
-  this._afterEach.push(hook);
-  this.emit('afterEach', hook);
-  return this;
-};
-
-/**
- * Add a test `suite`.
- *
- * @param {Suite} suite
- * @return {Suite} for chaining
- * @api private
- */
-
-Suite.prototype.addSuite = function(suite){
-  suite.parent = this;
-  suite.timeout(this.timeout());
-  suite.enableTimeouts(this.enableTimeouts());
-  suite.slow(this.slow());
-  suite.bail(this.bail());
-  this.suites.push(suite);
-  this.emit('suite', suite);
-  return this;
-};
-
-/**
- * Add a `test` to this suite.
- *
- * @param {Test} test
- * @return {Suite} for chaining
- * @api private
- */
-
-Suite.prototype.addTest = function(test){
-  test.parent = this;
-  test.timeout(this.timeout());
-  test.enableTimeouts(this.enableTimeouts());
-  test.slow(this.slow());
-  test.ctx = this.ctx;
-  this.tests.push(test);
-  this.emit('test', test);
-  return this;
-};
-
-/**
- * Return the full title generated by recursively
- * concatenating the parent's full title.
- *
- * @return {String}
- * @api public
- */
-
-Suite.prototype.fullTitle = function(){
-  if (this.parent) {
-    var full = this.parent.fullTitle();
-    if (full) return full + ' ' + this.title;
-  }
-  return this.title;
-};
-
-/**
- * Return the total number of tests.
- *
- * @return {Number}
- * @api public
- */
-
-Suite.prototype.total = function(){
-  return utils.reduce(this.suites, function(sum, suite){
-    return sum + suite.total();
-  }, 0) + this.tests.length;
-};
-
-/**
- * Iterates through each suite recursively to find
- * all tests. Applies a function in the format
- * `fn(test)`.
- *
- * @param {Function} fn
- * @return {Suite}
- * @api private
- */
-
-Suite.prototype.eachTest = function(fn){
-  utils.forEach(this.tests, fn);
-  utils.forEach(this.suites, function(suite){
-    suite.eachTest(fn);
-  });
-  return this;
-};
-
-/**
- * This will run the root suite if we happen to be running in delayed mode.
- */
-Suite.prototype.run = function run() {
-  if (this.root) {
-    this.emit('run');
-  }
-};
-
-}); // module: suite.js
-
-require.register("test.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var Runnable = require('./runnable');
-
-/**
- * Expose `Test`.
- */
-
-module.exports = Test;
-
-/**
- * Initialize a new `Test` with the given `title` and callback `fn`.
- *
- * @param {String} title
- * @param {Function} fn
- * @api private
- */
-
-function Test(title, fn) {
-  Runnable.call(this, title, fn);
-  this.pending = !fn;
-  this.type = 'test';
-}
-
-/**
- * Inherit from `Runnable.prototype`.
- */
-
-function F(){};
-F.prototype = Runnable.prototype;
-Test.prototype = new F;
-Test.prototype.constructor = Test;
-
-
-}); // module: test.js
-
-require.register("utils.js", function(module, exports, require){
-/**
- * Module dependencies.
- */
-
-var fs = require('browser/fs')
-  , path = require('browser/path')
-  , basename = path.basename
-  , exists = fs.existsSync || path.existsSync
-  , glob = require('browser/glob')
-  , join = path.join
-  , debug = require('browser/debug')('mocha:watch');
-
-/**
- * Ignored directories.
- */
-
-var ignore = ['node_modules', '.git'];
-
-/**
- * Escape special characters in the given string of html.
- *
- * @param  {String} html
- * @return {String}
- * @api private
- */
-
-exports.escape = function(html){
-  return String(html)
-    .replace(/&/g, '&amp;')
-    .replace(/"/g, '&quot;')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;');
-};
-
-/**
- * Array#forEach (<=IE8)
- *
- * @param {Array} array
- * @param {Function} fn
- * @param {Object} scope
- * @api private
- */
-
-exports.forEach = function(arr, fn, scope){
-  for (var i = 0, l = arr.length; i < l; i++)
-    fn.call(scope, arr[i], i);
-};
-
-/**
- * Array#map (<=IE8)
- *
- * @param {Array} array
- * @param {Function} fn
- * @param {Object} scope
- * @api private
- */
-
-exports.map = function(arr, fn, scope){
-  var result = [];
-  for (var i = 0, l = arr.length; i < l; i++)
-    result.push(fn.call(scope, arr[i], i, arr));
-  return result;
-};
-
-/**
- * Array#indexOf (<=IE8)
- *
- * @parma {Array} arr
- * @param {Object} obj to find index of
- * @param {Number} start
- * @api private
- */
-
-exports.indexOf = function(arr, obj, start){
-  for (var i = start || 0, l = arr.length; i < l; i++) {
-    if (arr[i] === obj)
-      return i;
-  }
-  return -1;
-};
-
-/**
- * Array#reduce (<=IE8)
- *
- * @param {Array} array
- * @param {Function} fn
- * @param {Object} initial value
- * @api private
- */
-
-exports.reduce = function(arr, fn, val){
-  var rval = val;
-
-  for (var i = 0, l = arr.length; i < l; i++) {
-    rval = fn(rval, arr[i], i, arr);
-  }
-
-  return rval;
-};
-
-/**
- * Array#filter (<=IE8)
- *
- * @param {Array} array
- * @param {Function} fn
- * @api private
- */
-
-exports.filter = function(arr, fn){
-  var ret = [];
-
-  for (var i = 0, l = arr.length; i < l; i++) {
-    var val = arr[i];
-    if (fn(val, i, arr)) ret.push(val);
-  }
-
-  return ret;
-};
-
-/**
- * Object.keys (<=IE8)
- *
- * @param {Object} obj
- * @return {Array} keys
- * @api private
- */
-
-exports.keys = Object.keys || function(obj) {
-  var keys = []
-    , has = Object.prototype.hasOwnProperty; // for `window` on <=IE8
-
-  for (var key in obj) {
-    if (has.call(obj, key)) {
-      keys.push(key);
-    }
-  }
-
-  return keys;
-};
-
-/**
- * Watch the given `files` for changes
- * and invoke `fn(file)` on modification.
- *
- * @param {Array} files
- * @param {Function} fn
- * @api private
- */
-
-exports.watch = function(files, fn){
-  var options = { interval: 100 };
-  files.forEach(function(file){
-    debug('file %s', file);
-    fs.watchFile(file, options, function(curr, prev){
-      if (prev.mtime < curr.mtime) fn(file);
-    });
-  });
-};
-
-/**
- * Array.isArray (<=IE8)
- *
- * @param {Object} obj
- * @return {Boolean}
- * @api private
- */
-var isArray = Array.isArray || function (obj) {
-  return '[object Array]' == {}.toString.call(obj);
-};
-
-/**
- * @description
- * Buffer.prototype.toJSON polyfill
- * @type {Function}
- */
-if(typeof Buffer !== 'undefined' && Buffer.prototype) {
-  Buffer.prototype.toJSON = Buffer.prototype.toJSON || function () {
-    return Array.prototype.slice.call(this, 0);
-  };
-}
-
-/**
- * Ignored files.
- */
-
-function ignored(path){
-  return !~ignore.indexOf(path);
-}
-
-/**
- * Lookup files in the given `dir`.
- *
- * @return {Array}
- * @api private
- */
-
-exports.files = function(dir, ext, ret){
-  ret = ret || [];
-  ext = ext || ['js'];
-
-  var re = new RegExp('\\.(' + ext.join('|') + ')$');
-
-  fs.readdirSync(dir)
-    .filter(ignored)
-    .forEach(function(path){
-      path = join(dir, path);
-      if (fs.statSync(path).isDirectory()) {
-        exports.files(path, ext, ret);
-      } else if (path.match(re)) {
-        ret.push(path);
-      }
-    });
-
-  return ret;
-};
-
-/**
- * Compute a slug from the given `str`.
- *
- * @param {String} str
- * @return {String}
- * @api private
- */
-
-exports.slug = function(str){
-  return str
-    .toLowerCase()
-    .replace(/ +/g, '-')
-    .replace(/[^-\w]/g, '');
-};
-
-/**
- * Strip the function definition from `str`,
- * and re-indent for pre whitespace.
- */
-
-exports.clean = function(str) {
-  str = str
-    .replace(/\r\n?|[\n\u2028\u2029]/g, "\n").replace(/^\uFEFF/, '')
-    .replace(/^function *\(.*\)\s*{|\(.*\) *=> *{?/, '')
-    .replace(/\s+\}$/, '');
-
-  var spaces = str.match(/^\n?( *)/)[1].length
-    , tabs = str.match(/^\n?(\t*)/)[1].length
-    , re = new RegExp('^\n?' + (tabs ? '\t' : ' ') + '{' + (tabs ? tabs : spaces) + '}', 'gm');
-
-  str = str.replace(re, '');
-
-  return exports.trim(str);
-};
-
-/**
- * Trim the given `str`.
- *
- * @param {String} str
- * @return {String}
- * @api private
- */
-
-exports.trim = function(str){
-  return str.replace(/^\s+|\s+$/g, '');
-};
-
-/**
- * Parse the given `qs`.
- *
- * @param {String} qs
- * @return {Object}
- * @api private
- */
-
-exports.parseQuery = function(qs){
-  return exports.reduce(qs.replace('?', '').split('&'), function(obj, pair){
-    var i = pair.indexOf('=')
-      , key = pair.slice(0, i)
-      , val = pair.slice(++i);
-
-    obj[key] = decodeURIComponent(val);
-    return obj;
-  }, {});
-};
-
-/**
- * Highlight the given string of `js`.
- *
- * @param {String} js
- * @return {String}
- * @api private
- */
-
-function highlight(js) {
-  return js
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/\/\/(.*)/gm, '<span class="comment">//$1</span>')
-    .replace(/('.*?')/gm, '<span class="string">$1</span>')
-    .replace(/(\d+\.\d+)/gm, '<span class="number">$1</span>')
-    .replace(/(\d+)/gm, '<span class="number">$1</span>')
-    .replace(/\bnew[ \t]+(\w+)/gm, '<span class="keyword">new</span> <span class="init">$1</span>')
-    .replace(/\b(function|new|throw|return|var|if|else)\b/gm, '<span class="keyword">$1</span>')
-}
-
-/**
- * Highlight the contents of tag `name`.
- *
- * @param {String} name
- * @api private
- */
-
-exports.highlightTags = function(name) {
-  var code = document.getElementById('mocha').getElementsByTagName(name);
-  for (var i = 0, len = code.length; i < len; ++i) {
-    code[i].innerHTML = highlight(code[i].innerHTML);
-  }
-};
-
-/**
- * If a value could have properties, and has none, this function is called, which returns
- * a string representation of the empty value.
- *
- * Functions w/ no properties return `'[Function]'`
- * Arrays w/ length === 0 return `'[]'`
- * Objects w/ no properties return `'{}'`
- * All else: return result of `value.toString()`
- *
- * @param {*} value Value to inspect
- * @param {string} [type] The type of the value, if known.
- * @returns {string}
- */
-var emptyRepresentation = function emptyRepresentation(value, type) {
-  type = type || exports.type(value);
-
-  switch(type) {
-    case 'function':
-      return '[Function]';
-    case 'object':
-      return '{}';
-    case 'array':
-      return '[]';
-    default:
-      return value.toString();
-  }
-};
-
-/**
- * Takes some variable and asks `{}.toString()` what it thinks it is.
- * @param {*} value Anything
- * @example
- * type({}) // 'object'
- * type([]) // 'array'
- * type(1) // 'number'
- * type(false) // 'boolean'
- * type(Infinity) // 'number'
- * type(null) // 'null'
- * type(new Date()) // 'date'
- * type(/foo/) // 'regexp'
- * type('type') // 'string'
- * type(global) // 'global'
- * @api private
- * @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/toString
- * @returns {string}
- */
-exports.type = function type(value) {
-  if (typeof Buffer !== 'undefined' && Buffer.isBuffer(value)) {
-    return 'buffer';
-  }
-  return Object.prototype.toString.call(value)
-    .replace(/^\[.+\s(.+?)\]$/, '$1')
-    .toLowerCase();
-};
-
-/**
- * @summary Stringify `value`.
- * @description Different behavior depending on type of value.
- * - If `value` is undefined or null, return `'[undefined]'` or `'[null]'`, respectively.
- * - If `value` is not an object, function or array, return result of `value.toString()` wrapped in double-quotes.
- * - If `value` is an *empty* object, function, or array, return result of function
- *   {@link emptyRepresentation}.
- * - If `value` has properties, call {@link exports.canonicalize} on it, then return result of
- *   JSON.stringify().
- *
- * @see exports.type
- * @param {*} value
- * @return {string}
- * @api private
- */
-
-exports.stringify = function(value) {
-  var type = exports.type(value);
-
-  if (!~exports.indexOf(['object', 'array', 'function'], type)) {
-    if(type != 'buffer') {
-      return jsonStringify(value);
-    }
-    var json = value.toJSON();
-    // Based on the toJSON result
-    return jsonStringify(json.data && json.type ? json.data : json, 2)
-      .replace(/,(\n|$)/g, '$1');
-  }
-
-  for (var prop in value) {
-    if (Object.prototype.hasOwnProperty.call(value, prop)) {
-      return jsonStringify(exports.canonicalize(value), 2).replace(/,(\n|$)/g, '$1');
-    }
-  }
-
-  return emptyRepresentation(value, type);
-};
-
-/**
- * @description
- * like JSON.stringify but more sense.
- * @param {Object}  object
- * @param {Number=} spaces
- * @param {number=} depth
- * @returns {*}
- * @private
- */
-function jsonStringify(object, spaces, depth) {
-  if(typeof spaces == 'undefined') return _stringify(object);  // primitive types
-
-  depth = depth || 1;
-  var space = spaces * depth
-    , str = isArray(object) ? '[' : '{'
-    , end = isArray(object) ? ']' : '}'
-    , length = object.length || exports.keys(object).length
-    , repeat = function(s, n) { return new Array(n).join(s); }; // `.repeat()` polyfill
-
-  function _stringify(val) {
-    switch (exports.type(val)) {
-      case 'null':
-      case 'undefined':
-        val = '[' + val + ']';
-        break;
-      case 'array':
-      case 'object':
-        val = jsonStringify(val, spaces, depth + 1);
-        break;
-      case 'boolean':
-      case 'regexp':
-      case 'number':
-        val = val === 0 && (1/val) === -Infinity // `-0`
-          ? '-0'
-          : val.toString();
-        break;
-      case 'date':
-        val = '[Date: ' + val.toISOString() + ']';
-        break;
-      case 'buffer':
-        var json = val.toJSON();
-        // Based on the toJSON result
-        json = json.data && json.type ? json.data : json;
-        val = '[Buffer: ' + jsonStringify(json, 2, depth + 1) + ']';
-        break;
-      default:
-        val = (val == '[Function]' || val == '[Circular]')
-          ? val
-          : '"' + val + '"'; //string
-    }
-    return val;
-  }
-
-  for(var i in object) {
-    if(!object.hasOwnProperty(i)) continue;        // not my business
-    --length;
-    str += '\n ' + repeat(' ', space)
-      + (isArray(object) ? '' : '"' + i + '": ') // key
-      +  _stringify(object[i])                   // value
-      + (length ? ',' : '');                     // comma
-  }
-
-  return str + (str.length != 1                    // [], {}
-    ? '\n' + repeat(' ', --space) + end
-    : end);
-}
-
-/**
- * Return if obj is a Buffer
- * @param {Object} arg
- * @return {Boolean}
- * @api private
- */
-exports.isBuffer = function (arg) {
-  return typeof Buffer !== 'undefined' && Buffer.isBuffer(arg);
-};
-
-/**
- * @summary Return a new Thing that has the keys in sorted order.  Recursive.
- * @description If the Thing...
- * - has already been seen, return string `'[Circular]'`
- * - is `undefined`, return string `'[undefined]'`
- * - is `null`, return value `null`
- * - is some other primitive, return the value
- * - is not a primitive or an `Array`, `Object`, or `Function`, return the value of the Thing's `toString()` method
- * - is a non-empty `Array`, `Object`, or `Function`, return the result of calling this function again.
- * - is an empty `Array`, `Object`, or `Function`, return the result of calling `emptyRepresentation()`
- *
- * @param {*} value Thing to inspect.  May or may not have properties.
- * @param {Array} [stack=[]] Stack of seen values
- * @return {(Object|Array|Function|string|undefined)}
- * @see {@link exports.stringify}
- * @api private
- */
-
-exports.canonicalize = function(value, stack) {
-  var canonicalizedObj,
-    type = exports.type(value),
-    prop,
-    withStack = function withStack(value, fn) {
-      stack.push(value);
-      fn();
-      stack.pop();
-    };
-
-  stack = stack || [];
-
-  if (exports.indexOf(stack, value) !== -1) {
-    return '[Circular]';
-  }
-
-  switch(type) {
-    case 'undefined':
-    case 'buffer':
-    case 'null':
-      canonicalizedObj = value;
-      break;
-    case 'array':
-      withStack(value, function () {
-        canonicalizedObj = exports.map(value, function (item) {
-          return exports.canonicalize(item, stack);
-        });
-      });
-      break;
-    case 'function':
-      for (prop in value) {
-        canonicalizedObj = {};
-        break;
-      }
-      if (!canonicalizedObj) {
-        canonicalizedObj = emptyRepresentation(value, type);
-        break;
-      }
-    /* falls through */
-    case 'object':
-      canonicalizedObj = canonicalizedObj || {};
-      withStack(value, function () {
-        exports.forEach(exports.keys(value).sort(), function (key) {
-          canonicalizedObj[key] = exports.canonicalize(value[key], stack);
-        });
-      });
-      break;
-    case 'date':
-    case 'number':
-    case 'regexp':
-    case 'boolean':
-      canonicalizedObj = value;
-      break;
-    default:
-      canonicalizedObj = value.toString();
-  }
-
-  return canonicalizedObj;
-};
-
-/**
- * Lookup file names at the given `path`.
- */
-exports.lookupFiles = function lookupFiles(path, extensions, recursive) {
-  var files = [];
-  var re = new RegExp('\\.(' + extensions.join('|') + ')$');
-
-  if (!exists(path)) {
-    if (exists(path + '.js')) {
-      path += '.js';
-    } else {
-      files = glob.sync(path);
-      if (!files.length) throw new Error("cannot resolve path (or pattern) '" + path + "'");
-      return files;
-    }
-  }
-
-  try {
-    var stat = fs.statSync(path);
-    if (stat.isFile()) return path;
-  }
-  catch (ignored) {
-    return;
-  }
-
-  fs.readdirSync(path).forEach(function(file) {
-    file = join(path, file);
-    try {
-      var stat = fs.statSync(file);
-      if (stat.isDirectory()) {
-        if (recursive) {
-          files = files.concat(lookupFiles(file, extensions, recursive));
-        }
-        return;
-      }
-    }
-    catch (ignored) {
-      return;
-    }
-    if (!stat.isFile() || !re.test(file) || basename(file)[0] === '.') return;
-    files.push(file);
-  });
-
-  return files;
-};
-
-/**
- * Generate an undefined error with a message warning the user.
- *
- * @return {Error}
- */
-
-exports.undefinedError = function() {
-  return new Error('Caught undefined error, did you throw without specifying what?');
-};
-
-/**
- * Generate an undefined error if `err` is not defined.
- *
- * @param {Error} err
- * @return {Error}
- */
-
-exports.getError = function(err) {
-  return err || exports.undefinedError();
-};
-
-
-/**
- * @summary
- * This Filter based on `mocha-clean` module.(see: `github.com/rstacruz/mocha-clean`)
- * @description
- * When invoking this function you get a filter function that get the Error.stack as an input,
- * and return a prettify output.
- * (i.e: strip Mocha, node_modules, bower and componentJS from stack trace).
- * @returns {Function}
- */
-
-exports.stackTraceFilter = function() {
-  var slash = '/'
-    , is = typeof document === 'undefined'
-      ? { node: true }
-      : { browser: true }
-    , cwd = is.node
-      ? process.cwd() + slash
-      : location.href.replace(/\/[^\/]*$/, '/');
-
-  function isNodeModule (line) {
-    return (~line.indexOf('node_modules'));
-  }
-
-  function isMochaInternal (line) {
-    return (~line.indexOf('node_modules' + slash + 'mocha'))  ||
-      (~line.indexOf('components' + slash + 'mochajs'))       ||
-      (~line.indexOf('components' + slash + 'mocha'));
-  }
-
-  // node_modules, bower, componentJS
-  function isBrowserModule(line) {
-    return (~line.indexOf('node_modules')) ||
-      (~line.indexOf('components'));
-  }
-
-  function isNodeInternal (line) {
-    return (~line.indexOf('(timers.js:')) ||
-      (~line.indexOf('(events.js:'))      ||
-      (~line.indexOf('(node.js:'))        ||
-      (~line.indexOf('(module.js:'))      ||
-      (~line.indexOf('GeneratorFunctionPrototype.next (native)')) ||
-      false
-  }
-
-  return function(stack) {
-    stack = stack.split('\n');
-
-    stack = exports.reduce(stack, function(list, line) {
-      if (is.node && (isNodeModule(line) ||
-        isMochaInternal(line) ||
-        isNodeInternal(line)))
-        return list;
-
-      if (is.browser && (isBrowserModule(line)))
-        return list;
-
-      // Clean up cwd(absolute)
-      list.push(line.replace(cwd, ''));
-      return list;
-    }, []);
-
-    return stack.join('\n');
-  }
-};
-}); // module: utils.js
-// The global object is "self" in Web Workers.
-var global = (function() { return this; })();
-
-/**
- * Save timer references to avoid Sinon interfering (see GH-237).
- */
-
-var Date = global.Date;
-var setTimeout = global.setTimeout;
-var setInterval = global.setInterval;
-var clearTimeout = global.clearTimeout;
-var clearInterval = global.clearInterval;
-
-/**
- * Node shims.
- *
- * These are meant only to allow
- * mocha.js to run untouched, not
- * to allow running node code in
- * the browser.
- */
-
-var process = {};
-process.exit = function(status){};
-process.stdout = {};
-
-var uncaughtExceptionHandlers = [];
-
-var originalOnerrorHandler = global.onerror;
-
-/**
- * Remove uncaughtException listener.
- * Revert to original onerror handler if previously defined.
- */
-
-process.removeListener = function(e, fn){
-  if ('uncaughtException' == e) {
-    if (originalOnerrorHandler) {
-      global.onerror = originalOnerrorHandler;
-    } else {
-      global.onerror = function() {};
-    }
-    var i = Mocha.utils.indexOf(uncaughtExceptionHandlers, fn);
-    if (i != -1) { uncaughtExceptionHandlers.splice(i, 1); }
-  }
-};
-
-/**
- * Implements uncaughtException listener.
- */
-
-process.on = function(e, fn){
-  if ('uncaughtException' == e) {
-    global.onerror = function(err, url, line){
-      fn(new Error(err + ' (' + url + ':' + line + ')'));
-      return true;
-    };
-    uncaughtExceptionHandlers.push(fn);
-  }
-};
-
-/**
- * Expose mocha.
- */
-
-var Mocha = global.Mocha = require('mocha'),
-    mocha = global.mocha = new Mocha({ reporter: 'html' });
-
-// The BDD UI is registered by default, but no UI will be functional in the
-// browser without an explicit call to the overridden `mocha.ui` (see below).
-// Ensure that this default UI does not expose its methods to the global scope.
-mocha.suite.removeAllListeners('pre-require');
-
-var immediateQueue = []
-  , immediateTimeout;
-
-function timeslice() {
-  var immediateStart = new Date().getTime();
-  while (immediateQueue.length && (new Date().getTime() - immediateStart) < 100) {
-    immediateQueue.shift()();
-  }
-  if (immediateQueue.length) {
-    immediateTimeout = setTimeout(timeslice, 0);
-  } else {
-    immediateTimeout = null;
-  }
-}
-
-/**
- * High-performance override of Runner.immediately.
- */
-
-Mocha.Runner.immediately = function(callback) {
-  immediateQueue.push(callback);
-  if (!immediateTimeout) {
-    immediateTimeout = setTimeout(timeslice, 0);
-  }
-};
-
-/**
- * Function to allow assertion libraries to throw errors directly into mocha.
- * This is useful when running tests in a browser because window.onerror will
- * only receive the 'message' attribute of the Error.
- */
-mocha.throwError = function(err) {
-  Mocha.utils.forEach(uncaughtExceptionHandlers, function (fn) {
-    fn(err);
-  });
-  throw err;
-};
-
-/**
- * Override ui to ensure that the ui functions are initialized.
- * Normally this would happen in Mocha.prototype.loadFiles.
- */
-
-mocha.ui = function(ui){
-  Mocha.prototype.ui.call(this, ui);
-  this.suite.emit('pre-require', global, null, this);
-  return this;
-};
-
-/**
- * Setup mocha with the given setting options.
- */
-
-mocha.setup = function(opts){
-  if ('string' == typeof opts) opts = { ui: opts };
-  for (var opt in opts) this[opt](opts[opt]);
-  return this;
-};
-
-/**
- * Run mocha, returning the Runner.
- */
-
-mocha.run = function(fn){
-  var options = mocha.options;
-  mocha.globals('location');
-
-  var query = Mocha.utils.parseQuery(global.location.search || '');
-  if (query.grep) mocha.grep(new RegExp(query.grep));
-  if (query.fgrep) mocha.grep(query.fgrep);
-  if (query.invert) mocha.invert();
-
-  return Mocha.prototype.run.call(mocha, function(err){
-    // The DOM Document is not available in Web Workers.
-    var document = global.document;
-    if (document && document.getElementById('mocha') && options.noHighlighting !== true) {
-      Mocha.utils.highlightTags('code');
-    }
-    if (fn) fn(err);
-  });
-};
-
-/**
- * Expose the process shim.
- */
-
-Mocha.process = process;
-})();
diff --git a/test/lib/sinon.js b/test/lib/sinon.js
deleted file mode 100644
index 589c0f5..0000000
--- a/test/lib/sinon.js
+++ /dev/null
@@ -1,4299 +0,0 @@
-/**
- * Sinon.JS 1.7.1, 2013/05/07
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @author Contributors: https://github.com/cjohansen/Sinon.JS/blob/master/AUTHORS
- *
- * (The BSD License)
- * 
- * Copyright (c) 2010-2013, Christian Johansen, christian@cjohansen.no
- * All rights reserved.
- * 
- * Redistribution and use in source and binary forms, with or without modification,
- * are permitted provided that the following conditions are met:
- * 
- *     * Redistributions of source code must retain the above copyright notice,
- *       this list of conditions and the following disclaimer.
- *     * Redistributions in binary form must reproduce the above copyright notice,
- *       this list of conditions and the following disclaimer in the documentation
- *       and/or other materials provided with the distribution.
- *     * Neither the name of Christian Johansen nor the names of his contributors
- *       may be used to endorse or promote products derived from this software
- *       without specific prior written permission.
- * 
- * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
- * ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
- * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
- * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
- * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
- * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
- * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
- * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
- * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF
- * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
- */
-
-this.sinon = (function () {
-var buster = (function (setTimeout, B) {
-    var isNode = typeof require == "function" && typeof module == "object";
-    var div = typeof document != "undefined" && document.createElement("div");
-    var F = function () {};
-
-    var buster = {
-        bind: function bind(obj, methOrProp) {
-            var method = typeof methOrProp == "string" ? obj[methOrProp] : methOrProp;
-            var args = Array.prototype.slice.call(arguments, 2);
-            return function () {
-                var allArgs = args.concat(Array.prototype.slice.call(arguments));
-                return method.apply(obj, allArgs);
-            };
-        },
-
-        partial: function partial(fn) {
-            var args = [].slice.call(arguments, 1);
-            return function () {
-                return fn.apply(this, args.concat([].slice.call(arguments)));
-            };
-        },
-
-        create: function create(object) {
-            F.prototype = object;
-            return new F();
-        },
-
-        extend: function extend(target) {
-            if (!target) { return; }
-            for (var i = 1, l = arguments.length, prop; i < l; ++i) {
-                for (prop in arguments[i]) {
-                    target[prop] = arguments[i][prop];
-                }
-            }
-            return target;
-        },
-
-        nextTick: function nextTick(callback) {
-            if (typeof process != "undefined" && process.nextTick) {
-                return process.nextTick(callback);
-            }
-            setTimeout(callback, 0);
-        },
-
-        functionName: function functionName(func) {
-            if (!func) return "";
-            if (func.displayName) return func.displayName;
-            if (func.name) return func.name;
-            var matches = func.toString().match(/function\s+([^\(]+)/m);
-            return matches && matches[1] || "";
-        },
-
-        isNode: function isNode(obj) {
-            if (!div) return false;
-            try {
-                obj.appendChild(div);
-                obj.removeChild(div);
-            } catch (e) {
-                return false;
-            }
-            return true;
-        },
-
-        isElement: function isElement(obj) {
-            return obj && obj.nodeType === 1 && buster.isNode(obj);
-        },
-
-        isArray: function isArray(arr) {
-            return Object.prototype.toString.call(arr) == "[object Array]";
-        },
-
-        flatten: function flatten(arr) {
-            var result = [], arr = arr || [];
-            for (var i = 0, l = arr.length; i < l; ++i) {
-                result = result.concat(buster.isArray(arr[i]) ? flatten(arr[i]) : arr[i]);
-            }
-            return result;
-        },
-
-        each: function each(arr, callback) {
-            for (var i = 0, l = arr.length; i < l; ++i) {
-                callback(arr[i]);
-            }
-        },
-
-        map: function map(arr, callback) {
-            var results = [];
-            for (var i = 0, l = arr.length; i < l; ++i) {
-                results.push(callback(arr[i]));
-            }
-            return results;
-        },
-
-        parallel: function parallel(fns, callback) {
-            function cb(err, res) {
-                if (typeof callback == "function") {
-                    callback(err, res);
-                    callback = null;
-                }
-            }
-            if (fns.length == 0) { return cb(null, []); }
-            var remaining = fns.length, results = [];
-            function makeDone(num) {
-                return function done(err, result) {
-                    if (err) { return cb(err); }
-                    results[num] = result;
-                    if (--remaining == 0) { cb(null, results); }
-                };
-            }
-            for (var i = 0, l = fns.length; i < l; ++i) {
-                fns[i](makeDone(i));
-            }
-        },
-
-        series: function series(fns, callback) {
-            function cb(err, res) {
-                if (typeof callback == "function") {
-                    callback(err, res);
-                }
-            }
-            var remaining = fns.slice();
-            var results = [];
-            function callNext() {
-                if (remaining.length == 0) return cb(null, results);
-                var promise = remaining.shift()(next);
-                if (promise && typeof promise.then == "function") {
-                    promise.then(buster.partial(next, null), next);
-                }
-            }
-            function next(err, result) {
-                if (err) return cb(err);
-                results.push(result);
-                callNext();
-            }
-            callNext();
-        },
-
-        countdown: function countdown(num, done) {
-            return function () {
-                if (--num == 0) done();
-            };
-        }
-    };
-
-    if (typeof process === "object" &&
-        typeof require === "function" && typeof module === "object") {
-        var crypto = require("crypto");
-        var path = require("path");
-
-        buster.tmpFile = function (fileName) {
-            var hashed = crypto.createHash("sha1");
-            hashed.update(fileName);
-            var tmpfileName = hashed.digest("hex");
-
-            if (process.platform == "win32") {
-                return path.join(process.env["TEMP"], tmpfileName);
-            } else {
-                return path.join("/tmp", tmpfileName);
-            }
-        };
-    }
-
-    if (Array.prototype.some) {
-        buster.some = function (arr, fn, thisp) {
-            return arr.some(fn, thisp);
-        };
-    } else {
-        // https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/some
-        buster.some = function (arr, fun, thisp) {
-                        if (arr == null) { throw new TypeError(); }
-            arr = Object(arr);
-            var len = arr.length >>> 0;
-            if (typeof fun !== "function") { throw new TypeError(); }
-
-            for (var i = 0; i < len; i++) {
-                if (arr.hasOwnProperty(i) && fun.call(thisp, arr[i], i, arr)) {
-                    return true;
-                }
-            }
-
-            return false;
-        };
-    }
-
-    if (Array.prototype.filter) {
-        buster.filter = function (arr, fn, thisp) {
-            return arr.filter(fn, thisp);
-        };
-    } else {
-        // https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/filter
-        buster.filter = function (fn, thisp) {
-                        if (this == null) { throw new TypeError(); }
-
-            var t = Object(this);
-            var len = t.length >>> 0;
-            if (typeof fn != "function") { throw new TypeError(); }
-
-            var res = [];
-            for (var i = 0; i < len; i++) {
-                if (i in t) {
-                    var val = t[i]; // in case fun mutates this
-                    if (fn.call(thisp, val, i, t)) { res.push(val); }
-                }
-            }
-
-            return res;
-        };
-    }
-
-    if (isNode) {
-        module.exports = buster;
-        buster.eventEmitter = require("./buster-event-emitter");
-        Object.defineProperty(buster, "defineVersionGetter", {
-            get: function () {
-                return require("./define-version-getter");
-            }
-        });
-    }
-
-    return buster.extend(B || {}, buster);
-}(setTimeout, buster));
-if (typeof buster === "undefined") {
-    var buster = {};
-}
-
-if (typeof module === "object" && typeof require === "function") {
-    buster = require("buster-core");
-}
-
-buster.format = buster.format || {};
-buster.format.excludeConstructors = ["Object", /^.$/];
-buster.format.quoteStrings = true;
-
-buster.format.ascii = (function () {
-    
-    var hasOwn = Object.prototype.hasOwnProperty;
-
-    var specialObjects = [];
-    if (typeof global != "undefined") {
-        specialObjects.push({ obj: global, value: "[object global]" });
-    }
-    if (typeof document != "undefined") {
-        specialObjects.push({ obj: document, value: "[object HTMLDocument]" });
-    }
-    if (typeof window != "undefined") {
-        specialObjects.push({ obj: window, value: "[object Window]" });
-    }
-
-    function keys(object) {
-        var k = Object.keys && Object.keys(object) || [];
-
-        if (k.length == 0) {
-            for (var prop in object) {
-                if (hasOwn.call(object, prop)) {
-                    k.push(prop);
-                }
-            }
-        }
-
-        return k.sort();
-    }
-
-    function isCircular(object, objects) {
-        if (typeof object != "object") {
-            return false;
-        }
-
-        for (var i = 0, l = objects.length; i < l; ++i) {
-            if (objects[i] === object) {
-                return true;
-            }
-        }
-
-        return false;
-    }
-
-    function ascii(object, processed, indent) {
-        if (typeof object == "string") {
-            var quote = typeof this.quoteStrings != "boolean" || this.quoteStrings;
-            return processed || quote ? '"' + object + '"' : object;
-        }
-
-        if (typeof object == "function" && !(object instanceof RegExp)) {
-            return ascii.func(object);
-        }
-
-        processed = processed || [];
-
-        if (isCircular(object, processed)) {
-            return "[Circular]";
-        }
-
-        if (Object.prototype.toString.call(object) == "[object Array]") {
-            return ascii.array.call(this, object, processed);
-        }
-
-        if (!object) {
-            return "" + object;
-        }
-
-        if (buster.isElement(object)) {
-            return ascii.element(object);
-        }
-
-        if (typeof object.toString == "function" &&
-            object.toString !== Object.prototype.toString) {
-            return object.toString();
-        }
-
-        for (var i = 0, l = specialObjects.length; i < l; i++) {
-            if (object === specialObjects[i].obj) {
-                return specialObjects[i].value;
-            }
-        }
-
-        return ascii.object.call(this, object, processed, indent);
-    }
-
-    ascii.func = function (func) {
-        return "function " + buster.functionName(func) + "() {}";
-    };
-
-    ascii.array = function (array, processed) {
-        processed = processed || [];
-        processed.push(array);
-        var pieces = [];
-
-        for (var i = 0, l = array.length; i < l; ++i) {
-            pieces.push(ascii.call(this, array[i], processed));
-        }
-
-        return "[" + pieces.join(", ") + "]";
-    };
-
-    ascii.object = function (object, processed, indent) {
-        processed = processed || [];
-        processed.push(object);
-        indent = indent || 0;
-        var pieces = [], properties = keys(object), prop, str, obj;
-        var is = "";
-        var length = 3;
-
-        for (var i = 0, l = indent; i < l; ++i) {
-            is += " ";
-        }
-
-        for (i = 0, l = properties.length; i < l; ++i) {
-            prop = properties[i];
-            obj = object[prop];
-
-            if (isCircular(obj, processed)) {
-                str = "[Circular]";
-            } else {
-                str = ascii.call(this, obj, processed, indent + 2);
-            }
-
-            str = (/\s/.test(prop) ? '"' + prop + '"' : prop) + ": " + str;
-            length += str.length;
-            pieces.push(str);
-        }
-
-        var cons = ascii.constructorName.call(this, object);
-        var prefix = cons ? "[" + cons + "] " : ""
-
-        return (length + indent) > 80 ?
-            prefix + "{\n  " + is + pieces.join(",\n  " + is) + "\n" + is + "}" :
-            prefix + "{ " + pieces.join(", ") + " }";
-    };
-
-    ascii.element = function (element) {
-        var tagName = element.tagName.toLowerCase();
-        var attrs = element.attributes, attribute, pairs = [], attrName;
-
-        for (var i = 0, l = attrs.length; i < l; ++i) {
-            attribute = attrs.item(i);
-            attrName = attribute.nodeName.toLowerCase().replace("html:", "");
-
-            if (attrName == "contenteditable" && attribute.nodeValue == "inherit") {
-                continue;
-            }
-
-            if (!!attribute.nodeValue) {
-                pairs.push(attrName + "=\"" + attribute.nodeValue + "\"");
-            }
-        }
-
-        var formatted = "<" + tagName + (pairs.length > 0 ? " " : "");
-        var content = element.innerHTML;
-
-        if (content.length > 20) {
-            content = content.substr(0, 20) + "[...]";
-        }
-
-        var res = formatted + pairs.join(" ") + ">" + content + "</" + tagName + ">";
-
-        return res.replace(/ contentEditable="inherit"/, "");
-    };
-
-    ascii.constructorName = function (object) {
-        var name = buster.functionName(object && object.constructor);
-        var excludes = this.excludeConstructors || buster.format.excludeConstructors || [];
-
-        for (var i = 0, l = excludes.length; i < l; ++i) {
-            if (typeof excludes[i] == "string" && excludes[i] == name) {
-                return "";
-            } else if (excludes[i].test && excludes[i].test(name)) {
-                return "";
-            }
-        }
-
-        return name;
-    };
-
-    return ascii;
-}());
-
-if (typeof module != "undefined") {
-    module.exports = buster.format;
-}
-/*jslint eqeqeq: false, onevar: false, forin: true, nomen: false, regexp: false, plusplus: false*/
-/*global module, require, __dirname, document*/
-/**
- * Sinon core utilities. For internal use only.
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-var sinon = (function (buster) {
-    var div = typeof document != "undefined" && document.createElement("div");
-    var hasOwn = Object.prototype.hasOwnProperty;
-
-    function isDOMNode(obj) {
-        var success = false;
-
-        try {
-            obj.appendChild(div);
-            success = div.parentNode == obj;
-        } catch (e) {
-            return false;
-        } finally {
-            try {
-                obj.removeChild(div);
-            } catch (e) {
-                // Remove failed, not much we can do about that
-            }
-        }
-
-        return success;
-    }
-
-    function isElement(obj) {
-        return div && obj && obj.nodeType === 1 && isDOMNode(obj);
-    }
-
-    function isFunction(obj) {
-        return typeof obj === "function" || !!(obj && obj.constructor && obj.call && obj.apply);
-    }
-
-    function mirrorProperties(target, source) {
-        for (var prop in source) {
-            if (!hasOwn.call(target, prop)) {
-                target[prop] = source[prop];
-            }
-        }
-    }
-
-    function isRestorable (obj) {
-        return typeof obj === "function" && typeof obj.restore === "function" && obj.restore.sinon;
-    }
-
-    var sinon = {
-        wrapMethod: function wrapMethod(object, property, method) {
-            if (!object) {
-                throw new TypeError("Should wrap property of object");
-            }
-
-            if (typeof method != "function") {
-                throw new TypeError("Method wrapper should be function");
-            }
-
-            var wrappedMethod = object[property];
-
-            if (!isFunction(wrappedMethod)) {
-                throw new TypeError("Attempted to wrap " + (typeof wrappedMethod) + " property " +
-                                    property + " as function");
-            }
-
-            if (wrappedMethod.restore && wrappedMethod.restore.sinon) {
-                throw new TypeError("Attempted to wrap " + property + " which is already wrapped");
-            }
-
-            if (wrappedMethod.calledBefore) {
-                var verb = !!wrappedMethod.returns ? "stubbed" : "spied on";
-                throw new TypeError("Attempted to wrap " + property + " which is already " + verb);
-            }
-
-            // IE 8 does not support hasOwnProperty on the window object.
-            var owned = hasOwn.call(object, property);
-            object[property] = method;
-            method.displayName = property;
-
-            method.restore = function () {
-                // For prototype properties try to reset by delete first.
-                // If this fails (ex: localStorage on mobile safari) then force a reset
-                // via direct assignment.
-                if (!owned) {
-                    delete object[property];
-                }
-                if (object[property] === method) {
-                    object[property] = wrappedMethod;
-                }
-            };
-
-            method.restore.sinon = true;
-            mirrorProperties(method, wrappedMethod);
-
-            return method;
-        },
-
-        extend: function extend(target) {
-            for (var i = 1, l = arguments.length; i < l; i += 1) {
-                for (var prop in arguments[i]) {
-                    if (arguments[i].hasOwnProperty(prop)) {
-                        target[prop] = arguments[i][prop];
-                    }
-
-                    // DONT ENUM bug, only care about toString
-                    if (arguments[i].hasOwnProperty("toString") &&
-                        arguments[i].toString != target.toString) {
-                        target.toString = arguments[i].toString;
-                    }
-                }
-            }
-
-            return target;
-        },
-
-        create: function create(proto) {
-            var F = function () {};
-            F.prototype = proto;
-            return new F();
-        },
-
-        deepEqual: function deepEqual(a, b) {
-            if (sinon.match && sinon.match.isMatcher(a)) {
-                return a.test(b);
-            }
-            if (typeof a != "object" || typeof b != "object") {
-                return a === b;
-            }
-
-            if (isElement(a) || isElement(b)) {
-                return a === b;
-            }
-
-            if (a === b) {
-                return true;
-            }
-
-            if ((a === null && b !== null) || (a !== null && b === null)) {
-                return false;
-            }
-
-            var aString = Object.prototype.toString.call(a);
-            if (aString != Object.prototype.toString.call(b)) {
-                return false;
-            }
-
-            if (aString == "[object Array]") {
-                if (a.length !== b.length) {
-                    return false;
-                }
-
-                for (var i = 0, l = a.length; i < l; i += 1) {
-                    if (!deepEqual(a[i], b[i])) {
-                        return false;
-                    }
-                }
-
-                return true;
-            }
-
-            var prop, aLength = 0, bLength = 0;
-
-            for (prop in a) {
-                aLength += 1;
-
-                if (!deepEqual(a[prop], b[prop])) {
-                    return false;
-                }
-            }
-
-            for (prop in b) {
-                bLength += 1;
-            }
-
-            return aLength == bLength;
-        },
-
-        functionName: function functionName(func) {
-            var name = func.displayName || func.name;
-
-            // Use function decomposition as a last resort to get function
-            // name. Does not rely on function decomposition to work - if it
-            // doesn't debugging will be slightly less informative
-            // (i.e. toString will say 'spy' rather than 'myFunc').
-            if (!name) {
-                var matches = func.toString().match(/function ([^\s\(]+)/);
-                name = matches && matches[1];
-            }
-
-            return name;
-        },
-
-        functionToString: function toString() {
-            if (this.getCall && this.callCount) {
-                var thisValue, prop, i = this.callCount;
-
-                while (i--) {
-                    thisValue = this.getCall(i).thisValue;
-
-                    for (prop in thisValue) {
-                        if (thisValue[prop] === this) {
-                            return prop;
-                        }
-                    }
-                }
-            }
-
-            return this.displayName || "sinon fake";
-        },
-
-        getConfig: function (custom) {
-            var config = {};
-            custom = custom || {};
-            var defaults = sinon.defaultConfig;
-
-            for (var prop in defaults) {
-                if (defaults.hasOwnProperty(prop)) {
-                    config[prop] = custom.hasOwnProperty(prop) ? custom[prop] : defaults[prop];
-                }
-            }
-
-            return config;
-        },
-
-        format: function (val) {
-            return "" + val;
-        },
-
-        defaultConfig: {
-            injectIntoThis: true,
-            injectInto: null,
-            properties: ["spy", "stub", "mock", "clock", "server", "requests"],
-            useFakeTimers: true,
-            useFakeServer: true
-        },
-
-        timesInWords: function timesInWords(count) {
-            return count == 1 && "once" ||
-                count == 2 && "twice" ||
-                count == 3 && "thrice" ||
-                (count || 0) + " times";
-        },
-
-        calledInOrder: function (spies) {
-            for (var i = 1, l = spies.length; i < l; i++) {
-                if (!spies[i - 1].calledBefore(spies[i]) || !spies[i].called) {
-                    return false;
-                }
-            }
-
-            return true;
-        },
-
-        orderByFirstCall: function (spies) {
-            return spies.sort(function (a, b) {
-                // uuid, won't ever be equal
-                var aCall = a.getCall(0);
-                var bCall = b.getCall(0);
-                var aId = aCall && aCall.callId || -1;
-                var bId = bCall && bCall.callId || -1;
-
-                return aId < bId ? -1 : 1;
-            });
-        },
-
-        log: function () {},
-
-        logError: function (label, err) {
-            var msg = label + " threw exception: "
-            sinon.log(msg + "[" + err.name + "] " + err.message);
-            if (err.stack) { sinon.log(err.stack); }
-
-            setTimeout(function () {
-                err.message = msg + err.message;
-                throw err;
-            }, 0);
-        },
-
-        typeOf: function (value) {
-            if (value === null) {
-                return "null";
-            }
-            else if (value === undefined) {
-                return "undefined";
-            }
-            var string = Object.prototype.toString.call(value);
-            return string.substring(8, string.length - 1).toLowerCase();
-        },
-
-        createStubInstance: function (constructor) {
-            if (typeof constructor !== "function") {
-                throw new TypeError("The constructor should be a function.");
-            }
-            return sinon.stub(sinon.create(constructor.prototype));
-        },
-
-        restore: function (object) {
-            if (object !== null && typeof object === "object") {
-                for (var prop in object) {
-                    if (isRestorable(object[prop])) {
-                        object[prop].restore();
-                    }
-                }
-            }
-            else if (isRestorable(object)) {
-                object.restore();
-            }
-        }
-    };
-
-    var isNode = typeof module == "object" && typeof require == "function";
-
-    if (isNode) {
-        try {
-            buster = { format: require("buster-format") };
-        } catch (e) {}
-        module.exports = sinon;
-        module.exports.spy = require("./sinon/spy");
-        module.exports.spyCall = require("./sinon/call");
-        module.exports.stub = require("./sinon/stub");
-        module.exports.mock = require("./sinon/mock");
-        module.exports.collection = require("./sinon/collection");
-        module.exports.assert = require("./sinon/assert");
-        module.exports.sandbox = require("./sinon/sandbox");
-        module.exports.test = require("./sinon/test");
-        module.exports.testCase = require("./sinon/test_case");
-        module.exports.assert = require("./sinon/assert");
-        module.exports.match = require("./sinon/match");
-    }
-
-    if (buster) {
-        var formatter = sinon.create(buster.format);
-        formatter.quoteStrings = false;
-        sinon.format = function () {
-            return formatter.ascii.apply(formatter, arguments);
-        };
-    } else if (isNode) {
-        try {
-            var util = require("util");
-            sinon.format = function (value) {
-                return typeof value == "object" && value.toString === Object.prototype.toString ? util.inspect(value) : value;
-            };
-        } catch (e) {
-            /* Node, but no util module - would be very old, but better safe than
-             sorry */
-        }
-    }
-
-    return sinon;
-}(typeof buster == "object" && buster));
-
-/* @depend ../sinon.js */
-/*jslint eqeqeq: false, onevar: false, plusplus: false*/
-/*global module, require, sinon*/
-/**
- * Match functions
- *
- * @author Maximilian Antoni (mail@maxantoni.de)
- * @license BSD
- *
- * Copyright (c) 2012 Maximilian Antoni
- */
-
-(function (sinon) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon) {
-        return;
-    }
-
-    function assertType(value, type, name) {
-        var actual = sinon.typeOf(value);
-        if (actual !== type) {
-            throw new TypeError("Expected type of " + name + " to be " +
-                type + ", but was " + actual);
-        }
-    }
-
-    var matcher = {
-        toString: function () {
-            return this.message;
-        }
-    };
-
-    function isMatcher(object) {
-        return matcher.isPrototypeOf(object);
-    }
-
-    function matchObject(expectation, actual) {
-        if (actual === null || actual === undefined) {
-            return false;
-        }
-        for (var key in expectation) {
-            if (expectation.hasOwnProperty(key)) {
-                var exp = expectation[key];
-                var act = actual[key];
-                if (match.isMatcher(exp)) {
-                    if (!exp.test(act)) {
-                        return false;
-                    }
-                } else if (sinon.typeOf(exp) === "object") {
-                    if (!matchObject(exp, act)) {
-                        return false;
-                    }
-                } else if (!sinon.deepEqual(exp, act)) {
-                    return false;
-                }
-            }
-        }
-        return true;
-    }
-
-    matcher.or = function (m2) {
-        if (!isMatcher(m2)) {
-            throw new TypeError("Matcher expected");
-        }
-        var m1 = this;
-        var or = sinon.create(matcher);
-        or.test = function (actual) {
-            return m1.test(actual) || m2.test(actual);
-        };
-        or.message = m1.message + ".or(" + m2.message + ")";
-        return or;
-    };
-
-    matcher.and = function (m2) {
-        if (!isMatcher(m2)) {
-            throw new TypeError("Matcher expected");
-        }
-        var m1 = this;
-        var and = sinon.create(matcher);
-        and.test = function (actual) {
-            return m1.test(actual) && m2.test(actual);
-        };
-        and.message = m1.message + ".and(" + m2.message + ")";
-        return and;
-    };
-
-    var match = function (expectation, message) {
-        var m = sinon.create(matcher);
-        var type = sinon.typeOf(expectation);
-        switch (type) {
-        case "object":
-            if (typeof expectation.test === "function") {
-                m.test = function (actual) {
-                    return expectation.test(actual) === true;
-                };
-                m.message = "match(" + sinon.functionName(expectation.test) + ")";
-                return m;
-            }
-            var str = [];
-            for (var key in expectation) {
-                if (expectation.hasOwnProperty(key)) {
-                    str.push(key + ": " + expectation[key]);
-                }
-            }
-            m.test = function (actual) {
-                return matchObject(expectation, actual);
-            };
-            m.message = "match(" + str.join(", ") + ")";
-            break;
-        case "number":
-            m.test = function (actual) {
-                return expectation == actual;
-            };
-            break;
-        case "string":
-            m.test = function (actual) {
-                if (typeof actual !== "string") {
-                    return false;
-                }
-                return actual.indexOf(expectation) !== -1;
-            };
-            m.message = "match(\"" + expectation + "\")";
-            break;
-        case "regexp":
-            m.test = function (actual) {
-                if (typeof actual !== "string") {
-                    return false;
-                }
-                return expectation.test(actual);
-            };
-            break;
-        case "function":
-            m.test = expectation;
-            if (message) {
-                m.message = message;
-            } else {
-                m.message = "match(" + sinon.functionName(expectation) + ")";
-            }
-            break;
-        default:
-            m.test = function (actual) {
-              return sinon.deepEqual(expectation, actual);
-            };
-        }
-        if (!m.message) {
-            m.message = "match(" + expectation + ")";
-        }
-        return m;
-    };
-
-    match.isMatcher = isMatcher;
-
-    match.any = match(function () {
-        return true;
-    }, "any");
-
-    match.defined = match(function (actual) {
-        return actual !== null && actual !== undefined;
-    }, "defined");
-
-    match.truthy = match(function (actual) {
-        return !!actual;
-    }, "truthy");
-
-    match.falsy = match(function (actual) {
-        return !actual;
-    }, "falsy");
-
-    match.same = function (expectation) {
-        return match(function (actual) {
-            return expectation === actual;
-        }, "same(" + expectation + ")");
-    };
-
-    match.typeOf = function (type) {
-        assertType(type, "string", "type");
-        return match(function (actual) {
-            return sinon.typeOf(actual) === type;
-        }, "typeOf(\"" + type + "\")");
-    };
-
-    match.instanceOf = function (type) {
-        assertType(type, "function", "type");
-        return match(function (actual) {
-            return actual instanceof type;
-        }, "instanceOf(" + sinon.functionName(type) + ")");
-    };
-
-    function createPropertyMatcher(propertyTest, messagePrefix) {
-        return function (property, value) {
-            assertType(property, "string", "property");
-            var onlyProperty = arguments.length === 1;
-            var message = messagePrefix + "(\"" + property + "\"";
-            if (!onlyProperty) {
-                message += ", " + value;
-            }
-            message += ")";
-            return match(function (actual) {
-                if (actual === undefined || actual === null ||
-                        !propertyTest(actual, property)) {
-                    return false;
-                }
-                return onlyProperty || sinon.deepEqual(value, actual[property]);
-            }, message);
-        };
-    }
-
-    match.has = createPropertyMatcher(function (actual, property) {
-        if (typeof actual === "object") {
-            return property in actual;
-        }
-        return actual[property] !== undefined;
-    }, "has");
-
-    match.hasOwn = createPropertyMatcher(function (actual, property) {
-        return actual.hasOwnProperty(property);
-    }, "hasOwn");
-
-    match.bool = match.typeOf("boolean");
-    match.number = match.typeOf("number");
-    match.string = match.typeOf("string");
-    match.object = match.typeOf("object");
-    match.func = match.typeOf("function");
-    match.array = match.typeOf("array");
-    match.regexp = match.typeOf("regexp");
-    match.date = match.typeOf("date");
-
-    if (commonJSModule) {
-        module.exports = match;
-    } else {
-        sinon.match = match;
-    }
-}(typeof sinon == "object" && sinon || null));
-
-/**
-  * @depend ../sinon.js
-  * @depend match.js
-  */
-/*jslint eqeqeq: false, onevar: false, plusplus: false*/
-/*global module, require, sinon*/
-/**
-  * Spy calls
-  *
-  * @author Christian Johansen (christian@cjohansen.no)
-  * @author Maximilian Antoni (mail@maxantoni.de)
-  * @license BSD
-  *
-  * Copyright (c) 2010-2013 Christian Johansen
-  * Copyright (c) 2013 Maximilian Antoni
-  */
-
-(function (sinon) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon) {
-        return;
-    }
-
-    function throwYieldError(proxy, text, args) {
-        var msg = sinon.functionName(proxy) + text;
-        if (args.length) {
-            msg += " Received [" + slice.call(args).join(", ") + "]";
-        }
-        throw new Error(msg);
-    }
-
-    var slice = Array.prototype.slice;
-
-    var callProto = {
-        calledOn: function calledOn(thisValue) {
-            if (sinon.match && sinon.match.isMatcher(thisValue)) {
-                return thisValue.test(this.thisValue);
-            }
-            return this.thisValue === thisValue;
-        },
-
-        calledWith: function calledWith() {
-            for (var i = 0, l = arguments.length; i < l; i += 1) {
-                if (!sinon.deepEqual(arguments[i], this.args[i])) {
-                    return false;
-                }
-            }
-
-            return true;
-        },
-
-        calledWithMatch: function calledWithMatch() {
-            for (var i = 0, l = arguments.length; i < l; i += 1) {
-                var actual = this.args[i];
-                var expectation = arguments[i];
-                if (!sinon.match || !sinon.match(expectation).test(actual)) {
-                    return false;
-                }
-            }
-            return true;
-        },
-
-        calledWithExactly: function calledWithExactly() {
-            return arguments.length == this.args.length &&
-                this.calledWith.apply(this, arguments);
-        },
-
-        notCalledWith: function notCalledWith() {
-            return !this.calledWith.apply(this, arguments);
-        },
-
-        notCalledWithMatch: function notCalledWithMatch() {
-            return !this.calledWithMatch.apply(this, arguments);
-        },
-
-        returned: function returned(value) {
-            return sinon.deepEqual(value, this.returnValue);
-        },
-
-        threw: function threw(error) {
-            if (typeof error === "undefined" || !this.exception) {
-                return !!this.exception;
-            }
-
-            return this.exception === error || this.exception.name === error;
-        },
-
-        calledWithNew: function calledWithNew(thisValue) {
-            return this.thisValue instanceof this.proxy;
-        },
-
-        calledBefore: function (other) {
-            return this.callId < other.callId;
-        },
-
-        calledAfter: function (other) {
-            return this.callId > other.callId;
-        },
-
-        callArg: function (pos) {
-            this.args[pos]();
-        },
-
-        callArgOn: function (pos, thisValue) {
-            this.args[pos].apply(thisValue);
-        },
-
-        callArgWith: function (pos) {
-            this.callArgOnWith.apply(this, [pos, null].concat(slice.call(arguments, 1)));
-        },
-
-        callArgOnWith: function (pos, thisValue) {
-            var args = slice.call(arguments, 2);
-            this.args[pos].apply(thisValue, args);
-        },
-
-        "yield": function () {
-            this.yieldOn.apply(this, [null].concat(slice.call(arguments, 0)));
-        },
-
-        yieldOn: function (thisValue) {
-            var args = this.args;
-            for (var i = 0, l = args.length; i < l; ++i) {
-                if (typeof args[i] === "function") {
-                    args[i].apply(thisValue, slice.call(arguments, 1));
-                    return;
-                }
-            }
-            throwYieldError(this.proxy, " cannot yield since no callback was passed.", args);
-        },
-
-        yieldTo: function (prop) {
-            this.yieldToOn.apply(this, [prop, null].concat(slice.call(arguments, 1)));
-        },
-
-        yieldToOn: function (prop, thisValue) {
-            var args = this.args;
-            for (var i = 0, l = args.length; i < l; ++i) {
-                if (args[i] && typeof args[i][prop] === "function") {
-                    args[i][prop].apply(thisValue, slice.call(arguments, 2));
-                    return;
-                }
-            }
-            throwYieldError(this.proxy, " cannot yield to '" + prop +
-                "' since no callback was passed.", args);
-        },
-
-        toString: function () {
-            var callStr = this.proxy.toString() + "(";
-            var args = [];
-
-            for (var i = 0, l = this.args.length; i < l; ++i) {
-                args.push(sinon.format(this.args[i]));
-            }
-
-            callStr = callStr + args.join(", ") + ")";
-
-            if (typeof this.returnValue != "undefined") {
-                callStr += " => " + sinon.format(this.returnValue);
-            }
-
-            if (this.exception) {
-                callStr += " !" + this.exception.name;
-
-                if (this.exception.message) {
-                    callStr += "(" + this.exception.message + ")";
-                }
-            }
-
-            return callStr;
-        }
-    };
-
-    callProto.invokeCallback = callProto.yield;
-
-    function createSpyCall(spy, thisValue, args, returnValue, exception, id) {
-        if (typeof id !== "number") {
-            throw new TypeError("Call id is not a number");
-        }
-        var proxyCall = sinon.create(callProto);
-        proxyCall.proxy = spy;
-        proxyCall.thisValue = thisValue;
-        proxyCall.args = args;
-        proxyCall.returnValue = returnValue;
-        proxyCall.exception = exception;
-        proxyCall.callId = id;
-
-        return proxyCall;
-    };
-    createSpyCall.toString = callProto.toString; // used by mocks
-
-    if (commonJSModule) {
-        module.exports = createSpyCall;
-    } else {
-        sinon.spyCall = createSpyCall;
-    }
-}(typeof sinon == "object" && sinon || null));
-
-
-/**
-  * @depend ../sinon.js
-  * @depend call.js
-  */
-/*jslint eqeqeq: false, onevar: false, plusplus: false*/
-/*global module, require, sinon*/
-/**
-  * Spy functions
-  *
-  * @author Christian Johansen (christian@cjohansen.no)
-  * @license BSD
-  *
-  * Copyright (c) 2010-2013 Christian Johansen
-  */
-
-(function (sinon) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-    var push = Array.prototype.push;
-    var slice = Array.prototype.slice;
-    var callId = 0;
-
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon) {
-        return;
-    }
-
-    function spy(object, property) {
-        if (!property && typeof object == "function") {
-            return spy.create(object);
-        }
-
-        if (!object && !property) {
-            return spy.create(function () { });
-        }
-
-        var method = object[property];
-        return sinon.wrapMethod(object, property, spy.create(method));
-    }
-
-    function matchingFake(fakes, args, strict) {
-        if (!fakes) {
-            return;
-        }
-
-        var alen = args.length;
-
-        for (var i = 0, l = fakes.length; i < l; i++) {
-            if (fakes[i].matches(args, strict)) {
-                return fakes[i];
-            }
-        }
-    }
-
-    function incrementCallCount() {
-        this.called = true;
-        this.callCount += 1;
-        this.notCalled = false;
-        this.calledOnce = this.callCount == 1;
-        this.calledTwice = this.callCount == 2;
-        this.calledThrice = this.callCount == 3;
-    }
-
-    function createCallProperties() {
-        this.firstCall = this.getCall(0);
-        this.secondCall = this.getCall(1);
-        this.thirdCall = this.getCall(2);
-        this.lastCall = this.getCall(this.callCount - 1);
-    }
-
-    var vars = "a,b,c,d,e,f,g,h,i,j,k,l";
-    function createProxy(func) {
-        // Retain the function length:
-        var p;
-        if (func.length) {
-            eval("p = (function proxy(" + vars.substring(0, func.length * 2 - 1) +
-                ") { return p.invoke(func, this, slice.call(arguments)); });");
-        }
-        else {
-            p = function proxy() {
-                return p.invoke(func, this, slice.call(arguments));
-            };
-        }
-        return p;
-    }
-
-    var uuid = 0;
-
-    // Public API
-    var spyApi = {
-        reset: function () {
-            this.called = false;
-            this.notCalled = true;
-            this.calledOnce = false;
-            this.calledTwice = false;
-            this.calledThrice = false;
-            this.callCount = 0;
-            this.firstCall = null;
-            this.secondCall = null;
-            this.thirdCall = null;
-            this.lastCall = null;
-            this.args = [];
-            this.returnValues = [];
-            this.thisValues = [];
-            this.exceptions = [];
-            this.callIds = [];
-            if (this.fakes) {
-                for (var i = 0; i < this.fakes.length; i++) {
-                    this.fakes[i].reset();
-                }
-            }
-        },
-
-        create: function create(func) {
-            var name;
-
-            if (typeof func != "function") {
-                func = function () { };
-            } else {
-                name = sinon.functionName(func);
-            }
-
-            var proxy = createProxy(func);
-
-            sinon.extend(proxy, spy);
-            delete proxy.create;
-            sinon.extend(proxy, func);
-
-            proxy.reset();
-            proxy.prototype = func.prototype;
-            proxy.displayName = name || "spy";
-            proxy.toString = sinon.functionToString;
-            proxy._create = sinon.spy.create;
-            proxy.id = "spy#" + uuid++;
-
-            return proxy;
-        },
-
-        invoke: function invoke(func, thisValue, args) {
-            var matching = matchingFake(this.fakes, args);
-            var exception, returnValue;
-
-            incrementCallCount.call(this);
-            push.call(this.thisValues, thisValue);
-            push.call(this.args, args);
-            push.call(this.callIds, callId++);
-
-            try {
-                if (matching) {
-                    returnValue = matching.invoke(func, thisValue, args);
-                } else {
-                    returnValue = (this.func || func).apply(thisValue, args);
-                }
-            } catch (e) {
-                push.call(this.returnValues, undefined);
-                exception = e;
-                throw e;
-            } finally {
-                push.call(this.exceptions, exception);
-            }
-
-            push.call(this.returnValues, returnValue);
-
-            createCallProperties.call(this);
-
-            return returnValue;
-        },
-
-        getCall: function getCall(i) {
-            if (i < 0 || i >= this.callCount) {
-                return null;
-            }
-
-            return sinon.spyCall(this, this.thisValues[i], this.args[i],
-                                    this.returnValues[i], this.exceptions[i],
-                                    this.callIds[i]);
-        },
-
-        calledBefore: function calledBefore(spyFn) {
-            if (!this.called) {
-                return false;
-            }
-
-            if (!spyFn.called) {
-                return true;
-            }
-
-            return this.callIds[0] < spyFn.callIds[spyFn.callIds.length - 1];
-        },
-
-        calledAfter: function calledAfter(spyFn) {
-            if (!this.called || !spyFn.called) {
-                return false;
-            }
-
-            return this.callIds[this.callCount - 1] > spyFn.callIds[spyFn.callCount - 1];
-        },
-
-        withArgs: function () {
-            var args = slice.call(arguments);
-
-            if (this.fakes) {
-                var match = matchingFake(this.fakes, args, true);
-
-                if (match) {
-                    return match;
-                }
-            } else {
-                this.fakes = [];
-            }
-
-            var original = this;
-            var fake = this._create();
-            fake.matchingAguments = args;
-            push.call(this.fakes, fake);
-
-            fake.withArgs = function () {
-                return original.withArgs.apply(original, arguments);
-            };
-
-            for (var i = 0; i < this.args.length; i++) {
-                if (fake.matches(this.args[i])) {
-                    incrementCallCount.call(fake);
-                    push.call(fake.thisValues, this.thisValues[i]);
-                    push.call(fake.args, this.args[i]);
-                    push.call(fake.returnValues, this.returnValues[i]);
-                    push.call(fake.exceptions, this.exceptions[i]);
-                    push.call(fake.callIds, this.callIds[i]);
-                }
-            }
-            createCallProperties.call(fake);
-
-            return fake;
-        },
-
-        matches: function (args, strict) {
-            var margs = this.matchingAguments;
-
-            if (margs.length <= args.length &&
-                sinon.deepEqual(margs, args.slice(0, margs.length))) {
-                return !strict || margs.length == args.length;
-            }
-        },
-
-        printf: function (format) {
-            var spy = this;
-            var args = slice.call(arguments, 1);
-            var formatter;
-
-            return (format || "").replace(/%(.)/g, function (match, specifyer) {
-                formatter = spyApi.formatters[specifyer];
-
-                if (typeof formatter == "function") {
-                    return formatter.call(null, spy, args);
-                } else if (!isNaN(parseInt(specifyer), 10)) {
-                    return sinon.format(args[specifyer - 1]);
-                }
-
-                return "%" + specifyer;
-            });
-        }
-    };
-
-    function delegateToCalls(method, matchAny, actual, notCalled) {
-        spyApi[method] = function () {
-            if (!this.called) {
-                if (notCalled) {
-                    return notCalled.apply(this, arguments);
-                }
-                return false;
-            }
-
-            var currentCall;
-            var matches = 0;
-
-            for (var i = 0, l = this.callCount; i < l; i += 1) {
-                currentCall = this.getCall(i);
-
-                if (currentCall[actual || method].apply(currentCall, arguments)) {
-                    matches += 1;
-
-                    if (matchAny) {
-                        return true;
-                    }
-                }
-            }
-
-            return matches === this.callCount;
-        };
-    }
-
-    delegateToCalls("calledOn", true);
-    delegateToCalls("alwaysCalledOn", false, "calledOn");
-    delegateToCalls("calledWith", true);
-    delegateToCalls("calledWithMatch", true);
-    delegateToCalls("alwaysCalledWith", false, "calledWith");
-    delegateToCalls("alwaysCalledWithMatch", false, "calledWithMatch");
-    delegateToCalls("calledWithExactly", true);
-    delegateToCalls("alwaysCalledWithExactly", false, "calledWithExactly");
-    delegateToCalls("neverCalledWith", false, "notCalledWith",
-        function () { return true; });
-    delegateToCalls("neverCalledWithMatch", false, "notCalledWithMatch",
-        function () { return true; });
-    delegateToCalls("threw", true);
-    delegateToCalls("alwaysThrew", false, "threw");
-    delegateToCalls("returned", true);
-    delegateToCalls("alwaysReturned", false, "returned");
-    delegateToCalls("calledWithNew", true);
-    delegateToCalls("alwaysCalledWithNew", false, "calledWithNew");
-    delegateToCalls("callArg", false, "callArgWith", function () {
-        throw new Error(this.toString() + " cannot call arg since it was not yet invoked.");
-    });
-    spyApi.callArgWith = spyApi.callArg;
-    delegateToCalls("callArgOn", false, "callArgOnWith", function () {
-        throw new Error(this.toString() + " cannot call arg since it was not yet invoked.");
-    });
-    spyApi.callArgOnWith = spyApi.callArgOn;
-    delegateToCalls("yield", false, "yield", function () {
-        throw new Error(this.toString() + " cannot yield since it was not yet invoked.");
-    });
-    // "invokeCallback" is an alias for "yield" since "yield" is invalid in strict mode.
-    spyApi.invokeCallback = spyApi.yield;
-    delegateToCalls("yieldOn", false, "yieldOn", function () {
-        throw new Error(this.toString() + " cannot yield since it was not yet invoked.");
-    });
-    delegateToCalls("yieldTo", false, "yieldTo", function (property) {
-        throw new Error(this.toString() + " cannot yield to '" + property +
-            "' since it was not yet invoked.");
-    });
-    delegateToCalls("yieldToOn", false, "yieldToOn", function (property) {
-        throw new Error(this.toString() + " cannot yield to '" + property +
-            "' since it was not yet invoked.");
-    });
-
-    spyApi.formatters = {
-        "c": function (spy) {
-            return sinon.timesInWords(spy.callCount);
-        },
-
-        "n": function (spy) {
-            return spy.toString();
-        },
-
-        "C": function (spy) {
-            var calls = [];
-
-            for (var i = 0, l = spy.callCount; i < l; ++i) {
-                var stringifiedCall = "    " + spy.getCall(i).toString();
-                if (/\n/.test(calls[i - 1])) {
-                    stringifiedCall = "\n" + stringifiedCall;
-                }
-                push.call(calls, stringifiedCall);
-            }
-
-            return calls.length > 0 ? "\n" + calls.join("\n") : "";
-        },
-
-        "t": function (spy) {
-            var objects = [];
-
-            for (var i = 0, l = spy.callCount; i < l; ++i) {
-                push.call(objects, sinon.format(spy.thisValues[i]));
-            }
-
-            return objects.join(", ");
-        },
-
-        "*": function (spy, args) {
-            var formatted = [];
-
-            for (var i = 0, l = args.length; i < l; ++i) {
-                push.call(formatted, sinon.format(args[i]));
-            }
-
-            return formatted.join(", ");
-        }
-    };
-
-    sinon.extend(spy, spyApi);
-
-    spy.spyCall = sinon.spyCall;
-
-    if (commonJSModule) {
-        module.exports = spy;
-    } else {
-        sinon.spy = spy;
-    }
-}(typeof sinon == "object" && sinon || null));
-
-/**
- * @depend ../sinon.js
- * @depend spy.js
- */
-/*jslint eqeqeq: false, onevar: false*/
-/*global module, require, sinon*/
-/**
- * Stub functions
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-(function (sinon) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon) {
-        return;
-    }
-
-    function stub(object, property, func) {
-        if (!!func && typeof func != "function") {
-            throw new TypeError("Custom stub should be function");
-        }
-
-        var wrapper;
-
-        if (func) {
-            wrapper = sinon.spy && sinon.spy.create ? sinon.spy.create(func) : func;
-        } else {
-            wrapper = stub.create();
-        }
-
-        if (!object && !property) {
-            return sinon.stub.create();
-        }
-
-        if (!property && !!object && typeof object == "object") {
-            for (var prop in object) {
-                if (typeof object[prop] === "function") {
-                    stub(object, prop);
-                }
-            }
-
-            return object;
-        }
-
-        return sinon.wrapMethod(object, property, wrapper);
-    }
-
-    function getChangingValue(stub, property) {
-        var index = stub.callCount - 1;
-        var values = stub[property];
-        var prop = index in values ? values[index] : values[values.length - 1];
-        stub[property + "Last"] = prop;
-
-        return prop;
-    }
-
-    function getCallback(stub, args) {
-        var callArgAt = getChangingValue(stub, "callArgAts");
-
-        if (callArgAt < 0) {
-            var callArgProp = getChangingValue(stub, "callArgProps");
-
-            for (var i = 0, l = args.length; i < l; ++i) {
-                if (!callArgProp && typeof args[i] == "function") {
-                    return args[i];
-                }
-
-                if (callArgProp && args[i] &&
-                    typeof args[i][callArgProp] == "function") {
-                    return args[i][callArgProp];
-                }
-            }
-
-            return null;
-        }
-
-        return args[callArgAt];
-    }
-
-    var join = Array.prototype.join;
-
-    function getCallbackError(stub, func, args) {
-        if (stub.callArgAtsLast < 0) {
-            var msg;
-
-            if (stub.callArgPropsLast) {
-                msg = sinon.functionName(stub) +
-                    " expected to yield to '" + stub.callArgPropsLast +
-                    "', but no object with such a property was passed."
-            } else {
-                msg = sinon.functionName(stub) +
-                            " expected to yield, but no callback was passed."
-            }
-
-            if (args.length > 0) {
-                msg += " Received [" + join.call(args, ", ") + "]";
-            }
-
-            return msg;
-        }
-
-        return "argument at index " + stub.callArgAtsLast + " is not a function: " + func;
-    }
-
-    var nextTick = (function () {
-        if (typeof process === "object" && typeof process.nextTick === "function") {
-            return process.nextTick;
-        } else if (typeof setImmediate === "function") {
-            return setImmediate;
-        } else {
-            return function (callback) {
-                setTimeout(callback, 0);
-            };
-        }
-    })();
-
-    function callCallback(stub, args) {
-        if (stub.callArgAts.length > 0) {
-            var func = getCallback(stub, args);
-
-            if (typeof func != "function") {
-                throw new TypeError(getCallbackError(stub, func, args));
-            }
-
-            var callbackArguments = getChangingValue(stub, "callbackArguments");
-            var callbackContext = getChangingValue(stub, "callbackContexts");
-
-            if (stub.callbackAsync) {
-                nextTick(function() {
-                    func.apply(callbackContext, callbackArguments);
-                });
-            } else {
-                func.apply(callbackContext, callbackArguments);
-            }
-        }
-    }
-
-    var uuid = 0;
-
-    sinon.extend(stub, (function () {
-        var slice = Array.prototype.slice, proto;
-
-        function throwsException(error, message) {
-            if (typeof error == "string") {
-                this.exception = new Error(message || "");
-                this.exception.name = error;
-            } else if (!error) {
-                this.exception = new Error("Error");
-            } else {
-                this.exception = error;
-            }
-
-            return this;
-        }
-
-        proto = {
-            create: function create() {
-                var functionStub = function () {
-
-                    callCallback(functionStub, arguments);
-
-                    if (functionStub.exception) {
-                        throw functionStub.exception;
-                    } else if (typeof functionStub.returnArgAt == 'number') {
-                        return arguments[functionStub.returnArgAt];
-                    } else if (functionStub.returnThis) {
-                        return this;
-                    }
-                    return functionStub.returnValue;
-                };
-
-                functionStub.id = "stub#" + uuid++;
-                var orig = functionStub;
-                functionStub = sinon.spy.create(functionStub);
-                functionStub.func = orig;
-
-                functionStub.callArgAts = [];
-                functionStub.callbackArguments = [];
-                functionStub.callbackContexts = [];
-                functionStub.callArgProps = [];
-
-                sinon.extend(functionStub, stub);
-                functionStub._create = sinon.stub.create;
-                functionStub.displayName = "stub";
-                functionStub.toString = sinon.functionToString;
-
-                return functionStub;
-            },
-
-            resetBehavior: function () {
-                var i;
-
-                this.callArgAts = [];
-                this.callbackArguments = [];
-                this.callbackContexts = [];
-                this.callArgProps = [];
-
-                delete this.returnValue;
-                delete this.returnArgAt;
-                this.returnThis = false;
-
-                if (this.fakes) {
-                    for (i = 0; i < this.fakes.length; i++) {
-                        this.fakes[i].resetBehavior();
-                    }
-                }
-            },
-
-            returns: function returns(value) {
-                this.returnValue = value;
-
-                return this;
-            },
-
-            returnsArg: function returnsArg(pos) {
-                if (typeof pos != "number") {
-                    throw new TypeError("argument index is not number");
-                }
-
-                this.returnArgAt = pos;
-
-                return this;
-            },
-
-            returnsThis: function returnsThis() {
-                this.returnThis = true;
-
-                return this;
-            },
-
-            "throws": throwsException,
-            throwsException: throwsException,
-
-            callsArg: function callsArg(pos) {
-                if (typeof pos != "number") {
-                    throw new TypeError("argument index is not number");
-                }
-
-                this.callArgAts.push(pos);
-                this.callbackArguments.push([]);
-                this.callbackContexts.push(undefined);
-                this.callArgProps.push(undefined);
-
-                return this;
-            },
-
-            callsArgOn: function callsArgOn(pos, context) {
-                if (typeof pos != "number") {
-                    throw new TypeError("argument index is not number");
-                }
-                if (typeof context != "object") {
-                    throw new TypeError("argument context is not an object");
-                }
-
-                this.callArgAts.push(pos);
-                this.callbackArguments.push([]);
-                this.callbackContexts.push(context);
-                this.callArgProps.push(undefined);
-
-                return this;
-            },
-
-            callsArgWith: function callsArgWith(pos) {
-                if (typeof pos != "number") {
-                    throw new TypeError("argument index is not number");
-                }
-
-                this.callArgAts.push(pos);
-                this.callbackArguments.push(slice.call(arguments, 1));
-                this.callbackContexts.push(undefined);
-                this.callArgProps.push(undefined);
-
-                return this;
-            },
-
-            callsArgOnWith: function callsArgWith(pos, context) {
-                if (typeof pos != "number") {
-                    throw new TypeError("argument index is not number");
-                }
-                if (typeof context != "object") {
-                    throw new TypeError("argument context is not an object");
-                }
-
-                this.callArgAts.push(pos);
-                this.callbackArguments.push(slice.call(arguments, 2));
-                this.callbackContexts.push(context);
-                this.callArgProps.push(undefined);
-
-                return this;
-            },
-
-            yields: function () {
-                this.callArgAts.push(-1);
-                this.callbackArguments.push(slice.call(arguments, 0));
-                this.callbackContexts.push(undefined);
-                this.callArgProps.push(undefined);
-
-                return this;
-            },
-
-            yieldsOn: function (context) {
-                if (typeof context != "object") {
-                    throw new TypeError("argument context is not an object");
-                }
-
-                this.callArgAts.push(-1);
-                this.callbackArguments.push(slice.call(arguments, 1));
-                this.callbackContexts.push(context);
-                this.callArgProps.push(undefined);
-
-                return this;
-            },
-
-            yieldsTo: function (prop) {
-                this.callArgAts.push(-1);
-                this.callbackArguments.push(slice.call(arguments, 1));
-                this.callbackContexts.push(undefined);
-                this.callArgProps.push(prop);
-
-                return this;
-            },
-
-            yieldsToOn: function (prop, context) {
-                if (typeof context != "object") {
-                    throw new TypeError("argument context is not an object");
-                }
-
-                this.callArgAts.push(-1);
-                this.callbackArguments.push(slice.call(arguments, 2));
-                this.callbackContexts.push(context);
-                this.callArgProps.push(prop);
-
-                return this;
-            }
-        };
-
-        // create asynchronous versions of callsArg* and yields* methods
-        for (var method in proto) {
-            // need to avoid creating anotherasync versions of the newly added async methods
-            if (proto.hasOwnProperty(method) &&
-                method.match(/^(callsArg|yields|thenYields$)/) &&
-                !method.match(/Async/)) {
-                proto[method + 'Async'] = (function (syncFnName) {
-                    return function () {
-                        this.callbackAsync = true;
-                        return this[syncFnName].apply(this, arguments);
-                    };
-                })(method);
-            }
-        }
-
-        return proto;
-
-    }()));
-
-    if (commonJSModule) {
-        module.exports = stub;
-    } else {
-        sinon.stub = stub;
-    }
-}(typeof sinon == "object" && sinon || null));
-
-/**
- * @depend ../sinon.js
- * @depend stub.js
- */
-/*jslint eqeqeq: false, onevar: false, nomen: false*/
-/*global module, require, sinon*/
-/**
- * Mock functions.
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-(function (sinon) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-    var push = [].push;
-
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon) {
-        return;
-    }
-
-    function mock(object) {
-        if (!object) {
-            return sinon.expectation.create("Anonymous mock");
-        }
-
-        return mock.create(object);
-    }
-
-    sinon.mock = mock;
-
-    sinon.extend(mock, (function () {
-        function each(collection, callback) {
-            if (!collection) {
-                return;
-            }
-
-            for (var i = 0, l = collection.length; i < l; i += 1) {
-                callback(collection[i]);
-            }
-        }
-
-        return {
-            create: function create(object) {
-                if (!object) {
-                    throw new TypeError("object is null");
-                }
-
-                var mockObject = sinon.extend({}, mock);
-                mockObject.object = object;
-                delete mockObject.create;
-
-                return mockObject;
-            },
-
-            expects: function expects(method) {
-                if (!method) {
-                    throw new TypeError("method is falsy");
-                }
-
-                if (!this.expectations) {
-                    this.expectations = {};
-                    this.proxies = [];
-                }
-
-                if (!this.expectations[method]) {
-                    this.expectations[method] = [];
-                    var mockObject = this;
-
-                    sinon.wrapMethod(this.object, method, function () {
-                        return mockObject.invokeMethod(method, this, arguments);
-                    });
-
-                    push.call(this.proxies, method);
-                }
-
-                var expectation = sinon.expectation.create(method);
-                push.call(this.expectations[method], expectation);
-
-                return expectation;
-            },
-
-            restore: function restore() {
-                var object = this.object;
-
-                each(this.proxies, function (proxy) {
-                    if (typeof object[proxy].restore == "function") {
-                        object[proxy].restore();
-                    }
-                });
-            },
-
-            verify: function verify() {
-                var expectations = this.expectations || {};
-                var messages = [], met = [];
-
-                each(this.proxies, function (proxy) {
-                    each(expectations[proxy], function (expectation) {
-                        if (!expectation.met()) {
-                            push.call(messages, expectation.toString());
-                        } else {
-                            push.call(met, expectation.toString());
-                        }
-                    });
-                });
-
-                this.restore();
-
-                if (messages.length > 0) {
-                    sinon.expectation.fail(messages.concat(met).join("\n"));
-                } else {
-                    sinon.expectation.pass(messages.concat(met).join("\n"));
-                }
-
-                return true;
-            },
-
-            invokeMethod: function invokeMethod(method, thisValue, args) {
-                var expectations = this.expectations && this.expectations[method];
-                var length = expectations && expectations.length || 0, i;
-
-                for (i = 0; i < length; i += 1) {
-                    if (!expectations[i].met() &&
-                        expectations[i].allowsCall(thisValue, args)) {
-                        return expectations[i].apply(thisValue, args);
-                    }
-                }
-
-                var messages = [], available, exhausted = 0;
-
-                for (i = 0; i < length; i += 1) {
-                    if (expectations[i].allowsCall(thisValue, args)) {
-                        available = available || expectations[i];
-                    } else {
-                        exhausted += 1;
-                    }
-                    push.call(messages, "    " + expectations[i].toString());
-                }
-
-                if (exhausted === 0) {
-                    return available.apply(thisValue, args);
-                }
-
-                messages.unshift("Unexpected call: " + sinon.spyCall.toString.call({
-                    proxy: method,
-                    args: args
-                }));
-
-                sinon.expectation.fail(messages.join("\n"));
-            }
-        };
-    }()));
-
-    var times = sinon.timesInWords;
-
-    sinon.expectation = (function () {
-        var slice = Array.prototype.slice;
-        var _invoke = sinon.spy.invoke;
-
-        function callCountInWords(callCount) {
-            if (callCount == 0) {
-                return "never called";
-            } else {
-                return "called " + times(callCount);
-            }
-        }
-
-        function expectedCallCountInWords(expectation) {
-            var min = expectation.minCalls;
-            var max = expectation.maxCalls;
-
-            if (typeof min == "number" && typeof max == "number") {
-                var str = times(min);
-
-                if (min != max) {
-                    str = "at least " + str + " and at most " + times(max);
-                }
-
-                return str;
-            }
-
-            if (typeof min == "number") {
-                return "at least " + times(min);
-            }
-
-            return "at most " + times(max);
-        }
-
-        function receivedMinCalls(expectation) {
-            var hasMinLimit = typeof expectation.minCalls == "number";
-            return !hasMinLimit || expectation.callCount >= expectation.minCalls;
-        }
-
-        function receivedMaxCalls(expectation) {
-            if (typeof expectation.maxCalls != "number") {
-                return false;
-            }
-
-            return expectation.callCount == expectation.maxCalls;
-        }
-
-        return {
-            minCalls: 1,
-            maxCalls: 1,
-
-            create: function create(methodName) {
-                var expectation = sinon.extend(sinon.stub.create(), sinon.expectation);
-                delete expectation.create;
-                expectation.method = methodName;
-
-                return expectation;
-            },
-
-            invoke: function invoke(func, thisValue, args) {
-                this.verifyCallAllowed(thisValue, args);
-
-                return _invoke.apply(this, arguments);
-            },
-
-            atLeast: function atLeast(num) {
-                if (typeof num != "number") {
-                    throw new TypeError("'" + num + "' is not number");
-                }
-
-                if (!this.limitsSet) {
-                    this.maxCalls = null;
-                    this.limitsSet = true;
-                }
-
-                this.minCalls = num;
-
-                return this;
-            },
-
-            atMost: function atMost(num) {
-                if (typeof num != "number") {
-                    throw new TypeError("'" + num + "' is not number");
-                }
-
-                if (!this.limitsSet) {
-                    this.minCalls = null;
-                    this.limitsSet = true;
-                }
-
-                this.maxCalls = num;
-
-                return this;
-            },
-
-            never: function never() {
-                return this.exactly(0);
-            },
-
-            once: function once() {
-                return this.exactly(1);
-            },
-
-            twice: function twice() {
-                return this.exactly(2);
-            },
-
-            thrice: function thrice() {
-                return this.exactly(3);
-            },
-
-            exactly: function exactly(num) {
-                if (typeof num != "number") {
-                    throw new TypeError("'" + num + "' is not a number");
-                }
-
-                this.atLeast(num);
-                return this.atMost(num);
-            },
-
-            met: function met() {
-                return !this.failed && receivedMinCalls(this);
-            },
-
-            verifyCallAllowed: function verifyCallAllowed(thisValue, args) {
-                if (receivedMaxCalls(this)) {
-                    this.failed = true;
-                    sinon.expectation.fail(this.method + " already called " + times(this.maxCalls));
-                }
-
-                if ("expectedThis" in this && this.expectedThis !== thisValue) {
-                    sinon.expectation.fail(this.method + " called with " + thisValue + " as thisValue, expected " +
-                        this.expectedThis);
-                }
-
-                if (!("expectedArguments" in this)) {
-                    return;
-                }
-
-                if (!args) {
-                    sinon.expectation.fail(this.method + " received no arguments, expected " +
-                        sinon.format(this.expectedArguments));
-                }
-
-                if (args.length < this.expectedArguments.length) {
-                    sinon.expectation.fail(this.method + " received too few arguments (" + sinon.format(args) +
-                        "), expected " + sinon.format(this.expectedArguments));
-                }
-
-                if (this.expectsExactArgCount &&
-                    args.length != this.expectedArguments.length) {
-                    sinon.expectation.fail(this.method + " received too many arguments (" + sinon.format(args) +
-                        "), expected " + sinon.format(this.expectedArguments));
-                }
-
-                for (var i = 0, l = this.expectedArguments.length; i < l; i += 1) {
-                    if (!sinon.deepEqual(this.expectedArguments[i], args[i])) {
-                        sinon.expectation.fail(this.method + " received wrong arguments " + sinon.format(args) +
-                            ", expected " + sinon.format(this.expectedArguments));
-                    }
-                }
-            },
-
-            allowsCall: function allowsCall(thisValue, args) {
-                if (this.met() && receivedMaxCalls(this)) {
-                    return false;
-                }
-
-                if ("expectedThis" in this && this.expectedThis !== thisValue) {
-                    return false;
-                }
-
-                if (!("expectedArguments" in this)) {
-                    return true;
-                }
-
-                args = args || [];
-
-                if (args.length < this.expectedArguments.length) {
-                    return false;
-                }
-
-                if (this.expectsExactArgCount &&
-                    args.length != this.expectedArguments.length) {
-                    return false;
-                }
-
-                for (var i = 0, l = this.expectedArguments.length; i < l; i += 1) {
-                    if (!sinon.deepEqual(this.expectedArguments[i], args[i])) {
-                        return false;
-                    }
-                }
-
-                return true;
-            },
-
-            withArgs: function withArgs() {
-                this.expectedArguments = slice.call(arguments);
-                return this;
-            },
-
-            withExactArgs: function withExactArgs() {
-                this.withArgs.apply(this, arguments);
-                this.expectsExactArgCount = true;
-                return this;
-            },
-
-            on: function on(thisValue) {
-                this.expectedThis = thisValue;
-                return this;
-            },
-
-            toString: function () {
-                var args = (this.expectedArguments || []).slice();
-
-                if (!this.expectsExactArgCount) {
-                    push.call(args, "[...]");
-                }
-
-                var callStr = sinon.spyCall.toString.call({
-                    proxy: this.method || "anonymous mock expectation",
-                    args: args
-                });
-
-                var message = callStr.replace(", [...", "[, ...") + " " +
-                    expectedCallCountInWords(this);
-
-                if (this.met()) {
-                    return "Expectation met: " + message;
-                }
-
-                return "Expected " + message + " (" +
-                    callCountInWords(this.callCount) + ")";
-            },
-
-            verify: function verify() {
-                if (!this.met()) {
-                    sinon.expectation.fail(this.toString());
-                } else {
-                    sinon.expectation.pass(this.toString());
-                }
-
-                return true;
-            },
-
-            pass: function(message) {
-              sinon.assert.pass(message);
-            },
-            fail: function (message) {
-                var exception = new Error(message);
-                exception.name = "ExpectationError";
-
-                throw exception;
-            }
-        };
-    }());
-
-    if (commonJSModule) {
-        module.exports = mock;
-    } else {
-        sinon.mock = mock;
-    }
-}(typeof sinon == "object" && sinon || null));
-
-/**
- * @depend ../sinon.js
- * @depend stub.js
- * @depend mock.js
- */
-/*jslint eqeqeq: false, onevar: false, forin: true*/
-/*global module, require, sinon*/
-/**
- * Collections of stubs, spies and mocks.
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-(function (sinon) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-    var push = [].push;
-    var hasOwnProperty = Object.prototype.hasOwnProperty;
-
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon) {
-        return;
-    }
-
-    function getFakes(fakeCollection) {
-        if (!fakeCollection.fakes) {
-            fakeCollection.fakes = [];
-        }
-
-        return fakeCollection.fakes;
-    }
-
-    function each(fakeCollection, method) {
-        var fakes = getFakes(fakeCollection);
-
-        for (var i = 0, l = fakes.length; i < l; i += 1) {
-            if (typeof fakes[i][method] == "function") {
-                fakes[i][method]();
-            }
-        }
-    }
-
-    function compact(fakeCollection) {
-        var fakes = getFakes(fakeCollection);
-        var i = 0;
-        while (i < fakes.length) {
-          fakes.splice(i, 1);
-        }
-    }
-
-    var collection = {
-        verify: function resolve() {
-            each(this, "verify");
-        },
-
-        restore: function restore() {
-            each(this, "restore");
-            compact(this);
-        },
-
-        verifyAndRestore: function verifyAndRestore() {
-            var exception;
-
-            try {
-                this.verify();
-            } catch (e) {
-                exception = e;
-            }
-
-            this.restore();
-
-            if (exception) {
-                throw exception;
-            }
-        },
-
-        add: function add(fake) {
-            push.call(getFakes(this), fake);
-            return fake;
-        },
-
-        spy: function spy() {
-            return this.add(sinon.spy.apply(sinon, arguments));
-        },
-
-        stub: function stub(object, property, value) {
-            if (property) {
-                var original = object[property];
-
-                if (typeof original != "function") {
-                    if (!hasOwnProperty.call(object, property)) {
-                        throw new TypeError("Cannot stub non-existent own property " + property);
-                    }
-
-                    object[property] = value;
-
-                    return this.add({
-                        restore: function () {
-                            object[property] = original;
-                        }
-                    });
-                }
-            }
-            if (!property && !!object && typeof object == "object") {
-                var stubbedObj = sinon.stub.apply(sinon, arguments);
-
-                for (var prop in stubbedObj) {
-                    if (typeof stubbedObj[prop] === "function") {
-                        this.add(stubbedObj[prop]);
-                    }
-                }
-
-                return stubbedObj;
-            }
-
-            return this.add(sinon.stub.apply(sinon, arguments));
-        },
-
-        mock: function mock() {
-            return this.add(sinon.mock.apply(sinon, arguments));
-        },
-
-        inject: function inject(obj) {
-            var col = this;
-
-            obj.spy = function () {
-                return col.spy.apply(col, arguments);
-            };
-
-            obj.stub = function () {
-                return col.stub.apply(col, arguments);
-            };
-
-            obj.mock = function () {
-                return col.mock.apply(col, arguments);
-            };
-
-            return obj;
-        }
-    };
-
-    if (commonJSModule) {
-        module.exports = collection;
-    } else {
-        sinon.collection = collection;
-    }
-}(typeof sinon == "object" && sinon || null));
-
-/*jslint eqeqeq: false, plusplus: false, evil: true, onevar: false, browser: true, forin: false*/
-/*global module, require, window*/
-/**
- * Fake timer API
- * setTimeout
- * setInterval
- * clearTimeout
- * clearInterval
- * tick
- * reset
- * Date
- *
- * Inspired by jsUnitMockTimeOut from JsUnit
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-if (typeof sinon == "undefined") {
-    var sinon = {};
-}
-
-(function (global) {
-    var id = 1;
-
-    function addTimer(args, recurring) {
-        if (args.length === 0) {
-            throw new Error("Function requires at least 1 parameter");
-        }
-
-        var toId = id++;
-        var delay = args[1] || 0;
-
-        if (!this.timeouts) {
-            this.timeouts = {};
-        }
-
-        this.timeouts[toId] = {
-            id: toId,
-            func: args[0],
-            callAt: this.now + delay,
-            invokeArgs: Array.prototype.slice.call(args, 2)
-        };
-
-        if (recurring === true) {
-            this.timeouts[toId].interval = delay;
-        }
-
-        return toId;
-    }
-
-    function parseTime(str) {
-        if (!str) {
-            return 0;
-        }
-
-        var strings = str.split(":");
-        var l = strings.length, i = l;
-        var ms = 0, parsed;
-
-        if (l > 3 || !/^(\d\d:){0,2}\d\d?$/.test(str)) {
-            throw new Error("tick only understands numbers and 'h:m:s'");
-        }
-
-        while (i--) {
-            parsed = parseInt(strings[i], 10);
-
-            if (parsed >= 60) {
-                throw new Error("Invalid time " + str);
-            }
-
-            ms += parsed * Math.pow(60, (l - i - 1));
-        }
-
-        return ms * 1000;
-    }
-
-    function createObject(object) {
-        var newObject;
-
-        if (Object.create) {
-            newObject = Object.create(object);
-        } else {
-            var F = function () {};
-            F.prototype = object;
-            newObject = new F();
-        }
-
-        newObject.Date.clock = newObject;
-        return newObject;
-    }
-
-    sinon.clock = {
-        now: 0,
-
-        create: function create(now) {
-            var clock = createObject(this);
-
-            if (typeof now == "number") {
-                clock.now = now;
-            }
-
-            if (!!now && typeof now == "object") {
-                throw new TypeError("now should be milliseconds since UNIX epoch");
-            }
-
-            return clock;
-        },
-
-        setTimeout: function setTimeout(callback, timeout) {
-            return addTimer.call(this, arguments, false);
-        },
-
-        clearTimeout: function clearTimeout(timerId) {
-            if (!this.timeouts) {
-                this.timeouts = [];
-            }
-
-            if (timerId in this.timeouts) {
-                delete this.timeouts[timerId];
-            }
-        },
-
-        setInterval: function setInterval(callback, timeout) {
-            return addTimer.call(this, arguments, true);
-        },
-
-        clearInterval: function clearInterval(timerId) {
-            this.clearTimeout(timerId);
-        },
-
-        tick: function tick(ms) {
-            ms = typeof ms == "number" ? ms : parseTime(ms);
-            var tickFrom = this.now, tickTo = this.now + ms, previous = this.now;
-            var timer = this.firstTimerInRange(tickFrom, tickTo);
-
-            var firstException;
-            while (timer && tickFrom <= tickTo) {
-                if (this.timeouts[timer.id]) {
-                    tickFrom = this.now = timer.callAt;
-                    try {
-                      this.callTimer(timer);
-                    } catch (e) {
-                      firstException = firstException || e;
-                    }
-                }
-
-                timer = this.firstTimerInRange(previous, tickTo);
-                previous = tickFrom;
-            }
-
-            this.now = tickTo;
-
-            if (firstException) {
-              throw firstException;
-            }
-
-            return this.now;
-        },
-
-        firstTimerInRange: function (from, to) {
-            var timer, smallest, originalTimer;
-
-            for (var id in this.timeouts) {
-                if (this.timeouts.hasOwnProperty(id)) {
-                    if (this.timeouts[id].callAt < from || this.timeouts[id].callAt > to) {
-                        continue;
-                    }
-
-                    if (!smallest || this.timeouts[id].callAt < smallest) {
-                        originalTimer = this.timeouts[id];
-                        smallest = this.timeouts[id].callAt;
-
-                        timer = {
-                            func: this.timeouts[id].func,
-                            callAt: this.timeouts[id].callAt,
-                            interval: this.timeouts[id].interval,
-                            id: this.timeouts[id].id,
-                            invokeArgs: this.timeouts[id].invokeArgs
-                        };
-                    }
-                }
-            }
-
-            return timer || null;
-        },
-
-        callTimer: function (timer) {
-            if (typeof timer.interval == "number") {
-                this.timeouts[timer.id].callAt += timer.interval;
-            } else {
-                delete this.timeouts[timer.id];
-            }
-
-            try {
-                if (typeof timer.func == "function") {
-                    timer.func.apply(null, timer.invokeArgs);
-                } else {
-                    eval(timer.func);
-                }
-            } catch (e) {
-              var exception = e;
-            }
-
-            if (!this.timeouts[timer.id]) {
-                if (exception) {
-                  throw exception;
-                }
-                return;
-            }
-
-            if (exception) {
-              throw exception;
-            }
-        },
-
-        reset: function reset() {
-            this.timeouts = {};
-        },
-
-        Date: (function () {
-            var NativeDate = Date;
-
-            function ClockDate(year, month, date, hour, minute, second, ms) {
-                // Defensive and verbose to avoid potential harm in passing
-                // explicit undefined when user does not pass argument
-                switch (arguments.length) {
-                case 0:
-                    return new NativeDate(ClockDate.clock.now);
-                case 1:
-                    return new NativeDate(year);
-                case 2:
-                    return new NativeDate(year, month);
-                case 3:
-                    return new NativeDate(year, month, date);
-                case 4:
-                    return new NativeDate(year, month, date, hour);
-                case 5:
-                    return new NativeDate(year, month, date, hour, minute);
-                case 6:
-                    return new NativeDate(year, month, date, hour, minute, second);
-                default:
-                    return new NativeDate(year, month, date, hour, minute, second, ms);
-                }
-            }
-
-            return mirrorDateProperties(ClockDate, NativeDate);
-        }())
-    };
-
-    function mirrorDateProperties(target, source) {
-        if (source.now) {
-            target.now = function now() {
-                return target.clock.now;
-            };
-        } else {
-            delete target.now;
-        }
-
-        if (source.toSource) {
-            target.toSource = function toSource() {
-                return source.toSource();
-            };
-        } else {
-            delete target.toSource;
-        }
-
-        target.toString = function toString() {
-            return source.toString();
-        };
-
-        target.prototype = source.prototype;
-        target.parse = source.parse;
-        target.UTC = source.UTC;
-        target.prototype.toUTCString = source.prototype.toUTCString;
-        return target;
-    }
-
-    var methods = ["Date", "setTimeout", "setInterval",
-                   "clearTimeout", "clearInterval"];
-
-    function restore() {
-        var method;
-
-        for (var i = 0, l = this.methods.length; i < l; i++) {
-            method = this.methods[i];
-            if (global[method].hadOwnProperty) {
-                global[method] = this["_" + method];
-            } else {
-                delete global[method];
-            }
-        }
-
-        // Prevent multiple executions which will completely remove these props
-        this.methods = [];
-    }
-
-    function stubGlobal(method, clock) {
-        clock[method].hadOwnProperty = Object.prototype.hasOwnProperty.call(global, method);
-        clock["_" + method] = global[method];
-
-        if (method == "Date") {
-            var date = mirrorDateProperties(clock[method], global[method]);
-            global[method] = date;
-        } else {
-            global[method] = function () {
-                return clock[method].apply(clock, arguments);
-            };
-
-            for (var prop in clock[method]) {
-                if (clock[method].hasOwnProperty(prop)) {
-                    global[method][prop] = clock[method][prop];
-                }
-            }
-        }
-
-        global[method].clock = clock;
-    }
-
-    sinon.useFakeTimers = function useFakeTimers(now) {
-        var clock = sinon.clock.create(now);
-        clock.restore = restore;
-        clock.methods = Array.prototype.slice.call(arguments,
-                                                   typeof now == "number" ? 1 : 0);
-
-        if (clock.methods.length === 0) {
-            clock.methods = methods;
-        }
-
-        for (var i = 0, l = clock.methods.length; i < l; i++) {
-            stubGlobal(clock.methods[i], clock);
-        }
-
-        return clock;
-    };
-}(typeof global != "undefined" && typeof global !== "function" ? global : this));
-
-sinon.timers = {
-    setTimeout: setTimeout,
-    clearTimeout: clearTimeout,
-    setInterval: setInterval,
-    clearInterval: clearInterval,
-    Date: Date
-};
-
-if (typeof module == "object" && typeof require == "function") {
-    module.exports = sinon;
-}
-
-/*jslint eqeqeq: false, onevar: false*/
-/*global sinon, module, require, ActiveXObject, XMLHttpRequest, DOMParser*/
-/**
- * Minimal Event interface implementation
- *
- * Original implementation by Sven Fuchs: https://gist.github.com/995028
- * Modifications and tests by Christian Johansen.
- *
- * @author Sven Fuchs (svenfuchs@artweb-design.de)
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2011 Sven Fuchs, Christian Johansen
- */
-
-if (typeof sinon == "undefined") {
-    this.sinon = {};
-}
-
-(function () {
-    var push = [].push;
-
-    sinon.Event = function Event(type, bubbles, cancelable, target) {
-        this.initEvent(type, bubbles, cancelable, target);
-    };
-
-    sinon.Event.prototype = {
-        initEvent: function(type, bubbles, cancelable, target) {
-            this.type = type;
-            this.bubbles = bubbles;
-            this.cancelable = cancelable;
-            this.target = target;
-        },
-
-        stopPropagation: function () {},
-
-        preventDefault: function () {
-            this.defaultPrevented = true;
-        }
-    };
-
-    sinon.EventTarget = {
-        addEventListener: function addEventListener(event, listener, useCapture) {
-            this.eventListeners = this.eventListeners || {};
-            this.eventListeners[event] = this.eventListeners[event] || [];
-            push.call(this.eventListeners[event], listener);
-        },
-
-        removeEventListener: function removeEventListener(event, listener, useCapture) {
-            var listeners = this.eventListeners && this.eventListeners[event] || [];
-
-            for (var i = 0, l = listeners.length; i < l; ++i) {
-                if (listeners[i] == listener) {
-                    return listeners.splice(i, 1);
-                }
-            }
-        },
-
-        dispatchEvent: function dispatchEvent(event) {
-            var type = event.type;
-            var listeners = this.eventListeners && this.eventListeners[type] || [];
-
-            for (var i = 0; i < listeners.length; i++) {
-                if (typeof listeners[i] == "function") {
-                    listeners[i].call(this, event);
-                } else {
-                    listeners[i].handleEvent(event);
-                }
-            }
-
-            return !!event.defaultPrevented;
-        }
-    };
-}());
-
-/**
- * @depend ../../sinon.js
- * @depend event.js
- */
-/*jslint eqeqeq: false, onevar: false*/
-/*global sinon, module, require, ActiveXObject, XMLHttpRequest, DOMParser*/
-/**
- * Fake XMLHttpRequest object
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-if (typeof sinon == "undefined") {
-    this.sinon = {};
-}
-sinon.xhr = { XMLHttpRequest: this.XMLHttpRequest };
-
-// wrapper for global
-(function(global) {
-    var xhr = sinon.xhr;
-    xhr.GlobalXMLHttpRequest = global.XMLHttpRequest;
-    xhr.GlobalActiveXObject = global.ActiveXObject;
-    xhr.supportsActiveX = typeof xhr.GlobalActiveXObject != "undefined";
-    xhr.supportsXHR = typeof xhr.GlobalXMLHttpRequest != "undefined";
-    xhr.workingXHR = xhr.supportsXHR ? xhr.GlobalXMLHttpRequest : xhr.supportsActiveX
-                                     ? function() { return new xhr.GlobalActiveXObject("MSXML2.XMLHTTP.3.0") } : false;
-
-    /*jsl:ignore*/
-    var unsafeHeaders = {
-        "Accept-Charset": true,
-        "Accept-Encoding": true,
-        "Connection": true,
-        "Content-Length": true,
-        "Cookie": true,
-        "Cookie2": true,
-        "Content-Transfer-Encoding": true,
-        "Date": true,
-        "Expect": true,
-        "Host": true,
-        "Keep-Alive": true,
-        "Referer": true,
-        "TE": true,
-        "Trailer": true,
-        "Transfer-Encoding": true,
-        "Upgrade": true,
-        "User-Agent": true,
-        "Via": true
-    };
-    /*jsl:end*/
-
-    function FakeXMLHttpRequest() {
-        this.readyState = FakeXMLHttpRequest.UNSENT;
-        this.requestHeaders = {};
-        this.requestBody = null;
-        this.status = 0;
-        this.statusText = "";
-
-        var xhr = this;
-
-        ["loadstart", "load", "abort", "loadend"].forEach(function (eventName) {
-            xhr.addEventListener(eventName, function (event) {
-                var listener = xhr["on" + eventName];
-
-                if (listener && typeof listener == "function") {
-                    listener(event);
-                }
-            });
-        });
-
-        if (typeof FakeXMLHttpRequest.onCreate == "function") {
-            FakeXMLHttpRequest.onCreate(this);
-        }
-    }
-
-    function verifyState(xhr) {
-        if (xhr.readyState !== FakeXMLHttpRequest.OPENED) {
-            throw new Error("INVALID_STATE_ERR");
-        }
-
-        if (xhr.sendFlag) {
-            throw new Error("INVALID_STATE_ERR");
-        }
-    }
-
-    // filtering to enable a white-list version of Sinon FakeXhr,
-    // where whitelisted requests are passed through to real XHR
-    function each(collection, callback) {
-        if (!collection) return;
-        for (var i = 0, l = collection.length; i < l; i += 1) {
-            callback(collection[i]);
-        }
-    }
-    function some(collection, callback) {
-        for (var index = 0; index < collection.length; index++) {
-            if(callback(collection[index]) === true) return true;
-        };
-        return false;
-    }
-    // largest arity in XHR is 5 - XHR#open
-    var apply = function(obj,method,args) {
-        switch(args.length) {
-        case 0: return obj[method]();
-        case 1: return obj[method](args[0]);
-        case 2: return obj[method](args[0],args[1]);
-        case 3: return obj[method](args[0],args[1],args[2]);
-        case 4: return obj[method](args[0],args[1],args[2],args[3]);
-        case 5: return obj[method](args[0],args[1],args[2],args[3],args[4]);
-        };
-    };
-
-    FakeXMLHttpRequest.filters = [];
-    FakeXMLHttpRequest.addFilter = function(fn) {
-        this.filters.push(fn)
-    };
-    var IE6Re = /MSIE 6/;
-    FakeXMLHttpRequest.defake = function(fakeXhr,xhrArgs) {
-        var xhr = new sinon.xhr.workingXHR();
-        each(["open","setRequestHeader","send","abort","getResponseHeader",
-              "getAllResponseHeaders","addEventListener","overrideMimeType","removeEventListener"],
-             function(method) {
-                 fakeXhr[method] = function() {
-                   return apply(xhr,method,arguments);
-                 };
-             });
-
-        var copyAttrs = function(args) {
-            each(args, function(attr) {
-              try {
-                fakeXhr[attr] = xhr[attr]
-              } catch(e) {
-                if(!IE6Re.test(navigator.userAgent)) throw e;
-              }
-            });
-        };
-
-        var stateChange = function() {
-            fakeXhr.readyState = xhr.readyState;
-            if(xhr.readyState >= FakeXMLHttpRequest.HEADERS_RECEIVED) {
-                copyAttrs(["status","statusText"]);
-            }
-            if(xhr.readyState >= FakeXMLHttpRequest.LOADING) {
-                copyAttrs(["responseText"]);
-            }
-            if(xhr.readyState === FakeXMLHttpRequest.DONE) {
-                copyAttrs(["responseXML"]);
-            }
-            if(fakeXhr.onreadystatechange) fakeXhr.onreadystatechange.call(fakeXhr);
-        };
-        if(xhr.addEventListener) {
-          for(var event in fakeXhr.eventListeners) {
-              if(fakeXhr.eventListeners.hasOwnProperty(event)) {
-                  each(fakeXhr.eventListeners[event],function(handler) {
-                      xhr.addEventListener(event, handler);
-                  });
-              }
-          }
-          xhr.addEventListener("readystatechange",stateChange);
-        } else {
-          xhr.onreadystatechange = stateChange;
-        }
-        apply(xhr,"open",xhrArgs);
-    };
-    FakeXMLHttpRequest.useFilters = false;
-
-    function verifyRequestSent(xhr) {
-        if (xhr.readyState == FakeXMLHttpRequest.DONE) {
-            throw new Error("Request done");
-        }
-    }
-
-    function verifyHeadersReceived(xhr) {
-        if (xhr.async && xhr.readyState != FakeXMLHttpRequest.HEADERS_RECEIVED) {
-            throw new Error("No headers received");
-        }
-    }
-
-    function verifyResponseBodyType(body) {
-        if (typeof body != "string") {
-            var error = new Error("Attempted to respond to fake XMLHttpRequest with " +
-                                 body + ", which is not a string.");
-            error.name = "InvalidBodyException";
-            throw error;
-        }
-    }
-
-    sinon.extend(FakeXMLHttpRequest.prototype, sinon.EventTarget, {
-        async: true,
-
-        open: function open(method, url, async, username, password) {
-            this.method = method;
-            this.url = url;
-            this.async = typeof async == "boolean" ? async : true;
-            this.username = username;
-            this.password = password;
-            this.responseText = null;
-            this.responseXML = null;
-            this.requestHeaders = {};
-            this.sendFlag = false;
-            if(sinon.FakeXMLHttpRequest.useFilters === true) {
-                var xhrArgs = arguments;
-                var defake = some(FakeXMLHttpRequest.filters,function(filter) {
-                    return filter.apply(this,xhrArgs)
-                });
-                if (defake) {
-                  return sinon.FakeXMLHttpRequest.defake(this,arguments);
-                }
-            }
-            this.readyStateChange(FakeXMLHttpRequest.OPENED);
-        },
-
-        readyStateChange: function readyStateChange(state) {
-            this.readyState = state;
-
-            if (typeof this.onreadystatechange == "function") {
-                try {
-                    this.onreadystatechange();
-                } catch (e) {
-                    sinon.logError("Fake XHR onreadystatechange handler", e);
-                }
-            }
-
-            this.dispatchEvent(new sinon.Event("readystatechange"));
-
-            switch (this.readyState) {
-                case FakeXMLHttpRequest.DONE:
-                    this.dispatchEvent(new sinon.Event("load", false, false, this));
-                    this.dispatchEvent(new sinon.Event("loadend", false, false, this));
-                    break;
-            }
-        },
-
-        setRequestHeader: function setRequestHeader(header, value) {
-            verifyState(this);
-
-            if (unsafeHeaders[header] || /^(Sec-|Proxy-)/.test(header)) {
-                throw new Error("Refused to set unsafe header \"" + header + "\"");
-            }
-
-            if (this.requestHeaders[header]) {
-                this.requestHeaders[header] += "," + value;
-            } else {
-                this.requestHeaders[header] = value;
-            }
-        },
-
-        // Helps testing
-        setResponseHeaders: function setResponseHeaders(headers) {
-            this.responseHeaders = {};
-
-            for (var header in headers) {
-                if (headers.hasOwnProperty(header)) {
-                    this.responseHeaders[header] = headers[header];
-                }
-            }
-
-            if (this.async) {
-                this.readyStateChange(FakeXMLHttpRequest.HEADERS_RECEIVED);
-            } else {
-                this.readyState = FakeXMLHttpRequest.HEADERS_RECEIVED;
-            }
-        },
-
-        // Currently treats ALL data as a DOMString (i.e. no Document)
-        send: function send(data) {
-            verifyState(this);
-
-            if (!/^(get|head)$/i.test(this.method)) {
-                if (this.requestHeaders["Content-Type"]) {
-                    var value = this.requestHeaders["Content-Type"].split(";");
-                    this.requestHeaders["Content-Type"] = value[0] + ";charset=utf-8";
-                } else {
-                    this.requestHeaders["Content-Type"] = "text/plain;charset=utf-8";
-                }
-
-                this.requestBody = data;
-            }
-
-            this.errorFlag = false;
-            this.sendFlag = this.async;
-            this.readyStateChange(FakeXMLHttpRequest.OPENED);
-
-            if (typeof this.onSend == "function") {
-                this.onSend(this);
-            }
-
-            this.dispatchEvent(new sinon.Event("loadstart", false, false, this));
-        },
-
-        abort: function abort() {
-            this.aborted = true;
-            this.responseText = null;
-            this.errorFlag = true;
-            this.requestHeaders = {};
-
-            if (this.readyState > sinon.FakeXMLHttpRequest.UNSENT && this.sendFlag) {
-                this.readyStateChange(sinon.FakeXMLHttpRequest.DONE);
-                this.sendFlag = false;
-            }
-
-            this.readyState = sinon.FakeXMLHttpRequest.UNSENT;
-
-            this.dispatchEvent(new sinon.Event("abort", false, false, this));
-            if (typeof this.onerror === "function") {
-                this.onerror();
-            }
-        },
-
-        getResponseHeader: function getResponseHeader(header) {
-            if (this.readyState < FakeXMLHttpRequest.HEADERS_RECEIVED) {
-                return null;
-            }
-
-            if (/^Set-Cookie2?$/i.test(header)) {
-                return null;
-            }
-
-            header = header.toLowerCase();
-
-            for (var h in this.responseHeaders) {
-                if (h.toLowerCase() == header) {
-                    return this.responseHeaders[h];
-                }
-            }
-
-            return null;
-        },
-
-        getAllResponseHeaders: function getAllResponseHeaders() {
-            if (this.readyState < FakeXMLHttpRequest.HEADERS_RECEIVED) {
-                return "";
-            }
-
-            var headers = "";
-
-            for (var header in this.responseHeaders) {
-                if (this.responseHeaders.hasOwnProperty(header) &&
-                    !/^Set-Cookie2?$/i.test(header)) {
-                    headers += header + ": " + this.responseHeaders[header] + "\r\n";
-                }
-            }
-
-            return headers;
-        },
-
-        setResponseBody: function setResponseBody(body) {
-            verifyRequestSent(this);
-            verifyHeadersReceived(this);
-            verifyResponseBodyType(body);
-
-            var chunkSize = this.chunkSize || 10;
-            var index = 0;
-            this.responseText = "";
-
-            do {
-                if (this.async) {
-                    this.readyStateChange(FakeXMLHttpRequest.LOADING);
-                }
-
-                this.responseText += body.substring(index, index + chunkSize);
-                index += chunkSize;
-            } while (index < body.length);
-
-            var type = this.getResponseHeader("Content-Type");
-
-            if (this.responseText &&
-                (!type || /(text\/xml)|(application\/xml)|(\+xml)/.test(type))) {
-                try {
-                    this.responseXML = FakeXMLHttpRequest.parseXML(this.responseText);
-                } catch (e) {
-                    // Unable to parse XML - no biggie
-                }
-            }
-
-            if (this.async) {
-                this.readyStateChange(FakeXMLHttpRequest.DONE);
-            } else {
-                this.readyState = FakeXMLHttpRequest.DONE;
-            }
-        },
-
-        respond: function respond(status, headers, body) {
-            this.setResponseHeaders(headers || {});
-            this.status = typeof status == "number" ? status : 200;
-            this.statusText = FakeXMLHttpRequest.statusCodes[this.status];
-            this.setResponseBody(body || "");
-            if (typeof this.onload === "function"){
-                this.onload();
-            }
-            
-        }
-    });
-
-    sinon.extend(FakeXMLHttpRequest, {
-        UNSENT: 0,
-        OPENED: 1,
-        HEADERS_RECEIVED: 2,
-        LOADING: 3,
-        DONE: 4
-    });
-
-    // Borrowed from JSpec
-    FakeXMLHttpRequest.parseXML = function parseXML(text) {
-        var xmlDoc;
-
-        if (typeof DOMParser != "undefined") {
-            var parser = new DOMParser();
-            xmlDoc = parser.parseFromString(text, "text/xml");
-        } else {
-            xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
-            xmlDoc.async = "false";
-            xmlDoc.loadXML(text);
-        }
-
-        return xmlDoc;
-    };
-
-    FakeXMLHttpRequest.statusCodes = {
-        100: "Continue",
-        101: "Switching Protocols",
-        200: "OK",
-        201: "Created",
-        202: "Accepted",
-        203: "Non-Authoritative Information",
-        204: "No Content",
-        205: "Reset Content",
-        206: "Partial Content",
-        300: "Multiple Choice",
-        301: "Moved Permanently",
-        302: "Found",
-        303: "See Other",
-        304: "Not Modified",
-        305: "Use Proxy",
-        307: "Temporary Redirect",
-        400: "Bad Request",
-        401: "Unauthorized",
-        402: "Payment Required",
-        403: "Forbidden",
-        404: "Not Found",
-        405: "Method Not Allowed",
-        406: "Not Acceptable",
-        407: "Proxy Authentication Required",
-        408: "Request Timeout",
-        409: "Conflict",
-        410: "Gone",
-        411: "Length Required",
-        412: "Precondition Failed",
-        413: "Request Entity Too Large",
-        414: "Request-URI Too Long",
-        415: "Unsupported Media Type",
-        416: "Requested Range Not Satisfiable",
-        417: "Expectation Failed",
-        422: "Unprocessable Entity",
-        500: "Internal Server Error",
-        501: "Not Implemented",
-        502: "Bad Gateway",
-        503: "Service Unavailable",
-        504: "Gateway Timeout",
-        505: "HTTP Version Not Supported"
-    };
-
-    sinon.useFakeXMLHttpRequest = function () {
-        sinon.FakeXMLHttpRequest.restore = function restore(keepOnCreate) {
-            if (xhr.supportsXHR) {
-                global.XMLHttpRequest = xhr.GlobalXMLHttpRequest;
-            }
-
-            if (xhr.supportsActiveX) {
-                global.ActiveXObject = xhr.GlobalActiveXObject;
-            }
-
-            delete sinon.FakeXMLHttpRequest.restore;
-
-            if (keepOnCreate !== true) {
-                delete sinon.FakeXMLHttpRequest.onCreate;
-            }
-        };
-        if (xhr.supportsXHR) {
-            global.XMLHttpRequest = sinon.FakeXMLHttpRequest;
-        }
-
-        if (xhr.supportsActiveX) {
-            global.ActiveXObject = function ActiveXObject(objId) {
-                if (objId == "Microsoft.XMLHTTP" || /^Msxml2\.XMLHTTP/i.test(objId)) {
-
-                    return new sinon.FakeXMLHttpRequest();
-                }
-
-                return new xhr.GlobalActiveXObject(objId);
-            };
-        }
-
-        return sinon.FakeXMLHttpRequest;
-    };
-
-    sinon.FakeXMLHttpRequest = FakeXMLHttpRequest;
-})(this);
-
-if (typeof module == "object" && typeof require == "function") {
-    module.exports = sinon;
-}
-
-/**
- * @depend fake_xml_http_request.js
- */
-/*jslint eqeqeq: false, onevar: false, regexp: false, plusplus: false*/
-/*global module, require, window*/
-/**
- * The Sinon "server" mimics a web server that receives requests from
- * sinon.FakeXMLHttpRequest and provides an API to respond to those requests,
- * both synchronously and asynchronously. To respond synchronuously, canned
- * answers have to be provided upfront.
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-if (typeof sinon == "undefined") {
-    var sinon = {};
-}
-
-sinon.fakeServer = (function () {
-    var push = [].push;
-    function F() {}
-
-    function create(proto) {
-        F.prototype = proto;
-        return new F();
-    }
-
-    function responseArray(handler) {
-        var response = handler;
-
-        if (Object.prototype.toString.call(handler) != "[object Array]") {
-            response = [200, {}, handler];
-        }
-
-        if (typeof response[2] != "string") {
-            throw new TypeError("Fake server response body should be string, but was " +
-                                typeof response[2]);
-        }
-
-        return response;
-    }
-
-    var wloc = typeof window !== "undefined" ? window.location : {};
-    var rCurrLoc = new RegExp("^" + wloc.protocol + "//" + wloc.host);
-
-    function matchOne(response, reqMethod, reqUrl) {
-        var rmeth = response.method;
-        var matchMethod = !rmeth || rmeth.toLowerCase() == reqMethod.toLowerCase();
-        var url = response.url;
-        var matchUrl = !url || url == reqUrl || (typeof url.test == "function" && url.test(reqUrl));
-
-        return matchMethod && matchUrl;
-    }
-
-    function match(response, request) {
-        var requestMethod = this.getHTTPMethod(request);
-        var requestUrl = request.url;
-
-        if (!/^https?:\/\//.test(requestUrl) || rCurrLoc.test(requestUrl)) {
-            requestUrl = requestUrl.replace(rCurrLoc, "");
-        }
-
-        if (matchOne(response, this.getHTTPMethod(request), requestUrl)) {
-            if (typeof response.response == "function") {
-                var ru = response.url;
-                var args = [request].concat(!ru ? [] : requestUrl.match(ru).slice(1));
-                return response.response.apply(response, args);
-            }
-
-            return true;
-        }
-
-        return false;
-    }
-
-    function log(response, request) {
-        var str;
-
-        str =  "Request:\n"  + sinon.format(request)  + "\n\n";
-        str += "Response:\n" + sinon.format(response) + "\n\n";
-
-        sinon.log(str);
-    }
-
-    return {
-        create: function () {
-            var server = create(this);
-            this.xhr = sinon.useFakeXMLHttpRequest();
-            server.requests = [];
-
-            this.xhr.onCreate = function (xhrObj) {
-                server.addRequest(xhrObj);
-            };
-
-            return server;
-        },
-
-        addRequest: function addRequest(xhrObj) {
-            var server = this;
-            push.call(this.requests, xhrObj);
-
-            xhrObj.onSend = function () {
-                server.handleRequest(this);
-            };
-
-            if (this.autoRespond && !this.responding) {
-                setTimeout(function () {
-                    server.responding = false;
-                    server.respond();
-                }, this.autoRespondAfter || 10);
-
-                this.responding = true;
-            }
-        },
-
-        getHTTPMethod: function getHTTPMethod(request) {
-            if (this.fakeHTTPMethods && /post/i.test(request.method)) {
-                var matches = (request.requestBody || "").match(/_method=([^\b;]+)/);
-                return !!matches ? matches[1] : request.method;
-            }
-
-            return request.method;
-        },
-
-        handleRequest: function handleRequest(xhr) {
-            if (xhr.async) {
-                if (!this.queue) {
-                    this.queue = [];
-                }
-
-                push.call(this.queue, xhr);
-            } else {
-                this.processRequest(xhr);
-            }
-        },
-
-        respondWith: function respondWith(method, url, body) {
-            if (arguments.length == 1 && typeof method != "function") {
-                this.response = responseArray(method);
-                return;
-            }
-
-            if (!this.responses) { this.responses = []; }
-
-            if (arguments.length == 1) {
-                body = method;
-                url = method = null;
-            }
-
-            if (arguments.length == 2) {
-                body = url;
-                url = method;
-                method = null;
-            }
-
-            push.call(this.responses, {
-                method: method,
-                url: url,
-                response: typeof body == "function" ? body : responseArray(body)
-            });
-        },
-
-        respond: function respond() {
-            if (arguments.length > 0) this.respondWith.apply(this, arguments);
-            var queue = this.queue || [];
-            var request;
-
-            while(request = queue.shift()) {
-                this.processRequest(request);
-            }
-        },
-
-        processRequest: function processRequest(request) {
-            try {
-                if (request.aborted) {
-                    return;
-                }
-
-                var response = this.response || [404, {}, ""];
-
-                if (this.responses) {
-                    for (var i = 0, l = this.responses.length; i < l; i++) {
-                        if (match.call(this, this.responses[i], request)) {
-                            response = this.responses[i].response;
-                            break;
-                        }
-                    }
-                }
-
-                if (request.readyState != 4) {
-                    log(response, request);
-
-                    request.respond(response[0], response[1], response[2]);
-                }
-            } catch (e) {
-                sinon.logError("Fake server request processing", e);
-            }
-        },
-
-        restore: function restore() {
-            return this.xhr.restore && this.xhr.restore.apply(this.xhr, arguments);
-        }
-    };
-}());
-
-if (typeof module == "object" && typeof require == "function") {
-    module.exports = sinon;
-}
-
-/**
- * @depend fake_server.js
- * @depend fake_timers.js
- */
-/*jslint browser: true, eqeqeq: false, onevar: false*/
-/*global sinon*/
-/**
- * Add-on for sinon.fakeServer that automatically handles a fake timer along with
- * the FakeXMLHttpRequest. The direct inspiration for this add-on is jQuery
- * 1.3.x, which does not use xhr object's onreadystatehandler at all - instead,
- * it polls the object for completion with setInterval. Dispite the direct
- * motivation, there is nothing jQuery-specific in this file, so it can be used
- * in any environment where the ajax implementation depends on setInterval or
- * setTimeout.
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-(function () {
-    function Server() {}
-    Server.prototype = sinon.fakeServer;
-
-    sinon.fakeServerWithClock = new Server();
-
-    sinon.fakeServerWithClock.addRequest = function addRequest(xhr) {
-        if (xhr.async) {
-            if (typeof setTimeout.clock == "object") {
-                this.clock = setTimeout.clock;
-            } else {
-                this.clock = sinon.useFakeTimers();
-                this.resetClock = true;
-            }
-
-            if (!this.longestTimeout) {
-                var clockSetTimeout = this.clock.setTimeout;
-                var clockSetInterval = this.clock.setInterval;
-                var server = this;
-
-                this.clock.setTimeout = function (fn, timeout) {
-                    server.longestTimeout = Math.max(timeout, server.longestTimeout || 0);
-
-                    return clockSetTimeout.apply(this, arguments);
-                };
-
-                this.clock.setInterval = function (fn, timeout) {
-                    server.longestTimeout = Math.max(timeout, server.longestTimeout || 0);
-
-                    return clockSetInterval.apply(this, arguments);
-                };
-            }
-        }
-
-        return sinon.fakeServer.addRequest.call(this, xhr);
-    };
-
-    sinon.fakeServerWithClock.respond = function respond() {
-        var returnVal = sinon.fakeServer.respond.apply(this, arguments);
-
-        if (this.clock) {
-            this.clock.tick(this.longestTimeout || 0);
-            this.longestTimeout = 0;
-
-            if (this.resetClock) {
-                this.clock.restore();
-                this.resetClock = false;
-            }
-        }
-
-        return returnVal;
-    };
-
-    sinon.fakeServerWithClock.restore = function restore() {
-        if (this.clock) {
-            this.clock.restore();
-        }
-
-        return sinon.fakeServer.restore.apply(this, arguments);
-    };
-}());
-
-/**
- * @depend ../sinon.js
- * @depend collection.js
- * @depend util/fake_timers.js
- * @depend util/fake_server_with_clock.js
- */
-/*jslint eqeqeq: false, onevar: false, plusplus: false*/
-/*global require, module*/
-/**
- * Manages fake collections as well as fake utilities such as Sinon's
- * timers and fake XHR implementation in one convenient object.
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-if (typeof module == "object" && typeof require == "function") {
-    var sinon = require("../sinon");
-    sinon.extend(sinon, require("./util/fake_timers"));
-}
-
-(function () {
-    var push = [].push;
-
-    function exposeValue(sandbox, config, key, value) {
-        if (!value) {
-            return;
-        }
-
-        if (config.injectInto) {
-            config.injectInto[key] = value;
-        } else {
-            push.call(sandbox.args, value);
-        }
-    }
-
-    function prepareSandboxFromConfig(config) {
-        var sandbox = sinon.create(sinon.sandbox);
-
-        if (config.useFakeServer) {
-            if (typeof config.useFakeServer == "object") {
-                sandbox.serverPrototype = config.useFakeServer;
-            }
-
-            sandbox.useFakeServer();
-        }
-
-        if (config.useFakeTimers) {
-            if (typeof config.useFakeTimers == "object") {
-                sandbox.useFakeTimers.apply(sandbox, config.useFakeTimers);
-            } else {
-                sandbox.useFakeTimers();
-            }
-        }
-
-        return sandbox;
-    }
-
-    sinon.sandbox = sinon.extend(sinon.create(sinon.collection), {
-        useFakeTimers: function useFakeTimers() {
-            this.clock = sinon.useFakeTimers.apply(sinon, arguments);
-
-            return this.add(this.clock);
-        },
-
-        serverPrototype: sinon.fakeServer,
-
-        useFakeServer: function useFakeServer() {
-            var proto = this.serverPrototype || sinon.fakeServer;
-
-            if (!proto || !proto.create) {
-                return null;
-            }
-
-            this.server = proto.create();
-            return this.add(this.server);
-        },
-
-        inject: function (obj) {
-            sinon.collection.inject.call(this, obj);
-
-            if (this.clock) {
-                obj.clock = this.clock;
-            }
-
-            if (this.server) {
-                obj.server = this.server;
-                obj.requests = this.server.requests;
-            }
-
-            return obj;
-        },
-
-        create: function (config) {
-            if (!config) {
-                return sinon.create(sinon.sandbox);
-            }
-
-            var sandbox = prepareSandboxFromConfig(config);
-            sandbox.args = sandbox.args || [];
-            var prop, value, exposed = sandbox.inject({});
-
-            if (config.properties) {
-                for (var i = 0, l = config.properties.length; i < l; i++) {
-                    prop = config.properties[i];
-                    value = exposed[prop] || prop == "sandbox" && sandbox;
-                    exposeValue(sandbox, config, prop, value);
-                }
-            } else {
-                exposeValue(sandbox, config, "sandbox", value);
-            }
-
-            return sandbox;
-        }
-    });
-
-    sinon.sandbox.useFakeXMLHttpRequest = sinon.sandbox.useFakeServer;
-
-    if (typeof module == "object" && typeof require == "function") {
-        module.exports = sinon.sandbox;
-    }
-}());
-
-/**
- * @depend ../sinon.js
- * @depend stub.js
- * @depend mock.js
- * @depend sandbox.js
- */
-/*jslint eqeqeq: false, onevar: false, forin: true, plusplus: false*/
-/*global module, require, sinon*/
-/**
- * Test function, sandboxes fakes
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-(function (sinon) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon) {
-        return;
-    }
-
-    function test(callback) {
-        var type = typeof callback;
-
-        if (type != "function") {
-            throw new TypeError("sinon.test needs to wrap a test function, got " + type);
-        }
-
-        return function () {
-            var config = sinon.getConfig(sinon.config);
-            config.injectInto = config.injectIntoThis && this || config.injectInto;
-            var sandbox = sinon.sandbox.create(config);
-            var exception, result;
-            var args = Array.prototype.slice.call(arguments).concat(sandbox.args);
-
-            try {
-                result = callback.apply(this, args);
-            } catch (e) {
-                exception = e;
-            }
-
-            if (typeof exception !== "undefined") {
-                sandbox.restore();
-                throw exception;
-            }
-            else {
-                sandbox.verifyAndRestore();
-            }
-
-            return result;
-        };
-    }
-
-    test.config = {
-        injectIntoThis: true,
-        injectInto: null,
-        properties: ["spy", "stub", "mock", "clock", "server", "requests"],
-        useFakeTimers: true,
-        useFakeServer: true
-    };
-
-    if (commonJSModule) {
-        module.exports = test;
-    } else {
-        sinon.test = test;
-    }
-}(typeof sinon == "object" && sinon || null));
-
-/**
- * @depend ../sinon.js
- * @depend test.js
- */
-/*jslint eqeqeq: false, onevar: false, eqeqeq: false*/
-/*global module, require, sinon*/
-/**
- * Test case, sandboxes all test functions
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-(function (sinon) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon || !Object.prototype.hasOwnProperty) {
-        return;
-    }
-
-    function createTest(property, setUp, tearDown) {
-        return function () {
-            if (setUp) {
-                setUp.apply(this, arguments);
-            }
-
-            var exception, result;
-
-            try {
-                result = property.apply(this, arguments);
-            } catch (e) {
-                exception = e;
-            }
-
-            if (tearDown) {
-                tearDown.apply(this, arguments);
-            }
-
-            if (exception) {
-                throw exception;
-            }
-
-            return result;
-        };
-    }
-
-    function testCase(tests, prefix) {
-        /*jsl:ignore*/
-        if (!tests || typeof tests != "object") {
-            throw new TypeError("sinon.testCase needs an object with test functions");
-        }
-        /*jsl:end*/
-
-        prefix = prefix || "test";
-        var rPrefix = new RegExp("^" + prefix);
-        var methods = {}, testName, property, method;
-        var setUp = tests.setUp;
-        var tearDown = tests.tearDown;
-
-        for (testName in tests) {
-            if (tests.hasOwnProperty(testName)) {
-                property = tests[testName];
-
-                if (/^(setUp|tearDown)$/.test(testName)) {
-                    continue;
-                }
-
-                if (typeof property == "function" && rPrefix.test(testName)) {
-                    method = property;
-
-                    if (setUp || tearDown) {
-                        method = createTest(property, setUp, tearDown);
-                    }
-
-                    methods[testName] = sinon.test(method);
-                } else {
-                    methods[testName] = tests[testName];
-                }
-            }
-        }
-
-        return methods;
-    }
-
-    if (commonJSModule) {
-        module.exports = testCase;
-    } else {
-        sinon.testCase = testCase;
-    }
-}(typeof sinon == "object" && sinon || null));
-
-/**
- * @depend ../sinon.js
- * @depend stub.js
- */
-/*jslint eqeqeq: false, onevar: false, nomen: false, plusplus: false*/
-/*global module, require, sinon*/
-/**
- * Assertions matching the test spy retrieval interface.
- *
- * @author Christian Johansen (christian@cjohansen.no)
- * @license BSD
- *
- * Copyright (c) 2010-2013 Christian Johansen
- */
-
-(function (sinon, global) {
-    var commonJSModule = typeof module == "object" && typeof require == "function";
-    var slice = Array.prototype.slice;
-    var assert;
-
-    if (!sinon && commonJSModule) {
-        sinon = require("../sinon");
-    }
-
-    if (!sinon) {
-        return;
-    }
-
-    function verifyIsStub() {
-        var method;
-
-        for (var i = 0, l = arguments.length; i < l; ++i) {
-            method = arguments[i];
-
-            if (!method) {
-                assert.fail("fake is not a spy");
-            }
-
-            if (typeof method != "function") {
-                assert.fail(method + " is not a function");
-            }
-
-            if (typeof method.getCall != "function") {
-                assert.fail(method + " is not stubbed");
-            }
-        }
-    }
-
-    function failAssertion(object, msg) {
-        object = object || global;
-        var failMethod = object.fail || assert.fail;
-        failMethod.call(object, msg);
-    }
-
-    function mirrorPropAsAssertion(name, method, message) {
-        if (arguments.length == 2) {
-            message = method;
-            method = name;
-        }
-
-        assert[name] = function (fake) {
-            verifyIsStub(fake);
-
-            var args = slice.call(arguments, 1);
-            var failed = false;
-
-            if (typeof method == "function") {
-                failed = !method(fake);
-            } else {
-                failed = typeof fake[method] == "function" ?
-                    !fake[method].apply(fake, args) : !fake[method];
-            }
-
-            if (failed) {
-                failAssertion(this, fake.printf.apply(fake, [message].concat(args)));
-            } else {
-                assert.pass(name);
-            }
-        };
-    }
-
-    function exposedName(prefix, prop) {
-        return !prefix || /^fail/.test(prop) ? prop :
-            prefix + prop.slice(0, 1).toUpperCase() + prop.slice(1);
-    };
-
-    assert = {
-        failException: "AssertError",
-
-        fail: function fail(message) {
-            var error = new Error(message);
-            error.name = this.failException || assert.failException;
-
-            throw error;
-        },
-
-        pass: function pass(assertion) {},
-
-        callOrder: function assertCallOrder() {
-            verifyIsStub.apply(null, arguments);
-            var expected = "", actual = "";
-
-            if (!sinon.calledInOrder(arguments)) {
-                try {
-                    expected = [].join.call(arguments, ", ");
-                    var calls = slice.call(arguments);
-                    var i = calls.length;
-                    while (i) {
-                        if (!calls[--i].called) {
-                            calls.splice(i, 1);
-                        }
-                    }
-                    actual = sinon.orderByFirstCall(calls).join(", ");
-                } catch (e) {
-                    // If this fails, we'll just fall back to the blank string
-                }
-
-                failAssertion(this, "expected " + expected + " to be " +
-                              "called in order but were called as " + actual);
-            } else {
-                assert.pass("callOrder");
-            }
-        },
-
-        callCount: function assertCallCount(method, count) {
-            verifyIsStub(method);
-
-            if (method.callCount != count) {
-                var msg = "expected %n to be called " + sinon.timesInWords(count) +
-                    " but was called %c%C";
-                failAssertion(this, method.printf(msg));
-            } else {
-                assert.pass("callCount");
-            }
-        },
-
-        expose: function expose(target, options) {
-            if (!target) {
-                throw new TypeError("target is null or undefined");
-            }
-
-            var o = options || {};
-            var prefix = typeof o.prefix == "undefined" && "assert" || o.prefix;
-            var includeFail = typeof o.includeFail == "undefined" || !!o.includeFail;
-
-            for (var method in this) {
-                if (method != "export" && (includeFail || !/^(fail)/.test(method))) {
-                    target[exposedName(prefix, method)] = this[method];
-                }
-            }
-
-            return target;
-        }
-    };
-
-    mirrorPropAsAssertion("called", "expected %n to have been called at least once but was never called");
-    mirrorPropAsAssertion("notCalled", function (spy) { return !spy.called; },
-                          "expected %n to not have been called but was called %c%C");
-    mirrorPropAsAssertion("calledOnce", "expected %n to be called once but was called %c%C");
-    mirrorPropAsAssertion("calledTwice", "expected %n to be called twice but was called %c%C");
-    mirrorPropAsAssertion("calledThrice", "expected %n to be called thrice but was called %c%C");
-    mirrorPropAsAssertion("calledOn", "expected %n to be called with %1 as this but was called with %t");
-    mirrorPropAsAssertion("alwaysCalledOn", "expected %n to always be called with %1 as this but was called with %t");
-    mirrorPropAsAssertion("calledWithNew", "expected %n to be called with new");
-    mirrorPropAsAssertion("alwaysCalledWithNew", "expected %n to always be called with new");
-    mirrorPropAsAssertion("calledWith", "expected %n to be called with arguments %*%C");
-    mirrorPropAsAssertion("calledWithMatch", "expected %n to be called with match %*%C");
-    mirrorPropAsAssertion("alwaysCalledWith", "expected %n to always be called with arguments %*%C");
-    mirrorPropAsAssertion("alwaysCalledWithMatch", "expected %n to always be called with match %*%C");
-    mirrorPropAsAssertion("calledWithExactly", "expected %n to be called with exact arguments %*%C");
-    mirrorPropAsAssertion("alwaysCalledWithExactly", "expected %n to always be called with exact arguments %*%C");
-    mirrorPropAsAssertion("neverCalledWith", "expected %n to never be called with arguments %*%C");
-    mirrorPropAsAssertion("neverCalledWithMatch", "expected %n to never be called with match %*%C");
-    mirrorPropAsAssertion("threw", "%n did not throw exception%C");
-    mirrorPropAsAssertion("alwaysThrew", "%n did not always throw exception%C");
-
-    if (commonJSModule) {
-        module.exports = assert;
-    } else {
-        sinon.assert = assert;
-    }
-}(typeof sinon == "object" && sinon || null, typeof window != "undefined" ? window : (typeof self != "undefined") ? self : global));
-
-return sinon;}.call(typeof window != 'undefined' && window || {}));
diff --git a/test/test.chocolat.js b/test/test.js
similarity index 92%
rename from test/test.chocolat.js
rename to test/test.js
index d922576..e81414a 100644
--- a/test/test.chocolat.js
+++ b/test/test.js
@@ -2,7 +2,7 @@ describe('Chocolat', function() {
     describe('Opening', function() {
         afterEach(function() {
             var chocolat = $('#example0').data('chocolat')
-            return chocolat.api().destroy()
+            chocolat.api().destroy()
         })
 
         it('should call markup function and create markup', function() {
@@ -36,7 +36,7 @@ describe('Chocolat', function() {
             )
             expect($('#container .chocolat-bottom').find('.chocolat-fullscreen').length).to.equal(1)
             expect($('#container .chocolat-bottom').find('.chocolat-set-title').length).to.equal(1)
-            return expect($('#container .chocolat-content').find('.chocolat-img').length).to.equal(
+            expect($('#container .chocolat-content').find('.chocolat-img').length).to.equal(
                 1
             )
         })
@@ -48,7 +48,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -66,7 +66,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -84,7 +84,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -109,7 +109,7 @@ describe('Chocolat', function() {
                 .trigger('click')
 
             expect(spyInit.calledOnce).to.be.true
-            return expect(spyInit.calledWithExactly(0)).to.be.true
+            expect(spyInit.calledWithExactly(0)).to.be.true
         })
 
         it('should call load function', function() {
@@ -128,7 +128,7 @@ describe('Chocolat', function() {
                 .trigger('click')
 
             expect(spyLoad.calledOnce).to.be.true
-            return expect(spyLoad.calledWithExactly(0)).to.be.true
+            expect(spyLoad.calledWithExactly(0)).to.be.true
         })
 
         it('should call markup function', function() {
@@ -146,7 +146,7 @@ describe('Chocolat', function() {
                 .first()
                 .trigger('click')
 
-            return expect(spyMarkup.calledOnce).to.be.true
+            expect(spyMarkup.calledOnce).to.be.true
         })
 
         return it('should append description element in top element (instead of bottom, the default behaviour)', function() {
@@ -168,7 +168,7 @@ describe('Chocolat', function() {
                 .trigger('click')
 
             expect(chocolat.elems.top.find(chocolat.elems.description).length).to.equal(1)
-            return expect(chocolat.elems.bottom.find(chocolat.elems.description).length).to.equal(0)
+            expect(chocolat.elems.bottom.find(chocolat.elems.description).length).to.equal(0)
         })
     })
 
@@ -176,7 +176,7 @@ describe('Chocolat', function() {
         afterEach(function() {
             var chocolat = $('#example0').data('chocolat')
             if (chocolat != null) {
-                return chocolat.api().destroy()
+                chocolat.api().destroy()
             }
         })
 
@@ -191,7 +191,7 @@ describe('Chocolat', function() {
             chocolat.api().destroy()
 
             var dataAfter = $('#example0').data('chocolat')
-            return expect(dataAfter).to.be.undefined
+            expect(dataAfter).to.be.undefined
         })
 
         it('should remove wrapper element', function(done) {
@@ -199,7 +199,7 @@ describe('Chocolat', function() {
                 .Chocolat()
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -228,14 +228,14 @@ describe('Chocolat', function() {
             chocolat.api().destroy()
 
             var eventAfter = $._data(links.first()[0], 'events')
-            return expect(typeof eventAfter).to.equal('undefined')
+            expect(typeof eventAfter).to.equal('undefined')
         })
     })
 
     describe('FullScreen', function() {
         afterEach(function() {
             var chocolat = $('#example0').data('chocolat')
-            return chocolat.api().destroy()
+            chocolat.api().destroy()
         })
 
         it('should open fullscreen when clicking .fullscreen', function(done) {
@@ -255,7 +255,7 @@ describe('Chocolat', function() {
 
             var spyOpen = sinon.spy(chocolat, 'openFullScreen')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -285,7 +285,7 @@ describe('Chocolat', function() {
 
             var spyClose = sinon.spy(chocolat, 'exitFullScreen')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -314,7 +314,7 @@ describe('Chocolat', function() {
 
             var spyClose = sinon.spy(chocolat, 'exitFullScreen')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -344,7 +344,7 @@ describe('Chocolat', function() {
 
             var spyOpen = sinon.spy(chocolat, 'openFullScreen')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -357,7 +357,7 @@ describe('Chocolat', function() {
     describe('Change image', function() {
         afterEach(function() {
             var chocolat = $('#example0').data('chocolat')
-            return chocolat.api().destroy()
+            chocolat.api().destroy()
         })
 
         it('should go to next image', function(done) {
@@ -368,7 +368,7 @@ describe('Chocolat', function() {
             var spyLoad = sinon.spy(chocolat, 'load')
             var spyChange = sinon.spy(chocolat, 'change')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -390,20 +390,20 @@ describe('Chocolat', function() {
                 .Chocolat()
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
                     var spyLoad = sinon.spy(chocolat, 'load')
 
-                    return chocolat
+                    chocolat
                         .api()
                         .next()
                         .done(function() {
                             expect(spyLoad.calledWithExactly(1)).to.be.true
                             var spyChange = sinon.spy(chocolat, 'change')
 
-                            return chocolat
+                            chocolat
                                 .api()
                                 .prev()
                                 .done(function() {
@@ -427,13 +427,13 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
                     var spyLoad = sinon.spy(chocolat, 'load')
 
-                    return chocolat
+                    chocolat
                         .api()
                         .prev()
                         .done(function() {
@@ -458,13 +458,13 @@ describe('Chocolat', function() {
 
             var lastImage = chocolat.settings.images.length - 1
 
-            return chocolat
+            chocolat
                 .api()
                 .open(lastImage)
                 .done(function() {
                     var spyLoad = sinon.spy(chocolat, 'load')
 
-                    return chocolat
+                    chocolat
                         .api()
                         .next()
                         .done(function() {
@@ -480,7 +480,7 @@ describe('Chocolat', function() {
     describe('ImageSize cover', function() {
         afterEach(function() {
             var chocolat = $('#example0').data('chocolat')
-            return chocolat.api().destroy()
+            chocolat.api().destroy()
         })
 
         it('should add class chocolat-cover to parent', function(done) {
@@ -488,7 +488,7 @@ describe('Chocolat', function() {
                 .Chocolat({ imageSize: 'cover' })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -511,7 +511,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -521,12 +521,12 @@ describe('Chocolat', function() {
                         var targetWidth = dim.imgHeight / dim.imgRatio
                         // 1px delta, because of rounded values
                         expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                        expect(dim.imgHeight).to.equal(dim.containerHeight)
+                        expect(dim.imgHeight).to.be.closeTo(dim.containerHeight, 1)
                     } else {
                         var targetHeight = dim.imgWidth * dim.imgRatio
                         // 1px delta, because of rounded values
-                        expect(dim.imgWidth).to.be.closeTo(targetHeight, 1)
-                        expect(dim.imgWidth).to.equal(dim.containerWidth)
+                        expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
+                        expect(dim.imgWidth).to.be.closeTo(dim.containerWidth, 1)
                     }
 
                     return done()
@@ -540,7 +540,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -550,12 +550,14 @@ describe('Chocolat', function() {
                         var targetWidth = dim.imgHeight / dim.imgRatio
                         // 1px delta, because of rounded values
                         expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                        expect(dim.imgHeight).to.equal(dim.containerHeight)
+                        expect(dim.imgHeight).to.be.closeTo(dim.containerHeight, 1)
                     } else {
+                        console.log('debug: ', "b")
                         var targetHeight = dim.imgWidth * dim.imgRatio
                         // 1px delta, because of rounded values
-                        expect(dim.imgWidth).to.be.closeTo(targetHeight, 1)
-                        expect(dim.imgWidth).to.equal(dim.containerWidth)
+                        console.log('debug: ',dim.imgHeight,  targetHeight)
+                        expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
+                        expect(dim.imgWidth).to.be.closeTo(dim.containerWidth, 1)
                     }
 
                     return done()
@@ -569,7 +571,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -595,7 +597,7 @@ describe('Chocolat', function() {
     describe('ImageSize contain', function() {
         afterEach(function() {
             var chocolat = $('#example0').data('chocolat')
-            return chocolat.api().destroy()
+            chocolat.api().destroy()
         })
 
         it("should have 'longest' side of the container equal to 'longest' side to the image in container", function(done) {
@@ -606,7 +608,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -616,12 +618,12 @@ describe('Chocolat', function() {
                         var targetWidth = dim.containerPaddedHeight / dim.imgRatio
                         // 1px delta, because of rounded values
                         expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                        expect(dim.imgHeight).to.equal(dim.containerPaddedHeight)
+                        expect(dim.imgHeight).to.be.closeTo(dim.containerPaddedHeight, 1)
                     } else {
                         var targetHeight = dim.containerPaddedWidth * dim.imgRatio
                         // 1px delta, because of rounded values
                         expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
-                        expect(dim.imgWidth).to.equal(dim.containerPaddedWidth)
+                        expect(dim.imgWidth).to.be.closeTo(dim.containerPaddedWidth, 1)
                     }
 
                     return done()
@@ -635,7 +637,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
@@ -645,12 +647,12 @@ describe('Chocolat', function() {
                         var targetWidth = dim.containerPaddedHeight / dim.imgRatio
                         // 1px delta, because of rounded values
                         expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                        expect(dim.imgHeight).to.equal(dim.containerPaddedHeight)
+                        expect(dim.imgHeight).to.be.closeTo(dim.containerPaddedHeight, 1)
                     } else {
                         var targetHeight = dim.containerPaddedWidth * dim.imgRatio
                         // 1px delta, because of rounded values
                         expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
-                        expect(dim.imgWidth).to.equal(dim.containerPaddedWidth)
+                        expect(dim.imgWidth).to.be.closeTo(dim.containerPaddedWidth, 1)
                     }
 
                     return done()
@@ -664,7 +666,7 @@ describe('Chocolat', function() {
                 })
                 .data('chocolat')
 
-            return chocolat
+            chocolat
                 .api()
                 .open()
                 .done(function() {
diff --git a/yarn.lock b/yarn.lock
index 5ed749b..c1783ff 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -113,22 +113,49 @@
     lodash "^4.17.10"
     to-fast-properties "^2.0.0"
 
+"@sinonjs/commons@^1.0.2", "@sinonjs/commons@^1.2.0":
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.3.0.tgz#50a2754016b6f30a994ceda6d9a0a8c36adda849"
+  dependencies:
+    type-detect "4.0.8"
+
+"@sinonjs/formatio@^3.1.0":
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/@sinonjs/formatio/-/formatio-3.1.0.tgz#6ac9d1eb1821984d84c4996726e45d1646d8cce5"
+  dependencies:
+    "@sinonjs/samsam" "^2 || ^3"
+
+"@sinonjs/samsam@^2 || ^3", "@sinonjs/samsam@^3.0.2":
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-3.0.2.tgz#304fb33bd5585a0b2df8a4c801fcb47fa84d8e43"
+  dependencies:
+    "@sinonjs/commons" "^1.0.2"
+    array-from "^2.1.1"
+    lodash.get "^4.4.2"
+
+"@types/core-js@^0.9.41":
+  version "0.9.46"
+  resolved "https://registry.yarnpkg.com/@types/core-js/-/core-js-0.9.46.tgz#ea701ee34cbb6dfe6d100f1530319547c93c8d79"
+
 "@types/estree@0.0.39":
   version "0.0.39"
   resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.39.tgz#e177e699ee1b8c22d23174caaa7422644389509f"
 
+"@types/mkdirp@^0.3.29":
+  version "0.3.29"
+  resolved "http://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.3.29.tgz#7f2ad7ec55f914482fc9b1ec4bb1ae6028d46066"
+
 "@types/node@*":
   version "10.12.18"
   resolved "https://registry.yarnpkg.com/@types/node/-/node-10.12.18.tgz#1d3ca764718915584fcd9f6344621b7672665c67"
 
-ajv@^6.5.5:
-  version "6.5.5"
-  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.5.5.tgz#cf97cdade71c6399a92c6d6c4177381291b781a1"
-  dependencies:
-    fast-deep-equal "^2.0.1"
-    fast-json-stable-stringify "^2.0.0"
-    json-schema-traverse "^0.4.1"
-    uri-js "^4.2.2"
+"@types/node@^9.3.0":
+  version "9.6.41"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-9.6.41.tgz#e57c3152eb2e7ec748c733cebd0c095b437c5d37"
+
+"@types/rimraf@^0.0.28":
+  version "0.0.28"
+  resolved "http://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz#5562519bc7963caca8abf7f128cae3b594d41d06"
 
 align-text@^0.1.1, align-text@^0.1.3:
   version "0.1.4"
@@ -192,6 +219,14 @@ array-each@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/array-each/-/array-each-1.0.1.tgz#a794af0c05ab1752846ee753a1f211a05ba0c44f"
 
+array-find-index@^1.0.1:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/array-find-index/-/array-find-index-1.0.2.tgz#df010aa1287e164bbda6f9723b0a96a1ec4187a1"
+
+array-from@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/array-from/-/array-from-2.1.1.tgz#cfe9d8c26628b9dc5aecc62a9f5d8f1f352c1195"
+
 array-slice@^1.0.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/array-slice/-/array-slice-1.1.0.tgz#e368ea15f89bc7069f7ffb89aec3a6c7d4ac22d4"
@@ -208,21 +243,11 @@ array-unique@^0.3.2:
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
 
-asn1@~0.2.3:
-  version "0.2.4"
-  resolved "https://registry.yarnpkg.com/asn1/-/asn1-0.2.4.tgz#8d2475dfab553bb33e77b54e59e880bb8ce23136"
-  dependencies:
-    safer-buffer "~2.1.0"
-
-assert-plus@1.0.0, assert-plus@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/assert-plus/-/assert-plus-1.0.0.tgz#f12e0f3c5d77b0b1cdd9146942e4e96c1e4dd525"
-
-assert-plus@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/assert-plus/-/assert-plus-0.2.0.tgz#d74e1b87e7affc0db8aadb7021f3fe48101ab234"
+arrify@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
 
-assertion-error@^1.0.1:
+assertion-error@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/assertion-error/-/assertion-error-1.1.0.tgz#e60b6b0e8f301bd97e5375215bda406c85118c0b"
 
@@ -230,36 +255,18 @@ assign-symbols@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/assign-symbols/-/assign-symbols-1.0.0.tgz#59667f41fadd4f20ccbc2bb96b8d4f7f78ec0367"
 
-async@^2.0.1:
-  version "2.6.1"
-  resolved "https://registry.yarnpkg.com/async/-/async-2.6.1.tgz#b245a23ca71930044ec53fa46aa00a3e87c6a610"
-  dependencies:
-    lodash "^4.17.10"
+async-limiter@~1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.0.tgz#78faed8c3d074ab81f22b4e985d79e8738f720f8"
 
 async@~0.2.6:
   version "0.2.10"
   resolved "http://registry.npmjs.org/async/-/async-0.2.10.tgz#b6bbe0b0674b9d719708ca38de8c237cb526c3d1"
 
-asynckit@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79"
-
 atob@^2.1.1:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
 
-aws-sign2@~0.6.0:
-  version "0.6.0"
-  resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.6.0.tgz#14342dd38dbcc94d0e5b87d763cd63612c0e794f"
-
-aws-sign2@~0.7.0:
-  version "0.7.0"
-  resolved "https://registry.yarnpkg.com/aws-sign2/-/aws-sign2-0.7.0.tgz#b46e890934a9591f2d2f6f86d7e6a9f1b3fe76a8"
-
-aws4@^1.8.0:
-  version "1.8.0"
-  resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.8.0.tgz#f0e003d9ca9e7f59c7a508945d7b2ef9a04a542f"
-
 babel-code-frame@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
@@ -268,6 +275,43 @@ babel-code-frame@^6.26.0:
     esutils "^2.0.2"
     js-tokens "^3.0.2"
 
+babel-core@^6.26.0:
+  version "6.26.3"
+  resolved "https://registry.yarnpkg.com/babel-core/-/babel-core-6.26.3.tgz#b2e2f09e342d0f0c88e2f02e067794125e75c207"
+  dependencies:
+    babel-code-frame "^6.26.0"
+    babel-generator "^6.26.0"
+    babel-helpers "^6.24.1"
+    babel-messages "^6.23.0"
+    babel-register "^6.26.0"
+    babel-runtime "^6.26.0"
+    babel-template "^6.26.0"
+    babel-traverse "^6.26.0"
+    babel-types "^6.26.0"
+    babylon "^6.18.0"
+    convert-source-map "^1.5.1"
+    debug "^2.6.9"
+    json5 "^0.5.1"
+    lodash "^4.17.4"
+    minimatch "^3.0.4"
+    path-is-absolute "^1.0.1"
+    private "^0.1.8"
+    slash "^1.0.0"
+    source-map "^0.5.7"
+
+babel-generator@^6.26.0:
+  version "6.26.1"
+  resolved "https://registry.yarnpkg.com/babel-generator/-/babel-generator-6.26.1.tgz#1844408d3b8f0d35a404ea7ac180f087a601bd90"
+  dependencies:
+    babel-messages "^6.23.0"
+    babel-runtime "^6.26.0"
+    babel-types "^6.26.0"
+    detect-indent "^4.0.0"
+    jsesc "^1.3.0"
+    lodash "^4.17.4"
+    source-map "^0.5.7"
+    trim-right "^1.0.1"
+
 babel-helper-builder-binary-assignment-operator-visitor@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-helper-builder-binary-assignment-operator-visitor/-/babel-helper-builder-binary-assignment-operator-visitor-6.24.1.tgz#cce4517ada356f4220bcae8a02c2b346f9a56664"
@@ -362,6 +406,13 @@ babel-helper-replace-supers@^6.24.1:
     babel-traverse "^6.24.1"
     babel-types "^6.24.1"
 
+babel-helpers@^6.24.1:
+  version "6.24.1"
+  resolved "https://registry.yarnpkg.com/babel-helpers/-/babel-helpers-6.24.1.tgz#3471de9caec388e5c850e597e58a26ddf37602b2"
+  dependencies:
+    babel-runtime "^6.22.0"
+    babel-template "^6.24.1"
+
 babel-messages@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.23.0.tgz#f3cdf4703858035b2a2951c6ec5edf6c62f2630e"
@@ -510,7 +561,7 @@ babel-plugin-transform-es2015-object-super@^6.22.0:
     babel-helper-replace-supers "^6.24.1"
     babel-runtime "^6.22.0"
 
-babel-plugin-transform-es2015-parameters@^6.23.0:
+babel-plugin-transform-es2015-parameters@^6.23.0, babel-plugin-transform-es2015-parameters@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-es2015-parameters/-/babel-plugin-transform-es2015-parameters-6.24.1.tgz#57ac351ab49caf14a97cd13b09f66fdf0a625f2b"
   dependencies:
@@ -583,7 +634,15 @@ babel-plugin-transform-strict-mode@^6.24.1:
     babel-runtime "^6.22.0"
     babel-types "^6.24.1"
 
-babel-preset-env@^1.7.0:
+babel-polyfill@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-polyfill/-/babel-polyfill-6.26.0.tgz#379937abc67d7895970adc621f284cd966cf2153"
+  dependencies:
+    babel-runtime "^6.26.0"
+    core-js "^2.5.0"
+    regenerator-runtime "^0.10.5"
+
+babel-preset-env@^1.6.1, babel-preset-env@^1.7.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/babel-preset-env/-/babel-preset-env-1.7.0.tgz#dea79fa4ebeb883cd35dab07e260c1c9c04df77a"
   dependencies:
@@ -618,6 +677,18 @@ babel-preset-env@^1.7.0:
     invariant "^2.2.2"
     semver "^5.3.0"
 
+babel-register@^6.26.0:
+  version "6.26.0"
+  resolved "https://registry.yarnpkg.com/babel-register/-/babel-register-6.26.0.tgz#6ed021173e2fcb486d7acb45c6009a856f647071"
+  dependencies:
+    babel-core "^6.26.0"
+    babel-runtime "^6.26.0"
+    core-js "^2.5.0"
+    home-or-tmp "^2.0.0"
+    lodash "^4.17.4"
+    mkdirp "^0.5.1"
+    source-map-support "^0.4.15"
+
 babel-runtime@^6.18.0, babel-runtime@^6.22.0, babel-runtime@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
@@ -678,28 +749,10 @@ base@^0.11.1:
     mixin-deep "^1.2.0"
     pascalcase "^0.1.1"
 
-bcrypt-pbkdf@^1.0.0:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.2.tgz#a4301d389b6a43f9b67ff3ca11a3f6637e360e9e"
-  dependencies:
-    tweetnacl "^0.14.3"
-
 beeper@^1.0.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/beeper/-/beeper-1.1.1.tgz#e6d5ea8c5dad001304a70b22638447f69cb2f809"
 
-bl@~1.0.0:
-  version "1.0.3"
-  resolved "http://registry.npmjs.org/bl/-/bl-1.0.3.tgz#fc5421a28fd4226036c3b3891a66a25bc64d226e"
-  dependencies:
-    readable-stream "~2.0.5"
-
-boom@2.x.x:
-  version "2.10.1"
-  resolved "http://registry.npmjs.org/boom/-/boom-2.10.1.tgz#39c8918ceff5799f83f9492a848f625add0c766f"
-  dependencies:
-    hoek "2.x.x"
-
 brace-expansion@^1.0.0, brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
@@ -730,6 +783,10 @@ braces@^2.3.1:
     split-string "^3.0.2"
     to-regex "^3.0.1"
 
+browser-stdout@1.3.1:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/browser-stdout/-/browser-stdout-1.3.1.tgz#baa559ee14ced73452229bad7326467c61fabd60"
+
 browserslist@^3.2.6:
   version "3.2.8"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-3.2.8.tgz#b0005361d6471f0f5952797a76fc985f1f978fc6"
@@ -737,9 +794,9 @@ browserslist@^3.2.6:
     caniuse-lite "^1.0.30000844"
     electron-to-chromium "^1.3.47"
 
-buffer-from@^1.0.0:
+builtin-modules@^1.0.0:
   version "1.1.1"
-  resolved "https://registry.yarnpkg.com/buffer-from/-/buffer-from-1.1.1.tgz#32713bc028f75c02fdb710d7c7bcec1f2c6070ef"
+  resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f"
 
 builtin-modules@^3.0.0:
   version "3.0.0"
@@ -759,22 +816,26 @@ cache-base@^1.0.1:
     union-value "^1.0.0"
     unset-value "^1.0.0"
 
+camelcase-keys@^4.0.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-4.2.0.tgz#a2aa5fb1af688758259c32c141426d78923b9b77"
+  dependencies:
+    camelcase "^4.1.0"
+    map-obj "^2.0.0"
+    quick-lru "^1.0.0"
+
 camelcase@^1.0.2:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-1.2.1.tgz#9bb5304d2e0b56698b2c758b08a3eaa9daa58a39"
 
+camelcase@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-4.1.0.tgz#d545635be1e33c542649c69173e5de6acfae34dd"
+
 caniuse-lite@^1.0.30000844:
   version "1.0.30000923"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000923.tgz#148f9bda508024b5ce957b463ae2e8302b451bb2"
 
-caseless@~0.11.0:
-  version "0.11.0"
-  resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.11.0.tgz#715b96ea9841593cc33067923f5ec60ebda4f7d7"
-
-caseless@~0.12.0:
-  version "0.12.0"
-  resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.12.0.tgz#1b681c21ff84033c826543090689420d187151dc"
-
 center-align@^0.1.1:
   version "0.1.3"
   resolved "https://registry.yarnpkg.com/center-align/-/center-align-0.1.3.tgz#aa0d32629b6ee972200411cbd4461c907bc2b7ad"
@@ -782,15 +843,18 @@ center-align@^0.1.1:
     align-text "^0.1.3"
     lazy-cache "^1.0.3"
 
-chai@^3.0.0:
-  version "3.5.0"
-  resolved "http://registry.npmjs.org/chai/-/chai-3.5.0.tgz#4d02637b067fe958bdbfdd3a40ec56fef7373247"
+chai@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/chai/-/chai-4.2.0.tgz#760aa72cf20e3795e84b12877ce0e83737aa29e5"
   dependencies:
-    assertion-error "^1.0.1"
-    deep-eql "^0.1.3"
-    type-detect "^1.0.0"
+    assertion-error "^1.1.0"
+    check-error "^1.0.2"
+    deep-eql "^3.0.1"
+    get-func-name "^2.0.0"
+    pathval "^1.1.0"
+    type-detect "^4.0.5"
 
-chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3:
+chalk@^1.0.0, chalk@^1.1.3:
   version "1.1.3"
   resolved "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
   dependencies:
@@ -800,7 +864,7 @@ chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3:
     strip-ansi "^3.0.0"
     supports-color "^2.0.0"
 
-chalk@^2.0.0:
+chalk@^2.0.0, chalk@^2.0.1:
   version "2.4.1"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.1.tgz#18c49ab16a037b6eb0152cc83e3471338215b66e"
   dependencies:
@@ -808,6 +872,34 @@ chalk@^2.0.0:
     escape-string-regexp "^1.0.5"
     supports-color "^5.3.0"
 
+check-error@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/check-error/-/check-error-1.0.2.tgz#574d312edd88bb5dd8912e9286dd6c0aed4aac82"
+
+chrome-launcher@^0.10.2:
+  version "0.10.5"
+  resolved "https://registry.yarnpkg.com/chrome-launcher/-/chrome-launcher-0.10.5.tgz#d0aa72c11f1653e6a60dfebea171522447470ef1"
+  dependencies:
+    "@types/core-js" "^0.9.41"
+    "@types/mkdirp" "^0.3.29"
+    "@types/node" "^9.3.0"
+    "@types/rimraf" "^0.0.28"
+    is-wsl "^1.1.0"
+    lighthouse-logger "^1.0.0"
+    mkdirp "0.5.1"
+    rimraf "^2.6.1"
+
+chrome-remote-interface@^0.25.2:
+  version "0.25.7"
+  resolved "https://registry.yarnpkg.com/chrome-remote-interface/-/chrome-remote-interface-0.25.7.tgz#827e85fbef3cc561a9ef2404eb7eee355968c5bc"
+  dependencies:
+    commander "2.11.x"
+    ws "3.3.x"
+
+chrome-unmirror@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/chrome-unmirror/-/chrome-unmirror-0.1.0.tgz#e9af78ba47f7ffb90060293a720a01cd26d50bab"
+
 class-utils@^0.3.5:
   version "0.3.6"
   resolved "https://registry.yarnpkg.com/class-utils/-/class-utils-0.3.6.tgz#f93369ae8b9a7ce02fd41faad0ca83033190c463"
@@ -858,21 +950,15 @@ color-support@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
 
-combined-stream@^1.0.5, combined-stream@^1.0.6, combined-stream@~1.0.5, combined-stream@~1.0.6:
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.7.tgz#2d1d24317afb8abe95d6d2c0b07b57813539d828"
-  dependencies:
-    delayed-stream "~1.0.0"
-
-commander@0.6.1:
-  version "0.6.1"
-  resolved "http://registry.npmjs.org/commander/-/commander-0.6.1.tgz#fa68a14f6a945d54dbbe50d8cdb3320e9e3b1a06"
+commander@2.11.x:
+  version "2.11.0"
+  resolved "https://registry.yarnpkg.com/commander/-/commander-2.11.0.tgz#157152fd1e7a6c8d98a5b715cf376df928004563"
 
-commander@2.0.0, commander@~2.0.0:
-  version "2.0.0"
-  resolved "http://registry.npmjs.org/commander/-/commander-2.0.0.tgz#d1b86f901f8b64bd941bdeadaf924530393be928"
+commander@2.15.1:
+  version "2.15.1"
+  resolved "http://registry.npmjs.org/commander/-/commander-2.15.1.tgz#df46e867d0fc2aec66a34662b406a9ccafff5b0f"
 
-commander@^2.5.0, commander@^2.9.0:
+commander@^2.5.0:
   version "2.19.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.19.0.tgz#f6198aa84e5b83c46054b94ddedbfed5ee9ff12a"
 
@@ -884,24 +970,7 @@ concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
 
-concat-stream@1.5.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/concat-stream/-/concat-stream-1.5.0.tgz#53f7d43c51c5e43f81c8fdd03321c631be68d611"
-  dependencies:
-    inherits "~2.0.1"
-    readable-stream "~2.0.0"
-    typedarray "~0.0.5"
-
-concat-stream@1.6.2:
-  version "1.6.2"
-  resolved "https://registry.yarnpkg.com/concat-stream/-/concat-stream-1.6.2.tgz#904bdf194cd3122fc675c77fc4ac3d4ff0fd1a34"
-  dependencies:
-    buffer-from "^1.0.0"
-    inherits "^2.0.3"
-    readable-stream "^2.2.2"
-    typedarray "^0.0.6"
-
-convert-source-map@^1.1.0:
+convert-source-map@^1.1.0, convert-source-map@^1.5.1:
   version "1.6.0"
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.6.0.tgz#51b537a8c43e0f04dec1993bffcdd504e758ac20"
   dependencies:
@@ -911,11 +980,11 @@ copy-descriptor@^0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d"
 
-core-js@^2.4.0:
+core-js@^2.4.0, core-js@^2.5.0:
   version "2.6.1"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.1.tgz#87416ae817de957a3f249b3b5ca475d4aaed6042"
 
-core-util-is@1.0.2, core-util-is@~1.0.0:
+core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
 
@@ -927,17 +996,11 @@ cross-spawn@^5.0.1:
     shebang-command "^1.2.0"
     which "^1.2.9"
 
-cryptiles@2.x.x:
-  version "2.0.5"
-  resolved "http://registry.npmjs.org/cryptiles/-/cryptiles-2.0.5.tgz#3bdfecdc608147c1c67202fa291e7dca59eaa3b8"
-  dependencies:
-    boom "2.x.x"
-
-dashdash@^1.12.0:
-  version "1.14.1"
-  resolved "https://registry.yarnpkg.com/dashdash/-/dashdash-1.14.1.tgz#853cfa0f7cbe2fed5de20326b8dd581035f6e2f0"
+currently-unhandled@^0.4.1:
+  version "0.4.1"
+  resolved "https://registry.yarnpkg.com/currently-unhandled/-/currently-unhandled-0.4.1.tgz#988df33feab191ef799a61369dd76c17adf957ea"
   dependencies:
-    assert-plus "^1.0.0"
+    array-find-index "^1.0.1"
 
 dateformat@^2.0.0:
   version "2.2.0"
@@ -947,23 +1010,38 @@ deap@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/deap/-/deap-1.0.1.tgz#0646e9e1a095ffe8a9e404d68d1f76dcf57e66fb"
 
-debug@*, debug@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.0.tgz#373687bffa678b38b1cd91f861b63850035ddc87"
+debug@3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
   dependencies:
-    ms "^2.1.1"
-
-debug@0.7.4:
-  version "0.7.4"
-  resolved "http://registry.npmjs.org/debug/-/debug-0.7.4.tgz#06e1ea8082c2cb14e39806e22e2f6f757f92af39"
+    ms "2.0.0"
 
-debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8:
+debug@^2.2.0, debug@^2.3.3, debug@^2.6.8, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
   dependencies:
     ms "2.0.0"
 
-decamelize@^1.0.0:
+debug@^3.1.0:
+  version "3.2.6"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
+  dependencies:
+    ms "^2.1.1"
+
+debug@^4.1.0:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.0.tgz#373687bffa678b38b1cd91f861b63850035ddc87"
+  dependencies:
+    ms "^2.1.1"
+
+decamelize-keys@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/decamelize-keys/-/decamelize-keys-1.1.0.tgz#d171a87933252807eb3cb61dc1c1445d078df2d9"
+  dependencies:
+    decamelize "^1.1.0"
+    map-obj "^1.0.0"
+
+decamelize@^1.0.0, decamelize@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
 
@@ -971,11 +1049,17 @@ decode-uri-component@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545"
 
-deep-eql@^0.1.3:
-  version "0.1.3"
-  resolved "http://registry.npmjs.org/deep-eql/-/deep-eql-0.1.3.tgz#ef558acab8de25206cd713906d74e56930eb69f2"
+deep-assign@^2.0.0:
+  version "2.0.0"
+  resolved "http://registry.npmjs.org/deep-assign/-/deep-assign-2.0.0.tgz#ebe06b1f07f08dae597620e3dd1622f371a1c572"
   dependencies:
-    type-detect "0.1.1"
+    is-obj "^1.0.0"
+
+deep-eql@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/deep-eql/-/deep-eql-3.0.1.tgz#dfc9404400ad1c8fe023e7da1df1c147c4b444df"
+  dependencies:
+    type-detect "^4.0.0"
 
 defaults@^1.0.0:
   version "1.0.3"
@@ -1002,10 +1086,6 @@ define-property@^2.0.2:
     is-descriptor "^1.0.2"
     isobject "^3.0.1"
 
-delayed-stream@~1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619"
-
 deprecated@^0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/deprecated/-/deprecated-0.0.1.tgz#f9c9af5464afa1e7a971458a8bdef2aa94d5bb19"
@@ -1014,9 +1094,15 @@ detect-file@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/detect-file/-/detect-file-1.0.0.tgz#f0d66d03672a825cb1b73bdb3fe62310c8e552b7"
 
-diff@1.0.7:
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/diff/-/diff-1.0.7.tgz#24bbb001c4a7d5522169e7cabdb2c2814ed91cf4"
+detect-indent@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-4.0.0.tgz#f76d064352cdf43a1cb6ce619c4ee3a9475de208"
+  dependencies:
+    repeating "^2.0.0"
+
+diff@3.5.0, diff@^3.5.0:
+  version "3.5.0"
+  resolved "https://registry.yarnpkg.com/diff/-/diff-3.5.0.tgz#800c0dd1e0a8bfbc95835c202ad220fe317e5a12"
 
 dot-object@^0.6.0:
   version "0.6.0"
@@ -1030,13 +1116,6 @@ duplexer2@0.0.2:
   dependencies:
     readable-stream "~1.1.9"
 
-ecc-jsbn@~0.1.1:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz#3a83a904e54353287874c564b7549386849a98c9"
-  dependencies:
-    jsbn "~0.1.0"
-    safer-buffer "^2.1.0"
-
 electron-to-chromium@^1.3.47:
   version "1.3.96"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.96.tgz#25770ec99b8b07706dedf3a5f43fa50cb54c4f9a"
@@ -1047,11 +1126,17 @@ end-of-stream@~0.1.5:
   dependencies:
     once "~1.3.0"
 
-es6-promise@^4.0.3, es6-promise@^4.2.5:
+error-ex@^1.3.1:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz#b4ac40648107fdcdcfae242f428bea8a14d4f1bf"
+  dependencies:
+    is-arrayish "^0.2.1"
+
+es6-promise@^4.2.5:
   version "4.2.5"
   resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.5.tgz#da6d0d5692efb461e082c14817fe2427d8f5d054"
 
-escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
+escape-string-regexp@1.0.5, escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
 
@@ -1118,7 +1203,7 @@ extend-shallow@^3.0.0, extend-shallow@^3.0.2:
     assign-symbols "^1.0.0"
     is-extendable "^1.0.1"
 
-extend@^3.0.0, extend@~3.0.0, extend@~3.0.2:
+extend@^3.0.0:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa"
 
@@ -1141,32 +1226,6 @@ extglob@^2.0.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
-extract-zip@^1.6.5:
-  version "1.6.7"
-  resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-1.6.7.tgz#a840b4b8af6403264c8db57f4f1a74333ef81fe9"
-  dependencies:
-    concat-stream "1.6.2"
-    debug "2.6.9"
-    mkdirp "0.5.1"
-    yauzl "2.4.1"
-
-extract-zip@~1.5.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-1.5.0.tgz#92ccf6d81ef70a9fa4c1747114ccef6d8688a6c4"
-  dependencies:
-    concat-stream "1.5.0"
-    debug "0.7.4"
-    mkdirp "0.5.0"
-    yauzl "2.4.1"
-
-extsprintf@1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.3.0.tgz#96918440e3041a7a414f8c52e3c574eb3c3e1e05"
-
-extsprintf@^1.2.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.4.0.tgz#e2689f8f356fad62cca65a3a91c5df5f9551692f"
-
 fancy-log@^1.0.0, fancy-log@^1.1.0:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/fancy-log/-/fancy-log-1.3.2.tgz#f41125e3d84f2e7d89a43d06d958c8f78be16be1"
@@ -1175,20 +1234,6 @@ fancy-log@^1.0.0, fancy-log@^1.1.0:
     color-support "^1.1.3"
     time-stamp "^1.0.0"
 
-fast-deep-equal@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-2.0.1.tgz#7b05218ddf9667bf7f370bf7fdb2cb15fdd0aa49"
-
-fast-json-stable-stringify@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.0.0.tgz#d5142c0caee6b1189f87d3a76111064f86c8bbf2"
-
-fd-slicer@~1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.0.1.tgz#8b5bcbd9ec327c5041bf9ab023fd6750f1177e65"
-  dependencies:
-    pend "~1.2.0"
-
 filename-regex@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/filename-regex/-/filename-regex-2.0.1.tgz#c1c4b9bee3e09725ddb106b75c1e301fe2f18b26"
@@ -1216,6 +1261,12 @@ find-index@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/find-index/-/find-index-0.1.1.tgz#675d358b2ca3892d795a1ab47232f8b6e2e0dde4"
 
+find-up@^2.0.0, find-up@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7"
+  dependencies:
+    locate-path "^2.0.0"
+
 findup-sync@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/findup-sync/-/findup-sync-2.0.0.tgz#9326b1488c22d1a6088650a86901b2d9a90a2cbc"
@@ -1259,50 +1310,12 @@ for-own@^1.0.0:
   dependencies:
     for-in "^1.0.1"
 
-forever-agent@~0.6.1:
-  version "0.6.1"
-  resolved "https://registry.yarnpkg.com/forever-agent/-/forever-agent-0.6.1.tgz#fbc71f0c41adeb37f96c577ad1ed42d8fdacca91"
-
-form-data@~1.0.0-rc3:
-  version "1.0.1"
-  resolved "http://registry.npmjs.org/form-data/-/form-data-1.0.1.tgz#ae315db9a4907fa065502304a66d7733475ee37c"
-  dependencies:
-    async "^2.0.1"
-    combined-stream "^1.0.5"
-    mime-types "^2.1.11"
-
-form-data@~2.3.2:
-  version "2.3.3"
-  resolved "https://registry.yarnpkg.com/form-data/-/form-data-2.3.3.tgz#dcce52c05f644f298c6a7ab936bd724ceffbf3a6"
-  dependencies:
-    asynckit "^0.4.0"
-    combined-stream "^1.0.6"
-    mime-types "^2.1.12"
-
 fragment-cache@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/fragment-cache/-/fragment-cache-0.2.1.tgz#4290fad27f13e89be7f33799c6bc5a0abfff0d19"
   dependencies:
     map-cache "^0.2.2"
 
-fs-extra@^1.0.0:
-  version "1.0.0"
-  resolved "http://registry.npmjs.org/fs-extra/-/fs-extra-1.0.0.tgz#cd3ce5f7e7cb6145883fcae3191e9877f8587950"
-  dependencies:
-    graceful-fs "^4.1.2"
-    jsonfile "^2.1.0"
-    klaw "^1.0.0"
-
-fs-extra@~0.26.4:
-  version "0.26.7"
-  resolved "http://registry.npmjs.org/fs-extra/-/fs-extra-0.26.7.tgz#9ae1fdd94897798edab76d0918cf42d0c3184fa9"
-  dependencies:
-    graceful-fs "^4.1.2"
-    jsonfile "^2.1.0"
-    klaw "^1.0.0"
-    path-is-absolute "^1.0.0"
-    rimraf "^2.2.8"
-
 fs.realpath@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
@@ -1313,17 +1326,9 @@ gaze@^0.5.1:
   dependencies:
     globule "~0.1.0"
 
-generate-function@^2.0.0:
-  version "2.3.1"
-  resolved "https://registry.yarnpkg.com/generate-function/-/generate-function-2.3.1.tgz#f069617690c10c868e73b8465746764f97c3479f"
-  dependencies:
-    is-property "^1.0.2"
-
-generate-object-property@^1.1.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/generate-object-property/-/generate-object-property-1.2.0.tgz#9c0e1c40308ce804f4783618b937fa88f99d50d0"
-  dependencies:
-    is-property "^1.0.0"
+get-func-name@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/get-func-name/-/get-func-name-2.0.0.tgz#ead774abee72e20409433a066366023dd6887a41"
 
 get-stream@^3.0.0:
   version "3.0.0"
@@ -1333,12 +1338,6 @@ get-value@^2.0.3, get-value@^2.0.6:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/get-value/-/get-value-2.0.6.tgz#dc15ca1c672387ca76bd37ac0a395ba2042a2c28"
 
-getpass@^0.1.1:
-  version "0.1.7"
-  resolved "https://registry.yarnpkg.com/getpass/-/getpass-0.1.7.tgz#5eff8e3e684d569ae4cb2b1282604e8ba62149fa"
-  dependencies:
-    assert-plus "^1.0.0"
-
 glob-base@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/glob-base/-/glob-base-0.3.0.tgz#dbb164f6221b1c0b1ccf82aea328b497df0ea3c4"
@@ -1375,13 +1374,16 @@ glob2base@^0.0.12:
   dependencies:
     find-index "^0.1.1"
 
-glob@3.2.3:
-  version "3.2.3"
-  resolved "https://registry.yarnpkg.com/glob/-/glob-3.2.3.tgz#e313eeb249c7affaa5c475286b0e115b59839467"
+glob@7.1.2:
+  version "7.1.2"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.2.tgz#c19c9df9a028702d678612384a6552404c636d15"
   dependencies:
-    graceful-fs "~2.0.0"
+    fs.realpath "^1.0.0"
+    inflight "^1.0.4"
     inherits "2"
-    minimatch "~0.2.11"
+    minimatch "^3.0.4"
+    once "^1.3.0"
+    path-is-absolute "^1.0.0"
 
 glob@^4.3.1:
   version "4.5.3"
@@ -1457,7 +1459,7 @@ graceful-fs@^3.0.0:
   dependencies:
     natives "^1.1.0"
 
-graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.1.9:
+graceful-fs@^4.1.2:
   version "4.1.15"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.15.tgz#ffb703e1066e8a0eeaa4c8b80ba9253eeefbfb00"
 
@@ -1465,13 +1467,9 @@ graceful-fs@~1.2.0:
   version "1.2.3"
   resolved "http://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz#15a4806a57547cb2d2dbf27f42e89a8c3451b364"
 
-graceful-fs@~2.0.0:
-  version "2.0.3"
-  resolved "http://registry.npmjs.org/graceful-fs/-/graceful-fs-2.0.3.tgz#7cd2cdb228a4a3f36e95efa6cc142de7d1a136d0"
-
-growl@1.7.x:
-  version "1.7.0"
-  resolved "https://registry.yarnpkg.com/growl/-/growl-1.7.0.tgz#de2d66136d002e112ba70f3f10c31cf7c350b2da"
+growl@1.10.5:
+  version "1.10.5"
+  resolved "https://registry.yarnpkg.com/growl/-/growl-1.10.5.tgz#f2735dc2283674fa67478b10181059355c369e5e"
 
 gulp-bump@^0.3.1:
   version "0.3.1"
@@ -1482,15 +1480,6 @@ gulp-bump@^0.3.1:
     semver "^4.3.1"
     through2 "^0.5.1"
 
-gulp-mocha-phantomjs@^0.12.2:
-  version "0.12.2"
-  resolved "https://registry.yarnpkg.com/gulp-mocha-phantomjs/-/gulp-mocha-phantomjs-0.12.2.tgz#41151598b86863c1a1445e90b603e3fd01197a3d"
-  dependencies:
-    gulp-util "^3.0.7"
-    mocha-phantomjs-core "^2.0.0"
-    phantomjs-prebuilt "^2.1.4"
-    through2 "^2.0.1"
-
 gulp-rename@^1.2.2:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/gulp-rename/-/gulp-rename-1.4.0.tgz#de1c718e7c4095ae861f7296ef4f3248648240bd"
@@ -1508,7 +1497,7 @@ gulp-uglify@^1.2.0:
     uglify-save-license "^0.4.1"
     vinyl-sourcemaps-apply "^0.2.0"
 
-gulp-util@^3.0.0, gulp-util@^3.0.4, gulp-util@^3.0.6, gulp-util@^3.0.7:
+gulp-util@^3.0.0, gulp-util@^3.0.4, gulp-util@^3.0.6:
   version "3.0.8"
   resolved "https://registry.yarnpkg.com/gulp-util/-/gulp-util-3.0.8.tgz#0054e1e744502e27c04c187c3ecc505dd54bbb4f"
   dependencies:
@@ -1555,26 +1544,6 @@ gulplog@^1.0.0:
   dependencies:
     glogg "^1.0.0"
 
-har-schema@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/har-schema/-/har-schema-2.0.0.tgz#a94c2224ebcac04782a0d9035521f24735b7ec92"
-
-har-validator@~2.0.2:
-  version "2.0.6"
-  resolved "http://registry.npmjs.org/har-validator/-/har-validator-2.0.6.tgz#cdcbc08188265ad119b6a5a7c8ab70eecfb5d27d"
-  dependencies:
-    chalk "^1.1.1"
-    commander "^2.9.0"
-    is-my-json-valid "^2.12.4"
-    pinkie-promise "^2.0.0"
-
-har-validator@~5.1.0:
-  version "5.1.3"
-  resolved "https://registry.yarnpkg.com/har-validator/-/har-validator-5.1.3.tgz#1ef89ebd3e4996557675eed9893110dc350fa080"
-  dependencies:
-    ajv "^6.5.5"
-    har-schema "^2.0.0"
-
 has-ansi@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91"
@@ -1618,25 +1587,16 @@ has-values@^1.0.0:
     is-number "^3.0.0"
     kind-of "^4.0.0"
 
-hasha@^2.2.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/hasha/-/hasha-2.2.0.tgz#78d7cbfc1e6d66303fe79837365984517b2f6ee1"
-  dependencies:
-    is-stream "^1.0.1"
-    pinkie-promise "^2.0.0"
+he@1.1.1:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"
 
-hawk@~3.1.0:
-  version "3.1.3"
-  resolved "http://registry.npmjs.org/hawk/-/hawk-3.1.3.tgz#078444bd7c1640b0fe540d2c9b73d59678e8e1c4"
+home-or-tmp@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/home-or-tmp/-/home-or-tmp-2.0.0.tgz#e36c3f2d2cae7d746a857e38d18d5f32a7882db8"
   dependencies:
-    boom "2.x.x"
-    cryptiles "2.x.x"
-    hoek "2.x.x"
-    sntp "1.x.x"
-
-hoek@2.x.x:
-  version "2.16.3"
-  resolved "http://registry.npmjs.org/hoek/-/hoek-2.16.3.tgz#20bb7403d3cea398e91dc4710a8ff1b8274a25ed"
+    os-homedir "^1.0.0"
+    os-tmpdir "^1.0.1"
 
 homedir-polyfill@^1.0.1:
   version "1.0.1"
@@ -1644,21 +1604,20 @@ homedir-polyfill@^1.0.1:
   dependencies:
     parse-passwd "^1.0.0"
 
-http-signature@~1.1.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.1.1.tgz#df72e267066cd0ac67fb76adf8e134a8fbcf91bf"
-  dependencies:
-    assert-plus "^0.2.0"
-    jsprim "^1.2.2"
-    sshpk "^1.7.0"
+hosted-git-info@^2.1.4:
+  version "2.7.1"
+  resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.7.1.tgz#97f236977bd6e125408930ff6de3eec6281ec047"
 
-http-signature@~1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/http-signature/-/http-signature-1.2.0.tgz#9aecd925114772f3d95b65a60abb8f7c18fbace1"
+import-local@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/import-local/-/import-local-1.0.0.tgz#5e4ffdc03f4fe6c009c6729beb29631c2f8227bc"
   dependencies:
-    assert-plus "^1.0.0"
-    jsprim "^1.2.2"
-    sshpk "^1.7.0"
+    pkg-dir "^2.0.0"
+    resolve-cwd "^2.0.0"
+
+indent-string@^3.0.0:
+  version "3.2.0"
+  resolved "https://registry.yarnpkg.com/indent-string/-/indent-string-3.2.0.tgz#4a5fd6d27cc332f37e5419a504dbb837105c9289"
 
 inflight@^1.0.4:
   version "1.0.6"
@@ -1671,7 +1630,7 @@ inherits@1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-1.0.2.tgz#ca4309dadee6b54cc0b8d247e8d7c7a0975bdc9b"
 
-inherits@2, inherits@^2.0.3, inherits@~2.0.1, inherits@~2.0.3:
+inherits@2, inherits@~2.0.1, inherits@~2.0.3:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.3.tgz#633c2c83e3da42a502f52466022480f4208261de"
 
@@ -1708,10 +1667,20 @@ is-accessor-descriptor@^1.0.0:
   dependencies:
     kind-of "^6.0.0"
 
+is-arrayish@^0.2.1:
+  version "0.2.1"
+  resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"
+
 is-buffer@^1.1.5:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
 
+is-builtin-module@^1.0.0:
+  version "1.0.0"
+  resolved "http://registry.npmjs.org/is-builtin-module/-/is-builtin-module-1.0.0.tgz#540572d34f7ac3119f8f76c30cbc1b1e037affbe"
+  dependencies:
+    builtin-modules "^1.0.0"
+
 is-data-descriptor@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz#0b5ee648388e2c860282e793f1856fec3f301b56"
@@ -1768,6 +1737,12 @@ is-extglob@^2.1.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
 
+is-finite@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/is-finite/-/is-finite-1.0.2.tgz#cc6677695602be550ef11e8b4aa6305342b6d0aa"
+  dependencies:
+    number-is-nan "^1.0.0"
+
 is-glob@^2.0.0, is-glob@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-2.0.1.tgz#d096f926a3ded5600f3fdfd91198cb0888c2d863"
@@ -1784,20 +1759,6 @@ is-module@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-module/-/is-module-1.0.0.tgz#3258fb69f78c14d5b815d664336b4cffb6441591"
 
-is-my-ip-valid@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/is-my-ip-valid/-/is-my-ip-valid-1.0.0.tgz#7b351b8e8edd4d3995d4d066680e664d94696824"
-
-is-my-json-valid@^2.12.4:
-  version "2.19.0"
-  resolved "https://registry.yarnpkg.com/is-my-json-valid/-/is-my-json-valid-2.19.0.tgz#8fd6e40363cd06b963fa877d444bfb5eddc62175"
-  dependencies:
-    generate-function "^2.0.0"
-    generate-object-property "^1.1.0"
-    is-my-ip-valid "^1.0.0"
-    jsonpointer "^4.0.0"
-    xtend "^4.0.0"
-
 is-number@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-2.1.0.tgz#01fcbbb393463a548f2f466cce16dece49db908f"
@@ -1814,6 +1775,14 @@ is-number@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-4.0.0.tgz#0026e37f5454d73e356dfe6564699867c6a7f0ff"
 
+is-obj@^1.0.0:
+  version "1.0.1"
+  resolved "http://registry.npmjs.org/is-obj/-/is-obj-1.0.1.tgz#3e4729ac1f5fde025cd7d83a896dab9f4f67db0f"
+
+is-plain-obj@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-1.1.0.tgz#71a50c8429dfca773c92a390a4a03b39fcd51d3e"
+
 is-plain-object@^2.0.1, is-plain-object@^2.0.3, is-plain-object@^2.0.4:
   version "2.0.4"
   resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-2.0.4.tgz#2c163b3fafb1b606d9d17928f05c2a1c38e07677"
@@ -1828,24 +1797,16 @@ is-primitive@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/is-primitive/-/is-primitive-2.0.0.tgz#207bab91638499c07b2adf240a41a87210034575"
 
-is-property@^1.0.0, is-property@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/is-property/-/is-property-1.0.2.tgz#57fe1c4e48474edd65b09911f26b1cd4095dda84"
-
 is-relative@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-relative/-/is-relative-1.0.0.tgz#a1bb6935ce8c5dba1e8b9754b9b2dcc020e2260d"
   dependencies:
     is-unc-path "^1.0.0"
 
-is-stream@^1.0.1, is-stream@^1.1.0:
+is-stream@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44"
 
-is-typedarray@~1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a"
-
 is-unc-path@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-unc-path/-/is-unc-path-1.0.0.tgz#d731e8898ed090a12c352ad2eaed5095ad322c9d"
@@ -1860,6 +1821,10 @@ is-windows@^1.0.1, is-windows@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/is-windows/-/is-windows-1.0.2.tgz#d1850eb9791ecd18e6182ce12a30f396634bb19d"
 
+is-wsl@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-1.1.0.tgz#1f16e4aa22b04d1336b66188a66af3c600c3a66d"
+
 isarray@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf"
@@ -1882,17 +1847,6 @@ isobject@^3.0.0, isobject@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
 
-isstream@~0.1.2:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a"
-
-jade@0.26.3:
-  version "0.26.3"
-  resolved "https://registry.yarnpkg.com/jade/-/jade-0.26.3.tgz#8f10d7977d8d79f2f6ff862a81b0513ccb25686c"
-  dependencies:
-    commander "0.6.1"
-    mkdirp "0.3.0"
-
 jquery@^3.0:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.3.1.tgz#958ce29e81c9790f31be7792df5d4d95fc57fbca"
@@ -1905,9 +1859,9 @@ js-tokens@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-3.0.2.tgz#9866df395102130e38f7f996bceb65443209c25b"
 
-jsbn@~0.1.0:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/jsbn/-/jsbn-0.1.1.tgz#a5e654c2e5a2deb5f201d96cefbca80c0ef2f513"
+jsesc@^1.3.0:
+  version "1.3.0"
+  resolved "http://registry.npmjs.org/jsesc/-/jsesc-1.3.0.tgz#46c3fec8c1892b12b0833db9bc7622176dbab34b"
 
 jsesc@^2.5.1:
   version "2.5.2"
@@ -1917,17 +1871,13 @@ jsesc@~0.5.0:
   version "0.5.0"
   resolved "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz#e7dee66e35d6fc16f710fe91d5cf69f70f08911d"
 
-json-schema-traverse@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz#69f6a87d9513ab8bb8fe63bdb0979c448e684660"
-
-json-schema@0.2.3:
-  version "0.2.3"
-  resolved "https://registry.yarnpkg.com/json-schema/-/json-schema-0.2.3.tgz#b480c892e59a2f05954ce727bd3f2a4e882f9e13"
+json-parse-better-errors@^1.0.1:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/json-parse-better-errors/-/json-parse-better-errors-1.0.2.tgz#bb867cfb3450e69107c131d1c514bab3dc8bcaa9"
 
-json-stringify-safe@~5.0.1:
-  version "5.0.1"
-  resolved "https://registry.yarnpkg.com/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz#1296a2d58fd45f19a0f6ce01d65701e2c735b6eb"
+json5@^0.5.1:
+  version "0.5.1"
+  resolved "http://registry.npmjs.org/json5/-/json5-0.5.1.tgz#1eade7acc012034ad84e2396767ead9fa5495821"
 
 json5@^2.1.0:
   version "2.1.0"
@@ -1935,28 +1885,9 @@ json5@^2.1.0:
   dependencies:
     minimist "^1.2.0"
 
-jsonfile@^2.1.0:
-  version "2.4.0"
-  resolved "http://registry.npmjs.org/jsonfile/-/jsonfile-2.4.0.tgz#3736a2b428b87bbda0cc83b53fa3d633a35c2ae8"
-  optionalDependencies:
-    graceful-fs "^4.1.6"
-
-jsonpointer@^4.0.0:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/jsonpointer/-/jsonpointer-4.0.1.tgz#4fd92cb34e0e9db3c89c8622ecf51f9b978c6cb9"
-
-jsprim@^1.2.2:
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/jsprim/-/jsprim-1.4.1.tgz#313e66bc1e5cc06e438bc1b7499c2e5c56acb6a2"
-  dependencies:
-    assert-plus "1.0.0"
-    extsprintf "1.3.0"
-    json-schema "0.2.3"
-    verror "1.10.0"
-
-kew@^0.7.0, kew@~0.7.0:
-  version "0.7.0"
-  resolved "http://registry.npmjs.org/kew/-/kew-0.7.0.tgz#79d93d2d33363d6fdd2970b335d9141ad591d79b"
+just-extend@^4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/just-extend/-/just-extend-4.0.2.tgz#f3f47f7dfca0f989c55410a7ebc8854b07108afc"
 
 kind-of@^3.0.2, kind-of@^3.0.3, kind-of@^3.2.0:
   version "3.2.2"
@@ -1978,12 +1909,6 @@ kind-of@^6.0.0, kind-of@^6.0.2:
   version "6.0.2"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-6.0.2.tgz#01146b36a6218e64e58f3a8d66de5d7fc6f6d051"
 
-klaw@^1.0.0:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/klaw/-/klaw-1.3.1.tgz#4088433b46b3b1ba259d78785d8e96f73ba02439"
-  optionalDependencies:
-    graceful-fs "^4.1.9"
-
 lazy-cache@^1.0.3:
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-1.0.4.tgz#a1d78fc3a50474cb80845d3b3b6e1da49a446e8e"
@@ -2001,6 +1926,29 @@ liftoff@^2.1.0:
     rechoir "^0.6.2"
     resolve "^1.1.7"
 
+lighthouse-logger@^1.0.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/lighthouse-logger/-/lighthouse-logger-1.2.0.tgz#b76d56935e9c137e86a04741f6bb9b2776e886ca"
+  dependencies:
+    debug "^2.6.8"
+    marky "^1.2.0"
+
+load-json-file@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-4.0.0.tgz#2f5f45ab91e33216234fd53adab668eb4ec0993b"
+  dependencies:
+    graceful-fs "^4.1.2"
+    parse-json "^4.0.0"
+    pify "^3.0.0"
+    strip-bom "^3.0.0"
+
+locate-path@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e"
+  dependencies:
+    p-locate "^2.0.0"
+    path-exists "^3.0.0"
+
 lodash._basecopy@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz#8da0e6a876cf344c0ad8a54882111dd3c5c7ca36"
@@ -2043,6 +1991,10 @@ lodash.escape@^3.0.0:
   dependencies:
     lodash._root "^3.0.0"
 
+lodash.get@^4.4.2:
+  version "4.4.2"
+  resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
+
 lodash.isarguments@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz#2f573d85c6a24289ff00663b491c1d338ff3458a"
@@ -2092,6 +2044,18 @@ lodash@~1.0.1:
   version "1.0.2"
   resolved "http://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz#8f57560c83b59fc270bd3d561b690043430e2551"
 
+loglevel@^1.4.1:
+  version "1.6.1"
+  resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.6.1.tgz#e0fc95133b6ef276cdc8887cdaf24aa6f156f8fa"
+
+lolex@^2.3.2:
+  version "2.7.5"
+  resolved "https://registry.yarnpkg.com/lolex/-/lolex-2.7.5.tgz#113001d56bfc7e02d56e36291cc5c413d1aa0733"
+
+lolex@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/lolex/-/lolex-3.0.0.tgz#f04ee1a8aa13f60f1abd7b0e8f4213ec72ec193e"
+
 longest@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/longest/-/longest-1.0.1.tgz#30a0b2da38f73770e8294a0d22e6625ed77d0097"
@@ -2102,6 +2066,13 @@ loose-envify@^1.0.0:
   dependencies:
     js-tokens "^3.0.0 || ^4.0.0"
 
+loud-rejection@^1.0.0:
+  version "1.6.0"
+  resolved "https://registry.yarnpkg.com/loud-rejection/-/loud-rejection-1.6.0.tgz#5b46f80147edee578870f086d04821cf998e551f"
+  dependencies:
+    currently-unhandled "^0.4.1"
+    signal-exit "^3.0.0"
+
 lru-cache@2:
   version "2.7.3"
   resolved "http://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz#6d4524e8b955f95d4f5b58851ce21dd72fb4e952"
@@ -2129,16 +2100,42 @@ map-cache@^0.2.0, map-cache@^0.2.2:
   version "0.2.2"
   resolved "https://registry.yarnpkg.com/map-cache/-/map-cache-0.2.2.tgz#c32abd0bd6525d9b051645bb4f26ac5dc98a0dbf"
 
+map-obj@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-1.0.1.tgz#d933ceb9205d82bdcf4886f6742bdc2b4dea146d"
+
+map-obj@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-2.0.0.tgz#a65cd29087a92598b8791257a523e021222ac1f9"
+
 map-visit@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/map-visit/-/map-visit-1.0.0.tgz#ecdca8f13144e660f1b5bd41f12f3479d98dfb8f"
   dependencies:
     object-visit "^1.0.0"
 
+marky@^1.2.0:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/marky/-/marky-1.2.1.tgz#a3fcf82ffd357756b8b8affec9fdbf3a30dc1b02"
+
 math-random@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/math-random/-/math-random-1.0.1.tgz#8b3aac588b8a66e4975e3cdea67f7bb329601fac"
 
+meow@^4.0.0:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/meow/-/meow-4.0.1.tgz#d48598f6f4b1472f35bf6317a95945ace347f975"
+  dependencies:
+    camelcase-keys "^4.0.0"
+    decamelize-keys "^1.0.0"
+    loud-rejection "^1.0.0"
+    minimist "^1.1.3"
+    minimist-options "^3.0.1"
+    normalize-package-data "^2.3.4"
+    read-pkg-up "^3.0.0"
+    redent "^2.0.0"
+    trim-newlines "^2.0.0"
+
 micromatch@^2.3.11:
   version "2.3.11"
   resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-2.3.11.tgz#86677c97d1720b363431d04d0d15293bd38c1565"
@@ -2175,15 +2172,11 @@ micromatch@^3.0.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.2"
 
-mime-db@~1.37.0:
-  version "1.37.0"
-  resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.37.0.tgz#0b6a0ce6fdbe9576e25f1f2d2fde8830dc0ad0d8"
-
-mime-types@^2.1.11, mime-types@^2.1.12, mime-types@~2.1.19, mime-types@~2.1.7:
-  version "2.1.21"
-  resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.21.tgz#28995aa1ecb770742fe6ae7e58f9181c744b3f96"
+minimatch@3.0.4, minimatch@^3.0.4:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
   dependencies:
-    mime-db "~1.37.0"
+    brace-expansion "^1.1.7"
 
 minimatch@^2.0.1:
   version "2.0.10"
@@ -2191,12 +2184,6 @@ minimatch@^2.0.1:
   dependencies:
     brace-expansion "^1.0.0"
 
-minimatch@^3.0.4:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
-  dependencies:
-    brace-expansion "^1.1.7"
-
 minimatch@~0.2.11:
   version "0.2.14"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-0.2.14.tgz#c74e780574f63c6f9a090e90efbe6ef53a6a756a"
@@ -2204,11 +2191,18 @@ minimatch@~0.2.11:
     lru-cache "2"
     sigmund "~1.0.0"
 
+minimist-options@^3.0.1:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/minimist-options/-/minimist-options-3.0.2.tgz#fba4c8191339e13ecf4d61beb03f070103f3d954"
+  dependencies:
+    arrify "^1.0.1"
+    is-plain-obj "^1.1.0"
+
 minimist@0.0.8:
   version "0.0.8"
   resolved "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
 
-minimist@^1.1.0, minimist@^1.2.0:
+minimist@^1.1.0, minimist@^1.1.3, minimist@^1.2.0:
   version "1.2.0"
   resolved "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
 
@@ -2219,48 +2213,47 @@ mixin-deep@^1.2.0:
     for-in "^1.0.2"
     is-extendable "^1.0.1"
 
-mkdirp@0.3.0:
-  version "0.3.0"
-  resolved "http://registry.npmjs.org/mkdirp/-/mkdirp-0.3.0.tgz#1bbf5ab1ba827af23575143490426455f481fe1e"
-
-mkdirp@0.3.5:
-  version "0.3.5"
-  resolved "http://registry.npmjs.org/mkdirp/-/mkdirp-0.3.5.tgz#de3e5f8961c88c787ee1368df849ac4413eca8d7"
-
-mkdirp@0.5.0:
-  version "0.5.0"
-  resolved "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.0.tgz#1d73076a6df986cd9344e15e71fcc05a4c9abf12"
-  dependencies:
-    minimist "0.0.8"
-
-mkdirp@0.5.1, mkdirp@^0.5.0:
+mkdirp@0.5.1, mkdirp@^0.5.0, mkdirp@^0.5.1:
   version "0.5.1"
   resolved "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903"
   dependencies:
     minimist "0.0.8"
 
-mocha-phantomjs-core@^2.0.0:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/mocha-phantomjs-core/-/mocha-phantomjs-core-2.1.2.tgz#86ccc00daf4eb7013745aaec2f54997bd6b24bbd"
-
-mocha-phantomjs@3.5.3:
-  version "3.5.3"
-  resolved "https://registry.yarnpkg.com/mocha-phantomjs/-/mocha-phantomjs-3.5.3.tgz#bc0e654972d883ce11367f3f011f9e88f0a8de14"
-  dependencies:
-    commander "~2.0.0"
-    mocha "~1.20.1"
-
-mocha@~1.20.1:
-  version "1.20.1"
-  resolved "http://registry.npmjs.org/mocha/-/mocha-1.20.1.tgz#f343832d9fe0c7d97c64fc70448f5136df9fed5b"
+mocha-chrome@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/mocha-chrome/-/mocha-chrome-1.1.0.tgz#ab92b3cd1893fd57df8de4c29ec8ab696595d573"
   dependencies:
-    commander "2.0.0"
-    debug "*"
-    diff "1.0.7"
-    glob "3.2.3"
-    growl "1.7.x"
-    jade "0.26.3"
-    mkdirp "0.3.5"
+    babel-plugin-transform-es2015-destructuring "^6.23.0"
+    babel-plugin-transform-es2015-parameters "^6.24.1"
+    babel-polyfill "^6.26.0"
+    babel-preset-env "^1.6.1"
+    babel-register "^6.26.0"
+    chalk "^2.0.1"
+    chrome-launcher "^0.10.2"
+    chrome-remote-interface "^0.25.2"
+    chrome-unmirror "^0.1.0"
+    debug "^3.1.0"
+    deep-assign "^2.0.0"
+    import-local "^1.0.0"
+    loglevel "^1.4.1"
+    meow "^4.0.0"
+    nanobus "^4.2.0"
+
+mocha@^5.2.0:
+  version "5.2.0"
+  resolved "https://registry.yarnpkg.com/mocha/-/mocha-5.2.0.tgz#6d8ae508f59167f940f2b5b3c4a612ae50c90ae6"
+  dependencies:
+    browser-stdout "1.3.1"
+    commander "2.15.1"
+    debug "3.1.0"
+    diff "3.5.0"
+    escape-string-regexp "1.0.5"
+    glob "7.1.2"
+    growl "1.10.5"
+    he "1.1.1"
+    minimatch "3.0.4"
+    mkdirp "0.5.1"
+    supports-color "5.4.0"
 
 ms@2.0.0:
   version "2.0.0"
@@ -2276,6 +2269,18 @@ multipipe@^0.1.2:
   dependencies:
     duplexer2 "0.0.2"
 
+nanoassert@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/nanoassert/-/nanoassert-1.1.0.tgz#4f3152e09540fde28c76f44b19bbcd1d5a42478d"
+
+nanobus@^4.2.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/nanobus/-/nanobus-4.4.0.tgz#e5c20846fa17cff01ef5aac301410d1e541f81ed"
+  dependencies:
+    nanoassert "^1.1.0"
+    nanotiming "^7.2.0"
+    remove-array-items "^1.0.0"
+
 nanomatch@^1.2.9:
   version "1.2.13"
   resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"
@@ -2292,13 +2297,41 @@ nanomatch@^1.2.9:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
+nanoscheduler@^1.0.2:
+  version "1.0.3"
+  resolved "https://registry.yarnpkg.com/nanoscheduler/-/nanoscheduler-1.0.3.tgz#6ca027941bf3e04139ea4bab6227ea6ad803692f"
+  dependencies:
+    nanoassert "^1.1.0"
+
+nanotiming@^7.2.0:
+  version "7.3.1"
+  resolved "https://registry.yarnpkg.com/nanotiming/-/nanotiming-7.3.1.tgz#dc5cf8d9d8ad401a4394d1a9b7a16714bccfefda"
+  dependencies:
+    nanoassert "^1.1.0"
+    nanoscheduler "^1.0.2"
+
 natives@^1.1.0:
   version "1.1.6"
   resolved "https://registry.yarnpkg.com/natives/-/natives-1.1.6.tgz#a603b4a498ab77173612b9ea1acdec4d980f00bb"
 
-node-uuid@~1.4.7:
+nise@^1.4.7:
   version "1.4.8"
-  resolved "https://registry.yarnpkg.com/node-uuid/-/node-uuid-1.4.8.tgz#b040eb0923968afabf8d32fb1f17f1167fdab907"
+  resolved "https://registry.yarnpkg.com/nise/-/nise-1.4.8.tgz#ce91c31e86cf9b2c4cac49d7fcd7f56779bfd6b0"
+  dependencies:
+    "@sinonjs/formatio" "^3.1.0"
+    just-extend "^4.0.2"
+    lolex "^2.3.2"
+    path-to-regexp "^1.7.0"
+    text-encoding "^0.6.4"
+
+normalize-package-data@^2.3.2, normalize-package-data@^2.3.4:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/normalize-package-data/-/normalize-package-data-2.4.0.tgz#12f95a307d58352075a04907b84ac8be98ac012f"
+  dependencies:
+    hosted-git-info "^2.1.4"
+    is-builtin-module "^1.0.0"
+    semver "2 || 3 || 4 || 5"
+    validate-npm-package-license "^3.0.1"
 
 normalize-path@^2.0.1:
   version "2.1.1"
@@ -2312,13 +2345,9 @@ npm-run-path@^2.0.0:
   dependencies:
     path-key "^2.0.0"
 
-oauth-sign@~0.8.0:
-  version "0.8.2"
-  resolved "https://registry.yarnpkg.com/oauth-sign/-/oauth-sign-0.8.2.tgz#46a6ab7f0aead8deae9ec0565780b7d4efeb9d43"
-
-oauth-sign@~0.9.0:
-  version "0.9.0"
-  resolved "https://registry.yarnpkg.com/oauth-sign/-/oauth-sign-0.9.0.tgz#47a7b016baa68b5fa0ecf3dee08a85c679ac6455"
+number-is-nan@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
 
 object-assign@^3.0.0:
   version "3.0.0"
@@ -2395,10 +2424,30 @@ os-homedir@^1.0.0:
   version "1.0.2"
   resolved "http://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz#ffbc4988336e0e833de0c168c7ef152121aa7fb3"
 
+os-tmpdir@^1.0.1:
+  version "1.0.2"
+  resolved "http://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274"
+
 p-finally@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/p-finally/-/p-finally-1.0.0.tgz#3fbcfb15b899a44123b34b6dcc18b724336a2cae"
 
+p-limit@^1.1.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.3.0.tgz#b86bd5f0c25690911c7590fcbfc2010d54b3ccb8"
+  dependencies:
+    p-try "^1.0.0"
+
+p-locate@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-2.0.0.tgz#20a0103b222a70c8fd39cc2e580680f3dde5ec43"
+  dependencies:
+    p-limit "^1.1.0"
+
+p-try@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/p-try/-/p-try-1.0.0.tgz#cbc79cdbaf8fd4228e13f621f2b1a237c1b207b3"
+
 parse-filepath@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/parse-filepath/-/parse-filepath-1.0.2.tgz#a632127f53aaf3d15876f5872f3ffac763d6c891"
@@ -2416,6 +2465,13 @@ parse-glob@^3.0.4:
     is-extglob "^1.0.0"
     is-glob "^2.0.0"
 
+parse-json@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/parse-json/-/parse-json-4.0.0.tgz#be35f5425be1f7f6c747184f98a788cb99477ee0"
+  dependencies:
+    error-ex "^1.3.1"
+    json-parse-better-errors "^1.0.1"
+
 parse-passwd@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6"
@@ -2424,7 +2480,11 @@ pascalcase@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/pascalcase/-/pascalcase-0.1.1.tgz#b363e55e8006ca6fe21784d2db22bd15d7917f14"
 
-path-is-absolute@^1.0.0:
+path-exists@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515"
+
+path-is-absolute@^1.0.0, path-is-absolute@^1.0.1:
   version "1.0.1"
   resolved "http://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f"
 
@@ -2446,50 +2506,31 @@ path-root@^0.1.1:
   dependencies:
     path-root-regex "^0.1.0"
 
-pend@~1.2.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
+path-to-regexp@^1.7.0:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.7.0.tgz#59fde0f435badacba103a84e9d3bc64e96b9937d"
+  dependencies:
+    isarray "0.0.1"
 
-performance-now@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b"
-
-phantomjs-prebuilt@^2.1.4:
-  version "2.1.16"
-  resolved "https://registry.yarnpkg.com/phantomjs-prebuilt/-/phantomjs-prebuilt-2.1.16.tgz#efd212a4a3966d3647684ea8ba788549be2aefef"
-  dependencies:
-    es6-promise "^4.0.3"
-    extract-zip "^1.6.5"
-    fs-extra "^1.0.0"
-    hasha "^2.2.0"
-    kew "^0.7.0"
-    progress "^1.1.8"
-    request "^2.81.0"
-    request-progress "^2.0.1"
-    which "^1.2.10"
-
-phantomjs@^1.9.1:
-  version "1.9.20"
-  resolved "http://registry.npmjs.org/phantomjs/-/phantomjs-1.9.20.tgz#4424aca20e14d255c0b0889af6f6b8973da10e0d"
-  dependencies:
-    extract-zip "~1.5.0"
-    fs-extra "~0.26.4"
-    hasha "^2.2.0"
-    kew "~0.7.0"
-    progress "~1.1.8"
-    request "~2.67.0"
-    request-progress "~2.0.1"
-    which "~1.2.2"
-
-pinkie-promise@^2.0.0:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/pinkie-promise/-/pinkie-promise-2.0.1.tgz#2135d6dfa7a358c069ac9b178776288228450ffa"
+path-type@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/path-type/-/path-type-3.0.0.tgz#cef31dc8e0a1a3bb0d105c0cd97cf3bf47f4e36f"
   dependencies:
-    pinkie "^2.0.0"
+    pify "^3.0.0"
 
-pinkie@^2.0.0:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/pinkie/-/pinkie-2.0.4.tgz#72556b80cfa0d48a974e80e77248e80ed4f7f870"
+pathval@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/pathval/-/pathval-1.1.0.tgz#b942e6d4bde653005ef6b71361def8727d0645e0"
+
+pify@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/pify/-/pify-3.0.0.tgz#e5a4acd2c101fdf3d9a4d07f0dbc4db49dd28176"
+
+pkg-dir@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pkg-dir/-/pkg-dir-2.0.0.tgz#f6d5d1109e19d63edf428e0bd57e12777615334b"
+  dependencies:
+    find-up "^2.1.0"
 
 posix-character-classes@^0.1.0:
   version "0.1.1"
@@ -2513,45 +2554,21 @@ pretty-hrtime@^1.0.0:
   version "1.0.3"
   resolved "http://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"
 
-private@^0.1.6:
+private@^0.1.6, private@^0.1.8:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
 
-process-nextick-args@~1.0.6:
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-1.0.7.tgz#150e20b756590ad3f91093f25a4f2ad8bff30ba3"
-
 process-nextick-args@~2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.0.tgz#a37d732f4271b4ab1ad070d35508e8290788ffaa"
 
-progress@^1.1.8, progress@~1.1.8:
-  version "1.1.8"
-  resolved "http://registry.npmjs.org/progress/-/progress-1.1.8.tgz#e260c78f6161cdd9b0e56cc3e0a85de17c7a57be"
-
 pseudomap@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/pseudomap/-/pseudomap-1.0.2.tgz#f052a28da70e618917ef0a8ac34c1ae5a68286b3"
 
-psl@^1.1.24:
-  version "1.1.29"
-  resolved "https://registry.yarnpkg.com/psl/-/psl-1.1.29.tgz#60f580d360170bb722a797cc704411e6da850c67"
-
-punycode@^1.4.1:
-  version "1.4.1"
-  resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e"
-
-punycode@^2.1.0:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
-
-qs@~5.2.0:
-  version "5.2.1"
-  resolved "https://registry.yarnpkg.com/qs/-/qs-5.2.1.tgz#801fee030e0b9450d6385adc48a4cc55b44aedfc"
-
-qs@~6.5.2:
-  version "6.5.2"
-  resolved "https://registry.yarnpkg.com/qs/-/qs-6.5.2.tgz#cb3ae806e8740444584ef154ce8ee98d403f3e36"
+quick-lru@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/quick-lru/-/quick-lru-1.1.0.tgz#4360b17c61136ad38078397ff11416e186dcfbb8"
 
 randomatic@^3.0.0:
   version "3.1.1"
@@ -2561,6 +2578,21 @@ randomatic@^3.0.0:
     kind-of "^6.0.0"
     math-random "^1.0.1"
 
+read-pkg-up@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/read-pkg-up/-/read-pkg-up-3.0.0.tgz#3ed496685dba0f8fe118d0691dc51f4a1ff96f07"
+  dependencies:
+    find-up "^2.0.0"
+    read-pkg "^3.0.0"
+
+read-pkg@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/read-pkg/-/read-pkg-3.0.0.tgz#9cbc686978fee65d16c00e2b19c237fcf6e38389"
+  dependencies:
+    load-json-file "^4.0.0"
+    normalize-package-data "^2.3.2"
+    path-type "^3.0.0"
+
 "readable-stream@>=1.0.33-1 <1.1.0-0", readable-stream@~1.0.17:
   version "1.0.34"
   resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
@@ -2570,18 +2602,6 @@ randomatic@^3.0.0:
     isarray "0.0.1"
     string_decoder "~0.10.x"
 
-readable-stream@^2.2.2, readable-stream@~2.3.6:
-  version "2.3.6"
-  resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
-  dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.3"
-    isarray "~1.0.0"
-    process-nextick-args "~2.0.0"
-    safe-buffer "~5.1.1"
-    string_decoder "~1.1.1"
-    util-deprecate "~1.0.1"
-
 readable-stream@~1.1.9:
   version "1.1.14"
   resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
@@ -2591,15 +2611,16 @@ readable-stream@~1.1.9:
     isarray "0.0.1"
     string_decoder "~0.10.x"
 
-readable-stream@~2.0.0, readable-stream@~2.0.5:
-  version "2.0.6"
-  resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-2.0.6.tgz#8f90341e68a53ccc928788dacfcd11b36eb9b78e"
+readable-stream@~2.3.6:
+  version "2.3.6"
+  resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
   dependencies:
     core-util-is "~1.0.0"
-    inherits "~2.0.1"
+    inherits "~2.0.3"
     isarray "~1.0.0"
-    process-nextick-args "~1.0.6"
-    string_decoder "~0.10.x"
+    process-nextick-args "~2.0.0"
+    safe-buffer "~5.1.1"
+    string_decoder "~1.1.1"
     util-deprecate "~1.0.1"
 
 rechoir@^0.6.2:
@@ -2608,10 +2629,21 @@ rechoir@^0.6.2:
   dependencies:
     resolve "^1.1.6"
 
+redent@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/redent/-/redent-2.0.0.tgz#c1b2007b42d57eb1389079b3c8333639d5e1ccaa"
+  dependencies:
+    indent-string "^3.0.0"
+    strip-indent "^2.0.0"
+
 regenerate@^1.2.1:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.0.tgz#4a856ec4b56e4077c557589cae85e7a4c8869a11"
 
+regenerator-runtime@^0.10.5:
+  version "0.10.5"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz#336c3efc1220adcedda2c9fab67b5a7955a33658"
+
 regenerator-runtime@^0.11.0:
   version "0.11.1"
   resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
@@ -2655,6 +2687,10 @@ regjsparser@^0.1.4:
   dependencies:
     jsesc "~0.5.0"
 
+remove-array-items@^1.0.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/remove-array-items/-/remove-array-items-1.1.1.tgz#fd745ff73d0822e561ea910bf1b401fc7843e693"
+
 remove-trailing-separator@^1.0.1:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz#c24bce2a283adad5bc3f58e0d48249b92379d8ef"
@@ -2667,65 +2703,21 @@ repeat-string@^1.5.2, repeat-string@^1.6.1:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-1.6.1.tgz#8dcae470e1c88abc2d600fff4a776286da75e637"
 
+repeating@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/repeating/-/repeating-2.0.1.tgz#5214c53a926d3552707527fbab415dbc08d06dda"
+  dependencies:
+    is-finite "^1.0.0"
+
 replace-ext@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/replace-ext/-/replace-ext-0.0.1.tgz#29bbd92078a739f0bcce2b4ee41e837953522924"
 
-request-progress@^2.0.1, request-progress@~2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/request-progress/-/request-progress-2.0.1.tgz#5d36bb57961c673aa5b788dbc8141fdf23b44e08"
-  dependencies:
-    throttleit "^1.0.0"
-
-request@^2.81.0:
-  version "2.88.0"
-  resolved "https://registry.yarnpkg.com/request/-/request-2.88.0.tgz#9c2fca4f7d35b592efe57c7f0a55e81052124fef"
-  dependencies:
-    aws-sign2 "~0.7.0"
-    aws4 "^1.8.0"
-    caseless "~0.12.0"
-    combined-stream "~1.0.6"
-    extend "~3.0.2"
-    forever-agent "~0.6.1"
-    form-data "~2.3.2"
-    har-validator "~5.1.0"
-    http-signature "~1.2.0"
-    is-typedarray "~1.0.0"
-    isstream "~0.1.2"
-    json-stringify-safe "~5.0.1"
-    mime-types "~2.1.19"
-    oauth-sign "~0.9.0"
-    performance-now "^2.1.0"
-    qs "~6.5.2"
-    safe-buffer "^5.1.2"
-    tough-cookie "~2.4.3"
-    tunnel-agent "^0.6.0"
-    uuid "^3.3.2"
-
-request@~2.67.0:
-  version "2.67.0"
-  resolved "http://registry.npmjs.org/request/-/request-2.67.0.tgz#8af74780e2bf11ea0ae9aa965c11f11afd272742"
-  dependencies:
-    aws-sign2 "~0.6.0"
-    bl "~1.0.0"
-    caseless "~0.11.0"
-    combined-stream "~1.0.5"
-    extend "~3.0.0"
-    forever-agent "~0.6.1"
-    form-data "~1.0.0-rc3"
-    har-validator "~2.0.2"
-    hawk "~3.1.0"
-    http-signature "~1.1.0"
-    is-typedarray "~1.0.0"
-    isstream "~0.1.2"
-    json-stringify-safe "~5.0.1"
-    mime-types "~2.1.7"
-    node-uuid "~1.4.7"
-    oauth-sign "~0.8.0"
-    qs "~5.2.0"
-    stringstream "~0.0.4"
-    tough-cookie "~2.2.0"
-    tunnel-agent "~0.4.1"
+resolve-cwd@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/resolve-cwd/-/resolve-cwd-2.0.0.tgz#00a9f7387556e27038eae232caa372a6a59b665a"
+  dependencies:
+    resolve-from "^3.0.0"
 
 resolve-dir@^1.0.0, resolve-dir@^1.0.1:
   version "1.0.1"
@@ -2734,6 +2726,10 @@ resolve-dir@^1.0.0, resolve-dir@^1.0.1:
     expand-tilde "^2.0.0"
     global-modules "^1.0.0"
 
+resolve-from@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-3.0.0.tgz#b22c7af7d9d6881bc8b6e653335eebcb0a188748"
+
 resolve-url@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
@@ -2760,7 +2756,7 @@ right-align@^0.1.1:
   dependencies:
     align-text "^0.1.1"
 
-rimraf@^2.2.8:
+rimraf@^2.6.1:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.2.tgz#2ed8150d24a16ea8651e6d6ef0f47c4158ce7a36"
   dependencies:
@@ -2804,7 +2800,7 @@ rollup@^0.68.1:
     "@types/estree" "0.0.39"
     "@types/node" "*"
 
-safe-buffer@^5.0.1, safe-buffer@^5.1.2, safe-buffer@~5.1.0, safe-buffer@~5.1.1:
+safe-buffer@~5.1.0, safe-buffer@~5.1.1:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
 
@@ -2814,18 +2810,14 @@ safe-regex@^1.1.0:
   dependencies:
     ret "~0.1.10"
 
-safer-buffer@^2.0.2, safer-buffer@^2.1.0, safer-buffer@~2.1.0:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
+"semver@2 || 3 || 4 || 5", semver@^5.3.0, semver@^5.4.1:
+  version "5.6.0"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
 
 semver@^4.1.0, semver@^4.3.1:
   version "4.3.6"
   resolved "http://registry.npmjs.org/semver/-/semver-4.3.6.tgz#300bc6e0e86374f7ba61068b5b1ecd57fc6532da"
 
-semver@^5.3.0, semver@^5.4.1:
-  version "5.6.0"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
-
 sequencify@~0.0.7:
   version "0.0.7"
   resolved "https://registry.yarnpkg.com/sequencify/-/sequencify-0.0.7.tgz#90cff19d02e07027fd767f5ead3e7b95d1e7380c"
@@ -2866,6 +2858,22 @@ signal-exit@^3.0.0:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.2.tgz#b5fdc08f1287ea1178628e415e25132b73646c6d"
 
+sinon@^7.2.2:
+  version "7.2.2"
+  resolved "https://registry.yarnpkg.com/sinon/-/sinon-7.2.2.tgz#388ecabd42fa93c592bfc71d35a70894d5a0ca07"
+  dependencies:
+    "@sinonjs/commons" "^1.2.0"
+    "@sinonjs/formatio" "^3.1.0"
+    "@sinonjs/samsam" "^3.0.2"
+    diff "^3.5.0"
+    lolex "^3.0.0"
+    nise "^1.4.7"
+    supports-color "^5.5.0"
+
+slash@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"
+
 snapdragon-node@^2.0.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"
@@ -2893,12 +2901,6 @@ snapdragon@^0.8.1:
     source-map-resolve "^0.5.0"
     use "^3.1.0"
 
-sntp@1.x.x:
-  version "1.0.9"
-  resolved "http://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz#6541184cc90aeea6c6e7b35e2659082443c66198"
-  dependencies:
-    hoek "2.x.x"
-
 source-map-resolve@^0.5.0:
   version "0.5.2"
   resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.2.tgz#72e2cc34095543e43b2c62b2c4c10d4a9054f259"
@@ -2909,11 +2911,17 @@ source-map-resolve@^0.5.0:
     source-map-url "^0.4.0"
     urix "^0.1.0"
 
+source-map-support@^0.4.15:
+  version "0.4.18"
+  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.4.18.tgz#0286a6de8be42641338594e97ccea75f0a2c585f"
+  dependencies:
+    source-map "^0.5.6"
+
 source-map-url@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
 
-source-map@^0.5.0, source-map@^0.5.1, source-map@^0.5.6, source-map@~0.5.1:
+source-map@^0.5.0, source-map@^0.5.1, source-map@^0.5.6, source-map@^0.5.7, source-map@~0.5.1:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
 
@@ -2925,26 +2933,34 @@ sparkles@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/sparkles/-/sparkles-1.0.1.tgz#008db65edce6c50eec0c5e228e1945061dd0437c"
 
+spdx-correct@^3.0.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.1.0.tgz#fb83e504445268f154b074e218c87c003cd31df4"
+  dependencies:
+    spdx-expression-parse "^3.0.0"
+    spdx-license-ids "^3.0.0"
+
+spdx-exceptions@^2.1.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/spdx-exceptions/-/spdx-exceptions-2.2.0.tgz#2ea450aee74f2a89bfb94519c07fcd6f41322977"
+
+spdx-expression-parse@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/spdx-expression-parse/-/spdx-expression-parse-3.0.0.tgz#99e119b7a5da00e05491c9fa338b7904823b41d0"
+  dependencies:
+    spdx-exceptions "^2.1.0"
+    spdx-license-ids "^3.0.0"
+
+spdx-license-ids@^3.0.0:
+  version "3.0.3"
+  resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.3.tgz#81c0ce8f21474756148bbb5f3bfc0f36bf15d76e"
+
 split-string@^3.0.1, split-string@^3.0.2:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/split-string/-/split-string-3.1.0.tgz#7cb09dda3a86585705c64b39a6466038682e8fe2"
   dependencies:
     extend-shallow "^3.0.0"
 
-sshpk@^1.7.0:
-  version "1.15.2"
-  resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.15.2.tgz#c946d6bd9b1a39d0e8635763f5242d6ed6dcb629"
-  dependencies:
-    asn1 "~0.2.3"
-    assert-plus "^1.0.0"
-    bcrypt-pbkdf "^1.0.0"
-    dashdash "^1.12.0"
-    ecc-jsbn "~0.1.1"
-    getpass "^0.1.1"
-    jsbn "~0.1.0"
-    safer-buffer "^2.0.2"
-    tweetnacl "~0.14.0"
-
 static-extend@^0.1.1:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/static-extend/-/static-extend-0.1.2.tgz#60809c39cbff55337226fd5e0b520f341f1fb5c6"
@@ -2966,10 +2982,6 @@ string_decoder@~1.1.1:
   dependencies:
     safe-buffer "~5.1.0"
 
-stringstream@~0.0.4:
-  version "0.0.6"
-  resolved "https://registry.yarnpkg.com/stringstream/-/stringstream-0.0.6.tgz#7880225b0d4ad10e30927d167a1d6f2fd3b33a72"
-
 strip-ansi@^3.0.0:
   version "3.0.1"
   resolved "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz#6a385fb8853d952d5ff05d0e8aaf94278dc63dcf"
@@ -2983,23 +2995,37 @@ strip-bom@^1.0.0:
     first-chunk-stream "^1.0.0"
     is-utf8 "^0.2.0"
 
+strip-bom@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3"
+
 strip-eof@^1.0.0:
   version "1.0.0"
   resolved "http://registry.npmjs.org/strip-eof/-/strip-eof-1.0.0.tgz#bb43ff5598a6eb05d89b59fcd129c983313606bf"
 
+strip-indent@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/strip-indent/-/strip-indent-2.0.0.tgz#5ef8db295d01e6ed6cbf7aab96998d7822527b68"
+
+supports-color@5.4.0:
+  version "5.4.0"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.4.0.tgz#1c6b337402c2137605efe19f10fec390f6faab54"
+  dependencies:
+    has-flag "^3.0.0"
+
 supports-color@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
 
-supports-color@^5.3.0:
+supports-color@^5.3.0, supports-color@^5.5.0:
   version "5.5.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
   dependencies:
     has-flag "^3.0.0"
 
-throttleit@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/throttleit/-/throttleit-1.0.0.tgz#9e785836daf46743145a5984b6268d828528ac6c"
+text-encoding@^0.6.4:
+  version "0.6.4"
+  resolved "http://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz#e399a982257a276dae428bb92845cb71bdc26d19"
 
 through2@^0.5.1:
   version "0.5.1"
@@ -3015,7 +3041,7 @@ through2@^0.6.1:
     readable-stream ">=1.0.33-1 <1.1.0-0"
     xtend ">=4.0.0 <4.1.0-0"
 
-through2@^2.0.0, through2@^2.0.1:
+through2@^2.0.0:
   version "2.0.5"
   resolved "https://registry.yarnpkg.com/through2/-/through2-2.0.5.tgz#01c1e39eb31d07cb7d03a96a70823260b23132cd"
   dependencies:
@@ -3062,46 +3088,17 @@ to-regex@^3.0.1, to-regex@^3.0.2:
     regex-not "^1.0.2"
     safe-regex "^1.1.0"
 
-tough-cookie@~2.2.0:
-  version "2.2.2"
-  resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.2.2.tgz#c83a1830f4e5ef0b93ef2a3488e724f8de016ac7"
-
-tough-cookie@~2.4.3:
-  version "2.4.3"
-  resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.4.3.tgz#53f36da3f47783b0925afa06ff9f3b165280f781"
-  dependencies:
-    psl "^1.1.24"
-    punycode "^1.4.1"
+trim-newlines@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/trim-newlines/-/trim-newlines-2.0.0.tgz#b403d0b91be50c331dfc4b82eeceb22c3de16d20"
 
 trim-right@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/trim-right/-/trim-right-1.0.1.tgz#cb2e1203067e0c8de1f614094b9fe45704ea6003"
 
-tunnel-agent@^0.6.0:
-  version "0.6.0"
-  resolved "https://registry.yarnpkg.com/tunnel-agent/-/tunnel-agent-0.6.0.tgz#27a5dea06b36b04a0a9966774b290868f0fc40fd"
-  dependencies:
-    safe-buffer "^5.0.1"
-
-tunnel-agent@~0.4.1:
-  version "0.4.3"
-  resolved "https://registry.yarnpkg.com/tunnel-agent/-/tunnel-agent-0.4.3.tgz#6373db76909fe570e08d73583365ed828a74eeeb"
-
-tweetnacl@^0.14.3, tweetnacl@~0.14.0:
-  version "0.14.5"
-  resolved "https://registry.yarnpkg.com/tweetnacl/-/tweetnacl-0.14.5.tgz#5ae68177f192d4456269d108afa93ff8743f4f64"
-
-type-detect@0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-0.1.1.tgz#0ba5ec2a885640e470ea4e8505971900dac58822"
-
-type-detect@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-1.0.0.tgz#762217cc06db258ec48908a1298e8b95121e8ea2"
-
-typedarray@^0.0.6, typedarray@~0.0.5:
-  version "0.0.6"
-  resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
+type-detect@4.0.8, type-detect@^4.0.0, type-detect@^4.0.5:
+  version "4.0.8"
+  resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c"
 
 uglify-js@2.6.4:
   version "2.6.4"
@@ -3120,6 +3117,10 @@ uglify-to-browserify@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz#6e0924d6bda6b5afe349e39a6d632850a0f882b7"
 
+ultron@~1.1.0:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.1.1.tgz#9fe1536a10a664a65266a1e3ccf85fd36302bc9c"
+
 unc-path-regex@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/unc-path-regex/-/unc-path-regex-0.1.2.tgz#e73dd3d7b0d7c5ed86fbac6b0ae7d8c6a69d50fa"
@@ -3144,12 +3145,6 @@ unset-value@^1.0.0:
     has-value "^0.3.1"
     isobject "^3.0.0"
 
-uri-js@^4.2.2:
-  version "4.2.2"
-  resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.2.2.tgz#94c540e1ff772956e2299507c010aea6c8838eb0"
-  dependencies:
-    punycode "^2.1.0"
-
 urix@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/urix/-/urix-0.1.0.tgz#da937f7a62e21fec1fd18d49b35c2935067a6c72"
@@ -3166,23 +3161,18 @@ util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
 
-uuid@^3.3.2:
-  version "3.3.2"
-  resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.2.tgz#1b4af4955eb3077c501c23872fc6513811587131"
-
 v8flags@^2.0.2:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/v8flags/-/v8flags-2.1.1.tgz#aab1a1fa30d45f88dd321148875ac02c0b55e5b4"
   dependencies:
     user-home "^1.1.1"
 
-verror@1.10.0:
-  version "1.10.0"
-  resolved "https://registry.yarnpkg.com/verror/-/verror-1.10.0.tgz#3a105ca17053af55d6e270c1f8288682e18da400"
+validate-npm-package-license@^3.0.1:
+  version "3.0.4"
+  resolved "https://registry.yarnpkg.com/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz#fc91f6b9c7ba15c857f4cb2c5defeec39d4f410a"
   dependencies:
-    assert-plus "^1.0.0"
-    core-util-is "1.0.2"
-    extsprintf "^1.2.0"
+    spdx-correct "^3.0.0"
+    spdx-expression-parse "^3.0.0"
 
 vinyl-fs@^0.3.0:
   version "0.3.14"
@@ -3218,18 +3208,12 @@ vinyl@^0.5.0:
     clone-stats "^0.0.1"
     replace-ext "0.0.1"
 
-which@^1.2.10, which@^1.2.14, which@^1.2.9:
+which@^1.2.14, which@^1.2.9:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
   dependencies:
     isexe "^2.0.0"
 
-which@~1.2.2:
-  version "1.2.14"
-  resolved "https://registry.yarnpkg.com/which/-/which-1.2.14.tgz#9a87c4378f03e827cecaf1acdf56c736c01c14e5"
-  dependencies:
-    isexe "^2.0.0"
-
 window-size@0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.0.tgz#5438cd2ea93b202efa3a19fe8887aee7c94f9c9d"
@@ -3242,7 +3226,15 @@ wrappy@1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
 
-"xtend@>=4.0.0 <4.1.0-0", xtend@^4.0.0, xtend@~4.0.1:
+ws@3.3.x:
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-3.3.3.tgz#f1cf84fe2d5e901ebce94efaece785f187a228f2"
+  dependencies:
+    async-limiter "~1.0.0"
+    safe-buffer "~5.1.0"
+    ultron "~1.1.0"
+
+"xtend@>=4.0.0 <4.1.0-0", xtend@~4.0.1:
   version "4.0.1"
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"
 
@@ -3262,9 +3254,3 @@ yargs@~3.10.0:
     cliui "^2.1.0"
     decamelize "^1.0.0"
     window-size "0.1.0"
-
-yauzl@2.4.1:
-  version "2.4.1"
-  resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.4.1.tgz#9528f442dab1b2284e58b4379bb194e22e0c4005"
-  dependencies:
-    fd-slicer "~1.0.1"

From 4baa93586bbd1b6ad8dd906afef0d5206afb22c9 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 22 Dec 2018 21:10:02 +0100
Subject: [PATCH 04/65] Prettier

---
 test/test.js | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/test/test.js b/test/test.js
index e81414a..a8ccc2b 100644
--- a/test/test.js
+++ b/test/test.js
@@ -36,9 +36,7 @@ describe('Chocolat', function() {
             )
             expect($('#container .chocolat-bottom').find('.chocolat-fullscreen').length).to.equal(1)
             expect($('#container .chocolat-bottom').find('.chocolat-set-title').length).to.equal(1)
-            expect($('#container .chocolat-content').find('.chocolat-img').length).to.equal(
-                1
-            )
+            expect($('#container .chocolat-content').find('.chocolat-img').length).to.equal(1)
         })
 
         it('should add css classes to parent when in container', function(done) {
@@ -552,10 +550,8 @@ describe('Chocolat', function() {
                         expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
                         expect(dim.imgHeight).to.be.closeTo(dim.containerHeight, 1)
                     } else {
-                        console.log('debug: ', "b")
                         var targetHeight = dim.imgWidth * dim.imgRatio
                         // 1px delta, because of rounded values
-                        console.log('debug: ',dim.imgHeight,  targetHeight)
                         expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
                         expect(dim.imgWidth).to.be.closeTo(dim.containerWidth, 1)
                     }

From 297dbfad70178bb8023273f73c3d3627f3930026 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 22 Dec 2018 21:27:44 +0100
Subject: [PATCH 05/65] Use fat arrow functions to remove ugly that keyword
 from 2k10

---
 dist/js/chocolat.cjs.js  | 188 +++++++++++++++++---------------------
 dist/js/chocolat.esm.js  | 188 +++++++++++++++++---------------------
 dist/js/chocolat.iife.js | 188 +++++++++++++++++---------------------
 src/js/chocolat.js       | 192 ++++++++++++++++++---------------------
 4 files changed, 342 insertions(+), 414 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 1dc099d..a0ef5ed 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -40,7 +40,6 @@ const defaults = {
 };
 class Chocolat {
   constructor(element, settings) {
-    var that = this;
     this.settings = settings;
     this.elems = {};
     this.element = $(element);
@@ -50,17 +49,17 @@ class Chocolat {
       this.settings.setTitle = this.element.data('chocolat-title');
     }
 
-    this.element.find(this.settings.imageSelector).each(function () {
-      that.settings.images.push({
-        title: $(this).attr('title'),
-        src: $(this).attr(that.settings.imageSource),
+    this.element.find(this.settings.imageSelector).each((i, el) => {
+      this.settings.images.push({
+        title: $(el).attr('title'),
+        src: $(el).attr(this.settings.imageSource),
         height: false,
         width: false
       });
     });
-    this.element.find(this.settings.imageSelector).each(function (i) {
-      $(this).off('click.chocolat').on('click.chocolat', function (e) {
-        that.init(i);
+    this.element.find(this.settings.imageSelector).each((i, el) => {
+      $(el).off('click.chocolat').on('click.chocolat', e => {
+        this.init(i);
         e.preventDefault();
       });
     });
@@ -88,7 +87,7 @@ class Chocolat {
 
     var imgLoader = new Image();
 
-    imgLoader.onload = function () {
+    imgLoader.onload = () => {
       def.resolve(imgLoader);
     };
 
@@ -97,8 +96,6 @@ class Chocolat {
   }
 
   load(i) {
-    var that = this;
-
     if (this.settings.fullScreen) {
       this.openFullScreen();
     }
@@ -110,18 +107,18 @@ class Chocolat {
     this.elems.overlay.fadeIn(this.settings.duration);
     this.elems.wrapper.fadeIn(this.settings.duration);
     this.elems.domContainer.addClass('chocolat-open');
-    this.settings.timer = setTimeout(function () {
-      if (typeof that.elems != 'undefined') {
-        $.proxy(that.elems.loader.fadeIn(), that);
+    this.settings.timer = setTimeout(() => {
+      if (typeof this.elems != 'undefined') {
+        this.elems.loader.fadeIn();
       }
     }, this.settings.duration);
-    var deferred = this.preload(i).then(function (imgLoader) {
-      return that.place(i, imgLoader);
-    }).then(function (imgLoader) {
-      return that.appear(i);
-    }).then(function (imgLoader) {
-      that.zoomable();
-      that.settings.afterImageLoad.call(that);
+    var deferred = this.preload(i).then(imgLoader => {
+      return this.place(i, imgLoader);
+    }).then(imgLoader => {
+      return this.appear(i);
+    }).then(imgLoader => {
+      this.zoomable();
+      this.settings.afterImageLoad();
     });
     var nextIndex = i + 1;
 
@@ -133,14 +130,13 @@ class Chocolat {
   }
 
   place(i, imgLoader) {
-    var that = this;
     var fitting;
     this.settings.currentImage = i;
     this.description();
     this.pagination();
     this.arrows();
     this.storeImgSize(imgLoader, i);
-    fitting = this.fit(i, that.elems.wrapper);
+    fitting = this.fit(i, this.elems.wrapper);
     return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
   }
 
@@ -154,10 +150,9 @@ class Chocolat {
   }
 
   appear(i) {
-    var that = this;
     clearTimeout(this.settings.timer);
-    this.elems.loader.stop().fadeOut(300, function () {
-      that.elems.img.attr('src', that.settings.images[i].src);
+    this.elems.loader.stop().fadeOut(300, () => {
+      this.elems.img.attr('src', this.settings.images[i].src);
     });
   }
 
@@ -251,15 +246,13 @@ class Chocolat {
   }
 
   description() {
-    var that = this;
-    this.elems.description.html(that.settings.images[that.settings.currentImage].title);
+    this.elems.description.html(this.settings.images[this.settings.currentImage].title);
   }
 
   pagination() {
-    var that = this;
     var last = this.settings.lastImage + 1;
     var position = this.settings.currentImage + 1;
-    this.elems.pagination.html(position + ' ' + that.settings.separator2 + last);
+    this.elems.pagination.html(position + ' ' + this.settings.separator2 + last);
   }
 
   storeImgSize(img, i) {
@@ -280,9 +273,8 @@ class Chocolat {
     }
 
     var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
-    var that = this;
-    var def = $.when($(els).fadeOut(200)).done(function () {
-      that.elems.domContainer.removeClass('chocolat-open');
+    var def = $.when($(els).fadeOut(200)).done(() => {
+      this.elems.domContainer.removeClass('chocolat-open');
     });
     this.settings.currentImage = false;
     return def;
@@ -414,79 +406,70 @@ class Chocolat {
   }
 
   events() {
-    var that = this;
-    $(document).off('keydown.chocolat').on('keydown.chocolat', function (e) {
-      if (that.settings.initialized) {
+    $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
+      if (this.settings.initialized) {
         if (e.keyCode == 37) {
-          that.change(-1);
+          this.change(-1);
         } else if (e.keyCode == 39) {
-          that.change(1);
+          this.change(1);
         } else if (e.keyCode == 27) {
-          that.close();
+          this.close();
         }
       }
-    }); // this.elems.wrapper.find('.chocolat-img')
-    //     .off('click.chocolat')
-    //     .on('click.chocolat', function(e) {
-    //         var currentImage = that.settings.images[that.settings.currentImage];
-    //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
-    //             that.toggleZoom(e);
-    //         }
-    // });
-
-    this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', function () {
-      that.change(+1);
     });
-    this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', function () {
-      return that.change(-1);
+    this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+      this.change(+1);
+    });
+    this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
+      return this.change(-1);
     });
-    $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', function () {
-      return that.close();
+    $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', () => {
+      return this.close();
     });
-    this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function () {
-      if (that.settings.fullscreenOpen) {
-        that.exitFullScreen();
+    this.elems.fullscreen.off('click.chocolat').on('click.chocolat', () => {
+      if (this.settings.fullscreenOpen) {
+        this.exitFullScreen();
         return;
       }
 
-      that.openFullScreen();
+      this.openFullScreen();
     });
 
-    if (that.settings.backgroundClose) {
-      this.elems.overlay.off('click.chocolat').on('click.chocolat', function () {
-        return that.close();
+    if (this.settings.backgroundClose) {
+      this.elems.overlay.off('click.chocolat').on('click.chocolat', () => {
+        return this.close();
       });
     }
 
-    this.elems.wrapper.off('click.chocolat').on('click.chocolat', function (e) {
-      return that.zoomOut(e);
+    this.elems.wrapper.off('click.chocolat').on('click.chocolat', e => {
+      return this.zoomOut(e);
     });
-    this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', function (e) {
-      if (that.settings.initialZoomState === null && that.elems.domContainer.hasClass('chocolat-zoomable')) {
+    this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+      if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
         e.stopPropagation();
-        return that.zoomIn(e);
+        return this.zoomIn(e);
       }
     });
-    this.elems.wrapper.mousemove(function (e) {
-      if (that.settings.initialZoomState === null) {
+    this.elems.wrapper.mousemove(e => {
+      if (this.settings.initialZoomState === null) {
         return;
       }
 
-      if (that.elems.img.is(':animated')) {
+      if (this.elems.img.is(':animated')) {
         return;
       }
 
       var pos = $(this).offset();
       var height = $(this).height();
       var width = $(this).width();
-      var currentImage = that.settings.images[that.settings.currentImage];
+      var currentImage = this.settings.images[this.settings.currentImage];
       var imgWidth = currentImage.width;
       var imgHeight = currentImage.height;
       var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
       var mvtX = 0;
 
       if (imgWidth > width) {
-        var paddingX = that.settings.zoomedPaddingX(imgWidth, width);
+        var paddingX = this.settings.zoomedPaddingX(imgWidth, width);
         mvtX = coord[0] / (width / 2);
         mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
       }
@@ -494,7 +477,7 @@ class Chocolat {
       var mvtY = 0;
 
       if (imgHeight > height) {
-        var paddingY = that.settings.zoomedPaddingY(imgHeight, height);
+        var paddingY = this.settings.zoomedPaddingY(imgHeight, height);
         mvtY = coord[1] / (height / 2);
         mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
       }
@@ -505,20 +488,20 @@ class Chocolat {
       };
 
       if (typeof e.duration !== 'undefined') {
-        $(that.elems.img).stop(false, true).animate(animation, e.duration);
+        $(this.elems.img).stop(false, true).animate(animation, e.duration);
       } else {
-        $(that.elems.img).stop(false, true).css(animation);
+        $(this.elems.img).stop(false, true).css(animation);
       }
     });
-    $(window).on('resize', function () {
-      if (!that.settings.initialized || that.settings.currentImage === false) {
+    $(window).on('resize', () => {
+      if (!this.settings.initialized || this.settings.currentImage === false) {
         return;
       }
 
-      that.debounce(50, function () {
-        var fitting = that.fit(that.settings.currentImage, that.elems.wrapper);
-        that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
-        that.zoomable();
+      this.debounce(50, () => {
+        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+        this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+        this.zoomable();
       });
     });
   }
@@ -584,43 +567,42 @@ class Chocolat {
   }
 
   api() {
-    var that = this;
     return {
-      open: function (i) {
+      open: i => {
         i = parseInt(i) || 0;
-        return that.init(i);
+        return this.init(i);
       },
-      close: function () {
-        return that.close();
+      close: () => {
+        return this.close();
       },
-      next: function () {
-        return that.change(1);
+      next: () => {
+        return this.change(1);
       },
-      prev: function () {
-        return that.change(-1);
+      prev: () => {
+        return this.change(-1);
       },
-      goto: function (i) {
+      goto: i => {
         // open alias
-        return that.open(i);
+        return this.open(i);
       },
-      current: function () {
-        return that.settings.currentImage;
+      current: () => {
+        return this.settings.currentImage;
       },
-      place: function () {
-        return that.place(that.settings.currentImage, that.settings.duration);
+      place: () => {
+        return this.place(this.settings.currentImage, this.settings.duration);
       },
-      destroy: function () {
-        return that.destroy();
+      destroy: () => {
+        return this.destroy();
       },
-      set: function (property, value) {
-        that.settings[property] = value;
+      set: (property, value) => {
+        this.settings[property] = value;
         return value;
       },
-      get: function (property) {
-        return that.settings[property];
+      get: property => {
+        return this.settings[property];
       },
-      getElem: function (name) {
-        return that.elems[name];
+      getElem: name => {
+        return this.elems[name];
       }
     };
   }
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 8fe1391..bfc8f1a 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -38,7 +38,6 @@ const defaults = {
 };
 class Chocolat {
   constructor(element, settings) {
-    var that = this;
     this.settings = settings;
     this.elems = {};
     this.element = $(element);
@@ -48,17 +47,17 @@ class Chocolat {
       this.settings.setTitle = this.element.data('chocolat-title');
     }
 
-    this.element.find(this.settings.imageSelector).each(function () {
-      that.settings.images.push({
-        title: $(this).attr('title'),
-        src: $(this).attr(that.settings.imageSource),
+    this.element.find(this.settings.imageSelector).each((i, el) => {
+      this.settings.images.push({
+        title: $(el).attr('title'),
+        src: $(el).attr(this.settings.imageSource),
         height: false,
         width: false
       });
     });
-    this.element.find(this.settings.imageSelector).each(function (i) {
-      $(this).off('click.chocolat').on('click.chocolat', function (e) {
-        that.init(i);
+    this.element.find(this.settings.imageSelector).each((i, el) => {
+      $(el).off('click.chocolat').on('click.chocolat', e => {
+        this.init(i);
         e.preventDefault();
       });
     });
@@ -86,7 +85,7 @@ class Chocolat {
 
     var imgLoader = new Image();
 
-    imgLoader.onload = function () {
+    imgLoader.onload = () => {
       def.resolve(imgLoader);
     };
 
@@ -95,8 +94,6 @@ class Chocolat {
   }
 
   load(i) {
-    var that = this;
-
     if (this.settings.fullScreen) {
       this.openFullScreen();
     }
@@ -108,18 +105,18 @@ class Chocolat {
     this.elems.overlay.fadeIn(this.settings.duration);
     this.elems.wrapper.fadeIn(this.settings.duration);
     this.elems.domContainer.addClass('chocolat-open');
-    this.settings.timer = setTimeout(function () {
-      if (typeof that.elems != 'undefined') {
-        $.proxy(that.elems.loader.fadeIn(), that);
+    this.settings.timer = setTimeout(() => {
+      if (typeof this.elems != 'undefined') {
+        this.elems.loader.fadeIn();
       }
     }, this.settings.duration);
-    var deferred = this.preload(i).then(function (imgLoader) {
-      return that.place(i, imgLoader);
-    }).then(function (imgLoader) {
-      return that.appear(i);
-    }).then(function (imgLoader) {
-      that.zoomable();
-      that.settings.afterImageLoad.call(that);
+    var deferred = this.preload(i).then(imgLoader => {
+      return this.place(i, imgLoader);
+    }).then(imgLoader => {
+      return this.appear(i);
+    }).then(imgLoader => {
+      this.zoomable();
+      this.settings.afterImageLoad();
     });
     var nextIndex = i + 1;
 
@@ -131,14 +128,13 @@ class Chocolat {
   }
 
   place(i, imgLoader) {
-    var that = this;
     var fitting;
     this.settings.currentImage = i;
     this.description();
     this.pagination();
     this.arrows();
     this.storeImgSize(imgLoader, i);
-    fitting = this.fit(i, that.elems.wrapper);
+    fitting = this.fit(i, this.elems.wrapper);
     return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
   }
 
@@ -152,10 +148,9 @@ class Chocolat {
   }
 
   appear(i) {
-    var that = this;
     clearTimeout(this.settings.timer);
-    this.elems.loader.stop().fadeOut(300, function () {
-      that.elems.img.attr('src', that.settings.images[i].src);
+    this.elems.loader.stop().fadeOut(300, () => {
+      this.elems.img.attr('src', this.settings.images[i].src);
     });
   }
 
@@ -249,15 +244,13 @@ class Chocolat {
   }
 
   description() {
-    var that = this;
-    this.elems.description.html(that.settings.images[that.settings.currentImage].title);
+    this.elems.description.html(this.settings.images[this.settings.currentImage].title);
   }
 
   pagination() {
-    var that = this;
     var last = this.settings.lastImage + 1;
     var position = this.settings.currentImage + 1;
-    this.elems.pagination.html(position + ' ' + that.settings.separator2 + last);
+    this.elems.pagination.html(position + ' ' + this.settings.separator2 + last);
   }
 
   storeImgSize(img, i) {
@@ -278,9 +271,8 @@ class Chocolat {
     }
 
     var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
-    var that = this;
-    var def = $.when($(els).fadeOut(200)).done(function () {
-      that.elems.domContainer.removeClass('chocolat-open');
+    var def = $.when($(els).fadeOut(200)).done(() => {
+      this.elems.domContainer.removeClass('chocolat-open');
     });
     this.settings.currentImage = false;
     return def;
@@ -412,79 +404,70 @@ class Chocolat {
   }
 
   events() {
-    var that = this;
-    $(document).off('keydown.chocolat').on('keydown.chocolat', function (e) {
-      if (that.settings.initialized) {
+    $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
+      if (this.settings.initialized) {
         if (e.keyCode == 37) {
-          that.change(-1);
+          this.change(-1);
         } else if (e.keyCode == 39) {
-          that.change(1);
+          this.change(1);
         } else if (e.keyCode == 27) {
-          that.close();
+          this.close();
         }
       }
-    }); // this.elems.wrapper.find('.chocolat-img')
-    //     .off('click.chocolat')
-    //     .on('click.chocolat', function(e) {
-    //         var currentImage = that.settings.images[that.settings.currentImage];
-    //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
-    //             that.toggleZoom(e);
-    //         }
-    // });
-
-    this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', function () {
-      that.change(+1);
     });
-    this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', function () {
-      return that.change(-1);
+    this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+      this.change(+1);
+    });
+    this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
+      return this.change(-1);
     });
-    $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', function () {
-      return that.close();
+    $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', () => {
+      return this.close();
     });
-    this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function () {
-      if (that.settings.fullscreenOpen) {
-        that.exitFullScreen();
+    this.elems.fullscreen.off('click.chocolat').on('click.chocolat', () => {
+      if (this.settings.fullscreenOpen) {
+        this.exitFullScreen();
         return;
       }
 
-      that.openFullScreen();
+      this.openFullScreen();
     });
 
-    if (that.settings.backgroundClose) {
-      this.elems.overlay.off('click.chocolat').on('click.chocolat', function () {
-        return that.close();
+    if (this.settings.backgroundClose) {
+      this.elems.overlay.off('click.chocolat').on('click.chocolat', () => {
+        return this.close();
       });
     }
 
-    this.elems.wrapper.off('click.chocolat').on('click.chocolat', function (e) {
-      return that.zoomOut(e);
+    this.elems.wrapper.off('click.chocolat').on('click.chocolat', e => {
+      return this.zoomOut(e);
     });
-    this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', function (e) {
-      if (that.settings.initialZoomState === null && that.elems.domContainer.hasClass('chocolat-zoomable')) {
+    this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+      if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
         e.stopPropagation();
-        return that.zoomIn(e);
+        return this.zoomIn(e);
       }
     });
-    this.elems.wrapper.mousemove(function (e) {
-      if (that.settings.initialZoomState === null) {
+    this.elems.wrapper.mousemove(e => {
+      if (this.settings.initialZoomState === null) {
         return;
       }
 
-      if (that.elems.img.is(':animated')) {
+      if (this.elems.img.is(':animated')) {
         return;
       }
 
       var pos = $(this).offset();
       var height = $(this).height();
       var width = $(this).width();
-      var currentImage = that.settings.images[that.settings.currentImage];
+      var currentImage = this.settings.images[this.settings.currentImage];
       var imgWidth = currentImage.width;
       var imgHeight = currentImage.height;
       var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
       var mvtX = 0;
 
       if (imgWidth > width) {
-        var paddingX = that.settings.zoomedPaddingX(imgWidth, width);
+        var paddingX = this.settings.zoomedPaddingX(imgWidth, width);
         mvtX = coord[0] / (width / 2);
         mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
       }
@@ -492,7 +475,7 @@ class Chocolat {
       var mvtY = 0;
 
       if (imgHeight > height) {
-        var paddingY = that.settings.zoomedPaddingY(imgHeight, height);
+        var paddingY = this.settings.zoomedPaddingY(imgHeight, height);
         mvtY = coord[1] / (height / 2);
         mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
       }
@@ -503,20 +486,20 @@ class Chocolat {
       };
 
       if (typeof e.duration !== 'undefined') {
-        $(that.elems.img).stop(false, true).animate(animation, e.duration);
+        $(this.elems.img).stop(false, true).animate(animation, e.duration);
       } else {
-        $(that.elems.img).stop(false, true).css(animation);
+        $(this.elems.img).stop(false, true).css(animation);
       }
     });
-    $(window).on('resize', function () {
-      if (!that.settings.initialized || that.settings.currentImage === false) {
+    $(window).on('resize', () => {
+      if (!this.settings.initialized || this.settings.currentImage === false) {
         return;
       }
 
-      that.debounce(50, function () {
-        var fitting = that.fit(that.settings.currentImage, that.elems.wrapper);
-        that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
-        that.zoomable();
+      this.debounce(50, () => {
+        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+        this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+        this.zoomable();
       });
     });
   }
@@ -582,43 +565,42 @@ class Chocolat {
   }
 
   api() {
-    var that = this;
     return {
-      open: function (i) {
+      open: i => {
         i = parseInt(i) || 0;
-        return that.init(i);
+        return this.init(i);
       },
-      close: function () {
-        return that.close();
+      close: () => {
+        return this.close();
       },
-      next: function () {
-        return that.change(1);
+      next: () => {
+        return this.change(1);
       },
-      prev: function () {
-        return that.change(-1);
+      prev: () => {
+        return this.change(-1);
       },
-      goto: function (i) {
+      goto: i => {
         // open alias
-        return that.open(i);
+        return this.open(i);
       },
-      current: function () {
-        return that.settings.currentImage;
+      current: () => {
+        return this.settings.currentImage;
       },
-      place: function () {
-        return that.place(that.settings.currentImage, that.settings.duration);
+      place: () => {
+        return this.place(this.settings.currentImage, this.settings.duration);
       },
-      destroy: function () {
-        return that.destroy();
+      destroy: () => {
+        return this.destroy();
       },
-      set: function (property, value) {
-        that.settings[property] = value;
+      set: (property, value) => {
+        this.settings[property] = value;
         return value;
       },
-      get: function (property) {
-        return that.settings[property];
+      get: property => {
+        return this.settings[property];
       },
-      getElem: function (name) {
-        return that.elems[name];
+      getElem: name => {
+        return this.elems[name];
       }
     };
   }
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 3c688c1..965eaa6 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -41,7 +41,6 @@
     };
     class Chocolat {
       constructor(element, settings) {
-        var that = this;
         this.settings = settings;
         this.elems = {};
         this.element = $(element);
@@ -51,17 +50,17 @@
           this.settings.setTitle = this.element.data('chocolat-title');
         }
 
-        this.element.find(this.settings.imageSelector).each(function () {
-          that.settings.images.push({
-            title: $(this).attr('title'),
-            src: $(this).attr(that.settings.imageSource),
+        this.element.find(this.settings.imageSelector).each((i, el) => {
+          this.settings.images.push({
+            title: $(el).attr('title'),
+            src: $(el).attr(this.settings.imageSource),
             height: false,
             width: false
           });
         });
-        this.element.find(this.settings.imageSelector).each(function (i) {
-          $(this).off('click.chocolat').on('click.chocolat', function (e) {
-            that.init(i);
+        this.element.find(this.settings.imageSelector).each((i, el) => {
+          $(el).off('click.chocolat').on('click.chocolat', e => {
+            this.init(i);
             e.preventDefault();
           });
         });
@@ -89,7 +88,7 @@
 
         var imgLoader = new Image();
 
-        imgLoader.onload = function () {
+        imgLoader.onload = () => {
           def.resolve(imgLoader);
         };
 
@@ -98,8 +97,6 @@
       }
 
       load(i) {
-        var that = this;
-
         if (this.settings.fullScreen) {
           this.openFullScreen();
         }
@@ -111,18 +108,18 @@
         this.elems.overlay.fadeIn(this.settings.duration);
         this.elems.wrapper.fadeIn(this.settings.duration);
         this.elems.domContainer.addClass('chocolat-open');
-        this.settings.timer = setTimeout(function () {
-          if (typeof that.elems != 'undefined') {
-            $.proxy(that.elems.loader.fadeIn(), that);
+        this.settings.timer = setTimeout(() => {
+          if (typeof this.elems != 'undefined') {
+            this.elems.loader.fadeIn();
           }
         }, this.settings.duration);
-        var deferred = this.preload(i).then(function (imgLoader) {
-          return that.place(i, imgLoader);
-        }).then(function (imgLoader) {
-          return that.appear(i);
-        }).then(function (imgLoader) {
-          that.zoomable();
-          that.settings.afterImageLoad.call(that);
+        var deferred = this.preload(i).then(imgLoader => {
+          return this.place(i, imgLoader);
+        }).then(imgLoader => {
+          return this.appear(i);
+        }).then(imgLoader => {
+          this.zoomable();
+          this.settings.afterImageLoad();
         });
         var nextIndex = i + 1;
 
@@ -134,14 +131,13 @@
       }
 
       place(i, imgLoader) {
-        var that = this;
         var fitting;
         this.settings.currentImage = i;
         this.description();
         this.pagination();
         this.arrows();
         this.storeImgSize(imgLoader, i);
-        fitting = this.fit(i, that.elems.wrapper);
+        fitting = this.fit(i, this.elems.wrapper);
         return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
       }
 
@@ -155,10 +151,9 @@
       }
 
       appear(i) {
-        var that = this;
         clearTimeout(this.settings.timer);
-        this.elems.loader.stop().fadeOut(300, function () {
-          that.elems.img.attr('src', that.settings.images[i].src);
+        this.elems.loader.stop().fadeOut(300, () => {
+          this.elems.img.attr('src', this.settings.images[i].src);
         });
       }
 
@@ -252,15 +247,13 @@
       }
 
       description() {
-        var that = this;
-        this.elems.description.html(that.settings.images[that.settings.currentImage].title);
+        this.elems.description.html(this.settings.images[this.settings.currentImage].title);
       }
 
       pagination() {
-        var that = this;
         var last = this.settings.lastImage + 1;
         var position = this.settings.currentImage + 1;
-        this.elems.pagination.html(position + ' ' + that.settings.separator2 + last);
+        this.elems.pagination.html(position + ' ' + this.settings.separator2 + last);
       }
 
       storeImgSize(img, i) {
@@ -281,9 +274,8 @@
         }
 
         var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
-        var that = this;
-        var def = $.when($(els).fadeOut(200)).done(function () {
-          that.elems.domContainer.removeClass('chocolat-open');
+        var def = $.when($(els).fadeOut(200)).done(() => {
+          this.elems.domContainer.removeClass('chocolat-open');
         });
         this.settings.currentImage = false;
         return def;
@@ -415,79 +407,70 @@
       }
 
       events() {
-        var that = this;
-        $(document).off('keydown.chocolat').on('keydown.chocolat', function (e) {
-          if (that.settings.initialized) {
+        $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
+          if (this.settings.initialized) {
             if (e.keyCode == 37) {
-              that.change(-1);
+              this.change(-1);
             } else if (e.keyCode == 39) {
-              that.change(1);
+              this.change(1);
             } else if (e.keyCode == 27) {
-              that.close();
+              this.close();
             }
           }
-        }); // this.elems.wrapper.find('.chocolat-img')
-        //     .off('click.chocolat')
-        //     .on('click.chocolat', function(e) {
-        //         var currentImage = that.settings.images[that.settings.currentImage];
-        //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
-        //             that.toggleZoom(e);
-        //         }
-        // });
-
-        this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', function () {
-          that.change(+1);
         });
-        this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', function () {
-          return that.change(-1);
+        this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+          this.change(+1);
+        });
+        this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
+          return this.change(-1);
         });
-        $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', function () {
-          return that.close();
+        $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', () => {
+          return this.close();
         });
-        this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function () {
-          if (that.settings.fullscreenOpen) {
-            that.exitFullScreen();
+        this.elems.fullscreen.off('click.chocolat').on('click.chocolat', () => {
+          if (this.settings.fullscreenOpen) {
+            this.exitFullScreen();
             return;
           }
 
-          that.openFullScreen();
+          this.openFullScreen();
         });
 
-        if (that.settings.backgroundClose) {
-          this.elems.overlay.off('click.chocolat').on('click.chocolat', function () {
-            return that.close();
+        if (this.settings.backgroundClose) {
+          this.elems.overlay.off('click.chocolat').on('click.chocolat', () => {
+            return this.close();
           });
         }
 
-        this.elems.wrapper.off('click.chocolat').on('click.chocolat', function (e) {
-          return that.zoomOut(e);
+        this.elems.wrapper.off('click.chocolat').on('click.chocolat', e => {
+          return this.zoomOut(e);
         });
-        this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', function (e) {
-          if (that.settings.initialZoomState === null && that.elems.domContainer.hasClass('chocolat-zoomable')) {
+        this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+          if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
             e.stopPropagation();
-            return that.zoomIn(e);
+            return this.zoomIn(e);
           }
         });
-        this.elems.wrapper.mousemove(function (e) {
-          if (that.settings.initialZoomState === null) {
+        this.elems.wrapper.mousemove(e => {
+          if (this.settings.initialZoomState === null) {
             return;
           }
 
-          if (that.elems.img.is(':animated')) {
+          if (this.elems.img.is(':animated')) {
             return;
           }
 
           var pos = $(this).offset();
           var height = $(this).height();
           var width = $(this).width();
-          var currentImage = that.settings.images[that.settings.currentImage];
+          var currentImage = this.settings.images[this.settings.currentImage];
           var imgWidth = currentImage.width;
           var imgHeight = currentImage.height;
           var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
           var mvtX = 0;
 
           if (imgWidth > width) {
-            var paddingX = that.settings.zoomedPaddingX(imgWidth, width);
+            var paddingX = this.settings.zoomedPaddingX(imgWidth, width);
             mvtX = coord[0] / (width / 2);
             mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
           }
@@ -495,7 +478,7 @@
           var mvtY = 0;
 
           if (imgHeight > height) {
-            var paddingY = that.settings.zoomedPaddingY(imgHeight, height);
+            var paddingY = this.settings.zoomedPaddingY(imgHeight, height);
             mvtY = coord[1] / (height / 2);
             mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
           }
@@ -506,20 +489,20 @@
           };
 
           if (typeof e.duration !== 'undefined') {
-            $(that.elems.img).stop(false, true).animate(animation, e.duration);
+            $(this.elems.img).stop(false, true).animate(animation, e.duration);
           } else {
-            $(that.elems.img).stop(false, true).css(animation);
+            $(this.elems.img).stop(false, true).css(animation);
           }
         });
-        $(window).on('resize', function () {
-          if (!that.settings.initialized || that.settings.currentImage === false) {
+        $(window).on('resize', () => {
+          if (!this.settings.initialized || this.settings.currentImage === false) {
             return;
           }
 
-          that.debounce(50, function () {
-            var fitting = that.fit(that.settings.currentImage, that.elems.wrapper);
-            that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
-            that.zoomable();
+          this.debounce(50, () => {
+            var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
+            this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+            this.zoomable();
           });
         });
       }
@@ -585,43 +568,42 @@
       }
 
       api() {
-        var that = this;
         return {
-          open: function (i) {
+          open: i => {
             i = parseInt(i) || 0;
-            return that.init(i);
+            return this.init(i);
           },
-          close: function () {
-            return that.close();
+          close: () => {
+            return this.close();
           },
-          next: function () {
-            return that.change(1);
+          next: () => {
+            return this.change(1);
           },
-          prev: function () {
-            return that.change(-1);
+          prev: () => {
+            return this.change(-1);
           },
-          goto: function (i) {
+          goto: i => {
             // open alias
-            return that.open(i);
+            return this.open(i);
           },
-          current: function () {
-            return that.settings.currentImage;
+          current: () => {
+            return this.settings.currentImage;
           },
-          place: function () {
-            return that.place(that.settings.currentImage, that.settings.duration);
+          place: () => {
+            return this.place(this.settings.currentImage, this.settings.duration);
           },
-          destroy: function () {
-            return that.destroy();
+          destroy: () => {
+            return this.destroy();
           },
-          set: function (property, value) {
-            that.settings[property] = value;
+          set: (property, value) => {
+            this.settings[property] = value;
             return value;
           },
-          get: function (property) {
-            return that.settings[property];
+          get: property => {
+            return this.settings[property];
           },
-          getElem: function (name) {
-            return that.elems[name];
+          getElem: name => {
+            return this.elems[name];
           }
         };
       }
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index f9cd165..96eefa8 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -33,8 +33,6 @@ export const defaults = {
 
 export class Chocolat {
     constructor(element, settings) {
-        var that = this
-
         this.settings = settings
         this.elems = {}
         this.element = $(element)
@@ -51,20 +49,20 @@ export class Chocolat {
             this.settings.setTitle = this.element.data('chocolat-title')
         }
 
-        this.element.find(this.settings.imageSelector).each(function() {
-            that.settings.images.push({
-                title: $(this).attr('title'),
-                src: $(this).attr(that.settings.imageSource),
+        this.element.find(this.settings.imageSelector).each((i, el) => {
+            this.settings.images.push({
+                title: $(el).attr('title'),
+                src: $(el).attr(this.settings.imageSource),
                 height: false,
                 width: false,
             })
         })
 
-        this.element.find(this.settings.imageSelector).each(function(i) {
-            $(this)
+        this.element.find(this.settings.imageSelector).each((i, el) => {
+            $(el)
                 .off('click.chocolat')
-                .on('click.chocolat', function(e) {
-                    that.init(i)
+                .on('click.chocolat', (e) => {
+                    this.init(i)
                     e.preventDefault()
                 })
         })
@@ -91,7 +89,7 @@ export class Chocolat {
             return
         }
         var imgLoader = new Image()
-        imgLoader.onload = function() {
+        imgLoader.onload = () => {
             def.resolve(imgLoader)
         }
         imgLoader.src = this.settings.images[i].src
@@ -100,7 +98,6 @@ export class Chocolat {
     }
 
     load(i) {
-        var that = this
         if (this.settings.fullScreen) {
             this.openFullScreen()
         }
@@ -113,22 +110,22 @@ export class Chocolat {
         this.elems.wrapper.fadeIn(this.settings.duration)
         this.elems.domContainer.addClass('chocolat-open')
 
-        this.settings.timer = setTimeout(function() {
-            if (typeof that.elems != 'undefined') {
-                $.proxy(that.elems.loader.fadeIn(), that)
+        this.settings.timer = setTimeout(() => {
+            if (typeof this.elems != 'undefined') {
+                this.elems.loader.fadeIn()
             }
         }, this.settings.duration)
 
         var deferred = this.preload(i)
-            .then(function(imgLoader) {
-                return that.place(i, imgLoader)
+            .then((imgLoader) => {
+                return this.place(i, imgLoader)
             })
-            .then(function(imgLoader) {
-                return that.appear(i)
+            .then((imgLoader) => {
+                return this.appear(i)
             })
-            .then(function(imgLoader) {
-                that.zoomable()
-                that.settings.afterImageLoad.call(that)
+            .then((imgLoader) => {
+                this.zoomable()
+                this.settings.afterImageLoad()
             })
 
         var nextIndex = i + 1
@@ -140,7 +137,6 @@ export class Chocolat {
     }
 
     place(i, imgLoader) {
-        var that = this
         var fitting
 
         this.settings.currentImage = i
@@ -149,7 +145,7 @@ export class Chocolat {
         this.arrows()
 
         this.storeImgSize(imgLoader, i)
-        fitting = this.fit(i, that.elems.wrapper)
+        fitting = this.fit(i, this.elems.wrapper)
 
         return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
     }
@@ -170,11 +166,10 @@ export class Chocolat {
     }
 
     appear(i) {
-        var that = this
         clearTimeout(this.settings.timer)
 
-        this.elems.loader.stop().fadeOut(300, function() {
-            that.elems.img.attr('src', that.settings.images[i].src)
+        this.elems.loader.stop().fadeOut(300, () => {
+            this.elems.img.attr('src', this.settings.images[i].src)
         })
     }
 
@@ -271,16 +266,14 @@ export class Chocolat {
     }
 
     description() {
-        var that = this
-        this.elems.description.html(that.settings.images[that.settings.currentImage].title)
+        this.elems.description.html(this.settings.images[this.settings.currentImage].title)
     }
 
     pagination() {
-        var that = this
         var last = this.settings.lastImage + 1
         var position = this.settings.currentImage + 1
 
-        this.elems.pagination.html(position + ' ' + that.settings.separator2 + last)
+        this.elems.pagination.html(position + ' ' + this.settings.separator2 + last)
     }
 
     storeImgSize(img, i) {
@@ -300,9 +293,8 @@ export class Chocolat {
         }
 
         var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]]
-        var that = this
-        var def = $.when($(els).fadeOut(200)).done(function() {
-            that.elems.domContainer.removeClass('chocolat-open')
+        var def = $.when($(els).fadeOut(200)).done(() => {
+            this.elems.domContainer.removeClass('chocolat-open')
         })
         this.settings.currentImage = false
 
@@ -445,86 +437,76 @@ export class Chocolat {
     }
 
     events() {
-        var that = this
-
         $(document)
             .off('keydown.chocolat')
-            .on('keydown.chocolat', function(e) {
-                if (that.settings.initialized) {
+            .on('keydown.chocolat', (e) => {
+                if (this.settings.initialized) {
                     if (e.keyCode == 37) {
-                        that.change(-1)
+                        this.change(-1)
                     } else if (e.keyCode == 39) {
-                        that.change(1)
+                        this.change(1)
                     } else if (e.keyCode == 27) {
-                        that.close()
+                        this.close()
                     }
                 }
             })
-        // this.elems.wrapper.find('.chocolat-img')
-        //     .off('click.chocolat')
-        //     .on('click.chocolat', function(e) {
-        //         var currentImage = that.settings.images[that.settings.currentImage];
-        //         if(currentImage.width > $(that.elems.wrapper).width() || currentImage.height > $(that.elems.wrapper).height() ){
-        //             that.toggleZoom(e);
-        //         }
-        // });
 
         this.elems.wrapper
             .find('.chocolat-right')
             .off('click.chocolat')
-            .on('click.chocolat', function() {
-                that.change(+1)
+            .on('click.chocolat', () => {
+                this.change(+1)
             })
 
         this.elems.wrapper
             .find('.chocolat-left')
             .off('click.chocolat')
-            .on('click.chocolat', function() {
-                return that.change(-1)
+            .on('click.chocolat', () => {
+                return this.change(-1)
             })
 
         $([this.elems.overlay[0], this.elems.close[0]])
             .off('click.chocolat')
-            .on('click.chocolat', function() {
-                return that.close()
+            .on('click.chocolat', () => {
+                return this.close()
             })
 
-        this.elems.fullscreen.off('click.chocolat').on('click.chocolat', function() {
-            if (that.settings.fullscreenOpen) {
-                that.exitFullScreen()
+        this.elems.fullscreen.off('click.chocolat').on('click.chocolat', () => {
+            if (this.settings.fullscreenOpen) {
+                this.exitFullScreen()
                 return
             }
 
-            that.openFullScreen()
+            this.openFullScreen()
         })
 
-        if (that.settings.backgroundClose) {
-            this.elems.overlay.off('click.chocolat').on('click.chocolat', function() {
-                return that.close()
+        if (this.settings.backgroundClose) {
+            this.elems.overlay.off('click.chocolat').on('click.chocolat', () => {
+                return this.close()
             })
         }
-        this.elems.wrapper.off('click.chocolat').on('click.chocolat', function(e) {
-            return that.zoomOut(e)
+        this.elems.wrapper.off('click.chocolat').on('click.chocolat', (e) => {
+            return this.zoomOut(e)
         })
 
         this.elems.wrapper
             .find('.chocolat-img')
             .off('click.chocolat')
-            .on('click.chocolat', function(e) {
+            .on('click.chocolat', (e) => {
                 if (
-                    that.settings.initialZoomState === null &&
-                    that.elems.domContainer.hasClass('chocolat-zoomable')
+                    this.settings.initialZoomState === null &&
+                    this.elems.domContainer.hasClass('chocolat-zoomable')
                 ) {
                     e.stopPropagation()
-                    return that.zoomIn(e)
+                    return this.zoomIn(e)
                 }
             })
 
-        this.elems.wrapper.mousemove(function(e) {
-            if (that.settings.initialZoomState === null) {
+        this.elems.wrapper.mousemove((e) => {
+            if (this.settings.initialZoomState === null) {
                 return
             }
-            if (that.elems.img.is(':animated')) {
+            if (this.elems.img.is(':animated')) {
                 return
             }
 
@@ -532,7 +514,7 @@ export class Chocolat {
             var height = $(this).height()
             var width = $(this).width()
 
-            var currentImage = that.settings.images[that.settings.currentImage]
+            var currentImage = this.settings.images[this.settings.currentImage]
             var imgWidth = currentImage.width
             var imgHeight = currentImage.height
 
@@ -540,14 +522,14 @@ export class Chocolat {
 
             var mvtX = 0
             if (imgWidth > width) {
-                var paddingX = that.settings.zoomedPaddingX(imgWidth, width)
+                var paddingX = this.settings.zoomedPaddingX(imgWidth, width)
                 mvtX = coord[0] / (width / 2)
                 mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX
             }
 
             var mvtY = 0
             if (imgHeight > height) {
-                var paddingY = that.settings.zoomedPaddingY(imgHeight, height)
+                var paddingY = this.settings.zoomedPaddingY(imgHeight, height)
                 mvtY = coord[1] / (height / 2)
                 mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY
             }
@@ -556,24 +538,25 @@ export class Chocolat {
                 'margin-left': -mvtX + 'px',
                 'margin-top': -mvtY + 'px',
             }
+
             if (typeof e.duration !== 'undefined') {
-                $(that.elems.img)
+                $(this.elems.img)
                     .stop(false, true)
                     .animate(animation, e.duration)
             } else {
-                $(that.elems.img)
+                $(this.elems.img)
                     .stop(false, true)
                     .css(animation)
             }
         })
-        $(window).on('resize', function() {
-            if (!that.settings.initialized || that.settings.currentImage === false) {
+        $(window).on('resize', () => {
+            if (!this.settings.initialized || this.settings.currentImage === false) {
                 return
             }
-            that.debounce(50, function() {
-                var fitting = that.fit(that.settings.currentImage, that.elems.wrapper)
-                that.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
-                that.zoomable()
+            this.debounce(50, () => {
+                var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
+                this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
+                this.zoomable()
             })
         })
     }
@@ -653,52 +636,51 @@ export class Chocolat {
     }
 
     api() {
-        var that = this
         return {
-            open: function(i) {
+            open: (i) => {
                 i = parseInt(i) || 0
-                return that.init(i)
+                return this.init(i)
             },
 
-            close: function() {
-                return that.close()
+            close: () => {
+                return this.close()
             },
 
-            next: function() {
-                return that.change(1)
+            next: () => {
+                return this.change(1)
             },
 
-            prev: function() {
-                return that.change(-1)
+            prev: () => {
+                return this.change(-1)
             },
 
-            goto: function(i) {
+            goto: (i) => {
                 // open alias
-                return that.open(i)
+                return this.open(i)
             },
-            current: function() {
-                return that.settings.currentImage
+            current: () => {
+                return this.settings.currentImage
             },
 
-            place: function() {
-                return that.place(that.settings.currentImage, that.settings.duration)
+            place: () => {
+                return this.place(this.settings.currentImage, this.settings.duration)
             },
 
-            destroy: function() {
-                return that.destroy()
+            destroy: () => {
+                return this.destroy()
             },
 
-            set: function(property, value) {
-                that.settings[property] = value
+            set: (property, value) => {
+                this.settings[property] = value
                 return value
             },
 
-            get: function(property) {
-                return that.settings[property]
+            get: (property) => {
+                return this.settings[property]
             },
 
-            getElem: function(name) {
-                return that.elems[name]
+            getElem: (name) => {
+                return this.elems[name]
             },
         }
     }

From 42b5f9a61d71ad213d61e2ef2d8e042d7e6308ea Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 23 Dec 2018 11:08:06 +0100
Subject: [PATCH 06/65] Removed jquery deferred

---
 dist/js/chocolat.cjs.js  | 52 ++++++++++++++++++----------------
 dist/js/chocolat.esm.js  | 52 ++++++++++++++++++----------------
 dist/js/chocolat.iife.js | 52 ++++++++++++++++++----------------
 src/js/chocolat.js       | 61 ++++++++++++++++++++++++----------------
 test/test.js             | 48 +++++++++++++++----------------
 5 files changed, 145 insertions(+), 120 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index a0ef5ed..61a1f81 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -42,22 +42,22 @@ class Chocolat {
   constructor(element, settings) {
     this.settings = settings;
     this.elems = {};
-    this.element = $(element);
+    this.$element = $(element);
+    this.element = this.$element[0];
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
-    if (!this.settings.setTitle && this.element.data('chocolat-title')) {
-      this.settings.setTitle = this.element.data('chocolat-title');
+    if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
+      this.settings.setTitle = this.element.dataset['chocolat-title'];
     }
 
-    this.element.find(this.settings.imageSelector).each((i, el) => {
+    const imgs = this.element.querySelectorAll(this.settings.imageSelector);
+    imgs.forEach((el, i) => {
       this.settings.images.push({
-        title: $(el).attr('title'),
-        src: $(el).attr(this.settings.imageSource),
+        title: el.getAttribute('title'),
+        src: el.getAttribute(this.settings.imageSource),
         height: false,
         width: false
       });
-    });
-    this.element.find(this.settings.imageSelector).each((i, el) => {
       $(el).off('click.chocolat').on('click.chocolat', e => {
         this.init(i);
         e.preventDefault();
@@ -79,20 +79,21 @@ class Chocolat {
   }
 
   preload(i) {
-    var def = $.Deferred();
+    const src = this.settings.images[i].src;
+    let image = new Image();
 
-    if (typeof this.settings.images[i] === 'undefined') {
-      return;
+    if ('decode' in image) {
+      image.src = src;
+      return new Promise(function (resolve, reject) {
+        image.decode().then(resolve.bind(this, image)).catch(resolve);
+      });
+    } else {
+      return new Promise(function (resolve, reject) {
+        image.onload = resolve.bind(this, image);
+        image.onerror = resolve;
+        image.src = src;
+      });
     }
-
-    var imgLoader = new Image();
-
-    imgLoader.onload = () => {
-      def.resolve(imgLoader);
-    };
-
-    imgLoader.src = this.settings.images[i].src;
-    return def;
   }
 
   load(i) {
@@ -151,9 +152,9 @@ class Chocolat {
 
   appear(i) {
     clearTimeout(this.settings.timer);
-    this.elems.loader.stop().fadeOut(300, () => {
+    return this.elems.loader.stop().fadeOut(300, () => {
       this.elems.img.attr('src', this.settings.images[i].src);
-    });
+    }).promise();
   }
 
   fit(i, container) {
@@ -281,8 +282,11 @@ class Chocolat {
   }
 
   destroy() {
-    this.element.removeData();
-    this.element.find(this.settings.imageSelector).off('click.chocolat');
+    this.$element.removeData();
+    const imgs = this.element.querySelectorAll(this.settings.imageSelector);
+    imgs.forEach(el => {
+      $(el).off('click.chocolat');
+    });
 
     if (!this.settings.initialized) {
       return;
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index bfc8f1a..ac84ab3 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -40,22 +40,22 @@ class Chocolat {
   constructor(element, settings) {
     this.settings = settings;
     this.elems = {};
-    this.element = $(element);
+    this.$element = $(element);
+    this.element = this.$element[0];
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
-    if (!this.settings.setTitle && this.element.data('chocolat-title')) {
-      this.settings.setTitle = this.element.data('chocolat-title');
+    if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
+      this.settings.setTitle = this.element.dataset['chocolat-title'];
     }
 
-    this.element.find(this.settings.imageSelector).each((i, el) => {
+    const imgs = this.element.querySelectorAll(this.settings.imageSelector);
+    imgs.forEach((el, i) => {
       this.settings.images.push({
-        title: $(el).attr('title'),
-        src: $(el).attr(this.settings.imageSource),
+        title: el.getAttribute('title'),
+        src: el.getAttribute(this.settings.imageSource),
         height: false,
         width: false
       });
-    });
-    this.element.find(this.settings.imageSelector).each((i, el) => {
       $(el).off('click.chocolat').on('click.chocolat', e => {
         this.init(i);
         e.preventDefault();
@@ -77,20 +77,21 @@ class Chocolat {
   }
 
   preload(i) {
-    var def = $.Deferred();
+    const src = this.settings.images[i].src;
+    let image = new Image();
 
-    if (typeof this.settings.images[i] === 'undefined') {
-      return;
+    if ('decode' in image) {
+      image.src = src;
+      return new Promise(function (resolve, reject) {
+        image.decode().then(resolve.bind(this, image)).catch(resolve);
+      });
+    } else {
+      return new Promise(function (resolve, reject) {
+        image.onload = resolve.bind(this, image);
+        image.onerror = resolve;
+        image.src = src;
+      });
     }
-
-    var imgLoader = new Image();
-
-    imgLoader.onload = () => {
-      def.resolve(imgLoader);
-    };
-
-    imgLoader.src = this.settings.images[i].src;
-    return def;
   }
 
   load(i) {
@@ -149,9 +150,9 @@ class Chocolat {
 
   appear(i) {
     clearTimeout(this.settings.timer);
-    this.elems.loader.stop().fadeOut(300, () => {
+    return this.elems.loader.stop().fadeOut(300, () => {
       this.elems.img.attr('src', this.settings.images[i].src);
-    });
+    }).promise();
   }
 
   fit(i, container) {
@@ -279,8 +280,11 @@ class Chocolat {
   }
 
   destroy() {
-    this.element.removeData();
-    this.element.find(this.settings.imageSelector).off('click.chocolat');
+    this.$element.removeData();
+    const imgs = this.element.querySelectorAll(this.settings.imageSelector);
+    imgs.forEach(el => {
+      $(el).off('click.chocolat');
+    });
 
     if (!this.settings.initialized) {
       return;
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 965eaa6..1c5ee06 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -43,22 +43,22 @@
       constructor(element, settings) {
         this.settings = settings;
         this.elems = {};
-        this.element = $(element);
+        this.$element = $(element);
+        this.element = this.$element[0];
         this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
-        if (!this.settings.setTitle && this.element.data('chocolat-title')) {
-          this.settings.setTitle = this.element.data('chocolat-title');
+        if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
+          this.settings.setTitle = this.element.dataset['chocolat-title'];
         }
 
-        this.element.find(this.settings.imageSelector).each((i, el) => {
+        const imgs = this.element.querySelectorAll(this.settings.imageSelector);
+        imgs.forEach((el, i) => {
           this.settings.images.push({
-            title: $(el).attr('title'),
-            src: $(el).attr(this.settings.imageSource),
+            title: el.getAttribute('title'),
+            src: el.getAttribute(this.settings.imageSource),
             height: false,
             width: false
           });
-        });
-        this.element.find(this.settings.imageSelector).each((i, el) => {
           $(el).off('click.chocolat').on('click.chocolat', e => {
             this.init(i);
             e.preventDefault();
@@ -80,20 +80,21 @@
       }
 
       preload(i) {
-        var def = $.Deferred();
+        const src = this.settings.images[i].src;
+        let image = new Image();
 
-        if (typeof this.settings.images[i] === 'undefined') {
-          return;
+        if ('decode' in image) {
+          image.src = src;
+          return new Promise(function (resolve, reject) {
+            image.decode().then(resolve.bind(this, image)).catch(resolve);
+          });
+        } else {
+          return new Promise(function (resolve, reject) {
+            image.onload = resolve.bind(this, image);
+            image.onerror = resolve;
+            image.src = src;
+          });
         }
-
-        var imgLoader = new Image();
-
-        imgLoader.onload = () => {
-          def.resolve(imgLoader);
-        };
-
-        imgLoader.src = this.settings.images[i].src;
-        return def;
       }
 
       load(i) {
@@ -152,9 +153,9 @@
 
       appear(i) {
         clearTimeout(this.settings.timer);
-        this.elems.loader.stop().fadeOut(300, () => {
+        return this.elems.loader.stop().fadeOut(300, () => {
           this.elems.img.attr('src', this.settings.images[i].src);
-        });
+        }).promise();
       }
 
       fit(i, container) {
@@ -282,8 +283,11 @@
       }
 
       destroy() {
-        this.element.removeData();
-        this.element.find(this.settings.imageSelector).off('click.chocolat');
+        this.$element.removeData();
+        const imgs = this.element.querySelectorAll(this.settings.imageSelector);
+        imgs.forEach(el => {
+          $(el).off('click.chocolat');
+        });
 
         if (!this.settings.initialized) {
           return;
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 96eefa8..d326a06 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -35,7 +35,8 @@ export class Chocolat {
     constructor(element, settings) {
         this.settings = settings
         this.elems = {}
-        this.element = $(element)
+        this.$element = $(element)
+        this.element = this.$element[0]
 
         this._cssClasses = [
             'chocolat-open',
@@ -45,20 +46,20 @@ export class Chocolat {
             'chocolat-zoomed',
         ]
 
-        if (!this.settings.setTitle && this.element.data('chocolat-title')) {
-            this.settings.setTitle = this.element.data('chocolat-title')
+        if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
+            this.settings.setTitle = this.element.dataset['chocolat-title']
         }
 
-        this.element.find(this.settings.imageSelector).each((i, el) => {
+        const imgs = this.element.querySelectorAll(this.settings.imageSelector)
+
+        imgs.forEach((el, i) => {
             this.settings.images.push({
-                title: $(el).attr('title'),
-                src: $(el).attr(this.settings.imageSource),
+                title: el.getAttribute('title'),
+                src: el.getAttribute(this.settings.imageSource),
                 height: false,
                 width: false,
             })
-        })
 
-        this.element.find(this.settings.imageSelector).each((i, el) => {
             $(el)
                 .off('click.chocolat')
                 .on('click.chocolat', (e) => {
@@ -83,18 +84,23 @@ export class Chocolat {
     }
 
     preload(i) {
-        var def = $.Deferred()
-
-        if (typeof this.settings.images[i] === 'undefined') {
-            return
-        }
-        var imgLoader = new Image()
-        imgLoader.onload = () => {
-            def.resolve(imgLoader)
+        const src = this.settings.images[i].src
+        let image = new Image()
+        if ('decode' in image) {
+            image.src = src
+            return new Promise(function(resolve, reject) {
+                image
+                    .decode()
+                    .then(resolve.bind(this, image))
+                    .catch(resolve)
+            })
+        } else {
+            return new Promise(function(resolve, reject) {
+                image.onload = resolve.bind(this, image)
+                image.onerror = resolve
+                image.src = src
+            })
         }
-        imgLoader.src = this.settings.images[i].src
-
-        return def
     }
 
     load(i) {
@@ -168,9 +174,12 @@ export class Chocolat {
     appear(i) {
         clearTimeout(this.settings.timer)
 
-        this.elems.loader.stop().fadeOut(300, () => {
-            this.elems.img.attr('src', this.settings.images[i].src)
-        })
+        return this.elems.loader
+            .stop()
+            .fadeOut(300, () => {
+                this.elems.img.attr('src', this.settings.images[i].src)
+            })
+            .promise()
     }
 
     fit(i, container) {
@@ -302,8 +311,12 @@ export class Chocolat {
     }
 
     destroy() {
-        this.element.removeData()
-        this.element.find(this.settings.imageSelector).off('click.chocolat')
+        this.$element.removeData()
+
+        const imgs = this.element.querySelectorAll(this.settings.imageSelector)
+        imgs.forEach((el) => {
+            $(el).off('click.chocolat')
+        })
 
         if (!this.settings.initialized) {
             return
diff --git a/test/test.js b/test/test.js
index a8ccc2b..d3b00cd 100644
--- a/test/test.js
+++ b/test/test.js
@@ -49,7 +49,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     expect($('#container').hasClass('chocolat-in-container')).to.be.true
                     expect($('#container').hasClass('chocolat-open')).to.be.true
                     // expect($('#container').hasClass('chocolat-zoomable')).to.be.true
@@ -67,7 +67,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     expect($('body').hasClass('chocolat-open')).to.be.true
                     expect($('body').hasClass('chocolat-' + chocolat.settings.imageSize)).to.be.true
                     // expect($('#container').hasClass('chocolat-zoomable')).to.be.true
@@ -85,7 +85,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     expect($('body').hasClass('custom-class-name')).to.be.true
                     return done()
                 })
@@ -200,7 +200,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var lengthBefore = $('.chocolat-wrapper').length
                     expect(lengthBefore).to.equal(1)
 
@@ -218,7 +218,7 @@ describe('Chocolat', function() {
                 .data('chocolat')
             var imageSelector = chocolat.api().get('imageSelector')
 
-            var links = chocolat.element.find(imageSelector)
+            var links = chocolat.$element.find(imageSelector)
 
             var eventBefore = $._data(links.first()[0], 'events')
             expect(eventBefore.click[0].namespace).to.equal('chocolat')
@@ -256,7 +256,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     chocolat.elems.fullscreen.click()
                     expect(spyOpen.calledOnce).to.be.true
                     expect(chocolat.api().get('fullscreenOpen')).to.be.true
@@ -286,7 +286,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     chocolat.elems.fullscreen.click()
                     chocolat.elems.fullscreen.click()
                     expect(spyClose.calledOnce).to.be.true
@@ -315,7 +315,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     chocolat.elems.fullscreen.click()
                     chocolat.elems.close.click()
                     expect(spyClose.calledOnce).to.be.true
@@ -345,7 +345,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     expect(spyOpen.calledOnce).to.be.true
                     return done()
                 })
@@ -369,7 +369,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     expect(spyLoad.calledWithExactly(0)).to.be.true
 
                     chocolat.elems.right.click()
@@ -391,20 +391,20 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var spyLoad = sinon.spy(chocolat, 'load')
 
                     chocolat
                         .api()
                         .next()
-                        .done(function() {
+                        .then(function() {
                             expect(spyLoad.calledWithExactly(1)).to.be.true
                             var spyChange = sinon.spy(chocolat, 'change')
 
                             chocolat
                                 .api()
                                 .prev()
-                                .done(function() {
+                                .then(function() {
                                     expect(spyLoad.calledWithExactly(0)).to.be.true
 
                                     expect(spyChange.calledOnce).to.be.true
@@ -428,13 +428,13 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var spyLoad = sinon.spy(chocolat, 'load')
 
                     chocolat
                         .api()
                         .prev()
-                        .done(function() {
+                        .then(function() {
                             expect(
                                 spyLoad.calledWithExactly(chocolat.api().get('lastImage'))
                             ).to.be.true
@@ -459,13 +459,13 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open(lastImage)
-                .done(function() {
+                .then(function() {
                     var spyLoad = sinon.spy(chocolat, 'load')
 
                     chocolat
                         .api()
                         .next()
-                        .done(function() {
+                        .then(function() {
                             expect(spyLoad.calledWithExactly(0)).to.be.true
                             expect(chocolat.api().current()).to.equal(0)
 
@@ -489,7 +489,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     expect(chocolat.api().get('imageSize')).to.equal('cover')
                     expect(
                         chocolat
@@ -512,7 +512,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var dim = getExpectedDimensions(chocolat)
 
                     if (dim.imgRatio < dim.containerRatio) {
@@ -541,7 +541,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var dim = getExpectedDimensions(chocolat)
 
                     if (dim.imgRatio < dim.containerRatio) {
@@ -570,7 +570,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var dim = getExpectedDimensions(chocolat)
 
                     var $content = chocolat.api().getElem('content')
@@ -607,7 +607,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var dim = getExpectedDimensions(chocolat)
 
                     if (dim.imgRatio > dim.containerPaddedRatio) {
@@ -636,7 +636,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var dim = getExpectedDimensions(chocolat)
 
                     if (dim.imgRatio > dim.containerPaddedRatio) {
@@ -665,7 +665,7 @@ describe('Chocolat', function() {
             chocolat
                 .api()
                 .open()
-                .done(function() {
+                .then(function() {
                     var dim = getExpectedDimensions(chocolat)
 
                     var $content = chocolat.api().getElem('content')

From c0b5a415b2ffdfd870c98a4a6c2847312fb2a9fd Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 23 Dec 2018 12:00:54 +0100
Subject: [PATCH 07/65] Markup is made of non-jquery-wrapped elements

---
 dist/js/chocolat.cjs.js  | 236 ++++++++++++++++++-----------------
 dist/js/chocolat.esm.js  | 236 ++++++++++++++++++-----------------
 dist/js/chocolat.iife.js | 236 ++++++++++++++++++-----------------
 src/js/chocolat.js       | 261 ++++++++++++++++++++-------------------
 test/test.js             |  17 ++-
 5 files changed, 526 insertions(+), 460 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 61a1f81..f7a6a78 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -105,15 +105,21 @@ class Chocolat {
       return;
     }
 
-    this.elems.overlay.fadeIn(this.settings.duration);
-    this.elems.wrapper.fadeIn(this.settings.duration);
+    $(this.elems.overlay).fadeIn(this.settings.duration);
+    $(this.elems.wrapper).fadeIn(this.settings.duration);
     this.elems.domContainer.addClass('chocolat-open');
     this.settings.timer = setTimeout(() => {
       if (typeof this.elems != 'undefined') {
-        this.elems.loader.fadeIn();
+        $(this.elems.loader).fadeIn();
       }
     }, this.settings.duration);
-    var deferred = this.preload(i).then(imgLoader => {
+    return this.preload(i).then(imgLoader => {
+      const nextIndex = i + 1;
+
+      if (this.settings.images[nextIndex] != undefined) {
+        this.preload(nextIndex);
+      }
+
       return this.place(i, imgLoader);
     }).then(imgLoader => {
       return this.appear(i);
@@ -121,28 +127,25 @@ class Chocolat {
       this.zoomable();
       this.settings.afterImageLoad();
     });
-    var nextIndex = i + 1;
-
-    if (typeof this.settings.images[nextIndex] != 'undefined') {
-      this.preload(nextIndex);
-    }
-
-    return deferred;
   }
 
   place(i, imgLoader) {
-    var fitting;
     this.settings.currentImage = i;
     this.description();
     this.pagination();
     this.arrows();
     this.storeImgSize(imgLoader, i);
-    fitting = this.fit(i, this.elems.wrapper);
-    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+    const {
+      width,
+      height,
+      left,
+      top
+    } = this.fit(i, this.elems.wrapper);
+    return this.center(width, height, left, top, 0);
   }
 
   center(width, height, left, top, duration) {
-    return this.elems.content.css('overflow', 'visible').animate({
+    return $(this.elems.content).css('overflow', 'visible').animate({
       width: width,
       height: height,
       left: left,
@@ -152,25 +155,25 @@ class Chocolat {
 
   appear(i) {
     clearTimeout(this.settings.timer);
-    return this.elems.loader.stop().fadeOut(300, () => {
-      this.elems.img.attr('src', this.settings.images[i].src);
+    return $(this.elems.loader).stop().fadeOut(300, () => {
+      $(this.elems.img).attr('src', this.settings.images[i].src);
     }).promise();
   }
 
   fit(i, container) {
-    var height;
-    var width;
-    var imgHeight = this.settings.images[i].height;
-    var imgWidth = this.settings.images[i].width;
-    var holderHeight = $(container).height();
-    var holderWidth = $(container).width();
-    var holderOutMarginH = this.getOutMarginH();
-    var holderOutMarginW = this.getOutMarginW();
-    var holderGlobalWidth = holderWidth - holderOutMarginW;
-    var holderGlobalHeight = holderHeight - holderOutMarginH;
-    var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
-    var holderRatio = holderHeight / holderWidth;
-    var imgRatio = imgHeight / imgWidth;
+    let height;
+    let width;
+    const imgHeight = this.settings.images[i].height;
+    const imgWidth = this.settings.images[i].width;
+    const holderHeight = container.clientHeight;
+    const holderWidth = container.clientWidth;
+    const holderOutMarginH = this.getOutMarginH();
+    const holderOutMarginW = this.getOutMarginW();
+    const holderGlobalWidth = holderWidth - holderOutMarginW;
+    const holderGlobalHeight = holderHeight - holderOutMarginH;
+    const holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
+    const holderRatio = holderHeight / holderWidth;
+    const imgRatio = imgHeight / imgWidth;
 
     if (this.settings.imageSize == 'cover') {
       if (imgRatio < holderRatio) {
@@ -226,34 +229,34 @@ class Chocolat {
 
   arrows() {
     if (this.settings.loop) {
-      $([this.elems.left[0], this.elems.right[0]]).addClass('active');
+      $([this.elems.left, this.elems.right]).addClass('active');
     } else if (this.settings.linkImages) {
       // right
       if (this.settings.currentImage == this.settings.lastImage) {
-        this.elems.right.removeClass('active');
+        $(this.elems.right).removeClass('active');
       } else {
-        this.elems.right.addClass('active');
+        $(this.elems.right).addClass('active');
       } // left
 
 
       if (this.settings.currentImage === 0) {
-        this.elems.left.removeClass('active');
+        $(this.elems.left).removeClass('active');
       } else {
-        this.elems.left.addClass('active');
+        $(this.elems.left).addClass('active');
       }
     } else {
-      $([this.elems.left[0], this.elems.right[0]]).removeClass('active');
+      $([this.elems.left, this.elems.right]).removeClass('active');
     }
   }
 
   description() {
-    this.elems.description.html(this.settings.images[this.settings.currentImage].title);
+    $(this.elems.description).html(this.settings.images[this.settings.currentImage].title);
   }
 
   pagination() {
     var last = this.settings.lastImage + 1;
     var position = this.settings.currentImage + 1;
-    this.elems.pagination.html(position + ' ' + this.settings.separator2 + last);
+    $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
   }
 
   storeImgSize(img, i) {
@@ -273,7 +276,7 @@ class Chocolat {
       return;
     }
 
-    var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
+    var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
     var def = $.when($(els).fadeOut(200)).done(() => {
       this.elems.domContainer.removeClass('chocolat-open');
     });
@@ -299,17 +302,17 @@ class Chocolat {
     this.settings.currentImage = false;
     this.settings.initialized = false;
     this.elems.domContainer.removeClass(this._cssClasses.join(' '));
-    this.elems.wrapper.remove();
+    $(this.elems.wrapper).remove();
   }
 
   getOutMarginW() {
-    var left = this.elems.left.outerWidth(true);
-    var right = this.elems.right.outerWidth(true);
+    var left = $(this.elems.left).outerWidth(true);
+    var right = $(this.elems.right).outerWidth(true);
     return left + right;
   }
 
   getOutMarginH() {
-    return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true);
+    return $(this.elems.top).outerHeight(true) + $(this.elems.bottom).outerHeight(true);
   }
 
   markup() {
@@ -323,56 +326,54 @@ class Chocolat {
       this.elems.domContainer.addClass('chocolat-in-container');
     }
 
-    this.elems.wrapper = $('<div/>', {
-      class: 'chocolat-wrapper',
-      id: 'chocolat-content-' + this.settings.setIndex
-    }).appendTo(this.elems.domContainer);
-    this.elems.overlay = $('<div/>', {
-      class: 'chocolat-overlay'
-    }).appendTo(this.elems.wrapper);
-    this.elems.loader = $('<div/>', {
-      class: 'chocolat-loader'
-    }).appendTo(this.elems.wrapper);
-    this.elems.content = $('<div/>', {
-      class: 'chocolat-content'
-    }).appendTo(this.elems.wrapper);
-    this.elems.img = $('<img/>', {
-      class: 'chocolat-img',
-      src: ''
-    }).appendTo(this.elems.content);
-    this.elems.top = $('<div/>', {
-      class: 'chocolat-top'
-    }).appendTo(this.elems.wrapper);
-    this.elems.left = $('<div/>', {
-      class: 'chocolat-left'
-    }).appendTo(this.elems.wrapper);
-    this.elems.right = $('<div/>', {
-      class: 'chocolat-right'
-    }).appendTo(this.elems.wrapper);
-    this.elems.bottom = $('<div/>', {
-      class: 'chocolat-bottom'
-    }).appendTo(this.elems.wrapper);
-    this.elems.close = $('<span/>', {
-      class: 'chocolat-close'
-    }).appendTo(this.elems.top);
-    this.elems.fullscreen = $('<span/>', {
-      class: 'chocolat-fullscreen'
-    }).appendTo(this.elems.bottom);
-    this.elems.description = $('<span/>', {
-      class: 'chocolat-description'
-    }).appendTo(this.elems.bottom);
-    this.elems.pagination = $('<span/>', {
-      class: 'chocolat-pagination'
-    }).appendTo(this.elems.bottom);
-    this.elems.setTitle = $('<span/>', {
-      class: 'chocolat-set-title',
-      html: this.settings.setTitle
-    }).appendTo(this.elems.bottom);
+    this.elems.wrapper = document.createElement('div');
+    this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
+    this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
+    this.elems.domContainer[0].appendChild(this.elems.wrapper);
+    this.elems.overlay = document.createElement('div');
+    this.elems.overlay.setAttribute('class', 'chocolat-overlay');
+    this.elems.wrapper.appendChild(this.elems.overlay);
+    this.elems.loader = document.createElement('div');
+    this.elems.loader.setAttribute('class', 'chocolat-loader');
+    this.elems.wrapper.appendChild(this.elems.loader);
+    this.elems.content = document.createElement('div');
+    this.elems.content.setAttribute('class', 'chocolat-content');
+    this.elems.wrapper.appendChild(this.elems.content);
+    this.elems.img = document.createElement('img');
+    this.elems.img.setAttribute('class', 'chocolat-img');
+    this.elems.content.appendChild(this.elems.img);
+    this.elems.top = document.createElement('div');
+    this.elems.top.setAttribute('class', 'chocolat-top');
+    this.elems.wrapper.appendChild(this.elems.top);
+    this.elems.left = document.createElement('div');
+    this.elems.left.setAttribute('class', 'chocolat-left');
+    this.elems.wrapper.appendChild(this.elems.left);
+    this.elems.right = document.createElement('div');
+    this.elems.right.setAttribute('class', 'chocolat-right');
+    this.elems.wrapper.appendChild(this.elems.right);
+    this.elems.bottom = document.createElement('div');
+    this.elems.bottom.setAttribute('class', 'chocolat-bottom');
+    this.elems.wrapper.appendChild(this.elems.bottom);
+    this.elems.close = document.createElement('span');
+    this.elems.close.setAttribute('class', 'chocolat-close');
+    this.elems.top.appendChild(this.elems.close);
+    this.elems.fullscreen = document.createElement('span');
+    this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
+    this.elems.bottom.appendChild(this.elems.fullscreen);
+    this.elems.description = document.createElement('span');
+    this.elems.description.setAttribute('class', 'chocolat-description');
+    this.elems.bottom.appendChild(this.elems.description);
+    this.elems.pagination = document.createElement('span');
+    this.elems.pagination.setAttribute('class', 'chocolat-pagination');
+    this.elems.bottom.appendChild(this.elems.pagination);
+    this.elems.setTitle = document.createElement('span');
+    this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
+    this.elems.bottom.appendChild(this.elems.setTitle);
     this.settings.afterMarkup.call(this);
   }
 
   openFullScreen() {
-    var wrapper = this.elems.wrapper[0];
+    var wrapper = this.elems.wrapper;
 
     if (wrapper.requestFullscreen) {
       this.settings.fullscreenOpen = true;
@@ -421,16 +422,16 @@ class Chocolat {
         }
       }
     });
-    this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+    $(this.elems.wrapper).find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
       this.change(+1);
     });
-    this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
+    $(this.elems.wrapper).find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
       return this.change(-1);
     });
-    $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', () => {
+    $([this.elems.overlay, this.elems.close]).off('click.chocolat').on('click.chocolat', () => {
       return this.close();
     });
-    this.elems.fullscreen.off('click.chocolat').on('click.chocolat', () => {
+    $(this.elems.fullscreen).off('click.chocolat').on('click.chocolat', () => {
       if (this.settings.fullscreenOpen) {
         this.exitFullScreen();
         return;
@@ -440,26 +441,26 @@ class Chocolat {
     });
 
     if (this.settings.backgroundClose) {
-      this.elems.overlay.off('click.chocolat').on('click.chocolat', () => {
+      $(this.elems.overlay).off('click.chocolat').on('click.chocolat', () => {
         return this.close();
       });
     }
 
-    this.elems.wrapper.off('click.chocolat').on('click.chocolat', e => {
+    $(this.elems.wrapper).off('click.chocolat').on('click.chocolat', e => {
       return this.zoomOut(e);
     });
-    this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+    $(this.elems.wrapper).find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
       if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
         e.stopPropagation();
         return this.zoomIn(e);
       }
     });
-    this.elems.wrapper.mousemove(e => {
+    $(this.elems.wrapper).mousemove(e => {
       if (this.settings.initialZoomState === null) {
         return;
       }
 
-      if (this.elems.img.is(':animated')) {
+      if ($(this.elems.img).is(':animated')) {
         return;
       }
 
@@ -503,8 +504,13 @@ class Chocolat {
       }
 
       this.debounce(50, () => {
-        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-        this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+        const {
+          width,
+          height,
+          left,
+          top
+        } = this.fit(this.settings.currentImage, this.elems.wrapper);
+        this.center(width, height, left, top, 0);
         this.zoomable();
       });
     });
@@ -512,10 +518,10 @@ class Chocolat {
 
   zoomable() {
     var currentImage = this.settings.images[this.settings.currentImage];
-    var wrapperWidth = this.elems.wrapper.width();
-    var wrapperHeight = this.elems.wrapper.height();
+    var wrapperWidth = this.elems.wrapper.clientWidth;
+    var wrapperHeight = this.elems.wrapper.clientHeight;
     var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
-    var isImageStretched = this.elems.img.width() > currentImage.width || this.elems.img.height() > currentImage.height;
+    var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
     if (isImageZoomable && !isImageStretched) {
       this.elems.domContainer.addClass('chocolat-zoomable');
@@ -531,10 +537,15 @@ class Chocolat {
     event.pageX = e.pageX;
     event.pageY = e.pageY;
     event.duration = this.settings.duration;
-    this.elems.wrapper.trigger(event);
+    $(this.elems.wrapper).trigger(event);
     this.elems.domContainer.addClass('chocolat-zoomed');
-    var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, this.settings.duration);
+    const {
+      width,
+      height,
+      left,
+      top
+    } = this.fit(this.settings.currentImage, this.elems.wrapper);
+    return this.center(width, height, left, top, this.settings.duration);
   }
 
   zoomOut(e, duration) {
@@ -545,12 +556,17 @@ class Chocolat {
     duration = duration || this.settings.duration;
     this.settings.imageSize = this.settings.initialZoomState;
     this.settings.initialZoomState = null;
-    this.elems.img.animate({
+    $(this.elems.img).animate({
       margin: 0
     }, duration);
     this.elems.domContainer.removeClass('chocolat-zoomed');
-    var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration);
+    const {
+      width,
+      height,
+      left,
+      top
+    } = this.fit(this.settings.currentImage, this.elems.wrapper);
+    return this.center(width, height, left, top, duration);
   }
 
   setDomContainer() {
@@ -606,7 +622,7 @@ class Chocolat {
         return this.settings[property];
       },
       getElem: name => {
-        return this.elems[name];
+        return $(this.elems[name]);
       }
     };
   }
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index ac84ab3..7f7133a 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -103,15 +103,21 @@ class Chocolat {
       return;
     }
 
-    this.elems.overlay.fadeIn(this.settings.duration);
-    this.elems.wrapper.fadeIn(this.settings.duration);
+    $(this.elems.overlay).fadeIn(this.settings.duration);
+    $(this.elems.wrapper).fadeIn(this.settings.duration);
     this.elems.domContainer.addClass('chocolat-open');
     this.settings.timer = setTimeout(() => {
       if (typeof this.elems != 'undefined') {
-        this.elems.loader.fadeIn();
+        $(this.elems.loader).fadeIn();
       }
     }, this.settings.duration);
-    var deferred = this.preload(i).then(imgLoader => {
+    return this.preload(i).then(imgLoader => {
+      const nextIndex = i + 1;
+
+      if (this.settings.images[nextIndex] != undefined) {
+        this.preload(nextIndex);
+      }
+
       return this.place(i, imgLoader);
     }).then(imgLoader => {
       return this.appear(i);
@@ -119,28 +125,25 @@ class Chocolat {
       this.zoomable();
       this.settings.afterImageLoad();
     });
-    var nextIndex = i + 1;
-
-    if (typeof this.settings.images[nextIndex] != 'undefined') {
-      this.preload(nextIndex);
-    }
-
-    return deferred;
   }
 
   place(i, imgLoader) {
-    var fitting;
     this.settings.currentImage = i;
     this.description();
     this.pagination();
     this.arrows();
     this.storeImgSize(imgLoader, i);
-    fitting = this.fit(i, this.elems.wrapper);
-    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+    const {
+      width,
+      height,
+      left,
+      top
+    } = this.fit(i, this.elems.wrapper);
+    return this.center(width, height, left, top, 0);
   }
 
   center(width, height, left, top, duration) {
-    return this.elems.content.css('overflow', 'visible').animate({
+    return $(this.elems.content).css('overflow', 'visible').animate({
       width: width,
       height: height,
       left: left,
@@ -150,25 +153,25 @@ class Chocolat {
 
   appear(i) {
     clearTimeout(this.settings.timer);
-    return this.elems.loader.stop().fadeOut(300, () => {
-      this.elems.img.attr('src', this.settings.images[i].src);
+    return $(this.elems.loader).stop().fadeOut(300, () => {
+      $(this.elems.img).attr('src', this.settings.images[i].src);
     }).promise();
   }
 
   fit(i, container) {
-    var height;
-    var width;
-    var imgHeight = this.settings.images[i].height;
-    var imgWidth = this.settings.images[i].width;
-    var holderHeight = $(container).height();
-    var holderWidth = $(container).width();
-    var holderOutMarginH = this.getOutMarginH();
-    var holderOutMarginW = this.getOutMarginW();
-    var holderGlobalWidth = holderWidth - holderOutMarginW;
-    var holderGlobalHeight = holderHeight - holderOutMarginH;
-    var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
-    var holderRatio = holderHeight / holderWidth;
-    var imgRatio = imgHeight / imgWidth;
+    let height;
+    let width;
+    const imgHeight = this.settings.images[i].height;
+    const imgWidth = this.settings.images[i].width;
+    const holderHeight = container.clientHeight;
+    const holderWidth = container.clientWidth;
+    const holderOutMarginH = this.getOutMarginH();
+    const holderOutMarginW = this.getOutMarginW();
+    const holderGlobalWidth = holderWidth - holderOutMarginW;
+    const holderGlobalHeight = holderHeight - holderOutMarginH;
+    const holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
+    const holderRatio = holderHeight / holderWidth;
+    const imgRatio = imgHeight / imgWidth;
 
     if (this.settings.imageSize == 'cover') {
       if (imgRatio < holderRatio) {
@@ -224,34 +227,34 @@ class Chocolat {
 
   arrows() {
     if (this.settings.loop) {
-      $([this.elems.left[0], this.elems.right[0]]).addClass('active');
+      $([this.elems.left, this.elems.right]).addClass('active');
     } else if (this.settings.linkImages) {
       // right
       if (this.settings.currentImage == this.settings.lastImage) {
-        this.elems.right.removeClass('active');
+        $(this.elems.right).removeClass('active');
       } else {
-        this.elems.right.addClass('active');
+        $(this.elems.right).addClass('active');
       } // left
 
 
       if (this.settings.currentImage === 0) {
-        this.elems.left.removeClass('active');
+        $(this.elems.left).removeClass('active');
       } else {
-        this.elems.left.addClass('active');
+        $(this.elems.left).addClass('active');
       }
     } else {
-      $([this.elems.left[0], this.elems.right[0]]).removeClass('active');
+      $([this.elems.left, this.elems.right]).removeClass('active');
     }
   }
 
   description() {
-    this.elems.description.html(this.settings.images[this.settings.currentImage].title);
+    $(this.elems.description).html(this.settings.images[this.settings.currentImage].title);
   }
 
   pagination() {
     var last = this.settings.lastImage + 1;
     var position = this.settings.currentImage + 1;
-    this.elems.pagination.html(position + ' ' + this.settings.separator2 + last);
+    $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
   }
 
   storeImgSize(img, i) {
@@ -271,7 +274,7 @@ class Chocolat {
       return;
     }
 
-    var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
+    var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
     var def = $.when($(els).fadeOut(200)).done(() => {
       this.elems.domContainer.removeClass('chocolat-open');
     });
@@ -297,17 +300,17 @@ class Chocolat {
     this.settings.currentImage = false;
     this.settings.initialized = false;
     this.elems.domContainer.removeClass(this._cssClasses.join(' '));
-    this.elems.wrapper.remove();
+    $(this.elems.wrapper).remove();
   }
 
   getOutMarginW() {
-    var left = this.elems.left.outerWidth(true);
-    var right = this.elems.right.outerWidth(true);
+    var left = $(this.elems.left).outerWidth(true);
+    var right = $(this.elems.right).outerWidth(true);
     return left + right;
   }
 
   getOutMarginH() {
-    return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true);
+    return $(this.elems.top).outerHeight(true) + $(this.elems.bottom).outerHeight(true);
   }
 
   markup() {
@@ -321,56 +324,54 @@ class Chocolat {
       this.elems.domContainer.addClass('chocolat-in-container');
     }
 
-    this.elems.wrapper = $('<div/>', {
-      class: 'chocolat-wrapper',
-      id: 'chocolat-content-' + this.settings.setIndex
-    }).appendTo(this.elems.domContainer);
-    this.elems.overlay = $('<div/>', {
-      class: 'chocolat-overlay'
-    }).appendTo(this.elems.wrapper);
-    this.elems.loader = $('<div/>', {
-      class: 'chocolat-loader'
-    }).appendTo(this.elems.wrapper);
-    this.elems.content = $('<div/>', {
-      class: 'chocolat-content'
-    }).appendTo(this.elems.wrapper);
-    this.elems.img = $('<img/>', {
-      class: 'chocolat-img',
-      src: ''
-    }).appendTo(this.elems.content);
-    this.elems.top = $('<div/>', {
-      class: 'chocolat-top'
-    }).appendTo(this.elems.wrapper);
-    this.elems.left = $('<div/>', {
-      class: 'chocolat-left'
-    }).appendTo(this.elems.wrapper);
-    this.elems.right = $('<div/>', {
-      class: 'chocolat-right'
-    }).appendTo(this.elems.wrapper);
-    this.elems.bottom = $('<div/>', {
-      class: 'chocolat-bottom'
-    }).appendTo(this.elems.wrapper);
-    this.elems.close = $('<span/>', {
-      class: 'chocolat-close'
-    }).appendTo(this.elems.top);
-    this.elems.fullscreen = $('<span/>', {
-      class: 'chocolat-fullscreen'
-    }).appendTo(this.elems.bottom);
-    this.elems.description = $('<span/>', {
-      class: 'chocolat-description'
-    }).appendTo(this.elems.bottom);
-    this.elems.pagination = $('<span/>', {
-      class: 'chocolat-pagination'
-    }).appendTo(this.elems.bottom);
-    this.elems.setTitle = $('<span/>', {
-      class: 'chocolat-set-title',
-      html: this.settings.setTitle
-    }).appendTo(this.elems.bottom);
+    this.elems.wrapper = document.createElement('div');
+    this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
+    this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
+    this.elems.domContainer[0].appendChild(this.elems.wrapper);
+    this.elems.overlay = document.createElement('div');
+    this.elems.overlay.setAttribute('class', 'chocolat-overlay');
+    this.elems.wrapper.appendChild(this.elems.overlay);
+    this.elems.loader = document.createElement('div');
+    this.elems.loader.setAttribute('class', 'chocolat-loader');
+    this.elems.wrapper.appendChild(this.elems.loader);
+    this.elems.content = document.createElement('div');
+    this.elems.content.setAttribute('class', 'chocolat-content');
+    this.elems.wrapper.appendChild(this.elems.content);
+    this.elems.img = document.createElement('img');
+    this.elems.img.setAttribute('class', 'chocolat-img');
+    this.elems.content.appendChild(this.elems.img);
+    this.elems.top = document.createElement('div');
+    this.elems.top.setAttribute('class', 'chocolat-top');
+    this.elems.wrapper.appendChild(this.elems.top);
+    this.elems.left = document.createElement('div');
+    this.elems.left.setAttribute('class', 'chocolat-left');
+    this.elems.wrapper.appendChild(this.elems.left);
+    this.elems.right = document.createElement('div');
+    this.elems.right.setAttribute('class', 'chocolat-right');
+    this.elems.wrapper.appendChild(this.elems.right);
+    this.elems.bottom = document.createElement('div');
+    this.elems.bottom.setAttribute('class', 'chocolat-bottom');
+    this.elems.wrapper.appendChild(this.elems.bottom);
+    this.elems.close = document.createElement('span');
+    this.elems.close.setAttribute('class', 'chocolat-close');
+    this.elems.top.appendChild(this.elems.close);
+    this.elems.fullscreen = document.createElement('span');
+    this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
+    this.elems.bottom.appendChild(this.elems.fullscreen);
+    this.elems.description = document.createElement('span');
+    this.elems.description.setAttribute('class', 'chocolat-description');
+    this.elems.bottom.appendChild(this.elems.description);
+    this.elems.pagination = document.createElement('span');
+    this.elems.pagination.setAttribute('class', 'chocolat-pagination');
+    this.elems.bottom.appendChild(this.elems.pagination);
+    this.elems.setTitle = document.createElement('span');
+    this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
+    this.elems.bottom.appendChild(this.elems.setTitle);
     this.settings.afterMarkup.call(this);
   }
 
   openFullScreen() {
-    var wrapper = this.elems.wrapper[0];
+    var wrapper = this.elems.wrapper;
 
     if (wrapper.requestFullscreen) {
       this.settings.fullscreenOpen = true;
@@ -419,16 +420,16 @@ class Chocolat {
         }
       }
     });
-    this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+    $(this.elems.wrapper).find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
       this.change(+1);
     });
-    this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
+    $(this.elems.wrapper).find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
       return this.change(-1);
     });
-    $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', () => {
+    $([this.elems.overlay, this.elems.close]).off('click.chocolat').on('click.chocolat', () => {
       return this.close();
     });
-    this.elems.fullscreen.off('click.chocolat').on('click.chocolat', () => {
+    $(this.elems.fullscreen).off('click.chocolat').on('click.chocolat', () => {
       if (this.settings.fullscreenOpen) {
         this.exitFullScreen();
         return;
@@ -438,26 +439,26 @@ class Chocolat {
     });
 
     if (this.settings.backgroundClose) {
-      this.elems.overlay.off('click.chocolat').on('click.chocolat', () => {
+      $(this.elems.overlay).off('click.chocolat').on('click.chocolat', () => {
         return this.close();
       });
     }
 
-    this.elems.wrapper.off('click.chocolat').on('click.chocolat', e => {
+    $(this.elems.wrapper).off('click.chocolat').on('click.chocolat', e => {
       return this.zoomOut(e);
     });
-    this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+    $(this.elems.wrapper).find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
       if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
         e.stopPropagation();
         return this.zoomIn(e);
       }
     });
-    this.elems.wrapper.mousemove(e => {
+    $(this.elems.wrapper).mousemove(e => {
       if (this.settings.initialZoomState === null) {
         return;
       }
 
-      if (this.elems.img.is(':animated')) {
+      if ($(this.elems.img).is(':animated')) {
         return;
       }
 
@@ -501,8 +502,13 @@ class Chocolat {
       }
 
       this.debounce(50, () => {
-        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-        this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+        const {
+          width,
+          height,
+          left,
+          top
+        } = this.fit(this.settings.currentImage, this.elems.wrapper);
+        this.center(width, height, left, top, 0);
         this.zoomable();
       });
     });
@@ -510,10 +516,10 @@ class Chocolat {
 
   zoomable() {
     var currentImage = this.settings.images[this.settings.currentImage];
-    var wrapperWidth = this.elems.wrapper.width();
-    var wrapperHeight = this.elems.wrapper.height();
+    var wrapperWidth = this.elems.wrapper.clientWidth;
+    var wrapperHeight = this.elems.wrapper.clientHeight;
     var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
-    var isImageStretched = this.elems.img.width() > currentImage.width || this.elems.img.height() > currentImage.height;
+    var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
     if (isImageZoomable && !isImageStretched) {
       this.elems.domContainer.addClass('chocolat-zoomable');
@@ -529,10 +535,15 @@ class Chocolat {
     event.pageX = e.pageX;
     event.pageY = e.pageY;
     event.duration = this.settings.duration;
-    this.elems.wrapper.trigger(event);
+    $(this.elems.wrapper).trigger(event);
     this.elems.domContainer.addClass('chocolat-zoomed');
-    var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, this.settings.duration);
+    const {
+      width,
+      height,
+      left,
+      top
+    } = this.fit(this.settings.currentImage, this.elems.wrapper);
+    return this.center(width, height, left, top, this.settings.duration);
   }
 
   zoomOut(e, duration) {
@@ -543,12 +554,17 @@ class Chocolat {
     duration = duration || this.settings.duration;
     this.settings.imageSize = this.settings.initialZoomState;
     this.settings.initialZoomState = null;
-    this.elems.img.animate({
+    $(this.elems.img).animate({
       margin: 0
     }, duration);
     this.elems.domContainer.removeClass('chocolat-zoomed');
-    var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-    return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration);
+    const {
+      width,
+      height,
+      left,
+      top
+    } = this.fit(this.settings.currentImage, this.elems.wrapper);
+    return this.center(width, height, left, top, duration);
   }
 
   setDomContainer() {
@@ -604,7 +620,7 @@ class Chocolat {
         return this.settings[property];
       },
       getElem: name => {
-        return this.elems[name];
+        return $(this.elems[name]);
       }
     };
   }
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 1c5ee06..fbed1db 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -106,15 +106,21 @@
           return;
         }
 
-        this.elems.overlay.fadeIn(this.settings.duration);
-        this.elems.wrapper.fadeIn(this.settings.duration);
+        $(this.elems.overlay).fadeIn(this.settings.duration);
+        $(this.elems.wrapper).fadeIn(this.settings.duration);
         this.elems.domContainer.addClass('chocolat-open');
         this.settings.timer = setTimeout(() => {
           if (typeof this.elems != 'undefined') {
-            this.elems.loader.fadeIn();
+            $(this.elems.loader).fadeIn();
           }
         }, this.settings.duration);
-        var deferred = this.preload(i).then(imgLoader => {
+        return this.preload(i).then(imgLoader => {
+          const nextIndex = i + 1;
+
+          if (this.settings.images[nextIndex] != undefined) {
+            this.preload(nextIndex);
+          }
+
           return this.place(i, imgLoader);
         }).then(imgLoader => {
           return this.appear(i);
@@ -122,28 +128,25 @@
           this.zoomable();
           this.settings.afterImageLoad();
         });
-        var nextIndex = i + 1;
-
-        if (typeof this.settings.images[nextIndex] != 'undefined') {
-          this.preload(nextIndex);
-        }
-
-        return deferred;
       }
 
       place(i, imgLoader) {
-        var fitting;
         this.settings.currentImage = i;
         this.description();
         this.pagination();
         this.arrows();
         this.storeImgSize(imgLoader, i);
-        fitting = this.fit(i, this.elems.wrapper);
-        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+        const {
+          width,
+          height,
+          left,
+          top
+        } = this.fit(i, this.elems.wrapper);
+        return this.center(width, height, left, top, 0);
       }
 
       center(width, height, left, top, duration) {
-        return this.elems.content.css('overflow', 'visible').animate({
+        return $(this.elems.content).css('overflow', 'visible').animate({
           width: width,
           height: height,
           left: left,
@@ -153,25 +156,25 @@
 
       appear(i) {
         clearTimeout(this.settings.timer);
-        return this.elems.loader.stop().fadeOut(300, () => {
-          this.elems.img.attr('src', this.settings.images[i].src);
+        return $(this.elems.loader).stop().fadeOut(300, () => {
+          $(this.elems.img).attr('src', this.settings.images[i].src);
         }).promise();
       }
 
       fit(i, container) {
-        var height;
-        var width;
-        var imgHeight = this.settings.images[i].height;
-        var imgWidth = this.settings.images[i].width;
-        var holderHeight = $(container).height();
-        var holderWidth = $(container).width();
-        var holderOutMarginH = this.getOutMarginH();
-        var holderOutMarginW = this.getOutMarginW();
-        var holderGlobalWidth = holderWidth - holderOutMarginW;
-        var holderGlobalHeight = holderHeight - holderOutMarginH;
-        var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
-        var holderRatio = holderHeight / holderWidth;
-        var imgRatio = imgHeight / imgWidth;
+        let height;
+        let width;
+        const imgHeight = this.settings.images[i].height;
+        const imgWidth = this.settings.images[i].width;
+        const holderHeight = container.clientHeight;
+        const holderWidth = container.clientWidth;
+        const holderOutMarginH = this.getOutMarginH();
+        const holderOutMarginW = this.getOutMarginW();
+        const holderGlobalWidth = holderWidth - holderOutMarginW;
+        const holderGlobalHeight = holderHeight - holderOutMarginH;
+        const holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
+        const holderRatio = holderHeight / holderWidth;
+        const imgRatio = imgHeight / imgWidth;
 
         if (this.settings.imageSize == 'cover') {
           if (imgRatio < holderRatio) {
@@ -227,34 +230,34 @@
 
       arrows() {
         if (this.settings.loop) {
-          $([this.elems.left[0], this.elems.right[0]]).addClass('active');
+          $([this.elems.left, this.elems.right]).addClass('active');
         } else if (this.settings.linkImages) {
           // right
           if (this.settings.currentImage == this.settings.lastImage) {
-            this.elems.right.removeClass('active');
+            $(this.elems.right).removeClass('active');
           } else {
-            this.elems.right.addClass('active');
+            $(this.elems.right).addClass('active');
           } // left
 
 
           if (this.settings.currentImage === 0) {
-            this.elems.left.removeClass('active');
+            $(this.elems.left).removeClass('active');
           } else {
-            this.elems.left.addClass('active');
+            $(this.elems.left).addClass('active');
           }
         } else {
-          $([this.elems.left[0], this.elems.right[0]]).removeClass('active');
+          $([this.elems.left, this.elems.right]).removeClass('active');
         }
       }
 
       description() {
-        this.elems.description.html(this.settings.images[this.settings.currentImage].title);
+        $(this.elems.description).html(this.settings.images[this.settings.currentImage].title);
       }
 
       pagination() {
         var last = this.settings.lastImage + 1;
         var position = this.settings.currentImage + 1;
-        this.elems.pagination.html(position + ' ' + this.settings.separator2 + last);
+        $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
       }
 
       storeImgSize(img, i) {
@@ -274,7 +277,7 @@
           return;
         }
 
-        var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]];
+        var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
         var def = $.when($(els).fadeOut(200)).done(() => {
           this.elems.domContainer.removeClass('chocolat-open');
         });
@@ -300,17 +303,17 @@
         this.settings.currentImage = false;
         this.settings.initialized = false;
         this.elems.domContainer.removeClass(this._cssClasses.join(' '));
-        this.elems.wrapper.remove();
+        $(this.elems.wrapper).remove();
       }
 
       getOutMarginW() {
-        var left = this.elems.left.outerWidth(true);
-        var right = this.elems.right.outerWidth(true);
+        var left = $(this.elems.left).outerWidth(true);
+        var right = $(this.elems.right).outerWidth(true);
         return left + right;
       }
 
       getOutMarginH() {
-        return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true);
+        return $(this.elems.top).outerHeight(true) + $(this.elems.bottom).outerHeight(true);
       }
 
       markup() {
@@ -324,56 +327,54 @@
           this.elems.domContainer.addClass('chocolat-in-container');
         }
 
-        this.elems.wrapper = $('<div/>', {
-          class: 'chocolat-wrapper',
-          id: 'chocolat-content-' + this.settings.setIndex
-        }).appendTo(this.elems.domContainer);
-        this.elems.overlay = $('<div/>', {
-          class: 'chocolat-overlay'
-        }).appendTo(this.elems.wrapper);
-        this.elems.loader = $('<div/>', {
-          class: 'chocolat-loader'
-        }).appendTo(this.elems.wrapper);
-        this.elems.content = $('<div/>', {
-          class: 'chocolat-content'
-        }).appendTo(this.elems.wrapper);
-        this.elems.img = $('<img/>', {
-          class: 'chocolat-img',
-          src: ''
-        }).appendTo(this.elems.content);
-        this.elems.top = $('<div/>', {
-          class: 'chocolat-top'
-        }).appendTo(this.elems.wrapper);
-        this.elems.left = $('<div/>', {
-          class: 'chocolat-left'
-        }).appendTo(this.elems.wrapper);
-        this.elems.right = $('<div/>', {
-          class: 'chocolat-right'
-        }).appendTo(this.elems.wrapper);
-        this.elems.bottom = $('<div/>', {
-          class: 'chocolat-bottom'
-        }).appendTo(this.elems.wrapper);
-        this.elems.close = $('<span/>', {
-          class: 'chocolat-close'
-        }).appendTo(this.elems.top);
-        this.elems.fullscreen = $('<span/>', {
-          class: 'chocolat-fullscreen'
-        }).appendTo(this.elems.bottom);
-        this.elems.description = $('<span/>', {
-          class: 'chocolat-description'
-        }).appendTo(this.elems.bottom);
-        this.elems.pagination = $('<span/>', {
-          class: 'chocolat-pagination'
-        }).appendTo(this.elems.bottom);
-        this.elems.setTitle = $('<span/>', {
-          class: 'chocolat-set-title',
-          html: this.settings.setTitle
-        }).appendTo(this.elems.bottom);
+        this.elems.wrapper = document.createElement('div');
+        this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
+        this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
+        this.elems.domContainer[0].appendChild(this.elems.wrapper);
+        this.elems.overlay = document.createElement('div');
+        this.elems.overlay.setAttribute('class', 'chocolat-overlay');
+        this.elems.wrapper.appendChild(this.elems.overlay);
+        this.elems.loader = document.createElement('div');
+        this.elems.loader.setAttribute('class', 'chocolat-loader');
+        this.elems.wrapper.appendChild(this.elems.loader);
+        this.elems.content = document.createElement('div');
+        this.elems.content.setAttribute('class', 'chocolat-content');
+        this.elems.wrapper.appendChild(this.elems.content);
+        this.elems.img = document.createElement('img');
+        this.elems.img.setAttribute('class', 'chocolat-img');
+        this.elems.content.appendChild(this.elems.img);
+        this.elems.top = document.createElement('div');
+        this.elems.top.setAttribute('class', 'chocolat-top');
+        this.elems.wrapper.appendChild(this.elems.top);
+        this.elems.left = document.createElement('div');
+        this.elems.left.setAttribute('class', 'chocolat-left');
+        this.elems.wrapper.appendChild(this.elems.left);
+        this.elems.right = document.createElement('div');
+        this.elems.right.setAttribute('class', 'chocolat-right');
+        this.elems.wrapper.appendChild(this.elems.right);
+        this.elems.bottom = document.createElement('div');
+        this.elems.bottom.setAttribute('class', 'chocolat-bottom');
+        this.elems.wrapper.appendChild(this.elems.bottom);
+        this.elems.close = document.createElement('span');
+        this.elems.close.setAttribute('class', 'chocolat-close');
+        this.elems.top.appendChild(this.elems.close);
+        this.elems.fullscreen = document.createElement('span');
+        this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
+        this.elems.bottom.appendChild(this.elems.fullscreen);
+        this.elems.description = document.createElement('span');
+        this.elems.description.setAttribute('class', 'chocolat-description');
+        this.elems.bottom.appendChild(this.elems.description);
+        this.elems.pagination = document.createElement('span');
+        this.elems.pagination.setAttribute('class', 'chocolat-pagination');
+        this.elems.bottom.appendChild(this.elems.pagination);
+        this.elems.setTitle = document.createElement('span');
+        this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
+        this.elems.bottom.appendChild(this.elems.setTitle);
         this.settings.afterMarkup.call(this);
       }
 
       openFullScreen() {
-        var wrapper = this.elems.wrapper[0];
+        var wrapper = this.elems.wrapper;
 
         if (wrapper.requestFullscreen) {
           this.settings.fullscreenOpen = true;
@@ -422,16 +423,16 @@
             }
           }
         });
-        this.elems.wrapper.find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+        $(this.elems.wrapper).find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
           this.change(+1);
         });
-        this.elems.wrapper.find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
+        $(this.elems.wrapper).find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
           return this.change(-1);
         });
-        $([this.elems.overlay[0], this.elems.close[0]]).off('click.chocolat').on('click.chocolat', () => {
+        $([this.elems.overlay, this.elems.close]).off('click.chocolat').on('click.chocolat', () => {
           return this.close();
         });
-        this.elems.fullscreen.off('click.chocolat').on('click.chocolat', () => {
+        $(this.elems.fullscreen).off('click.chocolat').on('click.chocolat', () => {
           if (this.settings.fullscreenOpen) {
             this.exitFullScreen();
             return;
@@ -441,26 +442,26 @@
         });
 
         if (this.settings.backgroundClose) {
-          this.elems.overlay.off('click.chocolat').on('click.chocolat', () => {
+          $(this.elems.overlay).off('click.chocolat').on('click.chocolat', () => {
             return this.close();
           });
         }
 
-        this.elems.wrapper.off('click.chocolat').on('click.chocolat', e => {
+        $(this.elems.wrapper).off('click.chocolat').on('click.chocolat', e => {
           return this.zoomOut(e);
         });
-        this.elems.wrapper.find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+        $(this.elems.wrapper).find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
           if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
             e.stopPropagation();
             return this.zoomIn(e);
           }
         });
-        this.elems.wrapper.mousemove(e => {
+        $(this.elems.wrapper).mousemove(e => {
           if (this.settings.initialZoomState === null) {
             return;
           }
 
-          if (this.elems.img.is(':animated')) {
+          if ($(this.elems.img).is(':animated')) {
             return;
           }
 
@@ -504,8 +505,13 @@
           }
 
           this.debounce(50, () => {
-            var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-            this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0);
+            const {
+              width,
+              height,
+              left,
+              top
+            } = this.fit(this.settings.currentImage, this.elems.wrapper);
+            this.center(width, height, left, top, 0);
             this.zoomable();
           });
         });
@@ -513,10 +519,10 @@
 
       zoomable() {
         var currentImage = this.settings.images[this.settings.currentImage];
-        var wrapperWidth = this.elems.wrapper.width();
-        var wrapperHeight = this.elems.wrapper.height();
+        var wrapperWidth = this.elems.wrapper.clientWidth;
+        var wrapperHeight = this.elems.wrapper.clientHeight;
         var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
-        var isImageStretched = this.elems.img.width() > currentImage.width || this.elems.img.height() > currentImage.height;
+        var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
         if (isImageZoomable && !isImageStretched) {
           this.elems.domContainer.addClass('chocolat-zoomable');
@@ -532,10 +538,15 @@
         event.pageX = e.pageX;
         event.pageY = e.pageY;
         event.duration = this.settings.duration;
-        this.elems.wrapper.trigger(event);
+        $(this.elems.wrapper).trigger(event);
         this.elems.domContainer.addClass('chocolat-zoomed');
-        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, this.settings.duration);
+        const {
+          width,
+          height,
+          left,
+          top
+        } = this.fit(this.settings.currentImage, this.elems.wrapper);
+        return this.center(width, height, left, top, this.settings.duration);
       }
 
       zoomOut(e, duration) {
@@ -546,12 +557,17 @@
         duration = duration || this.settings.duration;
         this.settings.imageSize = this.settings.initialZoomState;
         this.settings.initialZoomState = null;
-        this.elems.img.animate({
+        $(this.elems.img).animate({
           margin: 0
         }, duration);
         this.elems.domContainer.removeClass('chocolat-zoomed');
-        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper);
-        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration);
+        const {
+          width,
+          height,
+          left,
+          top
+        } = this.fit(this.settings.currentImage, this.elems.wrapper);
+        return this.center(width, height, left, top, duration);
       }
 
       setDomContainer() {
@@ -607,7 +623,7 @@
             return this.settings[property];
           },
           getElem: name => {
-            return this.elems[name];
+            return $(this.elems[name]);
           }
         };
       }
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index d326a06..fa731fb 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -112,18 +112,23 @@ export class Chocolat {
             return
         }
 
-        this.elems.overlay.fadeIn(this.settings.duration)
-        this.elems.wrapper.fadeIn(this.settings.duration)
+        $(this.elems.overlay).fadeIn(this.settings.duration)
+        $(this.elems.wrapper).fadeIn(this.settings.duration)
         this.elems.domContainer.addClass('chocolat-open')
 
         this.settings.timer = setTimeout(() => {
             if (typeof this.elems != 'undefined') {
-                this.elems.loader.fadeIn()
+                $(this.elems.loader).fadeIn()
             }
         }, this.settings.duration)
 
-        var deferred = this.preload(i)
+        return this.preload(i)
             .then((imgLoader) => {
+                const nextIndex = i + 1
+                if (this.settings.images[nextIndex] != undefined) {
+                    this.preload(nextIndex)
+                }
+
                 return this.place(i, imgLoader)
             })
             .then((imgLoader) => {
@@ -133,13 +138,6 @@ export class Chocolat {
                 this.zoomable()
                 this.settings.afterImageLoad()
             })
-
-        var nextIndex = i + 1
-        if (typeof this.settings.images[nextIndex] != 'undefined') {
-            this.preload(nextIndex)
-        }
-
-        return deferred
     }
 
     place(i, imgLoader) {
@@ -151,13 +149,13 @@ export class Chocolat {
         this.arrows()
 
         this.storeImgSize(imgLoader, i)
-        fitting = this.fit(i, this.elems.wrapper)
 
-        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
+        const { width, height, left, top } = this.fit(i, this.elems.wrapper)
+        return this.center(width, height, left, top, 0)
     }
 
     center(width, height, left, top, duration) {
-        return this.elems.content
+        return $(this.elems.content)
             .css('overflow', 'visible')
             .animate(
                 {
@@ -174,30 +172,30 @@ export class Chocolat {
     appear(i) {
         clearTimeout(this.settings.timer)
 
-        return this.elems.loader
+        return $(this.elems.loader)
             .stop()
             .fadeOut(300, () => {
-                this.elems.img.attr('src', this.settings.images[i].src)
+                $(this.elems.img).attr('src', this.settings.images[i].src)
             })
             .promise()
     }
 
     fit(i, container) {
-        var height
-        var width
-
-        var imgHeight = this.settings.images[i].height
-        var imgWidth = this.settings.images[i].width
-        var holderHeight = $(container).height()
-        var holderWidth = $(container).width()
-        var holderOutMarginH = this.getOutMarginH()
-        var holderOutMarginW = this.getOutMarginW()
-
-        var holderGlobalWidth = holderWidth - holderOutMarginW
-        var holderGlobalHeight = holderHeight - holderOutMarginH
-        var holderGlobalRatio = holderGlobalHeight / holderGlobalWidth
-        var holderRatio = holderHeight / holderWidth
-        var imgRatio = imgHeight / imgWidth
+        let height
+        let width
+
+        const imgHeight = this.settings.images[i].height
+        const imgWidth = this.settings.images[i].width
+        const holderHeight = container.clientHeight
+        const holderWidth = container.clientWidth
+        const holderOutMarginH = this.getOutMarginH()
+        const holderOutMarginW = this.getOutMarginW()
+
+        const holderGlobalWidth = holderWidth - holderOutMarginW
+        const holderGlobalHeight = holderHeight - holderOutMarginH
+        const holderGlobalRatio = holderGlobalHeight / holderGlobalWidth
+        const holderRatio = holderHeight / holderWidth
+        const imgRatio = imgHeight / imgWidth
 
         if (this.settings.imageSize == 'cover') {
             if (imgRatio < holderRatio) {
@@ -255,34 +253,34 @@ export class Chocolat {
 
     arrows() {
         if (this.settings.loop) {
-            $([this.elems.left[0], this.elems.right[0]]).addClass('active')
+            $([this.elems.left, this.elems.right]).addClass('active')
         } else if (this.settings.linkImages) {
             // right
             if (this.settings.currentImage == this.settings.lastImage) {
-                this.elems.right.removeClass('active')
+                $(this.elems.right).removeClass('active')
             } else {
-                this.elems.right.addClass('active')
+                $(this.elems.right).addClass('active')
             }
             // left
             if (this.settings.currentImage === 0) {
-                this.elems.left.removeClass('active')
+                $(this.elems.left).removeClass('active')
             } else {
-                this.elems.left.addClass('active')
+                $(this.elems.left).addClass('active')
             }
         } else {
-            $([this.elems.left[0], this.elems.right[0]]).removeClass('active')
+            $([this.elems.left, this.elems.right]).removeClass('active')
         }
     }
 
     description() {
-        this.elems.description.html(this.settings.images[this.settings.currentImage].title)
+        $(this.elems.description).html(this.settings.images[this.settings.currentImage].title)
     }
 
     pagination() {
         var last = this.settings.lastImage + 1
         var position = this.settings.currentImage + 1
 
-        this.elems.pagination.html(position + ' ' + this.settings.separator2 + last)
+        $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last)
     }
 
     storeImgSize(img, i) {
@@ -301,7 +299,7 @@ export class Chocolat {
             return
         }
 
-        var els = [this.elems.overlay[0], this.elems.loader[0], this.elems.wrapper[0]]
+        var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper]
         var def = $.when($(els).fadeOut(200)).done(() => {
             this.elems.domContainer.removeClass('chocolat-open')
         })
@@ -327,17 +325,17 @@ export class Chocolat {
         this.settings.currentImage = false
         this.settings.initialized = false
         this.elems.domContainer.removeClass(this._cssClasses.join(' '))
-        this.elems.wrapper.remove()
+        $(this.elems.wrapper).remove()
     }
 
     getOutMarginW() {
-        var left = this.elems.left.outerWidth(true)
-        var right = this.elems.right.outerWidth(true)
+        var left = $(this.elems.left).outerWidth(true)
+        var right = $(this.elems.right).outerWidth(true)
         return left + right
     }
 
     getOutMarginH() {
-        return this.elems.top.outerHeight(true) + this.elems.bottom.outerHeight(true)
+        return $(this.elems.top).outerHeight(true) + $(this.elems.bottom).outerHeight(true)
     }
 
     markup() {
@@ -349,70 +347,68 @@ export class Chocolat {
             this.elems.domContainer.addClass('chocolat-in-container')
         }
 
-        this.elems.wrapper = $('<div/>', {
-            class: 'chocolat-wrapper',
-            id: 'chocolat-content-' + this.settings.setIndex,
-        }).appendTo(this.elems.domContainer)
+        this.elems.wrapper = document.createElement('div')
+        this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex)
+        this.elems.wrapper.setAttribute('class', 'chocolat-wrapper')
+        this.elems.domContainer[0].appendChild(this.elems.wrapper)
 
-        this.elems.overlay = $('<div/>', {
-            class: 'chocolat-overlay',
-        }).appendTo(this.elems.wrapper)
+        this.elems.overlay = document.createElement('div')
+        this.elems.overlay.setAttribute('class', 'chocolat-overlay')
+        this.elems.wrapper.appendChild(this.elems.overlay)
 
-        this.elems.loader = $('<div/>', {
-            class: 'chocolat-loader',
-        }).appendTo(this.elems.wrapper)
+        this.elems.loader = document.createElement('div')
+        this.elems.loader.setAttribute('class', 'chocolat-loader')
+        this.elems.wrapper.appendChild(this.elems.loader)
 
-        this.elems.content = $('<div/>', {
-            class: 'chocolat-content',
-        }).appendTo(this.elems.wrapper)
+        this.elems.content = document.createElement('div')
+        this.elems.content.setAttribute('class', 'chocolat-content')
+        this.elems.wrapper.appendChild(this.elems.content)
 
-        this.elems.img = $('<img/>', {
-            class: 'chocolat-img',
-            src: '',
-        }).appendTo(this.elems.content)
+        this.elems.img = document.createElement('img')
+        this.elems.img.setAttribute('class', 'chocolat-img')
+        this.elems.content.appendChild(this.elems.img)
 
-        this.elems.top = $('<div/>', {
-            class: 'chocolat-top',
-        }).appendTo(this.elems.wrapper)
+        this.elems.top = document.createElement('div')
+        this.elems.top.setAttribute('class', 'chocolat-top')
+        this.elems.wrapper.appendChild(this.elems.top)
 
-        this.elems.left = $('<div/>', {
-            class: 'chocolat-left',
-        }).appendTo(this.elems.wrapper)
+        this.elems.left = document.createElement('div')
+        this.elems.left.setAttribute('class', 'chocolat-left')
+        this.elems.wrapper.appendChild(this.elems.left)
 
-        this.elems.right = $('<div/>', {
-            class: 'chocolat-right',
-        }).appendTo(this.elems.wrapper)
+        this.elems.right = document.createElement('div')
+        this.elems.right.setAttribute('class', 'chocolat-right')
+        this.elems.wrapper.appendChild(this.elems.right)
 
-        this.elems.bottom = $('<div/>', {
-            class: 'chocolat-bottom',
-        }).appendTo(this.elems.wrapper)
+        this.elems.bottom = document.createElement('div')
+        this.elems.bottom.setAttribute('class', 'chocolat-bottom')
+        this.elems.wrapper.appendChild(this.elems.bottom)
 
-        this.elems.close = $('<span/>', {
-            class: 'chocolat-close',
-        }).appendTo(this.elems.top)
+        this.elems.close = document.createElement('span')
+        this.elems.close.setAttribute('class', 'chocolat-close')
+        this.elems.top.appendChild(this.elems.close)
 
-        this.elems.fullscreen = $('<span/>', {
-            class: 'chocolat-fullscreen',
-        }).appendTo(this.elems.bottom)
+        this.elems.fullscreen = document.createElement('span')
+        this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen')
+        this.elems.bottom.appendChild(this.elems.fullscreen)
 
-        this.elems.description = $('<span/>', {
-            class: 'chocolat-description',
-        }).appendTo(this.elems.bottom)
+        this.elems.description = document.createElement('span')
+        this.elems.description.setAttribute('class', 'chocolat-description')
+        this.elems.bottom.appendChild(this.elems.description)
 
-        this.elems.pagination = $('<span/>', {
-            class: 'chocolat-pagination',
-        }).appendTo(this.elems.bottom)
+        this.elems.pagination = document.createElement('span')
+        this.elems.pagination.setAttribute('class', 'chocolat-pagination')
+        this.elems.bottom.appendChild(this.elems.pagination)
 
-        this.elems.setTitle = $('<span/>', {
-            class: 'chocolat-set-title',
-            html: this.settings.setTitle,
-        }).appendTo(this.elems.bottom)
+        this.elems.setTitle = document.createElement('span')
+        this.elems.setTitle.setAttribute('class', 'chocolat-set-title')
+        this.elems.bottom.appendChild(this.elems.setTitle)
 
         this.settings.afterMarkup.call(this)
     }
 
     openFullScreen() {
-        var wrapper = this.elems.wrapper[0]
+        var wrapper = this.elems.wrapper
 
         if (wrapper.requestFullscreen) {
             this.settings.fullscreenOpen = true
@@ -464,45 +460,51 @@ export class Chocolat {
                 }
             })
 
-        this.elems.wrapper
+        $(this.elems.wrapper)
             .find('.chocolat-right')
             .off('click.chocolat')
             .on('click.chocolat', () => {
                 this.change(+1)
             })
 
-        this.elems.wrapper
+        $(this.elems.wrapper)
             .find('.chocolat-left')
             .off('click.chocolat')
             .on('click.chocolat', () => {
                 return this.change(-1)
             })
 
-        $([this.elems.overlay[0], this.elems.close[0]])
+        $([this.elems.overlay, this.elems.close])
             .off('click.chocolat')
             .on('click.chocolat', () => {
                 return this.close()
             })
 
-        this.elems.fullscreen.off('click.chocolat').on('click.chocolat', () => {
-            if (this.settings.fullscreenOpen) {
-                this.exitFullScreen()
-                return
-            }
+        $(this.elems.fullscreen)
+            .off('click.chocolat')
+            .on('click.chocolat', () => {
+                if (this.settings.fullscreenOpen) {
+                    this.exitFullScreen()
+                    return
+                }
 
-            this.openFullScreen()
-        })
+                this.openFullScreen()
+            })
 
         if (this.settings.backgroundClose) {
-            this.elems.overlay.off('click.chocolat').on('click.chocolat', () => {
-                return this.close()
-            })
+            $(this.elems.overlay)
+                .off('click.chocolat')
+                .on('click.chocolat', () => {
+                    return this.close()
+                })
         }
-        this.elems.wrapper.off('click.chocolat').on('click.chocolat', (e) => {
-            return this.zoomOut(e)
-        })
+        $(this.elems.wrapper)
+            .off('click.chocolat')
+            .on('click.chocolat', (e) => {
+                return this.zoomOut(e)
+            })
 
-        this.elems.wrapper
+        $(this.elems.wrapper)
             .find('.chocolat-img')
             .off('click.chocolat')
             .on('click.chocolat', (e) => {
@@ -515,11 +517,11 @@ export class Chocolat {
                 }
             })
 
-        this.elems.wrapper.mousemove((e) => {
+        $(this.elems.wrapper).mousemove((e) => {
             if (this.settings.initialZoomState === null) {
                 return
             }
-            if (this.elems.img.is(':animated')) {
+            if ($(this.elems.img).is(':animated')) {
                 return
             }
 
@@ -567,8 +569,12 @@ export class Chocolat {
                 return
             }
             this.debounce(50, () => {
-                var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
-                this.center(fitting.width, fitting.height, fitting.left, fitting.top, 0)
+                const { width, height, left, top } = this.fit(
+                    this.settings.currentImage,
+                    this.elems.wrapper
+                )
+
+                this.center(width, height, left, top, 0)
                 this.zoomable()
             })
         })
@@ -576,8 +582,8 @@ export class Chocolat {
 
     zoomable() {
         var currentImage = this.settings.images[this.settings.currentImage]
-        var wrapperWidth = this.elems.wrapper.width()
-        var wrapperHeight = this.elems.wrapper.height()
+        var wrapperWidth = this.elems.wrapper.clientWidth
+        var wrapperHeight = this.elems.wrapper.clientHeight
 
         var isImageZoomable =
             this.settings.enableZoom &&
@@ -585,8 +591,8 @@ export class Chocolat {
                 ? true
                 : false
         var isImageStretched =
-            this.elems.img.width() > currentImage.width ||
-            this.elems.img.height() > currentImage.height
+            this.elems.img.clientWidth > currentImage.width ||
+            this.elems.img.clientHeight > currentImage.height
 
         if (isImageZoomable && !isImageStretched) {
             this.elems.domContainer.addClass('chocolat-zoomable')
@@ -603,17 +609,15 @@ export class Chocolat {
         event.pageX = e.pageX
         event.pageY = e.pageY
         event.duration = this.settings.duration
-        this.elems.wrapper.trigger(event)
+        $(this.elems.wrapper).trigger(event)
 
         this.elems.domContainer.addClass('chocolat-zoomed')
-        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
-        return this.center(
-            fitting.width,
-            fitting.height,
-            fitting.left,
-            fitting.top,
-            this.settings.duration
+        const { width, height, left, top } = this.fit(
+            this.settings.currentImage,
+            this.elems.wrapper
         )
+
+        return this.center(width, height, left, top, this.settings.duration)
     }
 
     zoomOut(e, duration) {
@@ -624,11 +628,14 @@ export class Chocolat {
 
         this.settings.imageSize = this.settings.initialZoomState
         this.settings.initialZoomState = null
-        this.elems.img.animate({ margin: 0 }, duration)
+        $(this.elems.img).animate({ margin: 0 }, duration)
 
         this.elems.domContainer.removeClass('chocolat-zoomed')
-        var fitting = this.fit(this.settings.currentImage, this.elems.wrapper)
-        return this.center(fitting.width, fitting.height, fitting.left, fitting.top, duration)
+        const { width, height, left, top } = this.fit(
+            this.settings.currentImage,
+            this.elems.wrapper
+        )
+        return this.center(width, height, left, top, duration)
     }
 
     setDomContainer() {
@@ -693,7 +700,7 @@ export class Chocolat {
             },
 
             getElem: (name) => {
-                return this.elems[name]
+                return $(this.elems[name])
             },
         }
     }
diff --git a/test/test.js b/test/test.js
index d3b00cd..5e604f0 100644
--- a/test/test.js
+++ b/test/test.js
@@ -149,7 +149,7 @@ describe('Chocolat', function() {
 
         return it('should append description element in top element (instead of bottom, the default behaviour)', function() {
             var afterMarkup = function() {
-                return this.elems.description.appendTo(this.elems.top)
+                return $(this.elems.description).appendTo(this.elems.top)
             }
 
             var chocolat = $('#example0')
@@ -165,8 +165,19 @@ describe('Chocolat', function() {
                 .first()
                 .trigger('click')
 
-            expect(chocolat.elems.top.find(chocolat.elems.description).length).to.equal(1)
-            expect(chocolat.elems.bottom.find(chocolat.elems.description).length).to.equal(0)
+            chocolat.api().getElem('top')
+            expect(
+                chocolat
+                    .api()
+                    .getElem('top')
+                    .find(chocolat.api().getElem('description')).length
+            ).to.equal(1)
+            expect(
+                chocolat
+                    .api()
+                    .getElem('bottom')
+                    .find(chocolat.api().getElem('description')).length
+            ).to.equal(0)
         })
     })
 

From a2786310e6883e8c43cefcff9babc27f541e871e Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 23 Dec 2018 15:58:07 +0100
Subject: [PATCH 08/65] Built in event namespace manager

---
 dist/js/chocolat.cjs.js  | 35 +++++++++++++++++++++++++++-----
 dist/js/chocolat.esm.js  | 35 +++++++++++++++++++++++++++-----
 dist/js/chocolat.iife.js | 35 +++++++++++++++++++++++++++-----
 src/js/chocolat.js       | 44 +++++++++++++++++++++++++++++++---------
 test/test.js             | 41 ++++++++++++++++++++++---------------
 5 files changed, 149 insertions(+), 41 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index f7a6a78..9c96350 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -44,6 +44,7 @@ class Chocolat {
     this.elems = {};
     this.$element = $(element);
     this.element = this.$element[0];
+    this.events = [];
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
     if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
@@ -58,18 +59,42 @@ class Chocolat {
         height: false,
         width: false
       });
-      $(el).off('click.chocolat').on('click.chocolat', e => {
+      this.off(el, 'click.chocolat');
+      this.on(el, 'click.chocolat', e => {
         this.init(i);
         e.preventDefault();
       });
     });
   }
 
+  on(element, eventName, cb) {
+    const length = this.events.push({
+      element,
+      eventName,
+      cb
+    });
+    element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
+    return this;
+  }
+
+  off(element, eventName) {
+    const index = this.events.findIndex(event => {
+      return event.element === element && event.eventName === eventName;
+    });
+
+    if (this.events[index]) {
+      element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
+      this.events.splice(index, 1);
+    }
+
+    return this;
+  }
+
   init(i) {
     if (!this.settings.initialized) {
       this.setDomContainer();
       this.markup();
-      this.events();
+      this.attachListeners();
       this.settings.lastImage = this.settings.images.length - 1;
       this.settings.initialized = true;
     }
@@ -287,8 +312,8 @@ class Chocolat {
   destroy() {
     this.$element.removeData();
     const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-    imgs.forEach(el => {
-      $(el).off('click.chocolat');
+    imgs.forEach((el, i) => {
+      this.off(el, 'click.chocolat');
     });
 
     if (!this.settings.initialized) {
@@ -410,7 +435,7 @@ class Chocolat {
     }
   }
 
-  events() {
+  attachListeners() {
     $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
       if (this.settings.initialized) {
         if (e.keyCode == 37) {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 7f7133a..b497482 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -42,6 +42,7 @@ class Chocolat {
     this.elems = {};
     this.$element = $(element);
     this.element = this.$element[0];
+    this.events = [];
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
     if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
@@ -56,18 +57,42 @@ class Chocolat {
         height: false,
         width: false
       });
-      $(el).off('click.chocolat').on('click.chocolat', e => {
+      this.off(el, 'click.chocolat');
+      this.on(el, 'click.chocolat', e => {
         this.init(i);
         e.preventDefault();
       });
     });
   }
 
+  on(element, eventName, cb) {
+    const length = this.events.push({
+      element,
+      eventName,
+      cb
+    });
+    element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
+    return this;
+  }
+
+  off(element, eventName) {
+    const index = this.events.findIndex(event => {
+      return event.element === element && event.eventName === eventName;
+    });
+
+    if (this.events[index]) {
+      element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
+      this.events.splice(index, 1);
+    }
+
+    return this;
+  }
+
   init(i) {
     if (!this.settings.initialized) {
       this.setDomContainer();
       this.markup();
-      this.events();
+      this.attachListeners();
       this.settings.lastImage = this.settings.images.length - 1;
       this.settings.initialized = true;
     }
@@ -285,8 +310,8 @@ class Chocolat {
   destroy() {
     this.$element.removeData();
     const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-    imgs.forEach(el => {
-      $(el).off('click.chocolat');
+    imgs.forEach((el, i) => {
+      this.off(el, 'click.chocolat');
     });
 
     if (!this.settings.initialized) {
@@ -408,7 +433,7 @@ class Chocolat {
     }
   }
 
-  events() {
+  attachListeners() {
     $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
       if (this.settings.initialized) {
         if (e.keyCode == 37) {
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index fbed1db..ec8d39c 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -45,6 +45,7 @@
         this.elems = {};
         this.$element = $(element);
         this.element = this.$element[0];
+        this.events = [];
         this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
         if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
@@ -59,18 +60,42 @@
             height: false,
             width: false
           });
-          $(el).off('click.chocolat').on('click.chocolat', e => {
+          this.off(el, 'click.chocolat');
+          this.on(el, 'click.chocolat', e => {
             this.init(i);
             e.preventDefault();
           });
         });
       }
 
+      on(element, eventName, cb) {
+        const length = this.events.push({
+          element,
+          eventName,
+          cb
+        });
+        element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
+        return this;
+      }
+
+      off(element, eventName) {
+        const index = this.events.findIndex(event => {
+          return event.element === element && event.eventName === eventName;
+        });
+
+        if (this.events[index]) {
+          element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
+          this.events.splice(index, 1);
+        }
+
+        return this;
+      }
+
       init(i) {
         if (!this.settings.initialized) {
           this.setDomContainer();
           this.markup();
-          this.events();
+          this.attachListeners();
           this.settings.lastImage = this.settings.images.length - 1;
           this.settings.initialized = true;
         }
@@ -288,8 +313,8 @@
       destroy() {
         this.$element.removeData();
         const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-        imgs.forEach(el => {
-          $(el).off('click.chocolat');
+        imgs.forEach((el, i) => {
+          this.off(el, 'click.chocolat');
         });
 
         if (!this.settings.initialized) {
@@ -411,7 +436,7 @@
         }
       }
 
-      events() {
+      attachListeners() {
         $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
           if (this.settings.initialized) {
             if (e.keyCode == 37) {
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index fa731fb..c48b02b 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -37,6 +37,7 @@ export class Chocolat {
         this.elems = {}
         this.$element = $(element)
         this.element = this.$element[0]
+        this.events = []
 
         this._cssClasses = [
             'chocolat-open',
@@ -60,20 +61,42 @@ export class Chocolat {
                 width: false,
             })
 
-            $(el)
-                .off('click.chocolat')
-                .on('click.chocolat', (e) => {
-                    this.init(i)
-                    e.preventDefault()
-                })
+            this.off(el, 'click.chocolat')
+            this.on(el, 'click.chocolat', (e) => {
+                this.init(i)
+                e.preventDefault()
+            })
+        })
+    }
+
+    on(element, eventName, cb) {
+        const length = this.events.push({
+            element,
+            eventName,
+            cb,
+        })
+        element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb)
+        return this
+    }
+
+    off(element, eventName) {
+        const index = this.events.findIndex((event) => {
+            return event.element === element && event.eventName === eventName
         })
+
+        if (this.events[index]) {
+            element.removeEventListener(eventName.split('.')[0], this.events[index].cb)
+            this.events.splice(index, 1)
+        }
+
+        return this
     }
 
     init(i) {
         if (!this.settings.initialized) {
             this.setDomContainer()
             this.markup()
-            this.events()
+            this.attachListeners()
             this.settings.lastImage = this.settings.images.length - 1
             this.settings.initialized = true
         }
@@ -312,8 +335,9 @@ export class Chocolat {
         this.$element.removeData()
 
         const imgs = this.element.querySelectorAll(this.settings.imageSelector)
-        imgs.forEach((el) => {
-            $(el).off('click.chocolat')
+
+        imgs.forEach((el, i) => {
+            this.off(el, 'click.chocolat')
         })
 
         if (!this.settings.initialized) {
@@ -445,7 +469,7 @@ export class Chocolat {
         }
     }
 
-    events() {
+    attachListeners() {
         $(document)
             .off('keydown.chocolat')
             .on('keydown.chocolat', (e) => {
diff --git a/test/test.js b/test/test.js
index 5e604f0..0c82407 100644
--- a/test/test.js
+++ b/test/test.js
@@ -17,8 +17,8 @@ describe('Chocolat', function() {
 
             $('#example0')
                 .find('.chocolat-image')
-                .first()
-                .trigger('click')
+                .first()[0]
+                .click()
 
             expect(spyMarkup.calledOnce).to.be.true
             expect($('#container').find('.chocolat-wrapper').length).to.equal(1)
@@ -103,8 +103,8 @@ describe('Chocolat', function() {
 
             $('#example0')
                 .find('.chocolat-image')
-                .first()
-                .trigger('click')
+                .first()[0]
+                .click()
 
             expect(spyInit.calledOnce).to.be.true
             expect(spyInit.calledWithExactly(0)).to.be.true
@@ -122,8 +122,8 @@ describe('Chocolat', function() {
 
             $('#example0')
                 .find('.chocolat-image')
-                .first()
-                .trigger('click')
+                .first()[0]
+                .click()
 
             expect(spyLoad.calledOnce).to.be.true
             expect(spyLoad.calledWithExactly(0)).to.be.true
@@ -141,8 +141,8 @@ describe('Chocolat', function() {
 
             $('#example0')
                 .find('.chocolat-image')
-                .first()
-                .trigger('click')
+                .first()[0]
+                .click()
 
             expect(spyMarkup.calledOnce).to.be.true
         })
@@ -162,8 +162,8 @@ describe('Chocolat', function() {
 
             $('#example0')
                 .find('.chocolat-image')
-                .first()
-                .trigger('click')
+                .first()[0]
+                .click()
 
             chocolat.api().getElem('top')
             expect(
@@ -229,15 +229,24 @@ describe('Chocolat', function() {
                 .data('chocolat')
             var imageSelector = chocolat.api().get('imageSelector')
 
-            var links = chocolat.$element.find(imageSelector)
-
-            var eventBefore = $._data(links.first()[0], 'events')
-            expect(eventBefore.click[0].namespace).to.equal('chocolat')
+            var eventBefore = Object.values(chocolat.events)
+            expect(eventBefore.length).to.equal(document.querySelectorAll(imageSelector).length)
 
             chocolat.api().destroy()
 
-            var eventAfter = $._data(links.first()[0], 'events')
-            expect(typeof eventAfter).to.equal('undefined')
+            var eventAfter = Object.values(chocolat.events)
+            expect(eventAfter.length).to.equal(0)
+
+            var spyInit = sinon.spy(chocolat, 'init')
+
+            const link = $('#example0')
+                .find(imageSelector)
+                .first()[0]
+
+            link.setAttribute('href', '#')
+            link.click()
+
+            expect(spyInit.notCalled).to.be.true
         })
     })
 

From 87f3a8e600b8b96d7db6426cd573d5048f415c67 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 23 Dec 2018 17:51:05 +0100
Subject: [PATCH 09/65] Dont use jquery to handle events anymore

---
 dist/js/chocolat.cjs.js  |  51 ++++++++++------
 dist/js/chocolat.esm.js  |  51 ++++++++++------
 dist/js/chocolat.iife.js |  51 ++++++++++------
 src/js/chocolat.js       | 128 +++++++++++++++++++--------------------
 4 files changed, 158 insertions(+), 123 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 9c96350..1b41396 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -68,6 +68,7 @@ class Chocolat {
   }
 
   on(element, eventName, cb) {
+    // const eventName = this.settings.setIndex + '-' + eventName
     const length = this.events.push({
       element,
       eventName,
@@ -78,6 +79,7 @@ class Chocolat {
   }
 
   off(element, eventName) {
+    // const eventName = this.settings.setIndex + '-' + eventName
     const index = this.events.findIndex(event => {
       return event.element === element && event.eventName === eventName;
     });
@@ -302,7 +304,7 @@ class Chocolat {
     }
 
     var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
-    var def = $.when($(els).fadeOut(200)).done(() => {
+    var def = $.when($(els).fadeOut(200)).then(() => {
       this.elems.domContainer.removeClass('chocolat-open');
     });
     this.settings.currentImage = false;
@@ -436,7 +438,8 @@ class Chocolat {
   }
 
   attachListeners() {
-    $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
+    this.off(document, 'keydown.chocolat');
+    this.on(document, 'keydown.chocolat', e => {
       if (this.settings.initialized) {
         if (e.keyCode == 37) {
           this.change(-1);
@@ -447,16 +450,22 @@ class Chocolat {
         }
       }
     });
-    $(this.elems.wrapper).find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+    const right = this.elems.wrapper.querySelector('.chocolat-right');
+    this.off(right, 'click.chocolat');
+    this.on(right, 'click.chocolat', () => {
       this.change(+1);
     });
-    $(this.elems.wrapper).find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
-      return this.change(-1);
+    const left = this.elems.wrapper.querySelector('.chocolat-left');
+    this.off(left, 'click.chocolat');
+    this.on(left, 'click.chocolat', () => {
+      this.change(-1);
     });
-    $([this.elems.overlay, this.elems.close]).off('click.chocolat').on('click.chocolat', () => {
-      return this.close();
+    this.off(this.elems.close, 'click.chocolat');
+    this.on(this.elems.close, 'click.chocolat', () => {
+      this.close();
     });
-    $(this.elems.fullscreen).off('click.chocolat').on('click.chocolat', () => {
+    this.off(this.elems.fullscreen, 'click.chocolat');
+    this.on(this.elems.fullscreen, 'click.chocolat', () => {
       if (this.settings.fullscreenOpen) {
         this.exitFullScreen();
         return;
@@ -466,21 +475,25 @@ class Chocolat {
     });
 
     if (this.settings.backgroundClose) {
-      $(this.elems.overlay).off('click.chocolat').on('click.chocolat', () => {
-        return this.close();
+      this.off(this.elems.overlay, 'click.chocolat');
+      this.on(this.elems.overlay, 'click.chocolat', e => {
+        this.close();
       });
     }
 
-    $(this.elems.wrapper).off('click.chocolat').on('click.chocolat', e => {
-      return this.zoomOut(e);
+    this.off(this.elems.wrapper, 'click.chocolat');
+    this.on(this.elems.wrapper, 'click.chocolat', e => {
+      this.zoomOut(e);
     });
-    $(this.elems.wrapper).find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+    const img = this.elems.wrapper.querySelector('.chocolat-img');
+    this.off(img, 'click.chocolat');
+    this.on(img, 'click.chocolat', e => {
       if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
         e.stopPropagation();
-        return this.zoomIn(e);
+        this.zoomIn(e);
       }
     });
-    $(this.elems.wrapper).mousemove(e => {
+    this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
       if (this.settings.initialZoomState === null) {
         return;
       }
@@ -489,9 +502,9 @@ class Chocolat {
         return;
       }
 
-      var pos = $(this).offset();
-      var height = $(this).height();
-      var width = $(this).width();
+      var pos = $(this.elems.wrapper).offset();
+      var height = $(this.elems.wrapper).height();
+      var width = $(this.elems.wrapper).width();
       var currentImage = this.settings.images[this.settings.currentImage];
       var imgWidth = currentImage.width;
       var imgHeight = currentImage.height;
@@ -523,7 +536,7 @@ class Chocolat {
         $(this.elems.img).stop(false, true).css(animation);
       }
     });
-    $(window).on('resize', () => {
+    this.on(window, 'resize.chocolat', e => {
       if (!this.settings.initialized || this.settings.currentImage === false) {
         return;
       }
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index b497482..11f4d24 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -66,6 +66,7 @@ class Chocolat {
   }
 
   on(element, eventName, cb) {
+    // const eventName = this.settings.setIndex + '-' + eventName
     const length = this.events.push({
       element,
       eventName,
@@ -76,6 +77,7 @@ class Chocolat {
   }
 
   off(element, eventName) {
+    // const eventName = this.settings.setIndex + '-' + eventName
     const index = this.events.findIndex(event => {
       return event.element === element && event.eventName === eventName;
     });
@@ -300,7 +302,7 @@ class Chocolat {
     }
 
     var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
-    var def = $.when($(els).fadeOut(200)).done(() => {
+    var def = $.when($(els).fadeOut(200)).then(() => {
       this.elems.domContainer.removeClass('chocolat-open');
     });
     this.settings.currentImage = false;
@@ -434,7 +436,8 @@ class Chocolat {
   }
 
   attachListeners() {
-    $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
+    this.off(document, 'keydown.chocolat');
+    this.on(document, 'keydown.chocolat', e => {
       if (this.settings.initialized) {
         if (e.keyCode == 37) {
           this.change(-1);
@@ -445,16 +448,22 @@ class Chocolat {
         }
       }
     });
-    $(this.elems.wrapper).find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+    const right = this.elems.wrapper.querySelector('.chocolat-right');
+    this.off(right, 'click.chocolat');
+    this.on(right, 'click.chocolat', () => {
       this.change(+1);
     });
-    $(this.elems.wrapper).find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
-      return this.change(-1);
+    const left = this.elems.wrapper.querySelector('.chocolat-left');
+    this.off(left, 'click.chocolat');
+    this.on(left, 'click.chocolat', () => {
+      this.change(-1);
     });
-    $([this.elems.overlay, this.elems.close]).off('click.chocolat').on('click.chocolat', () => {
-      return this.close();
+    this.off(this.elems.close, 'click.chocolat');
+    this.on(this.elems.close, 'click.chocolat', () => {
+      this.close();
     });
-    $(this.elems.fullscreen).off('click.chocolat').on('click.chocolat', () => {
+    this.off(this.elems.fullscreen, 'click.chocolat');
+    this.on(this.elems.fullscreen, 'click.chocolat', () => {
       if (this.settings.fullscreenOpen) {
         this.exitFullScreen();
         return;
@@ -464,21 +473,25 @@ class Chocolat {
     });
 
     if (this.settings.backgroundClose) {
-      $(this.elems.overlay).off('click.chocolat').on('click.chocolat', () => {
-        return this.close();
+      this.off(this.elems.overlay, 'click.chocolat');
+      this.on(this.elems.overlay, 'click.chocolat', e => {
+        this.close();
       });
     }
 
-    $(this.elems.wrapper).off('click.chocolat').on('click.chocolat', e => {
-      return this.zoomOut(e);
+    this.off(this.elems.wrapper, 'click.chocolat');
+    this.on(this.elems.wrapper, 'click.chocolat', e => {
+      this.zoomOut(e);
     });
-    $(this.elems.wrapper).find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+    const img = this.elems.wrapper.querySelector('.chocolat-img');
+    this.off(img, 'click.chocolat');
+    this.on(img, 'click.chocolat', e => {
       if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
         e.stopPropagation();
-        return this.zoomIn(e);
+        this.zoomIn(e);
       }
     });
-    $(this.elems.wrapper).mousemove(e => {
+    this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
       if (this.settings.initialZoomState === null) {
         return;
       }
@@ -487,9 +500,9 @@ class Chocolat {
         return;
       }
 
-      var pos = $(this).offset();
-      var height = $(this).height();
-      var width = $(this).width();
+      var pos = $(this.elems.wrapper).offset();
+      var height = $(this.elems.wrapper).height();
+      var width = $(this.elems.wrapper).width();
       var currentImage = this.settings.images[this.settings.currentImage];
       var imgWidth = currentImage.width;
       var imgHeight = currentImage.height;
@@ -521,7 +534,7 @@ class Chocolat {
         $(this.elems.img).stop(false, true).css(animation);
       }
     });
-    $(window).on('resize', () => {
+    this.on(window, 'resize.chocolat', e => {
       if (!this.settings.initialized || this.settings.currentImage === false) {
         return;
       }
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index ec8d39c..1f05d01 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -69,6 +69,7 @@
       }
 
       on(element, eventName, cb) {
+        // const eventName = this.settings.setIndex + '-' + eventName
         const length = this.events.push({
           element,
           eventName,
@@ -79,6 +80,7 @@
       }
 
       off(element, eventName) {
+        // const eventName = this.settings.setIndex + '-' + eventName
         const index = this.events.findIndex(event => {
           return event.element === element && event.eventName === eventName;
         });
@@ -303,7 +305,7 @@
         }
 
         var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
-        var def = $.when($(els).fadeOut(200)).done(() => {
+        var def = $.when($(els).fadeOut(200)).then(() => {
           this.elems.domContainer.removeClass('chocolat-open');
         });
         this.settings.currentImage = false;
@@ -437,7 +439,8 @@
       }
 
       attachListeners() {
-        $(document).off('keydown.chocolat').on('keydown.chocolat', e => {
+        this.off(document, 'keydown.chocolat');
+        this.on(document, 'keydown.chocolat', e => {
           if (this.settings.initialized) {
             if (e.keyCode == 37) {
               this.change(-1);
@@ -448,16 +451,22 @@
             }
           }
         });
-        $(this.elems.wrapper).find('.chocolat-right').off('click.chocolat').on('click.chocolat', () => {
+        const right = this.elems.wrapper.querySelector('.chocolat-right');
+        this.off(right, 'click.chocolat');
+        this.on(right, 'click.chocolat', () => {
           this.change(+1);
         });
-        $(this.elems.wrapper).find('.chocolat-left').off('click.chocolat').on('click.chocolat', () => {
-          return this.change(-1);
+        const left = this.elems.wrapper.querySelector('.chocolat-left');
+        this.off(left, 'click.chocolat');
+        this.on(left, 'click.chocolat', () => {
+          this.change(-1);
         });
-        $([this.elems.overlay, this.elems.close]).off('click.chocolat').on('click.chocolat', () => {
-          return this.close();
+        this.off(this.elems.close, 'click.chocolat');
+        this.on(this.elems.close, 'click.chocolat', () => {
+          this.close();
         });
-        $(this.elems.fullscreen).off('click.chocolat').on('click.chocolat', () => {
+        this.off(this.elems.fullscreen, 'click.chocolat');
+        this.on(this.elems.fullscreen, 'click.chocolat', () => {
           if (this.settings.fullscreenOpen) {
             this.exitFullScreen();
             return;
@@ -467,21 +476,25 @@
         });
 
         if (this.settings.backgroundClose) {
-          $(this.elems.overlay).off('click.chocolat').on('click.chocolat', () => {
-            return this.close();
+          this.off(this.elems.overlay, 'click.chocolat');
+          this.on(this.elems.overlay, 'click.chocolat', e => {
+            this.close();
           });
         }
 
-        $(this.elems.wrapper).off('click.chocolat').on('click.chocolat', e => {
-          return this.zoomOut(e);
+        this.off(this.elems.wrapper, 'click.chocolat');
+        this.on(this.elems.wrapper, 'click.chocolat', e => {
+          this.zoomOut(e);
         });
-        $(this.elems.wrapper).find('.chocolat-img').off('click.chocolat').on('click.chocolat', e => {
+        const img = this.elems.wrapper.querySelector('.chocolat-img');
+        this.off(img, 'click.chocolat');
+        this.on(img, 'click.chocolat', e => {
           if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
             e.stopPropagation();
-            return this.zoomIn(e);
+            this.zoomIn(e);
           }
         });
-        $(this.elems.wrapper).mousemove(e => {
+        this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
           if (this.settings.initialZoomState === null) {
             return;
           }
@@ -490,9 +503,9 @@
             return;
           }
 
-          var pos = $(this).offset();
-          var height = $(this).height();
-          var width = $(this).width();
+          var pos = $(this.elems.wrapper).offset();
+          var height = $(this.elems.wrapper).height();
+          var width = $(this.elems.wrapper).width();
           var currentImage = this.settings.images[this.settings.currentImage];
           var imgWidth = currentImage.width;
           var imgHeight = currentImage.height;
@@ -524,7 +537,7 @@
             $(this.elems.img).stop(false, true).css(animation);
           }
         });
-        $(window).on('resize', () => {
+        this.on(window, 'resize.chocolat', e => {
           if (!this.settings.initialized || this.settings.currentImage === false) {
             return;
           }
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index c48b02b..dd79708 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -70,6 +70,7 @@ export class Chocolat {
     }
 
     on(element, eventName, cb) {
+        // const eventName = this.settings.setIndex + '-' + eventName
         const length = this.events.push({
             element,
             eventName,
@@ -80,6 +81,7 @@ export class Chocolat {
     }
 
     off(element, eventName) {
+        // const eventName = this.settings.setIndex + '-' + eventName
         const index = this.events.findIndex((event) => {
             return event.element === element && event.eventName === eventName
         })
@@ -323,7 +325,7 @@ export class Chocolat {
         }
 
         var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper]
-        var def = $.when($(els).fadeOut(200)).done(() => {
+        var def = $.when($(els).fadeOut(200)).then(() => {
             this.elems.domContainer.removeClass('chocolat-open')
         })
         this.settings.currentImage = false
@@ -470,78 +472,71 @@ export class Chocolat {
     }
 
     attachListeners() {
-        $(document)
-            .off('keydown.chocolat')
-            .on('keydown.chocolat', (e) => {
-                if (this.settings.initialized) {
-                    if (e.keyCode == 37) {
-                        this.change(-1)
-                    } else if (e.keyCode == 39) {
-                        this.change(1)
-                    } else if (e.keyCode == 27) {
-                        this.close()
-                    }
+        this.off(document, 'keydown.chocolat')
+        this.on(document, 'keydown.chocolat', (e) => {
+            if (this.settings.initialized) {
+                if (e.keyCode == 37) {
+                    this.change(-1)
+                } else if (e.keyCode == 39) {
+                    this.change(1)
+                } else if (e.keyCode == 27) {
+                    this.close()
                 }
-            })
+            }
+        })
 
-        $(this.elems.wrapper)
-            .find('.chocolat-right')
-            .off('click.chocolat')
-            .on('click.chocolat', () => {
-                this.change(+1)
-            })
+        const right = this.elems.wrapper.querySelector('.chocolat-right')
+        this.off(right, 'click.chocolat')
+        this.on(right, 'click.chocolat', () => {
+            this.change(+1)
+        })
 
-        $(this.elems.wrapper)
-            .find('.chocolat-left')
-            .off('click.chocolat')
-            .on('click.chocolat', () => {
-                return this.change(-1)
-            })
+        const left = this.elems.wrapper.querySelector('.chocolat-left')
+        this.off(left, 'click.chocolat')
+        this.on(left, 'click.chocolat', () => {
+            this.change(-1)
+        })
 
-        $([this.elems.overlay, this.elems.close])
-            .off('click.chocolat')
-            .on('click.chocolat', () => {
-                return this.close()
-            })
+        this.off(this.elems.close, 'click.chocolat')
+        this.on(this.elems.close, 'click.chocolat', () => {
+            this.close()
+        })
 
-        $(this.elems.fullscreen)
-            .off('click.chocolat')
-            .on('click.chocolat', () => {
-                if (this.settings.fullscreenOpen) {
-                    this.exitFullScreen()
-                    return
-                }
+        this.off(this.elems.fullscreen, 'click.chocolat')
+        this.on(this.elems.fullscreen, 'click.chocolat', () => {
+            if (this.settings.fullscreenOpen) {
+                this.exitFullScreen()
+                return
+            }
 
-                this.openFullScreen()
-            })
+            this.openFullScreen()
+        })
 
         if (this.settings.backgroundClose) {
-            $(this.elems.overlay)
-                .off('click.chocolat')
-                .on('click.chocolat', () => {
-                    return this.close()
-                })
-        }
-        $(this.elems.wrapper)
-            .off('click.chocolat')
-            .on('click.chocolat', (e) => {
-                return this.zoomOut(e)
+            this.off(this.elems.overlay, 'click.chocolat')
+            this.on(this.elems.overlay, 'click.chocolat', (e) => {
+                this.close()
             })
+        }
 
-        $(this.elems.wrapper)
-            .find('.chocolat-img')
-            .off('click.chocolat')
-            .on('click.chocolat', (e) => {
-                if (
-                    this.settings.initialZoomState === null &&
-                    this.elems.domContainer.hasClass('chocolat-zoomable')
-                ) {
-                    e.stopPropagation()
-                    return this.zoomIn(e)
-                }
-            })
+        this.off(this.elems.wrapper, 'click.chocolat')
+        this.on(this.elems.wrapper, 'click.chocolat', (e) => {
+            this.zoomOut(e)
+        })
 
-        $(this.elems.wrapper).mousemove((e) => {
+        const img = this.elems.wrapper.querySelector('.chocolat-img')
+        this.off(img, 'click.chocolat')
+        this.on(img, 'click.chocolat', (e) => {
+            if (
+                this.settings.initialZoomState === null &&
+                this.elems.domContainer.hasClass('chocolat-zoomable')
+            ) {
+                e.stopPropagation()
+                this.zoomIn(e)
+            }
+        })
+
+        this.on(this.elems.wrapper, 'mousemove.chocolat', (e) => {
             if (this.settings.initialZoomState === null) {
                 return
             }
@@ -549,9 +544,9 @@ export class Chocolat {
                 return
             }
 
-            var pos = $(this).offset()
-            var height = $(this).height()
-            var width = $(this).width()
+            var pos = $(this.elems.wrapper).offset()
+            var height = $(this.elems.wrapper).height()
+            var width = $(this.elems.wrapper).width()
 
             var currentImage = this.settings.images[this.settings.currentImage]
             var imgWidth = currentImage.width
@@ -588,7 +583,8 @@ export class Chocolat {
                     .css(animation)
             }
         })
-        $(window).on('resize', () => {
+
+        this.on(window, 'resize.chocolat', (e) => {
             if (!this.settings.initialized || this.settings.currentImage === false) {
                 return
             }

From 88826265ffe85d38d0b2c65c6f38ce88fdf3120b Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 24 Dec 2018 10:27:27 +0100
Subject: [PATCH 10/65] Use native add and remove class

---
 dist/js/chocolat.cjs.js  | 36 +++++++++++++++++++-----------------
 dist/js/chocolat.esm.js  | 36 +++++++++++++++++++-----------------
 dist/js/chocolat.iife.js | 36 +++++++++++++++++++-----------------
 src/js/chocolat.js       | 38 ++++++++++++++++++++------------------
 4 files changed, 77 insertions(+), 69 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 1b41396..3ee9d56 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -4,7 +4,7 @@ const defaults = {
   container: window,
   // window or jquery object or jquery selector, or element
   imageSelector: '.chocolat-image',
-  className: '',
+  className: undefined,
   imageSize: 'default',
   // 'default', 'contain', 'cover' or 'native'
   initialZoomState: null,
@@ -134,7 +134,7 @@ class Chocolat {
 
     $(this.elems.overlay).fadeIn(this.settings.duration);
     $(this.elems.wrapper).fadeIn(this.settings.duration);
-    this.elems.domContainer.addClass('chocolat-open');
+    $(this.elems.domContainer)[0].classList.add('chocolat-open');
     this.settings.timer = setTimeout(() => {
       if (typeof this.elems != 'undefined') {
         $(this.elems.loader).fadeIn();
@@ -256,23 +256,25 @@ class Chocolat {
 
   arrows() {
     if (this.settings.loop) {
-      $([this.elems.left, this.elems.right]).addClass('active');
+      this.elems.left.classList.add('active');
+      this.elems.right.classList.add('active');
     } else if (this.settings.linkImages) {
       // right
       if (this.settings.currentImage == this.settings.lastImage) {
-        $(this.elems.right).removeClass('active');
+        this.elems.right.classList.remove('active');
       } else {
-        $(this.elems.right).addClass('active');
+        this.elems.right.classList.add('active');
       } // left
 
 
       if (this.settings.currentImage === 0) {
-        $(this.elems.left).removeClass('active');
+        this.elems.left.classList.remove('active');
       } else {
-        $(this.elems.left).addClass('active');
+        this.elems.left.classList.add('active');
       }
     } else {
-      $([this.elems.left, this.elems.right]).removeClass('active');
+      this.elems.left.classList.remove('active');
+      this.elems.right.classList.remove('active');
     }
   }
 
@@ -305,7 +307,7 @@ class Chocolat {
 
     var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
     var def = $.when($(els).fadeOut(200)).then(() => {
-      this.elems.domContainer.removeClass('chocolat-open');
+      $(this.elems.domContainer)[0].classList.remove('chocolat-open');
     });
     this.settings.currentImage = false;
     return def;
@@ -328,7 +330,7 @@ class Chocolat {
 
     this.settings.currentImage = false;
     this.settings.initialized = false;
-    this.elems.domContainer.removeClass(this._cssClasses.join(' '));
+    $(this.elems.domContainer)[0].classList.remove(...this._cssClasses);
     $(this.elems.wrapper).remove();
   }
 
@@ -343,14 +345,14 @@ class Chocolat {
   }
 
   markup() {
-    this.elems.domContainer.addClass('chocolat-open ' + this.settings.className);
+    $(this.elems.domContainer)[0].classList.add('chocolat-open', this.settings.className);
 
     if (this.settings.imageSize == 'cover') {
-      this.elems.domContainer.addClass('chocolat-cover');
+      $(this.elems.domContainer)[0].classList.add('chocolat-cover');
     }
 
     if (this.settings.container !== window) {
-      this.elems.domContainer.addClass('chocolat-in-container');
+      $(this.elems.domContainer)[0].classList.add('chocolat-in-container');
     }
 
     this.elems.wrapper = document.createElement('div');
@@ -562,9 +564,9 @@ class Chocolat {
     var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
     if (isImageZoomable && !isImageStretched) {
-      this.elems.domContainer.addClass('chocolat-zoomable');
+      $(this.elems.domContainer)[0].classList.add('chocolat-zoomable');
     } else {
-      this.elems.domContainer.removeClass('chocolat-zoomable');
+      $(this.elems.domContainer)[0].classList.remove('chocolat-zoomable');
     }
   }
 
@@ -576,7 +578,7 @@ class Chocolat {
     event.pageY = e.pageY;
     event.duration = this.settings.duration;
     $(this.elems.wrapper).trigger(event);
-    this.elems.domContainer.addClass('chocolat-zoomed');
+    $(this.elems.domContainer)[0].classList.add('chocolat-zoomed');
     const {
       width,
       height,
@@ -597,7 +599,7 @@ class Chocolat {
     $(this.elems.img).animate({
       margin: 0
     }, duration);
-    this.elems.domContainer.removeClass('chocolat-zoomed');
+    $(this.elems.domContainer)[0].classList.remove('chocolat-zoomed');
     const {
       width,
       height,
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 11f4d24..b5bd1fa 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -2,7 +2,7 @@ const defaults = {
   container: window,
   // window or jquery object or jquery selector, or element
   imageSelector: '.chocolat-image',
-  className: '',
+  className: undefined,
   imageSize: 'default',
   // 'default', 'contain', 'cover' or 'native'
   initialZoomState: null,
@@ -132,7 +132,7 @@ class Chocolat {
 
     $(this.elems.overlay).fadeIn(this.settings.duration);
     $(this.elems.wrapper).fadeIn(this.settings.duration);
-    this.elems.domContainer.addClass('chocolat-open');
+    $(this.elems.domContainer)[0].classList.add('chocolat-open');
     this.settings.timer = setTimeout(() => {
       if (typeof this.elems != 'undefined') {
         $(this.elems.loader).fadeIn();
@@ -254,23 +254,25 @@ class Chocolat {
 
   arrows() {
     if (this.settings.loop) {
-      $([this.elems.left, this.elems.right]).addClass('active');
+      this.elems.left.classList.add('active');
+      this.elems.right.classList.add('active');
     } else if (this.settings.linkImages) {
       // right
       if (this.settings.currentImage == this.settings.lastImage) {
-        $(this.elems.right).removeClass('active');
+        this.elems.right.classList.remove('active');
       } else {
-        $(this.elems.right).addClass('active');
+        this.elems.right.classList.add('active');
       } // left
 
 
       if (this.settings.currentImage === 0) {
-        $(this.elems.left).removeClass('active');
+        this.elems.left.classList.remove('active');
       } else {
-        $(this.elems.left).addClass('active');
+        this.elems.left.classList.add('active');
       }
     } else {
-      $([this.elems.left, this.elems.right]).removeClass('active');
+      this.elems.left.classList.remove('active');
+      this.elems.right.classList.remove('active');
     }
   }
 
@@ -303,7 +305,7 @@ class Chocolat {
 
     var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
     var def = $.when($(els).fadeOut(200)).then(() => {
-      this.elems.domContainer.removeClass('chocolat-open');
+      $(this.elems.domContainer)[0].classList.remove('chocolat-open');
     });
     this.settings.currentImage = false;
     return def;
@@ -326,7 +328,7 @@ class Chocolat {
 
     this.settings.currentImage = false;
     this.settings.initialized = false;
-    this.elems.domContainer.removeClass(this._cssClasses.join(' '));
+    $(this.elems.domContainer)[0].classList.remove(...this._cssClasses);
     $(this.elems.wrapper).remove();
   }
 
@@ -341,14 +343,14 @@ class Chocolat {
   }
 
   markup() {
-    this.elems.domContainer.addClass('chocolat-open ' + this.settings.className);
+    $(this.elems.domContainer)[0].classList.add('chocolat-open', this.settings.className);
 
     if (this.settings.imageSize == 'cover') {
-      this.elems.domContainer.addClass('chocolat-cover');
+      $(this.elems.domContainer)[0].classList.add('chocolat-cover');
     }
 
     if (this.settings.container !== window) {
-      this.elems.domContainer.addClass('chocolat-in-container');
+      $(this.elems.domContainer)[0].classList.add('chocolat-in-container');
     }
 
     this.elems.wrapper = document.createElement('div');
@@ -560,9 +562,9 @@ class Chocolat {
     var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
     if (isImageZoomable && !isImageStretched) {
-      this.elems.domContainer.addClass('chocolat-zoomable');
+      $(this.elems.domContainer)[0].classList.add('chocolat-zoomable');
     } else {
-      this.elems.domContainer.removeClass('chocolat-zoomable');
+      $(this.elems.domContainer)[0].classList.remove('chocolat-zoomable');
     }
   }
 
@@ -574,7 +576,7 @@ class Chocolat {
     event.pageY = e.pageY;
     event.duration = this.settings.duration;
     $(this.elems.wrapper).trigger(event);
-    this.elems.domContainer.addClass('chocolat-zoomed');
+    $(this.elems.domContainer)[0].classList.add('chocolat-zoomed');
     const {
       width,
       height,
@@ -595,7 +597,7 @@ class Chocolat {
     $(this.elems.img).animate({
       margin: 0
     }, duration);
-    this.elems.domContainer.removeClass('chocolat-zoomed');
+    $(this.elems.domContainer)[0].classList.remove('chocolat-zoomed');
     const {
       width,
       height,
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 1f05d01..4f32740 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -5,7 +5,7 @@
       container: window,
       // window or jquery object or jquery selector, or element
       imageSelector: '.chocolat-image',
-      className: '',
+      className: undefined,
       imageSize: 'default',
       // 'default', 'contain', 'cover' or 'native'
       initialZoomState: null,
@@ -135,7 +135,7 @@
 
         $(this.elems.overlay).fadeIn(this.settings.duration);
         $(this.elems.wrapper).fadeIn(this.settings.duration);
-        this.elems.domContainer.addClass('chocolat-open');
+        $(this.elems.domContainer)[0].classList.add('chocolat-open');
         this.settings.timer = setTimeout(() => {
           if (typeof this.elems != 'undefined') {
             $(this.elems.loader).fadeIn();
@@ -257,23 +257,25 @@
 
       arrows() {
         if (this.settings.loop) {
-          $([this.elems.left, this.elems.right]).addClass('active');
+          this.elems.left.classList.add('active');
+          this.elems.right.classList.add('active');
         } else if (this.settings.linkImages) {
           // right
           if (this.settings.currentImage == this.settings.lastImage) {
-            $(this.elems.right).removeClass('active');
+            this.elems.right.classList.remove('active');
           } else {
-            $(this.elems.right).addClass('active');
+            this.elems.right.classList.add('active');
           } // left
 
 
           if (this.settings.currentImage === 0) {
-            $(this.elems.left).removeClass('active');
+            this.elems.left.classList.remove('active');
           } else {
-            $(this.elems.left).addClass('active');
+            this.elems.left.classList.add('active');
           }
         } else {
-          $([this.elems.left, this.elems.right]).removeClass('active');
+          this.elems.left.classList.remove('active');
+          this.elems.right.classList.remove('active');
         }
       }
 
@@ -306,7 +308,7 @@
 
         var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
         var def = $.when($(els).fadeOut(200)).then(() => {
-          this.elems.domContainer.removeClass('chocolat-open');
+          $(this.elems.domContainer)[0].classList.remove('chocolat-open');
         });
         this.settings.currentImage = false;
         return def;
@@ -329,7 +331,7 @@
 
         this.settings.currentImage = false;
         this.settings.initialized = false;
-        this.elems.domContainer.removeClass(this._cssClasses.join(' '));
+        $(this.elems.domContainer)[0].classList.remove(...this._cssClasses);
         $(this.elems.wrapper).remove();
       }
 
@@ -344,14 +346,14 @@
       }
 
       markup() {
-        this.elems.domContainer.addClass('chocolat-open ' + this.settings.className);
+        $(this.elems.domContainer)[0].classList.add('chocolat-open', this.settings.className);
 
         if (this.settings.imageSize == 'cover') {
-          this.elems.domContainer.addClass('chocolat-cover');
+          $(this.elems.domContainer)[0].classList.add('chocolat-cover');
         }
 
         if (this.settings.container !== window) {
-          this.elems.domContainer.addClass('chocolat-in-container');
+          $(this.elems.domContainer)[0].classList.add('chocolat-in-container');
         }
 
         this.elems.wrapper = document.createElement('div');
@@ -563,9 +565,9 @@
         var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
         if (isImageZoomable && !isImageStretched) {
-          this.elems.domContainer.addClass('chocolat-zoomable');
+          $(this.elems.domContainer)[0].classList.add('chocolat-zoomable');
         } else {
-          this.elems.domContainer.removeClass('chocolat-zoomable');
+          $(this.elems.domContainer)[0].classList.remove('chocolat-zoomable');
         }
       }
 
@@ -577,7 +579,7 @@
         event.pageY = e.pageY;
         event.duration = this.settings.duration;
         $(this.elems.wrapper).trigger(event);
-        this.elems.domContainer.addClass('chocolat-zoomed');
+        $(this.elems.domContainer)[0].classList.add('chocolat-zoomed');
         const {
           width,
           height,
@@ -598,7 +600,7 @@
         $(this.elems.img).animate({
           margin: 0
         }, duration);
-        this.elems.domContainer.removeClass('chocolat-zoomed');
+        $(this.elems.domContainer)[0].classList.remove('chocolat-zoomed');
         const {
           width,
           height,
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index dd79708..e28bd89 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -1,7 +1,7 @@
 export const defaults = {
     container: window, // window or jquery object or jquery selector, or element
     imageSelector: '.chocolat-image',
-    className: '',
+    className: undefined,
     imageSize: 'default', // 'default', 'contain', 'cover' or 'native'
     initialZoomState: null,
     fullScreen: false,
@@ -139,7 +139,7 @@ export class Chocolat {
 
         $(this.elems.overlay).fadeIn(this.settings.duration)
         $(this.elems.wrapper).fadeIn(this.settings.duration)
-        this.elems.domContainer.addClass('chocolat-open')
+        $(this.elems.domContainer)[0].classList.add('chocolat-open')
 
         this.settings.timer = setTimeout(() => {
             if (typeof this.elems != 'undefined') {
@@ -278,22 +278,24 @@ export class Chocolat {
 
     arrows() {
         if (this.settings.loop) {
-            $([this.elems.left, this.elems.right]).addClass('active')
+            this.elems.left.classList.add('active')
+            this.elems.right.classList.add('active')
         } else if (this.settings.linkImages) {
             // right
             if (this.settings.currentImage == this.settings.lastImage) {
-                $(this.elems.right).removeClass('active')
+                this.elems.right.classList.remove('active')
             } else {
-                $(this.elems.right).addClass('active')
+                this.elems.right.classList.add('active')
             }
             // left
             if (this.settings.currentImage === 0) {
-                $(this.elems.left).removeClass('active')
+                this.elems.left.classList.remove('active')
             } else {
-                $(this.elems.left).addClass('active')
+                this.elems.left.classList.add('active')
             }
         } else {
-            $([this.elems.left, this.elems.right]).removeClass('active')
+            this.elems.left.classList.remove('active')
+            this.elems.right.classList.remove('active')
         }
     }
 
@@ -326,7 +328,7 @@ export class Chocolat {
 
         var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper]
         var def = $.when($(els).fadeOut(200)).then(() => {
-            this.elems.domContainer.removeClass('chocolat-open')
+            $(this.elems.domContainer)[0].classList.remove('chocolat-open')
         })
         this.settings.currentImage = false
 
@@ -350,7 +352,8 @@ export class Chocolat {
         }
         this.settings.currentImage = false
         this.settings.initialized = false
-        this.elems.domContainer.removeClass(this._cssClasses.join(' '))
+
+        $(this.elems.domContainer)[0].classList.remove(...this._cssClasses)
         $(this.elems.wrapper).remove()
     }
 
@@ -365,12 +368,12 @@ export class Chocolat {
     }
 
     markup() {
-        this.elems.domContainer.addClass('chocolat-open ' + this.settings.className)
+        $(this.elems.domContainer)[0].classList.add('chocolat-open', this.settings.className)
         if (this.settings.imageSize == 'cover') {
-            this.elems.domContainer.addClass('chocolat-cover')
+            $(this.elems.domContainer)[0].classList.add('chocolat-cover')
         }
         if (this.settings.container !== window) {
-            this.elems.domContainer.addClass('chocolat-in-container')
+            $(this.elems.domContainer)[0].classList.add('chocolat-in-container')
         }
 
         this.elems.wrapper = document.createElement('div')
@@ -615,9 +618,9 @@ export class Chocolat {
             this.elems.img.clientHeight > currentImage.height
 
         if (isImageZoomable && !isImageStretched) {
-            this.elems.domContainer.addClass('chocolat-zoomable')
+            $(this.elems.domContainer)[0].classList.add('chocolat-zoomable')
         } else {
-            this.elems.domContainer.removeClass('chocolat-zoomable')
+            $(this.elems.domContainer)[0].classList.remove('chocolat-zoomable')
         }
     }
 
@@ -630,8 +633,7 @@ export class Chocolat {
         event.pageY = e.pageY
         event.duration = this.settings.duration
         $(this.elems.wrapper).trigger(event)
-
-        this.elems.domContainer.addClass('chocolat-zoomed')
+        $(this.elems.domContainer)[0].classList.add('chocolat-zoomed')
         const { width, height, left, top } = this.fit(
             this.settings.currentImage,
             this.elems.wrapper
@@ -650,7 +652,7 @@ export class Chocolat {
         this.settings.initialZoomState = null
         $(this.elems.img).animate({ margin: 0 }, duration)
 
-        this.elems.domContainer.removeClass('chocolat-zoomed')
+        $(this.elems.domContainer)[0].classList.remove('chocolat-zoomed')
         const { width, height, left, top } = this.fit(
             this.settings.currentImage,
             this.elems.wrapper

From 47cdde77447299ad397824f85d3802a2798c6867 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 24 Dec 2018 10:35:18 +0100
Subject: [PATCH 11/65] un-jquery-wrapped domContainer

---
 dist/js/chocolat.cjs.js  | 28 ++++++++++++++--------------
 dist/js/chocolat.esm.js  | 28 ++++++++++++++--------------
 dist/js/chocolat.iife.js | 28 ++++++++++++++--------------
 src/js/chocolat.js       | 28 ++++++++++++++--------------
 test/test.js             | 16 ++++++++--------
 5 files changed, 64 insertions(+), 64 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 3ee9d56..620cf3f 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -134,7 +134,7 @@ class Chocolat {
 
     $(this.elems.overlay).fadeIn(this.settings.duration);
     $(this.elems.wrapper).fadeIn(this.settings.duration);
-    $(this.elems.domContainer)[0].classList.add('chocolat-open');
+    this.elems.domContainer.classList.add('chocolat-open');
     this.settings.timer = setTimeout(() => {
       if (typeof this.elems != 'undefined') {
         $(this.elems.loader).fadeIn();
@@ -307,7 +307,7 @@ class Chocolat {
 
     var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
     var def = $.when($(els).fadeOut(200)).then(() => {
-      $(this.elems.domContainer)[0].classList.remove('chocolat-open');
+      this.elems.domContainer.classList.remove('chocolat-open');
     });
     this.settings.currentImage = false;
     return def;
@@ -330,7 +330,7 @@ class Chocolat {
 
     this.settings.currentImage = false;
     this.settings.initialized = false;
-    $(this.elems.domContainer)[0].classList.remove(...this._cssClasses);
+    this.elems.domContainer.classList.remove(...this._cssClasses);
     $(this.elems.wrapper).remove();
   }
 
@@ -345,20 +345,20 @@ class Chocolat {
   }
 
   markup() {
-    $(this.elems.domContainer)[0].classList.add('chocolat-open', this.settings.className);
+    this.elems.domContainer.classList.add('chocolat-open', this.settings.className);
 
     if (this.settings.imageSize == 'cover') {
-      $(this.elems.domContainer)[0].classList.add('chocolat-cover');
+      this.elems.domContainer.classList.add('chocolat-cover');
     }
 
     if (this.settings.container !== window) {
-      $(this.elems.domContainer)[0].classList.add('chocolat-in-container');
+      this.elems.domContainer.classList.add('chocolat-in-container');
     }
 
     this.elems.wrapper = document.createElement('div');
     this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
     this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
-    this.elems.domContainer[0].appendChild(this.elems.wrapper);
+    this.elems.domContainer.appendChild(this.elems.wrapper);
     this.elems.overlay = document.createElement('div');
     this.elems.overlay.setAttribute('class', 'chocolat-overlay');
     this.elems.wrapper.appendChild(this.elems.overlay);
@@ -490,7 +490,7 @@ class Chocolat {
     const img = this.elems.wrapper.querySelector('.chocolat-img');
     this.off(img, 'click.chocolat');
     this.on(img, 'click.chocolat', e => {
-      if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
+      if (this.settings.initialZoomState === null && this.elems.domContainer.classList.contains('chocolat-zoomable')) {
         e.stopPropagation();
         this.zoomIn(e);
       }
@@ -564,9 +564,9 @@ class Chocolat {
     var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
     if (isImageZoomable && !isImageStretched) {
-      $(this.elems.domContainer)[0].classList.add('chocolat-zoomable');
+      this.elems.domContainer.classList.add('chocolat-zoomable');
     } else {
-      $(this.elems.domContainer)[0].classList.remove('chocolat-zoomable');
+      this.elems.domContainer.classList.remove('chocolat-zoomable');
     }
   }
 
@@ -578,7 +578,7 @@ class Chocolat {
     event.pageY = e.pageY;
     event.duration = this.settings.duration;
     $(this.elems.wrapper).trigger(event);
-    $(this.elems.domContainer)[0].classList.add('chocolat-zoomed');
+    this.elems.domContainer.classList.add('chocolat-zoomed');
     const {
       width,
       height,
@@ -599,7 +599,7 @@ class Chocolat {
     $(this.elems.img).animate({
       margin: 0
     }, duration);
-    $(this.elems.domContainer)[0].classList.remove('chocolat-zoomed');
+    this.elems.domContainer.classList.remove('chocolat-zoomed');
     const {
       width,
       height,
@@ -613,9 +613,9 @@ class Chocolat {
     // if container == window
     // domContainer = body
     if (this.settings.container === window) {
-      this.elems.domContainer = $('body');
+      this.elems.domContainer = document.body;
     } else {
-      this.elems.domContainer = $(this.settings.container);
+      this.elems.domContainer = this.settings.container;
     }
   }
 
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index b5bd1fa..e62aad6 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -132,7 +132,7 @@ class Chocolat {
 
     $(this.elems.overlay).fadeIn(this.settings.duration);
     $(this.elems.wrapper).fadeIn(this.settings.duration);
-    $(this.elems.domContainer)[0].classList.add('chocolat-open');
+    this.elems.domContainer.classList.add('chocolat-open');
     this.settings.timer = setTimeout(() => {
       if (typeof this.elems != 'undefined') {
         $(this.elems.loader).fadeIn();
@@ -305,7 +305,7 @@ class Chocolat {
 
     var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
     var def = $.when($(els).fadeOut(200)).then(() => {
-      $(this.elems.domContainer)[0].classList.remove('chocolat-open');
+      this.elems.domContainer.classList.remove('chocolat-open');
     });
     this.settings.currentImage = false;
     return def;
@@ -328,7 +328,7 @@ class Chocolat {
 
     this.settings.currentImage = false;
     this.settings.initialized = false;
-    $(this.elems.domContainer)[0].classList.remove(...this._cssClasses);
+    this.elems.domContainer.classList.remove(...this._cssClasses);
     $(this.elems.wrapper).remove();
   }
 
@@ -343,20 +343,20 @@ class Chocolat {
   }
 
   markup() {
-    $(this.elems.domContainer)[0].classList.add('chocolat-open', this.settings.className);
+    this.elems.domContainer.classList.add('chocolat-open', this.settings.className);
 
     if (this.settings.imageSize == 'cover') {
-      $(this.elems.domContainer)[0].classList.add('chocolat-cover');
+      this.elems.domContainer.classList.add('chocolat-cover');
     }
 
     if (this.settings.container !== window) {
-      $(this.elems.domContainer)[0].classList.add('chocolat-in-container');
+      this.elems.domContainer.classList.add('chocolat-in-container');
     }
 
     this.elems.wrapper = document.createElement('div');
     this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
     this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
-    this.elems.domContainer[0].appendChild(this.elems.wrapper);
+    this.elems.domContainer.appendChild(this.elems.wrapper);
     this.elems.overlay = document.createElement('div');
     this.elems.overlay.setAttribute('class', 'chocolat-overlay');
     this.elems.wrapper.appendChild(this.elems.overlay);
@@ -488,7 +488,7 @@ class Chocolat {
     const img = this.elems.wrapper.querySelector('.chocolat-img');
     this.off(img, 'click.chocolat');
     this.on(img, 'click.chocolat', e => {
-      if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
+      if (this.settings.initialZoomState === null && this.elems.domContainer.classList.contains('chocolat-zoomable')) {
         e.stopPropagation();
         this.zoomIn(e);
       }
@@ -562,9 +562,9 @@ class Chocolat {
     var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
     if (isImageZoomable && !isImageStretched) {
-      $(this.elems.domContainer)[0].classList.add('chocolat-zoomable');
+      this.elems.domContainer.classList.add('chocolat-zoomable');
     } else {
-      $(this.elems.domContainer)[0].classList.remove('chocolat-zoomable');
+      this.elems.domContainer.classList.remove('chocolat-zoomable');
     }
   }
 
@@ -576,7 +576,7 @@ class Chocolat {
     event.pageY = e.pageY;
     event.duration = this.settings.duration;
     $(this.elems.wrapper).trigger(event);
-    $(this.elems.domContainer)[0].classList.add('chocolat-zoomed');
+    this.elems.domContainer.classList.add('chocolat-zoomed');
     const {
       width,
       height,
@@ -597,7 +597,7 @@ class Chocolat {
     $(this.elems.img).animate({
       margin: 0
     }, duration);
-    $(this.elems.domContainer)[0].classList.remove('chocolat-zoomed');
+    this.elems.domContainer.classList.remove('chocolat-zoomed');
     const {
       width,
       height,
@@ -611,9 +611,9 @@ class Chocolat {
     // if container == window
     // domContainer = body
     if (this.settings.container === window) {
-      this.elems.domContainer = $('body');
+      this.elems.domContainer = document.body;
     } else {
-      this.elems.domContainer = $(this.settings.container);
+      this.elems.domContainer = this.settings.container;
     }
   }
 
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 4f32740..80d4b78 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -135,7 +135,7 @@
 
         $(this.elems.overlay).fadeIn(this.settings.duration);
         $(this.elems.wrapper).fadeIn(this.settings.duration);
-        $(this.elems.domContainer)[0].classList.add('chocolat-open');
+        this.elems.domContainer.classList.add('chocolat-open');
         this.settings.timer = setTimeout(() => {
           if (typeof this.elems != 'undefined') {
             $(this.elems.loader).fadeIn();
@@ -308,7 +308,7 @@
 
         var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
         var def = $.when($(els).fadeOut(200)).then(() => {
-          $(this.elems.domContainer)[0].classList.remove('chocolat-open');
+          this.elems.domContainer.classList.remove('chocolat-open');
         });
         this.settings.currentImage = false;
         return def;
@@ -331,7 +331,7 @@
 
         this.settings.currentImage = false;
         this.settings.initialized = false;
-        $(this.elems.domContainer)[0].classList.remove(...this._cssClasses);
+        this.elems.domContainer.classList.remove(...this._cssClasses);
         $(this.elems.wrapper).remove();
       }
 
@@ -346,20 +346,20 @@
       }
 
       markup() {
-        $(this.elems.domContainer)[0].classList.add('chocolat-open', this.settings.className);
+        this.elems.domContainer.classList.add('chocolat-open', this.settings.className);
 
         if (this.settings.imageSize == 'cover') {
-          $(this.elems.domContainer)[0].classList.add('chocolat-cover');
+          this.elems.domContainer.classList.add('chocolat-cover');
         }
 
         if (this.settings.container !== window) {
-          $(this.elems.domContainer)[0].classList.add('chocolat-in-container');
+          this.elems.domContainer.classList.add('chocolat-in-container');
         }
 
         this.elems.wrapper = document.createElement('div');
         this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
         this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
-        this.elems.domContainer[0].appendChild(this.elems.wrapper);
+        this.elems.domContainer.appendChild(this.elems.wrapper);
         this.elems.overlay = document.createElement('div');
         this.elems.overlay.setAttribute('class', 'chocolat-overlay');
         this.elems.wrapper.appendChild(this.elems.overlay);
@@ -491,7 +491,7 @@
         const img = this.elems.wrapper.querySelector('.chocolat-img');
         this.off(img, 'click.chocolat');
         this.on(img, 'click.chocolat', e => {
-          if (this.settings.initialZoomState === null && this.elems.domContainer.hasClass('chocolat-zoomable')) {
+          if (this.settings.initialZoomState === null && this.elems.domContainer.classList.contains('chocolat-zoomable')) {
             e.stopPropagation();
             this.zoomIn(e);
           }
@@ -565,9 +565,9 @@
         var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
 
         if (isImageZoomable && !isImageStretched) {
-          $(this.elems.domContainer)[0].classList.add('chocolat-zoomable');
+          this.elems.domContainer.classList.add('chocolat-zoomable');
         } else {
-          $(this.elems.domContainer)[0].classList.remove('chocolat-zoomable');
+          this.elems.domContainer.classList.remove('chocolat-zoomable');
         }
       }
 
@@ -579,7 +579,7 @@
         event.pageY = e.pageY;
         event.duration = this.settings.duration;
         $(this.elems.wrapper).trigger(event);
-        $(this.elems.domContainer)[0].classList.add('chocolat-zoomed');
+        this.elems.domContainer.classList.add('chocolat-zoomed');
         const {
           width,
           height,
@@ -600,7 +600,7 @@
         $(this.elems.img).animate({
           margin: 0
         }, duration);
-        $(this.elems.domContainer)[0].classList.remove('chocolat-zoomed');
+        this.elems.domContainer.classList.remove('chocolat-zoomed');
         const {
           width,
           height,
@@ -614,9 +614,9 @@
         // if container == window
         // domContainer = body
         if (this.settings.container === window) {
-          this.elems.domContainer = $('body');
+          this.elems.domContainer = document.body;
         } else {
-          this.elems.domContainer = $(this.settings.container);
+          this.elems.domContainer = this.settings.container;
         }
       }
 
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index e28bd89..ceecf4d 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -139,7 +139,7 @@ export class Chocolat {
 
         $(this.elems.overlay).fadeIn(this.settings.duration)
         $(this.elems.wrapper).fadeIn(this.settings.duration)
-        $(this.elems.domContainer)[0].classList.add('chocolat-open')
+        this.elems.domContainer.classList.add('chocolat-open')
 
         this.settings.timer = setTimeout(() => {
             if (typeof this.elems != 'undefined') {
@@ -328,7 +328,7 @@ export class Chocolat {
 
         var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper]
         var def = $.when($(els).fadeOut(200)).then(() => {
-            $(this.elems.domContainer)[0].classList.remove('chocolat-open')
+            this.elems.domContainer.classList.remove('chocolat-open')
         })
         this.settings.currentImage = false
 
@@ -353,7 +353,7 @@ export class Chocolat {
         this.settings.currentImage = false
         this.settings.initialized = false
 
-        $(this.elems.domContainer)[0].classList.remove(...this._cssClasses)
+        this.elems.domContainer.classList.remove(...this._cssClasses)
         $(this.elems.wrapper).remove()
     }
 
@@ -368,18 +368,18 @@ export class Chocolat {
     }
 
     markup() {
-        $(this.elems.domContainer)[0].classList.add('chocolat-open', this.settings.className)
+        this.elems.domContainer.classList.add('chocolat-open', this.settings.className)
         if (this.settings.imageSize == 'cover') {
-            $(this.elems.domContainer)[0].classList.add('chocolat-cover')
+            this.elems.domContainer.classList.add('chocolat-cover')
         }
         if (this.settings.container !== window) {
-            $(this.elems.domContainer)[0].classList.add('chocolat-in-container')
+            this.elems.domContainer.classList.add('chocolat-in-container')
         }
 
         this.elems.wrapper = document.createElement('div')
         this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex)
         this.elems.wrapper.setAttribute('class', 'chocolat-wrapper')
-        this.elems.domContainer[0].appendChild(this.elems.wrapper)
+        this.elems.domContainer.appendChild(this.elems.wrapper)
 
         this.elems.overlay = document.createElement('div')
         this.elems.overlay.setAttribute('class', 'chocolat-overlay')
@@ -532,7 +532,7 @@ export class Chocolat {
         this.on(img, 'click.chocolat', (e) => {
             if (
                 this.settings.initialZoomState === null &&
-                this.elems.domContainer.hasClass('chocolat-zoomable')
+                this.elems.domContainer.classList.contains('chocolat-zoomable')
             ) {
                 e.stopPropagation()
                 this.zoomIn(e)
@@ -618,9 +618,9 @@ export class Chocolat {
             this.elems.img.clientHeight > currentImage.height
 
         if (isImageZoomable && !isImageStretched) {
-            $(this.elems.domContainer)[0].classList.add('chocolat-zoomable')
+            this.elems.domContainer.classList.add('chocolat-zoomable')
         } else {
-            $(this.elems.domContainer)[0].classList.remove('chocolat-zoomable')
+            this.elems.domContainer.classList.remove('chocolat-zoomable')
         }
     }
 
@@ -633,7 +633,7 @@ export class Chocolat {
         event.pageY = e.pageY
         event.duration = this.settings.duration
         $(this.elems.wrapper).trigger(event)
-        $(this.elems.domContainer)[0].classList.add('chocolat-zoomed')
+        this.elems.domContainer.classList.add('chocolat-zoomed')
         const { width, height, left, top } = this.fit(
             this.settings.currentImage,
             this.elems.wrapper
@@ -652,7 +652,7 @@ export class Chocolat {
         this.settings.initialZoomState = null
         $(this.elems.img).animate({ margin: 0 }, duration)
 
-        $(this.elems.domContainer)[0].classList.remove('chocolat-zoomed')
+        this.elems.domContainer.classList.remove('chocolat-zoomed')
         const { width, height, left, top } = this.fit(
             this.settings.currentImage,
             this.elems.wrapper
@@ -664,9 +664,9 @@ export class Chocolat {
         // if container == window
         // domContainer = body
         if (this.settings.container === window) {
-            this.elems.domContainer = $('body')
+            this.elems.domContainer = document.body
         } else {
-            this.elems.domContainer = $(this.settings.container)
+            this.elems.domContainer = this.settings.container
         }
     }
 
diff --git a/test/test.js b/test/test.js
index 0c82407..07348c2 100644
--- a/test/test.js
+++ b/test/test.js
@@ -9,7 +9,7 @@ describe('Chocolat', function() {
             var chocolat = $('#example0')
                 .Chocolat({
                     loop: true,
-                    container: $('#container'),
+                    container: $('#container')[0],
                 })
                 .data('chocolat')
 
@@ -42,7 +42,7 @@ describe('Chocolat', function() {
         it('should add css classes to parent when in container', function(done) {
             var chocolat = $('#example0')
                 .Chocolat({
-                    container: $('#container'),
+                    container: $('#container')[0],
                 })
                 .data('chocolat')
 
@@ -95,7 +95,7 @@ describe('Chocolat', function() {
             var chocolat = $('#example0')
                 .Chocolat({
                     loop: true,
-                    container: $('#container'),
+                    container: $('#container')[0],
                 })
                 .data('chocolat')
 
@@ -114,7 +114,7 @@ describe('Chocolat', function() {
             var chocolat = $('#example0')
                 .Chocolat({
                     loop: true,
-                    container: $('#container'),
+                    container: $('#container')[0],
                 })
                 .data('chocolat')
 
@@ -133,7 +133,7 @@ describe('Chocolat', function() {
             var chocolat = $('#example0')
                 .Chocolat({
                     loop: true,
-                    container: $('#container'),
+                    container: $('#container')[0],
                 })
                 .data('chocolat')
 
@@ -155,7 +155,7 @@ describe('Chocolat', function() {
             var chocolat = $('#example0')
                 .Chocolat({
                     loop: true,
-                    container: $('#container'),
+                    container: $('#container')[0],
                     afterMarkup: afterMarkup,
                 })
                 .data('chocolat')
@@ -525,7 +525,7 @@ describe('Chocolat', function() {
             var chocolat = $('#example0')
                 .Chocolat({
                     imageSize: 'cover',
-                    container: '#container',
+                    container: $('#container')[0],
                 })
                 .data('chocolat')
 
@@ -620,7 +620,7 @@ describe('Chocolat', function() {
             var chocolat = $('#example0')
                 .Chocolat({
                     imageSize: 'contain',
-                    container: '#container',
+                    container: $('#container')[0],
                 })
                 .data('chocolat')
 

From acc4951ce6f5cf873ca3d8c5ca11ec3c0597d847 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 25 Dec 2018 10:17:18 +0100
Subject: [PATCH 12/65] Always pass a element for container option

---
 dist/index.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/dist/index.html b/dist/index.html
index 0de91c5..d888ca8 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -40,13 +40,13 @@
                 });
 
                 $('#example2').Chocolat({
-                    container      : '#container1',
+                    container      : $('#container1')[0],
                     imageSize     : 'contain',
                     loop           : true,
                 })
 
                 $('#example3').Chocolat({
-                    container      : '#container2',
+                    container      : $('#container2')[0],
                     imageSize     : 'cover',
                 })
             });
@@ -150,7 +150,7 @@ <h2>
                         {src : 'demo-images/8.jpg', title : 'caption 3'},
                     ],
                     imageSize : 'contain',
-                    container : '#container3',
+                    container : $('#container3')[0],
                     afterMarkup: function () {
                         console.log('afterMarkup hook is called')
                     },

From 0a34f59a6f268ed7e7505215d31864deb8eeecc2 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 25 Dec 2018 11:11:52 +0100
Subject: [PATCH 13/65] First attempt at using css transitino insteand of
 jquery for openning and closing animations

---
 dist/css/chocolat.css    | 21 ++++++++++++++++++---
 dist/js/chocolat.cjs.js  | 37 +++++++++++++++++++++++++------------
 dist/js/chocolat.esm.js  | 37 +++++++++++++++++++++++++------------
 dist/js/chocolat.iife.js | 37 +++++++++++++++++++++++++------------
 src/css/chocolat.css     | 21 ++++++++++++++++++---
 src/js/chocolat.js       | 39 +++++++++++++++++++++++++++------------
 6 files changed, 138 insertions(+), 54 deletions(-)

diff --git a/dist/css/chocolat.css b/dist/css/chocolat.css
index 7c8ae1e..55adeb8 100644
--- a/dist/css/chocolat.css
+++ b/dist/css/chocolat.css
@@ -5,6 +5,7 @@
     overflow: hidden;
 }
 .chocolat-overlay{
+    transition: opacity 1s ease, visibility 0s 1s ease;
     height:100%;
     width:100%;
     position:fixed;
@@ -12,19 +13,33 @@
     top:0;
     z-index:10;
     background-color:#fff;
-    display: none;
+    visibility: hidden;
+    opacity: 0;
+}
+.chocolat-overlay.chocolat-visible{
+    transition: opacity 1s, visibility 0s;
+    visibility: visible;
     opacity: 0.8;
 }
+
 .chocolat-wrapper{
-    height:100%;
+    transition: opacity 1s ease, visibility 0s 1s ease;
     width:100%;
+    height: 100%;
     position:fixed;
-    display: none;
+    opacity: 0;
     left:0;
     top:0;
     z-index:16;
     color: #fff;
+    visibility: hidden;
 }
+.chocolat-wrapper.chocolat-visible{
+    transition: opacity 1s, visibility 0s;
+    opacity: 1;
+    visibility: visible;
+}
+
 .chocolat-zoomable .chocolat-img{
     cursor : zoom-in;
 }
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 620cf3f..298bfec 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -17,7 +17,7 @@ const defaults = {
   setIndex: 0,
   firstImage: 0,
   lastImage: false,
-  currentImage: false,
+  currentImage: undefined,
   initialized: false,
   timer: false,
   timerDebounce: false,
@@ -132,8 +132,10 @@ class Chocolat {
       return;
     }
 
-    $(this.elems.overlay).fadeIn(this.settings.duration);
-    $(this.elems.wrapper).fadeIn(this.settings.duration);
+    setTimeout(() => {
+      this.elems.overlay.classList.add('chocolat-visible');
+      this.elems.wrapper.classList.add('chocolat-visible');
+    });
     this.elems.domContainer.classList.add('chocolat-open');
     this.settings.timer = setTimeout(() => {
       if (typeof this.elems != 'undefined') {
@@ -305,16 +307,23 @@ class Chocolat {
       return;
     }
 
-    var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
-    var def = $.when($(els).fadeOut(200)).then(() => {
+    this.elems.overlay.classList.remove('chocolat-visible');
+    this.elems.loader.classList.remove('chocolat-visible');
+    this.elems.wrapper.classList.remove('chocolat-visible');
+    this.settings.currentImage = undefined; // todo
+
+    setTimeout(() => {
       this.elems.domContainer.classList.remove('chocolat-open');
-    });
-    this.settings.currentImage = false;
-    return def;
+    }, 1000);
+    return Promise.resolve(); // return $.when($(els).fadeOut(200)).then(() => {
+    //     this.elems.domContainer.classList.remove('chocolat-open')
+    // })
   }
 
   destroy() {
-    this.$element.removeData();
+    this.$element.removeData(); // todo remove all events ?
+
+    this.off(this.elems.wrapper, 'mousemove.chocolat');
     const imgs = this.element.querySelectorAll(this.settings.imageSelector);
     imgs.forEach((el, i) => {
       this.off(el, 'click.chocolat');
@@ -328,7 +337,7 @@ class Chocolat {
       this.exitFullScreen();
     }
 
-    this.settings.currentImage = false;
+    this.settings.currentImage = undefined;
     this.settings.initialized = false;
     this.elems.domContainer.classList.remove(...this._cssClasses);
     $(this.elems.wrapper).remove();
@@ -504,6 +513,10 @@ class Chocolat {
         return;
       }
 
+      if (this.settings.currentImage === undefined) {
+        return;
+      }
+
       var pos = $(this.elems.wrapper).offset();
       var height = $(this.elems.wrapper).height();
       var width = $(this.elems.wrapper).width();
@@ -539,7 +552,7 @@ class Chocolat {
       }
     });
     this.on(window, 'resize.chocolat', e => {
-      if (!this.settings.initialized || this.settings.currentImage === false) {
+      if (!this.settings.initialized || this.settings.currentImage === undefined) {
         return;
       }
 
@@ -589,7 +602,7 @@ class Chocolat {
   }
 
   zoomOut(e, duration) {
-    if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
+    if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
       return;
     }
 
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index e62aad6..f17339b 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -15,7 +15,7 @@ const defaults = {
   setIndex: 0,
   firstImage: 0,
   lastImage: false,
-  currentImage: false,
+  currentImage: undefined,
   initialized: false,
   timer: false,
   timerDebounce: false,
@@ -130,8 +130,10 @@ class Chocolat {
       return;
     }
 
-    $(this.elems.overlay).fadeIn(this.settings.duration);
-    $(this.elems.wrapper).fadeIn(this.settings.duration);
+    setTimeout(() => {
+      this.elems.overlay.classList.add('chocolat-visible');
+      this.elems.wrapper.classList.add('chocolat-visible');
+    });
     this.elems.domContainer.classList.add('chocolat-open');
     this.settings.timer = setTimeout(() => {
       if (typeof this.elems != 'undefined') {
@@ -303,16 +305,23 @@ class Chocolat {
       return;
     }
 
-    var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
-    var def = $.when($(els).fadeOut(200)).then(() => {
+    this.elems.overlay.classList.remove('chocolat-visible');
+    this.elems.loader.classList.remove('chocolat-visible');
+    this.elems.wrapper.classList.remove('chocolat-visible');
+    this.settings.currentImage = undefined; // todo
+
+    setTimeout(() => {
       this.elems.domContainer.classList.remove('chocolat-open');
-    });
-    this.settings.currentImage = false;
-    return def;
+    }, 1000);
+    return Promise.resolve(); // return $.when($(els).fadeOut(200)).then(() => {
+    //     this.elems.domContainer.classList.remove('chocolat-open')
+    // })
   }
 
   destroy() {
-    this.$element.removeData();
+    this.$element.removeData(); // todo remove all events ?
+
+    this.off(this.elems.wrapper, 'mousemove.chocolat');
     const imgs = this.element.querySelectorAll(this.settings.imageSelector);
     imgs.forEach((el, i) => {
       this.off(el, 'click.chocolat');
@@ -326,7 +335,7 @@ class Chocolat {
       this.exitFullScreen();
     }
 
-    this.settings.currentImage = false;
+    this.settings.currentImage = undefined;
     this.settings.initialized = false;
     this.elems.domContainer.classList.remove(...this._cssClasses);
     $(this.elems.wrapper).remove();
@@ -502,6 +511,10 @@ class Chocolat {
         return;
       }
 
+      if (this.settings.currentImage === undefined) {
+        return;
+      }
+
       var pos = $(this.elems.wrapper).offset();
       var height = $(this.elems.wrapper).height();
       var width = $(this.elems.wrapper).width();
@@ -537,7 +550,7 @@ class Chocolat {
       }
     });
     this.on(window, 'resize.chocolat', e => {
-      if (!this.settings.initialized || this.settings.currentImage === false) {
+      if (!this.settings.initialized || this.settings.currentImage === undefined) {
         return;
       }
 
@@ -587,7 +600,7 @@ class Chocolat {
   }
 
   zoomOut(e, duration) {
-    if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
+    if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
       return;
     }
 
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 80d4b78..23a967d 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -18,7 +18,7 @@
       setIndex: 0,
       firstImage: 0,
       lastImage: false,
-      currentImage: false,
+      currentImage: undefined,
       initialized: false,
       timer: false,
       timerDebounce: false,
@@ -133,8 +133,10 @@
           return;
         }
 
-        $(this.elems.overlay).fadeIn(this.settings.duration);
-        $(this.elems.wrapper).fadeIn(this.settings.duration);
+        setTimeout(() => {
+          this.elems.overlay.classList.add('chocolat-visible');
+          this.elems.wrapper.classList.add('chocolat-visible');
+        });
         this.elems.domContainer.classList.add('chocolat-open');
         this.settings.timer = setTimeout(() => {
           if (typeof this.elems != 'undefined') {
@@ -306,16 +308,23 @@
           return;
         }
 
-        var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper];
-        var def = $.when($(els).fadeOut(200)).then(() => {
+        this.elems.overlay.classList.remove('chocolat-visible');
+        this.elems.loader.classList.remove('chocolat-visible');
+        this.elems.wrapper.classList.remove('chocolat-visible');
+        this.settings.currentImage = undefined; // todo
+
+        setTimeout(() => {
           this.elems.domContainer.classList.remove('chocolat-open');
-        });
-        this.settings.currentImage = false;
-        return def;
+        }, 1000);
+        return Promise.resolve(); // return $.when($(els).fadeOut(200)).then(() => {
+        //     this.elems.domContainer.classList.remove('chocolat-open')
+        // })
       }
 
       destroy() {
-        this.$element.removeData();
+        this.$element.removeData(); // todo remove all events ?
+
+        this.off(this.elems.wrapper, 'mousemove.chocolat');
         const imgs = this.element.querySelectorAll(this.settings.imageSelector);
         imgs.forEach((el, i) => {
           this.off(el, 'click.chocolat');
@@ -329,7 +338,7 @@
           this.exitFullScreen();
         }
 
-        this.settings.currentImage = false;
+        this.settings.currentImage = undefined;
         this.settings.initialized = false;
         this.elems.domContainer.classList.remove(...this._cssClasses);
         $(this.elems.wrapper).remove();
@@ -505,6 +514,10 @@
             return;
           }
 
+          if (this.settings.currentImage === undefined) {
+            return;
+          }
+
           var pos = $(this.elems.wrapper).offset();
           var height = $(this.elems.wrapper).height();
           var width = $(this.elems.wrapper).width();
@@ -540,7 +553,7 @@
           }
         });
         this.on(window, 'resize.chocolat', e => {
-          if (!this.settings.initialized || this.settings.currentImage === false) {
+          if (!this.settings.initialized || this.settings.currentImage === undefined) {
             return;
           }
 
@@ -590,7 +603,7 @@
       }
 
       zoomOut(e, duration) {
-        if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
+        if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
           return;
         }
 
diff --git a/src/css/chocolat.css b/src/css/chocolat.css
index 7c8ae1e..55adeb8 100644
--- a/src/css/chocolat.css
+++ b/src/css/chocolat.css
@@ -5,6 +5,7 @@
     overflow: hidden;
 }
 .chocolat-overlay{
+    transition: opacity 1s ease, visibility 0s 1s ease;
     height:100%;
     width:100%;
     position:fixed;
@@ -12,19 +13,33 @@
     top:0;
     z-index:10;
     background-color:#fff;
-    display: none;
+    visibility: hidden;
+    opacity: 0;
+}
+.chocolat-overlay.chocolat-visible{
+    transition: opacity 1s, visibility 0s;
+    visibility: visible;
     opacity: 0.8;
 }
+
 .chocolat-wrapper{
-    height:100%;
+    transition: opacity 1s ease, visibility 0s 1s ease;
     width:100%;
+    height: 100%;
     position:fixed;
-    display: none;
+    opacity: 0;
     left:0;
     top:0;
     z-index:16;
     color: #fff;
+    visibility: hidden;
 }
+.chocolat-wrapper.chocolat-visible{
+    transition: opacity 1s, visibility 0s;
+    opacity: 1;
+    visibility: visible;
+}
+
 .chocolat-zoomable .chocolat-img{
     cursor : zoom-in;
 }
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index ceecf4d..9c05ea0 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -13,7 +13,7 @@ export const defaults = {
     setIndex: 0,
     firstImage: 0,
     lastImage: false,
-    currentImage: false,
+    currentImage: undefined,
     initialized: false,
     timer: false,
     timerDebounce: false,
@@ -137,8 +137,11 @@ export class Chocolat {
             return
         }
 
-        $(this.elems.overlay).fadeIn(this.settings.duration)
-        $(this.elems.wrapper).fadeIn(this.settings.duration)
+        setTimeout(() => {
+            this.elems.overlay.classList.add('chocolat-visible')
+            this.elems.wrapper.classList.add('chocolat-visible')
+        })
+
         this.elems.domContainer.classList.add('chocolat-open')
 
         this.settings.timer = setTimeout(() => {
@@ -326,17 +329,26 @@ export class Chocolat {
             return
         }
 
-        var els = [this.elems.overlay, this.elems.loader, this.elems.wrapper]
-        var def = $.when($(els).fadeOut(200)).then(() => {
-            this.elems.domContainer.classList.remove('chocolat-open')
-        })
-        this.settings.currentImage = false
+        this.elems.overlay.classList.remove('chocolat-visible')
+        this.elems.loader.classList.remove('chocolat-visible')
+        this.elems.wrapper.classList.remove('chocolat-visible')
 
-        return def
+        this.settings.currentImage = undefined
+
+        // todo
+        setTimeout(() => {
+            this.elems.domContainer.classList.remove('chocolat-open')
+        }, 1000)
+        return Promise.resolve()
+        // return $.when($(els).fadeOut(200)).then(() => {
+        //     this.elems.domContainer.classList.remove('chocolat-open')
+        // })
     }
 
     destroy() {
         this.$element.removeData()
+        // todo remove all events ?
+        this.off(this.elems.wrapper, 'mousemove.chocolat')
 
         const imgs = this.element.querySelectorAll(this.settings.imageSelector)
 
@@ -350,7 +362,7 @@ export class Chocolat {
         if (this.settings.fullscreenOpen) {
             this.exitFullScreen()
         }
-        this.settings.currentImage = false
+        this.settings.currentImage = undefined
         this.settings.initialized = false
 
         this.elems.domContainer.classList.remove(...this._cssClasses)
@@ -546,6 +558,9 @@ export class Chocolat {
             if ($(this.elems.img).is(':animated')) {
                 return
             }
+            if (this.settings.currentImage === undefined) {
+                return
+            }
 
             var pos = $(this.elems.wrapper).offset()
             var height = $(this.elems.wrapper).height()
@@ -588,7 +603,7 @@ export class Chocolat {
         })
 
         this.on(window, 'resize.chocolat', (e) => {
-            if (!this.settings.initialized || this.settings.currentImage === false) {
+            if (!this.settings.initialized || this.settings.currentImage === undefined) {
                 return
             }
             this.debounce(50, () => {
@@ -643,7 +658,7 @@ export class Chocolat {
     }
 
     zoomOut(e, duration) {
-        if (this.settings.initialZoomState === null || this.settings.currentImage === false) {
+        if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
             return
         }
         duration = duration || this.settings.duration

From e6db902174f4c399472741ed1e3aa592ffa342d5 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 25 Dec 2018 21:21:39 +0100
Subject: [PATCH 14/65] Removed jquery from instanciation

---
 dist/index.html          |  22 ++---
 dist/js/chocolat.cjs.js  |  38 +++-----
 dist/js/chocolat.esm.js  |  38 +++-----
 dist/js/chocolat.iife.js |  40 +++-----
 src/js/chocolat.js       |  21 +----
 src/js/main.esm.js       |  16 ++--
 src/js/main.iife.js      |  19 ++--
 test/test.js             | 197 +++++++++++++--------------------------
 8 files changed, 134 insertions(+), 257 deletions(-)

diff --git a/dist/index.html b/dist/index.html
index d888ca8..0c181ae 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -29,27 +29,27 @@
         <title>Chocolat — demo</title>
         <script>
             $(function(){
-                $('#example0').Chocolat({
+                Chocolat($('#example0')[0].querySelectorAll('.chocolat-image'), {
                     imageSize: 'contain'
-                });
+                })
 
-                $('#example1').Chocolat({
+                Chocolat($('#example1')[0].querySelectorAll('.chocolat-image'), {
                     loop           : true,
                     imageSize     : 'cover',
                     overlayOpacity : 0.9
-                });
+                })
 
-                $('#example2').Chocolat({
+                Chocolat($('#example2')[0].querySelectorAll('.chocolat-image'), {
                     container      : $('#container1')[0],
                     imageSize     : 'contain',
                     loop           : true,
                 })
 
-                $('#example3').Chocolat({
+                Chocolat($('#example3')[0].querySelectorAll('.chocolat-image'), {
                     container      : $('#container2')[0],
                     imageSize     : 'cover',
                 })
-            });
+            })
         </script>
     </head>
     <body>
@@ -88,7 +88,7 @@ <h2>
             Display in a container, cover, with thumbnails :
         </h2>
 
-        <div id="example3" data-chocolat-title="set title">
+        <div id="example3">
             <a class="chocolat-image" href="demo-images/3.jpg" title="Rose">
                 <img src="demo-images/3.jpg" style="width:75px; height:50px" alt="">
             </a>
@@ -106,7 +106,7 @@ <h2>
             Display in a container, looping :
         </h2>
 
-        <div id="example2" data-chocolat-title="set title">
+        <div id="example2">
             <a class="chocolat-image" href="demo-images/3.jpg" title="Rose">
                 A
             </a>
@@ -141,7 +141,7 @@ <h2>
 
         <script>
             $(function(){
-                var instance = $('#container3').Chocolat({
+                var instance = Chocolat([], {
                     setTitle : 'set title',
                     loop: true,
                     images : [
@@ -170,7 +170,7 @@ <h2>
                         // default to 0
                         return canvasHeight / 4;
                     }
-                }).data('chocolat');
+                });
 
                 $('.api-open').on('click', function(e) {
                     e.preventDefault()
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 298bfec..c2e2f75 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -3,7 +3,6 @@
 const defaults = {
   container: window,
   // window or jquery object or jquery selector, or element
-  imageSelector: '.chocolat-image',
   className: undefined,
   imageSize: 'default',
   // 'default', 'contain', 'cover' or 'native'
@@ -39,20 +38,13 @@ const defaults = {
   }
 };
 class Chocolat {
-  constructor(element, settings) {
+  constructor(elements, settings) {
     this.settings = settings;
     this.elems = {};
-    this.$element = $(element);
-    this.element = this.$element[0];
+    this.elements = elements;
     this.events = [];
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
-
-    if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
-      this.settings.setTitle = this.element.dataset['chocolat-title'];
-    }
-
-    const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-    imgs.forEach((el, i) => {
+    this.elements.forEach((el, i) => {
       this.settings.images.push({
         title: el.getAttribute('title'),
         src: el.getAttribute(this.settings.imageSource),
@@ -321,11 +313,9 @@ class Chocolat {
   }
 
   destroy() {
-    this.$element.removeData(); // todo remove all events ?
-
+    // todo remove all events ?
     this.off(this.elems.wrapper, 'mousemove.chocolat');
-    const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-    imgs.forEach((el, i) => {
+    this.elements.forEach((el, i) => {
       this.off(el, 'click.chocolat');
     });
 
@@ -340,7 +330,7 @@ class Chocolat {
     this.settings.currentImage = undefined;
     this.settings.initialized = false;
     this.elems.domContainer.classList.remove(...this._cssClasses);
-    $(this.elems.wrapper).remove();
+    this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
   }
 
   getOutMarginW() {
@@ -682,18 +672,14 @@ class Chocolat {
 
 }
 
-let calls = 0;
+const instances = [];
 function main_esm (options) {
-  return this.each(function () {
-    calls++;
-    var settings = Object.assign({}, defaults, options, {
-      setIndex: calls
-    });
-
-    if (!$.data(this, 'chocolat')) {
-      $.data(this, 'chocolat', new Chocolat($(this), settings));
-    }
+  const settings = Object.assign({}, defaults, options, {
+    setIndex: instances.length
   });
+  const instance = new Chocolat(elements, settings);
+  instances.push(instance);
+  return instance;
 }
 
 module.exports = main_esm;
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index f17339b..8b42abb 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -1,7 +1,6 @@
 const defaults = {
   container: window,
   // window or jquery object or jquery selector, or element
-  imageSelector: '.chocolat-image',
   className: undefined,
   imageSize: 'default',
   // 'default', 'contain', 'cover' or 'native'
@@ -37,20 +36,13 @@ const defaults = {
   }
 };
 class Chocolat {
-  constructor(element, settings) {
+  constructor(elements, settings) {
     this.settings = settings;
     this.elems = {};
-    this.$element = $(element);
-    this.element = this.$element[0];
+    this.elements = elements;
     this.events = [];
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
-
-    if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
-      this.settings.setTitle = this.element.dataset['chocolat-title'];
-    }
-
-    const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-    imgs.forEach((el, i) => {
+    this.elements.forEach((el, i) => {
       this.settings.images.push({
         title: el.getAttribute('title'),
         src: el.getAttribute(this.settings.imageSource),
@@ -319,11 +311,9 @@ class Chocolat {
   }
 
   destroy() {
-    this.$element.removeData(); // todo remove all events ?
-
+    // todo remove all events ?
     this.off(this.elems.wrapper, 'mousemove.chocolat');
-    const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-    imgs.forEach((el, i) => {
+    this.elements.forEach((el, i) => {
       this.off(el, 'click.chocolat');
     });
 
@@ -338,7 +328,7 @@ class Chocolat {
     this.settings.currentImage = undefined;
     this.settings.initialized = false;
     this.elems.domContainer.classList.remove(...this._cssClasses);
-    $(this.elems.wrapper).remove();
+    this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
   }
 
   getOutMarginW() {
@@ -680,18 +670,14 @@ class Chocolat {
 
 }
 
-let calls = 0;
+const instances = [];
 function main_esm (options) {
-  return this.each(function () {
-    calls++;
-    var settings = Object.assign({}, defaults, options, {
-      setIndex: calls
-    });
-
-    if (!$.data(this, 'chocolat')) {
-      $.data(this, 'chocolat', new Chocolat($(this), settings));
-    }
+  const settings = Object.assign({}, defaults, options, {
+    setIndex: instances.length
   });
+  const instance = new Chocolat(elements, settings);
+  instances.push(instance);
+  return instance;
 }
 
 export default main_esm;
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 23a967d..8f5354d 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -4,7 +4,6 @@
     const defaults = {
       container: window,
       // window or jquery object or jquery selector, or element
-      imageSelector: '.chocolat-image',
       className: undefined,
       imageSize: 'default',
       // 'default', 'contain', 'cover' or 'native'
@@ -40,20 +39,13 @@
       }
     };
     class Chocolat {
-      constructor(element, settings) {
+      constructor(elements, settings) {
         this.settings = settings;
         this.elems = {};
-        this.$element = $(element);
-        this.element = this.$element[0];
+        this.elements = elements;
         this.events = [];
         this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
-
-        if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
-          this.settings.setTitle = this.element.dataset['chocolat-title'];
-        }
-
-        const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-        imgs.forEach((el, i) => {
+        this.elements.forEach((el, i) => {
           this.settings.images.push({
             title: el.getAttribute('title'),
             src: el.getAttribute(this.settings.imageSource),
@@ -322,11 +314,9 @@
       }
 
       destroy() {
-        this.$element.removeData(); // todo remove all events ?
-
+        // todo remove all events ?
         this.off(this.elems.wrapper, 'mousemove.chocolat');
-        const imgs = this.element.querySelectorAll(this.settings.imageSelector);
-        imgs.forEach((el, i) => {
+        this.elements.forEach((el, i) => {
           this.off(el, 'click.chocolat');
         });
 
@@ -341,7 +331,7 @@
         this.settings.currentImage = undefined;
         this.settings.initialized = false;
         this.elems.domContainer.classList.remove(...this._cssClasses);
-        $(this.elems.wrapper).remove();
+        this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
       }
 
       getOutMarginW() {
@@ -683,19 +673,15 @@
 
     }
 
-    let calls = 0;
+    const instances = [];
 
-    $.fn.Chocolat = function (options) {
-      return this.each(function () {
-        calls++;
-        var settings = Object.assign({}, defaults, options, {
-          setIndex: calls
-        });
-
-        if (!$.data(this, 'chocolat')) {
-          $.data(this, 'chocolat', new Chocolat($(this), settings));
-        }
+    window.Chocolat = function (elements, options) {
+      const settings = Object.assign({}, defaults, options, {
+        setIndex: instances.length
       });
+      const instance = new Chocolat(elements, settings);
+      instances.push(instance);
+      return instance;
     };
 
 }());
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 9c05ea0..fa51f9a 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -1,6 +1,5 @@
 export const defaults = {
     container: window, // window or jquery object or jquery selector, or element
-    imageSelector: '.chocolat-image',
     className: undefined,
     imageSize: 'default', // 'default', 'contain', 'cover' or 'native'
     initialZoomState: null,
@@ -32,11 +31,10 @@ export const defaults = {
 }
 
 export class Chocolat {
-    constructor(element, settings) {
+    constructor(elements, settings) {
         this.settings = settings
         this.elems = {}
-        this.$element = $(element)
-        this.element = this.$element[0]
+        this.elements = elements
         this.events = []
 
         this._cssClasses = [
@@ -47,13 +45,7 @@ export class Chocolat {
             'chocolat-zoomed',
         ]
 
-        if (!this.settings.setTitle && this.element.dataset['chocolat-title']) {
-            this.settings.setTitle = this.element.dataset['chocolat-title']
-        }
-
-        const imgs = this.element.querySelectorAll(this.settings.imageSelector)
-
-        imgs.forEach((el, i) => {
+        this.elements.forEach((el, i) => {
             this.settings.images.push({
                 title: el.getAttribute('title'),
                 src: el.getAttribute(this.settings.imageSource),
@@ -346,13 +338,10 @@ export class Chocolat {
     }
 
     destroy() {
-        this.$element.removeData()
         // todo remove all events ?
         this.off(this.elems.wrapper, 'mousemove.chocolat')
 
-        const imgs = this.element.querySelectorAll(this.settings.imageSelector)
-
-        imgs.forEach((el, i) => {
+        this.elements.forEach((el, i) => {
             this.off(el, 'click.chocolat')
         })
 
@@ -366,7 +355,7 @@ export class Chocolat {
         this.settings.initialized = false
 
         this.elems.domContainer.classList.remove(...this._cssClasses)
-        $(this.elems.wrapper).remove()
+        this.elems.wrapper.parentNode.removeChild(this.elems.wrapper)
     }
 
     getOutMarginW() {
diff --git a/src/js/main.esm.js b/src/js/main.esm.js
index 2c43f19..013561e 100644
--- a/src/js/main.esm.js
+++ b/src/js/main.esm.js
@@ -1,14 +1,12 @@
 import { Chocolat, defaults } from './chocolat.js'
 
-let calls = 0
+const instances = []
 
 export default function(options) {
-    return this.each(function() {
-        calls++
-        var settings = Object.assign({}, defaults, options, { setIndex: calls })
-
-        if (!$.data(this, 'chocolat')) {
-            $.data(this, 'chocolat', new Chocolat($(this), settings))
-        }
-    })
+    const settings = Object.assign({}, defaults, options, { setIndex: instances.length })
+    const instance = new Chocolat(elements, settings)
+
+    instances.push(instance)
+
+    return instance
 }
diff --git a/src/js/main.iife.js b/src/js/main.iife.js
index 756541a..1cfd8a6 100644
--- a/src/js/main.iife.js
+++ b/src/js/main.iife.js
@@ -1,13 +1,12 @@
 import { Chocolat, defaults } from './chocolat.js'
 
-let calls = 0
-$.fn.Chocolat = function(options) {
-    return this.each(function() {
-        calls++
-        var settings = Object.assign({}, defaults, options, { setIndex: calls })
-
-        if (!$.data(this, 'chocolat')) {
-            $.data(this, 'chocolat', new Chocolat($(this), settings))
-        }
-    })
+const instances = []
+
+window.Chocolat = function(elements, options) {
+    const settings = Object.assign({}, defaults, options, { setIndex: instances.length })
+    const instance = new Chocolat(elements, settings)
+
+    instances.push(instance)
+
+    return instance
 }
diff --git a/test/test.js b/test/test.js
index 07348c2..cd5b478 100644
--- a/test/test.js
+++ b/test/test.js
@@ -1,17 +1,19 @@
 describe('Chocolat', function() {
-    describe('Opening', function() {
-        afterEach(function() {
-            var chocolat = $('#example0').data('chocolat')
-            chocolat.api().destroy()
-        })
+    var chocolat
+
+    beforeEach(function() {
+    })
+
+    afterEach(function() {
+        chocolat.api().destroy()
+    })
 
+    describe('Opening', function() {
         it('should call markup function and create markup', function() {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     loop: true,
                     container: $('#container')[0],
                 })
-                .data('chocolat')
 
             var spyMarkup = sinon.spy(chocolat, 'markup')
 
@@ -40,11 +42,10 @@ describe('Chocolat', function() {
         })
 
         it('should add css classes to parent when in container', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     container: $('#container')[0],
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -58,11 +59,10 @@ describe('Chocolat', function() {
         })
 
         it('should add css classes to body when full window', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     imageSize: 'cover',
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -76,11 +76,10 @@ describe('Chocolat', function() {
         })
 
         it('should add custom css classe', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     className: 'custom-class-name',
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -92,12 +91,11 @@ describe('Chocolat', function() {
         })
 
         it('should call init function', function() {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     loop: true,
                     container: $('#container')[0],
                 })
-                .data('chocolat')
+
 
             var spyInit = sinon.spy(chocolat, 'init')
 
@@ -111,12 +109,11 @@ describe('Chocolat', function() {
         })
 
         it('should call load function', function() {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     loop: true,
                     container: $('#container')[0],
                 })
-                .data('chocolat')
+
 
             var spyLoad = sinon.spy(chocolat, 'load')
 
@@ -130,12 +127,11 @@ describe('Chocolat', function() {
         })
 
         it('should call markup function', function() {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     loop: true,
                     container: $('#container')[0],
                 })
-                .data('chocolat')
+
 
             var spyMarkup = sinon.spy(chocolat, 'markup')
 
@@ -152,13 +148,11 @@ describe('Chocolat', function() {
                 return $(this.elems.description).appendTo(this.elems.top)
             }
 
-            var chocolat = $('#example0')
-                .Chocolat({
-                    loop: true,
-                    container: $('#container')[0],
-                    afterMarkup: afterMarkup,
-                })
-                .data('chocolat')
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
+                loop: true,
+                container: $('#container')[0],
+                afterMarkup: afterMarkup,
+            })
 
             $('#example0')
                 .find('.chocolat-image')
@@ -182,36 +176,15 @@ describe('Chocolat', function() {
     })
 
     describe('Destroy method', function() {
-        afterEach(function() {
-            var chocolat = $('#example0').data('chocolat')
-            if (chocolat != null) {
-                chocolat.api().destroy()
-            }
-        })
-
-        it('should remove data from calling element', function() {
-            var chocolat = $('#example0')
-                .Chocolat()
-                .data('chocolat')
-
-            var dataBefore = $('#example0').data('chocolat')
-            expect(dataBefore).not.to.be.null
-
-            chocolat.api().destroy()
-
-            var dataAfter = $('#example0').data('chocolat')
-            expect(dataAfter).to.be.undefined
-        })
 
         it('should remove wrapper element', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat()
-                .data('chocolat')
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
             chocolat
                 .api()
                 .open()
                 .then(function() {
+
                     var lengthBefore = $('.chocolat-wrapper').length
                     expect(lengthBefore).to.equal(1)
 
@@ -223,14 +196,12 @@ describe('Chocolat', function() {
                 })
         })
 
-        return it('should unbind event handler of the links (triggering chocolat.open)', function() {
-            var chocolat = $('#example0')
-                .Chocolat()
-                .data('chocolat')
-            var imageSelector = chocolat.api().get('imageSelector')
+        it('should unbind event handler of the links (triggering chocolat.open)', function() {
+            const links = document.querySelectorAll('.chocolat-image')
+            chocolat = Chocolat(links)
 
             var eventBefore = Object.values(chocolat.events)
-            expect(eventBefore.length).to.equal(document.querySelectorAll(imageSelector).length)
+            expect(eventBefore.length).to.be.above(0)
 
             chocolat.api().destroy()
 
@@ -239,9 +210,7 @@ describe('Chocolat', function() {
 
             var spyInit = sinon.spy(chocolat, 'init')
 
-            const link = $('#example0')
-                .find(imageSelector)
-                .first()[0]
+            const link = links[0]
 
             link.setAttribute('href', '#')
             link.click()
@@ -251,15 +220,9 @@ describe('Chocolat', function() {
     })
 
     describe('FullScreen', function() {
-        afterEach(function() {
-            var chocolat = $('#example0').data('chocolat')
-            chocolat.api().destroy()
-        })
-
         it('should open fullscreen when clicking .fullscreen', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat()
-                .data('chocolat')
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
+
 
             // test only if browser fullscreenAPI is available
             if (
@@ -287,9 +250,8 @@ describe('Chocolat', function() {
         })
 
         it('should close fullscreen when clicking .fullscreen twice', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat()
-                .data('chocolat')
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
+
 
             // test only if browser fullscreenAPI is available
             if (
@@ -316,9 +278,8 @@ describe('Chocolat', function() {
         })
 
         it('should close fullscreen when closing chocolat', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat()
-                .data('chocolat')
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
+
 
             // test only if browser fullscreenAPI is available
             if (
@@ -344,11 +305,10 @@ describe('Chocolat', function() {
         })
 
         return it('should open fullscreen directly', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     fullScreen: true,
                 })
-                .data('chocolat')
+
 
             // test only if browser fullscreenAPI is available
             if (
@@ -373,15 +333,9 @@ describe('Chocolat', function() {
     })
 
     describe('Change image', function() {
-        afterEach(function() {
-            var chocolat = $('#example0').data('chocolat')
-            chocolat.api().destroy()
-        })
-
         it('should go to next image', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat()
-                .data('chocolat')
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
+
 
             var spyLoad = sinon.spy(chocolat, 'load')
             var spyChange = sinon.spy(chocolat, 'change')
@@ -404,9 +358,8 @@ describe('Chocolat', function() {
         })
 
         it('should go to previous image', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat()
-                .data('chocolat')
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
+
 
             chocolat
                 .api()
@@ -439,11 +392,10 @@ describe('Chocolat', function() {
         })
 
         it('should loop and go to last image', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     loop: true,
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -468,11 +420,10 @@ describe('Chocolat', function() {
         })
 
         return it('should loop and go to first image', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     loop: true,
                 })
-                .data('chocolat')
+
 
             var lastImage = chocolat.settings.images.length - 1
 
@@ -496,15 +447,9 @@ describe('Chocolat', function() {
     })
 
     describe('ImageSize cover', function() {
-        afterEach(function() {
-            var chocolat = $('#example0').data('chocolat')
-            chocolat.api().destroy()
-        })
 
         it('should add class chocolat-cover to parent', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({ imageSize: 'cover' })
-                .data('chocolat')
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), { imageSize: 'cover' })
 
             chocolat
                 .api()
@@ -522,12 +467,11 @@ describe('Chocolat', function() {
         })
 
         it("should have 'shortest' side of the container equal to 'shortest' side to the image in container", function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     imageSize: 'cover',
                     container: $('#container')[0],
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -552,11 +496,10 @@ describe('Chocolat', function() {
         })
 
         it("should have 'shortest' side of the container equal to 'shortest' side to the image in window", function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     imageSize: 'cover',
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -581,11 +524,10 @@ describe('Chocolat', function() {
         })
 
         return it('should center the image', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     imageSize: 'cover',
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -611,18 +553,11 @@ describe('Chocolat', function() {
     })
 
     describe('ImageSize contain', function() {
-        afterEach(function() {
-            var chocolat = $('#example0').data('chocolat')
-            chocolat.api().destroy()
-        })
-
         it("should have 'longest' side of the container equal to 'longest' side to the image in container", function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     imageSize: 'contain',
                     container: $('#container')[0],
                 })
-                .data('chocolat')
 
             chocolat
                 .api()
@@ -647,11 +582,10 @@ describe('Chocolat', function() {
         })
 
         it("should have 'longest' side of the container equal to 'longest' side to the image in window", function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     imageSize: 'contain',
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -676,11 +610,10 @@ describe('Chocolat', function() {
         })
 
         return it('should center the image', function(done) {
-            var chocolat = $('#example0')
-                .Chocolat({
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                     imageSize: 'contain',
                 })
-                .data('chocolat')
+
 
             chocolat
                 .api()
@@ -706,8 +639,8 @@ describe('Chocolat', function() {
     })
 
     describe('API', function() {
-        var chocolat = $('<div />')
-            .Chocolat({
+        before(function() {
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 backgroundClose: false,
                 images: [
                     { src: '../dist/demo-images/1.jpg', title: 'You can zoom in the image' },
@@ -715,7 +648,7 @@ describe('Chocolat', function() {
                     { src: '../dist/demo-images/3.jpg', title: 'You can zoom in the image' },
                 ],
             })
-            .data('chocolat')
+        })
 
         it('should have a open method', function() {
             expect(typeof chocolat.api().open).to.equal('function')

From 60443b9c93937aaf537f2045a310e71c5fa7e0a4 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 25 Dec 2018 21:24:04 +0100
Subject: [PATCH 15/65] Prettier

---
 test/test.js | 105 +++++++++++++++++++++------------------------------
 1 file changed, 42 insertions(+), 63 deletions(-)

diff --git a/test/test.js b/test/test.js
index cd5b478..898b804 100644
--- a/test/test.js
+++ b/test/test.js
@@ -1,8 +1,7 @@
 describe('Chocolat', function() {
     var chocolat
 
-    beforeEach(function() {
-    })
+    beforeEach(function() {})
 
     afterEach(function() {
         chocolat.api().destroy()
@@ -11,9 +10,9 @@ describe('Chocolat', function() {
     describe('Opening', function() {
         it('should call markup function and create markup', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    loop: true,
-                    container: $('#container')[0],
-                })
+                loop: true,
+                container: $('#container')[0],
+            })
 
             var spyMarkup = sinon.spy(chocolat, 'markup')
 
@@ -43,9 +42,8 @@ describe('Chocolat', function() {
 
         it('should add css classes to parent when in container', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    container: $('#container')[0],
-                })
-
+                container: $('#container')[0],
+            })
 
             chocolat
                 .api()
@@ -60,9 +58,8 @@ describe('Chocolat', function() {
 
         it('should add css classes to body when full window', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    imageSize: 'cover',
-                })
-
+                imageSize: 'cover',
+            })
 
             chocolat
                 .api()
@@ -77,9 +74,8 @@ describe('Chocolat', function() {
 
         it('should add custom css classe', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    className: 'custom-class-name',
-                })
-
+                className: 'custom-class-name',
+            })
 
             chocolat
                 .api()
@@ -92,10 +88,9 @@ describe('Chocolat', function() {
 
         it('should call init function', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    loop: true,
-                    container: $('#container')[0],
-                })
-
+                loop: true,
+                container: $('#container')[0],
+            })
 
             var spyInit = sinon.spy(chocolat, 'init')
 
@@ -110,10 +105,9 @@ describe('Chocolat', function() {
 
         it('should call load function', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    loop: true,
-                    container: $('#container')[0],
-                })
-
+                loop: true,
+                container: $('#container')[0],
+            })
 
             var spyLoad = sinon.spy(chocolat, 'load')
 
@@ -128,10 +122,9 @@ describe('Chocolat', function() {
 
         it('should call markup function', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    loop: true,
-                    container: $('#container')[0],
-                })
-
+                loop: true,
+                container: $('#container')[0],
+            })
 
             var spyMarkup = sinon.spy(chocolat, 'markup')
 
@@ -176,7 +169,6 @@ describe('Chocolat', function() {
     })
 
     describe('Destroy method', function() {
-
         it('should remove wrapper element', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
@@ -184,7 +176,6 @@ describe('Chocolat', function() {
                 .api()
                 .open()
                 .then(function() {
-
                     var lengthBefore = $('.chocolat-wrapper').length
                     expect(lengthBefore).to.equal(1)
 
@@ -223,7 +214,6 @@ describe('Chocolat', function() {
         it('should open fullscreen when clicking .fullscreen', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
-
             // test only if browser fullscreenAPI is available
             if (
                 typeof Element.prototype.requestFullscreen === 'undefined' &&
@@ -252,7 +242,6 @@ describe('Chocolat', function() {
         it('should close fullscreen when clicking .fullscreen twice', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
-
             // test only if browser fullscreenAPI is available
             if (
                 typeof Element.prototype.requestFullscreen === 'undefined' &&
@@ -280,7 +269,6 @@ describe('Chocolat', function() {
         it('should close fullscreen when closing chocolat', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
-
             // test only if browser fullscreenAPI is available
             if (
                 typeof Element.prototype.requestFullscreen === 'undefined' &&
@@ -306,9 +294,8 @@ describe('Chocolat', function() {
 
         return it('should open fullscreen directly', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    fullScreen: true,
-                })
-
+                fullScreen: true,
+            })
 
             // test only if browser fullscreenAPI is available
             if (
@@ -336,7 +323,6 @@ describe('Chocolat', function() {
         it('should go to next image', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
-
             var spyLoad = sinon.spy(chocolat, 'load')
             var spyChange = sinon.spy(chocolat, 'change')
 
@@ -360,7 +346,6 @@ describe('Chocolat', function() {
         it('should go to previous image', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
-
             chocolat
                 .api()
                 .open()
@@ -393,9 +378,8 @@ describe('Chocolat', function() {
 
         it('should loop and go to last image', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    loop: true,
-                })
-
+                loop: true,
+            })
 
             chocolat
                 .api()
@@ -421,9 +405,8 @@ describe('Chocolat', function() {
 
         return it('should loop and go to first image', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    loop: true,
-                })
-
+                loop: true,
+            })
 
             var lastImage = chocolat.settings.images.length - 1
 
@@ -447,9 +430,10 @@ describe('Chocolat', function() {
     })
 
     describe('ImageSize cover', function() {
-
         it('should add class chocolat-cover to parent', function(done) {
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), { imageSize: 'cover' })
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
+                imageSize: 'cover',
+            })
 
             chocolat
                 .api()
@@ -468,10 +452,9 @@ describe('Chocolat', function() {
 
         it("should have 'shortest' side of the container equal to 'shortest' side to the image in container", function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    imageSize: 'cover',
-                    container: $('#container')[0],
-                })
-
+                imageSize: 'cover',
+                container: $('#container')[0],
+            })
 
             chocolat
                 .api()
@@ -497,9 +480,8 @@ describe('Chocolat', function() {
 
         it("should have 'shortest' side of the container equal to 'shortest' side to the image in window", function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    imageSize: 'cover',
-                })
-
+                imageSize: 'cover',
+            })
 
             chocolat
                 .api()
@@ -525,9 +507,8 @@ describe('Chocolat', function() {
 
         return it('should center the image', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    imageSize: 'cover',
-                })
-
+                imageSize: 'cover',
+            })
 
             chocolat
                 .api()
@@ -555,9 +536,9 @@ describe('Chocolat', function() {
     describe('ImageSize contain', function() {
         it("should have 'longest' side of the container equal to 'longest' side to the image in container", function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    imageSize: 'contain',
-                    container: $('#container')[0],
-                })
+                imageSize: 'contain',
+                container: $('#container')[0],
+            })
 
             chocolat
                 .api()
@@ -583,9 +564,8 @@ describe('Chocolat', function() {
 
         it("should have 'longest' side of the container equal to 'longest' side to the image in window", function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    imageSize: 'contain',
-                })
-
+                imageSize: 'contain',
+            })
 
             chocolat
                 .api()
@@ -611,9 +591,8 @@ describe('Chocolat', function() {
 
         return it('should center the image', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                    imageSize: 'contain',
-                })
-
+                imageSize: 'contain',
+            })
 
             chocolat
                 .api()

From 211733b2a880230e61a01185d73a8413fc35a933 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 25 Dec 2018 21:39:53 +0100
Subject: [PATCH 16/65] Wrap css transition in a promise

---
 dist/js/chocolat.cjs.js  | 82 +++++++++++++++++++++++-----------------
 dist/js/chocolat.esm.js  | 82 +++++++++++++++++++++++-----------------
 dist/js/chocolat.iife.js | 82 +++++++++++++++++++++++-----------------
 src/js/chocolat.js       | 82 ++++++++++++++++++++++------------------
 4 files changed, 187 insertions(+), 141 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index c2e2f75..138f65d 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -59,31 +59,6 @@ class Chocolat {
     });
   }
 
-  on(element, eventName, cb) {
-    // const eventName = this.settings.setIndex + '-' + eventName
-    const length = this.events.push({
-      element,
-      eventName,
-      cb
-    });
-    element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
-    return this;
-  }
-
-  off(element, eventName) {
-    // const eventName = this.settings.setIndex + '-' + eventName
-    const index = this.events.findIndex(event => {
-      return event.element === element && event.eventName === eventName;
-    });
-
-    if (this.events[index]) {
-      element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
-      this.events.splice(index, 1);
-    }
-
-    return this;
-  }
-
   init(i) {
     if (!this.settings.initialized) {
       this.setDomContainer();
@@ -299,17 +274,16 @@ class Chocolat {
       return;
     }
 
-    this.elems.overlay.classList.remove('chocolat-visible');
-    this.elems.loader.classList.remove('chocolat-visible');
-    this.elems.wrapper.classList.remove('chocolat-visible');
-    this.settings.currentImage = undefined; // todo
-
-    setTimeout(() => {
+    this.settings.currentImage = undefined;
+    const promiseOverlay = this.transitionAsPromise(() => {
+      this.elems.overlay.classList.remove('chocolat-visible');
+    }, this.elems.overlay);
+    const promiseWrapper = this.transitionAsPromise(() => {
+      this.elems.wrapper.classList.remove('chocolat-visible');
+    }, this.elems.wrapper);
+    return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
       this.elems.domContainer.classList.remove('chocolat-open');
-    }, 1000);
-    return Promise.resolve(); // return $.when($(els).fadeOut(200)).then(() => {
-    //     this.elems.domContainer.classList.remove('chocolat-open')
-    // })
+    });
   }
 
   destroy() {
@@ -629,6 +603,44 @@ class Chocolat {
     }, duration);
   }
 
+  on(element, eventName, cb) {
+    // const eventName = this.settings.setIndex + '-' + eventName
+    const length = this.events.push({
+      element,
+      eventName,
+      cb
+    });
+    element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
+    return this;
+  }
+
+  off(element, eventName) {
+    // const eventName = this.settings.setIndex + '-' + eventName
+    const index = this.events.findIndex(event => {
+      return event.element === element && event.eventName === eventName;
+    });
+
+    if (this.events[index]) {
+      element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
+      this.events.splice(index, 1);
+    }
+
+    return this;
+  }
+
+  transitionAsPromise(triggeringFunc, el) {
+    return new Promise(resolve => {
+      triggeringFunc();
+
+      const handleTransitionEnded = e => {
+        el.removeEventListener('transitionend', handleTransitionEnded);
+        resolve();
+      };
+
+      el.addEventListener('transitionend', handleTransitionEnded);
+    });
+  }
+
   api() {
     return {
       open: i => {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 8b42abb..843e192 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -57,31 +57,6 @@ class Chocolat {
     });
   }
 
-  on(element, eventName, cb) {
-    // const eventName = this.settings.setIndex + '-' + eventName
-    const length = this.events.push({
-      element,
-      eventName,
-      cb
-    });
-    element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
-    return this;
-  }
-
-  off(element, eventName) {
-    // const eventName = this.settings.setIndex + '-' + eventName
-    const index = this.events.findIndex(event => {
-      return event.element === element && event.eventName === eventName;
-    });
-
-    if (this.events[index]) {
-      element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
-      this.events.splice(index, 1);
-    }
-
-    return this;
-  }
-
   init(i) {
     if (!this.settings.initialized) {
       this.setDomContainer();
@@ -297,17 +272,16 @@ class Chocolat {
       return;
     }
 
-    this.elems.overlay.classList.remove('chocolat-visible');
-    this.elems.loader.classList.remove('chocolat-visible');
-    this.elems.wrapper.classList.remove('chocolat-visible');
-    this.settings.currentImage = undefined; // todo
-
-    setTimeout(() => {
+    this.settings.currentImage = undefined;
+    const promiseOverlay = this.transitionAsPromise(() => {
+      this.elems.overlay.classList.remove('chocolat-visible');
+    }, this.elems.overlay);
+    const promiseWrapper = this.transitionAsPromise(() => {
+      this.elems.wrapper.classList.remove('chocolat-visible');
+    }, this.elems.wrapper);
+    return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
       this.elems.domContainer.classList.remove('chocolat-open');
-    }, 1000);
-    return Promise.resolve(); // return $.when($(els).fadeOut(200)).then(() => {
-    //     this.elems.domContainer.classList.remove('chocolat-open')
-    // })
+    });
   }
 
   destroy() {
@@ -627,6 +601,44 @@ class Chocolat {
     }, duration);
   }
 
+  on(element, eventName, cb) {
+    // const eventName = this.settings.setIndex + '-' + eventName
+    const length = this.events.push({
+      element,
+      eventName,
+      cb
+    });
+    element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
+    return this;
+  }
+
+  off(element, eventName) {
+    // const eventName = this.settings.setIndex + '-' + eventName
+    const index = this.events.findIndex(event => {
+      return event.element === element && event.eventName === eventName;
+    });
+
+    if (this.events[index]) {
+      element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
+      this.events.splice(index, 1);
+    }
+
+    return this;
+  }
+
+  transitionAsPromise(triggeringFunc, el) {
+    return new Promise(resolve => {
+      triggeringFunc();
+
+      const handleTransitionEnded = e => {
+        el.removeEventListener('transitionend', handleTransitionEnded);
+        resolve();
+      };
+
+      el.addEventListener('transitionend', handleTransitionEnded);
+    });
+  }
+
   api() {
     return {
       open: i => {
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 8f5354d..8fdf250 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -60,31 +60,6 @@
         });
       }
 
-      on(element, eventName, cb) {
-        // const eventName = this.settings.setIndex + '-' + eventName
-        const length = this.events.push({
-          element,
-          eventName,
-          cb
-        });
-        element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
-        return this;
-      }
-
-      off(element, eventName) {
-        // const eventName = this.settings.setIndex + '-' + eventName
-        const index = this.events.findIndex(event => {
-          return event.element === element && event.eventName === eventName;
-        });
-
-        if (this.events[index]) {
-          element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
-          this.events.splice(index, 1);
-        }
-
-        return this;
-      }
-
       init(i) {
         if (!this.settings.initialized) {
           this.setDomContainer();
@@ -300,17 +275,16 @@
           return;
         }
 
-        this.elems.overlay.classList.remove('chocolat-visible');
-        this.elems.loader.classList.remove('chocolat-visible');
-        this.elems.wrapper.classList.remove('chocolat-visible');
-        this.settings.currentImage = undefined; // todo
-
-        setTimeout(() => {
+        this.settings.currentImage = undefined;
+        const promiseOverlay = this.transitionAsPromise(() => {
+          this.elems.overlay.classList.remove('chocolat-visible');
+        }, this.elems.overlay);
+        const promiseWrapper = this.transitionAsPromise(() => {
+          this.elems.wrapper.classList.remove('chocolat-visible');
+        }, this.elems.wrapper);
+        return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
           this.elems.domContainer.classList.remove('chocolat-open');
-        }, 1000);
-        return Promise.resolve(); // return $.when($(els).fadeOut(200)).then(() => {
-        //     this.elems.domContainer.classList.remove('chocolat-open')
-        // })
+        });
       }
 
       destroy() {
@@ -630,6 +604,44 @@
         }, duration);
       }
 
+      on(element, eventName, cb) {
+        // const eventName = this.settings.setIndex + '-' + eventName
+        const length = this.events.push({
+          element,
+          eventName,
+          cb
+        });
+        element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
+        return this;
+      }
+
+      off(element, eventName) {
+        // const eventName = this.settings.setIndex + '-' + eventName
+        const index = this.events.findIndex(event => {
+          return event.element === element && event.eventName === eventName;
+        });
+
+        if (this.events[index]) {
+          element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
+          this.events.splice(index, 1);
+        }
+
+        return this;
+      }
+
+      transitionAsPromise(triggeringFunc, el) {
+        return new Promise(resolve => {
+          triggeringFunc();
+
+          const handleTransitionEnded = e => {
+            el.removeEventListener('transitionend', handleTransitionEnded);
+            resolve();
+          };
+
+          el.addEventListener('transitionend', handleTransitionEnded);
+        });
+      }
+
       api() {
         return {
           open: i => {
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index fa51f9a..9ffbbd1 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -61,31 +61,6 @@ export class Chocolat {
         })
     }
 
-    on(element, eventName, cb) {
-        // const eventName = this.settings.setIndex + '-' + eventName
-        const length = this.events.push({
-            element,
-            eventName,
-            cb,
-        })
-        element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb)
-        return this
-    }
-
-    off(element, eventName) {
-        // const eventName = this.settings.setIndex + '-' + eventName
-        const index = this.events.findIndex((event) => {
-            return event.element === element && event.eventName === eventName
-        })
-
-        if (this.events[index]) {
-            element.removeEventListener(eventName.split('.')[0], this.events[index].cb)
-            this.events.splice(index, 1)
-        }
-
-        return this
-    }
-
     init(i) {
         if (!this.settings.initialized) {
             this.setDomContainer()
@@ -321,20 +296,19 @@ export class Chocolat {
             return
         }
 
-        this.elems.overlay.classList.remove('chocolat-visible')
-        this.elems.loader.classList.remove('chocolat-visible')
-        this.elems.wrapper.classList.remove('chocolat-visible')
-
         this.settings.currentImage = undefined
 
-        // todo
-        setTimeout(() => {
+        const promiseOverlay = this.transitionAsPromise(() => {
+            this.elems.overlay.classList.remove('chocolat-visible')
+        }, this.elems.overlay)
+
+        const promiseWrapper = this.transitionAsPromise(() => {
+            this.elems.wrapper.classList.remove('chocolat-visible')
+        }, this.elems.wrapper)
+
+        return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
             this.elems.domContainer.classList.remove('chocolat-open')
-        }, 1000)
-        return Promise.resolve()
-        // return $.when($(els).fadeOut(200)).then(() => {
-        //     this.elems.domContainer.classList.remove('chocolat-open')
-        // })
+        })
     }
 
     destroy() {
@@ -681,6 +655,42 @@ export class Chocolat {
         }, duration)
     }
 
+    on(element, eventName, cb) {
+        // const eventName = this.settings.setIndex + '-' + eventName
+        const length = this.events.push({
+            element,
+            eventName,
+            cb,
+        })
+        element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb)
+        return this
+    }
+
+    off(element, eventName) {
+        // const eventName = this.settings.setIndex + '-' + eventName
+        const index = this.events.findIndex((event) => {
+            return event.element === element && event.eventName === eventName
+        })
+
+        if (this.events[index]) {
+            element.removeEventListener(eventName.split('.')[0], this.events[index].cb)
+            this.events.splice(index, 1)
+        }
+
+        return this
+    }
+
+    transitionAsPromise(triggeringFunc, el) {
+        return new Promise((resolve) => {
+            triggeringFunc()
+            const handleTransitionEnded = (e) => {
+                el.removeEventListener('transitionend', handleTransitionEnded)
+                resolve()
+            }
+            el.addEventListener('transitionend', handleTransitionEnded)
+        })
+    }
+
     api() {
         return {
             open: (i) => {

From c7169b866403d223e4e02086b56546733736bc2d Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 25 Dec 2018 22:11:05 +0100
Subject: [PATCH 17/65] Remove all event listener when destroying

---
 dist/js/chocolat.cjs.js  | 12 +++++++-----
 dist/js/chocolat.esm.js  | 12 +++++++-----
 dist/js/chocolat.iife.js | 12 +++++++-----
 src/js/chocolat.js       | 10 ++++------
 4 files changed, 25 insertions(+), 21 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 138f65d..6f6ad82 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -287,11 +287,13 @@ class Chocolat {
   }
 
   destroy() {
-    // todo remove all events ?
-    this.off(this.elems.wrapper, 'mousemove.chocolat');
-    this.elements.forEach((el, i) => {
-      this.off(el, 'click.chocolat');
-    });
+    for (var i = this.events.length - 1; i >= 0; i--) {
+      const {
+        element,
+        eventName
+      } = this.events[i];
+      this.off(element, eventName);
+    }
 
     if (!this.settings.initialized) {
       return;
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 843e192..4312a1d 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -285,11 +285,13 @@ class Chocolat {
   }
 
   destroy() {
-    // todo remove all events ?
-    this.off(this.elems.wrapper, 'mousemove.chocolat');
-    this.elements.forEach((el, i) => {
-      this.off(el, 'click.chocolat');
-    });
+    for (var i = this.events.length - 1; i >= 0; i--) {
+      const {
+        element,
+        eventName
+      } = this.events[i];
+      this.off(element, eventName);
+    }
 
     if (!this.settings.initialized) {
       return;
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 8fdf250..7ba34bb 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -288,11 +288,13 @@
       }
 
       destroy() {
-        // todo remove all events ?
-        this.off(this.elems.wrapper, 'mousemove.chocolat');
-        this.elements.forEach((el, i) => {
-          this.off(el, 'click.chocolat');
-        });
+        for (var i = this.events.length - 1; i >= 0; i--) {
+          const {
+            element,
+            eventName
+          } = this.events[i];
+          this.off(element, eventName);
+        }
 
         if (!this.settings.initialized) {
           return;
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 9ffbbd1..03ee80e 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -312,12 +312,10 @@ export class Chocolat {
     }
 
     destroy() {
-        // todo remove all events ?
-        this.off(this.elems.wrapper, 'mousemove.chocolat')
-
-        this.elements.forEach((el, i) => {
-            this.off(el, 'click.chocolat')
-        })
+        for (var i = this.events.length - 1; i >= 0; i--) {
+            const { element, eventName } = this.events[i]
+            this.off(element, eventName)
+        }
 
         if (!this.settings.initialized) {
             return

From b93c59e128a6cf67e6678a556c64433990839954 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 29 Dec 2018 15:18:23 +0100
Subject: [PATCH 18/65] Improved loading chain

---
 dist/css/chocolat.css    |   9 +-
 dist/index.html          |  12 +--
 dist/js/chocolat.cjs.js  | 188 ++++++++++++---------------------
 dist/js/chocolat.esm.js  | 188 ++++++++++++---------------------
 dist/js/chocolat.iife.js | 188 ++++++++++++---------------------
 src/css/chocolat.css     |   9 +-
 src/js/chocolat.js       | 222 ++++++++++++++-------------------------
 test/test.js             |  13 +--
 8 files changed, 303 insertions(+), 526 deletions(-)

diff --git a/dist/css/chocolat.css b/dist/css/chocolat.css
index 55adeb8..742060b 100644
--- a/dist/css/chocolat.css
+++ b/dist/css/chocolat.css
@@ -44,6 +44,7 @@
     cursor : zoom-in;
 }
 .chocolat-loader{
+    transition: opacity .3s;
     height:32px;
     width:32px;
     position:absolute;
@@ -53,9 +54,14 @@
     margin-top:-16px;
     z-index:11;
     background:url(../images/loader.gif);
-    display:none;
+    opacity: 0;
+}
+.chocolat-loader.chocolat-visible{
+    opacity: 1;
 }
+
 .chocolat-content{
+    transition: top .2s ease, left .2s ease, width .2s ease, height .2s ease; /* center */
     position:fixed;
     width:0px;
     height:0px;
@@ -66,6 +72,7 @@
 }
 
 .chocolat-content .chocolat-img{
+    transition: margin .2s ease; /*  zoomout */
     position:absolute;
     width:100%;
     height:100%;
diff --git a/dist/index.html b/dist/index.html
index 0c181ae..131d2ac 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -178,7 +178,7 @@ <h2>
                     console.log('open start');
                     var def = instance.api().open()
 
-                    def.done(function(){
+                    def.then(function(){
                         console.log('open done');
                     })
                 })
@@ -188,7 +188,7 @@ <h2>
                     console.log('close start');
                     var def = instance.api().close()
 
-                    def.done(function(){
+                    def.then(function(){
                         console.log('close done');
                     })
                 })
@@ -198,7 +198,7 @@ <h2>
                     console.log('prev start');
                     var def = instance.api().prev()
 
-                    def.done(function(){
+                    def.then(function(){
                         console.log('prev done');
                     })
                 })
@@ -208,7 +208,7 @@ <h2>
                     console.log('next start');
                     var def = instance.api().next()
 
-                    def.done(function(){
+                    def.then(function(){
                         console.log('next done');
                     })
                 })
@@ -220,7 +220,7 @@ <h2>
                     instance.api().set('imageSize', 'cover')
                     var def = instance.api().place()
 
-                    def.done(function(){
+                    def.then(function(){
                         console.log('cover mode done')
                     })
                 })
@@ -232,7 +232,7 @@ <h2>
                     instance.api().set('imageSize', 'contain')
                     var def = instance.api().place()
 
-                    def.done(function(){
+                    def.then(function(){
                         console.log('contain mode done')
                     })
                 })
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 6f6ad82..57391ef 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -72,22 +72,12 @@ class Chocolat {
     return this.load(i);
   }
 
-  preload(i) {
-    const src = this.settings.images[i].src;
-    let image = new Image();
-
-    if ('decode' in image) {
+  loadImage(src, image) {
+    return new Promise(function (resolve, reject) {
+      image.onload = resolve;
+      image.onerror = resolve;
       image.src = src;
-      return new Promise(function (resolve, reject) {
-        image.decode().then(resolve.bind(this, image)).catch(resolve);
-      });
-    } else {
-      return new Promise(function (resolve, reject) {
-        image.onload = resolve.bind(this, image);
-        image.onerror = resolve;
-        image.src = src;
-      });
-    }
+    });
   }
 
   load(i) {
@@ -96,71 +86,80 @@ class Chocolat {
     }
 
     if (this.settings.currentImage === i) {
-      return;
+      return Promise.resolve();
     }
 
     setTimeout(() => {
       this.elems.overlay.classList.add('chocolat-visible');
       this.elems.wrapper.classList.add('chocolat-visible');
-    });
+    }, 0);
     this.elems.domContainer.classList.add('chocolat-open');
     this.settings.timer = setTimeout(() => {
-      if (typeof this.elems != 'undefined') {
-        $(this.elems.loader).fadeIn();
+      if (this.elems !== undefined) {
+        this.elems.loader.classList.add('chocolat-visible');
       }
     }, this.settings.duration);
-    return this.preload(i).then(imgLoader => {
+    const imgLoader = new Image();
+    return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
       const nextIndex = i + 1;
 
       if (this.settings.images[nextIndex] != undefined) {
-        this.preload(nextIndex);
+        this.loadImage(this.settings.images[nextIndex].src, new Image());
       }
 
-      return this.place(i, imgLoader);
-    }).then(imgLoader => {
-      return this.appear(i);
-    }).then(imgLoader => {
+      this.settings.currentImage = i;
+      const place = this.place(imgLoader);
+      const appear = this.appear(i);
+      return Promise.all([place, appear]);
+    }).then(() => {
       this.zoomable();
       this.settings.afterImageLoad();
     });
   }
 
-  place(i, imgLoader) {
-    this.settings.currentImage = i;
+  place(image) {
     this.description();
     this.pagination();
     this.arrows();
-    this.storeImgSize(imgLoader, i);
     const {
       width,
       height,
       left,
       top
-    } = this.fit(i, this.elems.wrapper);
-    return this.center(width, height, left, top, 0);
+    } = this.fit(image, this.elems.wrapper);
+    return this.center(width, height, left, top);
   }
 
-  center(width, height, left, top, duration) {
-    return $(this.elems.content).css('overflow', 'visible').animate({
-      width: width,
-      height: height,
-      left: left,
-      top: top
-    }, duration).promise();
+  center(width, height, left, top) {
+    return this.transitionAsPromise(() => {
+      Object.assign(this.elems.content.style, {
+        width: width + 'px',
+        height: height + 'px',
+        left: left + 'px',
+        top: top + 'px'
+      });
+    }, this.elems.content);
   }
 
   appear(i) {
     clearTimeout(this.settings.timer);
-    return $(this.elems.loader).stop().fadeOut(300, () => {
-      $(this.elems.img).attr('src', this.settings.images[i].src);
-    }).promise();
+
+    if (!this.elems.loader.classList.contains('chocolat-visible')) {
+      return this.loadImage(this.settings.images[i].src, this.elems.img);
+    }
+
+    return this.transitionAsPromise(() => {
+      this.elems.loader.classList.remove('chocolat-visible');
+    }, this.elems.loader).then(() => {
+      return this.loadImage(this.settings.images[i].src, this.elems.img);
+    });
   }
 
-  fit(i, container) {
+  fit(image, container) {
     let height;
     let width;
-    const imgHeight = this.settings.images[i].height;
-    const imgWidth = this.settings.images[i].width;
+    const imgHeight = image.height;
+    const imgWidth = image.width;
     const holderHeight = container.clientHeight;
     const holderWidth = container.clientWidth;
     const holderOutMarginH = this.getOutMarginH();
@@ -257,17 +256,6 @@ class Chocolat {
     $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
   }
 
-  storeImgSize(img, i) {
-    if (typeof img === 'undefined') {
-      return;
-    }
-
-    if (!this.settings.images[i].height || !this.settings.images[i].width) {
-      this.settings.images[i].height = img.height;
-      this.settings.images[i].width = img.width;
-    }
-  }
-
   close() {
     if (this.settings.fullscreenOpen) {
       this.exitFullScreen();
@@ -377,41 +365,13 @@ class Chocolat {
   }
 
   openFullScreen() {
-    var wrapper = this.elems.wrapper;
-
-    if (wrapper.requestFullscreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.requestFullscreen();
-    } else if (wrapper.mozRequestFullScreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.mozRequestFullScreen();
-    } else if (wrapper.webkitRequestFullscreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.webkitRequestFullscreen();
-    } else if (wrapper.msRequestFullscreen) {
-      wrapper.msRequestFullscreen();
-      this.settings.fullscreenOpen = true;
-    } else {
-      this.settings.fullscreenOpen = false;
-    }
+    this.elems.wrapper.requestFullscreen();
+    this.settings.fullscreenOpen = true;
   }
 
   exitFullScreen() {
-    if (document.exitFullscreen) {
-      document.exitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.mozCancelFullScreen) {
-      document.mozCancelFullScreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.webkitExitFullscreen) {
-      document.webkitExitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.msExitFullscreen) {
-      document.msExitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else {
-      this.settings.fullscreenOpen = true;
-    }
+    document.exitFullscreen();
+    this.settings.fullscreenOpen = false;
   }
 
   attachListeners() {
@@ -475,10 +435,6 @@ class Chocolat {
         return;
       }
 
-      if ($(this.elems.img).is(':animated')) {
-        return;
-      }
-
       if (this.settings.currentImage === undefined) {
         return;
       }
@@ -487,8 +443,8 @@ class Chocolat {
       var height = $(this.elems.wrapper).height();
       var width = $(this.elems.wrapper).width();
       var currentImage = this.settings.images[this.settings.currentImage];
-      var imgWidth = currentImage.width;
-      var imgHeight = currentImage.height;
+      var imgWidth = this.elems.img.width;
+      var imgHeight = this.elems.img.height;
       var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
       var mvtX = 0;
 
@@ -506,16 +462,8 @@ class Chocolat {
         mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
       }
 
-      var animation = {
-        'margin-left': -mvtX + 'px',
-        'margin-top': -mvtY + 'px'
-      };
-
-      if (typeof e.duration !== 'undefined') {
-        $(this.elems.img).stop(false, true).animate(animation, e.duration);
-      } else {
-        $(this.elems.img).stop(false, true).css(animation);
-      }
+      this.elems.img.style.marginLeft = -mvtX + 'px';
+      this.elems.img.style.marginTop = -mvtY + 'px';
     });
     this.on(window, 'resize.chocolat', e => {
       if (!this.settings.initialized || this.settings.currentImage === undefined) {
@@ -528,7 +476,7 @@ class Chocolat {
           height,
           left,
           top
-        } = this.fit(this.settings.currentImage, this.elems.wrapper);
+        } = this.fit(this.elems.img, this.elems.wrapper);
         this.center(width, height, left, top, 0);
         this.zoomable();
       });
@@ -539,8 +487,8 @@ class Chocolat {
     var currentImage = this.settings.images[this.settings.currentImage];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
-    var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
-    var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
+    var isImageZoomable = this.settings.enableZoom && (this.elems.img.width > wrapperWidth || this.elems.img.height > wrapperHeight) ? true : false;
+    var isImageStretched = this.elems.img.clientWidth > this.elems.img.width || this.elems.img.clientHeight > this.elems.img.height;
 
     if (isImageZoomable && !isImageStretched) {
       this.elems.domContainer.classList.add('chocolat-zoomable');
@@ -552,18 +500,13 @@ class Chocolat {
   zoomIn(e) {
     this.settings.initialZoomState = this.settings.imageSize;
     this.settings.imageSize = 'native';
-    var event = $.Event('mousemove');
-    event.pageX = e.pageX;
-    event.pageY = e.pageY;
-    event.duration = this.settings.duration;
-    $(this.elems.wrapper).trigger(event);
     this.elems.domContainer.classList.add('chocolat-zoomed');
     const {
       width,
       height,
       left,
       top
-    } = this.fit(this.settings.currentImage, this.elems.wrapper);
+    } = this.fit(this.elems.img, this.elems.wrapper);
     return this.center(width, height, left, top, this.settings.duration);
   }
 
@@ -575,16 +518,14 @@ class Chocolat {
     duration = duration || this.settings.duration;
     this.settings.imageSize = this.settings.initialZoomState;
     this.settings.initialZoomState = null;
-    $(this.elems.img).animate({
-      margin: 0
-    }, duration);
+    this.elems.img.style.margin = 0;
     this.elems.domContainer.classList.remove('chocolat-zoomed');
     const {
       width,
       height,
       left,
       top
-    } = this.fit(this.settings.currentImage, this.elems.wrapper);
+    } = this.fit(this.elems.img, this.elems.wrapper);
     return this.center(width, height, left, top, duration);
   }
 
@@ -632,14 +573,19 @@ class Chocolat {
 
   transitionAsPromise(triggeringFunc, el) {
     return new Promise(resolve => {
-      triggeringFunc();
-
-      const handleTransitionEnded = e => {
-        el.removeEventListener('transitionend', handleTransitionEnded);
+      const handleTransitionEnd = () => {
+        el.removeEventListener('transitionend', handleTransitionEnd);
         resolve();
       };
 
-      el.addEventListener('transitionend', handleTransitionEnded);
+      el.addEventListener('transitionend', handleTransitionEnd);
+      const classesBefore = el.getAttribute('class');
+      const stylesBefore = el.getAttribute('style');
+      triggeringFunc();
+
+      if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
+        handleTransitionEnd();
+      }
     });
   }
 
@@ -666,7 +612,7 @@ class Chocolat {
         return this.settings.currentImage;
       },
       place: () => {
-        return this.place(this.settings.currentImage, this.settings.duration);
+        return this.place(this.elems.img, this.settings.duration);
       },
       destroy: () => {
         return this.destroy();
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 4312a1d..04c5ccf 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -70,22 +70,12 @@ class Chocolat {
     return this.load(i);
   }
 
-  preload(i) {
-    const src = this.settings.images[i].src;
-    let image = new Image();
-
-    if ('decode' in image) {
+  loadImage(src, image) {
+    return new Promise(function (resolve, reject) {
+      image.onload = resolve;
+      image.onerror = resolve;
       image.src = src;
-      return new Promise(function (resolve, reject) {
-        image.decode().then(resolve.bind(this, image)).catch(resolve);
-      });
-    } else {
-      return new Promise(function (resolve, reject) {
-        image.onload = resolve.bind(this, image);
-        image.onerror = resolve;
-        image.src = src;
-      });
-    }
+    });
   }
 
   load(i) {
@@ -94,71 +84,80 @@ class Chocolat {
     }
 
     if (this.settings.currentImage === i) {
-      return;
+      return Promise.resolve();
     }
 
     setTimeout(() => {
       this.elems.overlay.classList.add('chocolat-visible');
       this.elems.wrapper.classList.add('chocolat-visible');
-    });
+    }, 0);
     this.elems.domContainer.classList.add('chocolat-open');
     this.settings.timer = setTimeout(() => {
-      if (typeof this.elems != 'undefined') {
-        $(this.elems.loader).fadeIn();
+      if (this.elems !== undefined) {
+        this.elems.loader.classList.add('chocolat-visible');
       }
     }, this.settings.duration);
-    return this.preload(i).then(imgLoader => {
+    const imgLoader = new Image();
+    return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
       const nextIndex = i + 1;
 
       if (this.settings.images[nextIndex] != undefined) {
-        this.preload(nextIndex);
+        this.loadImage(this.settings.images[nextIndex].src, new Image());
       }
 
-      return this.place(i, imgLoader);
-    }).then(imgLoader => {
-      return this.appear(i);
-    }).then(imgLoader => {
+      this.settings.currentImage = i;
+      const place = this.place(imgLoader);
+      const appear = this.appear(i);
+      return Promise.all([place, appear]);
+    }).then(() => {
       this.zoomable();
       this.settings.afterImageLoad();
     });
   }
 
-  place(i, imgLoader) {
-    this.settings.currentImage = i;
+  place(image) {
     this.description();
     this.pagination();
     this.arrows();
-    this.storeImgSize(imgLoader, i);
     const {
       width,
       height,
       left,
       top
-    } = this.fit(i, this.elems.wrapper);
-    return this.center(width, height, left, top, 0);
+    } = this.fit(image, this.elems.wrapper);
+    return this.center(width, height, left, top);
   }
 
-  center(width, height, left, top, duration) {
-    return $(this.elems.content).css('overflow', 'visible').animate({
-      width: width,
-      height: height,
-      left: left,
-      top: top
-    }, duration).promise();
+  center(width, height, left, top) {
+    return this.transitionAsPromise(() => {
+      Object.assign(this.elems.content.style, {
+        width: width + 'px',
+        height: height + 'px',
+        left: left + 'px',
+        top: top + 'px'
+      });
+    }, this.elems.content);
   }
 
   appear(i) {
     clearTimeout(this.settings.timer);
-    return $(this.elems.loader).stop().fadeOut(300, () => {
-      $(this.elems.img).attr('src', this.settings.images[i].src);
-    }).promise();
+
+    if (!this.elems.loader.classList.contains('chocolat-visible')) {
+      return this.loadImage(this.settings.images[i].src, this.elems.img);
+    }
+
+    return this.transitionAsPromise(() => {
+      this.elems.loader.classList.remove('chocolat-visible');
+    }, this.elems.loader).then(() => {
+      return this.loadImage(this.settings.images[i].src, this.elems.img);
+    });
   }
 
-  fit(i, container) {
+  fit(image, container) {
     let height;
     let width;
-    const imgHeight = this.settings.images[i].height;
-    const imgWidth = this.settings.images[i].width;
+    const imgHeight = image.height;
+    const imgWidth = image.width;
     const holderHeight = container.clientHeight;
     const holderWidth = container.clientWidth;
     const holderOutMarginH = this.getOutMarginH();
@@ -255,17 +254,6 @@ class Chocolat {
     $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
   }
 
-  storeImgSize(img, i) {
-    if (typeof img === 'undefined') {
-      return;
-    }
-
-    if (!this.settings.images[i].height || !this.settings.images[i].width) {
-      this.settings.images[i].height = img.height;
-      this.settings.images[i].width = img.width;
-    }
-  }
-
   close() {
     if (this.settings.fullscreenOpen) {
       this.exitFullScreen();
@@ -375,41 +363,13 @@ class Chocolat {
   }
 
   openFullScreen() {
-    var wrapper = this.elems.wrapper;
-
-    if (wrapper.requestFullscreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.requestFullscreen();
-    } else if (wrapper.mozRequestFullScreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.mozRequestFullScreen();
-    } else if (wrapper.webkitRequestFullscreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.webkitRequestFullscreen();
-    } else if (wrapper.msRequestFullscreen) {
-      wrapper.msRequestFullscreen();
-      this.settings.fullscreenOpen = true;
-    } else {
-      this.settings.fullscreenOpen = false;
-    }
+    this.elems.wrapper.requestFullscreen();
+    this.settings.fullscreenOpen = true;
   }
 
   exitFullScreen() {
-    if (document.exitFullscreen) {
-      document.exitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.mozCancelFullScreen) {
-      document.mozCancelFullScreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.webkitExitFullscreen) {
-      document.webkitExitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.msExitFullscreen) {
-      document.msExitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else {
-      this.settings.fullscreenOpen = true;
-    }
+    document.exitFullscreen();
+    this.settings.fullscreenOpen = false;
   }
 
   attachListeners() {
@@ -473,10 +433,6 @@ class Chocolat {
         return;
       }
 
-      if ($(this.elems.img).is(':animated')) {
-        return;
-      }
-
       if (this.settings.currentImage === undefined) {
         return;
       }
@@ -485,8 +441,8 @@ class Chocolat {
       var height = $(this.elems.wrapper).height();
       var width = $(this.elems.wrapper).width();
       var currentImage = this.settings.images[this.settings.currentImage];
-      var imgWidth = currentImage.width;
-      var imgHeight = currentImage.height;
+      var imgWidth = this.elems.img.width;
+      var imgHeight = this.elems.img.height;
       var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
       var mvtX = 0;
 
@@ -504,16 +460,8 @@ class Chocolat {
         mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
       }
 
-      var animation = {
-        'margin-left': -mvtX + 'px',
-        'margin-top': -mvtY + 'px'
-      };
-
-      if (typeof e.duration !== 'undefined') {
-        $(this.elems.img).stop(false, true).animate(animation, e.duration);
-      } else {
-        $(this.elems.img).stop(false, true).css(animation);
-      }
+      this.elems.img.style.marginLeft = -mvtX + 'px';
+      this.elems.img.style.marginTop = -mvtY + 'px';
     });
     this.on(window, 'resize.chocolat', e => {
       if (!this.settings.initialized || this.settings.currentImage === undefined) {
@@ -526,7 +474,7 @@ class Chocolat {
           height,
           left,
           top
-        } = this.fit(this.settings.currentImage, this.elems.wrapper);
+        } = this.fit(this.elems.img, this.elems.wrapper);
         this.center(width, height, left, top, 0);
         this.zoomable();
       });
@@ -537,8 +485,8 @@ class Chocolat {
     var currentImage = this.settings.images[this.settings.currentImage];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
-    var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
-    var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
+    var isImageZoomable = this.settings.enableZoom && (this.elems.img.width > wrapperWidth || this.elems.img.height > wrapperHeight) ? true : false;
+    var isImageStretched = this.elems.img.clientWidth > this.elems.img.width || this.elems.img.clientHeight > this.elems.img.height;
 
     if (isImageZoomable && !isImageStretched) {
       this.elems.domContainer.classList.add('chocolat-zoomable');
@@ -550,18 +498,13 @@ class Chocolat {
   zoomIn(e) {
     this.settings.initialZoomState = this.settings.imageSize;
     this.settings.imageSize = 'native';
-    var event = $.Event('mousemove');
-    event.pageX = e.pageX;
-    event.pageY = e.pageY;
-    event.duration = this.settings.duration;
-    $(this.elems.wrapper).trigger(event);
     this.elems.domContainer.classList.add('chocolat-zoomed');
     const {
       width,
       height,
       left,
       top
-    } = this.fit(this.settings.currentImage, this.elems.wrapper);
+    } = this.fit(this.elems.img, this.elems.wrapper);
     return this.center(width, height, left, top, this.settings.duration);
   }
 
@@ -573,16 +516,14 @@ class Chocolat {
     duration = duration || this.settings.duration;
     this.settings.imageSize = this.settings.initialZoomState;
     this.settings.initialZoomState = null;
-    $(this.elems.img).animate({
-      margin: 0
-    }, duration);
+    this.elems.img.style.margin = 0;
     this.elems.domContainer.classList.remove('chocolat-zoomed');
     const {
       width,
       height,
       left,
       top
-    } = this.fit(this.settings.currentImage, this.elems.wrapper);
+    } = this.fit(this.elems.img, this.elems.wrapper);
     return this.center(width, height, left, top, duration);
   }
 
@@ -630,14 +571,19 @@ class Chocolat {
 
   transitionAsPromise(triggeringFunc, el) {
     return new Promise(resolve => {
-      triggeringFunc();
-
-      const handleTransitionEnded = e => {
-        el.removeEventListener('transitionend', handleTransitionEnded);
+      const handleTransitionEnd = () => {
+        el.removeEventListener('transitionend', handleTransitionEnd);
         resolve();
       };
 
-      el.addEventListener('transitionend', handleTransitionEnded);
+      el.addEventListener('transitionend', handleTransitionEnd);
+      const classesBefore = el.getAttribute('class');
+      const stylesBefore = el.getAttribute('style');
+      triggeringFunc();
+
+      if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
+        handleTransitionEnd();
+      }
     });
   }
 
@@ -664,7 +610,7 @@ class Chocolat {
         return this.settings.currentImage;
       },
       place: () => {
-        return this.place(this.settings.currentImage, this.settings.duration);
+        return this.place(this.elems.img, this.settings.duration);
       },
       destroy: () => {
         return this.destroy();
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 7ba34bb..3369dfb 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -73,22 +73,12 @@
         return this.load(i);
       }
 
-      preload(i) {
-        const src = this.settings.images[i].src;
-        let image = new Image();
-
-        if ('decode' in image) {
+      loadImage(src, image) {
+        return new Promise(function (resolve, reject) {
+          image.onload = resolve;
+          image.onerror = resolve;
           image.src = src;
-          return new Promise(function (resolve, reject) {
-            image.decode().then(resolve.bind(this, image)).catch(resolve);
-          });
-        } else {
-          return new Promise(function (resolve, reject) {
-            image.onload = resolve.bind(this, image);
-            image.onerror = resolve;
-            image.src = src;
-          });
-        }
+        });
       }
 
       load(i) {
@@ -97,71 +87,80 @@
         }
 
         if (this.settings.currentImage === i) {
-          return;
+          return Promise.resolve();
         }
 
         setTimeout(() => {
           this.elems.overlay.classList.add('chocolat-visible');
           this.elems.wrapper.classList.add('chocolat-visible');
-        });
+        }, 0);
         this.elems.domContainer.classList.add('chocolat-open');
         this.settings.timer = setTimeout(() => {
-          if (typeof this.elems != 'undefined') {
-            $(this.elems.loader).fadeIn();
+          if (this.elems !== undefined) {
+            this.elems.loader.classList.add('chocolat-visible');
           }
         }, this.settings.duration);
-        return this.preload(i).then(imgLoader => {
+        const imgLoader = new Image();
+        return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
           const nextIndex = i + 1;
 
           if (this.settings.images[nextIndex] != undefined) {
-            this.preload(nextIndex);
+            this.loadImage(this.settings.images[nextIndex].src, new Image());
           }
 
-          return this.place(i, imgLoader);
-        }).then(imgLoader => {
-          return this.appear(i);
-        }).then(imgLoader => {
+          this.settings.currentImage = i;
+          const place = this.place(imgLoader);
+          const appear = this.appear(i);
+          return Promise.all([place, appear]);
+        }).then(() => {
           this.zoomable();
           this.settings.afterImageLoad();
         });
       }
 
-      place(i, imgLoader) {
-        this.settings.currentImage = i;
+      place(image) {
         this.description();
         this.pagination();
         this.arrows();
-        this.storeImgSize(imgLoader, i);
         const {
           width,
           height,
           left,
           top
-        } = this.fit(i, this.elems.wrapper);
-        return this.center(width, height, left, top, 0);
+        } = this.fit(image, this.elems.wrapper);
+        return this.center(width, height, left, top);
       }
 
-      center(width, height, left, top, duration) {
-        return $(this.elems.content).css('overflow', 'visible').animate({
-          width: width,
-          height: height,
-          left: left,
-          top: top
-        }, duration).promise();
+      center(width, height, left, top) {
+        return this.transitionAsPromise(() => {
+          Object.assign(this.elems.content.style, {
+            width: width + 'px',
+            height: height + 'px',
+            left: left + 'px',
+            top: top + 'px'
+          });
+        }, this.elems.content);
       }
 
       appear(i) {
         clearTimeout(this.settings.timer);
-        return $(this.elems.loader).stop().fadeOut(300, () => {
-          $(this.elems.img).attr('src', this.settings.images[i].src);
-        }).promise();
+
+        if (!this.elems.loader.classList.contains('chocolat-visible')) {
+          return this.loadImage(this.settings.images[i].src, this.elems.img);
+        }
+
+        return this.transitionAsPromise(() => {
+          this.elems.loader.classList.remove('chocolat-visible');
+        }, this.elems.loader).then(() => {
+          return this.loadImage(this.settings.images[i].src, this.elems.img);
+        });
       }
 
-      fit(i, container) {
+      fit(image, container) {
         let height;
         let width;
-        const imgHeight = this.settings.images[i].height;
-        const imgWidth = this.settings.images[i].width;
+        const imgHeight = image.height;
+        const imgWidth = image.width;
         const holderHeight = container.clientHeight;
         const holderWidth = container.clientWidth;
         const holderOutMarginH = this.getOutMarginH();
@@ -258,17 +257,6 @@
         $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
       }
 
-      storeImgSize(img, i) {
-        if (typeof img === 'undefined') {
-          return;
-        }
-
-        if (!this.settings.images[i].height || !this.settings.images[i].width) {
-          this.settings.images[i].height = img.height;
-          this.settings.images[i].width = img.width;
-        }
-      }
-
       close() {
         if (this.settings.fullscreenOpen) {
           this.exitFullScreen();
@@ -378,41 +366,13 @@
       }
 
       openFullScreen() {
-        var wrapper = this.elems.wrapper;
-
-        if (wrapper.requestFullscreen) {
-          this.settings.fullscreenOpen = true;
-          wrapper.requestFullscreen();
-        } else if (wrapper.mozRequestFullScreen) {
-          this.settings.fullscreenOpen = true;
-          wrapper.mozRequestFullScreen();
-        } else if (wrapper.webkitRequestFullscreen) {
-          this.settings.fullscreenOpen = true;
-          wrapper.webkitRequestFullscreen();
-        } else if (wrapper.msRequestFullscreen) {
-          wrapper.msRequestFullscreen();
-          this.settings.fullscreenOpen = true;
-        } else {
-          this.settings.fullscreenOpen = false;
-        }
+        this.elems.wrapper.requestFullscreen();
+        this.settings.fullscreenOpen = true;
       }
 
       exitFullScreen() {
-        if (document.exitFullscreen) {
-          document.exitFullscreen();
-          this.settings.fullscreenOpen = false;
-        } else if (document.mozCancelFullScreen) {
-          document.mozCancelFullScreen();
-          this.settings.fullscreenOpen = false;
-        } else if (document.webkitExitFullscreen) {
-          document.webkitExitFullscreen();
-          this.settings.fullscreenOpen = false;
-        } else if (document.msExitFullscreen) {
-          document.msExitFullscreen();
-          this.settings.fullscreenOpen = false;
-        } else {
-          this.settings.fullscreenOpen = true;
-        }
+        document.exitFullscreen();
+        this.settings.fullscreenOpen = false;
       }
 
       attachListeners() {
@@ -476,10 +436,6 @@
             return;
           }
 
-          if ($(this.elems.img).is(':animated')) {
-            return;
-          }
-
           if (this.settings.currentImage === undefined) {
             return;
           }
@@ -488,8 +444,8 @@
           var height = $(this.elems.wrapper).height();
           var width = $(this.elems.wrapper).width();
           var currentImage = this.settings.images[this.settings.currentImage];
-          var imgWidth = currentImage.width;
-          var imgHeight = currentImage.height;
+          var imgWidth = this.elems.img.width;
+          var imgHeight = this.elems.img.height;
           var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
           var mvtX = 0;
 
@@ -507,16 +463,8 @@
             mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
           }
 
-          var animation = {
-            'margin-left': -mvtX + 'px',
-            'margin-top': -mvtY + 'px'
-          };
-
-          if (typeof e.duration !== 'undefined') {
-            $(this.elems.img).stop(false, true).animate(animation, e.duration);
-          } else {
-            $(this.elems.img).stop(false, true).css(animation);
-          }
+          this.elems.img.style.marginLeft = -mvtX + 'px';
+          this.elems.img.style.marginTop = -mvtY + 'px';
         });
         this.on(window, 'resize.chocolat', e => {
           if (!this.settings.initialized || this.settings.currentImage === undefined) {
@@ -529,7 +477,7 @@
               height,
               left,
               top
-            } = this.fit(this.settings.currentImage, this.elems.wrapper);
+            } = this.fit(this.elems.img, this.elems.wrapper);
             this.center(width, height, left, top, 0);
             this.zoomable();
           });
@@ -540,8 +488,8 @@
         var currentImage = this.settings.images[this.settings.currentImage];
         var wrapperWidth = this.elems.wrapper.clientWidth;
         var wrapperHeight = this.elems.wrapper.clientHeight;
-        var isImageZoomable = this.settings.enableZoom && (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight) ? true : false;
-        var isImageStretched = this.elems.img.clientWidth > currentImage.width || this.elems.img.clientHeight > currentImage.height;
+        var isImageZoomable = this.settings.enableZoom && (this.elems.img.width > wrapperWidth || this.elems.img.height > wrapperHeight) ? true : false;
+        var isImageStretched = this.elems.img.clientWidth > this.elems.img.width || this.elems.img.clientHeight > this.elems.img.height;
 
         if (isImageZoomable && !isImageStretched) {
           this.elems.domContainer.classList.add('chocolat-zoomable');
@@ -553,18 +501,13 @@
       zoomIn(e) {
         this.settings.initialZoomState = this.settings.imageSize;
         this.settings.imageSize = 'native';
-        var event = $.Event('mousemove');
-        event.pageX = e.pageX;
-        event.pageY = e.pageY;
-        event.duration = this.settings.duration;
-        $(this.elems.wrapper).trigger(event);
         this.elems.domContainer.classList.add('chocolat-zoomed');
         const {
           width,
           height,
           left,
           top
-        } = this.fit(this.settings.currentImage, this.elems.wrapper);
+        } = this.fit(this.elems.img, this.elems.wrapper);
         return this.center(width, height, left, top, this.settings.duration);
       }
 
@@ -576,16 +519,14 @@
         duration = duration || this.settings.duration;
         this.settings.imageSize = this.settings.initialZoomState;
         this.settings.initialZoomState = null;
-        $(this.elems.img).animate({
-          margin: 0
-        }, duration);
+        this.elems.img.style.margin = 0;
         this.elems.domContainer.classList.remove('chocolat-zoomed');
         const {
           width,
           height,
           left,
           top
-        } = this.fit(this.settings.currentImage, this.elems.wrapper);
+        } = this.fit(this.elems.img, this.elems.wrapper);
         return this.center(width, height, left, top, duration);
       }
 
@@ -633,14 +574,19 @@
 
       transitionAsPromise(triggeringFunc, el) {
         return new Promise(resolve => {
-          triggeringFunc();
-
-          const handleTransitionEnded = e => {
-            el.removeEventListener('transitionend', handleTransitionEnded);
+          const handleTransitionEnd = () => {
+            el.removeEventListener('transitionend', handleTransitionEnd);
             resolve();
           };
 
-          el.addEventListener('transitionend', handleTransitionEnded);
+          el.addEventListener('transitionend', handleTransitionEnd);
+          const classesBefore = el.getAttribute('class');
+          const stylesBefore = el.getAttribute('style');
+          triggeringFunc();
+
+          if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
+            handleTransitionEnd();
+          }
         });
       }
 
@@ -667,7 +613,7 @@
             return this.settings.currentImage;
           },
           place: () => {
-            return this.place(this.settings.currentImage, this.settings.duration);
+            return this.place(this.elems.img, this.settings.duration);
           },
           destroy: () => {
             return this.destroy();
diff --git a/src/css/chocolat.css b/src/css/chocolat.css
index 55adeb8..742060b 100644
--- a/src/css/chocolat.css
+++ b/src/css/chocolat.css
@@ -44,6 +44,7 @@
     cursor : zoom-in;
 }
 .chocolat-loader{
+    transition: opacity .3s;
     height:32px;
     width:32px;
     position:absolute;
@@ -53,9 +54,14 @@
     margin-top:-16px;
     z-index:11;
     background:url(../images/loader.gif);
-    display:none;
+    opacity: 0;
+}
+.chocolat-loader.chocolat-visible{
+    opacity: 1;
 }
+
 .chocolat-content{
+    transition: top .2s ease, left .2s ease, width .2s ease, height .2s ease; /* center */
     position:fixed;
     width:0px;
     height:0px;
@@ -66,6 +72,7 @@
 }
 
 .chocolat-content .chocolat-img{
+    transition: margin .2s ease; /*  zoomout */
     position:absolute;
     width:100%;
     height:100%;
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 03ee80e..3af76a3 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -75,24 +75,12 @@ export class Chocolat {
         return this.load(i)
     }
 
-    preload(i) {
-        const src = this.settings.images[i].src
-        let image = new Image()
-        if ('decode' in image) {
+    loadImage(src, image) {
+        return new Promise(function(resolve, reject) {
+            image.onload = resolve
+            image.onerror = resolve
             image.src = src
-            return new Promise(function(resolve, reject) {
-                image
-                    .decode()
-                    .then(resolve.bind(this, image))
-                    .catch(resolve)
-            })
-        } else {
-            return new Promise(function(resolve, reject) {
-                image.onload = resolve.bind(this, image)
-                image.onerror = resolve
-                image.src = src
-            })
-        }
+        })
     }
 
     load(i) {
@@ -101,86 +89,83 @@ export class Chocolat {
         }
 
         if (this.settings.currentImage === i) {
-            return
+            return Promise.resolve()
         }
 
         setTimeout(() => {
             this.elems.overlay.classList.add('chocolat-visible')
             this.elems.wrapper.classList.add('chocolat-visible')
-        })
+        }, 0)
 
         this.elems.domContainer.classList.add('chocolat-open')
 
         this.settings.timer = setTimeout(() => {
-            if (typeof this.elems != 'undefined') {
-                $(this.elems.loader).fadeIn()
+            if (this.elems !== undefined) {
+                this.elems.loader.classList.add('chocolat-visible')
             }
         }, this.settings.duration)
 
-        return this.preload(i)
-            .then((imgLoader) => {
+        const imgLoader = new Image()
+
+        return this.loadImage(this.settings.images[i].src, imgLoader)
+            .then(() => {
                 const nextIndex = i + 1
                 if (this.settings.images[nextIndex] != undefined) {
-                    this.preload(nextIndex)
+                    this.loadImage(this.settings.images[nextIndex].src, new Image())
                 }
 
-                return this.place(i, imgLoader)
-            })
-            .then((imgLoader) => {
-                return this.appear(i)
+                this.settings.currentImage = i
+
+                const place = this.place(imgLoader)
+                const appear = this.appear(i)
+                return Promise.all([place, appear])
             })
-            .then((imgLoader) => {
+            .then(() => {
                 this.zoomable()
                 this.settings.afterImageLoad()
             })
     }
 
-    place(i, imgLoader) {
-        var fitting
-
-        this.settings.currentImage = i
+    place(image) {
         this.description()
         this.pagination()
         this.arrows()
 
-        this.storeImgSize(imgLoader, i)
-
-        const { width, height, left, top } = this.fit(i, this.elems.wrapper)
-        return this.center(width, height, left, top, 0)
+        const { width, height, left, top } = this.fit(image, this.elems.wrapper)
+        return this.center(width, height, left, top)
     }
 
-    center(width, height, left, top, duration) {
-        return $(this.elems.content)
-            .css('overflow', 'visible')
-            .animate(
-                {
-                    width: width,
-                    height: height,
-                    left: left,
-                    top: top,
-                },
-                duration
-            )
-            .promise()
+    center(width, height, left, top) {
+        return this.transitionAsPromise(() => {
+            Object.assign(this.elems.content.style, {
+                width: width + 'px',
+                height: height + 'px',
+                left: left + 'px',
+                top: top + 'px',
+            })
+        }, this.elems.content)
     }
 
     appear(i) {
         clearTimeout(this.settings.timer)
 
-        return $(this.elems.loader)
-            .stop()
-            .fadeOut(300, () => {
-                $(this.elems.img).attr('src', this.settings.images[i].src)
-            })
-            .promise()
+        if (!this.elems.loader.classList.contains('chocolat-visible')) {
+            return this.loadImage(this.settings.images[i].src, this.elems.img)
+        }
+
+        return this.transitionAsPromise(() => {
+            this.elems.loader.classList.remove('chocolat-visible')
+        }, this.elems.loader).then(() => {
+            return this.loadImage(this.settings.images[i].src, this.elems.img)
+        })
     }
 
-    fit(i, container) {
+    fit(image, container) {
         let height
         let width
 
-        const imgHeight = this.settings.images[i].height
-        const imgWidth = this.settings.images[i].width
+        const imgHeight = image.height
+        const imgWidth = image.width
         const holderHeight = container.clientHeight
         const holderWidth = container.clientWidth
         const holderOutMarginH = this.getOutMarginH()
@@ -280,16 +265,6 @@ export class Chocolat {
         $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last)
     }
 
-    storeImgSize(img, i) {
-        if (typeof img === 'undefined') {
-            return
-        }
-        if (!this.settings.images[i].height || !this.settings.images[i].width) {
-            this.settings.images[i].height = img.height
-            this.settings.images[i].width = img.width
-        }
-    }
-
     close() {
         if (this.settings.fullscreenOpen) {
             this.exitFullScreen()
@@ -410,41 +385,13 @@ export class Chocolat {
     }
 
     openFullScreen() {
-        var wrapper = this.elems.wrapper
-
-        if (wrapper.requestFullscreen) {
-            this.settings.fullscreenOpen = true
-            wrapper.requestFullscreen()
-        } else if (wrapper.mozRequestFullScreen) {
-            this.settings.fullscreenOpen = true
-            wrapper.mozRequestFullScreen()
-        } else if (wrapper.webkitRequestFullscreen) {
-            this.settings.fullscreenOpen = true
-            wrapper.webkitRequestFullscreen()
-        } else if (wrapper.msRequestFullscreen) {
-            wrapper.msRequestFullscreen()
-            this.settings.fullscreenOpen = true
-        } else {
-            this.settings.fullscreenOpen = false
-        }
+        this.elems.wrapper.requestFullscreen()
+        this.settings.fullscreenOpen = true
     }
 
     exitFullScreen() {
-        if (document.exitFullscreen) {
-            document.exitFullscreen()
-            this.settings.fullscreenOpen = false
-        } else if (document.mozCancelFullScreen) {
-            document.mozCancelFullScreen()
-            this.settings.fullscreenOpen = false
-        } else if (document.webkitExitFullscreen) {
-            document.webkitExitFullscreen()
-            this.settings.fullscreenOpen = false
-        } else if (document.msExitFullscreen) {
-            document.msExitFullscreen()
-            this.settings.fullscreenOpen = false
-        } else {
-            this.settings.fullscreenOpen = true
-        }
+        document.exitFullscreen()
+        this.settings.fullscreenOpen = false
     }
 
     attachListeners() {
@@ -516,9 +463,7 @@ export class Chocolat {
             if (this.settings.initialZoomState === null) {
                 return
             }
-            if ($(this.elems.img).is(':animated')) {
-                return
-            }
+
             if (this.settings.currentImage === undefined) {
                 return
             }
@@ -528,8 +473,8 @@ export class Chocolat {
             var width = $(this.elems.wrapper).width()
 
             var currentImage = this.settings.images[this.settings.currentImage]
-            var imgWidth = currentImage.width
-            var imgHeight = currentImage.height
+            var imgWidth = this.elems.img.width
+            var imgHeight = this.elems.img.height
 
             var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top]
 
@@ -547,20 +492,8 @@ export class Chocolat {
                 mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY
             }
 
-            var animation = {
-                'margin-left': -mvtX + 'px',
-                'margin-top': -mvtY + 'px',
-            }
-
-            if (typeof e.duration !== 'undefined') {
-                $(this.elems.img)
-                    .stop(false, true)
-                    .animate(animation, e.duration)
-            } else {
-                $(this.elems.img)
-                    .stop(false, true)
-                    .css(animation)
-            }
+            this.elems.img.style.marginLeft = -mvtX + 'px'
+            this.elems.img.style.marginTop = -mvtY + 'px'
         })
 
         this.on(window, 'resize.chocolat', (e) => {
@@ -568,10 +501,7 @@ export class Chocolat {
                 return
             }
             this.debounce(50, () => {
-                const { width, height, left, top } = this.fit(
-                    this.settings.currentImage,
-                    this.elems.wrapper
-                )
+                const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
 
                 this.center(width, height, left, top, 0)
                 this.zoomable()
@@ -586,12 +516,12 @@ export class Chocolat {
 
         var isImageZoomable =
             this.settings.enableZoom &&
-            (currentImage.width > wrapperWidth || currentImage.height > wrapperHeight)
+            (this.elems.img.width > wrapperWidth || this.elems.img.height > wrapperHeight)
                 ? true
                 : false
         var isImageStretched =
-            this.elems.img.clientWidth > currentImage.width ||
-            this.elems.img.clientHeight > currentImage.height
+            this.elems.img.clientWidth > this.elems.img.width ||
+            this.elems.img.clientHeight > this.elems.img.height
 
         if (isImageZoomable && !isImageStretched) {
             this.elems.domContainer.classList.add('chocolat-zoomable')
@@ -604,16 +534,8 @@ export class Chocolat {
         this.settings.initialZoomState = this.settings.imageSize
         this.settings.imageSize = 'native'
 
-        var event = $.Event('mousemove')
-        event.pageX = e.pageX
-        event.pageY = e.pageY
-        event.duration = this.settings.duration
-        $(this.elems.wrapper).trigger(event)
         this.elems.domContainer.classList.add('chocolat-zoomed')
-        const { width, height, left, top } = this.fit(
-            this.settings.currentImage,
-            this.elems.wrapper
-        )
+        const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
 
         return this.center(width, height, left, top, this.settings.duration)
     }
@@ -626,13 +548,10 @@ export class Chocolat {
 
         this.settings.imageSize = this.settings.initialZoomState
         this.settings.initialZoomState = null
-        $(this.elems.img).animate({ margin: 0 }, duration)
+        this.elems.img.style.margin = 0
 
         this.elems.domContainer.classList.remove('chocolat-zoomed')
-        const { width, height, left, top } = this.fit(
-            this.settings.currentImage,
-            this.elems.wrapper
-        )
+        const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
         return this.center(width, height, left, top, duration)
     }
 
@@ -680,12 +599,23 @@ export class Chocolat {
 
     transitionAsPromise(triggeringFunc, el) {
         return new Promise((resolve) => {
-            triggeringFunc()
-            const handleTransitionEnded = (e) => {
-                el.removeEventListener('transitionend', handleTransitionEnded)
+            const handleTransitionEnd = () => {
+                el.removeEventListener('transitionend', handleTransitionEnd)
                 resolve()
             }
-            el.addEventListener('transitionend', handleTransitionEnded)
+            el.addEventListener('transitionend', handleTransitionEnd)
+
+            const classesBefore = el.getAttribute('class')
+            const stylesBefore = el.getAttribute('style')
+
+            triggeringFunc()
+
+            if (
+                classesBefore === el.getAttribute('class') &&
+                stylesBefore === el.getAttribute('style')
+            ) {
+                handleTransitionEnd()
+            }
         })
     }
 
@@ -717,7 +647,7 @@ export class Chocolat {
             },
 
             place: () => {
-                return this.place(this.settings.currentImage, this.settings.duration)
+                return this.place(this.elems.img, this.settings.duration)
             },
 
             destroy: () => {
diff --git a/test/test.js b/test/test.js
index 898b804..e04a790 100644
--- a/test/test.js
+++ b/test/test.js
@@ -213,7 +213,8 @@ describe('Chocolat', function() {
     describe('FullScreen', function() {
         it('should open fullscreen when clicking .fullscreen', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
-
+            // chocolat.openFullScreen = function () {}
+            // chocolat.exitFullScreen = function () {}
             // test only if browser fullscreenAPI is available
             if (
                 typeof Element.prototype.requestFullscreen === 'undefined' &&
@@ -678,14 +679,8 @@ describe('Chocolat', function() {
 // function used to calculate image dimensions
 // in order to be compared with what chocolat is really displaying
 function getExpectedDimensions(chocolat) {
-    var imgWidth = chocolat
-        .api()
-        .getElem('img')
-        .width()
-    var imgHeight = chocolat
-        .api()
-        .getElem('img')
-        .height()
+    var imgWidth = chocolat.api().getElem('img')[0].width
+    var imgHeight = chocolat.api().getElem('img')[0].height
 
     var containerWidth = $(chocolat.api().get('container')).width()
     var containerHeight = $(chocolat.api().get('container')).height()

From bdfcf57b4c2832ad2ce8f0f8acbc8c037feae261 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 29 Dec 2018 15:20:26 +0100
Subject: [PATCH 19/65] Use decode promise when loading image if available

---
 dist/js/chocolat.cjs.js  | 13 +++++++++----
 dist/js/chocolat.esm.js  | 13 +++++++++----
 dist/js/chocolat.iife.js | 13 +++++++++----
 src/js/chocolat.js       | 13 +++++++++----
 4 files changed, 36 insertions(+), 16 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 57391ef..bdfa493 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -73,11 +73,16 @@ class Chocolat {
   }
 
   loadImage(src, image) {
-    return new Promise(function (resolve, reject) {
-      image.onload = resolve;
-      image.onerror = resolve;
+    if ('decode' in image) {
       image.src = src;
-    });
+      return image.decode();
+    } else {
+      return new Promise(function (resolve, reject) {
+        image.onload = resolve;
+        image.onerror = resolve;
+        image.src = src;
+      });
+    }
   }
 
   load(i) {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 04c5ccf..baec4d6 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -71,11 +71,16 @@ class Chocolat {
   }
 
   loadImage(src, image) {
-    return new Promise(function (resolve, reject) {
-      image.onload = resolve;
-      image.onerror = resolve;
+    if ('decode' in image) {
       image.src = src;
-    });
+      return image.decode();
+    } else {
+      return new Promise(function (resolve, reject) {
+        image.onload = resolve;
+        image.onerror = resolve;
+        image.src = src;
+      });
+    }
   }
 
   load(i) {
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 3369dfb..9843914 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -74,11 +74,16 @@
       }
 
       loadImage(src, image) {
-        return new Promise(function (resolve, reject) {
-          image.onload = resolve;
-          image.onerror = resolve;
+        if ('decode' in image) {
           image.src = src;
-        });
+          return image.decode();
+        } else {
+          return new Promise(function (resolve, reject) {
+            image.onload = resolve;
+            image.onerror = resolve;
+            image.src = src;
+          });
+        }
       }
 
       load(i) {
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 3af76a3..91a828a 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -76,11 +76,16 @@ export class Chocolat {
     }
 
     loadImage(src, image) {
-        return new Promise(function(resolve, reject) {
-            image.onload = resolve
-            image.onerror = resolve
+        if ('decode' in image) {
             image.src = src
-        })
+            return image.decode()
+        } else {
+            return new Promise(function(resolve, reject) {
+                image.onload = resolve
+                image.onerror = resolve
+                image.src = src
+            })
+        }
     }
 
     load(i) {

From 7287c56283b5a8c77c07d1e3b25bf9a3287728c1 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 29 Dec 2018 15:24:07 +0100
Subject: [PATCH 20/65] Reverted fullscreen vendors call

---
 dist/js/chocolat.cjs.js  | 36 ++++++++++++++++++++++++++++++++----
 dist/js/chocolat.esm.js  | 36 ++++++++++++++++++++++++++++++++----
 dist/js/chocolat.iife.js | 36 ++++++++++++++++++++++++++++++++----
 src/js/chocolat.js       | 36 ++++++++++++++++++++++++++++++++----
 4 files changed, 128 insertions(+), 16 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index bdfa493..95e530c 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -370,13 +370,41 @@ class Chocolat {
   }
 
   openFullScreen() {
-    this.elems.wrapper.requestFullscreen();
-    this.settings.fullscreenOpen = true;
+    var wrapper = this.elems.wrapper;
+
+    if (wrapper.requestFullscreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.requestFullscreen();
+    } else if (wrapper.mozRequestFullScreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.mozRequestFullScreen();
+    } else if (wrapper.webkitRequestFullscreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.webkitRequestFullscreen();
+    } else if (wrapper.msRequestFullscreen) {
+      wrapper.msRequestFullscreen();
+      this.settings.fullscreenOpen = true;
+    } else {
+      this.settings.fullscreenOpen = false;
+    }
   }
 
   exitFullScreen() {
-    document.exitFullscreen();
-    this.settings.fullscreenOpen = false;
+    if (document.exitFullscreen) {
+      document.exitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.mozCancelFullScreen) {
+      document.mozCancelFullScreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.webkitExitFullscreen) {
+      document.webkitExitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.msExitFullscreen) {
+      document.msExitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else {
+      this.settings.fullscreenOpen = true;
+    }
   }
 
   attachListeners() {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index baec4d6..999ae25 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -368,13 +368,41 @@ class Chocolat {
   }
 
   openFullScreen() {
-    this.elems.wrapper.requestFullscreen();
-    this.settings.fullscreenOpen = true;
+    var wrapper = this.elems.wrapper;
+
+    if (wrapper.requestFullscreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.requestFullscreen();
+    } else if (wrapper.mozRequestFullScreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.mozRequestFullScreen();
+    } else if (wrapper.webkitRequestFullscreen) {
+      this.settings.fullscreenOpen = true;
+      wrapper.webkitRequestFullscreen();
+    } else if (wrapper.msRequestFullscreen) {
+      wrapper.msRequestFullscreen();
+      this.settings.fullscreenOpen = true;
+    } else {
+      this.settings.fullscreenOpen = false;
+    }
   }
 
   exitFullScreen() {
-    document.exitFullscreen();
-    this.settings.fullscreenOpen = false;
+    if (document.exitFullscreen) {
+      document.exitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.mozCancelFullScreen) {
+      document.mozCancelFullScreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.webkitExitFullscreen) {
+      document.webkitExitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else if (document.msExitFullscreen) {
+      document.msExitFullscreen();
+      this.settings.fullscreenOpen = false;
+    } else {
+      this.settings.fullscreenOpen = true;
+    }
   }
 
   attachListeners() {
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 9843914..b4a462a 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -371,13 +371,41 @@
       }
 
       openFullScreen() {
-        this.elems.wrapper.requestFullscreen();
-        this.settings.fullscreenOpen = true;
+        var wrapper = this.elems.wrapper;
+
+        if (wrapper.requestFullscreen) {
+          this.settings.fullscreenOpen = true;
+          wrapper.requestFullscreen();
+        } else if (wrapper.mozRequestFullScreen) {
+          this.settings.fullscreenOpen = true;
+          wrapper.mozRequestFullScreen();
+        } else if (wrapper.webkitRequestFullscreen) {
+          this.settings.fullscreenOpen = true;
+          wrapper.webkitRequestFullscreen();
+        } else if (wrapper.msRequestFullscreen) {
+          wrapper.msRequestFullscreen();
+          this.settings.fullscreenOpen = true;
+        } else {
+          this.settings.fullscreenOpen = false;
+        }
       }
 
       exitFullScreen() {
-        document.exitFullscreen();
-        this.settings.fullscreenOpen = false;
+        if (document.exitFullscreen) {
+          document.exitFullscreen();
+          this.settings.fullscreenOpen = false;
+        } else if (document.mozCancelFullScreen) {
+          document.mozCancelFullScreen();
+          this.settings.fullscreenOpen = false;
+        } else if (document.webkitExitFullscreen) {
+          document.webkitExitFullscreen();
+          this.settings.fullscreenOpen = false;
+        } else if (document.msExitFullscreen) {
+          document.msExitFullscreen();
+          this.settings.fullscreenOpen = false;
+        } else {
+          this.settings.fullscreenOpen = true;
+        }
       }
 
       attachListeners() {
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 91a828a..56cfa80 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -390,13 +390,41 @@ export class Chocolat {
     }
 
     openFullScreen() {
-        this.elems.wrapper.requestFullscreen()
-        this.settings.fullscreenOpen = true
+        var wrapper = this.elems.wrapper
+
+        if (wrapper.requestFullscreen) {
+            this.settings.fullscreenOpen = true
+            wrapper.requestFullscreen()
+        } else if (wrapper.mozRequestFullScreen) {
+            this.settings.fullscreenOpen = true
+            wrapper.mozRequestFullScreen()
+        } else if (wrapper.webkitRequestFullscreen) {
+            this.settings.fullscreenOpen = true
+            wrapper.webkitRequestFullscreen()
+        } else if (wrapper.msRequestFullscreen) {
+            wrapper.msRequestFullscreen()
+            this.settings.fullscreenOpen = true
+        } else {
+            this.settings.fullscreenOpen = false
+        }
     }
 
     exitFullScreen() {
-        document.exitFullscreen()
-        this.settings.fullscreenOpen = false
+        if (document.exitFullscreen) {
+            document.exitFullscreen()
+            this.settings.fullscreenOpen = false
+        } else if (document.mozCancelFullScreen) {
+            document.mozCancelFullScreen()
+            this.settings.fullscreenOpen = false
+        } else if (document.webkitExitFullscreen) {
+            document.webkitExitFullscreen()
+            this.settings.fullscreenOpen = false
+        } else if (document.msExitFullscreen) {
+            document.msExitFullscreen()
+            this.settings.fullscreenOpen = false
+        } else {
+            this.settings.fullscreenOpen = true
+        }
     }
 
     attachListeners() {

From 8356f45156a2431ff2efe0687b53a1315933edb9 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 29 Dec 2018 17:09:39 +0100
Subject: [PATCH 21/65] Fix settings.images being mutated and all instaces
 pushing images in it

---
 src/js/main.esm.js  | 4 +++-
 src/js/main.iife.js | 4 +++-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/js/main.esm.js b/src/js/main.esm.js
index 013561e..8e7e3f2 100644
--- a/src/js/main.esm.js
+++ b/src/js/main.esm.js
@@ -3,7 +3,9 @@ import { Chocolat, defaults } from './chocolat.js'
 const instances = []
 
 export default function(options) {
-    const settings = Object.assign({}, defaults, options, { setIndex: instances.length })
+    const settings = Object.assign({}, defaults, { images: [] }, options, {
+        setIndex: instances.length,
+    })
     const instance = new Chocolat(elements, settings)
 
     instances.push(instance)
diff --git a/src/js/main.iife.js b/src/js/main.iife.js
index 1cfd8a6..e254085 100644
--- a/src/js/main.iife.js
+++ b/src/js/main.iife.js
@@ -3,7 +3,9 @@ import { Chocolat, defaults } from './chocolat.js'
 const instances = []
 
 window.Chocolat = function(elements, options) {
-    const settings = Object.assign({}, defaults, options, { setIndex: instances.length })
+    const settings = Object.assign({}, defaults, { images: [] }, options, {
+        setIndex: instances.length,
+    })
     const instance = new Chocolat(elements, settings)
 
     instances.push(instance)

From 045ea24ec6599b5819d25686a701979d2bd3a494 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 29 Dec 2018 17:10:01 +0100
Subject: [PATCH 22/65] Pagination, setTitle and description are now functions

---
 dist/index.html          |  2 +-
 dist/js/chocolat.cjs.js  | 32 ++++++++-------
 dist/js/chocolat.esm.js  | 32 ++++++++-------
 dist/js/chocolat.iife.js | 32 ++++++++-------
 src/js/chocolat.js       | 30 +++++++-------
 test/test.js             | 86 ++++++++++++++++++++++++++++++++++++++--
 6 files changed, 150 insertions(+), 64 deletions(-)

diff --git a/dist/index.html b/dist/index.html
index 131d2ac..cb22cd2 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -142,7 +142,7 @@ <h2>
         <script>
             $(function(){
                 var instance = Chocolat([], {
-                    setTitle : 'set title',
+                    setTitle : function () { return 'set title' },
                     loop: true,
                     images : [
                         {src : 'demo-images/1.jpg', title : 'caption 1'},
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 95e530c..caefe6a 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -11,8 +11,6 @@ const defaults = {
   loop: false,
   linkImages: true,
   duration: 300,
-  setTitle: '',
-  separator2: '/',
   setIndex: 0,
   firstImage: 0,
   lastImage: false,
@@ -23,6 +21,17 @@ const defaults = {
   images: [],
   enableZoom: true,
   imageSource: 'href',
+  setTitle: function () {
+    return '';
+  },
+  description: function () {
+    return this.settings.images[this.settings.currentImage].title;
+  },
+  pagination: function () {
+    var last = this.settings.lastImage + 1;
+    var position = this.settings.currentImage + 1;
+    return position + '/' + last;
+  },
 
   afterInitialize() {},
 
@@ -123,8 +132,8 @@ class Chocolat {
   }
 
   place(image) {
-    this.description();
-    this.pagination();
+    this.elems.description.textContent = this.settings.description.call(this);
+    this.elems.pagination.textContent = this.settings.pagination.call(this);
     this.arrows();
     const {
       width,
@@ -251,16 +260,6 @@ class Chocolat {
     }
   }
 
-  description() {
-    $(this.elems.description).html(this.settings.images[this.settings.currentImage].title);
-  }
-
-  pagination() {
-    var last = this.settings.lastImage + 1;
-    var position = this.settings.currentImage + 1;
-    $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
-  }
-
   close() {
     if (this.settings.fullscreenOpen) {
       this.exitFullScreen();
@@ -365,6 +364,7 @@ class Chocolat {
     this.elems.bottom.appendChild(this.elems.pagination);
     this.elems.setTitle = document.createElement('span');
     this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
+    this.elems.setTitle.textContent = this.settings.setTitle();
     this.elems.bottom.appendChild(this.elems.setTitle);
     this.settings.afterMarkup.call(this);
   }
@@ -667,7 +667,9 @@ class Chocolat {
 
 const instances = [];
 function main_esm (options) {
-  const settings = Object.assign({}, defaults, options, {
+  const settings = Object.assign({}, defaults, {
+    images: []
+  }, options, {
     setIndex: instances.length
   });
   const instance = new Chocolat(elements, settings);
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 999ae25..3f8a839 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -9,8 +9,6 @@ const defaults = {
   loop: false,
   linkImages: true,
   duration: 300,
-  setTitle: '',
-  separator2: '/',
   setIndex: 0,
   firstImage: 0,
   lastImage: false,
@@ -21,6 +19,17 @@ const defaults = {
   images: [],
   enableZoom: true,
   imageSource: 'href',
+  setTitle: function () {
+    return '';
+  },
+  description: function () {
+    return this.settings.images[this.settings.currentImage].title;
+  },
+  pagination: function () {
+    var last = this.settings.lastImage + 1;
+    var position = this.settings.currentImage + 1;
+    return position + '/' + last;
+  },
 
   afterInitialize() {},
 
@@ -121,8 +130,8 @@ class Chocolat {
   }
 
   place(image) {
-    this.description();
-    this.pagination();
+    this.elems.description.textContent = this.settings.description.call(this);
+    this.elems.pagination.textContent = this.settings.pagination.call(this);
     this.arrows();
     const {
       width,
@@ -249,16 +258,6 @@ class Chocolat {
     }
   }
 
-  description() {
-    $(this.elems.description).html(this.settings.images[this.settings.currentImage].title);
-  }
-
-  pagination() {
-    var last = this.settings.lastImage + 1;
-    var position = this.settings.currentImage + 1;
-    $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
-  }
-
   close() {
     if (this.settings.fullscreenOpen) {
       this.exitFullScreen();
@@ -363,6 +362,7 @@ class Chocolat {
     this.elems.bottom.appendChild(this.elems.pagination);
     this.elems.setTitle = document.createElement('span');
     this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
+    this.elems.setTitle.textContent = this.settings.setTitle();
     this.elems.bottom.appendChild(this.elems.setTitle);
     this.settings.afterMarkup.call(this);
   }
@@ -665,7 +665,9 @@ class Chocolat {
 
 const instances = [];
 function main_esm (options) {
-  const settings = Object.assign({}, defaults, options, {
+  const settings = Object.assign({}, defaults, {
+    images: []
+  }, options, {
     setIndex: instances.length
   });
   const instance = new Chocolat(elements, settings);
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index b4a462a..2b9becc 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -12,8 +12,6 @@
       loop: false,
       linkImages: true,
       duration: 300,
-      setTitle: '',
-      separator2: '/',
       setIndex: 0,
       firstImage: 0,
       lastImage: false,
@@ -24,6 +22,17 @@
       images: [],
       enableZoom: true,
       imageSource: 'href',
+      setTitle: function () {
+        return '';
+      },
+      description: function () {
+        return this.settings.images[this.settings.currentImage].title;
+      },
+      pagination: function () {
+        var last = this.settings.lastImage + 1;
+        var position = this.settings.currentImage + 1;
+        return position + '/' + last;
+      },
 
       afterInitialize() {},
 
@@ -124,8 +133,8 @@
       }
 
       place(image) {
-        this.description();
-        this.pagination();
+        this.elems.description.textContent = this.settings.description.call(this);
+        this.elems.pagination.textContent = this.settings.pagination.call(this);
         this.arrows();
         const {
           width,
@@ -252,16 +261,6 @@
         }
       }
 
-      description() {
-        $(this.elems.description).html(this.settings.images[this.settings.currentImage].title);
-      }
-
-      pagination() {
-        var last = this.settings.lastImage + 1;
-        var position = this.settings.currentImage + 1;
-        $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last);
-      }
-
       close() {
         if (this.settings.fullscreenOpen) {
           this.exitFullScreen();
@@ -366,6 +365,7 @@
         this.elems.bottom.appendChild(this.elems.pagination);
         this.elems.setTitle = document.createElement('span');
         this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
+        this.elems.setTitle.textContent = this.settings.setTitle();
         this.elems.bottom.appendChild(this.elems.setTitle);
         this.settings.afterMarkup.call(this);
       }
@@ -669,7 +669,9 @@
     const instances = [];
 
     window.Chocolat = function (elements, options) {
-      const settings = Object.assign({}, defaults, options, {
+      const settings = Object.assign({}, defaults, {
+        images: []
+      }, options, {
         setIndex: instances.length
       });
       const instance = new Chocolat(elements, settings);
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 56cfa80..916a781 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -7,8 +7,6 @@ export const defaults = {
     loop: false,
     linkImages: true,
     duration: 300,
-    setTitle: '',
-    separator2: '/',
     setIndex: 0,
     firstImage: 0,
     lastImage: false,
@@ -19,6 +17,18 @@ export const defaults = {
     images: [],
     enableZoom: true,
     imageSource: 'href',
+    setTitle: function() {
+        return ''
+    },
+    description: function() {
+        return this.settings.images[this.settings.currentImage].title
+    },
+    pagination: function() {
+        var last = this.settings.lastImage + 1
+        var position = this.settings.currentImage + 1
+
+        return position + '/' + last
+    },
     afterInitialize() {},
     afterMarkup() {},
     afterImageLoad() {},
@@ -132,8 +142,8 @@ export class Chocolat {
     }
 
     place(image) {
-        this.description()
-        this.pagination()
+        this.elems.description.textContent = this.settings.description.call(this)
+        this.elems.pagination.textContent = this.settings.pagination.call(this)
         this.arrows()
 
         const { width, height, left, top } = this.fit(image, this.elems.wrapper)
@@ -259,17 +269,6 @@ export class Chocolat {
         }
     }
 
-    description() {
-        $(this.elems.description).html(this.settings.images[this.settings.currentImage].title)
-    }
-
-    pagination() {
-        var last = this.settings.lastImage + 1
-        var position = this.settings.currentImage + 1
-
-        $(this.elems.pagination).html(position + ' ' + this.settings.separator2 + last)
-    }
-
     close() {
         if (this.settings.fullscreenOpen) {
             this.exitFullScreen()
@@ -384,6 +383,7 @@ export class Chocolat {
 
         this.elems.setTitle = document.createElement('span')
         this.elems.setTitle.setAttribute('class', 'chocolat-set-title')
+        this.elems.setTitle.textContent = this.settings.setTitle()
         this.elems.bottom.appendChild(this.elems.setTitle)
 
         this.settings.afterMarkup.call(this)
diff --git a/test/test.js b/test/test.js
index e04a790..9a0dfc2 100644
--- a/test/test.js
+++ b/test/test.js
@@ -136,7 +136,7 @@ describe('Chocolat', function() {
             expect(spyMarkup.calledOnce).to.be.true
         })
 
-        return it('should append description element in top element (instead of bottom, the default behaviour)', function() {
+        it('should append description element in top element (instead of bottom, the default behaviour)', function() {
             var afterMarkup = function() {
                 return $(this.elems.description).appendTo(this.elems.top)
             }
@@ -166,6 +166,86 @@ describe('Chocolat', function() {
                     .find(chocolat.api().getElem('description')).length
             ).to.equal(0)
         })
+
+        it('can define a title', function() {
+            var setTitle = function() {
+                return 'hello'
+            }
+
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
+                container: $('#container')[0],
+                setTitle: setTitle,
+            })
+
+            $('#example0')
+                .find('.chocolat-image')
+                .first()[0]
+                .click()
+
+            const elem = chocolat.api().getElem('setTitle')[0]
+            expect(elem.textContent).to.equal('hello')
+        })
+
+        it('can define a description per image', function(done) {
+            var description = function() {
+                return (
+                    'prefix ' + this.settings.images[this.settings.currentImage].title + ' suffix'
+                )
+            }
+
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
+                container: $('#container')[0],
+                description: description,
+            })
+
+            chocolat
+                .api()
+                .open()
+                .then(() => {
+                    const elem = chocolat.api().getElem('description')[0]
+                    expect(elem.textContent).to.equal('prefix foo suffix')
+
+                    chocolat
+                        .api()
+                        .next()
+                        .then(() => {
+                            const elem = chocolat.api().getElem('description')[0]
+                            expect(elem.textContent).to.equal('prefix baz suffix')
+                            done()
+                        })
+                })
+        })
+
+        it('can define a pagination per image', function(done) {
+            var pagination = function() {
+                var last = this.settings.lastImage + 1
+                var position = this.settings.currentImage + 1
+
+                return 'prefix ' + position + '/' + last + ' suffix'
+            }
+
+            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
+                container: $('#container')[0],
+                pagination: pagination,
+            })
+
+            chocolat
+                .api()
+                .open()
+                .then(() => {
+                    const elem = chocolat.api().getElem('pagination')[0]
+                    expect(elem.textContent).to.equal('prefix 1/3 suffix')
+
+                    chocolat
+                        .api()
+                        .next()
+                        .then(() => {
+                            const elem = chocolat.api().getElem('pagination')[0]
+                            expect(elem.textContent).to.equal('prefix 2/3 suffix')
+                            done()
+                        })
+                })
+        })
     })
 
     describe('Destroy method', function() {
@@ -202,19 +282,19 @@ describe('Chocolat', function() {
             var spyInit = sinon.spy(chocolat, 'init')
 
             const link = links[0]
+            const linkBefore = link.getAttribute('href')
 
             link.setAttribute('href', '#')
             link.click()
 
             expect(spyInit.notCalled).to.be.true
+            link.setAttribute('href', linkBefore)
         })
     })
 
     describe('FullScreen', function() {
         it('should open fullscreen when clicking .fullscreen', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
-            // chocolat.openFullScreen = function () {}
-            // chocolat.exitFullScreen = function () {}
             // test only if browser fullscreenAPI is available
             if (
                 typeof Element.prototype.requestFullscreen === 'undefined' &&

From 5264e3c68b6b63c38e140b2fd709290b875067d1 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 30 Dec 2018 11:01:47 +0100
Subject: [PATCH 23/65] Removed jquery from mousemove event

---
 dist/js/chocolat.cjs.js  | 18 +++++++++++-------
 dist/js/chocolat.esm.js  | 18 +++++++++++-------
 dist/js/chocolat.iife.js | 18 +++++++++++-------
 src/js/chocolat.js       | 22 ++++++++++++++--------
 4 files changed, 47 insertions(+), 29 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index caefe6a..f47c483 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -172,8 +172,8 @@ class Chocolat {
   fit(image, container) {
     let height;
     let width;
-    const imgHeight = image.height;
-    const imgWidth = image.width;
+    const imgHeight = image.naturalHeight;
+    const imgWidth = image.naturalWidth;
     const holderHeight = container.clientHeight;
     const holderWidth = container.clientWidth;
     const holderOutMarginH = this.getOutMarginH();
@@ -472,9 +472,13 @@ class Chocolat {
         return;
       }
 
-      var pos = $(this.elems.wrapper).offset();
-      var height = $(this.elems.wrapper).height();
-      var width = $(this.elems.wrapper).width();
+      const rect = this.elems.wrapper.getBoundingClientRect();
+      const pos = {
+        top: rect.top + window.scrollY,
+        left: rect.left + window.scrollX
+      };
+      var height = this.elems.wrapper.clientHeight;
+      var width = this.elems.wrapper.clientWidth;
       var currentImage = this.settings.images[this.settings.currentImage];
       var imgWidth = this.elems.img.width;
       var imgHeight = this.elems.img.height;
@@ -520,8 +524,8 @@ class Chocolat {
     var currentImage = this.settings.images[this.settings.currentImage];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
-    var isImageZoomable = this.settings.enableZoom && (this.elems.img.width > wrapperWidth || this.elems.img.height > wrapperHeight) ? true : false;
-    var isImageStretched = this.elems.img.clientWidth > this.elems.img.width || this.elems.img.clientHeight > this.elems.img.height;
+    var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+    var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
     if (isImageZoomable && !isImageStretched) {
       this.elems.domContainer.classList.add('chocolat-zoomable');
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 3f8a839..493be14 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -170,8 +170,8 @@ class Chocolat {
   fit(image, container) {
     let height;
     let width;
-    const imgHeight = image.height;
-    const imgWidth = image.width;
+    const imgHeight = image.naturalHeight;
+    const imgWidth = image.naturalWidth;
     const holderHeight = container.clientHeight;
     const holderWidth = container.clientWidth;
     const holderOutMarginH = this.getOutMarginH();
@@ -470,9 +470,13 @@ class Chocolat {
         return;
       }
 
-      var pos = $(this.elems.wrapper).offset();
-      var height = $(this.elems.wrapper).height();
-      var width = $(this.elems.wrapper).width();
+      const rect = this.elems.wrapper.getBoundingClientRect();
+      const pos = {
+        top: rect.top + window.scrollY,
+        left: rect.left + window.scrollX
+      };
+      var height = this.elems.wrapper.clientHeight;
+      var width = this.elems.wrapper.clientWidth;
       var currentImage = this.settings.images[this.settings.currentImage];
       var imgWidth = this.elems.img.width;
       var imgHeight = this.elems.img.height;
@@ -518,8 +522,8 @@ class Chocolat {
     var currentImage = this.settings.images[this.settings.currentImage];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
-    var isImageZoomable = this.settings.enableZoom && (this.elems.img.width > wrapperWidth || this.elems.img.height > wrapperHeight) ? true : false;
-    var isImageStretched = this.elems.img.clientWidth > this.elems.img.width || this.elems.img.clientHeight > this.elems.img.height;
+    var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+    var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
     if (isImageZoomable && !isImageStretched) {
       this.elems.domContainer.classList.add('chocolat-zoomable');
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 2b9becc..d064b24 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -173,8 +173,8 @@
       fit(image, container) {
         let height;
         let width;
-        const imgHeight = image.height;
-        const imgWidth = image.width;
+        const imgHeight = image.naturalHeight;
+        const imgWidth = image.naturalWidth;
         const holderHeight = container.clientHeight;
         const holderWidth = container.clientWidth;
         const holderOutMarginH = this.getOutMarginH();
@@ -473,9 +473,13 @@
             return;
           }
 
-          var pos = $(this.elems.wrapper).offset();
-          var height = $(this.elems.wrapper).height();
-          var width = $(this.elems.wrapper).width();
+          const rect = this.elems.wrapper.getBoundingClientRect();
+          const pos = {
+            top: rect.top + window.scrollY,
+            left: rect.left + window.scrollX
+          };
+          var height = this.elems.wrapper.clientHeight;
+          var width = this.elems.wrapper.clientWidth;
           var currentImage = this.settings.images[this.settings.currentImage];
           var imgWidth = this.elems.img.width;
           var imgHeight = this.elems.img.height;
@@ -521,8 +525,8 @@
         var currentImage = this.settings.images[this.settings.currentImage];
         var wrapperWidth = this.elems.wrapper.clientWidth;
         var wrapperHeight = this.elems.wrapper.clientHeight;
-        var isImageZoomable = this.settings.enableZoom && (this.elems.img.width > wrapperWidth || this.elems.img.height > wrapperHeight) ? true : false;
-        var isImageStretched = this.elems.img.clientWidth > this.elems.img.width || this.elems.img.clientHeight > this.elems.img.height;
+        var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+        var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
         if (isImageZoomable && !isImageStretched) {
           this.elems.domContainer.classList.add('chocolat-zoomable');
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 916a781..c21cad2 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -179,8 +179,8 @@ export class Chocolat {
         let height
         let width
 
-        const imgHeight = image.height
-        const imgWidth = image.width
+        const imgHeight = image.naturalHeight
+        const imgWidth = image.naturalWidth
         const holderHeight = container.clientHeight
         const holderWidth = container.clientWidth
         const holderOutMarginH = this.getOutMarginH()
@@ -501,9 +501,14 @@ export class Chocolat {
                 return
             }
 
-            var pos = $(this.elems.wrapper).offset()
-            var height = $(this.elems.wrapper).height()
-            var width = $(this.elems.wrapper).width()
+            const rect = this.elems.wrapper.getBoundingClientRect()
+            const pos = {
+                top: rect.top + window.scrollY,
+                left: rect.left + window.scrollX,
+            }
+
+            var height = this.elems.wrapper.clientHeight
+            var width = this.elems.wrapper.clientWidth
 
             var currentImage = this.settings.images[this.settings.currentImage]
             var imgWidth = this.elems.img.width
@@ -549,12 +554,13 @@ export class Chocolat {
 
         var isImageZoomable =
             this.settings.enableZoom &&
-            (this.elems.img.width > wrapperWidth || this.elems.img.height > wrapperHeight)
+            (this.elems.img.naturalWidth > wrapperWidth ||
+                this.elems.img.naturalHeight > wrapperHeight)
                 ? true
                 : false
         var isImageStretched =
-            this.elems.img.clientWidth > this.elems.img.width ||
-            this.elems.img.clientHeight > this.elems.img.height
+            this.elems.img.clientWidth > this.elems.img.naturalWidth ||
+            this.elems.img.clientHeight > this.elems.img.naturalHeight
 
         if (isImageZoomable && !isImageStretched) {
             this.elems.domContainer.classList.add('chocolat-zoomable')

From b67b82d4dae956973dfc353f03cf61e73bb6966f Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 7 Jan 2019 11:07:31 +0100
Subject: [PATCH 24/65] :wave: jQuery

---
 dist/index.html          | 203 +++++++++++++++++++--------------------
 dist/js/chocolat.cjs.js  |   8 +-
 dist/js/chocolat.esm.js  |   8 +-
 dist/js/chocolat.iife.js |   8 +-
 src/js/chocolat.js       |   8 +-
 test/test.js             |  79 ++++++---------
 6 files changed, 141 insertions(+), 173 deletions(-)

diff --git a/dist/index.html b/dist/index.html
index cb22cd2..d3c19c5 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -3,7 +3,6 @@
     <head>
         <meta charset="utf-8" />
         <link rel="stylesheet" href="./css/chocolat.css" />
-        <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
         <script type="text/javascript" src="./js/chocolat.iife.js"></script>
         <style>
             body {
@@ -27,30 +26,7 @@
             }
         </style>
         <title>Chocolat — demo</title>
-        <script>
-            $(function(){
-                Chocolat($('#example0')[0].querySelectorAll('.chocolat-image'), {
-                    imageSize: 'contain'
-                })
-
-                Chocolat($('#example1')[0].querySelectorAll('.chocolat-image'), {
-                    loop           : true,
-                    imageSize     : 'cover',
-                    overlayOpacity : 0.9
-                })
 
-                Chocolat($('#example2')[0].querySelectorAll('.chocolat-image'), {
-                    container      : $('#container1')[0],
-                    imageSize     : 'contain',
-                    loop           : true,
-                })
-
-                Chocolat($('#example3')[0].querySelectorAll('.chocolat-image'), {
-                    container      : $('#container2')[0],
-                    imageSize     : 'cover',
-                })
-            })
-        </script>
     </head>
     <body>
         <div style="text-align: center;background: #E8E8E8; padding: 10px;margin-bottom: 10px;">
@@ -138,105 +114,126 @@ <h2>
         <a class="api-close" href="#">Close</a>
         <!-- Container (notice the relative width) :  -->
         <div id="container3" style="width: 80%; max-width:1000px; height: 600px; background: #E0E0E0; margin:auto;"></div>
+        <script>
+            // standard demos
+            Chocolat(document.querySelectorAll('#example0 .chocolat-image'), {
+                imageSize: 'contain'
+            })
+
+            Chocolat(document.querySelectorAll('#example1 .chocolat-image'), {
+                loop: true,
+                imageSize: 'cover',
+                overlayOpacity: 0.9
+            })
+
+            Chocolat(document.querySelectorAll('#example2 .chocolat-image'), {
+                container: document.querySelector('#container1'),
+                imageSize: 'contain',
+                loop: true,
+            })
 
+            Chocolat(document.querySelectorAll('#example3 .chocolat-image'), {
+                container: document.querySelector('#container2'),
+                imageSize: 'cover',
+            })
+        </script>
         <script>
-            $(function(){
-                var instance = Chocolat([], {
-                    setTitle : function () { return 'set title' },
-                    loop: true,
-                    images : [
-                        {src : 'demo-images/1.jpg', title : 'caption 1'},
-                        {src : 'demo-images/6.jpg', title : 'caption 2'},
-                        {src : 'demo-images/8.jpg', title : 'caption 3'},
-                    ],
-                    imageSize : 'contain',
-                    container : $('#container3')[0],
-                    afterMarkup: function () {
-                        console.log('afterMarkup hook is called')
-                    },
-                    afterImageLoad: function () {
-                        console.log('afterImageLoad hook is called')
-                    },
-                    afterInitialize: function () {
-                        console.log('afterInitialize hook is called')
-                    },
-                    zoomedPaddingX: function (imgWidth, canvasWidth) {
-                        // add a padding around the zoomed image
-                        // default to 0
-                        return canvasWidth / 4;
-                    },
-                    zoomedPaddingY: function (imgHeight, canvasHeight) {
-                        // add a padding around the zoomed image
-                        // default to 0
-                        return canvasHeight / 4;
-                    }
-                });
-
-                $('.api-open').on('click', function(e) {
-                    e.preventDefault()
-
-                    console.log('open start');
-                    var def = instance.api().open()
-
-                    def.then(function(){
-                        console.log('open done');
-                    })
+            // api demo
+            var instance = Chocolat([], {
+                setTitle : function () { return 'set title' },
+                loop: true,
+                images : [
+                    {src : 'demo-images/1.jpg', title : 'caption 1'},
+                    {src : 'demo-images/6.jpg', title : 'caption 2'},
+                    {src : 'demo-images/8.jpg', title : 'caption 3'},
+                ],
+                imageSize : 'contain',
+                container: document.querySelector('#container3'),
+                afterMarkup: function () {
+                    console.log('afterMarkup hook is called')
+                },
+                afterImageLoad: function () {
+                    console.log('afterImageLoad hook is called')
+                },
+                afterInitialize: function () {
+                    console.log('afterInitialize hook is called')
+                },
+                zoomedPaddingX: function (imgWidth, canvasWidth) {
+                    // add a padding around the zoomed image
+                    // default to 0
+                    return canvasWidth / 4;
+                },
+                zoomedPaddingY: function (imgHeight, canvasHeight) {
+                    // add a padding around the zoomed image
+                    // default to 0
+                    return canvasHeight / 4;
+                }
+            });
+            document.querySelector('.api-open').addEventListener('click', function(e) {
+                e.preventDefault()
+
+                console.log('open start');
+                var def = instance.api().open()
+
+                def.then(function(){
+                    console.log('open done');
                 })
-                $('.api-close').on('click', function(e) {
-                    e.preventDefault()
+            })
 
-                    console.log('close start');
-                    var def = instance.api().close()
+            document.querySelector('.api-close').addEventListener('click', function(e) {
+                e.preventDefault()
 
-                    def.then(function(){
-                        console.log('close done');
-                    })
+                console.log('close start');
+                var def = instance.api().close()
+
+                def.then(function(){
+                    console.log('close done');
                 })
-                $('.api-prev').on('click', function(e) {
-                    e.preventDefault()
+            })
+            document.querySelector('.api-prev').addEventListener('click', function(e) {
+                e.preventDefault()
 
-                    console.log('prev start');
-                    var def = instance.api().prev()
+                console.log('prev start');
+                var def = instance.api().prev()
 
-                    def.then(function(){
-                        console.log('prev done');
-                    })
+                def.then(function(){
+                    console.log('prev done');
                 })
-                $('.api-next').on('click', function(e) {
-                    e.preventDefault()
+            })
+            document.querySelector('.api-next').addEventListener('click', function(e) {
+                e.preventDefault()
 
-                    console.log('next start');
-                    var def = instance.api().next()
+                console.log('next start');
+                var def = instance.api().next()
 
-                    def.then(function(){
-                        console.log('next done');
-                    })
+                def.then(function(){
+                    console.log('next done');
                 })
+            })
 
-                $('.api-cover').on('click', function(e) {
-                    e.preventDefault()
+            document.querySelector('.api-cover').addEventListener('click', function(e) {
+                e.preventDefault()
 
-                    console.log('cover mode start')
-                    instance.api().set('imageSize', 'cover')
-                    var def = instance.api().place()
+                console.log('cover mode start')
+                instance.api().set('imageSize', 'cover')
+                var def = instance.api().place()
 
-                    def.then(function(){
-                        console.log('cover mode done')
-                    })
+                def.then(function(){
+                    console.log('cover mode done')
                 })
+            })
 
-                $('.api-contain').on('click', function(e) {
-                    e.preventDefault()
+            document.querySelector('.api-contain').addEventListener('click', function(e) {
+                e.preventDefault()
 
-                    console.log('contain mode start')
-                    instance.api().set('imageSize', 'contain')
-                    var def = instance.api().place()
+                console.log('contain mode start')
+                instance.api().set('imageSize', 'contain')
+                var def = instance.api().place()
 
-                    def.then(function(){
-                        console.log('contain mode done')
-                    })
+                def.then(function(){
+                    console.log('contain mode done')
                 })
-            });
+            })
         </script>
     </body>
 
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index f47c483..4ffe90e 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -302,13 +302,11 @@ class Chocolat {
   }
 
   getOutMarginW() {
-    var left = $(this.elems.left).outerWidth(true);
-    var right = $(this.elems.right).outerWidth(true);
-    return left + right;
+    return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
   }
 
   getOutMarginH() {
-    return $(this.elems.top).outerHeight(true) + $(this.elems.bottom).outerHeight(true);
+    return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
   }
 
   markup() {
@@ -662,7 +660,7 @@ class Chocolat {
         return this.settings[property];
       },
       getElem: name => {
-        return $(this.elems[name]);
+        return this.elems[name];
       }
     };
   }
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 493be14..685c9cf 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -300,13 +300,11 @@ class Chocolat {
   }
 
   getOutMarginW() {
-    var left = $(this.elems.left).outerWidth(true);
-    var right = $(this.elems.right).outerWidth(true);
-    return left + right;
+    return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
   }
 
   getOutMarginH() {
-    return $(this.elems.top).outerHeight(true) + $(this.elems.bottom).outerHeight(true);
+    return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
   }
 
   markup() {
@@ -660,7 +658,7 @@ class Chocolat {
         return this.settings[property];
       },
       getElem: name => {
-        return $(this.elems[name]);
+        return this.elems[name];
       }
     };
   }
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index d064b24..db19389 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -303,13 +303,11 @@
       }
 
       getOutMarginW() {
-        var left = $(this.elems.left).outerWidth(true);
-        var right = $(this.elems.right).outerWidth(true);
-        return left + right;
+        return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
       }
 
       getOutMarginH() {
-        return $(this.elems.top).outerHeight(true) + $(this.elems.bottom).outerHeight(true);
+        return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
       }
 
       markup() {
@@ -663,7 +661,7 @@
             return this.settings[property];
           },
           getElem: name => {
-            return $(this.elems[name]);
+            return this.elems[name];
           }
         };
       }
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index c21cad2..a2d5fd5 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -310,13 +310,11 @@ export class Chocolat {
     }
 
     getOutMarginW() {
-        var left = $(this.elems.left).outerWidth(true)
-        var right = $(this.elems.right).outerWidth(true)
-        return left + right
+        return this.elems.left.offsetWidth + this.elems.right.offsetWidth
     }
 
     getOutMarginH() {
-        return $(this.elems.top).outerHeight(true) + $(this.elems.bottom).outerHeight(true)
+        return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight
     }
 
     markup() {
@@ -703,7 +701,7 @@ export class Chocolat {
             },
 
             getElem: (name) => {
-                return $(this.elems[name])
+                return this.elems[name]
             },
         }
     }
diff --git a/test/test.js b/test/test.js
index 9a0dfc2..015798e 100644
--- a/test/test.js
+++ b/test/test.js
@@ -11,7 +11,7 @@ describe('Chocolat', function() {
         it('should call markup function and create markup', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 loop: true,
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
             })
 
             var spyMarkup = sinon.spy(chocolat, 'markup')
@@ -42,7 +42,7 @@ describe('Chocolat', function() {
 
         it('should add css classes to parent when in container', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
             })
 
             chocolat
@@ -89,7 +89,7 @@ describe('Chocolat', function() {
         it('should call init function', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 loop: true,
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
             })
 
             var spyInit = sinon.spy(chocolat, 'init')
@@ -106,7 +106,7 @@ describe('Chocolat', function() {
         it('should call load function', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 loop: true,
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
             })
 
             var spyLoad = sinon.spy(chocolat, 'load')
@@ -123,7 +123,7 @@ describe('Chocolat', function() {
         it('should call markup function', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 loop: true,
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
             })
 
             var spyMarkup = sinon.spy(chocolat, 'markup')
@@ -143,7 +143,7 @@ describe('Chocolat', function() {
 
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 loop: true,
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
                 afterMarkup: afterMarkup,
             })
 
@@ -152,19 +152,10 @@ describe('Chocolat', function() {
                 .first()[0]
                 .click()
 
-            chocolat.api().getElem('top')
-            expect(
-                chocolat
-                    .api()
-                    .getElem('top')
-                    .find(chocolat.api().getElem('description')).length
-            ).to.equal(1)
-            expect(
-                chocolat
-                    .api()
-                    .getElem('bottom')
-                    .find(chocolat.api().getElem('description')).length
-            ).to.equal(0)
+            const top = chocolat.api().getElem('top')
+            const bottom = chocolat.api().getElem('bottom')
+            expect($(top).find(chocolat.api().getElem('description')).length).to.equal(1)
+            expect($(bottom).find(chocolat.api().getElem('description')).length).to.equal(0)
         })
 
         it('can define a title', function() {
@@ -173,7 +164,7 @@ describe('Chocolat', function() {
             }
 
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
                 setTitle: setTitle,
             })
 
@@ -182,7 +173,7 @@ describe('Chocolat', function() {
                 .first()[0]
                 .click()
 
-            const elem = chocolat.api().getElem('setTitle')[0]
+            const elem = chocolat.api().getElem('setTitle')
             expect(elem.textContent).to.equal('hello')
         })
 
@@ -194,7 +185,7 @@ describe('Chocolat', function() {
             }
 
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
                 description: description,
             })
 
@@ -202,14 +193,14 @@ describe('Chocolat', function() {
                 .api()
                 .open()
                 .then(() => {
-                    const elem = chocolat.api().getElem('description')[0]
+                    const elem = chocolat.api().getElem('description')
                     expect(elem.textContent).to.equal('prefix foo suffix')
 
                     chocolat
                         .api()
                         .next()
                         .then(() => {
-                            const elem = chocolat.api().getElem('description')[0]
+                            const elem = chocolat.api().getElem('description')
                             expect(elem.textContent).to.equal('prefix baz suffix')
                             done()
                         })
@@ -225,7 +216,7 @@ describe('Chocolat', function() {
             }
 
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
                 pagination: pagination,
             })
 
@@ -233,14 +224,14 @@ describe('Chocolat', function() {
                 .api()
                 .open()
                 .then(() => {
-                    const elem = chocolat.api().getElem('pagination')[0]
+                    const elem = chocolat.api().getElem('pagination')
                     expect(elem.textContent).to.equal('prefix 1/3 suffix')
 
                     chocolat
                         .api()
                         .next()
                         .then(() => {
-                            const elem = chocolat.api().getElem('pagination')[0]
+                            const elem = chocolat.api().getElem('pagination')
                             expect(elem.textContent).to.equal('prefix 2/3 suffix')
                             done()
                         })
@@ -525,7 +516,7 @@ describe('Chocolat', function() {
                         chocolat
                             .api()
                             .getElem('domContainer')
-                            .hasClass('chocolat-cover')
+                            .classList.contains('chocolat-cover')
                     ).to.be.true
                     return done()
                 })
@@ -534,7 +525,7 @@ describe('Chocolat', function() {
         it("should have 'shortest' side of the container equal to 'shortest' side to the image in container", function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 imageSize: 'cover',
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
             })
 
             chocolat
@@ -597,7 +588,7 @@ describe('Chocolat', function() {
                 .then(function() {
                     var dim = getExpectedDimensions(chocolat)
 
-                    var $content = chocolat.api().getElem('content')
+                    var $content = $(chocolat.api().getElem('content'))
 
                     var top = parseInt($content.css('top'), 10)
                     var left = parseInt($content.css('left'), 10)
@@ -618,7 +609,7 @@ describe('Chocolat', function() {
         it("should have 'longest' side of the container equal to 'longest' side to the image in container", function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 imageSize: 'contain',
-                container: $('#container')[0],
+                container: document.querySelector('#container'),
             })
 
             chocolat
@@ -681,7 +672,7 @@ describe('Chocolat', function() {
                 .then(function() {
                     var dim = getExpectedDimensions(chocolat)
 
-                    var $content = chocolat.api().getElem('content')
+                    var $content = $(chocolat.api().getElem('content'))
 
                     var top = parseInt($content.css('top'), 10)
                     var left = parseInt($content.css('left'), 10)
@@ -756,33 +747,21 @@ describe('Chocolat', function() {
     })
 })
 
+function getJqueryElement(name) {}
+
 // function used to calculate image dimensions
 // in order to be compared with what chocolat is really displaying
 function getExpectedDimensions(chocolat) {
-    var imgWidth = chocolat.api().getElem('img')[0].width
-    var imgHeight = chocolat.api().getElem('img')[0].height
+    var imgWidth = chocolat.api().getElem('img').width
+    var imgHeight = chocolat.api().getElem('img').height
 
     var containerWidth = $(chocolat.api().get('container')).width()
     var containerHeight = $(chocolat.api().get('container')).height()
 
     var containerOutMarginH =
-        chocolat
-            .api()
-            .getElem('top')
-            .outerHeight(true) +
-        chocolat
-            .api()
-            .getElem('bottom')
-            .outerHeight(true)
+        chocolat.api().getElem('top').offsetHeight + chocolat.api().getElem('bottom').offsetHeight
     var containerOutMarginW =
-        chocolat
-            .api()
-            .getElem('left')
-            .outerWidth(true) +
-        chocolat
-            .api()
-            .getElem('right')
-            .outerWidth(true)
+        chocolat.api().getElem('left').offsetWidth + chocolat.api().getElem('right').offsetWidth
 
     var containerPaddedWidth = containerWidth - containerOutMarginW
     var containerPaddedHeight = containerHeight - containerOutMarginH

From 35ca6031c14ac62dc008b965ec56633a362eeac6 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 7 Jan 2019 11:10:50 +0100
Subject: [PATCH 25/65] jQuery as a dev dependencie only

---
 package.json | 4 ++--
 yarn.lock    | 3 ++-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index c04cb74..30e4567 100644
--- a/package.json
+++ b/package.json
@@ -15,8 +15,7 @@
     "prettier": "./node_modules/.bin/prettier src/js/*.js test/*.js --write"
   },
   "dependencies": {
-    "es6-promise": "^4.2.5",
-    "jquery": "^3.0"
+    "es6-promise": "^4.2.5"
   },
   "devDependencies": {
     "@babel/core": "^7.2.2",
@@ -27,6 +26,7 @@
     "gulp-rename": "^1.2.2",
     "gulp-uglify": "^1.2.0",
     "gulp-util": "^3.0.6",
+    "jquery": "^3.3.1",
     "mocha": "^5.2.0",
     "mocha-chrome": "^1.1.0",
     "prettier": "1.15.2",
diff --git a/yarn.lock b/yarn.lock
index c1783ff..6fc98f0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1847,9 +1847,10 @@ isobject@^3.0.0, isobject@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
 
-jquery@^3.0:
+jquery@^3.3.1:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.3.1.tgz#958ce29e81c9790f31be7792df5d4d95fc57fbca"
+  integrity sha512-Ubldcmxp5np52/ENotGxlLe6aGMvmF4R8S6tZjsP6Knsaxd/xp3Zrh50cG93lR6nPXyUFwzN3ZSOQI0wRJNdGg==
 
 "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
   version "4.0.0"

From 73953d3c87ad5ed52216ec7e5aa046d45b5910ae Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 7 Jan 2019 11:21:24 +0100
Subject: [PATCH 26/65] Move css & images to dist folder

---
 package.json     |  3 +-
 rollup.config.js | 78 ++++++++++++++++++++++++++----------------------
 yarn.lock        | 36 +++++++++++++++++++++-
 3 files changed, 79 insertions(+), 38 deletions(-)

diff --git a/package.json b/package.json
index 30e4567..52e07f9 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
     "test": "test"
   },
   "scripts": {
-    "build": "rollup -c",
+    "build": "yarn prettier && rollup -c",
     "dev": "rollup -c -w",
     "test": "mocha-chrome test/index.html",
     "prettier": "./node_modules/.bin/prettier src/js/*.js test/*.js --write"
@@ -34,6 +34,7 @@
     "rollup": "^0.68.1",
     "rollup-plugin-babel": "^4.1.0",
     "rollup-plugin-commonjs": "^9.2.0",
+    "rollup-plugin-copy": "^0.2.3",
     "rollup-plugin-node-resolve": "^4.0.0",
     "sinon": "^7.2.2"
   },
diff --git a/rollup.config.js b/rollup.config.js
index ee0d05e..bcd6323 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -1,40 +1,46 @@
-import resolve from 'rollup-plugin-node-resolve';
-import commonjs from 'rollup-plugin-commonjs';
-import babel from 'rollup-plugin-babel';
-import pkg from './package.json';
+import resolve from 'rollup-plugin-node-resolve'
+import commonjs from 'rollup-plugin-commonjs'
+import babel from 'rollup-plugin-babel'
+import copy from 'rollup-plugin-copy'
+import pkg from './package.json'
 
 export default [
-	// browser-friendly UMD build
-	{
-		entry: 'src/js/main.iife.js',
-		dest: pkg.browser,
-		format: 'iife',
-		moduleName: 'chocolat',
-		plugins: [
-			resolve(), // so Rollup can find `jquery`
-			commonjs(), // so Rollup can convert `jquery` to an ES module
-			babel({
-				exclude: ['node_modules/**']
-			})
-		]
-	},
+    // browser-friendly UMD build
+    {
+        entry: 'src/js/main.iife.js',
+        dest: pkg.browser,
+        format: 'iife',
+        moduleName: 'chocolat',
+        plugins: [
+            resolve(),
+            commonjs(),
+            babel({
+                exclude: ['node_modules/**']
+            }),
+            copy({
+                'src/css': 'dist/css',
+                'src/images': 'dist/images',
+                verbose: true
+            }),
+        ]
+    },
 
-	// CommonJS (for Node) and ES module (for bundlers) build.
-	// (We could have three entries in the configuration array
-	// instead of two, but it's quicker to generate multiple
-	// builds from a single configuration where possible, using
-	// the `targets` option which can specify `dest` and `format`)
-	{
-		entry: 'src/js/main.esm.js',
-		external: ['jquery', 'es6-promise/auto'],
-		targets: [
-			{ dest: pkg.main, format: 'cjs' },
-			{ dest: pkg.module, format: 'es' }
-		],
-		plugins: [
-			babel({
-				exclude: ['node_modules/**']
-			})
-		]
-	}
+    // CommonJS (for Node) and ES module (for bundlers) build.
+    // (We could have three entries in the configuration array
+    // instead of two, but it's quicker to generate multiple
+    // builds from a single configuration where possible, using
+    // the `targets` option which can specify `dest` and `format`)
+    {
+        entry: 'src/js/main.esm.js',
+        external: ['es6-promise/auto'],
+        targets: [
+            { dest: pkg.main, format: 'cjs' },
+            { dest: pkg.module, format: 'es' }
+        ],
+        plugins: [
+            babel({
+                exclude: ['node_modules/**']
+            })
+        ]
+    }
 ];
\ No newline at end of file
diff --git a/yarn.lock b/yarn.lock
index 6fc98f0..09b806f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -950,6 +950,11 @@ color-support@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
 
+colors@^1.1.2:
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/colors/-/colors-1.3.3.tgz#39e005d546afe01e01f9c4ca8fa50f686a01205d"
+  integrity sha512-mmGt/1pZqYRjMxB1axhTo16/snVZ5krrKkcmMeVKxzECMMXoCgnvTPp10QgHfcbQZw8Dq2jMNG6je4JlWU0gWg==
+
 commander@2.11.x:
   version "2.11.0"
   resolved "https://registry.yarnpkg.com/commander/-/commander-2.11.0.tgz#157152fd1e7a6c8d98a5b715cf376df928004563"
@@ -1316,6 +1321,15 @@ fragment-cache@^0.2.1:
   dependencies:
     map-cache "^0.2.2"
 
+fs-extra@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-3.0.1.tgz#3794f378c58b342ea7dbbb23095109c4b3b62291"
+  integrity sha1-N5TzeMWLNC6n27sjCVEJxLO2IpE=
+  dependencies:
+    graceful-fs "^4.1.2"
+    jsonfile "^3.0.0"
+    universalify "^0.1.0"
+
 fs.realpath@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
@@ -1459,7 +1473,7 @@ graceful-fs@^3.0.0:
   dependencies:
     natives "^1.1.0"
 
-graceful-fs@^4.1.2:
+graceful-fs@^4.1.2, graceful-fs@^4.1.6:
   version "4.1.15"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.15.tgz#ffb703e1066e8a0eeaa4c8b80ba9253eeefbfb00"
 
@@ -1886,6 +1900,13 @@ json5@^2.1.0:
   dependencies:
     minimist "^1.2.0"
 
+jsonfile@^3.0.0:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/jsonfile/-/jsonfile-3.0.1.tgz#a5ecc6f65f53f662c4415c7675a0331d0992ec66"
+  integrity sha1-pezG9l9T9mLEQVx2daAzHQmS7GY=
+  optionalDependencies:
+    graceful-fs "^4.1.6"
+
 just-extend@^4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/just-extend/-/just-extend-4.0.2.tgz#f3f47f7dfca0f989c55410a7ebc8854b07108afc"
@@ -2779,6 +2800,14 @@ rollup-plugin-commonjs@^9.2.0:
     resolve "^1.8.1"
     rollup-pluginutils "^2.3.3"
 
+rollup-plugin-copy@^0.2.3:
+  version "0.2.3"
+  resolved "https://registry.yarnpkg.com/rollup-plugin-copy/-/rollup-plugin-copy-0.2.3.tgz#dac1ab81d1f220baeb98e5c4c0108252e1edbb98"
+  integrity sha1-2sGrgdHyILrrmOXEwBCCUuHtu5g=
+  dependencies:
+    colors "^1.1.2"
+    fs-extra "^3.0.0"
+
 rollup-plugin-node-resolve@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/rollup-plugin-node-resolve/-/rollup-plugin-node-resolve-4.0.0.tgz#9bc6b8205e9936cc0e26bba2415f1ecf1e64d9b2"
@@ -3139,6 +3168,11 @@ unique-stream@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/unique-stream/-/unique-stream-1.0.0.tgz#d59a4a75427447d9aa6c91e70263f8d26a4b104b"
 
+universalify@^0.1.0:
+  version "0.1.2"
+  resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66"
+  integrity sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==
+
 unset-value@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/unset-value/-/unset-value-1.0.0.tgz#8376873f7d2335179ffb1e6fc3a8ed0dfc8ab559"

From 82ed461d393bae4849e5b22694f91dd62d807bbe Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 7 Jan 2019 11:25:46 +0100
Subject: [PATCH 27/65] Removed gulp

---
 package.json |    5 -
 yarn.lock    | 1356 +-------------------------------------------------
 2 files changed, 17 insertions(+), 1344 deletions(-)

diff --git a/package.json b/package.json
index 52e07f9..179362f 100644
--- a/package.json
+++ b/package.json
@@ -21,11 +21,6 @@
     "@babel/core": "^7.2.2",
     "babel-preset-env": "^1.7.0",
     "chai": "^4.2.0",
-    "gulp": "^3.9.0",
-    "gulp-bump": "^0.3.1",
-    "gulp-rename": "^1.2.2",
-    "gulp-uglify": "^1.2.0",
-    "gulp-util": "^3.0.6",
     "jquery": "^3.3.1",
     "mocha": "^5.2.0",
     "mocha-chrome": "^1.1.0",
diff --git a/yarn.lock b/yarn.lock
index 09b806f..0565ef0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -157,20 +157,6 @@
   version "0.0.28"
   resolved "http://registry.npmjs.org/@types/rimraf/-/rimraf-0.0.28.tgz#5562519bc7963caca8abf7f128cae3b594d41d06"
 
-align-text@^0.1.1, align-text@^0.1.3:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/align-text/-/align-text-0.1.4.tgz#0cd90a561093f35d0a99256c22b7069433fad117"
-  dependencies:
-    kind-of "^3.0.2"
-    longest "^1.0.1"
-    repeat-string "^1.5.2"
-
-ansi-gray@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/ansi-gray/-/ansi-gray-0.1.1.tgz#2962cf54ec9792c48510a3deb524436861ef7251"
-  dependencies:
-    ansi-wrap "0.1.0"
-
 ansi-regex@^2.0.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df"
@@ -185,40 +171,16 @@ ansi-styles@^3.2.1:
   dependencies:
     color-convert "^1.9.0"
 
-ansi-wrap@0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/ansi-wrap/-/ansi-wrap-0.1.0.tgz#a82250ddb0015e9a27ca82e82ea603bbfa45efaf"
-
-archy@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/archy/-/archy-1.0.0.tgz#f9c8c13757cc1dd7bc379ac77b2c62a5c2868c40"
-
 arr-diff@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-2.0.0.tgz#8f3b827f955a8bd669697e4a4256ac3ceae356cf"
   dependencies:
     arr-flatten "^1.0.1"
 
-arr-diff@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520"
-
-arr-flatten@^1.0.1, arr-flatten@^1.1.0:
+arr-flatten@^1.0.1:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/arr-flatten/-/arr-flatten-1.1.0.tgz#36048bbff4e7b47e136644316c99669ea5ae91f1"
 
-arr-union@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/arr-union/-/arr-union-3.1.0.tgz#e39b09aea9def866a8f206e288af63919bae39c4"
-
-array-differ@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/array-differ/-/array-differ-1.0.0.tgz#eff52e3758249d33be402b8bb8e564bb2b5d4031"
-
-array-each@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/array-each/-/array-each-1.0.1.tgz#a794af0c05ab1752846ee753a1f211a05ba0c44f"
-
 array-find-index@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/array-find-index/-/array-find-index-1.0.2.tgz#df010aa1287e164bbda6f9723b0a96a1ec4187a1"
@@ -227,22 +189,10 @@ array-from@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/array-from/-/array-from-2.1.1.tgz#cfe9d8c26628b9dc5aecc62a9f5d8f1f352c1195"
 
-array-slice@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/array-slice/-/array-slice-1.1.0.tgz#e368ea15f89bc7069f7ffb89aec3a6c7d4ac22d4"
-
-array-uniq@^1.0.2:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/array-uniq/-/array-uniq-1.0.3.tgz#af6ac877a25cc7f74e058894753858dfdb24fdb6"
-
 array-unique@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.2.1.tgz#a1d97ccafcbc2625cc70fadceb36a50c58b01a53"
 
-array-unique@^0.3.2:
-  version "0.3.2"
-  resolved "https://registry.yarnpkg.com/array-unique/-/array-unique-0.3.2.tgz#a894b75d4bc4f6cd679ef3244a9fd8f46ae2d428"
-
 arrify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
@@ -251,22 +201,10 @@ assertion-error@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/assertion-error/-/assertion-error-1.1.0.tgz#e60b6b0e8f301bd97e5375215bda406c85118c0b"
 
-assign-symbols@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/assign-symbols/-/assign-symbols-1.0.0.tgz#59667f41fadd4f20ccbc2bb96b8d4f7f78ec0367"
-
 async-limiter@~1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/async-limiter/-/async-limiter-1.0.0.tgz#78faed8c3d074ab81f22b4e985d79e8738f720f8"
 
-async@~0.2.6:
-  version "0.2.10"
-  resolved "http://registry.npmjs.org/async/-/async-0.2.10.tgz#b6bbe0b0674b9d719708ca38de8c237cb526c3d1"
-
-atob@^2.1.1:
-  version "2.1.2"
-  resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9"
-
 babel-code-frame@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
@@ -737,23 +675,7 @@ balanced-match@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
 
-base@^0.11.1:
-  version "0.11.2"
-  resolved "https://registry.yarnpkg.com/base/-/base-0.11.2.tgz#7bde5ced145b6d551a90db87f83c558b4eb48a8f"
-  dependencies:
-    cache-base "^1.0.1"
-    class-utils "^0.3.5"
-    component-emitter "^1.2.1"
-    define-property "^1.0.0"
-    isobject "^3.0.1"
-    mixin-deep "^1.2.0"
-    pascalcase "^0.1.1"
-
-beeper@^1.0.0:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/beeper/-/beeper-1.1.1.tgz#e6d5ea8c5dad001304a70b22638447f69cb2f809"
-
-brace-expansion@^1.0.0, brace-expansion@^1.1.7:
+brace-expansion@^1.1.7:
   version "1.1.11"
   resolved "https://registry.yarnpkg.com/brace-expansion/-/brace-expansion-1.1.11.tgz#3c7fcbf529d87226f3d2f52b966ff5271eb441dd"
   dependencies:
@@ -768,21 +690,6 @@ braces@^1.8.2:
     preserve "^0.2.0"
     repeat-element "^1.1.2"
 
-braces@^2.3.1:
-  version "2.3.2"
-  resolved "https://registry.yarnpkg.com/braces/-/braces-2.3.2.tgz#5979fd3f14cd531565e5fa2df1abfff1dfaee729"
-  dependencies:
-    arr-flatten "^1.1.0"
-    array-unique "^0.3.2"
-    extend-shallow "^2.0.1"
-    fill-range "^4.0.0"
-    isobject "^3.0.1"
-    repeat-element "^1.1.2"
-    snapdragon "^0.8.1"
-    snapdragon-node "^2.0.1"
-    split-string "^3.0.2"
-    to-regex "^3.0.1"
-
 browser-stdout@1.3.1:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/browser-stdout/-/browser-stdout-1.3.1.tgz#baa559ee14ced73452229bad7326467c61fabd60"
@@ -802,20 +709,6 @@ builtin-modules@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-3.0.0.tgz#1e587d44b006620d90286cc7a9238bbc6129cab1"
 
-cache-base@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/cache-base/-/cache-base-1.0.1.tgz#0a7f46416831c8b662ee36fe4e7c59d76f666ab2"
-  dependencies:
-    collection-visit "^1.0.0"
-    component-emitter "^1.2.1"
-    get-value "^2.0.6"
-    has-value "^1.0.0"
-    isobject "^3.0.1"
-    set-value "^2.0.0"
-    to-object-path "^0.3.0"
-    union-value "^1.0.0"
-    unset-value "^1.0.0"
-
 camelcase-keys@^4.0.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-4.2.0.tgz#a2aa5fb1af688758259c32c141426d78923b9b77"
@@ -824,10 +717,6 @@ camelcase-keys@^4.0.0:
     map-obj "^2.0.0"
     quick-lru "^1.0.0"
 
-camelcase@^1.0.2:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-1.2.1.tgz#9bb5304d2e0b56698b2c758b08a3eaa9daa58a39"
-
 camelcase@^4.1.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-4.1.0.tgz#d545635be1e33c542649c69173e5de6acfae34dd"
@@ -836,13 +725,6 @@ caniuse-lite@^1.0.30000844:
   version "1.0.30000923"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30000923.tgz#148f9bda508024b5ce957b463ae2e8302b451bb2"
 
-center-align@^0.1.1:
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/center-align/-/center-align-0.1.3.tgz#aa0d32629b6ee972200411cbd4461c907bc2b7ad"
-  dependencies:
-    align-text "^0.1.3"
-    lazy-cache "^1.0.3"
-
 chai@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/chai/-/chai-4.2.0.tgz#760aa72cf20e3795e84b12877ce0e83737aa29e5"
@@ -854,7 +736,7 @@ chai@^4.2.0:
     pathval "^1.1.0"
     type-detect "^4.0.5"
 
-chalk@^1.0.0, chalk@^1.1.3:
+chalk@^1.1.3:
   version "1.1.3"
   resolved "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
   dependencies:
@@ -900,42 +782,6 @@ chrome-unmirror@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/chrome-unmirror/-/chrome-unmirror-0.1.0.tgz#e9af78ba47f7ffb90060293a720a01cd26d50bab"
 
-class-utils@^0.3.5:
-  version "0.3.6"
-  resolved "https://registry.yarnpkg.com/class-utils/-/class-utils-0.3.6.tgz#f93369ae8b9a7ce02fd41faad0ca83033190c463"
-  dependencies:
-    arr-union "^3.1.0"
-    define-property "^0.2.5"
-    isobject "^3.0.0"
-    static-extend "^0.1.1"
-
-cliui@^2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/cliui/-/cliui-2.1.0.tgz#4b475760ff80264c762c3a1719032e91c7fea0d1"
-  dependencies:
-    center-align "^0.1.1"
-    right-align "^0.1.1"
-    wordwrap "0.0.2"
-
-clone-stats@^0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/clone-stats/-/clone-stats-0.0.1.tgz#b88f94a82cf38b8791d58046ea4029ad88ca99d1"
-
-clone@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/clone/-/clone-0.2.0.tgz#c6126a90ad4f72dbf5acdb243cc37724fe93fc1f"
-
-clone@^1.0.0, clone@^1.0.2:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/clone/-/clone-1.0.4.tgz#da309cc263df15994c688ca902179ca3c7cd7c7e"
-
-collection-visit@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/collection-visit/-/collection-visit-1.0.0.tgz#4bc0373c164bc3291b4d368c829cf1a80a59dca0"
-  dependencies:
-    map-visit "^1.0.0"
-    object-visit "^1.0.0"
-
 color-convert@^1.9.0:
   version "1.9.3"
   resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
@@ -946,10 +792,6 @@ color-name@1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
 
-color-support@^1.1.3:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
-
 colors@^1.1.2:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/colors/-/colors-1.3.3.tgz#39e005d546afe01e01f9c4ca8fa50f686a01205d"
@@ -963,14 +805,6 @@ commander@2.15.1:
   version "2.15.1"
   resolved "http://registry.npmjs.org/commander/-/commander-2.15.1.tgz#df46e867d0fc2aec66a34662b406a9ccafff5b0f"
 
-commander@^2.5.0:
-  version "2.19.0"
-  resolved "https://registry.yarnpkg.com/commander/-/commander-2.19.0.tgz#f6198aa84e5b83c46054b94ddedbfed5ee9ff12a"
-
-component-emitter@^1.2.1:
-  version "1.2.1"
-  resolved "https://registry.yarnpkg.com/component-emitter/-/component-emitter-1.2.1.tgz#137918d6d78283f7df7a6b7c5a63e140e69425e6"
-
 concat-map@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
@@ -981,18 +815,10 @@ convert-source-map@^1.1.0, convert-source-map@^1.5.1:
   dependencies:
     safe-buffer "~5.1.1"
 
-copy-descriptor@^0.1.0:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/copy-descriptor/-/copy-descriptor-0.1.1.tgz#676f6eb3c39997c2ee1ac3a924fd6124748f578d"
-
 core-js@^2.4.0, core-js@^2.5.0:
   version "2.6.1"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.1.tgz#87416ae817de957a3f249b3b5ca475d4aaed6042"
 
-core-util-is@~1.0.0:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
-
 cross-spawn@^5.0.1:
   version "5.1.0"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-5.1.0.tgz#e8bd0efee58fcff6f8f94510a0a554bbfa235449"
@@ -1007,21 +833,13 @@ currently-unhandled@^0.4.1:
   dependencies:
     array-find-index "^1.0.1"
 
-dateformat@^2.0.0:
-  version "2.2.0"
-  resolved "https://registry.yarnpkg.com/dateformat/-/dateformat-2.2.0.tgz#4065e2013cf9fb916ddfd82efb506ad4c6769062"
-
-deap@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/deap/-/deap-1.0.1.tgz#0646e9e1a095ffe8a9e404d68d1f76dcf57e66fb"
-
 debug@3.1.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
   dependencies:
     ms "2.0.0"
 
-debug@^2.2.0, debug@^2.3.3, debug@^2.6.8, debug@^2.6.9:
+debug@^2.6.8, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
   dependencies:
@@ -1046,14 +864,10 @@ decamelize-keys@^1.0.0:
     decamelize "^1.1.0"
     map-obj "^1.0.0"
 
-decamelize@^1.0.0, decamelize@^1.1.0:
+decamelize@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
 
-decode-uri-component@^0.2.0:
-  version "0.2.0"
-  resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545"
-
 deep-assign@^2.0.0:
   version "2.0.0"
   resolved "http://registry.npmjs.org/deep-assign/-/deep-assign-2.0.0.tgz#ebe06b1f07f08dae597620e3dd1622f371a1c572"
@@ -1066,39 +880,6 @@ deep-eql@^3.0.1:
   dependencies:
     type-detect "^4.0.0"
 
-defaults@^1.0.0:
-  version "1.0.3"
-  resolved "https://registry.yarnpkg.com/defaults/-/defaults-1.0.3.tgz#c656051e9817d9ff08ed881477f3fe4019f3ef7d"
-  dependencies:
-    clone "^1.0.2"
-
-define-property@^0.2.5:
-  version "0.2.5"
-  resolved "https://registry.yarnpkg.com/define-property/-/define-property-0.2.5.tgz#c35b1ef918ec3c990f9a5bc57be04aacec5c8116"
-  dependencies:
-    is-descriptor "^0.1.0"
-
-define-property@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/define-property/-/define-property-1.0.0.tgz#769ebaaf3f4a63aad3af9e8d304c9bbe79bfb0e6"
-  dependencies:
-    is-descriptor "^1.0.0"
-
-define-property@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/define-property/-/define-property-2.0.2.tgz#d459689e8d654ba77e02a817f8710d702cb16e9d"
-  dependencies:
-    is-descriptor "^1.0.2"
-    isobject "^3.0.1"
-
-deprecated@^0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/deprecated/-/deprecated-0.0.1.tgz#f9c9af5464afa1e7a971458a8bdef2aa94d5bb19"
-
-detect-file@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/detect-file/-/detect-file-1.0.0.tgz#f0d66d03672a825cb1b73bdb3fe62310c8e552b7"
-
 detect-indent@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/detect-indent/-/detect-indent-4.0.0.tgz#f76d064352cdf43a1cb6ce619c4ee3a9475de208"
@@ -1109,28 +890,10 @@ diff@3.5.0, diff@^3.5.0:
   version "3.5.0"
   resolved "https://registry.yarnpkg.com/diff/-/diff-3.5.0.tgz#800c0dd1e0a8bfbc95835c202ad220fe317e5a12"
 
-dot-object@^0.6.0:
-  version "0.6.0"
-  resolved "http://registry.npmjs.org/dot-object/-/dot-object-0.6.0.tgz#2ad3cf75a714ed4fc819e4b63d349bec01c7a358"
-  dependencies:
-    commander "^2.5.0"
-
-duplexer2@0.0.2:
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/duplexer2/-/duplexer2-0.0.2.tgz#c614dcf67e2fb14995a91711e5a617e8a60a31db"
-  dependencies:
-    readable-stream "~1.1.9"
-
 electron-to-chromium@^1.3.47:
   version "1.3.96"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.96.tgz#25770ec99b8b07706dedf3a5f43fa50cb54c4f9a"
 
-end-of-stream@~0.1.5:
-  version "0.1.5"
-  resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-0.1.5.tgz#8e177206c3c80837d85632e8b9359dfe8b2f6eaf"
-  dependencies:
-    once "~1.3.0"
-
 error-ex@^1.3.1:
   version "1.3.2"
   resolved "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz#b4ac40648107fdcdcfae242f428bea8a14d4f1bf"
@@ -1171,74 +934,18 @@ expand-brackets@^0.1.4:
   dependencies:
     is-posix-bracket "^0.1.0"
 
-expand-brackets@^2.1.4:
-  version "2.1.4"
-  resolved "https://registry.yarnpkg.com/expand-brackets/-/expand-brackets-2.1.4.tgz#b77735e315ce30f6b6eff0f83b04151a22449622"
-  dependencies:
-    debug "^2.3.3"
-    define-property "^0.2.5"
-    extend-shallow "^2.0.1"
-    posix-character-classes "^0.1.0"
-    regex-not "^1.0.0"
-    snapdragon "^0.8.1"
-    to-regex "^3.0.1"
-
 expand-range@^1.8.1:
   version "1.8.2"
   resolved "http://registry.npmjs.org/expand-range/-/expand-range-1.8.2.tgz#a299effd335fe2721ebae8e257ec79644fc85337"
   dependencies:
     fill-range "^2.1.0"
 
-expand-tilde@^2.0.0, expand-tilde@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/expand-tilde/-/expand-tilde-2.0.2.tgz#97e801aa052df02454de46b02bf621642cdc8502"
-  dependencies:
-    homedir-polyfill "^1.0.1"
-
-extend-shallow@^2.0.1:
-  version "2.0.1"
-  resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-2.0.1.tgz#51af7d614ad9a9f610ea1bafbb989d6b1c56890f"
-  dependencies:
-    is-extendable "^0.1.0"
-
-extend-shallow@^3.0.0, extend-shallow@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/extend-shallow/-/extend-shallow-3.0.2.tgz#26a71aaf073b39fb2127172746131c2704028db8"
-  dependencies:
-    assign-symbols "^1.0.0"
-    is-extendable "^1.0.1"
-
-extend@^3.0.0:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa"
-
 extglob@^0.3.1:
   version "0.3.2"
   resolved "https://registry.yarnpkg.com/extglob/-/extglob-0.3.2.tgz#2e18ff3d2f49ab2765cec9023f011daa8d8349a1"
   dependencies:
     is-extglob "^1.0.0"
 
-extglob@^2.0.4:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/extglob/-/extglob-2.0.4.tgz#ad00fe4dc612a9232e8718711dc5cb5ab0285543"
-  dependencies:
-    array-unique "^0.3.2"
-    define-property "^1.0.0"
-    expand-brackets "^2.1.4"
-    extend-shallow "^2.0.1"
-    fragment-cache "^0.2.1"
-    regex-not "^1.0.0"
-    snapdragon "^0.8.1"
-    to-regex "^3.0.1"
-
-fancy-log@^1.0.0, fancy-log@^1.1.0:
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/fancy-log/-/fancy-log-1.3.2.tgz#f41125e3d84f2e7d89a43d06d958c8f78be16be1"
-  dependencies:
-    ansi-gray "^0.1.1"
-    color-support "^1.1.3"
-    time-stamp "^1.0.0"
-
 filename-regex@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/filename-regex/-/filename-regex-2.0.1.tgz#c1c4b9bee3e09725ddb106b75c1e301fe2f18b26"
@@ -1253,53 +960,13 @@ fill-range@^2.1.0:
     repeat-element "^1.1.2"
     repeat-string "^1.5.2"
 
-fill-range@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-4.0.0.tgz#d544811d428f98eb06a63dc402d2403c328c38f7"
-  dependencies:
-    extend-shallow "^2.0.1"
-    is-number "^3.0.0"
-    repeat-string "^1.6.1"
-    to-regex-range "^2.1.0"
-
-find-index@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/find-index/-/find-index-0.1.1.tgz#675d358b2ca3892d795a1ab47232f8b6e2e0dde4"
-
 find-up@^2.0.0, find-up@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7"
   dependencies:
     locate-path "^2.0.0"
 
-findup-sync@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/findup-sync/-/findup-sync-2.0.0.tgz#9326b1488c22d1a6088650a86901b2d9a90a2cbc"
-  dependencies:
-    detect-file "^1.0.0"
-    is-glob "^3.1.0"
-    micromatch "^3.0.4"
-    resolve-dir "^1.0.1"
-
-fined@^1.0.1:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/fined/-/fined-1.1.0.tgz#b37dc844b76a2f5e7081e884f7c0ae344f153476"
-  dependencies:
-    expand-tilde "^2.0.2"
-    is-plain-object "^2.0.3"
-    object.defaults "^1.1.0"
-    object.pick "^1.2.0"
-    parse-filepath "^1.0.1"
-
-first-chunk-stream@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/first-chunk-stream/-/first-chunk-stream-1.0.0.tgz#59bfb50cd905f60d7c394cd3d9acaab4e6ad934e"
-
-flagged-respawn@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/flagged-respawn/-/flagged-respawn-1.0.0.tgz#4e79ae9b2eb38bf86b3bb56bf3e0a56aa5fcabd7"
-
-for-in@^1.0.1, for-in@^1.0.2:
+for-in@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/for-in/-/for-in-1.0.2.tgz#81068d295a8142ec0ac726c6e2200c30fb6d5e80"
 
@@ -1309,18 +976,6 @@ for-own@^0.1.4:
   dependencies:
     for-in "^1.0.1"
 
-for-own@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/for-own/-/for-own-1.0.0.tgz#c63332f415cedc4b04dbfe70cf836494c53cb44b"
-  dependencies:
-    for-in "^1.0.1"
-
-fragment-cache@^0.2.1:
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/fragment-cache/-/fragment-cache-0.2.1.tgz#4290fad27f13e89be7f33799c6bc5a0abfff0d19"
-  dependencies:
-    map-cache "^0.2.2"
-
 fs-extra@^3.0.0:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-3.0.1.tgz#3794f378c58b342ea7dbbb23095109c4b3b62291"
@@ -1334,12 +989,6 @@ fs.realpath@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f"
 
-gaze@^0.5.1:
-  version "0.5.2"
-  resolved "https://registry.yarnpkg.com/gaze/-/gaze-0.5.2.tgz#40b709537d24d1d45767db5a908689dfe69ac44f"
-  dependencies:
-    globule "~0.1.0"
-
 get-func-name@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/get-func-name/-/get-func-name-2.0.0.tgz#ead774abee72e20409433a066366023dd6887a41"
@@ -1348,10 +997,6 @@ get-stream@^3.0.0:
   version "3.0.0"
   resolved "http://registry.npmjs.org/get-stream/-/get-stream-3.0.0.tgz#8e943d1358dc37555054ecbe2edb05aa174ede14"
 
-get-value@^2.0.3, get-value@^2.0.6:
-  version "2.0.6"
-  resolved "https://registry.yarnpkg.com/get-value/-/get-value-2.0.6.tgz#dc15ca1c672387ca76bd37ac0a395ba2042a2c28"
-
 glob-base@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/glob-base/-/glob-base-0.3.0.tgz#dbb164f6221b1c0b1ccf82aea328b497df0ea3c4"
@@ -1365,29 +1010,6 @@ glob-parent@^2.0.0:
   dependencies:
     is-glob "^2.0.0"
 
-glob-stream@^3.1.5:
-  version "3.1.18"
-  resolved "https://registry.yarnpkg.com/glob-stream/-/glob-stream-3.1.18.tgz#9170a5f12b790306fdfe598f313f8f7954fd143b"
-  dependencies:
-    glob "^4.3.1"
-    glob2base "^0.0.12"
-    minimatch "^2.0.1"
-    ordered-read-streams "^0.1.0"
-    through2 "^0.6.1"
-    unique-stream "^1.0.0"
-
-glob-watcher@^0.0.6:
-  version "0.0.6"
-  resolved "http://registry.npmjs.org/glob-watcher/-/glob-watcher-0.0.6.tgz#b95b4a8df74b39c83298b0c05c978b4d9a3b710b"
-  dependencies:
-    gaze "^0.5.1"
-
-glob2base@^0.0.12:
-  version "0.0.12"
-  resolved "https://registry.yarnpkg.com/glob2base/-/glob2base-0.0.12.tgz#9d419b3e28f12e83a362164a277055922c9c0d56"
-  dependencies:
-    find-index "^0.1.1"
-
 glob@7.1.2:
   version "7.1.2"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.2.tgz#c19c9df9a028702d678612384a6552404c636d15"
@@ -1399,15 +1021,6 @@ glob@7.1.2:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@^4.3.1:
-  version "4.5.3"
-  resolved "https://registry.yarnpkg.com/glob/-/glob-4.5.3.tgz#c6cb73d3226c1efef04de3c56d012f03377ee15f"
-  dependencies:
-    inflight "^1.0.4"
-    inherits "2"
-    minimatch "^2.0.1"
-    once "^1.3.0"
-
 glob@^7.0.5:
   version "7.1.3"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.3.tgz#3960832d3f1574108342dafd3a67b332c0969df1"
@@ -1419,32 +1032,6 @@ glob@^7.0.5:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@~3.1.21:
-  version "3.1.21"
-  resolved "https://registry.yarnpkg.com/glob/-/glob-3.1.21.tgz#d29e0a055dea5138f4d07ed40e8982e83c2066cd"
-  dependencies:
-    graceful-fs "~1.2.0"
-    inherits "1"
-    minimatch "~0.2.11"
-
-global-modules@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/global-modules/-/global-modules-1.0.0.tgz#6d770f0eb523ac78164d72b5e71a8877265cc3ea"
-  dependencies:
-    global-prefix "^1.0.1"
-    is-windows "^1.0.1"
-    resolve-dir "^1.0.0"
-
-global-prefix@^1.0.1:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/global-prefix/-/global-prefix-1.0.2.tgz#dbf743c6c14992593c655568cb66ed32c0122ebe"
-  dependencies:
-    expand-tilde "^2.0.2"
-    homedir-polyfill "^1.0.1"
-    ini "^1.3.4"
-    is-windows "^1.0.1"
-    which "^1.2.14"
-
 globals@^11.1.0:
   version "11.9.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-11.9.0.tgz#bde236808e987f290768a93d065060d78e6ab249"
@@ -1453,111 +1040,14 @@ globals@^9.18.0:
   version "9.18.0"
   resolved "https://registry.yarnpkg.com/globals/-/globals-9.18.0.tgz#aa3896b3e69b487f17e31ed2143d69a8e30c2d8a"
 
-globule@~0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/globule/-/globule-0.1.0.tgz#d9c8edde1da79d125a151b79533b978676346ae5"
-  dependencies:
-    glob "~3.1.21"
-    lodash "~1.0.1"
-    minimatch "~0.2.11"
-
-glogg@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/glogg/-/glogg-1.0.1.tgz#dcf758e44789cc3f3d32c1f3562a3676e6a34810"
-  dependencies:
-    sparkles "^1.0.0"
-
-graceful-fs@^3.0.0:
-  version "3.0.11"
-  resolved "http://registry.npmjs.org/graceful-fs/-/graceful-fs-3.0.11.tgz#7613c778a1afea62f25c630a086d7f3acbbdd818"
-  dependencies:
-    natives "^1.1.0"
-
 graceful-fs@^4.1.2, graceful-fs@^4.1.6:
   version "4.1.15"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.15.tgz#ffb703e1066e8a0eeaa4c8b80ba9253eeefbfb00"
 
-graceful-fs@~1.2.0:
-  version "1.2.3"
-  resolved "http://registry.npmjs.org/graceful-fs/-/graceful-fs-1.2.3.tgz#15a4806a57547cb2d2dbf27f42e89a8c3451b364"
-
 growl@1.10.5:
   version "1.10.5"
   resolved "https://registry.yarnpkg.com/growl/-/growl-1.10.5.tgz#f2735dc2283674fa67478b10181059355c369e5e"
 
-gulp-bump@^0.3.1:
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/gulp-bump/-/gulp-bump-0.3.1.tgz#8ac67f228915ab148779f16d3d375e5514a11c9a"
-  dependencies:
-    dot-object "^0.6.0"
-    gulp-util "^3.0.4"
-    semver "^4.3.1"
-    through2 "^0.5.1"
-
-gulp-rename@^1.2.2:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/gulp-rename/-/gulp-rename-1.4.0.tgz#de1c718e7c4095ae861f7296ef4f3248648240bd"
-
-gulp-uglify@^1.2.0:
-  version "1.5.4"
-  resolved "https://registry.yarnpkg.com/gulp-uglify/-/gulp-uglify-1.5.4.tgz#524788d87666d09f9d0c21fb2177f90039a658c9"
-  dependencies:
-    deap "^1.0.0"
-    fancy-log "^1.0.0"
-    gulp-util "^3.0.0"
-    isobject "^2.0.0"
-    through2 "^2.0.0"
-    uglify-js "2.6.4"
-    uglify-save-license "^0.4.1"
-    vinyl-sourcemaps-apply "^0.2.0"
-
-gulp-util@^3.0.0, gulp-util@^3.0.4, gulp-util@^3.0.6:
-  version "3.0.8"
-  resolved "https://registry.yarnpkg.com/gulp-util/-/gulp-util-3.0.8.tgz#0054e1e744502e27c04c187c3ecc505dd54bbb4f"
-  dependencies:
-    array-differ "^1.0.0"
-    array-uniq "^1.0.2"
-    beeper "^1.0.0"
-    chalk "^1.0.0"
-    dateformat "^2.0.0"
-    fancy-log "^1.1.0"
-    gulplog "^1.0.0"
-    has-gulplog "^0.1.0"
-    lodash._reescape "^3.0.0"
-    lodash._reevaluate "^3.0.0"
-    lodash._reinterpolate "^3.0.0"
-    lodash.template "^3.0.0"
-    minimist "^1.1.0"
-    multipipe "^0.1.2"
-    object-assign "^3.0.0"
-    replace-ext "0.0.1"
-    through2 "^2.0.0"
-    vinyl "^0.5.0"
-
-gulp@^3.9.0:
-  version "3.9.1"
-  resolved "http://registry.npmjs.org/gulp/-/gulp-3.9.1.tgz#571ce45928dd40af6514fc4011866016c13845b4"
-  dependencies:
-    archy "^1.0.0"
-    chalk "^1.0.0"
-    deprecated "^0.0.1"
-    gulp-util "^3.0.0"
-    interpret "^1.0.0"
-    liftoff "^2.1.0"
-    minimist "^1.1.0"
-    orchestrator "^0.3.0"
-    pretty-hrtime "^1.0.0"
-    semver "^4.1.0"
-    tildify "^1.0.0"
-    v8flags "^2.0.2"
-    vinyl-fs "^0.3.0"
-
-gulplog@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/gulplog/-/gulplog-1.0.0.tgz#e28c4d45d05ecbbed818363ce8f9c5926229ffe5"
-  dependencies:
-    glogg "^1.0.0"
-
 has-ansi@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91"
@@ -1568,39 +1058,6 @@ has-flag@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
 
-has-gulplog@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/has-gulplog/-/has-gulplog-0.1.0.tgz#6414c82913697da51590397dafb12f22967811ce"
-  dependencies:
-    sparkles "^1.0.0"
-
-has-value@^0.3.1:
-  version "0.3.1"
-  resolved "https://registry.yarnpkg.com/has-value/-/has-value-0.3.1.tgz#7b1f58bada62ca827ec0a2078025654845995e1f"
-  dependencies:
-    get-value "^2.0.3"
-    has-values "^0.1.4"
-    isobject "^2.0.0"
-
-has-value@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/has-value/-/has-value-1.0.0.tgz#18b281da585b1c5c51def24c930ed29a0be6b177"
-  dependencies:
-    get-value "^2.0.6"
-    has-values "^1.0.0"
-    isobject "^3.0.0"
-
-has-values@^0.1.4:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/has-values/-/has-values-0.1.4.tgz#6d61de95d91dfca9b9a02089ad384bff8f62b771"
-
-has-values@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/has-values/-/has-values-1.0.0.tgz#95b0b63fec2146619a6fe57fe75628d5a39efe4f"
-  dependencies:
-    is-number "^3.0.0"
-    kind-of "^4.0.0"
-
 he@1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/he/-/he-1.1.1.tgz#93410fd21b009735151f8868c2f271f3427e23fd"
@@ -1612,12 +1069,6 @@ home-or-tmp@^2.0.0:
     os-homedir "^1.0.0"
     os-tmpdir "^1.0.1"
 
-homedir-polyfill@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/homedir-polyfill/-/homedir-polyfill-1.0.1.tgz#4c2bbc8a758998feebf5ed68580f76d46768b4bc"
-  dependencies:
-    parse-passwd "^1.0.0"
-
 hosted-git-info@^2.1.4:
   version "2.7.1"
   resolved "https://registry.yarnpkg.com/hosted-git-info/-/hosted-git-info-2.7.1.tgz#97f236977bd6e125408930ff6de3eec6281ec047"
@@ -1640,47 +1091,16 @@ inflight@^1.0.4:
     once "^1.3.0"
     wrappy "1"
 
-inherits@1:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/inherits/-/inherits-1.0.2.tgz#ca4309dadee6b54cc0b8d247e8d7c7a0975bdc9b"
-
-inherits@2, inherits@~2.0.1, inherits@~2.0.3:
+inherits@2:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/inherits/-/inherits-2.0.3.tgz#633c2c83e3da42a502f52466022480f4208261de"
 
-ini@^1.3.4:
-  version "1.3.5"
-  resolved "https://registry.yarnpkg.com/ini/-/ini-1.3.5.tgz#eee25f56db1c9ec6085e0c22778083f596abf927"
-
-interpret@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/interpret/-/interpret-1.1.0.tgz#7ed1b1410c6a0e0f78cf95d3b8440c63f78b8614"
-
 invariant@^2.2.2:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
   dependencies:
     loose-envify "^1.0.0"
 
-is-absolute@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/is-absolute/-/is-absolute-1.0.0.tgz#395e1ae84b11f26ad1795e73c17378e48a301576"
-  dependencies:
-    is-relative "^1.0.0"
-    is-windows "^1.0.1"
-
-is-accessor-descriptor@^0.1.6:
-  version "0.1.6"
-  resolved "https://registry.yarnpkg.com/is-accessor-descriptor/-/is-accessor-descriptor-0.1.6.tgz#a9e12cb3ae8d876727eeef3843f8a0897b5c98d6"
-  dependencies:
-    kind-of "^3.0.2"
-
-is-accessor-descriptor@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/is-accessor-descriptor/-/is-accessor-descriptor-1.0.0.tgz#169c2f6d3df1f992618072365c9b0ea1f6878656"
-  dependencies:
-    kind-of "^6.0.0"
-
 is-arrayish@^0.2.1:
   version "0.2.1"
   resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"
@@ -1695,34 +1115,6 @@ is-builtin-module@^1.0.0:
   dependencies:
     builtin-modules "^1.0.0"
 
-is-data-descriptor@^0.1.4:
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz#0b5ee648388e2c860282e793f1856fec3f301b56"
-  dependencies:
-    kind-of "^3.0.2"
-
-is-data-descriptor@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/is-data-descriptor/-/is-data-descriptor-1.0.0.tgz#d84876321d0e7add03990406abbbbd36ba9268c7"
-  dependencies:
-    kind-of "^6.0.0"
-
-is-descriptor@^0.1.0:
-  version "0.1.6"
-  resolved "https://registry.yarnpkg.com/is-descriptor/-/is-descriptor-0.1.6.tgz#366d8240dde487ca51823b1ab9f07a10a78251ca"
-  dependencies:
-    is-accessor-descriptor "^0.1.6"
-    is-data-descriptor "^0.1.4"
-    kind-of "^5.0.0"
-
-is-descriptor@^1.0.0, is-descriptor@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/is-descriptor/-/is-descriptor-1.0.2.tgz#3b159746a66604b04f8c81524ba365c5f14d86ec"
-  dependencies:
-    is-accessor-descriptor "^1.0.0"
-    is-data-descriptor "^1.0.0"
-    kind-of "^6.0.2"
-
 is-dotfile@^1.0.0:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/is-dotfile/-/is-dotfile-1.0.3.tgz#a6a2f32ffd2dfb04f5ca25ecd0f6b83cf798a1e1"
@@ -1733,24 +1125,14 @@ is-equal-shallow@^0.1.3:
   dependencies:
     is-primitive "^2.0.0"
 
-is-extendable@^0.1.0, is-extendable@^0.1.1:
+is-extendable@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/is-extendable/-/is-extendable-0.1.1.tgz#62b110e289a471418e3ec36a617d472e301dfc89"
 
-is-extendable@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/is-extendable/-/is-extendable-1.0.1.tgz#a7470f9e426733d81bd81e1155264e3a3507cab4"
-  dependencies:
-    is-plain-object "^2.0.4"
-
 is-extglob@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-1.0.0.tgz#ac468177c4943405a092fc8f29760c6ffc6206c0"
 
-is-extglob@^2.1.0:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
-
 is-finite@^1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/is-finite/-/is-finite-1.0.2.tgz#cc6677695602be550ef11e8b4aa6305342b6d0aa"
@@ -1763,12 +1145,6 @@ is-glob@^2.0.0, is-glob@^2.0.1:
   dependencies:
     is-extglob "^1.0.0"
 
-is-glob@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/is-glob/-/is-glob-3.1.0.tgz#7ba5ae24217804ac70707b96922567486cc3e84a"
-  dependencies:
-    is-extglob "^2.1.0"
-
 is-module@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-module/-/is-module-1.0.0.tgz#3258fb69f78c14d5b815d664336b4cffb6441591"
@@ -1779,12 +1155,6 @@ is-number@^2.1.0:
   dependencies:
     kind-of "^3.0.2"
 
-is-number@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/is-number/-/is-number-3.0.0.tgz#24fd6201a4782cf50561c810276afc7d12d71195"
-  dependencies:
-    kind-of "^3.0.2"
-
 is-number@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/is-number/-/is-number-4.0.0.tgz#0026e37f5454d73e356dfe6564699867c6a7f0ff"
@@ -1797,12 +1167,6 @@ is-plain-obj@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/is-plain-obj/-/is-plain-obj-1.1.0.tgz#71a50c8429dfca773c92a390a4a03b39fcd51d3e"
 
-is-plain-object@^2.0.1, is-plain-object@^2.0.3, is-plain-object@^2.0.4:
-  version "2.0.4"
-  resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-2.0.4.tgz#2c163b3fafb1b606d9d17928f05c2a1c38e07677"
-  dependencies:
-    isobject "^3.0.1"
-
 is-posix-bracket@^0.1.0:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/is-posix-bracket/-/is-posix-bracket-0.1.1.tgz#3334dc79774368e92f016e6fbc0a88f5cd6e6bc4"
@@ -1811,30 +1175,10 @@ is-primitive@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/is-primitive/-/is-primitive-2.0.0.tgz#207bab91638499c07b2adf240a41a87210034575"
 
-is-relative@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/is-relative/-/is-relative-1.0.0.tgz#a1bb6935ce8c5dba1e8b9754b9b2dcc020e2260d"
-  dependencies:
-    is-unc-path "^1.0.0"
-
 is-stream@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44"
 
-is-unc-path@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/is-unc-path/-/is-unc-path-1.0.0.tgz#d731e8898ed090a12c352ad2eaed5095ad322c9d"
-  dependencies:
-    unc-path-regex "^0.1.2"
-
-is-utf8@^0.2.0:
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/is-utf8/-/is-utf8-0.2.1.tgz#4b0da1442104d1b336340e80797e865cf39f7d72"
-
-is-windows@^1.0.1, is-windows@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/is-windows/-/is-windows-1.0.2.tgz#d1850eb9791ecd18e6182ce12a30f396634bb19d"
-
 is-wsl@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/is-wsl/-/is-wsl-1.1.0.tgz#1f16e4aa22b04d1336b66188a66af3c600c3a66d"
@@ -1843,7 +1187,7 @@ isarray@0.0.1:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf"
 
-isarray@1.0.0, isarray@~1.0.0:
+isarray@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/isarray/-/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11"
 
@@ -1857,10 +1201,6 @@ isobject@^2.0.0:
   dependencies:
     isarray "1.0.0"
 
-isobject@^3.0.0, isobject@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
-
 jquery@^3.3.1:
   version "3.3.1"
   resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.3.1.tgz#958ce29e81c9790f31be7792df5d4d95fc57fbca"
@@ -1911,43 +1251,16 @@ just-extend@^4.0.2:
   version "4.0.2"
   resolved "https://registry.yarnpkg.com/just-extend/-/just-extend-4.0.2.tgz#f3f47f7dfca0f989c55410a7ebc8854b07108afc"
 
-kind-of@^3.0.2, kind-of@^3.0.3, kind-of@^3.2.0:
+kind-of@^3.0.2:
   version "3.2.2"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-3.2.2.tgz#31ea21a734bab9bbb0f32466d893aea51e4a3c64"
   dependencies:
     is-buffer "^1.1.5"
 
-kind-of@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-4.0.0.tgz#20813df3d712928b207378691a45066fae72dd57"
-  dependencies:
-    is-buffer "^1.1.5"
-
-kind-of@^5.0.0:
-  version "5.1.0"
-  resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-5.1.0.tgz#729c91e2d857b7a419a1f9aa65685c4c33f5845d"
-
-kind-of@^6.0.0, kind-of@^6.0.2:
+kind-of@^6.0.0:
   version "6.0.2"
   resolved "https://registry.yarnpkg.com/kind-of/-/kind-of-6.0.2.tgz#01146b36a6218e64e58f3a8d66de5d7fc6f6d051"
 
-lazy-cache@^1.0.3:
-  version "1.0.4"
-  resolved "https://registry.yarnpkg.com/lazy-cache/-/lazy-cache-1.0.4.tgz#a1d78fc3a50474cb80845d3b3b6e1da49a446e8e"
-
-liftoff@^2.1.0:
-  version "2.5.0"
-  resolved "https://registry.yarnpkg.com/liftoff/-/liftoff-2.5.0.tgz#2009291bb31cea861bbf10a7c15a28caf75c31ec"
-  dependencies:
-    extend "^3.0.0"
-    findup-sync "^2.0.0"
-    fined "^1.0.1"
-    flagged-respawn "^1.0.0"
-    is-plain-object "^2.0.4"
-    object.map "^1.0.0"
-    rechoir "^0.6.2"
-    resolve "^1.1.7"
-
 lighthouse-logger@^1.0.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/lighthouse-logger/-/lighthouse-logger-1.2.0.tgz#b76d56935e9c137e86a04741f6bb9b2776e886ca"
@@ -1971,101 +1284,14 @@ locate-path@^2.0.0:
     p-locate "^2.0.0"
     path-exists "^3.0.0"
 
-lodash._basecopy@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/lodash._basecopy/-/lodash._basecopy-3.0.1.tgz#8da0e6a876cf344c0ad8a54882111dd3c5c7ca36"
-
-lodash._basetostring@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/lodash._basetostring/-/lodash._basetostring-3.0.1.tgz#d1861d877f824a52f669832dcaf3ee15566a07d5"
-
-lodash._basevalues@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/lodash._basevalues/-/lodash._basevalues-3.0.0.tgz#5b775762802bde3d3297503e26300820fdf661b7"
-
-lodash._getnative@^3.0.0:
-  version "3.9.1"
-  resolved "https://registry.yarnpkg.com/lodash._getnative/-/lodash._getnative-3.9.1.tgz#570bc7dede46d61cdcde687d65d3eecbaa3aaff5"
-
-lodash._isiterateecall@^3.0.0:
-  version "3.0.9"
-  resolved "https://registry.yarnpkg.com/lodash._isiterateecall/-/lodash._isiterateecall-3.0.9.tgz#5203ad7ba425fae842460e696db9cf3e6aac057c"
-
-lodash._reescape@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/lodash._reescape/-/lodash._reescape-3.0.0.tgz#2b1d6f5dfe07c8a355753e5f27fac7f1cde1616a"
-
-lodash._reevaluate@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/lodash._reevaluate/-/lodash._reevaluate-3.0.0.tgz#58bc74c40664953ae0b124d806996daca431e2ed"
-
-lodash._reinterpolate@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz#0ccf2d89166af03b3663c796538b75ac6e114d9d"
-
-lodash._root@^3.0.0:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/lodash._root/-/lodash._root-3.0.1.tgz#fba1c4524c19ee9a5f8136b4609f017cf4ded692"
-
-lodash.escape@^3.0.0:
-  version "3.2.0"
-  resolved "https://registry.yarnpkg.com/lodash.escape/-/lodash.escape-3.2.0.tgz#995ee0dc18c1b48cc92effae71a10aab5b487698"
-  dependencies:
-    lodash._root "^3.0.0"
-
 lodash.get@^4.4.2:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"
 
-lodash.isarguments@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz#2f573d85c6a24289ff00663b491c1d338ff3458a"
-
-lodash.isarray@^3.0.0:
-  version "3.0.4"
-  resolved "https://registry.yarnpkg.com/lodash.isarray/-/lodash.isarray-3.0.4.tgz#79e4eb88c36a8122af86f844aa9bcd851b5fbb55"
-
-lodash.keys@^3.0.0:
-  version "3.1.2"
-  resolved "https://registry.yarnpkg.com/lodash.keys/-/lodash.keys-3.1.2.tgz#4dbc0472b156be50a0b286855d1bd0b0c656098a"
-  dependencies:
-    lodash._getnative "^3.0.0"
-    lodash.isarguments "^3.0.0"
-    lodash.isarray "^3.0.0"
-
-lodash.restparam@^3.0.0:
-  version "3.6.1"
-  resolved "https://registry.yarnpkg.com/lodash.restparam/-/lodash.restparam-3.6.1.tgz#936a4e309ef330a7645ed4145986c85ae5b20805"
-
-lodash.template@^3.0.0:
-  version "3.6.2"
-  resolved "https://registry.yarnpkg.com/lodash.template/-/lodash.template-3.6.2.tgz#f8cdecc6169a255be9098ae8b0c53d378931d14f"
-  dependencies:
-    lodash._basecopy "^3.0.0"
-    lodash._basetostring "^3.0.0"
-    lodash._basevalues "^3.0.0"
-    lodash._isiterateecall "^3.0.0"
-    lodash._reinterpolate "^3.0.0"
-    lodash.escape "^3.0.0"
-    lodash.keys "^3.0.0"
-    lodash.restparam "^3.0.0"
-    lodash.templatesettings "^3.0.0"
-
-lodash.templatesettings@^3.0.0:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/lodash.templatesettings/-/lodash.templatesettings-3.1.1.tgz#fb307844753b66b9f1afa54e262c745307dba8e5"
-  dependencies:
-    lodash._reinterpolate "^3.0.0"
-    lodash.escape "^3.0.0"
-
 lodash@^4.17.10, lodash@^4.17.4:
   version "4.17.11"
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
 
-lodash@~1.0.1:
-  version "1.0.2"
-  resolved "http://registry.npmjs.org/lodash/-/lodash-1.0.2.tgz#8f57560c83b59fc270bd3d561b690043430e2551"
-
 loglevel@^1.4.1:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/loglevel/-/loglevel-1.6.1.tgz#e0fc95133b6ef276cdc8887cdaf24aa6f156f8fa"
@@ -2078,10 +1304,6 @@ lolex@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/lolex/-/lolex-3.0.0.tgz#f04ee1a8aa13f60f1abd7b0e8f4213ec72ec193e"
 
-longest@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/longest/-/longest-1.0.1.tgz#30a0b2da38f73770e8294a0d22e6625ed77d0097"
-
 loose-envify@^1.0.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
@@ -2095,10 +1317,6 @@ loud-rejection@^1.0.0:
     currently-unhandled "^0.4.1"
     signal-exit "^3.0.0"
 
-lru-cache@2:
-  version "2.7.3"
-  resolved "http://registry.npmjs.org/lru-cache/-/lru-cache-2.7.3.tgz#6d4524e8b955f95d4f5b58851ce21dd72fb4e952"
-
 lru-cache@^4.0.1:
   version "4.1.4"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-4.1.4.tgz#51cc46e8e6d9530771c857e24ccc720ecdbcc031"
@@ -2112,16 +1330,6 @@ magic-string@^0.25.1:
   dependencies:
     sourcemap-codec "^1.4.1"
 
-make-iterator@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/make-iterator/-/make-iterator-1.0.1.tgz#29b33f312aa8f547c4a5e490f56afcec99133ad6"
-  dependencies:
-    kind-of "^6.0.2"
-
-map-cache@^0.2.0, map-cache@^0.2.2:
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/map-cache/-/map-cache-0.2.2.tgz#c32abd0bd6525d9b051645bb4f26ac5dc98a0dbf"
-
 map-obj@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-1.0.1.tgz#d933ceb9205d82bdcf4886f6742bdc2b4dea146d"
@@ -2130,12 +1338,6 @@ map-obj@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-2.0.0.tgz#a65cd29087a92598b8791257a523e021222ac1f9"
 
-map-visit@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/map-visit/-/map-visit-1.0.0.tgz#ecdca8f13144e660f1b5bd41f12f3479d98dfb8f"
-  dependencies:
-    object-visit "^1.0.0"
-
 marky@^1.2.0:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/marky/-/marky-1.2.1.tgz#a3fcf82ffd357756b8b8affec9fdbf3a30dc1b02"
@@ -2176,43 +1378,12 @@ micromatch@^2.3.11:
     parse-glob "^3.0.4"
     regex-cache "^0.4.2"
 
-micromatch@^3.0.4:
-  version "3.1.10"
-  resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-3.1.10.tgz#70859bc95c9840952f359a068a3fc49f9ecfac23"
-  dependencies:
-    arr-diff "^4.0.0"
-    array-unique "^0.3.2"
-    braces "^2.3.1"
-    define-property "^2.0.2"
-    extend-shallow "^3.0.2"
-    extglob "^2.0.4"
-    fragment-cache "^0.2.1"
-    kind-of "^6.0.2"
-    nanomatch "^1.2.9"
-    object.pick "^1.3.0"
-    regex-not "^1.0.0"
-    snapdragon "^0.8.1"
-    to-regex "^3.0.2"
-
 minimatch@3.0.4, minimatch@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
   dependencies:
     brace-expansion "^1.1.7"
 
-minimatch@^2.0.1:
-  version "2.0.10"
-  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-2.0.10.tgz#8d087c39c6b38c001b97fca7ce6d0e1e80afbac7"
-  dependencies:
-    brace-expansion "^1.0.0"
-
-minimatch@~0.2.11:
-  version "0.2.14"
-  resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-0.2.14.tgz#c74e780574f63c6f9a090e90efbe6ef53a6a756a"
-  dependencies:
-    lru-cache "2"
-    sigmund "~1.0.0"
-
 minimist-options@^3.0.1:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/minimist-options/-/minimist-options-3.0.2.tgz#fba4c8191339e13ecf4d61beb03f070103f3d954"
@@ -2224,18 +1395,11 @@ minimist@0.0.8:
   version "0.0.8"
   resolved "http://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
 
-minimist@^1.1.0, minimist@^1.1.3, minimist@^1.2.0:
+minimist@^1.1.3, minimist@^1.2.0:
   version "1.2.0"
   resolved "http://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz#a35008b20f41383eec1fb914f4cd5df79a264284"
 
-mixin-deep@^1.2.0:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/mixin-deep/-/mixin-deep-1.3.1.tgz#a49e7268dce1a0d9698e45326c5626df3543d0fe"
-  dependencies:
-    for-in "^1.0.2"
-    is-extendable "^1.0.1"
-
-mkdirp@0.5.1, mkdirp@^0.5.0, mkdirp@^0.5.1:
+mkdirp@0.5.1, mkdirp@^0.5.1:
   version "0.5.1"
   resolved "http://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903"
   dependencies:
@@ -2285,12 +1449,6 @@ ms@^2.1.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.1.tgz#30a5864eb3ebb0a66f2ebe6d727af06a09d86e0a"
 
-multipipe@^0.1.2:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/multipipe/-/multipipe-0.1.2.tgz#2a8f2ddf70eed564dff2d57f1e1a137d9f05078b"
-  dependencies:
-    duplexer2 "0.0.2"
-
 nanoassert@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/nanoassert/-/nanoassert-1.1.0.tgz#4f3152e09540fde28c76f44b19bbcd1d5a42478d"
@@ -2303,22 +1461,6 @@ nanobus@^4.2.0:
     nanotiming "^7.2.0"
     remove-array-items "^1.0.0"
 
-nanomatch@^1.2.9:
-  version "1.2.13"
-  resolved "https://registry.yarnpkg.com/nanomatch/-/nanomatch-1.2.13.tgz#b87a8aa4fc0de8fe6be88895b38983ff265bd119"
-  dependencies:
-    arr-diff "^4.0.0"
-    array-unique "^0.3.2"
-    define-property "^2.0.2"
-    extend-shallow "^3.0.2"
-    fragment-cache "^0.2.1"
-    is-windows "^1.0.2"
-    kind-of "^6.0.2"
-    object.pick "^1.3.0"
-    regex-not "^1.0.0"
-    snapdragon "^0.8.1"
-    to-regex "^3.0.1"
-
 nanoscheduler@^1.0.2:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/nanoscheduler/-/nanoscheduler-1.0.3.tgz#6ca027941bf3e04139ea4bab6227ea6ad803692f"
@@ -2332,10 +1474,6 @@ nanotiming@^7.2.0:
     nanoassert "^1.1.0"
     nanoscheduler "^1.0.2"
 
-natives@^1.1.0:
-  version "1.1.6"
-  resolved "https://registry.yarnpkg.com/natives/-/natives-1.1.6.tgz#a603b4a498ab77173612b9ea1acdec4d980f00bb"
-
 nise@^1.4.7:
   version "1.4.8"
   resolved "https://registry.yarnpkg.com/nise/-/nise-1.4.8.tgz#ce91c31e86cf9b2c4cac49d7fcd7f56779bfd6b0"
@@ -2371,40 +1509,6 @@ number-is-nan@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/number-is-nan/-/number-is-nan-1.0.1.tgz#097b602b53422a522c1afb8790318336941a011d"
 
-object-assign@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-3.0.0.tgz#9bedd5ca0897949bca47e7ff408062d549f587f2"
-
-object-copy@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/object-copy/-/object-copy-0.1.0.tgz#7e7d858b781bd7c991a41ba975ed3812754e998c"
-  dependencies:
-    copy-descriptor "^0.1.0"
-    define-property "^0.2.5"
-    kind-of "^3.0.3"
-
-object-visit@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/object-visit/-/object-visit-1.0.1.tgz#f79c4493af0c5377b59fe39d395e41042dd045bb"
-  dependencies:
-    isobject "^3.0.0"
-
-object.defaults@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/object.defaults/-/object.defaults-1.1.0.tgz#3a7f868334b407dea06da16d88d5cd29e435fecf"
-  dependencies:
-    array-each "^1.0.1"
-    array-slice "^1.0.0"
-    for-own "^1.0.0"
-    isobject "^3.0.0"
-
-object.map@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/object.map/-/object.map-1.0.1.tgz#cf83e59dc8fcc0ad5f4250e1f78b3b81bd801d37"
-  dependencies:
-    for-own "^1.0.0"
-    make-iterator "^1.0.0"
-
 object.omit@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/object.omit/-/object.omit-2.0.1.tgz#1a9c744829f39dbb858c76ca3579ae2a54ebd1fa"
@@ -2412,36 +1516,12 @@ object.omit@^2.0.0:
     for-own "^0.1.4"
     is-extendable "^0.1.1"
 
-object.pick@^1.2.0, object.pick@^1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/object.pick/-/object.pick-1.3.0.tgz#87a10ac4c1694bd2e1cbf53591a66141fb5dd747"
-  dependencies:
-    isobject "^3.0.1"
-
 once@^1.3.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1"
   dependencies:
     wrappy "1"
 
-once@~1.3.0:
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/once/-/once-1.3.3.tgz#b2e261557ce4c314ec8304f3fa82663e4297ca20"
-  dependencies:
-    wrappy "1"
-
-orchestrator@^0.3.0:
-  version "0.3.8"
-  resolved "https://registry.yarnpkg.com/orchestrator/-/orchestrator-0.3.8.tgz#14e7e9e2764f7315fbac184e506c7aa6df94ad7e"
-  dependencies:
-    end-of-stream "~0.1.5"
-    sequencify "~0.0.7"
-    stream-consume "~0.1.0"
-
-ordered-read-streams@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/ordered-read-streams/-/ordered-read-streams-0.1.0.tgz#fd565a9af8eb4473ba69b6ed8a34352cb552f126"
-
 os-homedir@^1.0.0:
   version "1.0.2"
   resolved "http://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz#ffbc4988336e0e833de0c168c7ef152121aa7fb3"
@@ -2470,14 +1550,6 @@ p-try@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/p-try/-/p-try-1.0.0.tgz#cbc79cdbaf8fd4228e13f621f2b1a237c1b207b3"
 
-parse-filepath@^1.0.1:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/parse-filepath/-/parse-filepath-1.0.2.tgz#a632127f53aaf3d15876f5872f3ffac763d6c891"
-  dependencies:
-    is-absolute "^1.0.0"
-    map-cache "^0.2.0"
-    path-root "^0.1.1"
-
 parse-glob@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/parse-glob/-/parse-glob-3.0.4.tgz#b2c376cfb11f35513badd173ef0bb6e3a388391c"
@@ -2494,14 +1566,6 @@ parse-json@^4.0.0:
     error-ex "^1.3.1"
     json-parse-better-errors "^1.0.1"
 
-parse-passwd@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/parse-passwd/-/parse-passwd-1.0.0.tgz#6d5b934a456993b23d37f40a382d6f1666a8e5c6"
-
-pascalcase@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/pascalcase/-/pascalcase-0.1.1.tgz#b363e55e8006ca6fe21784d2db22bd15d7917f14"
-
 path-exists@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515"
@@ -2514,20 +1578,10 @@ path-key@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/path-key/-/path-key-2.0.1.tgz#411cadb574c5a140d3a4b1910d40d80cc9f40b40"
 
-path-parse@^1.0.5, path-parse@^1.0.6:
+path-parse@^1.0.6:
   version "1.0.6"
   resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.6.tgz#d62dbb5679405d72c4737ec58600e9ddcf06d24c"
 
-path-root-regex@^0.1.0:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/path-root-regex/-/path-root-regex-0.1.2.tgz#bfccdc8df5b12dc52c8b43ec38d18d72c04ba96d"
-
-path-root@^0.1.1:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/path-root/-/path-root-0.1.1.tgz#9a4a6814cac1c0cd73360a95f32083c8ea4745b7"
-  dependencies:
-    path-root-regex "^0.1.0"
-
 path-to-regexp@^1.7.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/path-to-regexp/-/path-to-regexp-1.7.0.tgz#59fde0f435badacba103a84e9d3bc64e96b9937d"
@@ -2554,10 +1608,6 @@ pkg-dir@^2.0.0:
   dependencies:
     find-up "^2.1.0"
 
-posix-character-classes@^0.1.0:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"
-
 preserve@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/preserve/-/preserve-0.2.0.tgz#815ed1f6ebc65926f865b310c0713bcb3315ce4b"
@@ -2572,18 +1622,10 @@ prettier@1.15.2:
   version "1.15.2"
   resolved "https://registry.yarnpkg.com/prettier/-/prettier-1.15.2.tgz#d31abe22afa4351efa14c7f8b94b58bb7452205e"
 
-pretty-hrtime@^1.0.0:
-  version "1.0.3"
-  resolved "http://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz#b7e3ea42435a4c9b2759d99e0f201eb195802ee1"
-
 private@^0.1.6, private@^0.1.8:
   version "0.1.8"
   resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
 
-process-nextick-args@~2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/process-nextick-args/-/process-nextick-args-2.0.0.tgz#a37d732f4271b4ab1ad070d35508e8290788ffaa"
-
 pseudomap@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/pseudomap/-/pseudomap-1.0.2.tgz#f052a28da70e618917ef0a8ac34c1ae5a68286b3"
@@ -2615,42 +1657,6 @@ read-pkg@^3.0.0:
     normalize-package-data "^2.3.2"
     path-type "^3.0.0"
 
-"readable-stream@>=1.0.33-1 <1.1.0-0", readable-stream@~1.0.17:
-  version "1.0.34"
-  resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz#125820e34bc842d2f2aaafafe4c2916ee32c157c"
-  dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.1"
-    isarray "0.0.1"
-    string_decoder "~0.10.x"
-
-readable-stream@~1.1.9:
-  version "1.1.14"
-  resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz#7cf4c54ef648e3813084c636dd2079e166c081d9"
-  dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.1"
-    isarray "0.0.1"
-    string_decoder "~0.10.x"
-
-readable-stream@~2.3.6:
-  version "2.3.6"
-  resolved "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz#b11c27d88b8ff1fbe070643cf94b0c79ae1b0aaf"
-  dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.3"
-    isarray "~1.0.0"
-    process-nextick-args "~2.0.0"
-    safe-buffer "~5.1.1"
-    string_decoder "~1.1.1"
-    util-deprecate "~1.0.1"
-
-rechoir@^0.6.2:
-  version "0.6.2"
-  resolved "https://registry.yarnpkg.com/rechoir/-/rechoir-0.6.2.tgz#85204b54dba82d5742e28c96756ef43af50e3384"
-  dependencies:
-    resolve "^1.1.6"
-
 redent@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/redent/-/redent-2.0.0.tgz#c1b2007b42d57eb1389079b3c8333639d5e1ccaa"
@@ -2684,13 +1690,6 @@ regex-cache@^0.4.2:
   dependencies:
     is-equal-shallow "^0.1.3"
 
-regex-not@^1.0.0, regex-not@^1.0.2:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/regex-not/-/regex-not-1.0.2.tgz#1f4ece27e00b0b65e0247a6810e6a85d83a5752c"
-  dependencies:
-    extend-shallow "^3.0.2"
-    safe-regex "^1.1.0"
-
 regexpu-core@^2.0.0:
   version "2.0.0"
   resolved "http://registry.npmjs.org/regexpu-core/-/regexpu-core-2.0.0.tgz#49d038837b8dcf8bfa5b9a42139938e6ea2ae240"
@@ -2721,7 +1720,7 @@ repeat-element@^1.1.2:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.3.tgz#782e0d825c0c5a3bb39731f84efee6b742e6b1ce"
 
-repeat-string@^1.5.2, repeat-string@^1.6.1:
+repeat-string@^1.5.2:
   version "1.6.1"
   resolved "https://registry.yarnpkg.com/repeat-string/-/repeat-string-1.6.1.tgz#8dcae470e1c88abc2d600fff4a776286da75e637"
 
@@ -2731,53 +1730,22 @@ repeating@^2.0.0:
   dependencies:
     is-finite "^1.0.0"
 
-replace-ext@0.0.1:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/replace-ext/-/replace-ext-0.0.1.tgz#29bbd92078a739f0bcce2b4ee41e837953522924"
-
 resolve-cwd@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/resolve-cwd/-/resolve-cwd-2.0.0.tgz#00a9f7387556e27038eae232caa372a6a59b665a"
   dependencies:
     resolve-from "^3.0.0"
 
-resolve-dir@^1.0.0, resolve-dir@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/resolve-dir/-/resolve-dir-1.0.1.tgz#79a40644c362be82f26effe739c9bb5382046f43"
-  dependencies:
-    expand-tilde "^2.0.0"
-    global-modules "^1.0.0"
-
 resolve-from@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/resolve-from/-/resolve-from-3.0.0.tgz#b22c7af7d9d6881bc8b6e653335eebcb0a188748"
 
-resolve-url@^0.2.1:
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
-
-resolve@^1.1.6, resolve@^1.1.7:
-  version "1.8.1"
-  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.8.1.tgz#82f1ec19a423ac1fbd080b0bab06ba36e84a7a26"
-  dependencies:
-    path-parse "^1.0.5"
-
 resolve@^1.3.2, resolve@^1.8.1:
   version "1.9.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.9.0.tgz#a14c6fdfa8f92a7df1d996cb7105fa744658ea06"
   dependencies:
     path-parse "^1.0.6"
 
-ret@~0.1.10:
-  version "0.1.15"
-  resolved "https://registry.yarnpkg.com/ret/-/ret-0.1.15.tgz#b8a4825d5bdb1fc3f6f53c2bc33f81388681c7bc"
-
-right-align@^0.1.1:
-  version "0.1.3"
-  resolved "https://registry.yarnpkg.com/right-align/-/right-align-0.1.3.tgz#61339b722fe6a3515689210d24e14c96148613ef"
-  dependencies:
-    align-text "^0.1.1"
-
 rimraf@^2.6.1:
   version "2.6.2"
   resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.6.2.tgz#2ed8150d24a16ea8651e6d6ef0f47c4158ce7a36"
@@ -2834,42 +1802,10 @@ safe-buffer@~5.1.0, safe-buffer@~5.1.1:
   version "5.1.2"
   resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d"
 
-safe-regex@^1.1.0:
-  version "1.1.0"
-  resolved "http://registry.npmjs.org/safe-regex/-/safe-regex-1.1.0.tgz#40a3669f3b077d1e943d44629e157dd48023bf2e"
-  dependencies:
-    ret "~0.1.10"
-
 "semver@2 || 3 || 4 || 5", semver@^5.3.0, semver@^5.4.1:
   version "5.6.0"
   resolved "https://registry.yarnpkg.com/semver/-/semver-5.6.0.tgz#7e74256fbaa49c75aa7c7a205cc22799cac80004"
 
-semver@^4.1.0, semver@^4.3.1:
-  version "4.3.6"
-  resolved "http://registry.npmjs.org/semver/-/semver-4.3.6.tgz#300bc6e0e86374f7ba61068b5b1ecd57fc6532da"
-
-sequencify@~0.0.7:
-  version "0.0.7"
-  resolved "https://registry.yarnpkg.com/sequencify/-/sequencify-0.0.7.tgz#90cff19d02e07027fd767f5ead3e7b95d1e7380c"
-
-set-value@^0.4.3:
-  version "0.4.3"
-  resolved "https://registry.yarnpkg.com/set-value/-/set-value-0.4.3.tgz#7db08f9d3d22dc7f78e53af3c3bf4666ecdfccf1"
-  dependencies:
-    extend-shallow "^2.0.1"
-    is-extendable "^0.1.1"
-    is-plain-object "^2.0.1"
-    to-object-path "^0.3.0"
-
-set-value@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/set-value/-/set-value-2.0.0.tgz#71ae4a88f0feefbbf52d1ea604f3fb315ebb6274"
-  dependencies:
-    extend-shallow "^2.0.1"
-    is-extendable "^0.1.1"
-    is-plain-object "^2.0.3"
-    split-string "^3.0.1"
-
 shebang-command@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-1.2.0.tgz#44aac65b695b03398968c39f363fee5deafdf1ea"
@@ -2880,10 +1816,6 @@ shebang-regex@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-1.0.0.tgz#da42f49740c0b42db2ca9728571cb190c98efea3"
 
-sigmund@~1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/sigmund/-/sigmund-1.0.1.tgz#3ff21f198cad2175f9f3b781853fd94d0d19b590"
-
 signal-exit@^3.0.0:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.2.tgz#b5fdc08f1287ea1178628e415e25132b73646c6d"
@@ -2904,54 +1836,13 @@ slash@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"
 
-snapdragon-node@^2.0.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/snapdragon-node/-/snapdragon-node-2.1.1.tgz#6c175f86ff14bdb0724563e8f3c1b021a286853b"
-  dependencies:
-    define-property "^1.0.0"
-    isobject "^3.0.0"
-    snapdragon-util "^3.0.1"
-
-snapdragon-util@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/snapdragon-util/-/snapdragon-util-3.0.1.tgz#f956479486f2acd79700693f6f7b805e45ab56e2"
-  dependencies:
-    kind-of "^3.2.0"
-
-snapdragon@^0.8.1:
-  version "0.8.2"
-  resolved "https://registry.yarnpkg.com/snapdragon/-/snapdragon-0.8.2.tgz#64922e7c565b0e14204ba1aa7d6964278d25182d"
-  dependencies:
-    base "^0.11.1"
-    debug "^2.2.0"
-    define-property "^0.2.5"
-    extend-shallow "^2.0.1"
-    map-cache "^0.2.2"
-    source-map "^0.5.6"
-    source-map-resolve "^0.5.0"
-    use "^3.1.0"
-
-source-map-resolve@^0.5.0:
-  version "0.5.2"
-  resolved "https://registry.yarnpkg.com/source-map-resolve/-/source-map-resolve-0.5.2.tgz#72e2cc34095543e43b2c62b2c4c10d4a9054f259"
-  dependencies:
-    atob "^2.1.1"
-    decode-uri-component "^0.2.0"
-    resolve-url "^0.2.1"
-    source-map-url "^0.4.0"
-    urix "^0.1.0"
-
 source-map-support@^0.4.15:
   version "0.4.18"
   resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.4.18.tgz#0286a6de8be42641338594e97ccea75f0a2c585f"
   dependencies:
     source-map "^0.5.6"
 
-source-map-url@^0.4.0:
-  version "0.4.0"
-  resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
-
-source-map@^0.5.0, source-map@^0.5.1, source-map@^0.5.6, source-map@^0.5.7, source-map@~0.5.1:
+source-map@^0.5.0, source-map@^0.5.6, source-map@^0.5.7:
   version "0.5.7"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
 
@@ -2959,10 +1850,6 @@ sourcemap-codec@^1.4.1:
   version "1.4.4"
   resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.4.tgz#c63ea927c029dd6bd9a2b7fa03b3fec02ad56e9f"
 
-sparkles@^1.0.0:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/sparkles/-/sparkles-1.0.1.tgz#008db65edce6c50eec0c5e228e1945061dd0437c"
-
 spdx-correct@^3.0.0:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/spdx-correct/-/spdx-correct-3.1.0.tgz#fb83e504445268f154b074e218c87c003cd31df4"
@@ -2985,46 +1872,12 @@ spdx-license-ids@^3.0.0:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/spdx-license-ids/-/spdx-license-ids-3.0.3.tgz#81c0ce8f21474756148bbb5f3bfc0f36bf15d76e"
 
-split-string@^3.0.1, split-string@^3.0.2:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/split-string/-/split-string-3.1.0.tgz#7cb09dda3a86585705c64b39a6466038682e8fe2"
-  dependencies:
-    extend-shallow "^3.0.0"
-
-static-extend@^0.1.1:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/static-extend/-/static-extend-0.1.2.tgz#60809c39cbff55337226fd5e0b520f341f1fb5c6"
-  dependencies:
-    define-property "^0.2.5"
-    object-copy "^0.1.0"
-
-stream-consume@~0.1.0:
-  version "0.1.1"
-  resolved "https://registry.yarnpkg.com/stream-consume/-/stream-consume-0.1.1.tgz#d3bdb598c2bd0ae82b8cac7ac50b1107a7996c48"
-
-string_decoder@~0.10.x:
-  version "0.10.31"
-  resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-0.10.31.tgz#62e203bc41766c6c28c9fc84301dab1c5310fa94"
-
-string_decoder@~1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/string_decoder/-/string_decoder-1.1.1.tgz#9cf1611ba62685d7030ae9e4ba34149c3af03fc8"
-  dependencies:
-    safe-buffer "~5.1.0"
-
 strip-ansi@^3.0.0:
   version "3.0.1"
   resolved "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz#6a385fb8853d952d5ff05d0e8aaf94278dc63dcf"
   dependencies:
     ansi-regex "^2.0.0"
 
-strip-bom@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-1.0.0.tgz#85b8862f3844b5a6d5ec8467a93598173a36f794"
-  dependencies:
-    first-chunk-stream "^1.0.0"
-    is-utf8 "^0.2.0"
-
 strip-bom@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-3.0.0.tgz#2334c18e9c759f7bdd56fdef7e9ae3d588e68ed3"
@@ -3057,37 +1910,6 @@ text-encoding@^0.6.4:
   version "0.6.4"
   resolved "http://registry.npmjs.org/text-encoding/-/text-encoding-0.6.4.tgz#e399a982257a276dae428bb92845cb71bdc26d19"
 
-through2@^0.5.1:
-  version "0.5.1"
-  resolved "http://registry.npmjs.org/through2/-/through2-0.5.1.tgz#dfdd012eb9c700e2323fd334f38ac622ab372da7"
-  dependencies:
-    readable-stream "~1.0.17"
-    xtend "~3.0.0"
-
-through2@^0.6.1:
-  version "0.6.5"
-  resolved "http://registry.npmjs.org/through2/-/through2-0.6.5.tgz#41ab9c67b29d57209071410e1d7a7a968cd3ad48"
-  dependencies:
-    readable-stream ">=1.0.33-1 <1.1.0-0"
-    xtend ">=4.0.0 <4.1.0-0"
-
-through2@^2.0.0:
-  version "2.0.5"
-  resolved "https://registry.yarnpkg.com/through2/-/through2-2.0.5.tgz#01c1e39eb31d07cb7d03a96a70823260b23132cd"
-  dependencies:
-    readable-stream "~2.3.6"
-    xtend "~4.0.1"
-
-tildify@^1.0.0:
-  version "1.2.0"
-  resolved "https://registry.yarnpkg.com/tildify/-/tildify-1.2.0.tgz#dcec03f55dca9b7aa3e5b04f21817eb56e63588a"
-  dependencies:
-    os-homedir "^1.0.0"
-
-time-stamp@^1.0.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/time-stamp/-/time-stamp-1.1.0.tgz#764a5a11af50561921b133f3b44e618687e0f5c3"
-
 to-fast-properties@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.3.tgz#b83571fa4d8c25b82e231b06e3a3055de4ca1a47"
@@ -3096,28 +1918,6 @@ to-fast-properties@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e"
 
-to-object-path@^0.3.0:
-  version "0.3.0"
-  resolved "https://registry.yarnpkg.com/to-object-path/-/to-object-path-0.3.0.tgz#297588b7b0e7e0ac08e04e672f85c1f4999e17af"
-  dependencies:
-    kind-of "^3.0.2"
-
-to-regex-range@^2.1.0:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/to-regex-range/-/to-regex-range-2.1.1.tgz#7c80c17b9dfebe599e27367e0d4dd5590141db38"
-  dependencies:
-    is-number "^3.0.0"
-    repeat-string "^1.6.1"
-
-to-regex@^3.0.1, to-regex@^3.0.2:
-  version "3.0.2"
-  resolved "https://registry.yarnpkg.com/to-regex/-/to-regex-3.0.2.tgz#13cfdd9b336552f30b51f33a8ae1b42a7a7599ce"
-  dependencies:
-    define-property "^2.0.2"
-    extend-shallow "^3.0.2"
-    regex-not "^1.0.2"
-    safe-regex "^1.1.0"
-
 trim-newlines@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/trim-newlines/-/trim-newlines-2.0.0.tgz#b403d0b91be50c331dfc4b82eeceb22c3de16d20"
@@ -3130,78 +1930,15 @@ type-detect@4.0.8, type-detect@^4.0.0, type-detect@^4.0.5:
   version "4.0.8"
   resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c"
 
-uglify-js@2.6.4:
-  version "2.6.4"
-  resolved "http://registry.npmjs.org/uglify-js/-/uglify-js-2.6.4.tgz#65ea2fb3059c9394692f15fed87c2b36c16b9adf"
-  dependencies:
-    async "~0.2.6"
-    source-map "~0.5.1"
-    uglify-to-browserify "~1.0.0"
-    yargs "~3.10.0"
-
-uglify-save-license@^0.4.1:
-  version "0.4.1"
-  resolved "https://registry.yarnpkg.com/uglify-save-license/-/uglify-save-license-0.4.1.tgz#95726c17cc6fd171c3617e3bf4d8d82aa8c4cce1"
-
-uglify-to-browserify@~1.0.0:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/uglify-to-browserify/-/uglify-to-browserify-1.0.2.tgz#6e0924d6bda6b5afe349e39a6d632850a0f882b7"
-
 ultron@~1.1.0:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/ultron/-/ultron-1.1.1.tgz#9fe1536a10a664a65266a1e3ccf85fd36302bc9c"
 
-unc-path-regex@^0.1.2:
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/unc-path-regex/-/unc-path-regex-0.1.2.tgz#e73dd3d7b0d7c5ed86fbac6b0ae7d8c6a69d50fa"
-
-union-value@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/union-value/-/union-value-1.0.0.tgz#5c71c34cb5bad5dcebe3ea0cd08207ba5aa1aea4"
-  dependencies:
-    arr-union "^3.1.0"
-    get-value "^2.0.6"
-    is-extendable "^0.1.1"
-    set-value "^0.4.3"
-
-unique-stream@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/unique-stream/-/unique-stream-1.0.0.tgz#d59a4a75427447d9aa6c91e70263f8d26a4b104b"
-
 universalify@^0.1.0:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66"
   integrity sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==
 
-unset-value@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/unset-value/-/unset-value-1.0.0.tgz#8376873f7d2335179ffb1e6fc3a8ed0dfc8ab559"
-  dependencies:
-    has-value "^0.3.1"
-    isobject "^3.0.0"
-
-urix@^0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/urix/-/urix-0.1.0.tgz#da937f7a62e21fec1fd18d49b35c2935067a6c72"
-
-use@^3.1.0:
-  version "3.1.1"
-  resolved "https://registry.yarnpkg.com/use/-/use-3.1.1.tgz#d50c8cac79a19fbc20f2911f56eb973f4e10070f"
-
-user-home@^1.1.1:
-  version "1.1.1"
-  resolved "https://registry.yarnpkg.com/user-home/-/user-home-1.1.1.tgz#2b5be23a32b63a7c9deb8d0f28d485724a3df190"
-
-util-deprecate@~1.0.1:
-  version "1.0.2"
-  resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
-
-v8flags@^2.0.2:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/v8flags/-/v8flags-2.1.1.tgz#aab1a1fa30d45f88dd321148875ac02c0b55e5b4"
-  dependencies:
-    user-home "^1.1.1"
-
 validate-npm-package-license@^3.0.1:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz#fc91f6b9c7ba15c857f4cb2c5defeec39d4f410a"
@@ -3209,54 +1946,12 @@ validate-npm-package-license@^3.0.1:
     spdx-correct "^3.0.0"
     spdx-expression-parse "^3.0.0"
 
-vinyl-fs@^0.3.0:
-  version "0.3.14"
-  resolved "https://registry.yarnpkg.com/vinyl-fs/-/vinyl-fs-0.3.14.tgz#9a6851ce1cac1c1cea5fe86c0931d620c2cfa9e6"
-  dependencies:
-    defaults "^1.0.0"
-    glob-stream "^3.1.5"
-    glob-watcher "^0.0.6"
-    graceful-fs "^3.0.0"
-    mkdirp "^0.5.0"
-    strip-bom "^1.0.0"
-    through2 "^0.6.1"
-    vinyl "^0.4.0"
-
-vinyl-sourcemaps-apply@^0.2.0:
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/vinyl-sourcemaps-apply/-/vinyl-sourcemaps-apply-0.2.1.tgz#ab6549d61d172c2b1b87be5c508d239c8ef87705"
-  dependencies:
-    source-map "^0.5.1"
-
-vinyl@^0.4.0:
-  version "0.4.6"
-  resolved "https://registry.yarnpkg.com/vinyl/-/vinyl-0.4.6.tgz#2f356c87a550a255461f36bbeb2a5ba8bf784847"
-  dependencies:
-    clone "^0.2.0"
-    clone-stats "^0.0.1"
-
-vinyl@^0.5.0:
-  version "0.5.3"
-  resolved "https://registry.yarnpkg.com/vinyl/-/vinyl-0.5.3.tgz#b0455b38fc5e0cf30d4325132e461970c2091cde"
-  dependencies:
-    clone "^1.0.0"
-    clone-stats "^0.0.1"
-    replace-ext "0.0.1"
-
-which@^1.2.14, which@^1.2.9:
+which@^1.2.9:
   version "1.3.1"
   resolved "https://registry.yarnpkg.com/which/-/which-1.3.1.tgz#a45043d54f5805316da8d62f9f50918d3da70b0a"
   dependencies:
     isexe "^2.0.0"
 
-window-size@0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/window-size/-/window-size-0.1.0.tgz#5438cd2ea93b202efa3a19fe8887aee7c94f9c9d"
-
-wordwrap@0.0.2:
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/wordwrap/-/wordwrap-0.0.2.tgz#b79669bb42ecb409f83d583cad52ca17eaa1643f"
-
 wrappy@1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
@@ -3269,23 +1964,6 @@ ws@3.3.x:
     safe-buffer "~5.1.0"
     ultron "~1.1.0"
 
-"xtend@>=4.0.0 <4.1.0-0", xtend@~4.0.1:
-  version "4.0.1"
-  resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"
-
-xtend@~3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/xtend/-/xtend-3.0.0.tgz#5cce7407baf642cba7becda568111c493f59665a"
-
 yallist@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.0.2.tgz#8452b4bb7e83c7c188d8041c1a837c773d6d8bb9"
-
-yargs@~3.10.0:
-  version "3.10.0"
-  resolved "http://registry.npmjs.org/yargs/-/yargs-3.10.0.tgz#f7ee7bd857dd7c1d2d38c0e74efbd681d1431fd1"
-  dependencies:
-    camelcase "^1.0.2"
-    cliui "^2.1.0"
-    decamelize "^1.0.0"
-    window-size "0.1.0"

From 208f0fcad2698613c2c8790a85f07fb6cfdb3073 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 7 Jan 2019 11:35:27 +0100
Subject: [PATCH 28/65] Moved demo to demo folder

---
 {dist => demo}/demo-images/1.jpg | Bin
 {dist => demo}/demo-images/2.jpg | Bin
 {dist => demo}/demo-images/3.jpg | Bin
 {dist => demo}/demo-images/4.jpg | Bin
 {dist => demo}/demo-images/5.jpg | Bin
 {dist => demo}/demo-images/6.jpg | Bin
 {dist => demo}/demo-images/7.jpg | Bin
 {dist => demo}/demo-images/8.jpg | Bin
 {dist => demo}/index.html        |   4 ++--
 9 files changed, 2 insertions(+), 2 deletions(-)
 rename {dist => demo}/demo-images/1.jpg (100%)
 rename {dist => demo}/demo-images/2.jpg (100%)
 rename {dist => demo}/demo-images/3.jpg (100%)
 rename {dist => demo}/demo-images/4.jpg (100%)
 rename {dist => demo}/demo-images/5.jpg (100%)
 rename {dist => demo}/demo-images/6.jpg (100%)
 rename {dist => demo}/demo-images/7.jpg (100%)
 rename {dist => demo}/demo-images/8.jpg (100%)
 rename {dist => demo}/index.html (98%)

diff --git a/dist/demo-images/1.jpg b/demo/demo-images/1.jpg
similarity index 100%
rename from dist/demo-images/1.jpg
rename to demo/demo-images/1.jpg
diff --git a/dist/demo-images/2.jpg b/demo/demo-images/2.jpg
similarity index 100%
rename from dist/demo-images/2.jpg
rename to demo/demo-images/2.jpg
diff --git a/dist/demo-images/3.jpg b/demo/demo-images/3.jpg
similarity index 100%
rename from dist/demo-images/3.jpg
rename to demo/demo-images/3.jpg
diff --git a/dist/demo-images/4.jpg b/demo/demo-images/4.jpg
similarity index 100%
rename from dist/demo-images/4.jpg
rename to demo/demo-images/4.jpg
diff --git a/dist/demo-images/5.jpg b/demo/demo-images/5.jpg
similarity index 100%
rename from dist/demo-images/5.jpg
rename to demo/demo-images/5.jpg
diff --git a/dist/demo-images/6.jpg b/demo/demo-images/6.jpg
similarity index 100%
rename from dist/demo-images/6.jpg
rename to demo/demo-images/6.jpg
diff --git a/dist/demo-images/7.jpg b/demo/demo-images/7.jpg
similarity index 100%
rename from dist/demo-images/7.jpg
rename to demo/demo-images/7.jpg
diff --git a/dist/demo-images/8.jpg b/demo/demo-images/8.jpg
similarity index 100%
rename from dist/demo-images/8.jpg
rename to demo/demo-images/8.jpg
diff --git a/dist/index.html b/demo/index.html
similarity index 98%
rename from dist/index.html
rename to demo/index.html
index d3c19c5..49333d5 100644
--- a/dist/index.html
+++ b/demo/index.html
@@ -2,8 +2,8 @@
 <html>
     <head>
         <meta charset="utf-8" />
-        <link rel="stylesheet" href="./css/chocolat.css" />
-        <script type="text/javascript" src="./js/chocolat.iife.js"></script>
+        <link rel="stylesheet" href="../dist/css/chocolat.css" />
+        <script type="text/javascript" src="../dist/js/chocolat.iife.js"></script>
         <style>
             body {
                 text-align: center;

From c23029ce8b81003fe16200efabc3f21cf0c4e992 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 7 Jan 2019 11:39:37 +0100
Subject: [PATCH 29/65] reduced fadeout effect

---
 dist/css/chocolat.css | 8 ++++----
 src/css/chocolat.css  | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/dist/css/chocolat.css b/dist/css/chocolat.css
index 742060b..1d4114c 100644
--- a/dist/css/chocolat.css
+++ b/dist/css/chocolat.css
@@ -5,7 +5,7 @@
     overflow: hidden;
 }
 .chocolat-overlay{
-    transition: opacity 1s ease, visibility 0s 1s ease;
+    transition: opacity .4s ease, visibility 0s .4s ease;
     height:100%;
     width:100%;
     position:fixed;
@@ -17,13 +17,13 @@
     opacity: 0;
 }
 .chocolat-overlay.chocolat-visible{
-    transition: opacity 1s, visibility 0s;
+    transition: opacity .4s, visibility 0s;
     visibility: visible;
     opacity: 0.8;
 }
 
 .chocolat-wrapper{
-    transition: opacity 1s ease, visibility 0s 1s ease;
+    transition: opacity .4s ease, visibility 0s .4s ease;
     width:100%;
     height: 100%;
     position:fixed;
@@ -35,7 +35,7 @@
     visibility: hidden;
 }
 .chocolat-wrapper.chocolat-visible{
-    transition: opacity 1s, visibility 0s;
+    transition: opacity .4s, visibility 0s;
     opacity: 1;
     visibility: visible;
 }
diff --git a/src/css/chocolat.css b/src/css/chocolat.css
index 742060b..1d4114c 100644
--- a/src/css/chocolat.css
+++ b/src/css/chocolat.css
@@ -5,7 +5,7 @@
     overflow: hidden;
 }
 .chocolat-overlay{
-    transition: opacity 1s ease, visibility 0s 1s ease;
+    transition: opacity .4s ease, visibility 0s .4s ease;
     height:100%;
     width:100%;
     position:fixed;
@@ -17,13 +17,13 @@
     opacity: 0;
 }
 .chocolat-overlay.chocolat-visible{
-    transition: opacity 1s, visibility 0s;
+    transition: opacity .4s, visibility 0s;
     visibility: visible;
     opacity: 0.8;
 }
 
 .chocolat-wrapper{
-    transition: opacity 1s ease, visibility 0s 1s ease;
+    transition: opacity .4s ease, visibility 0s .4s ease;
     width:100%;
     height: 100%;
     position:fixed;
@@ -35,7 +35,7 @@
     visibility: hidden;
 }
 .chocolat-wrapper.chocolat-visible{
-    transition: opacity 1s, visibility 0s;
+    transition: opacity .4s, visibility 0s;
     opacity: 1;
     visibility: visible;
 }

From 2b9b48c2f38495c285543fdb46c6b323278a0d49 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 7 Jan 2019 11:41:32 +0100
Subject: [PATCH 30/65] Fixed path to images

---
 test/index.html | 6 +++---
 test/test.js    | 6 +++---
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/test/index.html b/test/index.html
index 2673fa3..8f55bec 100644
--- a/test/index.html
+++ b/test/index.html
@@ -10,13 +10,13 @@
     <div style="width: 299px;height: 500px;background: silver;margin-left: 250px;margin-top: 250px;" id="container"></div>
 
     <div id="example0">
-        <a class="chocolat-image" href="../dist/demo-images/1.jpg" title="foo">
+        <a class="chocolat-image" href="../demo/demo-images/1.jpg" title="foo">
             1
         </a>
-        <a class="chocolat-image" href="../dist/demo-images/2.jpg" title="baz">
+        <a class="chocolat-image" href="../demo/demo-images/2.jpg" title="baz">
             2
         </a>
-        <a class="chocolat-image" href="../dist/demo-images/3.jpg" title="bar">
+        <a class="chocolat-image" href="../demo/demo-images/3.jpg" title="bar">
             3
         </a>
     </div>
diff --git a/test/test.js b/test/test.js
index 015798e..934aafe 100644
--- a/test/test.js
+++ b/test/test.js
@@ -694,9 +694,9 @@ describe('Chocolat', function() {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 backgroundClose: false,
                 images: [
-                    { src: '../dist/demo-images/1.jpg', title: 'You can zoom in the image' },
-                    { src: '../dist/demo-images/2.jpg', title: 'You can zoom in the image' },
-                    { src: '../dist/demo-images/3.jpg', title: 'You can zoom in the image' },
+                    { src: '../demo/demo-images/1.jpg', title: 'You can zoom in the image' },
+                    { src: '../demo/demo-images/2.jpg', title: 'You can zoom in the image' },
+                    { src: '../demo/demo-images/3.jpg', title: 'You can zoom in the image' },
                 ],
             })
         })

From 0bf27862c29c6058d76b474b9e932f089c1272ed Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 18 Feb 2019 11:28:21 +0100
Subject: [PATCH 31/65] Updated readme

---
 readme.md | 175 +++++++++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 139 insertions(+), 36 deletions(-)

diff --git a/readme.md b/readme.md
index eeb7903..64dd191 100644
--- a/readme.md
+++ b/readme.md
@@ -8,7 +8,7 @@ What you are looking for is in the `/dist/` folder.
 
 
 ## Installation
-You can install chocolat as a node module    
+You can install chocolat as a node module  
 (css from node_modules has to be linked in your html file anyway)
 ```
 yarn add chocolat
@@ -24,7 +24,7 @@ Or the old school way by linking `dist/js/jquery.chocolat.js` and `dist/css/choc
 ## Markup
 -----------
 ```html
-<div id="example1" data-chocolat-title="Set title">
+<div id="example1">
     <a class="chocolat-image" href="img/a.jpg" title="image caption a">
         A <!-- you can display a thumbnail here : <img src="thumb/a.jpg" /> -->
     </a>
@@ -35,56 +35,159 @@ Or the old school way by linking `dist/js/jquery.chocolat.js` and `dist/css/choc
 ```
 
 ```js
-$(document).ready(function(){
-    $('#example1').Chocolat();
-});
+Chocolat(document.querySelectorAll('#example1 .chocolat-image'), {})
 ```
 
 ## Documentation
 -----------
 
 ### Parameters
-| Name          | Default             | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |
-|---------------|---------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
-| container     | `window`            | Sets whether viewer will open and fill the whole page (`default`), or whether it should open in a particular block of the page. For example ` #container2`, in this case the height and width of the block must be defined.values can be : window, selector, jQuery element, or a node                                                                                                                                                                                                                                                                                                                                                                                                                       |
-| imageSelector | `'.chocolat-image'` | Selector to find images in the parent element (on which chocolat is called)                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |
-| linkImages    | `true`              | Sets whether we can switch from one image to another, within the same call, without closing the viewer (`true`) , or if the images remain independent (`false`). <br> Warning: if `LinkImage`: is `false` then `displayAsALink` must be worth `false` too. <br>Otherwise we can only view the first image in the set.                                                                                                                                                                                                                                                                                                                                                                                               |
-| setTitle      | `''`                | Title of the set. Can also be defined from the html, with the `data-chocolat-title` attribute                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |
-| className     | `''`                | Add a custom css class to the parent of the lightbox                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         |
-| imageSize     | 'default'           | Can be `'default'`, `'contain'`, `'native'`, or `'cover'`. <br>`default` : if the image is bigger than the window it's resized to fit, else if the image is smaller than the window it's not streched, only displayed at native dimensions. <br>`'contain'` : if the image is bigger than the window it's resized to fit, else if the image is smaller than the window it's streched, to fit the window. <br>`'cover'` : the image cover the window, no white space are displayed. More informations & exemple about contain/cover [here](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Scaling_background_images). <br>`'native'` : the image is never streched nor shrinked, always displayed at native dimensions |
-| fullScreen    | `false`             | Allow fullscreen browsing (hides the browser window)                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                         |
-| loop          | `false`             | Last image + 1 leads to first image & first image - 1 leads to last image.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |
-| duration      | `300`               | Animations duration                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |
-| firstImage    | `0`                 | Index of the image that you want to start the series.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                        |
-| lastImage     | `0`                 | Index of the image that you want to end the series.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |
-| separator2    | `'/'`               | Text between the number of the image and the number of images in the set, does not matter.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |
-| images        | `[]`                | Array of object representing the set images `[{src:'img1.jpg'}, {src:'img1.jpg'}, ...] ` <br> You can also specify image title `[{src:'img1.jpg', title: 'title'}, ..]`                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |
-| enableZoom    | `true`              | Disable or enable the zooming feature                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                          |
-| setIndex      | `0`                 | Set index. yes.                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              |                                                                                                                                                                                                   |
-| afterInitialize      | `null`                 | Function (hook) called just after chocolat gets initialized
-|                                                                                                                                                                                                 |
-| afterMarkup      | `null`                 | Function (hook) called just after markup is created. <br>You can use it to alter the default markup: to move the caption at the top of the image for example. <br> `$('#example').Chocolat({`<br>`    afterMarkup: function () {`<br>`        this.elems.description.appendTo(this.elems.top)`<br>`    }`<br>`});`
-|                                                                                                                                                                                                 |
-| afterImageLoad      | `null`                 | Function (hook) called just after the image is loaded.
-|                                                                                                                                                                                                 |
-| zoomedPaddingX      | `0`                 | Function returning the horizontal padding to add around the image when it's zoomed. <br> It takes 2 arguments `canvasWidth` and `imgWidth` <br> `$('#example').Chocolat({`<br>`    zoomedPaddingX: function (canvasWidth, imgWidth) {`<br>`        return canvasWidth / 2 `<br>`    }`<br>`});`
-|                                                                                                                                                                                                 |
-| zoomedPaddingY      | `0`                 | Function returning the vertical padding to add around the image when it's zoomed. <br> It takes 2 arguments `canvasHeight` and `imgHeight` <br> `$('#example').Chocolat({`<br>`    zoomedPaddingY: function (canvasHeight, imgHeight) {`<br>`        return canvasHeight / 2 `<br>`    }`<br>`});`
-|                                                                                                                                                                                                 |
+
+**container :**  
+type: `HTML Node`
+default: `window`  
+Sets whether viewer will open and fill the whole page (`default`), or whether it should open in a particular block of the page.  
+For example `#container2`, in this case the height and width of the block must be defined.
+Values can be : window, or a node.
+
+**linkImages :**  
+type: `boolean`
+default: `true`  
+Sets whether we can switch from one image to another, within the same call, without closing the viewer (`true`), or if the images remain independent (`false`). 
+
+**setTitle :**  
+type: `function`
+default: `() => ''`  
+Function returning the title of the set.
+
+**pagination :**  
+type: `function`
+default: `() => position + '/' + last`  
+Function returning the pagination (ex: 2/5).
+
+**description :**  
+type: `function`
+default: `() => this.settings.images[this.settings.currentImage].title`  
+Function returning the description of the image.
+
+**className :**  
+type: `string`
+default: `''`  
+Add custom css classes to the parent of the lightbox.
+
+**imageSize :**  
+type: `string`
+default: `'default'`  
+Can be `'default'`, `'contain'`, `'native'`, or `'cover'`.  
+ - `default` : if the image is bigger than the window it's resized to fit, else if the image is smaller than the window it's not streched, only displayed at native dimensions.  
+ - `'contain'` : if the image is bigger than the window it's resized to fit, else if the image is smaller than the window it's streched, to fit the window.  
+ - `'cover'` : the image cover the window, no white space are displayed. More informations & exemple about contain/cover [here](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Scaling_background_images).  
+ - `'native'` : the image is never streched nor shrinked, always displayed at native dimensions  
+
+**fullScreen :**  
+type: `boolean`
+default: `false`  
+Allow fullscreen browsing (hides the browser window).
+
+**loop :**  
+type: `boolean`
+default: `false`  
+Last image + 1 leads to first image & first image - 1 leads to last image.
+
+**firstImage :**  
+type: `number`
+default: `0`  
+Index of the image that you want to start the series.
+
+**lastImage :**  
+type: `number`
+default: `this.settings.images.length - 1`  
+Index of the image that you want to end the series. 
+
+**images :**  
+type: `array`
+default: `undefined`  
+Array of objects representing the set images.
+```js
+[
+    {
+        src:'img1.jpg',
+        title: 'title'
+    }, {
+        src:'img1.jpg',  
+        title: 'title'
+    }, ...
+]
+```
+If `undefined` (default) it's built based on DOM attributes.
+
+**enableZoom :**  
+type: `boolean`
+default: `true`  
+Disable or enable the zooming feature.  
+
+**afterInitialize :**  
+type: `function`
+default: `undefined`  
+Function (hook) called just after chocolat gets initialized.  
+
+**afterMarkup :**  
+type: `function`
+default: `undefined`  
+Function (hook) called just after markup is created. 
+You can use it to alter the default markup: to move the caption at the top of the image for example.
+```js
+Chocolat(document.querySelectorAll('.chocolat-image'), {
+    afterMarkup: function() {
+        return $(this.elems.description).appendTo(this.elems.top)
+    },
+})
+
+```
+
+**afterImageLoad :**  
+type: `function`
+default: `undefined`  
+Function (hook) called just after the image is loaded.
+
+
+**zoomedPaddingX :**  
+type: `function`
+default: `(canvasWidth, imgWidth) => 0`  
+Function returning the horizontal padding to add around the image when it's zoomed.
+It takes 2 arguments `canvasWidth` and `imgWidth`
+```js
+Chocolat(document.querySelectorAll('.chocolat-image'), {
+    zoomedPaddingX: function (canvasWidth, imgWidth) {
+        return canvasWidth / 2
+    }
+})
+```
+
+**zoomedPaddingY :**  
+type: `function`
+default: `(canvasHeight, imgHeight) => 0`  
+Function returning the vertical padding to add around the image when it's zoomed.
+It takes 2 arguments `canvasHeight` and `imgHeight`
+```js
+Chocolat(document.querySelectorAll('.chocolat-image'), {
+    zoomedPaddingY: function (canvasHeight, imgHeight) {
+        return canvasHeight / 2
+    }
+})
+```
 
 ### API
 
 ###### Syntax
 Call chocolat like this :
 ```js
-$(document).ready(function(){
-    var instance = $('#example1').Chocolat().data('chocolat');
-});
+var instance = Chocolat(document.querySelectorAll('#example1 .chocolat-image'), {})
 ```
 
 Then API calls can be made like this (open for exemple):
 ```js
-instance.api().open();
+instance.api().open()
 ```
 
 ###### Methods

From 7b16526b9d947657b810b883b0c424be430eca05 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 18 Feb 2019 11:28:43 +0100
Subject: [PATCH 32/65] Removed duration from center and zooming methods

---
 src/js/chocolat.js | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index a2d5fd5..5586484 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -229,7 +229,7 @@ export class Chocolat {
     }
 
     change(signe) {
-        this.zoomOut(0)
+        this.zoomOut()
         this.zoomable()
 
         var requestedImage = this.settings.currentImage + parseInt(signe)
@@ -539,7 +539,7 @@ export class Chocolat {
             this.debounce(50, () => {
                 const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
 
-                this.center(width, height, left, top, 0)
+                this.center(width, height, left, top)
                 this.zoomable()
             })
         })
@@ -574,22 +574,20 @@ export class Chocolat {
         this.elems.domContainer.classList.add('chocolat-zoomed')
         const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
 
-        return this.center(width, height, left, top, this.settings.duration)
+        return this.center(width, height, left, top)
     }
 
-    zoomOut(e, duration) {
+    zoomOut(e) {
         if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
             return
         }
-        duration = duration || this.settings.duration
-
         this.settings.imageSize = this.settings.initialZoomState
         this.settings.initialZoomState = null
         this.elems.img.style.margin = 0
 
         this.elems.domContainer.classList.remove('chocolat-zoomed')
         const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
-        return this.center(width, height, left, top, duration)
+        return this.center(width, height, left, top)
     }
 
     setDomContainer() {

From bb9802fe517fe04a568345b5c2b5d04690c82510 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 18 Feb 2019 11:38:27 +0100
Subject: [PATCH 33/65] MarkDamn

---
 readme.md | 62 +++++++++++++++++++++++++++----------------------------
 1 file changed, 31 insertions(+), 31 deletions(-)

diff --git a/readme.md b/readme.md
index 64dd191..c4336dc 100644
--- a/readme.md
+++ b/readme.md
@@ -44,40 +44,40 @@ Chocolat(document.querySelectorAll('#example1 .chocolat-image'), {})
 ### Parameters
 
 **container :**  
-type: `HTML Node`
-default: `window`  
+type: `HTML Node`  
+default: `window`   
 Sets whether viewer will open and fill the whole page (`default`), or whether it should open in a particular block of the page.  
 For example `#container2`, in this case the height and width of the block must be defined.
 Values can be : window, or a node.
 
 **linkImages :**  
-type: `boolean`
-default: `true`  
+type: `boolean`  
+default: `true`    
 Sets whether we can switch from one image to another, within the same call, without closing the viewer (`true`), or if the images remain independent (`false`). 
 
 **setTitle :**  
-type: `function`
+type: `function`  
 default: `() => ''`  
 Function returning the title of the set.
 
 **pagination :**  
-type: `function`
+type: `function`  
 default: `() => position + '/' + last`  
 Function returning the pagination (ex: 2/5).
 
 **description :**  
-type: `function`
+type: `function`  
 default: `() => this.settings.images[this.settings.currentImage].title`  
 Function returning the description of the image.
 
 **className :**  
-type: `string`
-default: `''`  
+type: `string`   
+default: `''`   
 Add custom css classes to the parent of the lightbox.
 
 **imageSize :**  
-type: `string`
-default: `'default'`  
+type: `string`  
+default: `'default'`   
 Can be `'default'`, `'contain'`, `'native'`, or `'cover'`.  
  - `default` : if the image is bigger than the window it's resized to fit, else if the image is smaller than the window it's not streched, only displayed at native dimensions.  
  - `'contain'` : if the image is bigger than the window it's resized to fit, else if the image is smaller than the window it's streched, to fit the window.  
@@ -85,28 +85,28 @@ Can be `'default'`, `'contain'`, `'native'`, or `'cover'`.
  - `'native'` : the image is never streched nor shrinked, always displayed at native dimensions  
 
 **fullScreen :**  
-type: `boolean`
-default: `false`  
+type: `boolean`  
+default: `false`   
 Allow fullscreen browsing (hides the browser window).
 
 **loop :**  
-type: `boolean`
+type: `boolean`  
 default: `false`  
 Last image + 1 leads to first image & first image - 1 leads to last image.
 
 **firstImage :**  
-type: `number`
-default: `0`  
+type: `number`  
+default: `0`   
 Index of the image that you want to start the series.
 
 **lastImage :**  
-type: `number`
+type: `number`  
 default: `this.settings.images.length - 1`  
 Index of the image that you want to end the series. 
 
 **images :**  
-type: `array`
-default: `undefined`  
+type: `array`  
+default: `undefined`    
 Array of objects representing the set images.
 ```js
 [
@@ -122,18 +122,18 @@ Array of objects representing the set images.
 If `undefined` (default) it's built based on DOM attributes.
 
 **enableZoom :**  
-type: `boolean`
-default: `true`  
+type: `boolean`  
+default: `true`    
 Disable or enable the zooming feature.  
 
 **afterInitialize :**  
-type: `function`
-default: `undefined`  
+type: `function`  
+default: `undefined`   
 Function (hook) called just after chocolat gets initialized.  
 
 **afterMarkup :**  
-type: `function`
-default: `undefined`  
+type: `function`  
+default: `undefined`    
 Function (hook) called just after markup is created. 
 You can use it to alter the default markup: to move the caption at the top of the image for example.
 ```js
@@ -146,14 +146,14 @@ Chocolat(document.querySelectorAll('.chocolat-image'), {
 ```
 
 **afterImageLoad :**  
-type: `function`
-default: `undefined`  
+type: `function`    
+default: `undefined`    
 Function (hook) called just after the image is loaded.
 
 
 **zoomedPaddingX :**  
-type: `function`
-default: `(canvasWidth, imgWidth) => 0`  
+type: `function`  
+default: `(canvasWidth, imgWidth) => 0`    
 Function returning the horizontal padding to add around the image when it's zoomed.
 It takes 2 arguments `canvasWidth` and `imgWidth`
 ```js
@@ -165,8 +165,8 @@ Chocolat(document.querySelectorAll('.chocolat-image'), {
 ```
 
 **zoomedPaddingY :**  
-type: `function`
-default: `(canvasHeight, imgHeight) => 0`  
+type: `function`  
+default: `(canvasHeight, imgHeight) => 0`    
 Function returning the vertical padding to add around the image when it's zoomed.
 It takes 2 arguments `canvasHeight` and `imgHeight`
 ```js

From 7ba51102b1ebaf4e2507d439d0b50c4607c145a3 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Fri, 8 Nov 2019 21:55:00 +0100
Subject: [PATCH 34/65] More precise settings name

---
 dist/js/chocolat.cjs.js  | 57 ++++++++++++++++++++--------------------
 dist/js/chocolat.esm.js  | 57 ++++++++++++++++++++--------------------
 dist/js/chocolat.iife.js | 57 ++++++++++++++++++++--------------------
 src/js/chocolat.js       | 49 ++++++++++++++++++----------------
 test/test.js             | 16 ++++++-----
 5 files changed, 119 insertions(+), 117 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 4ffe90e..0ae522d 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -2,7 +2,7 @@
 
 const defaults = {
   container: window,
-  // window or jquery object or jquery selector, or element
+  // window or element
   className: undefined,
   imageSize: 'default',
   // 'default', 'contain', 'cover' or 'native'
@@ -12,9 +12,9 @@ const defaults = {
   linkImages: true,
   duration: 300,
   setIndex: 0,
-  firstImage: 0,
-  lastImage: false,
-  currentImage: undefined,
+  firstImageIndex: 0,
+  lastImageIndex: false,
+  currentImageIndex: undefined,
   initialized: false,
   timer: false,
   timerDebounce: false,
@@ -25,11 +25,11 @@ const defaults = {
     return '';
   },
   description: function () {
-    return this.settings.images[this.settings.currentImage].title;
+    return this.settings.images[this.settings.currentImageIndex].title;
   },
   pagination: function () {
-    var last = this.settings.lastImage + 1;
-    var position = this.settings.currentImage + 1;
+    var last = this.settings.lastImageIndex + 1;
+    var position = this.settings.currentImageIndex + 1;
     return position + '/' + last;
   },
 
@@ -73,7 +73,7 @@ class Chocolat {
       this.setDomContainer();
       this.markup();
       this.attachListeners();
-      this.settings.lastImage = this.settings.images.length - 1;
+      this.settings.lastImageIndex = this.settings.images.length - 1;
       this.settings.initialized = true;
     }
 
@@ -99,7 +99,7 @@ class Chocolat {
       this.openFullScreen();
     }
 
-    if (this.settings.currentImage === i) {
+    if (this.settings.currentImageIndex === i) {
       return Promise.resolve();
     }
 
@@ -121,7 +121,7 @@ class Chocolat {
         this.loadImage(this.settings.images[nextIndex].src, new Image());
       }
 
-      this.settings.currentImage = i;
+      this.settings.currentImageIndex = i;
       const place = this.place(imgLoader);
       const appear = this.appear(i);
       return Promise.all([place, appear]);
@@ -219,17 +219,17 @@ class Chocolat {
   }
 
   change(signe) {
-    this.zoomOut(0);
+    this.zoomOut();
     this.zoomable();
-    var requestedImage = this.settings.currentImage + parseInt(signe);
+    var requestedImage = this.settings.currentImageIndex + parseInt(signe);
 
-    if (requestedImage > this.settings.lastImage) {
+    if (requestedImage > this.settings.lastImageIndex) {
       if (this.settings.loop) {
         return this.load(0);
       }
     } else if (requestedImage < 0) {
       if (this.settings.loop) {
-        return this.load(this.settings.lastImage);
+        return this.load(this.settings.lastImageIndex);
       }
     } else {
       return this.load(requestedImage);
@@ -242,14 +242,14 @@ class Chocolat {
       this.elems.right.classList.add('active');
     } else if (this.settings.linkImages) {
       // right
-      if (this.settings.currentImage == this.settings.lastImage) {
+      if (this.settings.currentImageIndex == this.settings.lastImageIndex) {
         this.elems.right.classList.remove('active');
       } else {
         this.elems.right.classList.add('active');
       } // left
 
 
-      if (this.settings.currentImage === 0) {
+      if (this.settings.currentImageIndex === 0) {
         this.elems.left.classList.remove('active');
       } else {
         this.elems.left.classList.add('active');
@@ -266,7 +266,7 @@ class Chocolat {
       return;
     }
 
-    this.settings.currentImage = undefined;
+    this.settings.currentImageIndex = undefined;
     const promiseOverlay = this.transitionAsPromise(() => {
       this.elems.overlay.classList.remove('chocolat-visible');
     }, this.elems.overlay);
@@ -295,7 +295,7 @@ class Chocolat {
       this.exitFullScreen();
     }
 
-    this.settings.currentImage = undefined;
+    this.settings.currentImageIndex = undefined;
     this.settings.initialized = false;
     this.elems.domContainer.classList.remove(...this._cssClasses);
     this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
@@ -466,7 +466,7 @@ class Chocolat {
         return;
       }
 
-      if (this.settings.currentImage === undefined) {
+      if (this.settings.currentImageIndex === undefined) {
         return;
       }
 
@@ -477,7 +477,7 @@ class Chocolat {
       };
       var height = this.elems.wrapper.clientHeight;
       var width = this.elems.wrapper.clientWidth;
-      var currentImage = this.settings.images[this.settings.currentImage];
+      var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
       var imgWidth = this.elems.img.width;
       var imgHeight = this.elems.img.height;
       var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
@@ -501,7 +501,7 @@ class Chocolat {
       this.elems.img.style.marginTop = -mvtY + 'px';
     });
     this.on(window, 'resize.chocolat', e => {
-      if (!this.settings.initialized || this.settings.currentImage === undefined) {
+      if (!this.settings.initialized || this.settings.currentImageIndex === undefined) {
         return;
       }
 
@@ -512,14 +512,14 @@ class Chocolat {
           left,
           top
         } = this.fit(this.elems.img, this.elems.wrapper);
-        this.center(width, height, left, top, 0);
+        this.center(width, height, left, top);
         this.zoomable();
       });
     });
   }
 
   zoomable() {
-    var currentImage = this.settings.images[this.settings.currentImage];
+    var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
     var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
@@ -542,15 +542,14 @@ class Chocolat {
       left,
       top
     } = this.fit(this.elems.img, this.elems.wrapper);
-    return this.center(width, height, left, top, this.settings.duration);
+    return this.center(width, height, left, top);
   }
 
-  zoomOut(e, duration) {
-    if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
+  zoomOut(e) {
+    if (this.settings.initialZoomState === null || this.settings.currentImageIndex === undefined) {
       return;
     }
 
-    duration = duration || this.settings.duration;
     this.settings.imageSize = this.settings.initialZoomState;
     this.settings.initialZoomState = null;
     this.elems.img.style.margin = 0;
@@ -561,7 +560,7 @@ class Chocolat {
       left,
       top
     } = this.fit(this.elems.img, this.elems.wrapper);
-    return this.center(width, height, left, top, duration);
+    return this.center(width, height, left, top);
   }
 
   setDomContainer() {
@@ -644,7 +643,7 @@ class Chocolat {
         return this.open(i);
       },
       current: () => {
-        return this.settings.currentImage;
+        return this.settings.currentImageIndex;
       },
       place: () => {
         return this.place(this.elems.img, this.settings.duration);
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 685c9cf..2d6e70a 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -1,6 +1,6 @@
 const defaults = {
   container: window,
-  // window or jquery object or jquery selector, or element
+  // window or element
   className: undefined,
   imageSize: 'default',
   // 'default', 'contain', 'cover' or 'native'
@@ -10,9 +10,9 @@ const defaults = {
   linkImages: true,
   duration: 300,
   setIndex: 0,
-  firstImage: 0,
-  lastImage: false,
-  currentImage: undefined,
+  firstImageIndex: 0,
+  lastImageIndex: false,
+  currentImageIndex: undefined,
   initialized: false,
   timer: false,
   timerDebounce: false,
@@ -23,11 +23,11 @@ const defaults = {
     return '';
   },
   description: function () {
-    return this.settings.images[this.settings.currentImage].title;
+    return this.settings.images[this.settings.currentImageIndex].title;
   },
   pagination: function () {
-    var last = this.settings.lastImage + 1;
-    var position = this.settings.currentImage + 1;
+    var last = this.settings.lastImageIndex + 1;
+    var position = this.settings.currentImageIndex + 1;
     return position + '/' + last;
   },
 
@@ -71,7 +71,7 @@ class Chocolat {
       this.setDomContainer();
       this.markup();
       this.attachListeners();
-      this.settings.lastImage = this.settings.images.length - 1;
+      this.settings.lastImageIndex = this.settings.images.length - 1;
       this.settings.initialized = true;
     }
 
@@ -97,7 +97,7 @@ class Chocolat {
       this.openFullScreen();
     }
 
-    if (this.settings.currentImage === i) {
+    if (this.settings.currentImageIndex === i) {
       return Promise.resolve();
     }
 
@@ -119,7 +119,7 @@ class Chocolat {
         this.loadImage(this.settings.images[nextIndex].src, new Image());
       }
 
-      this.settings.currentImage = i;
+      this.settings.currentImageIndex = i;
       const place = this.place(imgLoader);
       const appear = this.appear(i);
       return Promise.all([place, appear]);
@@ -217,17 +217,17 @@ class Chocolat {
   }
 
   change(signe) {
-    this.zoomOut(0);
+    this.zoomOut();
     this.zoomable();
-    var requestedImage = this.settings.currentImage + parseInt(signe);
+    var requestedImage = this.settings.currentImageIndex + parseInt(signe);
 
-    if (requestedImage > this.settings.lastImage) {
+    if (requestedImage > this.settings.lastImageIndex) {
       if (this.settings.loop) {
         return this.load(0);
       }
     } else if (requestedImage < 0) {
       if (this.settings.loop) {
-        return this.load(this.settings.lastImage);
+        return this.load(this.settings.lastImageIndex);
       }
     } else {
       return this.load(requestedImage);
@@ -240,14 +240,14 @@ class Chocolat {
       this.elems.right.classList.add('active');
     } else if (this.settings.linkImages) {
       // right
-      if (this.settings.currentImage == this.settings.lastImage) {
+      if (this.settings.currentImageIndex == this.settings.lastImageIndex) {
         this.elems.right.classList.remove('active');
       } else {
         this.elems.right.classList.add('active');
       } // left
 
 
-      if (this.settings.currentImage === 0) {
+      if (this.settings.currentImageIndex === 0) {
         this.elems.left.classList.remove('active');
       } else {
         this.elems.left.classList.add('active');
@@ -264,7 +264,7 @@ class Chocolat {
       return;
     }
 
-    this.settings.currentImage = undefined;
+    this.settings.currentImageIndex = undefined;
     const promiseOverlay = this.transitionAsPromise(() => {
       this.elems.overlay.classList.remove('chocolat-visible');
     }, this.elems.overlay);
@@ -293,7 +293,7 @@ class Chocolat {
       this.exitFullScreen();
     }
 
-    this.settings.currentImage = undefined;
+    this.settings.currentImageIndex = undefined;
     this.settings.initialized = false;
     this.elems.domContainer.classList.remove(...this._cssClasses);
     this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
@@ -464,7 +464,7 @@ class Chocolat {
         return;
       }
 
-      if (this.settings.currentImage === undefined) {
+      if (this.settings.currentImageIndex === undefined) {
         return;
       }
 
@@ -475,7 +475,7 @@ class Chocolat {
       };
       var height = this.elems.wrapper.clientHeight;
       var width = this.elems.wrapper.clientWidth;
-      var currentImage = this.settings.images[this.settings.currentImage];
+      var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
       var imgWidth = this.elems.img.width;
       var imgHeight = this.elems.img.height;
       var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
@@ -499,7 +499,7 @@ class Chocolat {
       this.elems.img.style.marginTop = -mvtY + 'px';
     });
     this.on(window, 'resize.chocolat', e => {
-      if (!this.settings.initialized || this.settings.currentImage === undefined) {
+      if (!this.settings.initialized || this.settings.currentImageIndex === undefined) {
         return;
       }
 
@@ -510,14 +510,14 @@ class Chocolat {
           left,
           top
         } = this.fit(this.elems.img, this.elems.wrapper);
-        this.center(width, height, left, top, 0);
+        this.center(width, height, left, top);
         this.zoomable();
       });
     });
   }
 
   zoomable() {
-    var currentImage = this.settings.images[this.settings.currentImage];
+    var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
     var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
@@ -540,15 +540,14 @@ class Chocolat {
       left,
       top
     } = this.fit(this.elems.img, this.elems.wrapper);
-    return this.center(width, height, left, top, this.settings.duration);
+    return this.center(width, height, left, top);
   }
 
-  zoomOut(e, duration) {
-    if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
+  zoomOut(e) {
+    if (this.settings.initialZoomState === null || this.settings.currentImageIndex === undefined) {
       return;
     }
 
-    duration = duration || this.settings.duration;
     this.settings.imageSize = this.settings.initialZoomState;
     this.settings.initialZoomState = null;
     this.elems.img.style.margin = 0;
@@ -559,7 +558,7 @@ class Chocolat {
       left,
       top
     } = this.fit(this.elems.img, this.elems.wrapper);
-    return this.center(width, height, left, top, duration);
+    return this.center(width, height, left, top);
   }
 
   setDomContainer() {
@@ -642,7 +641,7 @@ class Chocolat {
         return this.open(i);
       },
       current: () => {
-        return this.settings.currentImage;
+        return this.settings.currentImageIndex;
       },
       place: () => {
         return this.place(this.elems.img, this.settings.duration);
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index db19389..3c94c5d 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -3,7 +3,7 @@
 
     const defaults = {
       container: window,
-      // window or jquery object or jquery selector, or element
+      // window or element
       className: undefined,
       imageSize: 'default',
       // 'default', 'contain', 'cover' or 'native'
@@ -13,9 +13,9 @@
       linkImages: true,
       duration: 300,
       setIndex: 0,
-      firstImage: 0,
-      lastImage: false,
-      currentImage: undefined,
+      firstImageIndex: 0,
+      lastImageIndex: false,
+      currentImageIndex: undefined,
       initialized: false,
       timer: false,
       timerDebounce: false,
@@ -26,11 +26,11 @@
         return '';
       },
       description: function () {
-        return this.settings.images[this.settings.currentImage].title;
+        return this.settings.images[this.settings.currentImageIndex].title;
       },
       pagination: function () {
-        var last = this.settings.lastImage + 1;
-        var position = this.settings.currentImage + 1;
+        var last = this.settings.lastImageIndex + 1;
+        var position = this.settings.currentImageIndex + 1;
         return position + '/' + last;
       },
 
@@ -74,7 +74,7 @@
           this.setDomContainer();
           this.markup();
           this.attachListeners();
-          this.settings.lastImage = this.settings.images.length - 1;
+          this.settings.lastImageIndex = this.settings.images.length - 1;
           this.settings.initialized = true;
         }
 
@@ -100,7 +100,7 @@
           this.openFullScreen();
         }
 
-        if (this.settings.currentImage === i) {
+        if (this.settings.currentImageIndex === i) {
           return Promise.resolve();
         }
 
@@ -122,7 +122,7 @@
             this.loadImage(this.settings.images[nextIndex].src, new Image());
           }
 
-          this.settings.currentImage = i;
+          this.settings.currentImageIndex = i;
           const place = this.place(imgLoader);
           const appear = this.appear(i);
           return Promise.all([place, appear]);
@@ -220,17 +220,17 @@
       }
 
       change(signe) {
-        this.zoomOut(0);
+        this.zoomOut();
         this.zoomable();
-        var requestedImage = this.settings.currentImage + parseInt(signe);
+        var requestedImage = this.settings.currentImageIndex + parseInt(signe);
 
-        if (requestedImage > this.settings.lastImage) {
+        if (requestedImage > this.settings.lastImageIndex) {
           if (this.settings.loop) {
             return this.load(0);
           }
         } else if (requestedImage < 0) {
           if (this.settings.loop) {
-            return this.load(this.settings.lastImage);
+            return this.load(this.settings.lastImageIndex);
           }
         } else {
           return this.load(requestedImage);
@@ -243,14 +243,14 @@
           this.elems.right.classList.add('active');
         } else if (this.settings.linkImages) {
           // right
-          if (this.settings.currentImage == this.settings.lastImage) {
+          if (this.settings.currentImageIndex == this.settings.lastImageIndex) {
             this.elems.right.classList.remove('active');
           } else {
             this.elems.right.classList.add('active');
           } // left
 
 
-          if (this.settings.currentImage === 0) {
+          if (this.settings.currentImageIndex === 0) {
             this.elems.left.classList.remove('active');
           } else {
             this.elems.left.classList.add('active');
@@ -267,7 +267,7 @@
           return;
         }
 
-        this.settings.currentImage = undefined;
+        this.settings.currentImageIndex = undefined;
         const promiseOverlay = this.transitionAsPromise(() => {
           this.elems.overlay.classList.remove('chocolat-visible');
         }, this.elems.overlay);
@@ -296,7 +296,7 @@
           this.exitFullScreen();
         }
 
-        this.settings.currentImage = undefined;
+        this.settings.currentImageIndex = undefined;
         this.settings.initialized = false;
         this.elems.domContainer.classList.remove(...this._cssClasses);
         this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
@@ -467,7 +467,7 @@
             return;
           }
 
-          if (this.settings.currentImage === undefined) {
+          if (this.settings.currentImageIndex === undefined) {
             return;
           }
 
@@ -478,7 +478,7 @@
           };
           var height = this.elems.wrapper.clientHeight;
           var width = this.elems.wrapper.clientWidth;
-          var currentImage = this.settings.images[this.settings.currentImage];
+          var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
           var imgWidth = this.elems.img.width;
           var imgHeight = this.elems.img.height;
           var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
@@ -502,7 +502,7 @@
           this.elems.img.style.marginTop = -mvtY + 'px';
         });
         this.on(window, 'resize.chocolat', e => {
-          if (!this.settings.initialized || this.settings.currentImage === undefined) {
+          if (!this.settings.initialized || this.settings.currentImageIndex === undefined) {
             return;
           }
 
@@ -513,14 +513,14 @@
               left,
               top
             } = this.fit(this.elems.img, this.elems.wrapper);
-            this.center(width, height, left, top, 0);
+            this.center(width, height, left, top);
             this.zoomable();
           });
         });
       }
 
       zoomable() {
-        var currentImage = this.settings.images[this.settings.currentImage];
+        var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
         var wrapperWidth = this.elems.wrapper.clientWidth;
         var wrapperHeight = this.elems.wrapper.clientHeight;
         var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
@@ -543,15 +543,14 @@
           left,
           top
         } = this.fit(this.elems.img, this.elems.wrapper);
-        return this.center(width, height, left, top, this.settings.duration);
+        return this.center(width, height, left, top);
       }
 
-      zoomOut(e, duration) {
-        if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
+      zoomOut(e) {
+        if (this.settings.initialZoomState === null || this.settings.currentImageIndex === undefined) {
           return;
         }
 
-        duration = duration || this.settings.duration;
         this.settings.imageSize = this.settings.initialZoomState;
         this.settings.initialZoomState = null;
         this.elems.img.style.margin = 0;
@@ -562,7 +561,7 @@
           left,
           top
         } = this.fit(this.elems.img, this.elems.wrapper);
-        return this.center(width, height, left, top, duration);
+        return this.center(width, height, left, top);
       }
 
       setDomContainer() {
@@ -645,7 +644,7 @@
             return this.open(i);
           },
           current: () => {
-            return this.settings.currentImage;
+            return this.settings.currentImageIndex;
           },
           place: () => {
             return this.place(this.elems.img, this.settings.duration);
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 5586484..6c4f060 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -1,5 +1,5 @@
 export const defaults = {
-    container: window, // window or jquery object or jquery selector, or element
+    container: window, // window or element
     className: undefined,
     imageSize: 'default', // 'default', 'contain', 'cover' or 'native'
     initialZoomState: null,
@@ -8,9 +8,9 @@ export const defaults = {
     linkImages: true,
     duration: 300,
     setIndex: 0,
-    firstImage: 0,
-    lastImage: false,
-    currentImage: undefined,
+    firstImageIndex: 0,
+    lastImageIndex: false,
+    currentImageIndex: undefined,
     initialized: false,
     timer: false,
     timerDebounce: false,
@@ -21,11 +21,11 @@ export const defaults = {
         return ''
     },
     description: function() {
-        return this.settings.images[this.settings.currentImage].title
+        return this.settings.images[this.settings.currentImageIndex].title
     },
     pagination: function() {
-        var last = this.settings.lastImage + 1
-        var position = this.settings.currentImage + 1
+        var last = this.settings.lastImageIndex + 1
+        var position = this.settings.currentImageIndex + 1
 
         return position + '/' + last
     },
@@ -76,7 +76,7 @@ export class Chocolat {
             this.setDomContainer()
             this.markup()
             this.attachListeners()
-            this.settings.lastImage = this.settings.images.length - 1
+            this.settings.lastImageIndex = this.settings.images.length - 1
             this.settings.initialized = true
         }
 
@@ -103,7 +103,7 @@ export class Chocolat {
             this.openFullScreen()
         }
 
-        if (this.settings.currentImage === i) {
+        if (this.settings.currentImageIndex === i) {
             return Promise.resolve()
         }
 
@@ -129,7 +129,7 @@ export class Chocolat {
                     this.loadImage(this.settings.images[nextIndex].src, new Image())
                 }
 
-                this.settings.currentImage = i
+                this.settings.currentImageIndex = i
 
                 const place = this.place(imgLoader)
                 const appear = this.appear(i)
@@ -232,14 +232,14 @@ export class Chocolat {
         this.zoomOut()
         this.zoomable()
 
-        var requestedImage = this.settings.currentImage + parseInt(signe)
-        if (requestedImage > this.settings.lastImage) {
+        var requestedImage = this.settings.currentImageIndex + parseInt(signe)
+        if (requestedImage > this.settings.lastImageIndex) {
             if (this.settings.loop) {
                 return this.load(0)
             }
         } else if (requestedImage < 0) {
             if (this.settings.loop) {
-                return this.load(this.settings.lastImage)
+                return this.load(this.settings.lastImageIndex)
             }
         } else {
             return this.load(requestedImage)
@@ -252,13 +252,13 @@ export class Chocolat {
             this.elems.right.classList.add('active')
         } else if (this.settings.linkImages) {
             // right
-            if (this.settings.currentImage == this.settings.lastImage) {
+            if (this.settings.currentImageIndex == this.settings.lastImageIndex) {
                 this.elems.right.classList.remove('active')
             } else {
                 this.elems.right.classList.add('active')
             }
             // left
-            if (this.settings.currentImage === 0) {
+            if (this.settings.currentImageIndex === 0) {
                 this.elems.left.classList.remove('active')
             } else {
                 this.elems.left.classList.add('active')
@@ -275,7 +275,7 @@ export class Chocolat {
             return
         }
 
-        this.settings.currentImage = undefined
+        this.settings.currentImageIndex = undefined
 
         const promiseOverlay = this.transitionAsPromise(() => {
             this.elems.overlay.classList.remove('chocolat-visible')
@@ -302,7 +302,7 @@ export class Chocolat {
         if (this.settings.fullscreenOpen) {
             this.exitFullScreen()
         }
-        this.settings.currentImage = undefined
+        this.settings.currentImageIndex = undefined
         this.settings.initialized = false
 
         this.elems.domContainer.classList.remove(...this._cssClasses)
@@ -495,7 +495,7 @@ export class Chocolat {
                 return
             }
 
-            if (this.settings.currentImage === undefined) {
+            if (this.settings.currentImageIndex === undefined) {
                 return
             }
 
@@ -508,7 +508,7 @@ export class Chocolat {
             var height = this.elems.wrapper.clientHeight
             var width = this.elems.wrapper.clientWidth
 
-            var currentImage = this.settings.images[this.settings.currentImage]
+            var currentImageIndex = this.settings.images[this.settings.currentImageIndex]
             var imgWidth = this.elems.img.width
             var imgHeight = this.elems.img.height
 
@@ -533,7 +533,7 @@ export class Chocolat {
         })
 
         this.on(window, 'resize.chocolat', (e) => {
-            if (!this.settings.initialized || this.settings.currentImage === undefined) {
+            if (!this.settings.initialized || this.settings.currentImageIndex === undefined) {
                 return
             }
             this.debounce(50, () => {
@@ -546,7 +546,7 @@ export class Chocolat {
     }
 
     zoomable() {
-        var currentImage = this.settings.images[this.settings.currentImage]
+        var currentImageIndex = this.settings.images[this.settings.currentImageIndex]
         var wrapperWidth = this.elems.wrapper.clientWidth
         var wrapperHeight = this.elems.wrapper.clientHeight
 
@@ -578,7 +578,10 @@ export class Chocolat {
     }
 
     zoomOut(e) {
-        if (this.settings.initialZoomState === null || this.settings.currentImage === undefined) {
+        if (
+            this.settings.initialZoomState === null ||
+            this.settings.currentImageIndex === undefined
+        ) {
             return
         }
         this.settings.imageSize = this.settings.initialZoomState
@@ -678,7 +681,7 @@ export class Chocolat {
                 return this.open(i)
             },
             current: () => {
-                return this.settings.currentImage
+                return this.settings.currentImageIndex
             },
 
             place: () => {
diff --git a/test/test.js b/test/test.js
index 934aafe..97b7471 100644
--- a/test/test.js
+++ b/test/test.js
@@ -180,7 +180,9 @@ describe('Chocolat', function() {
         it('can define a description per image', function(done) {
             var description = function() {
                 return (
-                    'prefix ' + this.settings.images[this.settings.currentImage].title + ' suffix'
+                    'prefix ' +
+                    this.settings.images[this.settings.currentImageIndex].title +
+                    ' suffix'
                 )
             }
 
@@ -209,8 +211,8 @@ describe('Chocolat', function() {
 
         it('can define a pagination per image', function(done) {
             var pagination = function() {
-                var last = this.settings.lastImage + 1
-                var position = this.settings.currentImage + 1
+                var last = this.settings.lastImageIndex + 1
+                var position = this.settings.currentImageIndex + 1
 
                 return 'prefix ' + position + '/' + last + ' suffix'
             }
@@ -464,10 +466,10 @@ describe('Chocolat', function() {
                         .prev()
                         .then(function() {
                             expect(
-                                spyLoad.calledWithExactly(chocolat.api().get('lastImage'))
+                                spyLoad.calledWithExactly(chocolat.api().get('lastImageIndex'))
                             ).to.be.true
                             expect(chocolat.api().current()).to.equal(
-                                chocolat.api().get('lastImage')
+                                chocolat.api().get('lastImageIndex')
                             )
 
                             return done()
@@ -480,11 +482,11 @@ describe('Chocolat', function() {
                 loop: true,
             })
 
-            var lastImage = chocolat.settings.images.length - 1
+            var lastImageIndex = chocolat.settings.images.length - 1
 
             chocolat
                 .api()
-                .open(lastImage)
+                .open(lastImageIndex)
                 .then(function() {
                     var spyLoad = sinon.spy(chocolat, 'load')
 

From f1cba59cfe3cdc0b509e7bf1a3c82911feef5b1a Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 9 Nov 2019 16:27:26 +0100
Subject: [PATCH 35/65] Api as an object and not a function, renamed a few
 options

---
 demo/index.html          |  16 +-
 dist/js/chocolat.cjs.js  |  89 +++----
 dist/js/chocolat.esm.js  |  89 +++----
 dist/js/chocolat.iife.js |  89 +++----
 src/js/chocolat.js       | 109 ++++----
 test/test.js             | 546 ++++++++++++++++-----------------------
 6 files changed, 416 insertions(+), 522 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index 49333d5..213ab6e 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -173,7 +173,7 @@ <h2>
                 e.preventDefault()
 
                 console.log('open start');
-                var def = instance.api().open()
+                var def = instance.api.open()
 
                 def.then(function(){
                     console.log('open done');
@@ -184,7 +184,7 @@ <h2>
                 e.preventDefault()
 
                 console.log('close start');
-                var def = instance.api().close()
+                var def = instance.api.close()
 
                 def.then(function(){
                     console.log('close done');
@@ -194,7 +194,7 @@ <h2>
                 e.preventDefault()
 
                 console.log('prev start');
-                var def = instance.api().prev()
+                var def = instance.api.prev()
 
                 def.then(function(){
                     console.log('prev done');
@@ -204,7 +204,7 @@ <h2>
                 e.preventDefault()
 
                 console.log('next start');
-                var def = instance.api().next()
+                var def = instance.api.next()
 
                 def.then(function(){
                     console.log('next done');
@@ -215,8 +215,8 @@ <h2>
                 e.preventDefault()
 
                 console.log('cover mode start')
-                instance.api().set('imageSize', 'cover')
-                var def = instance.api().place()
+                instance.api.set('imageSize', 'cover')
+                var def = instance.api.place()
 
                 def.then(function(){
                     console.log('cover mode done')
@@ -227,8 +227,8 @@ <h2>
                 e.preventDefault()
 
                 console.log('contain mode start')
-                instance.api().set('imageSize', 'contain')
-                var def = instance.api().place()
+                instance.api.set('imageSize', 'contain')
+                var def = instance.api.place()
 
                 def.then(function(){
                     console.log('contain mode done')
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 0ae522d..6e198f7 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -7,10 +7,9 @@ const defaults = {
   imageSize: 'default',
   // 'default', 'contain', 'cover' or 'native'
   initialZoomState: null,
-  fullScreen: false,
+  allowFullScreen: false,
   loop: false,
   linkImages: true,
-  duration: 300,
   setIndex: 0,
   firstImageIndex: 0,
   lastImageIndex: false,
@@ -19,7 +18,7 @@ const defaults = {
   timer: false,
   timerDebounce: false,
   images: [],
-  enableZoom: true,
+  allowZoom: true,
   imageSource: 'href',
   setTitle: function () {
     return '';
@@ -66,6 +65,43 @@ class Chocolat {
         e.preventDefault();
       });
     });
+    this.api = {
+      open: i => {
+        i = parseInt(i) || 0;
+        return this.init(i);
+      },
+      close: () => {
+        return this.close();
+      },
+      next: () => {
+        return this.change(1);
+      },
+      prev: () => {
+        return this.change(-1);
+      },
+      goto: i => {
+        return this.open(i);
+      },
+      current: () => {
+        return this.settings.currentImageIndex;
+      },
+      place: () => {
+        return this.place(this.elems.img);
+      },
+      destroy: () => {
+        return this.destroy();
+      },
+      set: (property, value) => {
+        this.settings[property] = value;
+        return value;
+      },
+      get: property => {
+        return this.settings[property];
+      },
+      getElem: name => {
+        return this.elems[name];
+      }
+    };
   }
 
   init(i) {
@@ -95,7 +131,7 @@ class Chocolat {
   }
 
   load(i) {
-    if (this.settings.fullScreen) {
+    if (this.settings.allowFullScreen) {
       this.openFullScreen();
     }
 
@@ -112,7 +148,7 @@ class Chocolat {
       if (this.elems !== undefined) {
         this.elems.loader.classList.add('chocolat-visible');
       }
-    }, this.settings.duration);
+    }, 300);
     const imgLoader = new Image();
     return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
       const nextIndex = i + 1;
@@ -522,7 +558,7 @@ class Chocolat {
     var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
-    var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+    var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
     var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
     if (isImageZoomable && !isImageStretched) {
@@ -623,47 +659,6 @@ class Chocolat {
     });
   }
 
-  api() {
-    return {
-      open: i => {
-        i = parseInt(i) || 0;
-        return this.init(i);
-      },
-      close: () => {
-        return this.close();
-      },
-      next: () => {
-        return this.change(1);
-      },
-      prev: () => {
-        return this.change(-1);
-      },
-      goto: i => {
-        // open alias
-        return this.open(i);
-      },
-      current: () => {
-        return this.settings.currentImageIndex;
-      },
-      place: () => {
-        return this.place(this.elems.img, this.settings.duration);
-      },
-      destroy: () => {
-        return this.destroy();
-      },
-      set: (property, value) => {
-        this.settings[property] = value;
-        return value;
-      },
-      get: property => {
-        return this.settings[property];
-      },
-      getElem: name => {
-        return this.elems[name];
-      }
-    };
-  }
-
 }
 
 const instances = [];
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 2d6e70a..7750c15 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -5,10 +5,9 @@ const defaults = {
   imageSize: 'default',
   // 'default', 'contain', 'cover' or 'native'
   initialZoomState: null,
-  fullScreen: false,
+  allowFullScreen: false,
   loop: false,
   linkImages: true,
-  duration: 300,
   setIndex: 0,
   firstImageIndex: 0,
   lastImageIndex: false,
@@ -17,7 +16,7 @@ const defaults = {
   timer: false,
   timerDebounce: false,
   images: [],
-  enableZoom: true,
+  allowZoom: true,
   imageSource: 'href',
   setTitle: function () {
     return '';
@@ -64,6 +63,43 @@ class Chocolat {
         e.preventDefault();
       });
     });
+    this.api = {
+      open: i => {
+        i = parseInt(i) || 0;
+        return this.init(i);
+      },
+      close: () => {
+        return this.close();
+      },
+      next: () => {
+        return this.change(1);
+      },
+      prev: () => {
+        return this.change(-1);
+      },
+      goto: i => {
+        return this.open(i);
+      },
+      current: () => {
+        return this.settings.currentImageIndex;
+      },
+      place: () => {
+        return this.place(this.elems.img);
+      },
+      destroy: () => {
+        return this.destroy();
+      },
+      set: (property, value) => {
+        this.settings[property] = value;
+        return value;
+      },
+      get: property => {
+        return this.settings[property];
+      },
+      getElem: name => {
+        return this.elems[name];
+      }
+    };
   }
 
   init(i) {
@@ -93,7 +129,7 @@ class Chocolat {
   }
 
   load(i) {
-    if (this.settings.fullScreen) {
+    if (this.settings.allowFullScreen) {
       this.openFullScreen();
     }
 
@@ -110,7 +146,7 @@ class Chocolat {
       if (this.elems !== undefined) {
         this.elems.loader.classList.add('chocolat-visible');
       }
-    }, this.settings.duration);
+    }, 300);
     const imgLoader = new Image();
     return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
       const nextIndex = i + 1;
@@ -520,7 +556,7 @@ class Chocolat {
     var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
-    var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+    var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
     var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
     if (isImageZoomable && !isImageStretched) {
@@ -621,47 +657,6 @@ class Chocolat {
     });
   }
 
-  api() {
-    return {
-      open: i => {
-        i = parseInt(i) || 0;
-        return this.init(i);
-      },
-      close: () => {
-        return this.close();
-      },
-      next: () => {
-        return this.change(1);
-      },
-      prev: () => {
-        return this.change(-1);
-      },
-      goto: i => {
-        // open alias
-        return this.open(i);
-      },
-      current: () => {
-        return this.settings.currentImageIndex;
-      },
-      place: () => {
-        return this.place(this.elems.img, this.settings.duration);
-      },
-      destroy: () => {
-        return this.destroy();
-      },
-      set: (property, value) => {
-        this.settings[property] = value;
-        return value;
-      },
-      get: property => {
-        return this.settings[property];
-      },
-      getElem: name => {
-        return this.elems[name];
-      }
-    };
-  }
-
 }
 
 const instances = [];
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 3c94c5d..a60bcd1 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -8,10 +8,9 @@
       imageSize: 'default',
       // 'default', 'contain', 'cover' or 'native'
       initialZoomState: null,
-      fullScreen: false,
+      allowFullScreen: false,
       loop: false,
       linkImages: true,
-      duration: 300,
       setIndex: 0,
       firstImageIndex: 0,
       lastImageIndex: false,
@@ -20,7 +19,7 @@
       timer: false,
       timerDebounce: false,
       images: [],
-      enableZoom: true,
+      allowZoom: true,
       imageSource: 'href',
       setTitle: function () {
         return '';
@@ -67,6 +66,43 @@
             e.preventDefault();
           });
         });
+        this.api = {
+          open: i => {
+            i = parseInt(i) || 0;
+            return this.init(i);
+          },
+          close: () => {
+            return this.close();
+          },
+          next: () => {
+            return this.change(1);
+          },
+          prev: () => {
+            return this.change(-1);
+          },
+          goto: i => {
+            return this.open(i);
+          },
+          current: () => {
+            return this.settings.currentImageIndex;
+          },
+          place: () => {
+            return this.place(this.elems.img);
+          },
+          destroy: () => {
+            return this.destroy();
+          },
+          set: (property, value) => {
+            this.settings[property] = value;
+            return value;
+          },
+          get: property => {
+            return this.settings[property];
+          },
+          getElem: name => {
+            return this.elems[name];
+          }
+        };
       }
 
       init(i) {
@@ -96,7 +132,7 @@
       }
 
       load(i) {
-        if (this.settings.fullScreen) {
+        if (this.settings.allowFullScreen) {
           this.openFullScreen();
         }
 
@@ -113,7 +149,7 @@
           if (this.elems !== undefined) {
             this.elems.loader.classList.add('chocolat-visible');
           }
-        }, this.settings.duration);
+        }, 300);
         const imgLoader = new Image();
         return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
           const nextIndex = i + 1;
@@ -523,7 +559,7 @@
         var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
         var wrapperWidth = this.elems.wrapper.clientWidth;
         var wrapperHeight = this.elems.wrapper.clientHeight;
-        var isImageZoomable = this.settings.enableZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+        var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
         var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
         if (isImageZoomable && !isImageStretched) {
@@ -624,47 +660,6 @@
         });
       }
 
-      api() {
-        return {
-          open: i => {
-            i = parseInt(i) || 0;
-            return this.init(i);
-          },
-          close: () => {
-            return this.close();
-          },
-          next: () => {
-            return this.change(1);
-          },
-          prev: () => {
-            return this.change(-1);
-          },
-          goto: i => {
-            // open alias
-            return this.open(i);
-          },
-          current: () => {
-            return this.settings.currentImageIndex;
-          },
-          place: () => {
-            return this.place(this.elems.img, this.settings.duration);
-          },
-          destroy: () => {
-            return this.destroy();
-          },
-          set: (property, value) => {
-            this.settings[property] = value;
-            return value;
-          },
-          get: property => {
-            return this.settings[property];
-          },
-          getElem: name => {
-            return this.elems[name];
-          }
-        };
-      }
-
     }
 
     const instances = [];
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 6c4f060..35edc7f 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -3,10 +3,9 @@ export const defaults = {
     className: undefined,
     imageSize: 'default', // 'default', 'contain', 'cover' or 'native'
     initialZoomState: null,
-    fullScreen: false,
+    allowFullScreen: false,
     loop: false,
     linkImages: true,
-    duration: 300,
     setIndex: 0,
     firstImageIndex: 0,
     lastImageIndex: false,
@@ -15,7 +14,7 @@ export const defaults = {
     timer: false,
     timerDebounce: false,
     images: [],
-    enableZoom: true,
+    allowZoom: true,
     imageSource: 'href',
     setTitle: function() {
         return ''
@@ -69,6 +68,54 @@ export class Chocolat {
                 e.preventDefault()
             })
         })
+
+        this.api = {
+            open: (i) => {
+                i = parseInt(i) || 0
+                return this.init(i)
+            },
+
+            close: () => {
+                return this.close()
+            },
+
+            next: () => {
+                return this.change(1)
+            },
+
+            prev: () => {
+                return this.change(-1)
+            },
+
+            goto: (i) => {
+                return this.open(i)
+            },
+
+            current: () => {
+                return this.settings.currentImageIndex
+            },
+
+            place: () => {
+                return this.place(this.elems.img)
+            },
+
+            destroy: () => {
+                return this.destroy()
+            },
+
+            set: (property, value) => {
+                this.settings[property] = value
+                return value
+            },
+
+            get: (property) => {
+                return this.settings[property]
+            },
+
+            getElem: (name) => {
+                return this.elems[name]
+            },
+        }
     }
 
     init(i) {
@@ -99,7 +146,7 @@ export class Chocolat {
     }
 
     load(i) {
-        if (this.settings.fullScreen) {
+        if (this.settings.allowFullScreen) {
             this.openFullScreen()
         }
 
@@ -118,7 +165,7 @@ export class Chocolat {
             if (this.elems !== undefined) {
                 this.elems.loader.classList.add('chocolat-visible')
             }
-        }, this.settings.duration)
+        }, 300)
 
         const imgLoader = new Image()
 
@@ -551,7 +598,7 @@ export class Chocolat {
         var wrapperHeight = this.elems.wrapper.clientHeight
 
         var isImageZoomable =
-            this.settings.enableZoom &&
+            this.settings.allowZoom &&
             (this.elems.img.naturalWidth > wrapperWidth ||
                 this.elems.img.naturalHeight > wrapperHeight)
                 ? true
@@ -656,54 +703,4 @@ export class Chocolat {
             }
         })
     }
-
-    api() {
-        return {
-            open: (i) => {
-                i = parseInt(i) || 0
-                return this.init(i)
-            },
-
-            close: () => {
-                return this.close()
-            },
-
-            next: () => {
-                return this.change(1)
-            },
-
-            prev: () => {
-                return this.change(-1)
-            },
-
-            goto: (i) => {
-                // open alias
-                return this.open(i)
-            },
-            current: () => {
-                return this.settings.currentImageIndex
-            },
-
-            place: () => {
-                return this.place(this.elems.img, this.settings.duration)
-            },
-
-            destroy: () => {
-                return this.destroy()
-            },
-
-            set: (property, value) => {
-                this.settings[property] = value
-                return value
-            },
-
-            get: (property) => {
-                return this.settings[property]
-            },
-
-            getElem: (name) => {
-                return this.elems[name]
-            },
-        }
-    }
 }
diff --git a/test/test.js b/test/test.js
index 97b7471..78bf84a 100644
--- a/test/test.js
+++ b/test/test.js
@@ -4,7 +4,7 @@ describe('Chocolat', function() {
     beforeEach(function() {})
 
     afterEach(function() {
-        chocolat.api().destroy()
+        chocolat.api.destroy()
     })
 
     describe('Opening', function() {
@@ -45,15 +45,12 @@ describe('Chocolat', function() {
                 container: document.querySelector('#container'),
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    expect($('#container').hasClass('chocolat-in-container')).to.be.true
-                    expect($('#container').hasClass('chocolat-open')).to.be.true
-                    // expect($('#container').hasClass('chocolat-zoomable')).to.be.true
-                    return done()
-                })
+            chocolat.api.open().then(function() {
+                expect($('#container').hasClass('chocolat-in-container')).to.be.true
+                expect($('#container').hasClass('chocolat-open')).to.be.true
+                // expect($('#container').hasClass('chocolat-zoomable')).to.be.true
+                return done()
+            })
         })
 
         it('should add css classes to body when full window', function(done) {
@@ -61,15 +58,12 @@ describe('Chocolat', function() {
                 imageSize: 'cover',
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    expect($('body').hasClass('chocolat-open')).to.be.true
-                    expect($('body').hasClass('chocolat-' + chocolat.settings.imageSize)).to.be.true
-                    // expect($('#container').hasClass('chocolat-zoomable')).to.be.true
-                    return done()
-                })
+            chocolat.api.open().then(function() {
+                expect($('body').hasClass('chocolat-open')).to.be.true
+                expect($('body').hasClass('chocolat-' + chocolat.settings.imageSize)).to.be.true
+                // expect($('#container').hasClass('chocolat-zoomable')).to.be.true
+                return done()
+            })
         })
 
         it('should add custom css classe', function(done) {
@@ -77,13 +71,10 @@ describe('Chocolat', function() {
                 className: 'custom-class-name',
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    expect($('body').hasClass('custom-class-name')).to.be.true
-                    return done()
-                })
+            chocolat.api.open().then(function() {
+                expect($('body').hasClass('custom-class-name')).to.be.true
+                return done()
+            })
         })
 
         it('should call init function', function() {
@@ -152,10 +143,10 @@ describe('Chocolat', function() {
                 .first()[0]
                 .click()
 
-            const top = chocolat.api().getElem('top')
-            const bottom = chocolat.api().getElem('bottom')
-            expect($(top).find(chocolat.api().getElem('description')).length).to.equal(1)
-            expect($(bottom).find(chocolat.api().getElem('description')).length).to.equal(0)
+            const top = chocolat.api.getElem('top')
+            const bottom = chocolat.api.getElem('bottom')
+            expect($(top).find(chocolat.api.getElem('description')).length).to.equal(1)
+            expect($(bottom).find(chocolat.api.getElem('description')).length).to.equal(0)
         })
 
         it('can define a title', function() {
@@ -173,7 +164,7 @@ describe('Chocolat', function() {
                 .first()[0]
                 .click()
 
-            const elem = chocolat.api().getElem('setTitle')
+            const elem = chocolat.api.getElem('setTitle')
             expect(elem.textContent).to.equal('hello')
         })
 
@@ -191,22 +182,16 @@ describe('Chocolat', function() {
                 description: description,
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(() => {
-                    const elem = chocolat.api().getElem('description')
-                    expect(elem.textContent).to.equal('prefix foo suffix')
-
-                    chocolat
-                        .api()
-                        .next()
-                        .then(() => {
-                            const elem = chocolat.api().getElem('description')
-                            expect(elem.textContent).to.equal('prefix baz suffix')
-                            done()
-                        })
+            chocolat.api.open().then(() => {
+                const elem = chocolat.api.getElem('description')
+                expect(elem.textContent).to.equal('prefix foo suffix')
+
+                chocolat.api.next().then(() => {
+                    const elem = chocolat.api.getElem('description')
+                    expect(elem.textContent).to.equal('prefix baz suffix')
+                    done()
                 })
+            })
         })
 
         it('can define a pagination per image', function(done) {
@@ -222,22 +207,16 @@ describe('Chocolat', function() {
                 pagination: pagination,
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(() => {
-                    const elem = chocolat.api().getElem('pagination')
-                    expect(elem.textContent).to.equal('prefix 1/3 suffix')
-
-                    chocolat
-                        .api()
-                        .next()
-                        .then(() => {
-                            const elem = chocolat.api().getElem('pagination')
-                            expect(elem.textContent).to.equal('prefix 2/3 suffix')
-                            done()
-                        })
+            chocolat.api.open().then(() => {
+                const elem = chocolat.api.getElem('pagination')
+                expect(elem.textContent).to.equal('prefix 1/3 suffix')
+
+                chocolat.api.next().then(() => {
+                    const elem = chocolat.api.getElem('pagination')
+                    expect(elem.textContent).to.equal('prefix 2/3 suffix')
+                    done()
                 })
+            })
         })
     })
 
@@ -245,19 +224,16 @@ describe('Chocolat', function() {
         it('should remove wrapper element', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var lengthBefore = $('.chocolat-wrapper').length
-                    expect(lengthBefore).to.equal(1)
+            chocolat.api.open().then(function() {
+                var lengthBefore = $('.chocolat-wrapper').length
+                expect(lengthBefore).to.equal(1)
 
-                    chocolat.api().destroy()
+                chocolat.api.destroy()
 
-                    var lengthAfter = $('.chocolat-wrapper').length
-                    expect(lengthAfter).to.equal(0)
-                    return done()
-                })
+                var lengthAfter = $('.chocolat-wrapper').length
+                expect(lengthAfter).to.equal(0)
+                return done()
+            })
         })
 
         it('should unbind event handler of the links (triggering chocolat.open)', function() {
@@ -267,7 +243,7 @@ describe('Chocolat', function() {
             var eventBefore = Object.values(chocolat.events)
             expect(eventBefore.length).to.be.above(0)
 
-            chocolat.api().destroy()
+            chocolat.api.destroy()
 
             var eventAfter = Object.values(chocolat.events)
             expect(eventAfter.length).to.equal(0)
@@ -300,17 +276,14 @@ describe('Chocolat', function() {
 
             var spyOpen = sinon.spy(chocolat, 'openFullScreen')
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    chocolat.elems.fullscreen.click()
-                    expect(spyOpen.calledOnce).to.be.true
-                    expect(chocolat.api().get('fullscreenOpen')).to.be.true
-                    chocolat.elems.fullscreen.click()
-                    expect(chocolat.api().get('fullscreenOpen')).to.be.false
-                    return done()
-                })
+            chocolat.api.open().then(function() {
+                chocolat.elems.fullscreen.click()
+                expect(spyOpen.calledOnce).to.be.true
+                expect(chocolat.api.get('fullscreenOpen')).to.be.true
+                chocolat.elems.fullscreen.click()
+                expect(chocolat.api.get('fullscreenOpen')).to.be.false
+                return done()
+            })
         })
 
         it('should close fullscreen when clicking .fullscreen twice', function(done) {
@@ -328,16 +301,13 @@ describe('Chocolat', function() {
 
             var spyClose = sinon.spy(chocolat, 'exitFullScreen')
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    chocolat.elems.fullscreen.click()
-                    chocolat.elems.fullscreen.click()
-                    expect(spyClose.calledOnce).to.be.true
+            chocolat.api.open().then(function() {
+                chocolat.elems.fullscreen.click()
+                chocolat.elems.fullscreen.click()
+                expect(spyClose.calledOnce).to.be.true
 
-                    return done()
-                })
+                return done()
+            })
         })
 
         it('should close fullscreen when closing chocolat', function(done) {
@@ -355,15 +325,12 @@ describe('Chocolat', function() {
 
             var spyClose = sinon.spy(chocolat, 'exitFullScreen')
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    chocolat.elems.fullscreen.click()
-                    chocolat.elems.close.click()
-                    expect(spyClose.calledOnce).to.be.true
-                    return done()
-                })
+            chocolat.api.open().then(function() {
+                chocolat.elems.fullscreen.click()
+                chocolat.elems.close.click()
+                expect(spyClose.calledOnce).to.be.true
+                return done()
+            })
         })
 
         return it('should open fullscreen directly', function(done) {
@@ -383,13 +350,10 @@ describe('Chocolat', function() {
 
             var spyOpen = sinon.spy(chocolat, 'openFullScreen')
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    expect(spyOpen.calledOnce).to.be.true
-                    return done()
-                })
+            chocolat.api.open().then(function() {
+                expect(spyOpen.calledOnce).to.be.true
+                return done()
+            })
         })
     })
 
@@ -400,54 +364,42 @@ describe('Chocolat', function() {
             var spyLoad = sinon.spy(chocolat, 'load')
             var spyChange = sinon.spy(chocolat, 'change')
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    expect(spyLoad.calledWithExactly(0)).to.be.true
+            chocolat.api.open().then(function() {
+                expect(spyLoad.calledWithExactly(0)).to.be.true
 
-                    chocolat.elems.right.click()
+                chocolat.elems.right.click()
 
-                    expect(spyLoad.calledWithExactly(1)).to.be.true
+                expect(spyLoad.calledWithExactly(1)).to.be.true
 
-                    expect(spyChange.calledOnce).to.be.true
-                    expect(spyChange.calledWithExactly(1)).to.be.true
+                expect(spyChange.calledOnce).to.be.true
+                expect(spyChange.calledWithExactly(1)).to.be.true
 
-                    return done()
-                })
+                return done()
+            })
         })
 
         it('should go to previous image', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var spyLoad = sinon.spy(chocolat, 'load')
-
-                    chocolat
-                        .api()
-                        .next()
-                        .then(function() {
-                            expect(spyLoad.calledWithExactly(1)).to.be.true
-                            var spyChange = sinon.spy(chocolat, 'change')
-
-                            chocolat
-                                .api()
-                                .prev()
-                                .then(function() {
-                                    expect(spyLoad.calledWithExactly(0)).to.be.true
-
-                                    expect(spyChange.calledOnce).to.be.true
-                                    expect(spyChange.calledWithExactly(-1)).to.be.true
-
-                                    expect(chocolat.api().current()).to.equal(0)
-
-                                    return done()
-                                })
-                        })
+            chocolat.api.open().then(function() {
+                var spyLoad = sinon.spy(chocolat, 'load')
+
+                chocolat.api.next().then(function() {
+                    expect(spyLoad.calledWithExactly(1)).to.be.true
+                    var spyChange = sinon.spy(chocolat, 'change')
+
+                    chocolat.api.prev().then(function() {
+                        expect(spyLoad.calledWithExactly(0)).to.be.true
+
+                        expect(spyChange.calledOnce).to.be.true
+                        expect(spyChange.calledWithExactly(-1)).to.be.true
+
+                        expect(chocolat.api.current()).to.equal(0)
+
+                        return done()
+                    })
                 })
+            })
         })
 
         it('should loop and go to last image', function(done) {
@@ -455,26 +407,16 @@ describe('Chocolat', function() {
                 loop: true,
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var spyLoad = sinon.spy(chocolat, 'load')
-
-                    chocolat
-                        .api()
-                        .prev()
-                        .then(function() {
-                            expect(
-                                spyLoad.calledWithExactly(chocolat.api().get('lastImageIndex'))
-                            ).to.be.true
-                            expect(chocolat.api().current()).to.equal(
-                                chocolat.api().get('lastImageIndex')
-                            )
-
-                            return done()
-                        })
+            chocolat.api.open().then(function() {
+                var spyLoad = sinon.spy(chocolat, 'load')
+
+                chocolat.api.prev().then(function() {
+                    expect(spyLoad.calledWithExactly(chocolat.api.get('lastImageIndex'))).to.be.true
+                    expect(chocolat.api.current()).to.equal(chocolat.api.get('lastImageIndex'))
+
+                    return done()
                 })
+            })
         })
 
         return it('should loop and go to first image', function(done) {
@@ -484,22 +426,16 @@ describe('Chocolat', function() {
 
             var lastImageIndex = chocolat.settings.images.length - 1
 
-            chocolat
-                .api()
-                .open(lastImageIndex)
-                .then(function() {
-                    var spyLoad = sinon.spy(chocolat, 'load')
-
-                    chocolat
-                        .api()
-                        .next()
-                        .then(function() {
-                            expect(spyLoad.calledWithExactly(0)).to.be.true
-                            expect(chocolat.api().current()).to.equal(0)
-
-                            return done()
-                        })
+            chocolat.api.open(lastImageIndex).then(function() {
+                var spyLoad = sinon.spy(chocolat, 'load')
+
+                chocolat.api.next().then(function() {
+                    expect(spyLoad.calledWithExactly(0)).to.be.true
+                    expect(chocolat.api.current()).to.equal(0)
+
+                    return done()
                 })
+            })
         })
     })
 
@@ -509,19 +445,13 @@ describe('Chocolat', function() {
                 imageSize: 'cover',
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    expect(chocolat.api().get('imageSize')).to.equal('cover')
-                    expect(
-                        chocolat
-                            .api()
-                            .getElem('domContainer')
-                            .classList.contains('chocolat-cover')
-                    ).to.be.true
-                    return done()
-                })
+            chocolat.api.open().then(function() {
+                expect(chocolat.api.get('imageSize')).to.equal('cover')
+                expect(
+                    chocolat.api.getElem('domContainer').classList.contains('chocolat-cover')
+                ).to.be.true
+                return done()
+            })
         })
 
         it("should have 'shortest' side of the container equal to 'shortest' side to the image in container", function(done) {
@@ -530,26 +460,23 @@ describe('Chocolat', function() {
                 container: document.querySelector('#container'),
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var dim = getExpectedDimensions(chocolat)
-
-                    if (dim.imgRatio < dim.containerRatio) {
-                        var targetWidth = dim.imgHeight / dim.imgRatio
-                        // 1px delta, because of rounded values
-                        expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                        expect(dim.imgHeight).to.be.closeTo(dim.containerHeight, 1)
-                    } else {
-                        var targetHeight = dim.imgWidth * dim.imgRatio
-                        // 1px delta, because of rounded values
-                        expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
-                        expect(dim.imgWidth).to.be.closeTo(dim.containerWidth, 1)
-                    }
+            chocolat.api.open().then(function() {
+                var dim = getExpectedDimensions(chocolat)
 
-                    return done()
-                })
+                if (dim.imgRatio < dim.containerRatio) {
+                    var targetWidth = dim.imgHeight / dim.imgRatio
+                    // 1px delta, because of rounded values
+                    expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
+                    expect(dim.imgHeight).to.be.closeTo(dim.containerHeight, 1)
+                } else {
+                    var targetHeight = dim.imgWidth * dim.imgRatio
+                    // 1px delta, because of rounded values
+                    expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
+                    expect(dim.imgWidth).to.be.closeTo(dim.containerWidth, 1)
+                }
+
+                return done()
+            })
         })
 
         it("should have 'shortest' side of the container equal to 'shortest' side to the image in window", function(done) {
@@ -557,26 +484,23 @@ describe('Chocolat', function() {
                 imageSize: 'cover',
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var dim = getExpectedDimensions(chocolat)
-
-                    if (dim.imgRatio < dim.containerRatio) {
-                        var targetWidth = dim.imgHeight / dim.imgRatio
-                        // 1px delta, because of rounded values
-                        expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                        expect(dim.imgHeight).to.be.closeTo(dim.containerHeight, 1)
-                    } else {
-                        var targetHeight = dim.imgWidth * dim.imgRatio
-                        // 1px delta, because of rounded values
-                        expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
-                        expect(dim.imgWidth).to.be.closeTo(dim.containerWidth, 1)
-                    }
+            chocolat.api.open().then(function() {
+                var dim = getExpectedDimensions(chocolat)
 
-                    return done()
-                })
+                if (dim.imgRatio < dim.containerRatio) {
+                    var targetWidth = dim.imgHeight / dim.imgRatio
+                    // 1px delta, because of rounded values
+                    expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
+                    expect(dim.imgHeight).to.be.closeTo(dim.containerHeight, 1)
+                } else {
+                    var targetHeight = dim.imgWidth * dim.imgRatio
+                    // 1px delta, because of rounded values
+                    expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
+                    expect(dim.imgWidth).to.be.closeTo(dim.containerWidth, 1)
+                }
+
+                return done()
+            })
         })
 
         return it('should center the image', function(done) {
@@ -584,26 +508,23 @@ describe('Chocolat', function() {
                 imageSize: 'cover',
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var dim = getExpectedDimensions(chocolat)
+            chocolat.api.open().then(function() {
+                var dim = getExpectedDimensions(chocolat)
 
-                    var $content = $(chocolat.api().getElem('content'))
+                var $content = $(chocolat.api.getElem('content'))
 
-                    var top = parseInt($content.css('top'), 10)
-                    var left = parseInt($content.css('left'), 10)
+                var top = parseInt($content.css('top'), 10)
+                var left = parseInt($content.css('left'), 10)
 
-                    var targetTop = (dim.containerHeight - dim.imgHeight) / 2
-                    var targetLeft = (dim.containerWidth - dim.imgWidth) / 2
+                var targetTop = (dim.containerHeight - dim.imgHeight) / 2
+                var targetLeft = (dim.containerWidth - dim.imgWidth) / 2
 
-                    // 1px delta, because of rounded values
-                    expect(top).to.be.closeTo(targetTop, 1)
-                    expect(left).to.be.closeTo(targetLeft, 1)
+                // 1px delta, because of rounded values
+                expect(top).to.be.closeTo(targetTop, 1)
+                expect(left).to.be.closeTo(targetLeft, 1)
 
-                    return done()
-                })
+                return done()
+            })
         })
     })
 
@@ -614,26 +535,23 @@ describe('Chocolat', function() {
                 container: document.querySelector('#container'),
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var dim = getExpectedDimensions(chocolat)
-
-                    if (dim.imgRatio > dim.containerPaddedRatio) {
-                        var targetWidth = dim.containerPaddedHeight / dim.imgRatio
-                        // 1px delta, because of rounded values
-                        expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                        expect(dim.imgHeight).to.be.closeTo(dim.containerPaddedHeight, 1)
-                    } else {
-                        var targetHeight = dim.containerPaddedWidth * dim.imgRatio
-                        // 1px delta, because of rounded values
-                        expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
-                        expect(dim.imgWidth).to.be.closeTo(dim.containerPaddedWidth, 1)
-                    }
+            chocolat.api.open().then(function() {
+                var dim = getExpectedDimensions(chocolat)
 
-                    return done()
-                })
+                if (dim.imgRatio > dim.containerPaddedRatio) {
+                    var targetWidth = dim.containerPaddedHeight / dim.imgRatio
+                    // 1px delta, because of rounded values
+                    expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
+                    expect(dim.imgHeight).to.be.closeTo(dim.containerPaddedHeight, 1)
+                } else {
+                    var targetHeight = dim.containerPaddedWidth * dim.imgRatio
+                    // 1px delta, because of rounded values
+                    expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
+                    expect(dim.imgWidth).to.be.closeTo(dim.containerPaddedWidth, 1)
+                }
+
+                return done()
+            })
         })
 
         it("should have 'longest' side of the container equal to 'longest' side to the image in window", function(done) {
@@ -641,26 +559,23 @@ describe('Chocolat', function() {
                 imageSize: 'contain',
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var dim = getExpectedDimensions(chocolat)
-
-                    if (dim.imgRatio > dim.containerPaddedRatio) {
-                        var targetWidth = dim.containerPaddedHeight / dim.imgRatio
-                        // 1px delta, because of rounded values
-                        expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                        expect(dim.imgHeight).to.be.closeTo(dim.containerPaddedHeight, 1)
-                    } else {
-                        var targetHeight = dim.containerPaddedWidth * dim.imgRatio
-                        // 1px delta, because of rounded values
-                        expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
-                        expect(dim.imgWidth).to.be.closeTo(dim.containerPaddedWidth, 1)
-                    }
+            chocolat.api.open().then(function() {
+                var dim = getExpectedDimensions(chocolat)
 
-                    return done()
-                })
+                if (dim.imgRatio > dim.containerPaddedRatio) {
+                    var targetWidth = dim.containerPaddedHeight / dim.imgRatio
+                    // 1px delta, because of rounded values
+                    expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
+                    expect(dim.imgHeight).to.be.closeTo(dim.containerPaddedHeight, 1)
+                } else {
+                    var targetHeight = dim.containerPaddedWidth * dim.imgRatio
+                    // 1px delta, because of rounded values
+                    expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
+                    expect(dim.imgWidth).to.be.closeTo(dim.containerPaddedWidth, 1)
+                }
+
+                return done()
+            })
         })
 
         return it('should center the image', function(done) {
@@ -668,26 +583,23 @@ describe('Chocolat', function() {
                 imageSize: 'contain',
             })
 
-            chocolat
-                .api()
-                .open()
-                .then(function() {
-                    var dim = getExpectedDimensions(chocolat)
+            chocolat.api.open().then(function() {
+                var dim = getExpectedDimensions(chocolat)
 
-                    var $content = $(chocolat.api().getElem('content'))
+                var $content = $(chocolat.api.getElem('content'))
 
-                    var top = parseInt($content.css('top'), 10)
-                    var left = parseInt($content.css('left'), 10)
+                var top = parseInt($content.css('top'), 10)
+                var left = parseInt($content.css('left'), 10)
 
-                    var targetTop = (dim.containerHeight - dim.imgHeight) / 2
-                    var targetLeft = (dim.containerWidth - dim.imgWidth) / 2
+                var targetTop = (dim.containerHeight - dim.imgHeight) / 2
+                var targetLeft = (dim.containerWidth - dim.imgWidth) / 2
 
-                    // 1px delta, because of rounded values
-                    expect(top).to.be.closeTo(targetTop, 1)
-                    expect(left).to.be.closeTo(targetLeft, 1)
+                // 1px delta, because of rounded values
+                expect(top).to.be.closeTo(targetTop, 1)
+                expect(left).to.be.closeTo(targetLeft, 1)
 
-                    return done()
-                })
+                return done()
+            })
         })
     })
 
@@ -704,47 +616,47 @@ describe('Chocolat', function() {
         })
 
         it('should have a open method', function() {
-            expect(typeof chocolat.api().open).to.equal('function')
+            expect(typeof chocolat.api.open).to.equal('function')
         })
 
         it('should have a close method', function() {
-            expect(typeof chocolat.api().close).to.equal('function')
+            expect(typeof chocolat.api.close).to.equal('function')
         })
 
         it('should have a next method', function() {
-            expect(typeof chocolat.api().next).to.equal('function')
+            expect(typeof chocolat.api.next).to.equal('function')
         })
 
         it('should have a prev method', function() {
-            expect(typeof chocolat.api().prev).to.equal('function')
+            expect(typeof chocolat.api.prev).to.equal('function')
         })
 
         it('should have a goto method', function() {
-            expect(typeof chocolat.api().goto).to.equal('function')
+            expect(typeof chocolat.api.goto).to.equal('function')
         })
 
         it('should have a current method', function() {
-            expect(typeof chocolat.api().current).to.equal('function')
+            expect(typeof chocolat.api.current).to.equal('function')
         })
 
         it('should have a place method', function() {
-            expect(typeof chocolat.api().place).to.equal('function')
+            expect(typeof chocolat.api.place).to.equal('function')
         })
 
         it('should have a destroy method', function() {
-            expect(typeof chocolat.api().destroy).to.equal('function')
+            expect(typeof chocolat.api.destroy).to.equal('function')
         })
 
         it('should have a set method', function() {
-            expect(typeof chocolat.api().set).to.equal('function')
+            expect(typeof chocolat.api.set).to.equal('function')
         })
 
         it('should have a get method', function() {
-            expect(typeof chocolat.api().get).to.equal('function')
+            expect(typeof chocolat.api.get).to.equal('function')
         })
 
         it('should have a getElem method', function() {
-            expect(typeof chocolat.api().getElem).to.equal('function')
+            expect(typeof chocolat.api.getElem).to.equal('function')
         })
     })
 })
@@ -754,16 +666,16 @@ function getJqueryElement(name) {}
 // function used to calculate image dimensions
 // in order to be compared with what chocolat is really displaying
 function getExpectedDimensions(chocolat) {
-    var imgWidth = chocolat.api().getElem('img').width
-    var imgHeight = chocolat.api().getElem('img').height
+    var imgWidth = chocolat.api.getElem('img').width
+    var imgHeight = chocolat.api.getElem('img').height
 
-    var containerWidth = $(chocolat.api().get('container')).width()
-    var containerHeight = $(chocolat.api().get('container')).height()
+    var containerWidth = $(chocolat.api.get('container')).width()
+    var containerHeight = $(chocolat.api.get('container')).height()
 
     var containerOutMarginH =
-        chocolat.api().getElem('top').offsetHeight + chocolat.api().getElem('bottom').offsetHeight
+        chocolat.api.getElem('top').offsetHeight + chocolat.api.getElem('bottom').offsetHeight
     var containerOutMarginW =
-        chocolat.api().getElem('left').offsetWidth + chocolat.api().getElem('right').offsetWidth
+        chocolat.api.getElem('left').offsetWidth + chocolat.api.getElem('right').offsetWidth
 
     var containerPaddedWidth = containerWidth - containerOutMarginW
     var containerPaddedHeight = containerHeight - containerOutMarginH

From 67c38c9f42aff4f0ee11c8325188b894ead081fd Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 9 Nov 2019 17:28:05 +0100
Subject: [PATCH 36/65] Moved settings.images as First argument

---
 demo/index.html          | 33 ++++++++++----------
 dist/js/chocolat.cjs.js  | 64 ++++++++++++++++++++-------------------
 dist/js/chocolat.esm.js  | 64 ++++++++++++++++++++-------------------
 dist/js/chocolat.iife.js | 62 ++++++++++++++++++++------------------
 src/js/chocolat.js       | 65 +++++++++++++++++++++-------------------
 src/js/main.esm.js       |  2 +-
 test/test.js             | 24 +++++++--------
 7 files changed, 164 insertions(+), 150 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index 213ab6e..ea13e78 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -139,14 +139,13 @@ <h2>
         </script>
         <script>
             // api demo
-            var instance = Chocolat([], {
-                setTitle : function () { return 'set title' },
-                loop: true,
-                images : [
+            var instance = Chocolat([
                     {src : 'demo-images/1.jpg', title : 'caption 1'},
                     {src : 'demo-images/6.jpg', title : 'caption 2'},
                     {src : 'demo-images/8.jpg', title : 'caption 3'},
-                ],
+                ], {
+                setTitle : function () { return 'set title' },
+                loop: true,
                 imageSize : 'contain',
                 container: document.querySelector('#container3'),
                 afterMarkup: function () {
@@ -173,9 +172,9 @@ <h2>
                 e.preventDefault()
 
                 console.log('open start');
-                var def = instance.api.open()
+                var promise = instance.api.open()
 
-                def.then(function(){
+                promise.then(function(){
                     console.log('open done');
                 })
             })
@@ -184,9 +183,9 @@ <h2>
                 e.preventDefault()
 
                 console.log('close start');
-                var def = instance.api.close()
+                var promise = instance.api.close()
 
-                def.then(function(){
+                promise.then(function(){
                     console.log('close done');
                 })
             })
@@ -194,9 +193,9 @@ <h2>
                 e.preventDefault()
 
                 console.log('prev start');
-                var def = instance.api.prev()
+                var promise = instance.api.prev()
 
-                def.then(function(){
+                promise.then(function(){
                     console.log('prev done');
                 })
             })
@@ -204,9 +203,9 @@ <h2>
                 e.preventDefault()
 
                 console.log('next start');
-                var def = instance.api.next()
+                var promise = instance.api.next()
 
-                def.then(function(){
+                promise.then(function(){
                     console.log('next done');
                 })
             })
@@ -216,9 +215,9 @@ <h2>
 
                 console.log('cover mode start')
                 instance.api.set('imageSize', 'cover')
-                var def = instance.api.place()
+                var promise = instance.api.position()
 
-                def.then(function(){
+                promise.then(function(){
                     console.log('cover mode done')
                 })
             })
@@ -228,9 +227,9 @@ <h2>
 
                 console.log('contain mode start')
                 instance.api.set('imageSize', 'contain')
-                var def = instance.api.place()
+                var promise = instance.api.position()
 
-                def.then(function(){
+                promise.then(function(){
                     console.log('contain mode done')
                 })
             })
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 6e198f7..5d429f5 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -17,14 +17,12 @@ const defaults = {
   initialized: false,
   timer: false,
   timerDebounce: false,
-  images: [],
   allowZoom: true,
-  imageSource: 'href',
   setTitle: function () {
     return '';
   },
   description: function () {
-    return this.settings.images[this.settings.currentImageIndex].title;
+    return this.images[this.settings.currentImageIndex].title;
   },
   pagination: function () {
     var last = this.settings.lastImageIndex + 1;
@@ -49,22 +47,28 @@ class Chocolat {
   constructor(elements, settings) {
     this.settings = settings;
     this.elems = {};
-    this.elements = elements;
+    this.images = [];
     this.events = [];
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
-    this.elements.forEach((el, i) => {
-      this.settings.images.push({
-        title: el.getAttribute('title'),
-        src: el.getAttribute(this.settings.imageSource),
-        height: false,
-        width: false
-      });
-      this.off(el, 'click.chocolat');
-      this.on(el, 'click.chocolat', e => {
-        this.init(i);
-        e.preventDefault();
+
+    if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
+      elements.forEach((el, i) => {
+        this.images.push({
+          title: el.getAttribute('title'),
+          src: el.getAttribute('href'),
+          height: undefined,
+          width: undefined
+        });
+        this.off(el, 'click.chocolat');
+        this.on(el, 'click.chocolat', e => {
+          this.init(i);
+          e.preventDefault();
+        });
       });
-    });
+    } else {
+      this.images = elements;
+    }
+
     this.api = {
       open: i => {
         i = parseInt(i) || 0;
@@ -85,8 +89,8 @@ class Chocolat {
       current: () => {
         return this.settings.currentImageIndex;
       },
-      place: () => {
-        return this.place(this.elems.img);
+      position: () => {
+        return this.position(this.elems.img);
       },
       destroy: () => {
         return this.destroy();
@@ -109,7 +113,7 @@ class Chocolat {
       this.setDomContainer();
       this.markup();
       this.attachListeners();
-      this.settings.lastImageIndex = this.settings.images.length - 1;
+      this.settings.lastImageIndex = this.images.length - 1;
       this.settings.initialized = true;
     }
 
@@ -150,24 +154,24 @@ class Chocolat {
       }
     }, 300);
     const imgLoader = new Image();
-    return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
+    return this.loadImage(this.images[i].src, imgLoader).then(() => {
       const nextIndex = i + 1;
 
-      if (this.settings.images[nextIndex] != undefined) {
-        this.loadImage(this.settings.images[nextIndex].src, new Image());
+      if (this.images[nextIndex] != undefined) {
+        this.loadImage(this.images[nextIndex].src, new Image());
       }
 
       this.settings.currentImageIndex = i;
-      const place = this.place(imgLoader);
+      const position = this.position(imgLoader);
       const appear = this.appear(i);
-      return Promise.all([place, appear]);
+      return Promise.all([position, appear]);
     }).then(() => {
       this.zoomable();
       this.settings.afterImageLoad();
     });
   }
 
-  place(image) {
+  position(image) {
     this.elems.description.textContent = this.settings.description.call(this);
     this.elems.pagination.textContent = this.settings.pagination.call(this);
     this.arrows();
@@ -195,13 +199,13 @@ class Chocolat {
     clearTimeout(this.settings.timer);
 
     if (!this.elems.loader.classList.contains('chocolat-visible')) {
-      return this.loadImage(this.settings.images[i].src, this.elems.img);
+      return this.loadImage(this.images[i].src, this.elems.img);
     }
 
     return this.transitionAsPromise(() => {
       this.elems.loader.classList.remove('chocolat-visible');
     }, this.elems.loader).then(() => {
-      return this.loadImage(this.settings.images[i].src, this.elems.img);
+      return this.loadImage(this.images[i].src, this.elems.img);
     });
   }
 
@@ -513,7 +517,7 @@ class Chocolat {
       };
       var height = this.elems.wrapper.clientHeight;
       var width = this.elems.wrapper.clientWidth;
-      var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
+      var currentImageIndex = this.images[this.settings.currentImageIndex];
       var imgWidth = this.elems.img.width;
       var imgHeight = this.elems.img.height;
       var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
@@ -555,7 +559,7 @@ class Chocolat {
   }
 
   zoomable() {
-    var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
+    var currentImageIndex = this.images[this.settings.currentImageIndex];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
     var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
@@ -662,7 +666,7 @@ class Chocolat {
 }
 
 const instances = [];
-function main_esm (options) {
+function main_esm (elements, options) {
   const settings = Object.assign({}, defaults, {
     images: []
   }, options, {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 7750c15..8d243f3 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -15,14 +15,12 @@ const defaults = {
   initialized: false,
   timer: false,
   timerDebounce: false,
-  images: [],
   allowZoom: true,
-  imageSource: 'href',
   setTitle: function () {
     return '';
   },
   description: function () {
-    return this.settings.images[this.settings.currentImageIndex].title;
+    return this.images[this.settings.currentImageIndex].title;
   },
   pagination: function () {
     var last = this.settings.lastImageIndex + 1;
@@ -47,22 +45,28 @@ class Chocolat {
   constructor(elements, settings) {
     this.settings = settings;
     this.elems = {};
-    this.elements = elements;
+    this.images = [];
     this.events = [];
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
-    this.elements.forEach((el, i) => {
-      this.settings.images.push({
-        title: el.getAttribute('title'),
-        src: el.getAttribute(this.settings.imageSource),
-        height: false,
-        width: false
-      });
-      this.off(el, 'click.chocolat');
-      this.on(el, 'click.chocolat', e => {
-        this.init(i);
-        e.preventDefault();
+
+    if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
+      elements.forEach((el, i) => {
+        this.images.push({
+          title: el.getAttribute('title'),
+          src: el.getAttribute('href'),
+          height: undefined,
+          width: undefined
+        });
+        this.off(el, 'click.chocolat');
+        this.on(el, 'click.chocolat', e => {
+          this.init(i);
+          e.preventDefault();
+        });
       });
-    });
+    } else {
+      this.images = elements;
+    }
+
     this.api = {
       open: i => {
         i = parseInt(i) || 0;
@@ -83,8 +87,8 @@ class Chocolat {
       current: () => {
         return this.settings.currentImageIndex;
       },
-      place: () => {
-        return this.place(this.elems.img);
+      position: () => {
+        return this.position(this.elems.img);
       },
       destroy: () => {
         return this.destroy();
@@ -107,7 +111,7 @@ class Chocolat {
       this.setDomContainer();
       this.markup();
       this.attachListeners();
-      this.settings.lastImageIndex = this.settings.images.length - 1;
+      this.settings.lastImageIndex = this.images.length - 1;
       this.settings.initialized = true;
     }
 
@@ -148,24 +152,24 @@ class Chocolat {
       }
     }, 300);
     const imgLoader = new Image();
-    return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
+    return this.loadImage(this.images[i].src, imgLoader).then(() => {
       const nextIndex = i + 1;
 
-      if (this.settings.images[nextIndex] != undefined) {
-        this.loadImage(this.settings.images[nextIndex].src, new Image());
+      if (this.images[nextIndex] != undefined) {
+        this.loadImage(this.images[nextIndex].src, new Image());
       }
 
       this.settings.currentImageIndex = i;
-      const place = this.place(imgLoader);
+      const position = this.position(imgLoader);
       const appear = this.appear(i);
-      return Promise.all([place, appear]);
+      return Promise.all([position, appear]);
     }).then(() => {
       this.zoomable();
       this.settings.afterImageLoad();
     });
   }
 
-  place(image) {
+  position(image) {
     this.elems.description.textContent = this.settings.description.call(this);
     this.elems.pagination.textContent = this.settings.pagination.call(this);
     this.arrows();
@@ -193,13 +197,13 @@ class Chocolat {
     clearTimeout(this.settings.timer);
 
     if (!this.elems.loader.classList.contains('chocolat-visible')) {
-      return this.loadImage(this.settings.images[i].src, this.elems.img);
+      return this.loadImage(this.images[i].src, this.elems.img);
     }
 
     return this.transitionAsPromise(() => {
       this.elems.loader.classList.remove('chocolat-visible');
     }, this.elems.loader).then(() => {
-      return this.loadImage(this.settings.images[i].src, this.elems.img);
+      return this.loadImage(this.images[i].src, this.elems.img);
     });
   }
 
@@ -511,7 +515,7 @@ class Chocolat {
       };
       var height = this.elems.wrapper.clientHeight;
       var width = this.elems.wrapper.clientWidth;
-      var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
+      var currentImageIndex = this.images[this.settings.currentImageIndex];
       var imgWidth = this.elems.img.width;
       var imgHeight = this.elems.img.height;
       var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
@@ -553,7 +557,7 @@ class Chocolat {
   }
 
   zoomable() {
-    var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
+    var currentImageIndex = this.images[this.settings.currentImageIndex];
     var wrapperWidth = this.elems.wrapper.clientWidth;
     var wrapperHeight = this.elems.wrapper.clientHeight;
     var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
@@ -660,7 +664,7 @@ class Chocolat {
 }
 
 const instances = [];
-function main_esm (options) {
+function main_esm (elements, options) {
   const settings = Object.assign({}, defaults, {
     images: []
   }, options, {
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index a60bcd1..481db40 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -18,14 +18,12 @@
       initialized: false,
       timer: false,
       timerDebounce: false,
-      images: [],
       allowZoom: true,
-      imageSource: 'href',
       setTitle: function () {
         return '';
       },
       description: function () {
-        return this.settings.images[this.settings.currentImageIndex].title;
+        return this.images[this.settings.currentImageIndex].title;
       },
       pagination: function () {
         var last = this.settings.lastImageIndex + 1;
@@ -50,22 +48,28 @@
       constructor(elements, settings) {
         this.settings = settings;
         this.elems = {};
-        this.elements = elements;
+        this.images = [];
         this.events = [];
         this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
-        this.elements.forEach((el, i) => {
-          this.settings.images.push({
-            title: el.getAttribute('title'),
-            src: el.getAttribute(this.settings.imageSource),
-            height: false,
-            width: false
-          });
-          this.off(el, 'click.chocolat');
-          this.on(el, 'click.chocolat', e => {
-            this.init(i);
-            e.preventDefault();
+
+        if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
+          elements.forEach((el, i) => {
+            this.images.push({
+              title: el.getAttribute('title'),
+              src: el.getAttribute('href'),
+              height: undefined,
+              width: undefined
+            });
+            this.off(el, 'click.chocolat');
+            this.on(el, 'click.chocolat', e => {
+              this.init(i);
+              e.preventDefault();
+            });
           });
-        });
+        } else {
+          this.images = elements;
+        }
+
         this.api = {
           open: i => {
             i = parseInt(i) || 0;
@@ -86,8 +90,8 @@
           current: () => {
             return this.settings.currentImageIndex;
           },
-          place: () => {
-            return this.place(this.elems.img);
+          position: () => {
+            return this.position(this.elems.img);
           },
           destroy: () => {
             return this.destroy();
@@ -110,7 +114,7 @@
           this.setDomContainer();
           this.markup();
           this.attachListeners();
-          this.settings.lastImageIndex = this.settings.images.length - 1;
+          this.settings.lastImageIndex = this.images.length - 1;
           this.settings.initialized = true;
         }
 
@@ -151,24 +155,24 @@
           }
         }, 300);
         const imgLoader = new Image();
-        return this.loadImage(this.settings.images[i].src, imgLoader).then(() => {
+        return this.loadImage(this.images[i].src, imgLoader).then(() => {
           const nextIndex = i + 1;
 
-          if (this.settings.images[nextIndex] != undefined) {
-            this.loadImage(this.settings.images[nextIndex].src, new Image());
+          if (this.images[nextIndex] != undefined) {
+            this.loadImage(this.images[nextIndex].src, new Image());
           }
 
           this.settings.currentImageIndex = i;
-          const place = this.place(imgLoader);
+          const position = this.position(imgLoader);
           const appear = this.appear(i);
-          return Promise.all([place, appear]);
+          return Promise.all([position, appear]);
         }).then(() => {
           this.zoomable();
           this.settings.afterImageLoad();
         });
       }
 
-      place(image) {
+      position(image) {
         this.elems.description.textContent = this.settings.description.call(this);
         this.elems.pagination.textContent = this.settings.pagination.call(this);
         this.arrows();
@@ -196,13 +200,13 @@
         clearTimeout(this.settings.timer);
 
         if (!this.elems.loader.classList.contains('chocolat-visible')) {
-          return this.loadImage(this.settings.images[i].src, this.elems.img);
+          return this.loadImage(this.images[i].src, this.elems.img);
         }
 
         return this.transitionAsPromise(() => {
           this.elems.loader.classList.remove('chocolat-visible');
         }, this.elems.loader).then(() => {
-          return this.loadImage(this.settings.images[i].src, this.elems.img);
+          return this.loadImage(this.images[i].src, this.elems.img);
         });
       }
 
@@ -514,7 +518,7 @@
           };
           var height = this.elems.wrapper.clientHeight;
           var width = this.elems.wrapper.clientWidth;
-          var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
+          var currentImageIndex = this.images[this.settings.currentImageIndex];
           var imgWidth = this.elems.img.width;
           var imgHeight = this.elems.img.height;
           var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
@@ -556,7 +560,7 @@
       }
 
       zoomable() {
-        var currentImageIndex = this.settings.images[this.settings.currentImageIndex];
+        var currentImageIndex = this.images[this.settings.currentImageIndex];
         var wrapperWidth = this.elems.wrapper.clientWidth;
         var wrapperHeight = this.elems.wrapper.clientHeight;
         var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 35edc7f..a5d0daf 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -13,14 +13,12 @@ export const defaults = {
     initialized: false,
     timer: false,
     timerDebounce: false,
-    images: [],
     allowZoom: true,
-    imageSource: 'href',
     setTitle: function() {
         return ''
     },
     description: function() {
-        return this.settings.images[this.settings.currentImageIndex].title
+        return this.images[this.settings.currentImageIndex].title
     },
     pagination: function() {
         var last = this.settings.lastImageIndex + 1
@@ -43,7 +41,7 @@ export class Chocolat {
     constructor(elements, settings) {
         this.settings = settings
         this.elems = {}
-        this.elements = elements
+        this.images = []
         this.events = []
 
         this._cssClasses = [
@@ -54,20 +52,27 @@ export class Chocolat {
             'chocolat-zoomed',
         ]
 
-        this.elements.forEach((el, i) => {
-            this.settings.images.push({
-                title: el.getAttribute('title'),
-                src: el.getAttribute(this.settings.imageSource),
-                height: false,
-                width: false,
-            })
-
-            this.off(el, 'click.chocolat')
-            this.on(el, 'click.chocolat', (e) => {
-                this.init(i)
-                e.preventDefault()
+        if (
+            NodeList.prototype.isPrototypeOf(elements) ||
+            HTMLCollection.prototype.isPrototypeOf(elements)
+        ) {
+            elements.forEach((el, i) => {
+                this.images.push({
+                    title: el.getAttribute('title'),
+                    src: el.getAttribute('href'),
+                    height: undefined,
+                    width: undefined,
+                })
+
+                this.off(el, 'click.chocolat')
+                this.on(el, 'click.chocolat', (e) => {
+                    this.init(i)
+                    e.preventDefault()
+                })
             })
-        })
+        } else {
+            this.images = elements
+        }
 
         this.api = {
             open: (i) => {
@@ -95,8 +100,8 @@ export class Chocolat {
                 return this.settings.currentImageIndex
             },
 
-            place: () => {
-                return this.place(this.elems.img)
+            position: () => {
+                return this.position(this.elems.img)
             },
 
             destroy: () => {
@@ -123,7 +128,7 @@ export class Chocolat {
             this.setDomContainer()
             this.markup()
             this.attachListeners()
-            this.settings.lastImageIndex = this.settings.images.length - 1
+            this.settings.lastImageIndex = this.images.length - 1
             this.settings.initialized = true
         }
 
@@ -169,18 +174,18 @@ export class Chocolat {
 
         const imgLoader = new Image()
 
-        return this.loadImage(this.settings.images[i].src, imgLoader)
+        return this.loadImage(this.images[i].src, imgLoader)
             .then(() => {
                 const nextIndex = i + 1
-                if (this.settings.images[nextIndex] != undefined) {
-                    this.loadImage(this.settings.images[nextIndex].src, new Image())
+                if (this.images[nextIndex] != undefined) {
+                    this.loadImage(this.images[nextIndex].src, new Image())
                 }
 
                 this.settings.currentImageIndex = i
 
-                const place = this.place(imgLoader)
+                const position = this.position(imgLoader)
                 const appear = this.appear(i)
-                return Promise.all([place, appear])
+                return Promise.all([position, appear])
             })
             .then(() => {
                 this.zoomable()
@@ -188,7 +193,7 @@ export class Chocolat {
             })
     }
 
-    place(image) {
+    position(image) {
         this.elems.description.textContent = this.settings.description.call(this)
         this.elems.pagination.textContent = this.settings.pagination.call(this)
         this.arrows()
@@ -212,13 +217,13 @@ export class Chocolat {
         clearTimeout(this.settings.timer)
 
         if (!this.elems.loader.classList.contains('chocolat-visible')) {
-            return this.loadImage(this.settings.images[i].src, this.elems.img)
+            return this.loadImage(this.images[i].src, this.elems.img)
         }
 
         return this.transitionAsPromise(() => {
             this.elems.loader.classList.remove('chocolat-visible')
         }, this.elems.loader).then(() => {
-            return this.loadImage(this.settings.images[i].src, this.elems.img)
+            return this.loadImage(this.images[i].src, this.elems.img)
         })
     }
 
@@ -555,7 +560,7 @@ export class Chocolat {
             var height = this.elems.wrapper.clientHeight
             var width = this.elems.wrapper.clientWidth
 
-            var currentImageIndex = this.settings.images[this.settings.currentImageIndex]
+            var currentImageIndex = this.images[this.settings.currentImageIndex]
             var imgWidth = this.elems.img.width
             var imgHeight = this.elems.img.height
 
@@ -593,7 +598,7 @@ export class Chocolat {
     }
 
     zoomable() {
-        var currentImageIndex = this.settings.images[this.settings.currentImageIndex]
+        var currentImageIndex = this.images[this.settings.currentImageIndex]
         var wrapperWidth = this.elems.wrapper.clientWidth
         var wrapperHeight = this.elems.wrapper.clientHeight
 
diff --git a/src/js/main.esm.js b/src/js/main.esm.js
index 8e7e3f2..a1f27eb 100644
--- a/src/js/main.esm.js
+++ b/src/js/main.esm.js
@@ -2,7 +2,7 @@ import { Chocolat, defaults } from './chocolat.js'
 
 const instances = []
 
-export default function(options) {
+export default function(elements, options) {
     const settings = Object.assign({}, defaults, { images: [] }, options, {
         setIndex: instances.length,
     })
diff --git a/test/test.js b/test/test.js
index 78bf84a..a0e778c 100644
--- a/test/test.js
+++ b/test/test.js
@@ -170,11 +170,7 @@ describe('Chocolat', function() {
 
         it('can define a description per image', function(done) {
             var description = function() {
-                return (
-                    'prefix ' +
-                    this.settings.images[this.settings.currentImageIndex].title +
-                    ' suffix'
-                )
+                return 'prefix ' + this.images[this.settings.currentImageIndex].title + ' suffix'
             }
 
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
@@ -335,7 +331,7 @@ describe('Chocolat', function() {
 
         return it('should open fullscreen directly', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                fullScreen: true,
+                allowFullScreen: true,
             })
 
             // test only if browser fullscreenAPI is available
@@ -424,7 +420,7 @@ describe('Chocolat', function() {
                 loop: true,
             })
 
-            var lastImageIndex = chocolat.settings.images.length - 1
+            var lastImageIndex = chocolat.images.length - 1
 
             chocolat.api.open(lastImageIndex).then(function() {
                 var spyLoad = sinon.spy(chocolat, 'load')
@@ -605,14 +601,16 @@ describe('Chocolat', function() {
 
     describe('API', function() {
         before(function() {
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                backgroundClose: false,
-                images: [
+            chocolat = Chocolat(
+                [
                     { src: '../demo/demo-images/1.jpg', title: 'You can zoom in the image' },
                     { src: '../demo/demo-images/2.jpg', title: 'You can zoom in the image' },
                     { src: '../demo/demo-images/3.jpg', title: 'You can zoom in the image' },
                 ],
-            })
+                {
+                    backgroundClose: false,
+                }
+            )
         })
 
         it('should have a open method', function() {
@@ -639,8 +637,8 @@ describe('Chocolat', function() {
             expect(typeof chocolat.api.current).to.equal('function')
         })
 
-        it('should have a place method', function() {
-            expect(typeof chocolat.api.place).to.equal('function')
+        it('should have a position method', function() {
+            expect(typeof chocolat.api.position).to.equal('function')
         })
 
         it('should have a destroy method', function() {

From e167806650203e96fbfe4676c1f48015c119f59a Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 9 Nov 2019 22:06:01 +0100
Subject: [PATCH 37/65] Renamed default image size to scale-down

---
 dist/js/chocolat.cjs.js  |  14 +-
 dist/js/chocolat.esm.js  |  14 +-
 dist/js/chocolat.iife.js |  14 +-
 package.json             |   7 +-
 readme.md                | 268 +--------------------------------------
 src/js/chocolat.js       |  12 +-
 6 files changed, 37 insertions(+), 292 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 5d429f5..a4e44cd 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -4,8 +4,8 @@ const defaults = {
   container: window,
   // window or element
   className: undefined,
-  imageSize: 'default',
-  // 'default', 'contain', 'cover' or 'native'
+  imageSize: 'scale-down',
+  // 'scale-down', 'contain', 'cover' or 'native'
   initialZoomState: null,
   allowFullScreen: false,
   loop: false,
@@ -25,8 +25,8 @@ const defaults = {
     return this.images[this.settings.currentImageIndex].title;
   },
   pagination: function () {
-    var last = this.settings.lastImageIndex + 1;
-    var position = this.settings.currentImageIndex + 1;
+    const last = this.settings.lastImageIndex + 1;
+    const position = this.settings.currentImageIndex + 1;
     return position + '/' + last;
   },
 
@@ -244,7 +244,7 @@ class Chocolat {
         height = width * imgRatio;
       }
 
-      if (this.settings.imageSize === 'default' && (width >= imgWidth || height >= imgHeight)) {
+      if (this.settings.imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
         width = imgWidth;
         height = imgHeight;
       }
@@ -261,7 +261,7 @@ class Chocolat {
   change(signe) {
     this.zoomOut();
     this.zoomable();
-    var requestedImage = this.settings.currentImageIndex + parseInt(signe);
+    const requestedImage = this.settings.currentImageIndex + parseInt(signe);
 
     if (requestedImage > this.settings.lastImageIndex) {
       if (this.settings.loop) {
@@ -408,7 +408,7 @@ class Chocolat {
   }
 
   openFullScreen() {
-    var wrapper = this.elems.wrapper;
+    const wrapper = this.elems.wrapper;
 
     if (wrapper.requestFullscreen) {
       this.settings.fullscreenOpen = true;
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 8d243f3..6090f2a 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -2,8 +2,8 @@ const defaults = {
   container: window,
   // window or element
   className: undefined,
-  imageSize: 'default',
-  // 'default', 'contain', 'cover' or 'native'
+  imageSize: 'scale-down',
+  // 'scale-down', 'contain', 'cover' or 'native'
   initialZoomState: null,
   allowFullScreen: false,
   loop: false,
@@ -23,8 +23,8 @@ const defaults = {
     return this.images[this.settings.currentImageIndex].title;
   },
   pagination: function () {
-    var last = this.settings.lastImageIndex + 1;
-    var position = this.settings.currentImageIndex + 1;
+    const last = this.settings.lastImageIndex + 1;
+    const position = this.settings.currentImageIndex + 1;
     return position + '/' + last;
   },
 
@@ -242,7 +242,7 @@ class Chocolat {
         height = width * imgRatio;
       }
 
-      if (this.settings.imageSize === 'default' && (width >= imgWidth || height >= imgHeight)) {
+      if (this.settings.imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
         width = imgWidth;
         height = imgHeight;
       }
@@ -259,7 +259,7 @@ class Chocolat {
   change(signe) {
     this.zoomOut();
     this.zoomable();
-    var requestedImage = this.settings.currentImageIndex + parseInt(signe);
+    const requestedImage = this.settings.currentImageIndex + parseInt(signe);
 
     if (requestedImage > this.settings.lastImageIndex) {
       if (this.settings.loop) {
@@ -406,7 +406,7 @@ class Chocolat {
   }
 
   openFullScreen() {
-    var wrapper = this.elems.wrapper;
+    const wrapper = this.elems.wrapper;
 
     if (wrapper.requestFullscreen) {
       this.settings.fullscreenOpen = true;
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 481db40..84115a8 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -5,8 +5,8 @@
       container: window,
       // window or element
       className: undefined,
-      imageSize: 'default',
-      // 'default', 'contain', 'cover' or 'native'
+      imageSize: 'scale-down',
+      // 'scale-down', 'contain', 'cover' or 'native'
       initialZoomState: null,
       allowFullScreen: false,
       loop: false,
@@ -26,8 +26,8 @@
         return this.images[this.settings.currentImageIndex].title;
       },
       pagination: function () {
-        var last = this.settings.lastImageIndex + 1;
-        var position = this.settings.currentImageIndex + 1;
+        const last = this.settings.lastImageIndex + 1;
+        const position = this.settings.currentImageIndex + 1;
         return position + '/' + last;
       },
 
@@ -245,7 +245,7 @@
             height = width * imgRatio;
           }
 
-          if (this.settings.imageSize === 'default' && (width >= imgWidth || height >= imgHeight)) {
+          if (this.settings.imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
             width = imgWidth;
             height = imgHeight;
           }
@@ -262,7 +262,7 @@
       change(signe) {
         this.zoomOut();
         this.zoomable();
-        var requestedImage = this.settings.currentImageIndex + parseInt(signe);
+        const requestedImage = this.settings.currentImageIndex + parseInt(signe);
 
         if (requestedImage > this.settings.lastImageIndex) {
           if (this.settings.loop) {
@@ -409,7 +409,7 @@
       }
 
       openFullScreen() {
-        var wrapper = this.elems.wrapper;
+        const wrapper = this.elems.wrapper;
 
         if (wrapper.requestFullscreen) {
           this.settings.fullscreenOpen = true;
diff --git a/package.json b/package.json
index 179362f..2dc8856 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "chocolat",
-  "version": "0.5.0",
-  "description": "Responsive jQuery Lightbox Plugin",
+  "version": "1.0.0",
+  "description": "Responsive Lightbox Plugin",
   "main": "dist/js/chocolat.cjs.js",
   "module": "dist/js/chocolat.esm.js",
   "browser": "dist/js/chocolat.iife.js",
@@ -9,7 +9,7 @@
     "test": "test"
   },
   "scripts": {
-    "build": "yarn prettier && rollup -c",
+    "build": "npm run prettier && rollup -c",
     "dev": "rollup -c -w",
     "test": "mocha-chrome test/index.html",
     "prettier": "./node_modules/.bin/prettier src/js/*.js test/*.js --write"
@@ -38,7 +38,6 @@
     "url": "git+https://github.com/nicolas-t/Chocolat.git"
   },
   "keywords": [
-    "jquery",
     "lightbox",
     "plugin",
     "responsive"
diff --git a/readme.md b/readme.md
index d355188..eb9c909 100644
--- a/readme.md
+++ b/readme.md
@@ -1,282 +1,28 @@
 ## Chocolat [![Build Status](https://travis-ci.org/nicolas-t/Chocolat.svg?branch=master)](https://travis-ci.org/nicolas-t/Chocolat)
 -----------
 Chocolat is a responsive lightbox  
-What you are looking for is in the `/dist/` folder.  
 [Demo page is here](http://chocolat.insipi.de/#demo)
   
 [![Image of Chocolat](http://full.ouplo.com/10/9/jzbY.jpg)](http://chocolat.insipi.de/#demo)
 
 
-## Installation
-You can install chocolat as a node module  
-(css from node_modules has to be linked in your html file anyway)
-```
-yarn add chocolat
-```
-or
-```
-npm install chocolat
-```
-
-If you want to use chocolat as a module you'll have to import it like this : 
-```js
-import $ from 'jquery'
-import Chocolat from 'chocolat'
-
-$.fn.Chocolat = Chocolat 
-```
-
-Or the old school way by linking `dist/js/jquery.chocolat.js` and `dist/css/chocolat.css` to your html file  
-
-
-## Markup
------------
-```html
-<div id="example1">
-    <a class="chocolat-image" href="img/a.jpg" title="image caption a">
-        A <!-- you can display a thumbnail here : <img src="thumb/a.jpg" /> -->
-    </a>
-    <a class="chocolat-image" href="img/b.jpg" title="image caption b">
-        B <!-- you can display a thumbnail here : <img src="thumb/b.jpg" /> -->
-    </a>
-</div>
-```
-
-```js
-Chocolat(document.querySelectorAll('#example1 .chocolat-image'), {})
-```
-
 ## Documentation
 -----------
 
-### Parameters
-
-**container :**  
-type: `HTML Node`  
-default: `window`   
-Sets whether viewer will open and fill the whole page (`default`), or whether it should open in a particular block of the page.  
-For example `#container2`, in this case the height and width of the block must be defined.
-Values can be : window, or a node.
-
-**linkImages :**  
-type: `boolean`  
-default: `true`    
-Sets whether we can switch from one image to another, within the same call, without closing the viewer (`true`), or if the images remain independent (`false`). 
-
-**setTitle :**  
-type: `function`  
-default: `() => ''`  
-Function returning the title of the set.
-
-**pagination :**  
-type: `function`  
-default: `() => position + '/' + last`  
-Function returning the pagination (ex: 2/5).
-
-**description :**  
-type: `function`  
-default: `() => this.settings.images[this.settings.currentImage].title`  
-Function returning the description of the image.
-
-**className :**  
-type: `string`   
-default: `''`   
-Add custom css classes to the parent of the lightbox.
-
-**imageSize :**  
-type: `string`  
-default: `'default'`   
-Can be `'default'`, `'contain'`, `'native'`, or `'cover'`.  
- - `default` : if the image is bigger than the window it's resized to fit, else if the image is smaller than the window it's not streched, only displayed at native dimensions.  
- - `'contain'` : if the image is bigger than the window it's resized to fit, else if the image is smaller than the window it's streched, to fit the window.  
- - `'cover'` : the image cover the window, no white space are displayed. More informations & exemple about contain/cover [here](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Scaling_background_images).  
- - `'native'` : the image is never streched nor shrinked, always displayed at native dimensions  
-
-**fullScreen :**  
-type: `boolean`  
-default: `false`   
-Allow fullscreen browsing (hides the browser window).
-
-**loop :**  
-type: `boolean`  
-default: `false`  
-Last image + 1 leads to first image & first image - 1 leads to last image.
-
-**firstImage :**  
-type: `number`  
-default: `0`   
-Index of the image that you want to start the series.
-
-**lastImage :**  
-type: `number`  
-default: `this.settings.images.length - 1`  
-Index of the image that you want to end the series. 
-
-**images :**  
-type: `array`  
-default: `undefined`    
-Array of objects representing the set images.
-```js
-[
-    {
-        src:'img1.jpg',
-        title: 'title'
-    }, {
-        src:'img1.jpg',  
-        title: 'title'
-    }, ...
-]
-```
-If `undefined` (default) it's built based on DOM attributes.
-
-**enableZoom :**  
-type: `boolean`  
-default: `true`    
-Disable or enable the zooming feature.  
-
-**afterInitialize :**  
-type: `function`  
-default: `undefined`   
-Function (hook) called just after chocolat gets initialized.  
-
-**afterMarkup :**  
-type: `function`  
-default: `undefined`    
-Function (hook) called just after markup is created. 
-You can use it to alter the default markup: to move the caption at the top of the image for example.
-```js
-Chocolat(document.querySelectorAll('.chocolat-image'), {
-    afterMarkup: function() {
-        return $(this.elems.description).appendTo(this.elems.top)
-    },
-})
-
-```
-
-**afterImageLoad :**  
-type: `function`    
-default: `undefined`    
-Function (hook) called just after the image is loaded.
-
+[Documentation](https://chocolat.gitbook.io/chocolat/)
 
-**zoomedPaddingX :**  
-type: `function`  
-default: `(canvasWidth, imgWidth) => 0`    
-Function returning the horizontal padding to add around the image when it's zoomed.
-It takes 2 arguments `canvasWidth` and `imgWidth`
-```js
-Chocolat(document.querySelectorAll('.chocolat-image'), {
-    zoomedPaddingX: function (canvasWidth, imgWidth) {
-        return canvasWidth / 2
-    }
-})
-```
 
-**zoomedPaddingY :**  
-type: `function`  
-default: `(canvasHeight, imgHeight) => 0`    
-Function returning the vertical padding to add around the image when it's zoomed.
-It takes 2 arguments `canvasHeight` and `imgHeight`
-```js
-Chocolat(document.querySelectorAll('.chocolat-image'), {
-    zoomedPaddingY: function (canvasHeight, imgHeight) {
-        return canvasHeight / 2
-    }
-})
-```
-
-### API
-
-###### Syntax
-Call chocolat like this :
-```js
-var instance = Chocolat(document.querySelectorAll('#example1 .chocolat-image'), {})
-```
-
-Then API calls can be made like this (open for exemple):
-```js
-instance.api().open()
-```
-
-###### Methods
-**open  :**  `param (optionnal) : i`
-Open the lightbox on the image whose index is `i`.
-By default on the first image (i=0).
-Returns a $.Deferred object.
-
-**close  :**
-Close the lightbox.
-Returns a $.Deferred object.
-
-**prev  :**
-Change image backward.
-Returns a $.Deferred object.
-
-**next  :**
-Change image forward.
-Returns a $.Deferred object.
-
-**goto  :**  `param : i`
-(Alias of open)  go to image whose index is `i` on an already opened ligthbox.
-Returns a $.Deferred object.
-
-**place  :**
-Center the image in its parent.
-Returns a $.Deferred object.
-
-**destroy  :**
-Destroy the current instance. Remove elements, unbind events, clear data.
-
-**set  :**   `params : property, value`
-Classic setter
-
-**get  :**   `param : property`
-Classic getter
-
-**getElem  :**   `param : name`
-Returns a jQuery object composing the lightbox.
-Ex: for the next arrow  : `instance.api().getElem('right')`
-
-**current  :**
-Returns the index of the current image.
-
-### CSS Classes
-
-**.chocolat-open  :**
-Set to the container when the lightbox is open.
-
-**.chocolat-in-container  :**
-Set to the container when chocolat is open in a block (`container != window`)
+## Upgrading
+-----------
 
-**.chocolat-cover  :**
-Set to the container when chocolat `imageSize` is set to `'cover'`
+[Upgrading](https://chocolat.gitbook.io/chocolat/upgrading-from-v0.4)
 
-**.chocolat-zoomable  :**
-Set to the container when chocolat is zoomable
+## Contributing
+-----------
+[Contributing](https://chocolat.gitbook.io/chocolat/contributing)
 
-**.chocolat-zoomed  :**
-Set to the container when chocolat is zoomed
 
 ## License
 -----------
 
-### Open source license
 If you are creating an open source application under a license compatible with the GNU GPL license v3, you may use this project under the terms of the GPLv3.
-
-
-## Contributing
------------
-Feel free to contribute by forking then making a pull request.  
-Edit files in the `/src/` folder, run `gulp` to copy/minify into the `/dist/` folder and to watch for changes.  
-Before creating a pull request please run the test suite : `yarn test` or `npm run test`  
-And `yarn prettier` or `npm run prettier` to correct code style errors.  
-
-## Testing
-To test, run `gulp test`, open the file `test/index.html` to write new tests  
-The main test file is : `test/src/test.chocolat.js`   
-To run the tests in command line use : `yarn test` or `npm run test`  
-To run prettier use : `yarn prettier` or `npm run prettier`  
-
-## Angular (ng-chocolat)
-An angular directive of Chocolat.js exists thanks to @beuted:
-https://github.com/beuted/ng-chocolat
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index a5d0daf..39d3c1a 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -1,7 +1,7 @@
 export const defaults = {
     container: window, // window or element
     className: undefined,
-    imageSize: 'default', // 'default', 'contain', 'cover' or 'native'
+    imageSize: 'scale-down', // 'scale-down', 'contain', 'cover' or 'native'
     initialZoomState: null,
     allowFullScreen: false,
     loop: false,
@@ -21,8 +21,8 @@ export const defaults = {
         return this.images[this.settings.currentImageIndex].title
     },
     pagination: function() {
-        var last = this.settings.lastImageIndex + 1
-        var position = this.settings.currentImageIndex + 1
+        const last = this.settings.lastImageIndex + 1
+        const position = this.settings.currentImageIndex + 1
 
         return position + '/' + last
     },
@@ -264,7 +264,7 @@ export class Chocolat {
                 height = width * imgRatio
             }
             if (
-                this.settings.imageSize === 'default' &&
+                this.settings.imageSize === 'scale-down' &&
                 (width >= imgWidth || height >= imgHeight)
             ) {
                 width = imgWidth
@@ -284,7 +284,7 @@ export class Chocolat {
         this.zoomOut()
         this.zoomable()
 
-        var requestedImage = this.settings.currentImageIndex + parseInt(signe)
+        const requestedImage = this.settings.currentImageIndex + parseInt(signe)
         if (requestedImage > this.settings.lastImageIndex) {
             if (this.settings.loop) {
                 return this.load(0)
@@ -440,7 +440,7 @@ export class Chocolat {
     }
 
     openFullScreen() {
-        var wrapper = this.elems.wrapper
+        const wrapper = this.elems.wrapper
 
         if (wrapper.requestFullscreen) {
             this.settings.fullscreenOpen = true

From ab712cae706c21eebd2515600db514752100e2e8 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sat, 9 Nov 2019 22:21:34 +0100
Subject: [PATCH 38/65] Improved some variable declarations

---
 dist/js/chocolat.cjs.js  | 54 ++++++++++++++----------------------
 dist/js/chocolat.esm.js  | 54 ++++++++++++++----------------------
 dist/js/chocolat.iife.js | 54 ++++++++++++++----------------------
 src/js/chocolat.js       | 59 ++++++++++++++++++----------------------
 4 files changed, 90 insertions(+), 131 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index a4e44cd..9c18bec 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -258,16 +258,16 @@ class Chocolat {
     };
   }
 
-  change(signe) {
+  change(step) {
     this.zoomOut();
     this.zoomable();
-    const requestedImage = this.settings.currentImageIndex + parseInt(signe);
+    const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
     if (requestedImage > this.settings.lastImageIndex) {
       if (this.settings.loop) {
-        return this.load(0);
+        return this.load(this.settings.firstImageIndex);
       }
-    } else if (requestedImage < 0) {
+    } else if (requestedImage < this.settings.firstImageIndex) {
       if (this.settings.loop) {
         return this.load(this.settings.lastImageIndex);
       }
@@ -281,19 +281,8 @@ class Chocolat {
       this.elems.left.classList.add('active');
       this.elems.right.classList.add('active');
     } else if (this.settings.linkImages) {
-      // right
-      if (this.settings.currentImageIndex == this.settings.lastImageIndex) {
-        this.elems.right.classList.remove('active');
-      } else {
-        this.elems.right.classList.add('active');
-      } // left
-
-
-      if (this.settings.currentImageIndex === 0) {
-        this.elems.left.classList.remove('active');
-      } else {
-        this.elems.left.classList.add('active');
-      }
+      this.elems.right.classList.toggle('active', this.settings.currentImageIndex !== this.settings.lastImageIndex);
+      this.elems.left.classList.toggle('active', this.settings.currentImageIndex !== this.settings.firstImageIndex);
     } else {
       this.elems.left.classList.remove('active');
       this.elems.right.classList.remove('active');
@@ -319,7 +308,7 @@ class Chocolat {
   }
 
   destroy() {
-    for (var i = this.events.length - 1; i >= 0; i--) {
+    for (let i = this.events.length - 1; i >= 0; i--) {
       const {
         element,
         eventName
@@ -515,24 +504,23 @@ class Chocolat {
         top: rect.top + window.scrollY,
         left: rect.left + window.scrollX
       };
-      var height = this.elems.wrapper.clientHeight;
-      var width = this.elems.wrapper.clientWidth;
-      var currentImageIndex = this.images[this.settings.currentImageIndex];
-      var imgWidth = this.elems.img.width;
-      var imgHeight = this.elems.img.height;
-      var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
-      var mvtX = 0;
+      const height = this.elems.wrapper.clientHeight;
+      const width = this.elems.wrapper.clientWidth;
+      const imgWidth = this.elems.img.width;
+      const imgHeight = this.elems.img.height;
+      const coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
+      let mvtX = 0;
 
       if (imgWidth > width) {
-        var paddingX = this.settings.zoomedPaddingX(imgWidth, width);
+        const paddingX = this.settings.zoomedPaddingX(imgWidth, width);
         mvtX = coord[0] / (width / 2);
         mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
       }
 
-      var mvtY = 0;
+      let mvtY = 0;
 
       if (imgHeight > height) {
-        var paddingY = this.settings.zoomedPaddingY(imgHeight, height);
+        const paddingY = this.settings.zoomedPaddingY(imgHeight, height);
         mvtY = coord[1] / (height / 2);
         mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
       }
@@ -559,11 +547,11 @@ class Chocolat {
   }
 
   zoomable() {
-    var currentImageIndex = this.images[this.settings.currentImageIndex];
-    var wrapperWidth = this.elems.wrapper.clientWidth;
-    var wrapperHeight = this.elems.wrapper.clientHeight;
-    var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
-    var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
+    const currentImageIndex = this.images[this.settings.currentImageIndex];
+    const wrapperWidth = this.elems.wrapper.clientWidth;
+    const wrapperHeight = this.elems.wrapper.clientHeight;
+    const isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+    const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
     if (isImageZoomable && !isImageStretched) {
       this.elems.domContainer.classList.add('chocolat-zoomable');
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 6090f2a..4b2bb29 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -256,16 +256,16 @@ class Chocolat {
     };
   }
 
-  change(signe) {
+  change(step) {
     this.zoomOut();
     this.zoomable();
-    const requestedImage = this.settings.currentImageIndex + parseInt(signe);
+    const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
     if (requestedImage > this.settings.lastImageIndex) {
       if (this.settings.loop) {
-        return this.load(0);
+        return this.load(this.settings.firstImageIndex);
       }
-    } else if (requestedImage < 0) {
+    } else if (requestedImage < this.settings.firstImageIndex) {
       if (this.settings.loop) {
         return this.load(this.settings.lastImageIndex);
       }
@@ -279,19 +279,8 @@ class Chocolat {
       this.elems.left.classList.add('active');
       this.elems.right.classList.add('active');
     } else if (this.settings.linkImages) {
-      // right
-      if (this.settings.currentImageIndex == this.settings.lastImageIndex) {
-        this.elems.right.classList.remove('active');
-      } else {
-        this.elems.right.classList.add('active');
-      } // left
-
-
-      if (this.settings.currentImageIndex === 0) {
-        this.elems.left.classList.remove('active');
-      } else {
-        this.elems.left.classList.add('active');
-      }
+      this.elems.right.classList.toggle('active', this.settings.currentImageIndex !== this.settings.lastImageIndex);
+      this.elems.left.classList.toggle('active', this.settings.currentImageIndex !== this.settings.firstImageIndex);
     } else {
       this.elems.left.classList.remove('active');
       this.elems.right.classList.remove('active');
@@ -317,7 +306,7 @@ class Chocolat {
   }
 
   destroy() {
-    for (var i = this.events.length - 1; i >= 0; i--) {
+    for (let i = this.events.length - 1; i >= 0; i--) {
       const {
         element,
         eventName
@@ -513,24 +502,23 @@ class Chocolat {
         top: rect.top + window.scrollY,
         left: rect.left + window.scrollX
       };
-      var height = this.elems.wrapper.clientHeight;
-      var width = this.elems.wrapper.clientWidth;
-      var currentImageIndex = this.images[this.settings.currentImageIndex];
-      var imgWidth = this.elems.img.width;
-      var imgHeight = this.elems.img.height;
-      var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
-      var mvtX = 0;
+      const height = this.elems.wrapper.clientHeight;
+      const width = this.elems.wrapper.clientWidth;
+      const imgWidth = this.elems.img.width;
+      const imgHeight = this.elems.img.height;
+      const coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
+      let mvtX = 0;
 
       if (imgWidth > width) {
-        var paddingX = this.settings.zoomedPaddingX(imgWidth, width);
+        const paddingX = this.settings.zoomedPaddingX(imgWidth, width);
         mvtX = coord[0] / (width / 2);
         mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
       }
 
-      var mvtY = 0;
+      let mvtY = 0;
 
       if (imgHeight > height) {
-        var paddingY = this.settings.zoomedPaddingY(imgHeight, height);
+        const paddingY = this.settings.zoomedPaddingY(imgHeight, height);
         mvtY = coord[1] / (height / 2);
         mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
       }
@@ -557,11 +545,11 @@ class Chocolat {
   }
 
   zoomable() {
-    var currentImageIndex = this.images[this.settings.currentImageIndex];
-    var wrapperWidth = this.elems.wrapper.clientWidth;
-    var wrapperHeight = this.elems.wrapper.clientHeight;
-    var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
-    var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
+    const currentImageIndex = this.images[this.settings.currentImageIndex];
+    const wrapperWidth = this.elems.wrapper.clientWidth;
+    const wrapperHeight = this.elems.wrapper.clientHeight;
+    const isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+    const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
     if (isImageZoomable && !isImageStretched) {
       this.elems.domContainer.classList.add('chocolat-zoomable');
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 84115a8..244bd26 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -259,16 +259,16 @@
         };
       }
 
-      change(signe) {
+      change(step) {
         this.zoomOut();
         this.zoomable();
-        const requestedImage = this.settings.currentImageIndex + parseInt(signe);
+        const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
         if (requestedImage > this.settings.lastImageIndex) {
           if (this.settings.loop) {
-            return this.load(0);
+            return this.load(this.settings.firstImageIndex);
           }
-        } else if (requestedImage < 0) {
+        } else if (requestedImage < this.settings.firstImageIndex) {
           if (this.settings.loop) {
             return this.load(this.settings.lastImageIndex);
           }
@@ -282,19 +282,8 @@
           this.elems.left.classList.add('active');
           this.elems.right.classList.add('active');
         } else if (this.settings.linkImages) {
-          // right
-          if (this.settings.currentImageIndex == this.settings.lastImageIndex) {
-            this.elems.right.classList.remove('active');
-          } else {
-            this.elems.right.classList.add('active');
-          } // left
-
-
-          if (this.settings.currentImageIndex === 0) {
-            this.elems.left.classList.remove('active');
-          } else {
-            this.elems.left.classList.add('active');
-          }
+          this.elems.right.classList.toggle('active', this.settings.currentImageIndex !== this.settings.lastImageIndex);
+          this.elems.left.classList.toggle('active', this.settings.currentImageIndex !== this.settings.firstImageIndex);
         } else {
           this.elems.left.classList.remove('active');
           this.elems.right.classList.remove('active');
@@ -320,7 +309,7 @@
       }
 
       destroy() {
-        for (var i = this.events.length - 1; i >= 0; i--) {
+        for (let i = this.events.length - 1; i >= 0; i--) {
           const {
             element,
             eventName
@@ -516,24 +505,23 @@
             top: rect.top + window.scrollY,
             left: rect.left + window.scrollX
           };
-          var height = this.elems.wrapper.clientHeight;
-          var width = this.elems.wrapper.clientWidth;
-          var currentImageIndex = this.images[this.settings.currentImageIndex];
-          var imgWidth = this.elems.img.width;
-          var imgHeight = this.elems.img.height;
-          var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
-          var mvtX = 0;
+          const height = this.elems.wrapper.clientHeight;
+          const width = this.elems.wrapper.clientWidth;
+          const imgWidth = this.elems.img.width;
+          const imgHeight = this.elems.img.height;
+          const coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
+          let mvtX = 0;
 
           if (imgWidth > width) {
-            var paddingX = this.settings.zoomedPaddingX(imgWidth, width);
+            const paddingX = this.settings.zoomedPaddingX(imgWidth, width);
             mvtX = coord[0] / (width / 2);
             mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
           }
 
-          var mvtY = 0;
+          let mvtY = 0;
 
           if (imgHeight > height) {
-            var paddingY = this.settings.zoomedPaddingY(imgHeight, height);
+            const paddingY = this.settings.zoomedPaddingY(imgHeight, height);
             mvtY = coord[1] / (height / 2);
             mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
           }
@@ -560,11 +548,11 @@
       }
 
       zoomable() {
-        var currentImageIndex = this.images[this.settings.currentImageIndex];
-        var wrapperWidth = this.elems.wrapper.clientWidth;
-        var wrapperHeight = this.elems.wrapper.clientHeight;
-        var isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
-        var isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
+        const currentImageIndex = this.images[this.settings.currentImageIndex];
+        const wrapperWidth = this.elems.wrapper.clientWidth;
+        const wrapperHeight = this.elems.wrapper.clientHeight;
+        const isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+        const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
         if (isImageZoomable && !isImageStretched) {
           this.elems.domContainer.classList.add('chocolat-zoomable');
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 39d3c1a..3c66f7a 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -280,16 +280,16 @@ export class Chocolat {
         }
     }
 
-    change(signe) {
+    change(step) {
         this.zoomOut()
         this.zoomable()
 
-        const requestedImage = this.settings.currentImageIndex + parseInt(signe)
+        const requestedImage = this.settings.currentImageIndex + parseInt(step)
         if (requestedImage > this.settings.lastImageIndex) {
             if (this.settings.loop) {
-                return this.load(0)
+                return this.load(this.settings.firstImageIndex)
             }
-        } else if (requestedImage < 0) {
+        } else if (requestedImage < this.settings.firstImageIndex) {
             if (this.settings.loop) {
                 return this.load(this.settings.lastImageIndex)
             }
@@ -303,18 +303,14 @@ export class Chocolat {
             this.elems.left.classList.add('active')
             this.elems.right.classList.add('active')
         } else if (this.settings.linkImages) {
-            // right
-            if (this.settings.currentImageIndex == this.settings.lastImageIndex) {
-                this.elems.right.classList.remove('active')
-            } else {
-                this.elems.right.classList.add('active')
-            }
-            // left
-            if (this.settings.currentImageIndex === 0) {
-                this.elems.left.classList.remove('active')
-            } else {
-                this.elems.left.classList.add('active')
-            }
+            this.elems.right.classList.toggle(
+                'active',
+                this.settings.currentImageIndex !== this.settings.lastImageIndex
+            )
+            this.elems.left.classList.toggle(
+                'active',
+                this.settings.currentImageIndex !== this.settings.firstImageIndex
+            )
         } else {
             this.elems.left.classList.remove('active')
             this.elems.right.classList.remove('active')
@@ -343,7 +339,7 @@ export class Chocolat {
     }
 
     destroy() {
-        for (var i = this.events.length - 1; i >= 0; i--) {
+        for (let i = this.events.length - 1; i >= 0; i--) {
             const { element, eventName } = this.events[i]
             this.off(element, eventName)
         }
@@ -557,25 +553,24 @@ export class Chocolat {
                 left: rect.left + window.scrollX,
             }
 
-            var height = this.elems.wrapper.clientHeight
-            var width = this.elems.wrapper.clientWidth
+            const height = this.elems.wrapper.clientHeight
+            const width = this.elems.wrapper.clientWidth
 
-            var currentImageIndex = this.images[this.settings.currentImageIndex]
-            var imgWidth = this.elems.img.width
-            var imgHeight = this.elems.img.height
+            const imgWidth = this.elems.img.width
+            const imgHeight = this.elems.img.height
 
-            var coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top]
+            const coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top]
 
-            var mvtX = 0
+            let mvtX = 0
             if (imgWidth > width) {
-                var paddingX = this.settings.zoomedPaddingX(imgWidth, width)
+                const paddingX = this.settings.zoomedPaddingX(imgWidth, width)
                 mvtX = coord[0] / (width / 2)
                 mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX
             }
 
-            var mvtY = 0
+            let mvtY = 0
             if (imgHeight > height) {
-                var paddingY = this.settings.zoomedPaddingY(imgHeight, height)
+                const paddingY = this.settings.zoomedPaddingY(imgHeight, height)
                 mvtY = coord[1] / (height / 2)
                 mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY
             }
@@ -598,17 +593,17 @@ export class Chocolat {
     }
 
     zoomable() {
-        var currentImageIndex = this.images[this.settings.currentImageIndex]
-        var wrapperWidth = this.elems.wrapper.clientWidth
-        var wrapperHeight = this.elems.wrapper.clientHeight
+        const currentImageIndex = this.images[this.settings.currentImageIndex]
+        const wrapperWidth = this.elems.wrapper.clientWidth
+        const wrapperHeight = this.elems.wrapper.clientHeight
 
-        var isImageZoomable =
+        const isImageZoomable =
             this.settings.allowZoom &&
             (this.elems.img.naturalWidth > wrapperWidth ||
                 this.elems.img.naturalHeight > wrapperHeight)
                 ? true
                 : false
-        var isImageStretched =
+        const isImageStretched =
             this.elems.img.clientWidth > this.elems.img.naturalWidth ||
             this.elems.img.clientHeight > this.elems.img.naturalHeight
 

From 8d947de2fcabc2a469eb699221bbabccc31dbc6e Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 10 Nov 2019 13:57:32 +0100
Subject: [PATCH 39/65] Created utils file and state object, removed
 domContainer and fullscreen tests

---
 demo/index.html          |   2 +-
 dist/css/chocolat.css    |   4 +
 dist/js/chocolat.cjs.js  | 428 ++++++++++++++++++++-------------------
 dist/js/chocolat.esm.js  | 428 ++++++++++++++++++++-------------------
 dist/js/chocolat.iife.js | 428 ++++++++++++++++++++-------------------
 src/css/chocolat.css     |   4 +
 src/js/chocolat.js       | 339 +++++++++++--------------------
 src/js/utils.js          | 126 ++++++++++++
 test/test.js             | 102 +---------
 9 files changed, 923 insertions(+), 938 deletions(-)
 create mode 100644 src/js/utils.js

diff --git a/demo/index.html b/demo/index.html
index ea13e78..3b3357b 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -117,7 +117,7 @@ <h2>
         <script>
             // standard demos
             Chocolat(document.querySelectorAll('#example0 .chocolat-image'), {
-                imageSize: 'contain'
+                imageSize: 'contain',
             })
 
             Chocolat(document.querySelectorAll('#example1 .chocolat-image'), {
diff --git a/dist/css/chocolat.css b/dist/css/chocolat.css
index 1d4114c..27e0204 100644
--- a/dist/css/chocolat.css
+++ b/dist/css/chocolat.css
@@ -192,6 +192,10 @@ body.chocolat-open>.chocolat-content{
     position: relative;
 }
 
+.chocolat-zoomable.chocolat-zoomed .chocolat-img{
+    transition: margin 0s ease;
+}
+
 /* uncomment to hide controls when zoomed-in*/
 /*
 .chocolat-zoomable .chocolat-top,
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 9c18bec..f67a11d 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -1,22 +1,133 @@
 'use strict';
 
+let timerDebounce = undefined;
+function debounce(duration, callback) {
+  clearTimeout(timerDebounce);
+  timerDebounce = setTimeout(function () {
+    callback();
+  }, duration);
+  return timerDebounce;
+}
+function transitionAsPromise(triggeringFunc, el) {
+  return new Promise(resolve => {
+    const handleTransitionEnd = () => {
+      el.removeEventListener('transitionend', handleTransitionEnd);
+      resolve();
+    };
+
+    el.addEventListener('transitionend', handleTransitionEnd);
+    const classesBefore = el.getAttribute('class');
+    const stylesBefore = el.getAttribute('style');
+    triggeringFunc();
+
+    if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
+      handleTransitionEnd();
+    }
+  });
+}
+function loadImage(src, image) {
+  if ('decode' in image) {
+    image.src = src;
+    return image.decode();
+  } else {
+    return new Promise(function (resolve, reject) {
+      image.onload = resolve;
+      image.onerror = resolve;
+      image.src = src;
+    });
+  }
+}
+function fit(options) {
+  let height;
+  let width;
+  const {
+    imgHeight,
+    imgWidth,
+    containerHeight,
+    containerWidth,
+    containerGlobalWidth,
+    containerGlobalHeight,
+    imageSize
+  } = options;
+  const containerGlobalRatio = containerGlobalHeight / containerGlobalWidth;
+  const containerRatio = containerHeight / containerWidth;
+  const imgRatio = imgHeight / imgWidth;
+
+  if (imageSize == 'cover') {
+    if (imgRatio < containerRatio) {
+      height = containerHeight;
+      width = height / imgRatio;
+    } else {
+      width = containerWidth;
+      height = width * imgRatio;
+    }
+  } else if (imageSize == 'native') {
+    height = imgHeight;
+    width = imgWidth;
+  } else {
+    if (imgRatio > containerGlobalRatio) {
+      height = containerGlobalHeight;
+      width = height / imgRatio;
+    } else {
+      width = containerGlobalWidth;
+      height = width * imgRatio;
+    }
+
+    if (imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
+      width = imgWidth;
+      height = imgHeight;
+    }
+  }
+
+  return {
+    height: height,
+    width: width,
+    top: (containerHeight - height) / 2,
+    left: (containerWidth - width) / 2
+  };
+}
+function openFullScreen(wrapper) {
+  if (wrapper.requestFullscreen) {
+    wrapper.requestFullscreen();
+    return true;
+  } else if (wrapper.webkitRequestFullscreen) {
+    wrapper.webkitRequestFullscreen();
+    return true;
+  } else if (wrapper.msRequestFullscreen) {
+    wrapper.msRequestFullscreen();
+    return true;
+  } else {
+    return false;
+  }
+}
+function exitFullScreen() {
+  if (document.exitFullscreen) {
+    document.exitFullscreen();
+    return false;
+  } else if (document.webkitExitFullscreen) {
+    document.webkitExitFullscreen();
+    return false;
+  } else if (document.msExitFullscreen) {
+    document.msExitFullscreen();
+    return false;
+  } else {
+    return true;
+  }
+}
+
 const defaults = {
-  container: window,
+  container: document.body,
   // window or element
   className: undefined,
   imageSize: 'scale-down',
   // 'scale-down', 'contain', 'cover' or 'native'
-  initialZoomState: null,
-  allowFullScreen: false,
+  fullScreen: false,
   loop: false,
   linkImages: true,
   setIndex: 0,
   firstImageIndex: 0,
   lastImageIndex: false,
   currentImageIndex: undefined,
-  initialized: false,
-  timer: false,
-  timerDebounce: false,
   allowZoom: true,
   setTitle: function () {
     return '';
@@ -49,6 +160,12 @@ class Chocolat {
     this.elems = {};
     this.images = [];
     this.events = [];
+    this.state = {
+      fullScreenOpen: false,
+      initialZoomState: null,
+      initialized: false,
+      timer: false
+    };
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
     if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
@@ -69,6 +186,12 @@ class Chocolat {
       this.images = elements;
     }
 
+    if (this.settings.container instanceof Element || this.settings.container instanceof HTMLElement) {
+      this.elems.container = this.settings.container;
+    } else {
+      this.elems.container = document.body;
+    }
+
     this.api = {
       open: i => {
         i = parseInt(i) || 0;
@@ -109,34 +232,20 @@ class Chocolat {
   }
 
   init(i) {
-    if (!this.settings.initialized) {
-      this.setDomContainer();
+    if (!this.state.initialized) {
       this.markup();
       this.attachListeners();
       this.settings.lastImageIndex = this.images.length - 1;
-      this.settings.initialized = true;
+      this.state.initialized = true;
     }
 
     this.settings.afterInitialize.call(this);
     return this.load(i);
   }
 
-  loadImage(src, image) {
-    if ('decode' in image) {
-      image.src = src;
-      return image.decode();
-    } else {
-      return new Promise(function (resolve, reject) {
-        image.onload = resolve;
-        image.onerror = resolve;
-        image.src = src;
-      });
-    }
-  }
-
   load(i) {
-    if (this.settings.allowFullScreen) {
-      this.openFullScreen();
+    if (this.settings.fullScreen) {
+      this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     }
 
     if (this.settings.currentImageIndex === i) {
@@ -147,18 +256,18 @@ class Chocolat {
       this.elems.overlay.classList.add('chocolat-visible');
       this.elems.wrapper.classList.add('chocolat-visible');
     }, 0);
-    this.elems.domContainer.classList.add('chocolat-open');
-    this.settings.timer = setTimeout(() => {
+    this.elems.container.classList.add('chocolat-open');
+    this.state.timer = setTimeout(() => {
       if (this.elems !== undefined) {
         this.elems.loader.classList.add('chocolat-visible');
       }
     }, 300);
     const imgLoader = new Image();
-    return this.loadImage(this.images[i].src, imgLoader).then(() => {
+    return loadImage(this.images[i].src, imgLoader).then(() => {
       const nextIndex = i + 1;
 
       if (this.images[nextIndex] != undefined) {
-        this.loadImage(this.images[nextIndex].src, new Image());
+        loadImage(this.images[nextIndex].src, new Image());
       }
 
       this.settings.currentImageIndex = i;
@@ -175,17 +284,26 @@ class Chocolat {
     this.elems.description.textContent = this.settings.description.call(this);
     this.elems.pagination.textContent = this.settings.pagination.call(this);
     this.arrows();
+    const fitOptions = {
+      imgHeight: image.naturalHeight,
+      imgWidth: image.naturalWidth,
+      containerHeight: this.elems.wrapper.clientHeight,
+      containerWidth: this.elems.wrapper.clientWidth,
+      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      imageSize: this.settings.imageSize
+    };
     const {
       width,
       height,
       left,
       top
-    } = this.fit(image, this.elems.wrapper);
+    } = fit(fitOptions);
     return this.center(width, height, left, top);
   }
 
   center(width, height, left, top) {
-    return this.transitionAsPromise(() => {
+    return transitionAsPromise(() => {
       Object.assign(this.elems.content.style, {
         width: width + 'px',
         height: height + 'px',
@@ -196,66 +314,25 @@ class Chocolat {
   }
 
   appear(i) {
-    clearTimeout(this.settings.timer);
+    clearTimeout(this.state.timer);
 
     if (!this.elems.loader.classList.contains('chocolat-visible')) {
-      return this.loadImage(this.images[i].src, this.elems.img);
+      return loadImage(this.images[i].src, this.elems.img);
     }
 
-    return this.transitionAsPromise(() => {
+    return transitionAsPromise(() => {
       this.elems.loader.classList.remove('chocolat-visible');
     }, this.elems.loader).then(() => {
-      return this.loadImage(this.images[i].src, this.elems.img);
+      return loadImage(this.images[i].src, this.elems.img);
     });
   }
 
-  fit(image, container) {
-    let height;
-    let width;
-    const imgHeight = image.naturalHeight;
-    const imgWidth = image.naturalWidth;
-    const holderHeight = container.clientHeight;
-    const holderWidth = container.clientWidth;
-    const holderOutMarginH = this.getOutMarginH();
-    const holderOutMarginW = this.getOutMarginW();
-    const holderGlobalWidth = holderWidth - holderOutMarginW;
-    const holderGlobalHeight = holderHeight - holderOutMarginH;
-    const holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
-    const holderRatio = holderHeight / holderWidth;
-    const imgRatio = imgHeight / imgWidth;
-
-    if (this.settings.imageSize == 'cover') {
-      if (imgRatio < holderRatio) {
-        height = holderHeight;
-        width = height / imgRatio;
-      } else {
-        width = holderWidth;
-        height = width * imgRatio;
-      }
-    } else if (this.settings.imageSize == 'native') {
-      height = imgHeight;
-      width = imgWidth;
-    } else {
-      if (imgRatio > holderGlobalRatio) {
-        height = holderGlobalHeight;
-        width = height / imgRatio;
-      } else {
-        width = holderGlobalWidth;
-        height = width * imgRatio;
-      }
-
-      if (this.settings.imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
-        width = imgWidth;
-        height = imgHeight;
-      }
-    }
+  getOutMarginW() {
+    return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
+  }
 
-    return {
-      height: height,
-      width: width,
-      top: (holderHeight - height) / 2,
-      left: (holderWidth - width) / 2
-    };
+  getOutMarginH() {
+    return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
   }
 
   change(step) {
@@ -290,20 +367,20 @@ class Chocolat {
   }
 
   close() {
-    if (this.settings.fullscreenOpen) {
-      this.exitFullScreen();
+    if (this.state.fullScreenOpen) {
+      this.state.fullScreenOpen = exitFullScreen();
       return;
     }
 
     this.settings.currentImageIndex = undefined;
-    const promiseOverlay = this.transitionAsPromise(() => {
+    const promiseOverlay = transitionAsPromise(() => {
       this.elems.overlay.classList.remove('chocolat-visible');
     }, this.elems.overlay);
-    const promiseWrapper = this.transitionAsPromise(() => {
+    const promiseWrapper = transitionAsPromise(() => {
       this.elems.wrapper.classList.remove('chocolat-visible');
     }, this.elems.wrapper);
     return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
-      this.elems.domContainer.classList.remove('chocolat-open');
+      this.elems.container.classList.remove('chocolat-open');
     });
   }
 
@@ -316,43 +393,35 @@ class Chocolat {
       this.off(element, eventName);
     }
 
-    if (!this.settings.initialized) {
+    if (!this.state.initialized) {
       return;
     }
 
-    if (this.settings.fullscreenOpen) {
-      this.exitFullScreen();
+    if (this.state.fullScreenOpen) {
+      this.state.fullScreenOpen = exitFullScreen();
     }
 
     this.settings.currentImageIndex = undefined;
-    this.settings.initialized = false;
-    this.elems.domContainer.classList.remove(...this._cssClasses);
+    this.state.initialized = false;
+    this.elems.container.classList.remove(...this._cssClasses);
     this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
   }
 
-  getOutMarginW() {
-    return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
-  }
-
-  getOutMarginH() {
-    return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
-  }
-
   markup() {
-    this.elems.domContainer.classList.add('chocolat-open', this.settings.className);
+    this.elems.container.classList.add('chocolat-open', this.settings.className);
 
     if (this.settings.imageSize == 'cover') {
-      this.elems.domContainer.classList.add('chocolat-cover');
+      this.elems.container.classList.add('chocolat-cover');
     }
 
-    if (this.settings.container !== window) {
-      this.elems.domContainer.classList.add('chocolat-in-container');
+    if (this.elems.container !== document.body) {
+      this.elems.container.classList.add('chocolat-in-container');
     }
 
     this.elems.wrapper = document.createElement('div');
     this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
     this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
-    this.elems.domContainer.appendChild(this.elems.wrapper);
+    this.elems.container.appendChild(this.elems.wrapper);
     this.elems.overlay = document.createElement('div');
     this.elems.overlay.setAttribute('class', 'chocolat-overlay');
     this.elems.wrapper.appendChild(this.elems.overlay);
@@ -396,48 +465,10 @@ class Chocolat {
     this.settings.afterMarkup.call(this);
   }
 
-  openFullScreen() {
-    const wrapper = this.elems.wrapper;
-
-    if (wrapper.requestFullscreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.requestFullscreen();
-    } else if (wrapper.mozRequestFullScreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.mozRequestFullScreen();
-    } else if (wrapper.webkitRequestFullscreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.webkitRequestFullscreen();
-    } else if (wrapper.msRequestFullscreen) {
-      wrapper.msRequestFullscreen();
-      this.settings.fullscreenOpen = true;
-    } else {
-      this.settings.fullscreenOpen = false;
-    }
-  }
-
-  exitFullScreen() {
-    if (document.exitFullscreen) {
-      document.exitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.mozCancelFullScreen) {
-      document.mozCancelFullScreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.webkitExitFullscreen) {
-      document.webkitExitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.msExitFullscreen) {
-      document.msExitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else {
-      this.settings.fullscreenOpen = true;
-    }
-  }
-
   attachListeners() {
     this.off(document, 'keydown.chocolat');
     this.on(document, 'keydown.chocolat', e => {
-      if (this.settings.initialized) {
+      if (this.state.initialized) {
         if (e.keyCode == 37) {
           this.change(-1);
         } else if (e.keyCode == 39) {
@@ -458,40 +489,34 @@ class Chocolat {
       this.change(-1);
     });
     this.off(this.elems.close, 'click.chocolat');
-    this.on(this.elems.close, 'click.chocolat', () => {
-      this.close();
-    });
+    this.on(this.elems.close, 'click.chocolat', this.close.bind(this));
     this.off(this.elems.fullscreen, 'click.chocolat');
     this.on(this.elems.fullscreen, 'click.chocolat', () => {
-      if (this.settings.fullscreenOpen) {
-        this.exitFullScreen();
+      if (this.state.fullScreenOpen) {
+        this.state.fullScreenOpen = exitFullScreen();
         return;
       }
 
-      this.openFullScreen();
+      this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     });
 
     if (this.settings.backgroundClose) {
       this.off(this.elems.overlay, 'click.chocolat');
-      this.on(this.elems.overlay, 'click.chocolat', e => {
-        this.close();
-      });
+      this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this));
     }
 
     this.off(this.elems.wrapper, 'click.chocolat');
-    this.on(this.elems.wrapper, 'click.chocolat', e => {
-      this.zoomOut(e);
-    });
+    this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this));
     const img = this.elems.wrapper.querySelector('.chocolat-img');
     this.off(img, 'click.chocolat');
     this.on(img, 'click.chocolat', e => {
-      if (this.settings.initialZoomState === null && this.elems.domContainer.classList.contains('chocolat-zoomable')) {
+      if (this.state.initialZoomState === null && this.elems.container.classList.contains('chocolat-zoomable')) {
         e.stopPropagation();
         this.zoomIn(e);
       }
     });
     this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
-      if (this.settings.initialZoomState === null) {
+      if (this.state.initialZoomState === null) {
         return;
       }
 
@@ -529,17 +554,26 @@ class Chocolat {
       this.elems.img.style.marginTop = -mvtY + 'px';
     });
     this.on(window, 'resize.chocolat', e => {
-      if (!this.settings.initialized || this.settings.currentImageIndex === undefined) {
+      if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
         return;
       }
 
-      this.debounce(50, () => {
+      debounce(50, () => {
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          imageSize: this.settings.imageSize
+        };
         const {
           width,
           height,
           left,
           top
-        } = this.fit(this.elems.img, this.elems.wrapper);
+        } = fit(fitOptions);
         this.center(width, height, left, top);
         this.zoomable();
       });
@@ -554,60 +588,61 @@ class Chocolat {
     const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
     if (isImageZoomable && !isImageStretched) {
-      this.elems.domContainer.classList.add('chocolat-zoomable');
+      this.elems.container.classList.add('chocolat-zoomable');
     } else {
-      this.elems.domContainer.classList.remove('chocolat-zoomable');
+      this.elems.container.classList.remove('chocolat-zoomable');
     }
   }
 
   zoomIn(e) {
-    this.settings.initialZoomState = this.settings.imageSize;
+    this.state.initialZoomState = this.settings.imageSize;
     this.settings.imageSize = 'native';
-    this.elems.domContainer.classList.add('chocolat-zoomed');
+    this.elems.container.classList.add('chocolat-zoomed');
+    const fitOptions = {
+      imgHeight: this.elems.img.naturalHeight,
+      imgWidth: this.elems.img.naturalWidth,
+      containerHeight: this.elems.wrapper.clientHeight,
+      containerWidth: this.elems.wrapper.clientWidth,
+      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      imageSize: this.settings.imageSize
+    };
     const {
       width,
       height,
       left,
       top
-    } = this.fit(this.elems.img, this.elems.wrapper);
+    } = fit(fitOptions);
     return this.center(width, height, left, top);
   }
 
   zoomOut(e) {
-    if (this.settings.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+    if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
       return;
     }
 
-    this.settings.imageSize = this.settings.initialZoomState;
-    this.settings.initialZoomState = null;
+    this.settings.imageSize = this.state.initialZoomState;
+    this.state.initialZoomState = null;
     this.elems.img.style.margin = 0;
-    this.elems.domContainer.classList.remove('chocolat-zoomed');
+    this.elems.container.classList.remove('chocolat-zoomed');
+    const fitOptions = {
+      imgHeight: this.elems.img.naturalHeight,
+      imgWidth: this.elems.img.naturalWidth,
+      containerHeight: this.elems.wrapper.clientHeight,
+      containerWidth: this.elems.wrapper.clientWidth,
+      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      imageSize: this.settings.imageSize
+    };
     const {
       width,
       height,
       left,
       top
-    } = this.fit(this.elems.img, this.elems.wrapper);
+    } = fit(fitOptions);
     return this.center(width, height, left, top);
   }
 
-  setDomContainer() {
-    // if container == window
-    // domContainer = body
-    if (this.settings.container === window) {
-      this.elems.domContainer = document.body;
-    } else {
-      this.elems.domContainer = this.settings.container;
-    }
-  }
-
-  debounce(duration, callback) {
-    clearTimeout(this.settings.timerDebounce);
-    this.settings.timerDebounce = setTimeout(function () {
-      callback();
-    }, duration);
-  }
-
   on(element, eventName, cb) {
     // const eventName = this.settings.setIndex + '-' + eventName
     const length = this.events.push({
@@ -616,7 +651,6 @@ class Chocolat {
       cb
     });
     element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
-    return this;
   }
 
   off(element, eventName) {
@@ -629,26 +663,6 @@ class Chocolat {
       element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
       this.events.splice(index, 1);
     }
-
-    return this;
-  }
-
-  transitionAsPromise(triggeringFunc, el) {
-    return new Promise(resolve => {
-      const handleTransitionEnd = () => {
-        el.removeEventListener('transitionend', handleTransitionEnd);
-        resolve();
-      };
-
-      el.addEventListener('transitionend', handleTransitionEnd);
-      const classesBefore = el.getAttribute('class');
-      const stylesBefore = el.getAttribute('style');
-      triggeringFunc();
-
-      if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
-        handleTransitionEnd();
-      }
-    });
   }
 
 }
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 4b2bb29..0804e62 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -1,20 +1,131 @@
+let timerDebounce = undefined;
+function debounce(duration, callback) {
+  clearTimeout(timerDebounce);
+  timerDebounce = setTimeout(function () {
+    callback();
+  }, duration);
+  return timerDebounce;
+}
+function transitionAsPromise(triggeringFunc, el) {
+  return new Promise(resolve => {
+    const handleTransitionEnd = () => {
+      el.removeEventListener('transitionend', handleTransitionEnd);
+      resolve();
+    };
+
+    el.addEventListener('transitionend', handleTransitionEnd);
+    const classesBefore = el.getAttribute('class');
+    const stylesBefore = el.getAttribute('style');
+    triggeringFunc();
+
+    if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
+      handleTransitionEnd();
+    }
+  });
+}
+function loadImage(src, image) {
+  if ('decode' in image) {
+    image.src = src;
+    return image.decode();
+  } else {
+    return new Promise(function (resolve, reject) {
+      image.onload = resolve;
+      image.onerror = resolve;
+      image.src = src;
+    });
+  }
+}
+function fit(options) {
+  let height;
+  let width;
+  const {
+    imgHeight,
+    imgWidth,
+    containerHeight,
+    containerWidth,
+    containerGlobalWidth,
+    containerGlobalHeight,
+    imageSize
+  } = options;
+  const containerGlobalRatio = containerGlobalHeight / containerGlobalWidth;
+  const containerRatio = containerHeight / containerWidth;
+  const imgRatio = imgHeight / imgWidth;
+
+  if (imageSize == 'cover') {
+    if (imgRatio < containerRatio) {
+      height = containerHeight;
+      width = height / imgRatio;
+    } else {
+      width = containerWidth;
+      height = width * imgRatio;
+    }
+  } else if (imageSize == 'native') {
+    height = imgHeight;
+    width = imgWidth;
+  } else {
+    if (imgRatio > containerGlobalRatio) {
+      height = containerGlobalHeight;
+      width = height / imgRatio;
+    } else {
+      width = containerGlobalWidth;
+      height = width * imgRatio;
+    }
+
+    if (imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
+      width = imgWidth;
+      height = imgHeight;
+    }
+  }
+
+  return {
+    height: height,
+    width: width,
+    top: (containerHeight - height) / 2,
+    left: (containerWidth - width) / 2
+  };
+}
+function openFullScreen(wrapper) {
+  if (wrapper.requestFullscreen) {
+    wrapper.requestFullscreen();
+    return true;
+  } else if (wrapper.webkitRequestFullscreen) {
+    wrapper.webkitRequestFullscreen();
+    return true;
+  } else if (wrapper.msRequestFullscreen) {
+    wrapper.msRequestFullscreen();
+    return true;
+  } else {
+    return false;
+  }
+}
+function exitFullScreen() {
+  if (document.exitFullscreen) {
+    document.exitFullscreen();
+    return false;
+  } else if (document.webkitExitFullscreen) {
+    document.webkitExitFullscreen();
+    return false;
+  } else if (document.msExitFullscreen) {
+    document.msExitFullscreen();
+    return false;
+  } else {
+    return true;
+  }
+}
+
 const defaults = {
-  container: window,
+  container: document.body,
   // window or element
   className: undefined,
   imageSize: 'scale-down',
   // 'scale-down', 'contain', 'cover' or 'native'
-  initialZoomState: null,
-  allowFullScreen: false,
+  fullScreen: false,
   loop: false,
   linkImages: true,
   setIndex: 0,
   firstImageIndex: 0,
   lastImageIndex: false,
   currentImageIndex: undefined,
-  initialized: false,
-  timer: false,
-  timerDebounce: false,
   allowZoom: true,
   setTitle: function () {
     return '';
@@ -47,6 +158,12 @@ class Chocolat {
     this.elems = {};
     this.images = [];
     this.events = [];
+    this.state = {
+      fullScreenOpen: false,
+      initialZoomState: null,
+      initialized: false,
+      timer: false
+    };
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
     if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
@@ -67,6 +184,12 @@ class Chocolat {
       this.images = elements;
     }
 
+    if (this.settings.container instanceof Element || this.settings.container instanceof HTMLElement) {
+      this.elems.container = this.settings.container;
+    } else {
+      this.elems.container = document.body;
+    }
+
     this.api = {
       open: i => {
         i = parseInt(i) || 0;
@@ -107,34 +230,20 @@ class Chocolat {
   }
 
   init(i) {
-    if (!this.settings.initialized) {
-      this.setDomContainer();
+    if (!this.state.initialized) {
       this.markup();
       this.attachListeners();
       this.settings.lastImageIndex = this.images.length - 1;
-      this.settings.initialized = true;
+      this.state.initialized = true;
     }
 
     this.settings.afterInitialize.call(this);
     return this.load(i);
   }
 
-  loadImage(src, image) {
-    if ('decode' in image) {
-      image.src = src;
-      return image.decode();
-    } else {
-      return new Promise(function (resolve, reject) {
-        image.onload = resolve;
-        image.onerror = resolve;
-        image.src = src;
-      });
-    }
-  }
-
   load(i) {
-    if (this.settings.allowFullScreen) {
-      this.openFullScreen();
+    if (this.settings.fullScreen) {
+      this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     }
 
     if (this.settings.currentImageIndex === i) {
@@ -145,18 +254,18 @@ class Chocolat {
       this.elems.overlay.classList.add('chocolat-visible');
       this.elems.wrapper.classList.add('chocolat-visible');
     }, 0);
-    this.elems.domContainer.classList.add('chocolat-open');
-    this.settings.timer = setTimeout(() => {
+    this.elems.container.classList.add('chocolat-open');
+    this.state.timer = setTimeout(() => {
       if (this.elems !== undefined) {
         this.elems.loader.classList.add('chocolat-visible');
       }
     }, 300);
     const imgLoader = new Image();
-    return this.loadImage(this.images[i].src, imgLoader).then(() => {
+    return loadImage(this.images[i].src, imgLoader).then(() => {
       const nextIndex = i + 1;
 
       if (this.images[nextIndex] != undefined) {
-        this.loadImage(this.images[nextIndex].src, new Image());
+        loadImage(this.images[nextIndex].src, new Image());
       }
 
       this.settings.currentImageIndex = i;
@@ -173,17 +282,26 @@ class Chocolat {
     this.elems.description.textContent = this.settings.description.call(this);
     this.elems.pagination.textContent = this.settings.pagination.call(this);
     this.arrows();
+    const fitOptions = {
+      imgHeight: image.naturalHeight,
+      imgWidth: image.naturalWidth,
+      containerHeight: this.elems.wrapper.clientHeight,
+      containerWidth: this.elems.wrapper.clientWidth,
+      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      imageSize: this.settings.imageSize
+    };
     const {
       width,
       height,
       left,
       top
-    } = this.fit(image, this.elems.wrapper);
+    } = fit(fitOptions);
     return this.center(width, height, left, top);
   }
 
   center(width, height, left, top) {
-    return this.transitionAsPromise(() => {
+    return transitionAsPromise(() => {
       Object.assign(this.elems.content.style, {
         width: width + 'px',
         height: height + 'px',
@@ -194,66 +312,25 @@ class Chocolat {
   }
 
   appear(i) {
-    clearTimeout(this.settings.timer);
+    clearTimeout(this.state.timer);
 
     if (!this.elems.loader.classList.contains('chocolat-visible')) {
-      return this.loadImage(this.images[i].src, this.elems.img);
+      return loadImage(this.images[i].src, this.elems.img);
     }
 
-    return this.transitionAsPromise(() => {
+    return transitionAsPromise(() => {
       this.elems.loader.classList.remove('chocolat-visible');
     }, this.elems.loader).then(() => {
-      return this.loadImage(this.images[i].src, this.elems.img);
+      return loadImage(this.images[i].src, this.elems.img);
     });
   }
 
-  fit(image, container) {
-    let height;
-    let width;
-    const imgHeight = image.naturalHeight;
-    const imgWidth = image.naturalWidth;
-    const holderHeight = container.clientHeight;
-    const holderWidth = container.clientWidth;
-    const holderOutMarginH = this.getOutMarginH();
-    const holderOutMarginW = this.getOutMarginW();
-    const holderGlobalWidth = holderWidth - holderOutMarginW;
-    const holderGlobalHeight = holderHeight - holderOutMarginH;
-    const holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
-    const holderRatio = holderHeight / holderWidth;
-    const imgRatio = imgHeight / imgWidth;
-
-    if (this.settings.imageSize == 'cover') {
-      if (imgRatio < holderRatio) {
-        height = holderHeight;
-        width = height / imgRatio;
-      } else {
-        width = holderWidth;
-        height = width * imgRatio;
-      }
-    } else if (this.settings.imageSize == 'native') {
-      height = imgHeight;
-      width = imgWidth;
-    } else {
-      if (imgRatio > holderGlobalRatio) {
-        height = holderGlobalHeight;
-        width = height / imgRatio;
-      } else {
-        width = holderGlobalWidth;
-        height = width * imgRatio;
-      }
-
-      if (this.settings.imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
-        width = imgWidth;
-        height = imgHeight;
-      }
-    }
+  getOutMarginW() {
+    return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
+  }
 
-    return {
-      height: height,
-      width: width,
-      top: (holderHeight - height) / 2,
-      left: (holderWidth - width) / 2
-    };
+  getOutMarginH() {
+    return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
   }
 
   change(step) {
@@ -288,20 +365,20 @@ class Chocolat {
   }
 
   close() {
-    if (this.settings.fullscreenOpen) {
-      this.exitFullScreen();
+    if (this.state.fullScreenOpen) {
+      this.state.fullScreenOpen = exitFullScreen();
       return;
     }
 
     this.settings.currentImageIndex = undefined;
-    const promiseOverlay = this.transitionAsPromise(() => {
+    const promiseOverlay = transitionAsPromise(() => {
       this.elems.overlay.classList.remove('chocolat-visible');
     }, this.elems.overlay);
-    const promiseWrapper = this.transitionAsPromise(() => {
+    const promiseWrapper = transitionAsPromise(() => {
       this.elems.wrapper.classList.remove('chocolat-visible');
     }, this.elems.wrapper);
     return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
-      this.elems.domContainer.classList.remove('chocolat-open');
+      this.elems.container.classList.remove('chocolat-open');
     });
   }
 
@@ -314,43 +391,35 @@ class Chocolat {
       this.off(element, eventName);
     }
 
-    if (!this.settings.initialized) {
+    if (!this.state.initialized) {
       return;
     }
 
-    if (this.settings.fullscreenOpen) {
-      this.exitFullScreen();
+    if (this.state.fullScreenOpen) {
+      this.state.fullScreenOpen = exitFullScreen();
     }
 
     this.settings.currentImageIndex = undefined;
-    this.settings.initialized = false;
-    this.elems.domContainer.classList.remove(...this._cssClasses);
+    this.state.initialized = false;
+    this.elems.container.classList.remove(...this._cssClasses);
     this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
   }
 
-  getOutMarginW() {
-    return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
-  }
-
-  getOutMarginH() {
-    return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
-  }
-
   markup() {
-    this.elems.domContainer.classList.add('chocolat-open', this.settings.className);
+    this.elems.container.classList.add('chocolat-open', this.settings.className);
 
     if (this.settings.imageSize == 'cover') {
-      this.elems.domContainer.classList.add('chocolat-cover');
+      this.elems.container.classList.add('chocolat-cover');
     }
 
-    if (this.settings.container !== window) {
-      this.elems.domContainer.classList.add('chocolat-in-container');
+    if (this.elems.container !== document.body) {
+      this.elems.container.classList.add('chocolat-in-container');
     }
 
     this.elems.wrapper = document.createElement('div');
     this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
     this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
-    this.elems.domContainer.appendChild(this.elems.wrapper);
+    this.elems.container.appendChild(this.elems.wrapper);
     this.elems.overlay = document.createElement('div');
     this.elems.overlay.setAttribute('class', 'chocolat-overlay');
     this.elems.wrapper.appendChild(this.elems.overlay);
@@ -394,48 +463,10 @@ class Chocolat {
     this.settings.afterMarkup.call(this);
   }
 
-  openFullScreen() {
-    const wrapper = this.elems.wrapper;
-
-    if (wrapper.requestFullscreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.requestFullscreen();
-    } else if (wrapper.mozRequestFullScreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.mozRequestFullScreen();
-    } else if (wrapper.webkitRequestFullscreen) {
-      this.settings.fullscreenOpen = true;
-      wrapper.webkitRequestFullscreen();
-    } else if (wrapper.msRequestFullscreen) {
-      wrapper.msRequestFullscreen();
-      this.settings.fullscreenOpen = true;
-    } else {
-      this.settings.fullscreenOpen = false;
-    }
-  }
-
-  exitFullScreen() {
-    if (document.exitFullscreen) {
-      document.exitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.mozCancelFullScreen) {
-      document.mozCancelFullScreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.webkitExitFullscreen) {
-      document.webkitExitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else if (document.msExitFullscreen) {
-      document.msExitFullscreen();
-      this.settings.fullscreenOpen = false;
-    } else {
-      this.settings.fullscreenOpen = true;
-    }
-  }
-
   attachListeners() {
     this.off(document, 'keydown.chocolat');
     this.on(document, 'keydown.chocolat', e => {
-      if (this.settings.initialized) {
+      if (this.state.initialized) {
         if (e.keyCode == 37) {
           this.change(-1);
         } else if (e.keyCode == 39) {
@@ -456,40 +487,34 @@ class Chocolat {
       this.change(-1);
     });
     this.off(this.elems.close, 'click.chocolat');
-    this.on(this.elems.close, 'click.chocolat', () => {
-      this.close();
-    });
+    this.on(this.elems.close, 'click.chocolat', this.close.bind(this));
     this.off(this.elems.fullscreen, 'click.chocolat');
     this.on(this.elems.fullscreen, 'click.chocolat', () => {
-      if (this.settings.fullscreenOpen) {
-        this.exitFullScreen();
+      if (this.state.fullScreenOpen) {
+        this.state.fullScreenOpen = exitFullScreen();
         return;
       }
 
-      this.openFullScreen();
+      this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     });
 
     if (this.settings.backgroundClose) {
       this.off(this.elems.overlay, 'click.chocolat');
-      this.on(this.elems.overlay, 'click.chocolat', e => {
-        this.close();
-      });
+      this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this));
     }
 
     this.off(this.elems.wrapper, 'click.chocolat');
-    this.on(this.elems.wrapper, 'click.chocolat', e => {
-      this.zoomOut(e);
-    });
+    this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this));
     const img = this.elems.wrapper.querySelector('.chocolat-img');
     this.off(img, 'click.chocolat');
     this.on(img, 'click.chocolat', e => {
-      if (this.settings.initialZoomState === null && this.elems.domContainer.classList.contains('chocolat-zoomable')) {
+      if (this.state.initialZoomState === null && this.elems.container.classList.contains('chocolat-zoomable')) {
         e.stopPropagation();
         this.zoomIn(e);
       }
     });
     this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
-      if (this.settings.initialZoomState === null) {
+      if (this.state.initialZoomState === null) {
         return;
       }
 
@@ -527,17 +552,26 @@ class Chocolat {
       this.elems.img.style.marginTop = -mvtY + 'px';
     });
     this.on(window, 'resize.chocolat', e => {
-      if (!this.settings.initialized || this.settings.currentImageIndex === undefined) {
+      if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
         return;
       }
 
-      this.debounce(50, () => {
+      debounce(50, () => {
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          imageSize: this.settings.imageSize
+        };
         const {
           width,
           height,
           left,
           top
-        } = this.fit(this.elems.img, this.elems.wrapper);
+        } = fit(fitOptions);
         this.center(width, height, left, top);
         this.zoomable();
       });
@@ -552,60 +586,61 @@ class Chocolat {
     const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
     if (isImageZoomable && !isImageStretched) {
-      this.elems.domContainer.classList.add('chocolat-zoomable');
+      this.elems.container.classList.add('chocolat-zoomable');
     } else {
-      this.elems.domContainer.classList.remove('chocolat-zoomable');
+      this.elems.container.classList.remove('chocolat-zoomable');
     }
   }
 
   zoomIn(e) {
-    this.settings.initialZoomState = this.settings.imageSize;
+    this.state.initialZoomState = this.settings.imageSize;
     this.settings.imageSize = 'native';
-    this.elems.domContainer.classList.add('chocolat-zoomed');
+    this.elems.container.classList.add('chocolat-zoomed');
+    const fitOptions = {
+      imgHeight: this.elems.img.naturalHeight,
+      imgWidth: this.elems.img.naturalWidth,
+      containerHeight: this.elems.wrapper.clientHeight,
+      containerWidth: this.elems.wrapper.clientWidth,
+      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      imageSize: this.settings.imageSize
+    };
     const {
       width,
       height,
       left,
       top
-    } = this.fit(this.elems.img, this.elems.wrapper);
+    } = fit(fitOptions);
     return this.center(width, height, left, top);
   }
 
   zoomOut(e) {
-    if (this.settings.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+    if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
       return;
     }
 
-    this.settings.imageSize = this.settings.initialZoomState;
-    this.settings.initialZoomState = null;
+    this.settings.imageSize = this.state.initialZoomState;
+    this.state.initialZoomState = null;
     this.elems.img.style.margin = 0;
-    this.elems.domContainer.classList.remove('chocolat-zoomed');
+    this.elems.container.classList.remove('chocolat-zoomed');
+    const fitOptions = {
+      imgHeight: this.elems.img.naturalHeight,
+      imgWidth: this.elems.img.naturalWidth,
+      containerHeight: this.elems.wrapper.clientHeight,
+      containerWidth: this.elems.wrapper.clientWidth,
+      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      imageSize: this.settings.imageSize
+    };
     const {
       width,
       height,
       left,
       top
-    } = this.fit(this.elems.img, this.elems.wrapper);
+    } = fit(fitOptions);
     return this.center(width, height, left, top);
   }
 
-  setDomContainer() {
-    // if container == window
-    // domContainer = body
-    if (this.settings.container === window) {
-      this.elems.domContainer = document.body;
-    } else {
-      this.elems.domContainer = this.settings.container;
-    }
-  }
-
-  debounce(duration, callback) {
-    clearTimeout(this.settings.timerDebounce);
-    this.settings.timerDebounce = setTimeout(function () {
-      callback();
-    }, duration);
-  }
-
   on(element, eventName, cb) {
     // const eventName = this.settings.setIndex + '-' + eventName
     const length = this.events.push({
@@ -614,7 +649,6 @@ class Chocolat {
       cb
     });
     element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
-    return this;
   }
 
   off(element, eventName) {
@@ -627,26 +661,6 @@ class Chocolat {
       element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
       this.events.splice(index, 1);
     }
-
-    return this;
-  }
-
-  transitionAsPromise(triggeringFunc, el) {
-    return new Promise(resolve => {
-      const handleTransitionEnd = () => {
-        el.removeEventListener('transitionend', handleTransitionEnd);
-        resolve();
-      };
-
-      el.addEventListener('transitionend', handleTransitionEnd);
-      const classesBefore = el.getAttribute('class');
-      const stylesBefore = el.getAttribute('style');
-      triggeringFunc();
-
-      if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
-        handleTransitionEnd();
-      }
-    });
   }
 
 }
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 244bd26..7f4e42b 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -1,23 +1,134 @@
 (function () {
     'use strict';
 
+    let timerDebounce = undefined;
+    function debounce(duration, callback) {
+      clearTimeout(timerDebounce);
+      timerDebounce = setTimeout(function () {
+        callback();
+      }, duration);
+      return timerDebounce;
+    }
+    function transitionAsPromise(triggeringFunc, el) {
+      return new Promise(resolve => {
+        const handleTransitionEnd = () => {
+          el.removeEventListener('transitionend', handleTransitionEnd);
+          resolve();
+        };
+
+        el.addEventListener('transitionend', handleTransitionEnd);
+        const classesBefore = el.getAttribute('class');
+        const stylesBefore = el.getAttribute('style');
+        triggeringFunc();
+
+        if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
+          handleTransitionEnd();
+        }
+      });
+    }
+    function loadImage(src, image) {
+      if ('decode' in image) {
+        image.src = src;
+        return image.decode();
+      } else {
+        return new Promise(function (resolve, reject) {
+          image.onload = resolve;
+          image.onerror = resolve;
+          image.src = src;
+        });
+      }
+    }
+    function fit(options) {
+      let height;
+      let width;
+      const {
+        imgHeight,
+        imgWidth,
+        containerHeight,
+        containerWidth,
+        containerGlobalWidth,
+        containerGlobalHeight,
+        imageSize
+      } = options;
+      const containerGlobalRatio = containerGlobalHeight / containerGlobalWidth;
+      const containerRatio = containerHeight / containerWidth;
+      const imgRatio = imgHeight / imgWidth;
+
+      if (imageSize == 'cover') {
+        if (imgRatio < containerRatio) {
+          height = containerHeight;
+          width = height / imgRatio;
+        } else {
+          width = containerWidth;
+          height = width * imgRatio;
+        }
+      } else if (imageSize == 'native') {
+        height = imgHeight;
+        width = imgWidth;
+      } else {
+        if (imgRatio > containerGlobalRatio) {
+          height = containerGlobalHeight;
+          width = height / imgRatio;
+        } else {
+          width = containerGlobalWidth;
+          height = width * imgRatio;
+        }
+
+        if (imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
+          width = imgWidth;
+          height = imgHeight;
+        }
+      }
+
+      return {
+        height: height,
+        width: width,
+        top: (containerHeight - height) / 2,
+        left: (containerWidth - width) / 2
+      };
+    }
+    function openFullScreen(wrapper) {
+      if (wrapper.requestFullscreen) {
+        wrapper.requestFullscreen();
+        return true;
+      } else if (wrapper.webkitRequestFullscreen) {
+        wrapper.webkitRequestFullscreen();
+        return true;
+      } else if (wrapper.msRequestFullscreen) {
+        wrapper.msRequestFullscreen();
+        return true;
+      } else {
+        return false;
+      }
+    }
+    function exitFullScreen() {
+      if (document.exitFullscreen) {
+        document.exitFullscreen();
+        return false;
+      } else if (document.webkitExitFullscreen) {
+        document.webkitExitFullscreen();
+        return false;
+      } else if (document.msExitFullscreen) {
+        document.msExitFullscreen();
+        return false;
+      } else {
+        return true;
+      }
+    }
+
     const defaults = {
-      container: window,
+      container: document.body,
       // window or element
       className: undefined,
       imageSize: 'scale-down',
       // 'scale-down', 'contain', 'cover' or 'native'
-      initialZoomState: null,
-      allowFullScreen: false,
+      fullScreen: false,
       loop: false,
       linkImages: true,
       setIndex: 0,
       firstImageIndex: 0,
       lastImageIndex: false,
       currentImageIndex: undefined,
-      initialized: false,
-      timer: false,
-      timerDebounce: false,
       allowZoom: true,
       setTitle: function () {
         return '';
@@ -50,6 +161,12 @@
         this.elems = {};
         this.images = [];
         this.events = [];
+        this.state = {
+          fullScreenOpen: false,
+          initialZoomState: null,
+          initialized: false,
+          timer: false
+        };
         this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
 
         if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
@@ -70,6 +187,12 @@
           this.images = elements;
         }
 
+        if (this.settings.container instanceof Element || this.settings.container instanceof HTMLElement) {
+          this.elems.container = this.settings.container;
+        } else {
+          this.elems.container = document.body;
+        }
+
         this.api = {
           open: i => {
             i = parseInt(i) || 0;
@@ -110,34 +233,20 @@
       }
 
       init(i) {
-        if (!this.settings.initialized) {
-          this.setDomContainer();
+        if (!this.state.initialized) {
           this.markup();
           this.attachListeners();
           this.settings.lastImageIndex = this.images.length - 1;
-          this.settings.initialized = true;
+          this.state.initialized = true;
         }
 
         this.settings.afterInitialize.call(this);
         return this.load(i);
       }
 
-      loadImage(src, image) {
-        if ('decode' in image) {
-          image.src = src;
-          return image.decode();
-        } else {
-          return new Promise(function (resolve, reject) {
-            image.onload = resolve;
-            image.onerror = resolve;
-            image.src = src;
-          });
-        }
-      }
-
       load(i) {
-        if (this.settings.allowFullScreen) {
-          this.openFullScreen();
+        if (this.settings.fullScreen) {
+          this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
         }
 
         if (this.settings.currentImageIndex === i) {
@@ -148,18 +257,18 @@
           this.elems.overlay.classList.add('chocolat-visible');
           this.elems.wrapper.classList.add('chocolat-visible');
         }, 0);
-        this.elems.domContainer.classList.add('chocolat-open');
-        this.settings.timer = setTimeout(() => {
+        this.elems.container.classList.add('chocolat-open');
+        this.state.timer = setTimeout(() => {
           if (this.elems !== undefined) {
             this.elems.loader.classList.add('chocolat-visible');
           }
         }, 300);
         const imgLoader = new Image();
-        return this.loadImage(this.images[i].src, imgLoader).then(() => {
+        return loadImage(this.images[i].src, imgLoader).then(() => {
           const nextIndex = i + 1;
 
           if (this.images[nextIndex] != undefined) {
-            this.loadImage(this.images[nextIndex].src, new Image());
+            loadImage(this.images[nextIndex].src, new Image());
           }
 
           this.settings.currentImageIndex = i;
@@ -176,17 +285,26 @@
         this.elems.description.textContent = this.settings.description.call(this);
         this.elems.pagination.textContent = this.settings.pagination.call(this);
         this.arrows();
+        const fitOptions = {
+          imgHeight: image.naturalHeight,
+          imgWidth: image.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          imageSize: this.settings.imageSize
+        };
         const {
           width,
           height,
           left,
           top
-        } = this.fit(image, this.elems.wrapper);
+        } = fit(fitOptions);
         return this.center(width, height, left, top);
       }
 
       center(width, height, left, top) {
-        return this.transitionAsPromise(() => {
+        return transitionAsPromise(() => {
           Object.assign(this.elems.content.style, {
             width: width + 'px',
             height: height + 'px',
@@ -197,66 +315,25 @@
       }
 
       appear(i) {
-        clearTimeout(this.settings.timer);
+        clearTimeout(this.state.timer);
 
         if (!this.elems.loader.classList.contains('chocolat-visible')) {
-          return this.loadImage(this.images[i].src, this.elems.img);
+          return loadImage(this.images[i].src, this.elems.img);
         }
 
-        return this.transitionAsPromise(() => {
+        return transitionAsPromise(() => {
           this.elems.loader.classList.remove('chocolat-visible');
         }, this.elems.loader).then(() => {
-          return this.loadImage(this.images[i].src, this.elems.img);
+          return loadImage(this.images[i].src, this.elems.img);
         });
       }
 
-      fit(image, container) {
-        let height;
-        let width;
-        const imgHeight = image.naturalHeight;
-        const imgWidth = image.naturalWidth;
-        const holderHeight = container.clientHeight;
-        const holderWidth = container.clientWidth;
-        const holderOutMarginH = this.getOutMarginH();
-        const holderOutMarginW = this.getOutMarginW();
-        const holderGlobalWidth = holderWidth - holderOutMarginW;
-        const holderGlobalHeight = holderHeight - holderOutMarginH;
-        const holderGlobalRatio = holderGlobalHeight / holderGlobalWidth;
-        const holderRatio = holderHeight / holderWidth;
-        const imgRatio = imgHeight / imgWidth;
-
-        if (this.settings.imageSize == 'cover') {
-          if (imgRatio < holderRatio) {
-            height = holderHeight;
-            width = height / imgRatio;
-          } else {
-            width = holderWidth;
-            height = width * imgRatio;
-          }
-        } else if (this.settings.imageSize == 'native') {
-          height = imgHeight;
-          width = imgWidth;
-        } else {
-          if (imgRatio > holderGlobalRatio) {
-            height = holderGlobalHeight;
-            width = height / imgRatio;
-          } else {
-            width = holderGlobalWidth;
-            height = width * imgRatio;
-          }
-
-          if (this.settings.imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
-            width = imgWidth;
-            height = imgHeight;
-          }
-        }
+      getOutMarginW() {
+        return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
+      }
 
-        return {
-          height: height,
-          width: width,
-          top: (holderHeight - height) / 2,
-          left: (holderWidth - width) / 2
-        };
+      getOutMarginH() {
+        return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
       }
 
       change(step) {
@@ -291,20 +368,20 @@
       }
 
       close() {
-        if (this.settings.fullscreenOpen) {
-          this.exitFullScreen();
+        if (this.state.fullScreenOpen) {
+          this.state.fullScreenOpen = exitFullScreen();
           return;
         }
 
         this.settings.currentImageIndex = undefined;
-        const promiseOverlay = this.transitionAsPromise(() => {
+        const promiseOverlay = transitionAsPromise(() => {
           this.elems.overlay.classList.remove('chocolat-visible');
         }, this.elems.overlay);
-        const promiseWrapper = this.transitionAsPromise(() => {
+        const promiseWrapper = transitionAsPromise(() => {
           this.elems.wrapper.classList.remove('chocolat-visible');
         }, this.elems.wrapper);
         return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
-          this.elems.domContainer.classList.remove('chocolat-open');
+          this.elems.container.classList.remove('chocolat-open');
         });
       }
 
@@ -317,43 +394,35 @@
           this.off(element, eventName);
         }
 
-        if (!this.settings.initialized) {
+        if (!this.state.initialized) {
           return;
         }
 
-        if (this.settings.fullscreenOpen) {
-          this.exitFullScreen();
+        if (this.state.fullScreenOpen) {
+          this.state.fullScreenOpen = exitFullScreen();
         }
 
         this.settings.currentImageIndex = undefined;
-        this.settings.initialized = false;
-        this.elems.domContainer.classList.remove(...this._cssClasses);
+        this.state.initialized = false;
+        this.elems.container.classList.remove(...this._cssClasses);
         this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
       }
 
-      getOutMarginW() {
-        return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
-      }
-
-      getOutMarginH() {
-        return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
-      }
-
       markup() {
-        this.elems.domContainer.classList.add('chocolat-open', this.settings.className);
+        this.elems.container.classList.add('chocolat-open', this.settings.className);
 
         if (this.settings.imageSize == 'cover') {
-          this.elems.domContainer.classList.add('chocolat-cover');
+          this.elems.container.classList.add('chocolat-cover');
         }
 
-        if (this.settings.container !== window) {
-          this.elems.domContainer.classList.add('chocolat-in-container');
+        if (this.elems.container !== document.body) {
+          this.elems.container.classList.add('chocolat-in-container');
         }
 
         this.elems.wrapper = document.createElement('div');
         this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
         this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
-        this.elems.domContainer.appendChild(this.elems.wrapper);
+        this.elems.container.appendChild(this.elems.wrapper);
         this.elems.overlay = document.createElement('div');
         this.elems.overlay.setAttribute('class', 'chocolat-overlay');
         this.elems.wrapper.appendChild(this.elems.overlay);
@@ -397,48 +466,10 @@
         this.settings.afterMarkup.call(this);
       }
 
-      openFullScreen() {
-        const wrapper = this.elems.wrapper;
-
-        if (wrapper.requestFullscreen) {
-          this.settings.fullscreenOpen = true;
-          wrapper.requestFullscreen();
-        } else if (wrapper.mozRequestFullScreen) {
-          this.settings.fullscreenOpen = true;
-          wrapper.mozRequestFullScreen();
-        } else if (wrapper.webkitRequestFullscreen) {
-          this.settings.fullscreenOpen = true;
-          wrapper.webkitRequestFullscreen();
-        } else if (wrapper.msRequestFullscreen) {
-          wrapper.msRequestFullscreen();
-          this.settings.fullscreenOpen = true;
-        } else {
-          this.settings.fullscreenOpen = false;
-        }
-      }
-
-      exitFullScreen() {
-        if (document.exitFullscreen) {
-          document.exitFullscreen();
-          this.settings.fullscreenOpen = false;
-        } else if (document.mozCancelFullScreen) {
-          document.mozCancelFullScreen();
-          this.settings.fullscreenOpen = false;
-        } else if (document.webkitExitFullscreen) {
-          document.webkitExitFullscreen();
-          this.settings.fullscreenOpen = false;
-        } else if (document.msExitFullscreen) {
-          document.msExitFullscreen();
-          this.settings.fullscreenOpen = false;
-        } else {
-          this.settings.fullscreenOpen = true;
-        }
-      }
-
       attachListeners() {
         this.off(document, 'keydown.chocolat');
         this.on(document, 'keydown.chocolat', e => {
-          if (this.settings.initialized) {
+          if (this.state.initialized) {
             if (e.keyCode == 37) {
               this.change(-1);
             } else if (e.keyCode == 39) {
@@ -459,40 +490,34 @@
           this.change(-1);
         });
         this.off(this.elems.close, 'click.chocolat');
-        this.on(this.elems.close, 'click.chocolat', () => {
-          this.close();
-        });
+        this.on(this.elems.close, 'click.chocolat', this.close.bind(this));
         this.off(this.elems.fullscreen, 'click.chocolat');
         this.on(this.elems.fullscreen, 'click.chocolat', () => {
-          if (this.settings.fullscreenOpen) {
-            this.exitFullScreen();
+          if (this.state.fullScreenOpen) {
+            this.state.fullScreenOpen = exitFullScreen();
             return;
           }
 
-          this.openFullScreen();
+          this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
         });
 
         if (this.settings.backgroundClose) {
           this.off(this.elems.overlay, 'click.chocolat');
-          this.on(this.elems.overlay, 'click.chocolat', e => {
-            this.close();
-          });
+          this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this));
         }
 
         this.off(this.elems.wrapper, 'click.chocolat');
-        this.on(this.elems.wrapper, 'click.chocolat', e => {
-          this.zoomOut(e);
-        });
+        this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this));
         const img = this.elems.wrapper.querySelector('.chocolat-img');
         this.off(img, 'click.chocolat');
         this.on(img, 'click.chocolat', e => {
-          if (this.settings.initialZoomState === null && this.elems.domContainer.classList.contains('chocolat-zoomable')) {
+          if (this.state.initialZoomState === null && this.elems.container.classList.contains('chocolat-zoomable')) {
             e.stopPropagation();
             this.zoomIn(e);
           }
         });
         this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
-          if (this.settings.initialZoomState === null) {
+          if (this.state.initialZoomState === null) {
             return;
           }
 
@@ -530,17 +555,26 @@
           this.elems.img.style.marginTop = -mvtY + 'px';
         });
         this.on(window, 'resize.chocolat', e => {
-          if (!this.settings.initialized || this.settings.currentImageIndex === undefined) {
+          if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
             return;
           }
 
-          this.debounce(50, () => {
+          debounce(50, () => {
+            const fitOptions = {
+              imgHeight: this.elems.img.naturalHeight,
+              imgWidth: this.elems.img.naturalWidth,
+              containerHeight: this.elems.wrapper.clientHeight,
+              containerWidth: this.elems.wrapper.clientWidth,
+              containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+              containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+              imageSize: this.settings.imageSize
+            };
             const {
               width,
               height,
               left,
               top
-            } = this.fit(this.elems.img, this.elems.wrapper);
+            } = fit(fitOptions);
             this.center(width, height, left, top);
             this.zoomable();
           });
@@ -555,60 +589,61 @@
         const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
 
         if (isImageZoomable && !isImageStretched) {
-          this.elems.domContainer.classList.add('chocolat-zoomable');
+          this.elems.container.classList.add('chocolat-zoomable');
         } else {
-          this.elems.domContainer.classList.remove('chocolat-zoomable');
+          this.elems.container.classList.remove('chocolat-zoomable');
         }
       }
 
       zoomIn(e) {
-        this.settings.initialZoomState = this.settings.imageSize;
+        this.state.initialZoomState = this.settings.imageSize;
         this.settings.imageSize = 'native';
-        this.elems.domContainer.classList.add('chocolat-zoomed');
+        this.elems.container.classList.add('chocolat-zoomed');
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          imageSize: this.settings.imageSize
+        };
         const {
           width,
           height,
           left,
           top
-        } = this.fit(this.elems.img, this.elems.wrapper);
+        } = fit(fitOptions);
         return this.center(width, height, left, top);
       }
 
       zoomOut(e) {
-        if (this.settings.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+        if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
           return;
         }
 
-        this.settings.imageSize = this.settings.initialZoomState;
-        this.settings.initialZoomState = null;
+        this.settings.imageSize = this.state.initialZoomState;
+        this.state.initialZoomState = null;
         this.elems.img.style.margin = 0;
-        this.elems.domContainer.classList.remove('chocolat-zoomed');
+        this.elems.container.classList.remove('chocolat-zoomed');
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          imageSize: this.settings.imageSize
+        };
         const {
           width,
           height,
           left,
           top
-        } = this.fit(this.elems.img, this.elems.wrapper);
+        } = fit(fitOptions);
         return this.center(width, height, left, top);
       }
 
-      setDomContainer() {
-        // if container == window
-        // domContainer = body
-        if (this.settings.container === window) {
-          this.elems.domContainer = document.body;
-        } else {
-          this.elems.domContainer = this.settings.container;
-        }
-      }
-
-      debounce(duration, callback) {
-        clearTimeout(this.settings.timerDebounce);
-        this.settings.timerDebounce = setTimeout(function () {
-          callback();
-        }, duration);
-      }
-
       on(element, eventName, cb) {
         // const eventName = this.settings.setIndex + '-' + eventName
         const length = this.events.push({
@@ -617,7 +652,6 @@
           cb
         });
         element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
-        return this;
       }
 
       off(element, eventName) {
@@ -630,26 +664,6 @@
           element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
           this.events.splice(index, 1);
         }
-
-        return this;
-      }
-
-      transitionAsPromise(triggeringFunc, el) {
-        return new Promise(resolve => {
-          const handleTransitionEnd = () => {
-            el.removeEventListener('transitionend', handleTransitionEnd);
-            resolve();
-          };
-
-          el.addEventListener('transitionend', handleTransitionEnd);
-          const classesBefore = el.getAttribute('class');
-          const stylesBefore = el.getAttribute('style');
-          triggeringFunc();
-
-          if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
-            handleTransitionEnd();
-          }
-        });
       }
 
     }
diff --git a/src/css/chocolat.css b/src/css/chocolat.css
index 1d4114c..27e0204 100644
--- a/src/css/chocolat.css
+++ b/src/css/chocolat.css
@@ -192,6 +192,10 @@ body.chocolat-open>.chocolat-content{
     position: relative;
 }
 
+.chocolat-zoomable.chocolat-zoomed .chocolat-img{
+    transition: margin 0s ease;
+}
+
 /* uncomment to hide controls when zoomed-in*/
 /*
 .chocolat-zoomable .chocolat-top,
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 3c66f7a..fed6380 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -1,18 +1,23 @@
+import {
+    debounce,
+    transitionAsPromise,
+    loadImage,
+    fit,
+    openFullScreen,
+    exitFullScreen,
+} from './utils.js'
+
 export const defaults = {
-    container: window, // window or element
+    container: document.body, // window or element
     className: undefined,
     imageSize: 'scale-down', // 'scale-down', 'contain', 'cover' or 'native'
-    initialZoomState: null,
-    allowFullScreen: false,
+    fullScreen: false,
     loop: false,
     linkImages: true,
     setIndex: 0,
     firstImageIndex: 0,
     lastImageIndex: false,
     currentImageIndex: undefined,
-    initialized: false,
-    timer: false,
-    timerDebounce: false,
     allowZoom: true,
     setTitle: function() {
         return ''
@@ -43,6 +48,12 @@ export class Chocolat {
         this.elems = {}
         this.images = []
         this.events = []
+        this.state = {
+            fullScreenOpen: false,
+            initialZoomState: null,
+            initialized: false,
+            timer: false,
+        }
 
         this._cssClasses = [
             'chocolat-open',
@@ -74,6 +85,15 @@ export class Chocolat {
             this.images = elements
         }
 
+        if (
+            this.settings.container instanceof Element ||
+            this.settings.container instanceof HTMLElement
+        ) {
+            this.elems.container = this.settings.container
+        } else {
+            this.elems.container = document.body
+        }
+
         this.api = {
             open: (i) => {
                 i = parseInt(i) || 0
@@ -124,12 +144,11 @@ export class Chocolat {
     }
 
     init(i) {
-        if (!this.settings.initialized) {
-            this.setDomContainer()
+        if (!this.state.initialized) {
             this.markup()
             this.attachListeners()
             this.settings.lastImageIndex = this.images.length - 1
-            this.settings.initialized = true
+            this.state.initialized = true
         }
 
         this.settings.afterInitialize.call(this)
@@ -137,22 +156,9 @@ export class Chocolat {
         return this.load(i)
     }
 
-    loadImage(src, image) {
-        if ('decode' in image) {
-            image.src = src
-            return image.decode()
-        } else {
-            return new Promise(function(resolve, reject) {
-                image.onload = resolve
-                image.onerror = resolve
-                image.src = src
-            })
-        }
-    }
-
     load(i) {
-        if (this.settings.allowFullScreen) {
-            this.openFullScreen()
+        if (this.settings.fullScreen) {
+            this.state.fullScreenOpen = openFullScreen(this.elems.wrapper)
         }
 
         if (this.settings.currentImageIndex === i) {
@@ -164,9 +170,9 @@ export class Chocolat {
             this.elems.wrapper.classList.add('chocolat-visible')
         }, 0)
 
-        this.elems.domContainer.classList.add('chocolat-open')
+        this.elems.container.classList.add('chocolat-open')
 
-        this.settings.timer = setTimeout(() => {
+        this.state.timer = setTimeout(() => {
             if (this.elems !== undefined) {
                 this.elems.loader.classList.add('chocolat-visible')
             }
@@ -174,11 +180,11 @@ export class Chocolat {
 
         const imgLoader = new Image()
 
-        return this.loadImage(this.images[i].src, imgLoader)
+        return loadImage(this.images[i].src, imgLoader)
             .then(() => {
                 const nextIndex = i + 1
                 if (this.images[nextIndex] != undefined) {
-                    this.loadImage(this.images[nextIndex].src, new Image())
+                    loadImage(this.images[nextIndex].src, new Image())
                 }
 
                 this.settings.currentImageIndex = i
@@ -198,12 +204,22 @@ export class Chocolat {
         this.elems.pagination.textContent = this.settings.pagination.call(this)
         this.arrows()
 
-        const { width, height, left, top } = this.fit(image, this.elems.wrapper)
+        const fitOptions = {
+            imgHeight: image.naturalHeight,
+            imgWidth: image.naturalWidth,
+            containerHeight: this.elems.wrapper.clientHeight,
+            containerWidth: this.elems.wrapper.clientWidth,
+            containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+            containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+            imageSize: this.settings.imageSize,
+        }
+
+        const { width, height, left, top } = fit(fitOptions)
         return this.center(width, height, left, top)
     }
 
     center(width, height, left, top) {
-        return this.transitionAsPromise(() => {
+        return transitionAsPromise(() => {
             Object.assign(this.elems.content.style, {
                 width: width + 'px',
                 height: height + 'px',
@@ -214,70 +230,25 @@ export class Chocolat {
     }
 
     appear(i) {
-        clearTimeout(this.settings.timer)
+        clearTimeout(this.state.timer)
 
         if (!this.elems.loader.classList.contains('chocolat-visible')) {
-            return this.loadImage(this.images[i].src, this.elems.img)
+            return loadImage(this.images[i].src, this.elems.img)
         }
 
-        return this.transitionAsPromise(() => {
+        return transitionAsPromise(() => {
             this.elems.loader.classList.remove('chocolat-visible')
         }, this.elems.loader).then(() => {
-            return this.loadImage(this.images[i].src, this.elems.img)
+            return loadImage(this.images[i].src, this.elems.img)
         })
     }
 
-    fit(image, container) {
-        let height
-        let width
-
-        const imgHeight = image.naturalHeight
-        const imgWidth = image.naturalWidth
-        const holderHeight = container.clientHeight
-        const holderWidth = container.clientWidth
-        const holderOutMarginH = this.getOutMarginH()
-        const holderOutMarginW = this.getOutMarginW()
-
-        const holderGlobalWidth = holderWidth - holderOutMarginW
-        const holderGlobalHeight = holderHeight - holderOutMarginH
-        const holderGlobalRatio = holderGlobalHeight / holderGlobalWidth
-        const holderRatio = holderHeight / holderWidth
-        const imgRatio = imgHeight / imgWidth
-
-        if (this.settings.imageSize == 'cover') {
-            if (imgRatio < holderRatio) {
-                height = holderHeight
-                width = height / imgRatio
-            } else {
-                width = holderWidth
-                height = width * imgRatio
-            }
-        } else if (this.settings.imageSize == 'native') {
-            height = imgHeight
-            width = imgWidth
-        } else {
-            if (imgRatio > holderGlobalRatio) {
-                height = holderGlobalHeight
-                width = height / imgRatio
-            } else {
-                width = holderGlobalWidth
-                height = width * imgRatio
-            }
-            if (
-                this.settings.imageSize === 'scale-down' &&
-                (width >= imgWidth || height >= imgHeight)
-            ) {
-                width = imgWidth
-                height = imgHeight
-            }
-        }
+    getOutMarginW() {
+        return this.elems.left.offsetWidth + this.elems.right.offsetWidth
+    }
 
-        return {
-            height: height,
-            width: width,
-            top: (holderHeight - height) / 2,
-            left: (holderWidth - width) / 2,
-        }
+    getOutMarginH() {
+        return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight
     }
 
     change(step) {
@@ -318,23 +289,23 @@ export class Chocolat {
     }
 
     close() {
-        if (this.settings.fullscreenOpen) {
-            this.exitFullScreen()
+        if (this.state.fullScreenOpen) {
+            this.state.fullScreenOpen = exitFullScreen()
             return
         }
 
         this.settings.currentImageIndex = undefined
 
-        const promiseOverlay = this.transitionAsPromise(() => {
+        const promiseOverlay = transitionAsPromise(() => {
             this.elems.overlay.classList.remove('chocolat-visible')
         }, this.elems.overlay)
 
-        const promiseWrapper = this.transitionAsPromise(() => {
+        const promiseWrapper = transitionAsPromise(() => {
             this.elems.wrapper.classList.remove('chocolat-visible')
         }, this.elems.wrapper)
 
         return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
-            this.elems.domContainer.classList.remove('chocolat-open')
+            this.elems.container.classList.remove('chocolat-open')
         })
     }
 
@@ -344,40 +315,32 @@ export class Chocolat {
             this.off(element, eventName)
         }
 
-        if (!this.settings.initialized) {
+        if (!this.state.initialized) {
             return
         }
-        if (this.settings.fullscreenOpen) {
-            this.exitFullScreen()
+        if (this.state.fullScreenOpen) {
+            this.state.fullScreenOpen = exitFullScreen()
         }
         this.settings.currentImageIndex = undefined
-        this.settings.initialized = false
+        this.state.initialized = false
 
-        this.elems.domContainer.classList.remove(...this._cssClasses)
+        this.elems.container.classList.remove(...this._cssClasses)
         this.elems.wrapper.parentNode.removeChild(this.elems.wrapper)
     }
 
-    getOutMarginW() {
-        return this.elems.left.offsetWidth + this.elems.right.offsetWidth
-    }
-
-    getOutMarginH() {
-        return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight
-    }
-
     markup() {
-        this.elems.domContainer.classList.add('chocolat-open', this.settings.className)
+        this.elems.container.classList.add('chocolat-open', this.settings.className)
         if (this.settings.imageSize == 'cover') {
-            this.elems.domContainer.classList.add('chocolat-cover')
+            this.elems.container.classList.add('chocolat-cover')
         }
-        if (this.settings.container !== window) {
-            this.elems.domContainer.classList.add('chocolat-in-container')
+        if (this.elems.container !== document.body) {
+            this.elems.container.classList.add('chocolat-in-container')
         }
 
         this.elems.wrapper = document.createElement('div')
         this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex)
         this.elems.wrapper.setAttribute('class', 'chocolat-wrapper')
-        this.elems.domContainer.appendChild(this.elems.wrapper)
+        this.elems.container.appendChild(this.elems.wrapper)
 
         this.elems.overlay = document.createElement('div')
         this.elems.overlay.setAttribute('class', 'chocolat-overlay')
@@ -435,48 +398,10 @@ export class Chocolat {
         this.settings.afterMarkup.call(this)
     }
 
-    openFullScreen() {
-        const wrapper = this.elems.wrapper
-
-        if (wrapper.requestFullscreen) {
-            this.settings.fullscreenOpen = true
-            wrapper.requestFullscreen()
-        } else if (wrapper.mozRequestFullScreen) {
-            this.settings.fullscreenOpen = true
-            wrapper.mozRequestFullScreen()
-        } else if (wrapper.webkitRequestFullscreen) {
-            this.settings.fullscreenOpen = true
-            wrapper.webkitRequestFullscreen()
-        } else if (wrapper.msRequestFullscreen) {
-            wrapper.msRequestFullscreen()
-            this.settings.fullscreenOpen = true
-        } else {
-            this.settings.fullscreenOpen = false
-        }
-    }
-
-    exitFullScreen() {
-        if (document.exitFullscreen) {
-            document.exitFullscreen()
-            this.settings.fullscreenOpen = false
-        } else if (document.mozCancelFullScreen) {
-            document.mozCancelFullScreen()
-            this.settings.fullscreenOpen = false
-        } else if (document.webkitExitFullscreen) {
-            document.webkitExitFullscreen()
-            this.settings.fullscreenOpen = false
-        } else if (document.msExitFullscreen) {
-            document.msExitFullscreen()
-            this.settings.fullscreenOpen = false
-        } else {
-            this.settings.fullscreenOpen = true
-        }
-    }
-
     attachListeners() {
         this.off(document, 'keydown.chocolat')
         this.on(document, 'keydown.chocolat', (e) => {
-            if (this.settings.initialized) {
+            if (this.state.initialized) {
                 if (e.keyCode == 37) {
                     this.change(-1)
                 } else if (e.keyCode == 39) {
@@ -500,38 +425,32 @@ export class Chocolat {
         })
 
         this.off(this.elems.close, 'click.chocolat')
-        this.on(this.elems.close, 'click.chocolat', () => {
-            this.close()
-        })
+        this.on(this.elems.close, 'click.chocolat', this.close.bind(this))
 
         this.off(this.elems.fullscreen, 'click.chocolat')
         this.on(this.elems.fullscreen, 'click.chocolat', () => {
-            if (this.settings.fullscreenOpen) {
-                this.exitFullScreen()
+            if (this.state.fullScreenOpen) {
+                this.state.fullScreenOpen = exitFullScreen()
                 return
             }
 
-            this.openFullScreen()
+            this.state.fullScreenOpen = openFullScreen(this.elems.wrapper)
         })
 
         if (this.settings.backgroundClose) {
             this.off(this.elems.overlay, 'click.chocolat')
-            this.on(this.elems.overlay, 'click.chocolat', (e) => {
-                this.close()
-            })
+            this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this))
         }
 
         this.off(this.elems.wrapper, 'click.chocolat')
-        this.on(this.elems.wrapper, 'click.chocolat', (e) => {
-            this.zoomOut(e)
-        })
+        this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this))
 
         const img = this.elems.wrapper.querySelector('.chocolat-img')
         this.off(img, 'click.chocolat')
         this.on(img, 'click.chocolat', (e) => {
             if (
-                this.settings.initialZoomState === null &&
-                this.elems.domContainer.classList.contains('chocolat-zoomable')
+                this.state.initialZoomState === null &&
+                this.elems.container.classList.contains('chocolat-zoomable')
             ) {
                 e.stopPropagation()
                 this.zoomIn(e)
@@ -539,7 +458,7 @@ export class Chocolat {
         })
 
         this.on(this.elems.wrapper, 'mousemove.chocolat', (e) => {
-            if (this.settings.initialZoomState === null) {
+            if (this.state.initialZoomState === null) {
                 return
             }
 
@@ -580,11 +499,21 @@ export class Chocolat {
         })
 
         this.on(window, 'resize.chocolat', (e) => {
-            if (!this.settings.initialized || this.settings.currentImageIndex === undefined) {
+            if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
                 return
             }
-            this.debounce(50, () => {
-                const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
+            debounce(50, () => {
+                const fitOptions = {
+                    imgHeight: this.elems.img.naturalHeight,
+                    imgWidth: this.elems.img.naturalWidth,
+                    containerHeight: this.elems.wrapper.clientHeight,
+                    containerWidth: this.elems.wrapper.clientWidth,
+                    containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+                    containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+                    imageSize: this.settings.imageSize,
+                }
+
+                const { width, height, left, top } = fit(fitOptions)
 
                 this.center(width, height, left, top)
                 this.zoomable()
@@ -608,53 +537,54 @@ export class Chocolat {
             this.elems.img.clientHeight > this.elems.img.naturalHeight
 
         if (isImageZoomable && !isImageStretched) {
-            this.elems.domContainer.classList.add('chocolat-zoomable')
+            this.elems.container.classList.add('chocolat-zoomable')
         } else {
-            this.elems.domContainer.classList.remove('chocolat-zoomable')
+            this.elems.container.classList.remove('chocolat-zoomable')
         }
     }
 
     zoomIn(e) {
-        this.settings.initialZoomState = this.settings.imageSize
+        this.state.initialZoomState = this.settings.imageSize
         this.settings.imageSize = 'native'
 
-        this.elems.domContainer.classList.add('chocolat-zoomed')
-        const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
+        this.elems.container.classList.add('chocolat-zoomed')
+
+        const fitOptions = {
+            imgHeight: this.elems.img.naturalHeight,
+            imgWidth: this.elems.img.naturalWidth,
+            containerHeight: this.elems.wrapper.clientHeight,
+            containerWidth: this.elems.wrapper.clientWidth,
+            containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+            containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+            imageSize: this.settings.imageSize,
+        }
 
+        const { width, height, left, top } = fit(fitOptions)
         return this.center(width, height, left, top)
     }
 
     zoomOut(e) {
-        if (
-            this.settings.initialZoomState === null ||
-            this.settings.currentImageIndex === undefined
-        ) {
+        if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
             return
         }
-        this.settings.imageSize = this.settings.initialZoomState
-        this.settings.initialZoomState = null
+        this.settings.imageSize = this.state.initialZoomState
+        this.state.initialZoomState = null
         this.elems.img.style.margin = 0
 
-        this.elems.domContainer.classList.remove('chocolat-zoomed')
-        const { width, height, left, top } = this.fit(this.elems.img, this.elems.wrapper)
-        return this.center(width, height, left, top)
-    }
+        this.elems.container.classList.remove('chocolat-zoomed')
 
-    setDomContainer() {
-        // if container == window
-        // domContainer = body
-        if (this.settings.container === window) {
-            this.elems.domContainer = document.body
-        } else {
-            this.elems.domContainer = this.settings.container
+        const fitOptions = {
+            imgHeight: this.elems.img.naturalHeight,
+            imgWidth: this.elems.img.naturalWidth,
+            containerHeight: this.elems.wrapper.clientHeight,
+            containerWidth: this.elems.wrapper.clientWidth,
+            containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
+            containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+            imageSize: this.settings.imageSize,
         }
-    }
 
-    debounce(duration, callback) {
-        clearTimeout(this.settings.timerDebounce)
-        this.settings.timerDebounce = setTimeout(function() {
-            callback()
-        }, duration)
+        const { width, height, left, top } = fit(fitOptions)
+        return this.center(width, height, left, top)
     }
 
     on(element, eventName, cb) {
@@ -665,7 +595,6 @@ export class Chocolat {
             cb,
         })
         element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb)
-        return this
     }
 
     off(element, eventName) {
@@ -678,29 +607,5 @@ export class Chocolat {
             element.removeEventListener(eventName.split('.')[0], this.events[index].cb)
             this.events.splice(index, 1)
         }
-
-        return this
-    }
-
-    transitionAsPromise(triggeringFunc, el) {
-        return new Promise((resolve) => {
-            const handleTransitionEnd = () => {
-                el.removeEventListener('transitionend', handleTransitionEnd)
-                resolve()
-            }
-            el.addEventListener('transitionend', handleTransitionEnd)
-
-            const classesBefore = el.getAttribute('class')
-            const stylesBefore = el.getAttribute('style')
-
-            triggeringFunc()
-
-            if (
-                classesBefore === el.getAttribute('class') &&
-                stylesBefore === el.getAttribute('style')
-            ) {
-                handleTransitionEnd()
-            }
-        })
     }
 }
diff --git a/src/js/utils.js b/src/js/utils.js
new file mode 100644
index 0000000..1902a14
--- /dev/null
+++ b/src/js/utils.js
@@ -0,0 +1,126 @@
+export let timerDebounce = undefined
+
+export function debounce(duration, callback) {
+    clearTimeout(timerDebounce)
+    timerDebounce = setTimeout(function() {
+        callback()
+    }, duration)
+
+    return timerDebounce
+}
+
+export function transitionAsPromise(triggeringFunc, el) {
+    return new Promise((resolve) => {
+        const handleTransitionEnd = () => {
+            el.removeEventListener('transitionend', handleTransitionEnd)
+            resolve()
+        }
+        el.addEventListener('transitionend', handleTransitionEnd)
+
+        const classesBefore = el.getAttribute('class')
+        const stylesBefore = el.getAttribute('style')
+
+        triggeringFunc()
+
+        if (
+            classesBefore === el.getAttribute('class') &&
+            stylesBefore === el.getAttribute('style')
+        ) {
+            handleTransitionEnd()
+        }
+    })
+}
+
+export function loadImage(src, image) {
+    if ('decode' in image) {
+        image.src = src
+        return image.decode()
+    } else {
+        return new Promise(function(resolve, reject) {
+            image.onload = resolve
+            image.onerror = resolve
+            image.src = src
+        })
+    }
+}
+
+export function fit(options) {
+    let height
+    let width
+
+    const {
+        imgHeight,
+        imgWidth,
+        containerHeight,
+        containerWidth,
+        containerGlobalWidth,
+        containerGlobalHeight,
+        imageSize,
+    } = options
+
+    const containerGlobalRatio = containerGlobalHeight / containerGlobalWidth
+    const containerRatio = containerHeight / containerWidth
+    const imgRatio = imgHeight / imgWidth
+
+    if (imageSize == 'cover') {
+        if (imgRatio < containerRatio) {
+            height = containerHeight
+            width = height / imgRatio
+        } else {
+            width = containerWidth
+            height = width * imgRatio
+        }
+    } else if (imageSize == 'native') {
+        height = imgHeight
+        width = imgWidth
+    } else {
+        if (imgRatio > containerGlobalRatio) {
+            height = containerGlobalHeight
+            width = height / imgRatio
+        } else {
+            width = containerGlobalWidth
+            height = width * imgRatio
+        }
+        if (imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
+            width = imgWidth
+            height = imgHeight
+        }
+    }
+
+    return {
+        height: height,
+        width: width,
+        top: (containerHeight - height) / 2,
+        left: (containerWidth - width) / 2,
+    }
+}
+
+export function openFullScreen(wrapper) {
+    if (wrapper.requestFullscreen) {
+        wrapper.requestFullscreen()
+        return true
+    } else if (wrapper.webkitRequestFullscreen) {
+        wrapper.webkitRequestFullscreen()
+        return true
+    } else if (wrapper.msRequestFullscreen) {
+        wrapper.msRequestFullscreen()
+        return true
+    } else {
+        return false
+    }
+}
+
+export function exitFullScreen() {
+    if (document.exitFullscreen) {
+        document.exitFullscreen()
+        return false
+    } else if (document.webkitExitFullscreen) {
+        document.webkitExitFullscreen()
+        return false
+    } else if (document.msExitFullscreen) {
+        document.msExitFullscreen()
+        return false
+    } else {
+        return true
+    }
+}
diff --git a/test/test.js b/test/test.js
index a0e778c..9e884c3 100644
--- a/test/test.js
+++ b/test/test.js
@@ -257,102 +257,6 @@ describe('Chocolat', function() {
         })
     })
 
-    describe('FullScreen', function() {
-        it('should open fullscreen when clicking .fullscreen', function(done) {
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
-            // test only if browser fullscreenAPI is available
-            if (
-                typeof Element.prototype.requestFullscreen === 'undefined' &&
-                typeof Element.prototype.mozRequestFullScreen === 'undefined' &&
-                typeof Element.prototype.webkitRequestFullscreen === 'undefined' &&
-                typeof Element.prototype.msRequestFullscreen === 'undefined'
-            ) {
-                return done()
-            }
-
-            var spyOpen = sinon.spy(chocolat, 'openFullScreen')
-
-            chocolat.api.open().then(function() {
-                chocolat.elems.fullscreen.click()
-                expect(spyOpen.calledOnce).to.be.true
-                expect(chocolat.api.get('fullscreenOpen')).to.be.true
-                chocolat.elems.fullscreen.click()
-                expect(chocolat.api.get('fullscreenOpen')).to.be.false
-                return done()
-            })
-        })
-
-        it('should close fullscreen when clicking .fullscreen twice', function(done) {
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
-
-            // test only if browser fullscreenAPI is available
-            if (
-                typeof Element.prototype.requestFullscreen === 'undefined' &&
-                typeof Element.prototype.mozRequestFullScreen === 'undefined' &&
-                typeof Element.prototype.webkitRequestFullscreen === 'undefined' &&
-                typeof Element.prototype.msRequestFullscreen === 'undefined'
-            ) {
-                return done()
-            }
-
-            var spyClose = sinon.spy(chocolat, 'exitFullScreen')
-
-            chocolat.api.open().then(function() {
-                chocolat.elems.fullscreen.click()
-                chocolat.elems.fullscreen.click()
-                expect(spyClose.calledOnce).to.be.true
-
-                return done()
-            })
-        })
-
-        it('should close fullscreen when closing chocolat', function(done) {
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
-
-            // test only if browser fullscreenAPI is available
-            if (
-                typeof Element.prototype.requestFullscreen === 'undefined' &&
-                typeof Element.prototype.mozRequestFullScreen === 'undefined' &&
-                typeof Element.prototype.webkitRequestFullscreen === 'undefined' &&
-                typeof Element.prototype.msRequestFullscreen === 'undefined'
-            ) {
-                return done()
-            }
-
-            var spyClose = sinon.spy(chocolat, 'exitFullScreen')
-
-            chocolat.api.open().then(function() {
-                chocolat.elems.fullscreen.click()
-                chocolat.elems.close.click()
-                expect(spyClose.calledOnce).to.be.true
-                return done()
-            })
-        })
-
-        return it('should open fullscreen directly', function(done) {
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                allowFullScreen: true,
-            })
-
-            // test only if browser fullscreenAPI is available
-            if (
-                typeof Element.prototype.requestFullscreen === 'undefined' &&
-                typeof Element.prototype.mozRequestFullScreen === 'undefined' &&
-                typeof Element.prototype.webkitRequestFullscreen === 'undefined' &&
-                typeof Element.prototype.msRequestFullscreen === 'undefined'
-            ) {
-                return done()
-            }
-
-            var spyOpen = sinon.spy(chocolat, 'openFullScreen')
-
-            chocolat.api.open().then(function() {
-                expect(spyOpen.calledOnce).to.be.true
-                return done()
-            })
-        })
-    })
-
     describe('Change image', function() {
         it('should go to next image', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'))
@@ -444,7 +348,7 @@ describe('Chocolat', function() {
             chocolat.api.open().then(function() {
                 expect(chocolat.api.get('imageSize')).to.equal('cover')
                 expect(
-                    chocolat.api.getElem('domContainer').classList.contains('chocolat-cover')
+                    chocolat.api.getElem('container').classList.contains('chocolat-cover')
                 ).to.be.true
                 return done()
             })
@@ -667,8 +571,8 @@ function getExpectedDimensions(chocolat) {
     var imgWidth = chocolat.api.getElem('img').width
     var imgHeight = chocolat.api.getElem('img').height
 
-    var containerWidth = $(chocolat.api.get('container')).width()
-    var containerHeight = $(chocolat.api.get('container')).height()
+    var containerWidth = chocolat.api.getElem('wrapper').clientWidth
+    var containerHeight = chocolat.api.getElem('wrapper').clientHeight
 
     var containerOutMarginH =
         chocolat.api.getElem('top').offsetHeight + chocolat.api.getElem('bottom').offsetHeight

From b07a41d1bd79b82804a37c6c6d27087e344da772 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 10 Nov 2019 18:15:19 +0100
Subject: [PATCH 40/65] Changed layout to use browser centering instead of
 computed centering

---
 dist/css/chocolat.css    | 235 ++++++++++++++++++++-------------------
 dist/js/chocolat.cjs.js  | 113 +++++++++----------
 dist/js/chocolat.esm.js  | 113 +++++++++----------
 dist/js/chocolat.iife.js | 113 +++++++++----------
 src/css/chocolat.css     | 235 ++++++++++++++++++++-------------------
 src/js/chocolat.js       |  94 ++++++++--------
 src/js/utils.js          |  14 +--
 test/test.js             |  99 ++++-------------
 8 files changed, 471 insertions(+), 545 deletions(-)

diff --git a/dist/css/chocolat.css b/dist/css/chocolat.css
index 27e0204..034a219 100644
--- a/dist/css/chocolat.css
+++ b/dist/css/chocolat.css
@@ -1,155 +1,160 @@
-.chocolat-zoomable.chocolat-zoomed{
-    cursor : zoom-out;
+.chocolat-zoomable.chocolat-zoomed {
+    cursor: zoom-out;
 }
-.chocolat-open{
+.chocolat-open {
     overflow: hidden;
 }
-.chocolat-overlay{
-    transition: opacity .4s ease, visibility 0s .4s ease;
-    height:100%;
-    width:100%;
-    position:fixed;
-    left:0;
-    top:0;
-    z-index:10;
-    background-color:#fff;
+.chocolat-overlay {
+    transition: opacity 0.4s ease, visibility 0s 0.4s ease;
+    height: 100%;
+    width: 100%;
+    position: fixed;
+    left: 0;
+    top: 0;
+    z-index: 10;
+    background-color: #fff;
     visibility: hidden;
     opacity: 0;
 }
-.chocolat-overlay.chocolat-visible{
-    transition: opacity .4s, visibility 0s;
+.chocolat-overlay.chocolat-visible {
+    transition: opacity 0.4s, visibility 0s;
     visibility: visible;
     opacity: 0.8;
 }
 
-.chocolat-wrapper{
-    transition: opacity .4s ease, visibility 0s .4s ease;
-    width:100%;
+.chocolat-wrapper {
+    transition: opacity 0.4s ease, visibility 0s 0.4s ease;
+    width: 100%;
     height: 100%;
-    position:fixed;
+    position: fixed;
     opacity: 0;
-    left:0;
-    top:0;
-    z-index:16;
+    left: 0;
+    top: 0;
+    z-index: 16;
     color: #fff;
     visibility: hidden;
 }
-.chocolat-wrapper.chocolat-visible{
-    transition: opacity .4s, visibility 0s;
+.chocolat-wrapper.chocolat-visible {
+    transition: opacity 0.4s, visibility 0s;
     opacity: 1;
     visibility: visible;
 }
 
-.chocolat-zoomable .chocolat-img{
-    cursor : zoom-in;
-}
-.chocolat-loader{
-    transition: opacity .3s;
-    height:32px;
-    width:32px;
-    position:absolute;
-    left:50%;
-    top:50% ;
-    margin-left:-16px;
-    margin-top:-16px;
-    z-index:11;
-    background:url(../images/loader.gif);
+.chocolat-zoomable .chocolat-img {
+    cursor: zoom-in;
+}
+.chocolat-loader {
+    transition: opacity 0.3s;
+    height: 32px;
+    width: 32px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    margin-left: -16px;
+    margin-top: -16px;
+    z-index: 11;
+    background: url(../images/loader.gif);
     opacity: 0;
 }
-.chocolat-loader.chocolat-visible{
+.chocolat-loader.chocolat-visible {
     opacity: 1;
 }
 
-.chocolat-content{
-    transition: top .2s ease, left .2s ease, width .2s ease, height .2s ease; /* center */
-    position:fixed;
-    width:0px;
-    height:0px;
-    left:50%;
-    top:50%;
-    z-index:14;
+.chocolat-image-wrapper {
+    transition: top 0.2s ease, left 0.2s ease, width 0.2s ease, height 0.2s ease; /* center */
+    position: fixed;
+    width: 0px;
+    height: 0px;
+    left: 50%;
+    top: 50%;
+    z-index: 14;
     text-align: left;
+    transform: translate(-50%, -50%);
 }
 
-.chocolat-content .chocolat-img{
-    transition: margin .2s ease; /*  zoomout */
-    position:absolute;
-    width:100%;
-    height:100%;
-}
-.chocolat-wrapper .chocolat-left{
-    position:absolute;
-    left:0;
-    width:50px;
-    height:100px;
-    top: 50%;
-    margin-top: -50px;
-    cursor:pointer;
-    background:url(../images/left.png) 50% 50% no-repeat;
+.chocolat-image-wrapper .chocolat-img {
+    transition: margin 0.2s ease; /*  zoomout */
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
+.chocolat-wrapper .chocolat-left {
+    width: 50px;
+    height: 100px;
+    cursor: pointer;
+    background: url(../images/left.png) 50% 50% no-repeat;
     z-index: 17;
-    display: none;
+    visibility: hidden;
+}
 
+.chocolat-layout {
+    display: flex;
+    flex-direction: column;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
 }
-.chocolat-wrapper .chocolat-right{
-    position:absolute;
-    right:0;
-    width:50px;
-    height:100px;
-    top: 50%;
-    margin-top: -50px;
-    cursor:pointer;
-    background:url(../images/right.png)  50% 50% no-repeat;
+.chocolat-image-canvas {
+    flex-grow: 1;
+    align-self: stretch;
+}
+.chocolat-center {
+    flex-grow: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.chocolat-wrapper .chocolat-right {
+    width: 50px;
+    height: 100px;
+    cursor: pointer;
+    background: url(../images/right.png) 50% 50% no-repeat;
     z-index: 17;
-    display: none;
+    visibility: hidden;
 }
-.chocolat-wrapper .chocolat-right.active{
-    display: block;
+.chocolat-wrapper .chocolat-right.active {
+    visibility: visible;
 }
-.chocolat-wrapper .chocolat-left.active{
-    display: block;
+.chocolat-wrapper .chocolat-left.active {
+    visibility: visible;
 }
-.chocolat-wrapper .chocolat-top{
-    position:absolute;
-    top:0px;
-    right: 0;
-    left: 0;
-    line-height:50px;
-    height:50px;
+.chocolat-wrapper .chocolat-top {
+    height: 50px;
     overflow: hidden;
     z-index: 17;
-    margin-bottom: 10px;
+    flex-shrink: 0;
 }
-.chocolat-wrapper .chocolat-close{
-    width:50px;
-    height:50px;
-    cursor:pointer;
+.chocolat-wrapper .chocolat-close {
+    width: 50px;
+    height: 50px;
+    cursor: pointer;
     position: absolute;
     top: 0;
     right: 0;
-    background:url(../images/close.png) 50% 50% no-repeat;
+    background: url(../images/close.png) 50% 50% no-repeat;
 }
-.chocolat-wrapper .chocolat-bottom{
-    position:absolute;
-    bottom:0;
-    left: 0;
-    right: 0;
-    line-height:40px;
-    height:40px;
-    font-size:12px;
+.chocolat-wrapper .chocolat-bottom {
+    height: 40px;
+    font-size: 12px;
     z-index: 17;
     padding-left: 15px;
     padding-right: 15px;
     background: rgba(0, 0, 0, 0.2);
-    text-align: right;
-    margin-top: 10px;
+    flex-shrink: 0;
+    display: flex;
+    align-items: center;
+
 }
-.chocolat-wrapper .chocolat-set-title{
+.chocolat-wrapper .chocolat-set-title {
     display: inline-block;
     padding-right: 15px;
     line-height: 1;
     border-right: 1px solid rgba(255, 255, 255, 0.3);
 }
-.chocolat-wrapper .chocolat-pagination{
+.chocolat-wrapper .chocolat-pagination {
     float: right;
     display: inline-block;
     padding-left: 15px;
@@ -157,42 +162,42 @@
     margin-right: 15px;
     /*border-right: 1px solid rgba(255, 255, 255, 0.2);*/
 }
-.chocolat-wrapper .chocolat-fullscreen{
+.chocolat-wrapper .chocolat-fullscreen {
     width: 16px;
     height: 40px;
     background: url(../images/fullscreen.png) 50% 50% no-repeat;
     display: block;
-    margin:auto;
     cursor: pointer;
     float: right;
 }
-.chocolat-wrapper .chocolat-description{
+.chocolat-wrapper .chocolat-description {
     display: inline-block;
-    float: left;
+    flex-grow: 1;
+    text-align: left;
 }
 
 /* no container mode*/
-body.chocolat-open>.chocolat-overlay{
-    z-index:15;
+body.chocolat-open > .chocolat-overlay {
+    z-index: 15;
 }
-body.chocolat-open>.chocolat-loader{
-    z-index:15;
+body.chocolat-open > .chocolat-loader {
+    z-index: 15;
 }
-body.chocolat-open>.chocolat-content{
-    z-index:17;
+body.chocolat-open > .chocolat-image-wrapper {
+    z-index: 17;
 }
 
 /* container mode*/
 .chocolat-in-container .chocolat-wrapper,
-.chocolat-in-container .chocolat-content,
-.chocolat-in-container .chocolat-overlay{
+.chocolat-in-container .chocolat-image-wrapper,
+.chocolat-in-container .chocolat-overlay {
     position: absolute;
 }
-.chocolat-in-container{
+.chocolat-in-container {
     position: relative;
 }
 
-.chocolat-zoomable.chocolat-zoomed .chocolat-img{
+.chocolat-zoomable.chocolat-zoomed .chocolat-img {
     transition: margin 0s ease;
 }
 
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index f67a11d..f450ccc 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -45,11 +45,11 @@ function fit(options) {
     imgWidth,
     containerHeight,
     containerWidth,
-    containerGlobalWidth,
-    containerGlobalHeight,
+    canvasWidth,
+    canvasHeight,
     imageSize
   } = options;
-  const containerGlobalRatio = containerGlobalHeight / containerGlobalWidth;
+  const canvasRatio = canvasHeight / canvasWidth;
   const containerRatio = containerHeight / containerWidth;
   const imgRatio = imgHeight / imgWidth;
 
@@ -65,11 +65,11 @@ function fit(options) {
     height = imgHeight;
     width = imgWidth;
   } else {
-    if (imgRatio > containerGlobalRatio) {
-      height = containerGlobalHeight;
+    if (imgRatio > canvasRatio) {
+      height = canvasHeight;
       width = height / imgRatio;
     } else {
-      width = containerGlobalWidth;
+      width = canvasWidth;
       height = width * imgRatio;
     }
 
@@ -81,9 +81,7 @@ function fit(options) {
 
   return {
     height: height,
-    width: width,
-    top: (containerHeight - height) / 2,
-    left: (containerWidth - width) / 2
+    width: width
   };
 }
 function openFullScreen(wrapper) {
@@ -287,30 +285,26 @@ class Chocolat {
     const fitOptions = {
       imgHeight: image.naturalHeight,
       imgWidth: image.naturalWidth,
-      containerHeight: this.elems.wrapper.clientHeight,
-      containerWidth: this.elems.wrapper.clientWidth,
-      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      containerHeight: this.elems.container.clientHeight,
+      containerWidth: this.elems.container.clientWidth,
+      canvasWidth: this.elems.imageCanvas.clientWidth,
+      canvasHeight: this.elems.imageCanvas.clientHeight,
       imageSize: this.settings.imageSize
     };
     const {
       width,
-      height,
-      left,
-      top
+      height
     } = fit(fitOptions);
-    return this.center(width, height, left, top);
+    return this.center(width, height);
   }
 
-  center(width, height, left, top) {
+  center(width, height) {
     return transitionAsPromise(() => {
-      Object.assign(this.elems.content.style, {
+      Object.assign(this.elems.imageWrapper.style, {
         width: width + 'px',
-        height: height + 'px',
-        left: left + 'px',
-        top: top + 'px'
+        height: height + 'px'
       });
-    }, this.elems.content);
+    }, this.elems.imageWrapper);
   }
 
   appear(i) {
@@ -327,14 +321,6 @@ class Chocolat {
     });
   }
 
-  getOutMarginW() {
-    return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
-  }
-
-  getOutMarginH() {
-    return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
-  }
-
   change(step) {
     this.zoomOut();
     this.zoomable();
@@ -428,30 +414,36 @@ class Chocolat {
     this.elems.loader = document.createElement('div');
     this.elems.loader.setAttribute('class', 'chocolat-loader');
     this.elems.wrapper.appendChild(this.elems.loader);
-    this.elems.content = document.createElement('div');
-    this.elems.content.setAttribute('class', 'chocolat-content');
-    this.elems.wrapper.appendChild(this.elems.content);
-    this.elems.img = document.createElement('img');
-    this.elems.img.setAttribute('class', 'chocolat-img');
-    this.elems.content.appendChild(this.elems.img);
+    this.elems.layout = document.createElement('div');
+    this.elems.layout.setAttribute('class', 'chocolat-layout');
+    this.elems.wrapper.appendChild(this.elems.layout);
     this.elems.top = document.createElement('div');
     this.elems.top.setAttribute('class', 'chocolat-top');
-    this.elems.wrapper.appendChild(this.elems.top);
+    this.elems.layout.appendChild(this.elems.top);
+    this.elems.center = document.createElement('div');
+    this.elems.center.setAttribute('class', 'chocolat-center');
+    this.elems.layout.appendChild(this.elems.center);
     this.elems.left = document.createElement('div');
     this.elems.left.setAttribute('class', 'chocolat-left');
-    this.elems.wrapper.appendChild(this.elems.left);
+    this.elems.center.appendChild(this.elems.left);
+    this.elems.imageCanvas = document.createElement('div');
+    this.elems.imageCanvas.setAttribute('class', 'chocolat-image-canvas');
+    this.elems.center.appendChild(this.elems.imageCanvas);
+    this.elems.imageWrapper = document.createElement('div');
+    this.elems.imageWrapper.setAttribute('class', 'chocolat-image-wrapper');
+    this.elems.imageCanvas.appendChild(this.elems.imageWrapper);
+    this.elems.img = document.createElement('img');
+    this.elems.img.setAttribute('class', 'chocolat-img');
+    this.elems.imageWrapper.appendChild(this.elems.img);
     this.elems.right = document.createElement('div');
     this.elems.right.setAttribute('class', 'chocolat-right');
-    this.elems.wrapper.appendChild(this.elems.right);
+    this.elems.center.appendChild(this.elems.right);
     this.elems.bottom = document.createElement('div');
     this.elems.bottom.setAttribute('class', 'chocolat-bottom');
-    this.elems.wrapper.appendChild(this.elems.bottom);
+    this.elems.layout.appendChild(this.elems.bottom);
     this.elems.close = document.createElement('span');
     this.elems.close.setAttribute('class', 'chocolat-close');
     this.elems.top.appendChild(this.elems.close);
-    this.elems.fullscreen = document.createElement('span');
-    this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
-    this.elems.bottom.appendChild(this.elems.fullscreen);
     this.elems.description = document.createElement('span');
     this.elems.description.setAttribute('class', 'chocolat-description');
     this.elems.bottom.appendChild(this.elems.description);
@@ -462,6 +454,9 @@ class Chocolat {
     this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
     this.elems.setTitle.textContent = this.settings.setTitle();
     this.elems.bottom.appendChild(this.elems.setTitle);
+    this.elems.fullscreen = document.createElement('span');
+    this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
+    this.elems.bottom.appendChild(this.elems.fullscreen);
     this.settings.afterMarkup.call(this);
   }
 
@@ -564,17 +559,15 @@ class Chocolat {
           imgWidth: this.elems.img.naturalWidth,
           containerHeight: this.elems.wrapper.clientHeight,
           containerWidth: this.elems.wrapper.clientWidth,
-          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
           imageSize: this.settings.imageSize
         };
         const {
           width,
-          height,
-          left,
-          top
+          height
         } = fit(fitOptions);
-        this.center(width, height, left, top);
+        this.center(width, height);
         this.zoomable();
       });
     });
@@ -603,17 +596,15 @@ class Chocolat {
       imgWidth: this.elems.img.naturalWidth,
       containerHeight: this.elems.wrapper.clientHeight,
       containerWidth: this.elems.wrapper.clientWidth,
-      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      canvasWidth: this.elems.imageCanvas.clientWidth,
+      canvasHeight: this.elems.imageCanvas.clientHeight,
       imageSize: this.settings.imageSize
     };
     const {
       width,
-      height,
-      left,
-      top
+      height
     } = fit(fitOptions);
-    return this.center(width, height, left, top);
+    return this.center(width, height);
   }
 
   zoomOut(e) {
@@ -630,17 +621,15 @@ class Chocolat {
       imgWidth: this.elems.img.naturalWidth,
       containerHeight: this.elems.wrapper.clientHeight,
       containerWidth: this.elems.wrapper.clientWidth,
-      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      canvasWidth: this.elems.imageCanvas.clientWidth,
+      canvasHeight: this.elems.imageCanvas.clientHeight,
       imageSize: this.settings.imageSize
     };
     const {
       width,
-      height,
-      left,
-      top
+      height
     } = fit(fitOptions);
-    return this.center(width, height, left, top);
+    return this.center(width, height);
   }
 
   on(element, eventName, cb) {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 0804e62..71c9021 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -43,11 +43,11 @@ function fit(options) {
     imgWidth,
     containerHeight,
     containerWidth,
-    containerGlobalWidth,
-    containerGlobalHeight,
+    canvasWidth,
+    canvasHeight,
     imageSize
   } = options;
-  const containerGlobalRatio = containerGlobalHeight / containerGlobalWidth;
+  const canvasRatio = canvasHeight / canvasWidth;
   const containerRatio = containerHeight / containerWidth;
   const imgRatio = imgHeight / imgWidth;
 
@@ -63,11 +63,11 @@ function fit(options) {
     height = imgHeight;
     width = imgWidth;
   } else {
-    if (imgRatio > containerGlobalRatio) {
-      height = containerGlobalHeight;
+    if (imgRatio > canvasRatio) {
+      height = canvasHeight;
       width = height / imgRatio;
     } else {
-      width = containerGlobalWidth;
+      width = canvasWidth;
       height = width * imgRatio;
     }
 
@@ -79,9 +79,7 @@ function fit(options) {
 
   return {
     height: height,
-    width: width,
-    top: (containerHeight - height) / 2,
-    left: (containerWidth - width) / 2
+    width: width
   };
 }
 function openFullScreen(wrapper) {
@@ -285,30 +283,26 @@ class Chocolat {
     const fitOptions = {
       imgHeight: image.naturalHeight,
       imgWidth: image.naturalWidth,
-      containerHeight: this.elems.wrapper.clientHeight,
-      containerWidth: this.elems.wrapper.clientWidth,
-      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      containerHeight: this.elems.container.clientHeight,
+      containerWidth: this.elems.container.clientWidth,
+      canvasWidth: this.elems.imageCanvas.clientWidth,
+      canvasHeight: this.elems.imageCanvas.clientHeight,
       imageSize: this.settings.imageSize
     };
     const {
       width,
-      height,
-      left,
-      top
+      height
     } = fit(fitOptions);
-    return this.center(width, height, left, top);
+    return this.center(width, height);
   }
 
-  center(width, height, left, top) {
+  center(width, height) {
     return transitionAsPromise(() => {
-      Object.assign(this.elems.content.style, {
+      Object.assign(this.elems.imageWrapper.style, {
         width: width + 'px',
-        height: height + 'px',
-        left: left + 'px',
-        top: top + 'px'
+        height: height + 'px'
       });
-    }, this.elems.content);
+    }, this.elems.imageWrapper);
   }
 
   appear(i) {
@@ -325,14 +319,6 @@ class Chocolat {
     });
   }
 
-  getOutMarginW() {
-    return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
-  }
-
-  getOutMarginH() {
-    return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
-  }
-
   change(step) {
     this.zoomOut();
     this.zoomable();
@@ -426,30 +412,36 @@ class Chocolat {
     this.elems.loader = document.createElement('div');
     this.elems.loader.setAttribute('class', 'chocolat-loader');
     this.elems.wrapper.appendChild(this.elems.loader);
-    this.elems.content = document.createElement('div');
-    this.elems.content.setAttribute('class', 'chocolat-content');
-    this.elems.wrapper.appendChild(this.elems.content);
-    this.elems.img = document.createElement('img');
-    this.elems.img.setAttribute('class', 'chocolat-img');
-    this.elems.content.appendChild(this.elems.img);
+    this.elems.layout = document.createElement('div');
+    this.elems.layout.setAttribute('class', 'chocolat-layout');
+    this.elems.wrapper.appendChild(this.elems.layout);
     this.elems.top = document.createElement('div');
     this.elems.top.setAttribute('class', 'chocolat-top');
-    this.elems.wrapper.appendChild(this.elems.top);
+    this.elems.layout.appendChild(this.elems.top);
+    this.elems.center = document.createElement('div');
+    this.elems.center.setAttribute('class', 'chocolat-center');
+    this.elems.layout.appendChild(this.elems.center);
     this.elems.left = document.createElement('div');
     this.elems.left.setAttribute('class', 'chocolat-left');
-    this.elems.wrapper.appendChild(this.elems.left);
+    this.elems.center.appendChild(this.elems.left);
+    this.elems.imageCanvas = document.createElement('div');
+    this.elems.imageCanvas.setAttribute('class', 'chocolat-image-canvas');
+    this.elems.center.appendChild(this.elems.imageCanvas);
+    this.elems.imageWrapper = document.createElement('div');
+    this.elems.imageWrapper.setAttribute('class', 'chocolat-image-wrapper');
+    this.elems.imageCanvas.appendChild(this.elems.imageWrapper);
+    this.elems.img = document.createElement('img');
+    this.elems.img.setAttribute('class', 'chocolat-img');
+    this.elems.imageWrapper.appendChild(this.elems.img);
     this.elems.right = document.createElement('div');
     this.elems.right.setAttribute('class', 'chocolat-right');
-    this.elems.wrapper.appendChild(this.elems.right);
+    this.elems.center.appendChild(this.elems.right);
     this.elems.bottom = document.createElement('div');
     this.elems.bottom.setAttribute('class', 'chocolat-bottom');
-    this.elems.wrapper.appendChild(this.elems.bottom);
+    this.elems.layout.appendChild(this.elems.bottom);
     this.elems.close = document.createElement('span');
     this.elems.close.setAttribute('class', 'chocolat-close');
     this.elems.top.appendChild(this.elems.close);
-    this.elems.fullscreen = document.createElement('span');
-    this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
-    this.elems.bottom.appendChild(this.elems.fullscreen);
     this.elems.description = document.createElement('span');
     this.elems.description.setAttribute('class', 'chocolat-description');
     this.elems.bottom.appendChild(this.elems.description);
@@ -460,6 +452,9 @@ class Chocolat {
     this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
     this.elems.setTitle.textContent = this.settings.setTitle();
     this.elems.bottom.appendChild(this.elems.setTitle);
+    this.elems.fullscreen = document.createElement('span');
+    this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
+    this.elems.bottom.appendChild(this.elems.fullscreen);
     this.settings.afterMarkup.call(this);
   }
 
@@ -562,17 +557,15 @@ class Chocolat {
           imgWidth: this.elems.img.naturalWidth,
           containerHeight: this.elems.wrapper.clientHeight,
           containerWidth: this.elems.wrapper.clientWidth,
-          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
           imageSize: this.settings.imageSize
         };
         const {
           width,
-          height,
-          left,
-          top
+          height
         } = fit(fitOptions);
-        this.center(width, height, left, top);
+        this.center(width, height);
         this.zoomable();
       });
     });
@@ -601,17 +594,15 @@ class Chocolat {
       imgWidth: this.elems.img.naturalWidth,
       containerHeight: this.elems.wrapper.clientHeight,
       containerWidth: this.elems.wrapper.clientWidth,
-      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      canvasWidth: this.elems.imageCanvas.clientWidth,
+      canvasHeight: this.elems.imageCanvas.clientHeight,
       imageSize: this.settings.imageSize
     };
     const {
       width,
-      height,
-      left,
-      top
+      height
     } = fit(fitOptions);
-    return this.center(width, height, left, top);
+    return this.center(width, height);
   }
 
   zoomOut(e) {
@@ -628,17 +619,15 @@ class Chocolat {
       imgWidth: this.elems.img.naturalWidth,
       containerHeight: this.elems.wrapper.clientHeight,
       containerWidth: this.elems.wrapper.clientWidth,
-      containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-      containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+      canvasWidth: this.elems.imageCanvas.clientWidth,
+      canvasHeight: this.elems.imageCanvas.clientHeight,
       imageSize: this.settings.imageSize
     };
     const {
       width,
-      height,
-      left,
-      top
+      height
     } = fit(fitOptions);
-    return this.center(width, height, left, top);
+    return this.center(width, height);
   }
 
   on(element, eventName, cb) {
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 7f4e42b..aee51ac 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -46,11 +46,11 @@
         imgWidth,
         containerHeight,
         containerWidth,
-        containerGlobalWidth,
-        containerGlobalHeight,
+        canvasWidth,
+        canvasHeight,
         imageSize
       } = options;
-      const containerGlobalRatio = containerGlobalHeight / containerGlobalWidth;
+      const canvasRatio = canvasHeight / canvasWidth;
       const containerRatio = containerHeight / containerWidth;
       const imgRatio = imgHeight / imgWidth;
 
@@ -66,11 +66,11 @@
         height = imgHeight;
         width = imgWidth;
       } else {
-        if (imgRatio > containerGlobalRatio) {
-          height = containerGlobalHeight;
+        if (imgRatio > canvasRatio) {
+          height = canvasHeight;
           width = height / imgRatio;
         } else {
-          width = containerGlobalWidth;
+          width = canvasWidth;
           height = width * imgRatio;
         }
 
@@ -82,9 +82,7 @@
 
       return {
         height: height,
-        width: width,
-        top: (containerHeight - height) / 2,
-        left: (containerWidth - width) / 2
+        width: width
       };
     }
     function openFullScreen(wrapper) {
@@ -288,30 +286,26 @@
         const fitOptions = {
           imgHeight: image.naturalHeight,
           imgWidth: image.naturalWidth,
-          containerHeight: this.elems.wrapper.clientHeight,
-          containerWidth: this.elems.wrapper.clientWidth,
-          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          containerHeight: this.elems.container.clientHeight,
+          containerWidth: this.elems.container.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
           imageSize: this.settings.imageSize
         };
         const {
           width,
-          height,
-          left,
-          top
+          height
         } = fit(fitOptions);
-        return this.center(width, height, left, top);
+        return this.center(width, height);
       }
 
-      center(width, height, left, top) {
+      center(width, height) {
         return transitionAsPromise(() => {
-          Object.assign(this.elems.content.style, {
+          Object.assign(this.elems.imageWrapper.style, {
             width: width + 'px',
-            height: height + 'px',
-            left: left + 'px',
-            top: top + 'px'
+            height: height + 'px'
           });
-        }, this.elems.content);
+        }, this.elems.imageWrapper);
       }
 
       appear(i) {
@@ -328,14 +322,6 @@
         });
       }
 
-      getOutMarginW() {
-        return this.elems.left.offsetWidth + this.elems.right.offsetWidth;
-      }
-
-      getOutMarginH() {
-        return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight;
-      }
-
       change(step) {
         this.zoomOut();
         this.zoomable();
@@ -429,30 +415,36 @@
         this.elems.loader = document.createElement('div');
         this.elems.loader.setAttribute('class', 'chocolat-loader');
         this.elems.wrapper.appendChild(this.elems.loader);
-        this.elems.content = document.createElement('div');
-        this.elems.content.setAttribute('class', 'chocolat-content');
-        this.elems.wrapper.appendChild(this.elems.content);
-        this.elems.img = document.createElement('img');
-        this.elems.img.setAttribute('class', 'chocolat-img');
-        this.elems.content.appendChild(this.elems.img);
+        this.elems.layout = document.createElement('div');
+        this.elems.layout.setAttribute('class', 'chocolat-layout');
+        this.elems.wrapper.appendChild(this.elems.layout);
         this.elems.top = document.createElement('div');
         this.elems.top.setAttribute('class', 'chocolat-top');
-        this.elems.wrapper.appendChild(this.elems.top);
+        this.elems.layout.appendChild(this.elems.top);
+        this.elems.center = document.createElement('div');
+        this.elems.center.setAttribute('class', 'chocolat-center');
+        this.elems.layout.appendChild(this.elems.center);
         this.elems.left = document.createElement('div');
         this.elems.left.setAttribute('class', 'chocolat-left');
-        this.elems.wrapper.appendChild(this.elems.left);
+        this.elems.center.appendChild(this.elems.left);
+        this.elems.imageCanvas = document.createElement('div');
+        this.elems.imageCanvas.setAttribute('class', 'chocolat-image-canvas');
+        this.elems.center.appendChild(this.elems.imageCanvas);
+        this.elems.imageWrapper = document.createElement('div');
+        this.elems.imageWrapper.setAttribute('class', 'chocolat-image-wrapper');
+        this.elems.imageCanvas.appendChild(this.elems.imageWrapper);
+        this.elems.img = document.createElement('img');
+        this.elems.img.setAttribute('class', 'chocolat-img');
+        this.elems.imageWrapper.appendChild(this.elems.img);
         this.elems.right = document.createElement('div');
         this.elems.right.setAttribute('class', 'chocolat-right');
-        this.elems.wrapper.appendChild(this.elems.right);
+        this.elems.center.appendChild(this.elems.right);
         this.elems.bottom = document.createElement('div');
         this.elems.bottom.setAttribute('class', 'chocolat-bottom');
-        this.elems.wrapper.appendChild(this.elems.bottom);
+        this.elems.layout.appendChild(this.elems.bottom);
         this.elems.close = document.createElement('span');
         this.elems.close.setAttribute('class', 'chocolat-close');
         this.elems.top.appendChild(this.elems.close);
-        this.elems.fullscreen = document.createElement('span');
-        this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
-        this.elems.bottom.appendChild(this.elems.fullscreen);
         this.elems.description = document.createElement('span');
         this.elems.description.setAttribute('class', 'chocolat-description');
         this.elems.bottom.appendChild(this.elems.description);
@@ -463,6 +455,9 @@
         this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
         this.elems.setTitle.textContent = this.settings.setTitle();
         this.elems.bottom.appendChild(this.elems.setTitle);
+        this.elems.fullscreen = document.createElement('span');
+        this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
+        this.elems.bottom.appendChild(this.elems.fullscreen);
         this.settings.afterMarkup.call(this);
       }
 
@@ -565,17 +560,15 @@
               imgWidth: this.elems.img.naturalWidth,
               containerHeight: this.elems.wrapper.clientHeight,
               containerWidth: this.elems.wrapper.clientWidth,
-              containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-              containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+              canvasWidth: this.elems.imageCanvas.clientWidth,
+              canvasHeight: this.elems.imageCanvas.clientHeight,
               imageSize: this.settings.imageSize
             };
             const {
               width,
-              height,
-              left,
-              top
+              height
             } = fit(fitOptions);
-            this.center(width, height, left, top);
+            this.center(width, height);
             this.zoomable();
           });
         });
@@ -604,17 +597,15 @@
           imgWidth: this.elems.img.naturalWidth,
           containerHeight: this.elems.wrapper.clientHeight,
           containerWidth: this.elems.wrapper.clientWidth,
-          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
           imageSize: this.settings.imageSize
         };
         const {
           width,
-          height,
-          left,
-          top
+          height
         } = fit(fitOptions);
-        return this.center(width, height, left, top);
+        return this.center(width, height);
       }
 
       zoomOut(e) {
@@ -631,17 +622,15 @@
           imgWidth: this.elems.img.naturalWidth,
           containerHeight: this.elems.wrapper.clientHeight,
           containerWidth: this.elems.wrapper.clientWidth,
-          containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-          containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
           imageSize: this.settings.imageSize
         };
         const {
           width,
-          height,
-          left,
-          top
+          height
         } = fit(fitOptions);
-        return this.center(width, height, left, top);
+        return this.center(width, height);
       }
 
       on(element, eventName, cb) {
diff --git a/src/css/chocolat.css b/src/css/chocolat.css
index 27e0204..034a219 100644
--- a/src/css/chocolat.css
+++ b/src/css/chocolat.css
@@ -1,155 +1,160 @@
-.chocolat-zoomable.chocolat-zoomed{
-    cursor : zoom-out;
+.chocolat-zoomable.chocolat-zoomed {
+    cursor: zoom-out;
 }
-.chocolat-open{
+.chocolat-open {
     overflow: hidden;
 }
-.chocolat-overlay{
-    transition: opacity .4s ease, visibility 0s .4s ease;
-    height:100%;
-    width:100%;
-    position:fixed;
-    left:0;
-    top:0;
-    z-index:10;
-    background-color:#fff;
+.chocolat-overlay {
+    transition: opacity 0.4s ease, visibility 0s 0.4s ease;
+    height: 100%;
+    width: 100%;
+    position: fixed;
+    left: 0;
+    top: 0;
+    z-index: 10;
+    background-color: #fff;
     visibility: hidden;
     opacity: 0;
 }
-.chocolat-overlay.chocolat-visible{
-    transition: opacity .4s, visibility 0s;
+.chocolat-overlay.chocolat-visible {
+    transition: opacity 0.4s, visibility 0s;
     visibility: visible;
     opacity: 0.8;
 }
 
-.chocolat-wrapper{
-    transition: opacity .4s ease, visibility 0s .4s ease;
-    width:100%;
+.chocolat-wrapper {
+    transition: opacity 0.4s ease, visibility 0s 0.4s ease;
+    width: 100%;
     height: 100%;
-    position:fixed;
+    position: fixed;
     opacity: 0;
-    left:0;
-    top:0;
-    z-index:16;
+    left: 0;
+    top: 0;
+    z-index: 16;
     color: #fff;
     visibility: hidden;
 }
-.chocolat-wrapper.chocolat-visible{
-    transition: opacity .4s, visibility 0s;
+.chocolat-wrapper.chocolat-visible {
+    transition: opacity 0.4s, visibility 0s;
     opacity: 1;
     visibility: visible;
 }
 
-.chocolat-zoomable .chocolat-img{
-    cursor : zoom-in;
-}
-.chocolat-loader{
-    transition: opacity .3s;
-    height:32px;
-    width:32px;
-    position:absolute;
-    left:50%;
-    top:50% ;
-    margin-left:-16px;
-    margin-top:-16px;
-    z-index:11;
-    background:url(../images/loader.gif);
+.chocolat-zoomable .chocolat-img {
+    cursor: zoom-in;
+}
+.chocolat-loader {
+    transition: opacity 0.3s;
+    height: 32px;
+    width: 32px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    margin-left: -16px;
+    margin-top: -16px;
+    z-index: 11;
+    background: url(../images/loader.gif);
     opacity: 0;
 }
-.chocolat-loader.chocolat-visible{
+.chocolat-loader.chocolat-visible {
     opacity: 1;
 }
 
-.chocolat-content{
-    transition: top .2s ease, left .2s ease, width .2s ease, height .2s ease; /* center */
-    position:fixed;
-    width:0px;
-    height:0px;
-    left:50%;
-    top:50%;
-    z-index:14;
+.chocolat-image-wrapper {
+    transition: top 0.2s ease, left 0.2s ease, width 0.2s ease, height 0.2s ease; /* center */
+    position: fixed;
+    width: 0px;
+    height: 0px;
+    left: 50%;
+    top: 50%;
+    z-index: 14;
     text-align: left;
+    transform: translate(-50%, -50%);
 }
 
-.chocolat-content .chocolat-img{
-    transition: margin .2s ease; /*  zoomout */
-    position:absolute;
-    width:100%;
-    height:100%;
-}
-.chocolat-wrapper .chocolat-left{
-    position:absolute;
-    left:0;
-    width:50px;
-    height:100px;
-    top: 50%;
-    margin-top: -50px;
-    cursor:pointer;
-    background:url(../images/left.png) 50% 50% no-repeat;
+.chocolat-image-wrapper .chocolat-img {
+    transition: margin 0.2s ease; /*  zoomout */
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
+.chocolat-wrapper .chocolat-left {
+    width: 50px;
+    height: 100px;
+    cursor: pointer;
+    background: url(../images/left.png) 50% 50% no-repeat;
     z-index: 17;
-    display: none;
+    visibility: hidden;
+}
 
+.chocolat-layout {
+    display: flex;
+    flex-direction: column;
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
 }
-.chocolat-wrapper .chocolat-right{
-    position:absolute;
-    right:0;
-    width:50px;
-    height:100px;
-    top: 50%;
-    margin-top: -50px;
-    cursor:pointer;
-    background:url(../images/right.png)  50% 50% no-repeat;
+.chocolat-image-canvas {
+    flex-grow: 1;
+    align-self: stretch;
+}
+.chocolat-center {
+    flex-grow: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.chocolat-wrapper .chocolat-right {
+    width: 50px;
+    height: 100px;
+    cursor: pointer;
+    background: url(../images/right.png) 50% 50% no-repeat;
     z-index: 17;
-    display: none;
+    visibility: hidden;
 }
-.chocolat-wrapper .chocolat-right.active{
-    display: block;
+.chocolat-wrapper .chocolat-right.active {
+    visibility: visible;
 }
-.chocolat-wrapper .chocolat-left.active{
-    display: block;
+.chocolat-wrapper .chocolat-left.active {
+    visibility: visible;
 }
-.chocolat-wrapper .chocolat-top{
-    position:absolute;
-    top:0px;
-    right: 0;
-    left: 0;
-    line-height:50px;
-    height:50px;
+.chocolat-wrapper .chocolat-top {
+    height: 50px;
     overflow: hidden;
     z-index: 17;
-    margin-bottom: 10px;
+    flex-shrink: 0;
 }
-.chocolat-wrapper .chocolat-close{
-    width:50px;
-    height:50px;
-    cursor:pointer;
+.chocolat-wrapper .chocolat-close {
+    width: 50px;
+    height: 50px;
+    cursor: pointer;
     position: absolute;
     top: 0;
     right: 0;
-    background:url(../images/close.png) 50% 50% no-repeat;
+    background: url(../images/close.png) 50% 50% no-repeat;
 }
-.chocolat-wrapper .chocolat-bottom{
-    position:absolute;
-    bottom:0;
-    left: 0;
-    right: 0;
-    line-height:40px;
-    height:40px;
-    font-size:12px;
+.chocolat-wrapper .chocolat-bottom {
+    height: 40px;
+    font-size: 12px;
     z-index: 17;
     padding-left: 15px;
     padding-right: 15px;
     background: rgba(0, 0, 0, 0.2);
-    text-align: right;
-    margin-top: 10px;
+    flex-shrink: 0;
+    display: flex;
+    align-items: center;
+
 }
-.chocolat-wrapper .chocolat-set-title{
+.chocolat-wrapper .chocolat-set-title {
     display: inline-block;
     padding-right: 15px;
     line-height: 1;
     border-right: 1px solid rgba(255, 255, 255, 0.3);
 }
-.chocolat-wrapper .chocolat-pagination{
+.chocolat-wrapper .chocolat-pagination {
     float: right;
     display: inline-block;
     padding-left: 15px;
@@ -157,42 +162,42 @@
     margin-right: 15px;
     /*border-right: 1px solid rgba(255, 255, 255, 0.2);*/
 }
-.chocolat-wrapper .chocolat-fullscreen{
+.chocolat-wrapper .chocolat-fullscreen {
     width: 16px;
     height: 40px;
     background: url(../images/fullscreen.png) 50% 50% no-repeat;
     display: block;
-    margin:auto;
     cursor: pointer;
     float: right;
 }
-.chocolat-wrapper .chocolat-description{
+.chocolat-wrapper .chocolat-description {
     display: inline-block;
-    float: left;
+    flex-grow: 1;
+    text-align: left;
 }
 
 /* no container mode*/
-body.chocolat-open>.chocolat-overlay{
-    z-index:15;
+body.chocolat-open > .chocolat-overlay {
+    z-index: 15;
 }
-body.chocolat-open>.chocolat-loader{
-    z-index:15;
+body.chocolat-open > .chocolat-loader {
+    z-index: 15;
 }
-body.chocolat-open>.chocolat-content{
-    z-index:17;
+body.chocolat-open > .chocolat-image-wrapper {
+    z-index: 17;
 }
 
 /* container mode*/
 .chocolat-in-container .chocolat-wrapper,
-.chocolat-in-container .chocolat-content,
-.chocolat-in-container .chocolat-overlay{
+.chocolat-in-container .chocolat-image-wrapper,
+.chocolat-in-container .chocolat-overlay {
     position: absolute;
 }
-.chocolat-in-container{
+.chocolat-in-container {
     position: relative;
 }
 
-.chocolat-zoomable.chocolat-zoomed .chocolat-img{
+.chocolat-zoomable.chocolat-zoomed .chocolat-img {
     transition: margin 0s ease;
 }
 
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index fed6380..5eaea28 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -207,26 +207,24 @@ export class Chocolat {
         const fitOptions = {
             imgHeight: image.naturalHeight,
             imgWidth: image.naturalWidth,
-            containerHeight: this.elems.wrapper.clientHeight,
-            containerWidth: this.elems.wrapper.clientWidth,
-            containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-            containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+            containerHeight: this.elems.container.clientHeight,
+            containerWidth: this.elems.container.clientWidth,
+            canvasWidth: this.elems.imageCanvas.clientWidth,
+            canvasHeight: this.elems.imageCanvas.clientHeight,
             imageSize: this.settings.imageSize,
         }
 
-        const { width, height, left, top } = fit(fitOptions)
-        return this.center(width, height, left, top)
+        const { width, height } = fit(fitOptions)
+        return this.center(width, height)
     }
 
-    center(width, height, left, top) {
+    center(width, height) {
         return transitionAsPromise(() => {
-            Object.assign(this.elems.content.style, {
+            Object.assign(this.elems.imageWrapper.style, {
                 width: width + 'px',
                 height: height + 'px',
-                left: left + 'px',
-                top: top + 'px',
             })
-        }, this.elems.content)
+        }, this.elems.imageWrapper)
     }
 
     appear(i) {
@@ -243,14 +241,6 @@ export class Chocolat {
         })
     }
 
-    getOutMarginW() {
-        return this.elems.left.offsetWidth + this.elems.right.offsetWidth
-    }
-
-    getOutMarginH() {
-        return this.elems.top.offsetHeight + this.elems.bottom.offsetHeight
-    }
-
     change(step) {
         this.zoomOut()
         this.zoomable()
@@ -350,38 +340,46 @@ export class Chocolat {
         this.elems.loader.setAttribute('class', 'chocolat-loader')
         this.elems.wrapper.appendChild(this.elems.loader)
 
-        this.elems.content = document.createElement('div')
-        this.elems.content.setAttribute('class', 'chocolat-content')
-        this.elems.wrapper.appendChild(this.elems.content)
-
-        this.elems.img = document.createElement('img')
-        this.elems.img.setAttribute('class', 'chocolat-img')
-        this.elems.content.appendChild(this.elems.img)
+        this.elems.layout = document.createElement('div')
+        this.elems.layout.setAttribute('class', 'chocolat-layout')
+        this.elems.wrapper.appendChild(this.elems.layout)
 
         this.elems.top = document.createElement('div')
         this.elems.top.setAttribute('class', 'chocolat-top')
-        this.elems.wrapper.appendChild(this.elems.top)
+        this.elems.layout.appendChild(this.elems.top)
+
+        this.elems.center = document.createElement('div')
+        this.elems.center.setAttribute('class', 'chocolat-center')
+        this.elems.layout.appendChild(this.elems.center)
 
         this.elems.left = document.createElement('div')
         this.elems.left.setAttribute('class', 'chocolat-left')
-        this.elems.wrapper.appendChild(this.elems.left)
+        this.elems.center.appendChild(this.elems.left)
+
+        this.elems.imageCanvas = document.createElement('div')
+        this.elems.imageCanvas.setAttribute('class', 'chocolat-image-canvas')
+        this.elems.center.appendChild(this.elems.imageCanvas)
+
+        this.elems.imageWrapper = document.createElement('div')
+        this.elems.imageWrapper.setAttribute('class', 'chocolat-image-wrapper')
+        this.elems.imageCanvas.appendChild(this.elems.imageWrapper)
+
+        this.elems.img = document.createElement('img')
+        this.elems.img.setAttribute('class', 'chocolat-img')
+        this.elems.imageWrapper.appendChild(this.elems.img)
 
         this.elems.right = document.createElement('div')
         this.elems.right.setAttribute('class', 'chocolat-right')
-        this.elems.wrapper.appendChild(this.elems.right)
+        this.elems.center.appendChild(this.elems.right)
 
         this.elems.bottom = document.createElement('div')
         this.elems.bottom.setAttribute('class', 'chocolat-bottom')
-        this.elems.wrapper.appendChild(this.elems.bottom)
+        this.elems.layout.appendChild(this.elems.bottom)
 
         this.elems.close = document.createElement('span')
         this.elems.close.setAttribute('class', 'chocolat-close')
         this.elems.top.appendChild(this.elems.close)
 
-        this.elems.fullscreen = document.createElement('span')
-        this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen')
-        this.elems.bottom.appendChild(this.elems.fullscreen)
-
         this.elems.description = document.createElement('span')
         this.elems.description.setAttribute('class', 'chocolat-description')
         this.elems.bottom.appendChild(this.elems.description)
@@ -395,6 +393,10 @@ export class Chocolat {
         this.elems.setTitle.textContent = this.settings.setTitle()
         this.elems.bottom.appendChild(this.elems.setTitle)
 
+        this.elems.fullscreen = document.createElement('span')
+        this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen')
+        this.elems.bottom.appendChild(this.elems.fullscreen)
+
         this.settings.afterMarkup.call(this)
     }
 
@@ -508,14 +510,14 @@ export class Chocolat {
                     imgWidth: this.elems.img.naturalWidth,
                     containerHeight: this.elems.wrapper.clientHeight,
                     containerWidth: this.elems.wrapper.clientWidth,
-                    containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-                    containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+                    canvasWidth: this.elems.imageCanvas.clientWidth,
+                    canvasHeight: this.elems.imageCanvas.clientHeight,
                     imageSize: this.settings.imageSize,
                 }
 
-                const { width, height, left, top } = fit(fitOptions)
+                const { width, height } = fit(fitOptions)
 
-                this.center(width, height, left, top)
+                this.center(width, height)
                 this.zoomable()
             })
         })
@@ -554,13 +556,13 @@ export class Chocolat {
             imgWidth: this.elems.img.naturalWidth,
             containerHeight: this.elems.wrapper.clientHeight,
             containerWidth: this.elems.wrapper.clientWidth,
-            containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-            containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+            canvasWidth: this.elems.imageCanvas.clientWidth,
+            canvasHeight: this.elems.imageCanvas.clientHeight,
             imageSize: this.settings.imageSize,
         }
 
-        const { width, height, left, top } = fit(fitOptions)
-        return this.center(width, height, left, top)
+        const { width, height } = fit(fitOptions)
+        return this.center(width, height)
     }
 
     zoomOut(e) {
@@ -578,13 +580,13 @@ export class Chocolat {
             imgWidth: this.elems.img.naturalWidth,
             containerHeight: this.elems.wrapper.clientHeight,
             containerWidth: this.elems.wrapper.clientWidth,
-            containerGlobalWidth: this.elems.wrapper.clientWidth - this.getOutMarginW(),
-            containerGlobalHeight: this.elems.wrapper.clientHeight - this.getOutMarginH(),
+            canvasWidth: this.elems.imageCanvas.clientWidth,
+            canvasHeight: this.elems.imageCanvas.clientHeight,
             imageSize: this.settings.imageSize,
         }
 
-        const { width, height, left, top } = fit(fitOptions)
-        return this.center(width, height, left, top)
+        const { width, height } = fit(fitOptions)
+        return this.center(width, height)
     }
 
     on(element, eventName, cb) {
diff --git a/src/js/utils.js b/src/js/utils.js
index 1902a14..6878513 100644
--- a/src/js/utils.js
+++ b/src/js/utils.js
@@ -53,12 +53,12 @@ export function fit(options) {
         imgWidth,
         containerHeight,
         containerWidth,
-        containerGlobalWidth,
-        containerGlobalHeight,
+        canvasWidth,
+        canvasHeight,
         imageSize,
     } = options
 
-    const containerGlobalRatio = containerGlobalHeight / containerGlobalWidth
+    const canvasRatio = canvasHeight / canvasWidth
     const containerRatio = containerHeight / containerWidth
     const imgRatio = imgHeight / imgWidth
 
@@ -74,11 +74,11 @@ export function fit(options) {
         height = imgHeight
         width = imgWidth
     } else {
-        if (imgRatio > containerGlobalRatio) {
-            height = containerGlobalHeight
+        if (imgRatio > canvasRatio) {
+            height = canvasHeight
             width = height / imgRatio
         } else {
-            width = containerGlobalWidth
+            width = canvasWidth
             height = width * imgRatio
         }
         if (imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
@@ -90,8 +90,6 @@ export function fit(options) {
     return {
         height: height,
         width: width,
-        top: (containerHeight - height) / 2,
-        left: (containerWidth - width) / 2,
     }
 }
 
diff --git a/test/test.js b/test/test.js
index 9e884c3..45dabcb 100644
--- a/test/test.js
+++ b/test/test.js
@@ -25,7 +25,11 @@ describe('Chocolat', function() {
             expect($('#container').find('.chocolat-wrapper').length).to.equal(1)
             expect($('#container .chocolat-wrapper').find('.chocolat-overlay').length).to.equal(1)
             expect($('#container .chocolat-wrapper').find('.chocolat-loader').length).to.equal(1)
-            expect($('#container .chocolat-wrapper').find('.chocolat-content').length).to.equal(1)
+            expect($('#container .chocolat-wrapper').find('.chocolat-layout').length).to.equal(1)
+            expect(
+                $('#container .chocolat-wrapper').find('.chocolat-image-canvas').length
+            ).to.equal(1)
+            expect($('#container .chocolat-wrapper').find('.chocolat-center').length).to.equal(1)
             expect($('#container .chocolat-wrapper').find('.chocolat-top').length).to.equal(1)
             expect($('#container .chocolat-wrapper').find('.chocolat-bottom').length).to.equal(1)
             expect($('#container .chocolat-wrapper').find('.chocolat-left').length).to.equal(1)
@@ -37,7 +41,7 @@ describe('Chocolat', function() {
             )
             expect($('#container .chocolat-bottom').find('.chocolat-fullscreen').length).to.equal(1)
             expect($('#container .chocolat-bottom').find('.chocolat-set-title').length).to.equal(1)
-            expect($('#container .chocolat-content').find('.chocolat-img').length).to.equal(1)
+            expect($('#container .chocolat-image-wrapper').find('.chocolat-img').length).to.equal(1)
         })
 
         it('should add css classes to parent when in container', function(done) {
@@ -402,30 +406,6 @@ describe('Chocolat', function() {
                 return done()
             })
         })
-
-        return it('should center the image', function(done) {
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                imageSize: 'cover',
-            })
-
-            chocolat.api.open().then(function() {
-                var dim = getExpectedDimensions(chocolat)
-
-                var $content = $(chocolat.api.getElem('content'))
-
-                var top = parseInt($content.css('top'), 10)
-                var left = parseInt($content.css('left'), 10)
-
-                var targetTop = (dim.containerHeight - dim.imgHeight) / 2
-                var targetLeft = (dim.containerWidth - dim.imgWidth) / 2
-
-                // 1px delta, because of rounded values
-                expect(top).to.be.closeTo(targetTop, 1)
-                expect(left).to.be.closeTo(targetLeft, 1)
-
-                return done()
-            })
-        })
     })
 
     describe('ImageSize contain', function() {
@@ -438,16 +418,16 @@ describe('Chocolat', function() {
             chocolat.api.open().then(function() {
                 var dim = getExpectedDimensions(chocolat)
 
-                if (dim.imgRatio > dim.containerPaddedRatio) {
-                    var targetWidth = dim.containerPaddedHeight / dim.imgRatio
+                if (dim.imgRatio > dim.canvasRatio) {
+                    var targetWidth = dim.canvasHeight / dim.imgRatio
                     // 1px delta, because of rounded values
                     expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                    expect(dim.imgHeight).to.be.closeTo(dim.containerPaddedHeight, 1)
+                    expect(dim.imgHeight).to.be.closeTo(dim.canvasHeight, 1)
                 } else {
-                    var targetHeight = dim.containerPaddedWidth * dim.imgRatio
+                    var targetHeight = dim.canvasWidth * dim.imgRatio
                     // 1px delta, because of rounded values
                     expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
-                    expect(dim.imgWidth).to.be.closeTo(dim.containerPaddedWidth, 1)
+                    expect(dim.imgWidth).to.be.closeTo(dim.canvasWidth, 1)
                 }
 
                 return done()
@@ -462,45 +442,21 @@ describe('Chocolat', function() {
             chocolat.api.open().then(function() {
                 var dim = getExpectedDimensions(chocolat)
 
-                if (dim.imgRatio > dim.containerPaddedRatio) {
-                    var targetWidth = dim.containerPaddedHeight / dim.imgRatio
+                if (dim.imgRatio > dim.canvasRatio) {
+                    var targetWidth = dim.canvasHeight / dim.imgRatio
                     // 1px delta, because of rounded values
                     expect(dim.imgWidth).to.be.closeTo(targetWidth, 1)
-                    expect(dim.imgHeight).to.be.closeTo(dim.containerPaddedHeight, 1)
+                    expect(dim.imgHeight).to.be.closeTo(dim.canvasHeight, 1)
                 } else {
-                    var targetHeight = dim.containerPaddedWidth * dim.imgRatio
+                    var targetHeight = dim.canvasWidth * dim.imgRatio
                     // 1px delta, because of rounded values
                     expect(dim.imgHeight).to.be.closeTo(targetHeight, 1)
-                    expect(dim.imgWidth).to.be.closeTo(dim.containerPaddedWidth, 1)
+                    expect(dim.imgWidth).to.be.closeTo(dim.canvasWidth, 1)
                 }
 
                 return done()
             })
         })
-
-        return it('should center the image', function(done) {
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
-                imageSize: 'contain',
-            })
-
-            chocolat.api.open().then(function() {
-                var dim = getExpectedDimensions(chocolat)
-
-                var $content = $(chocolat.api.getElem('content'))
-
-                var top = parseInt($content.css('top'), 10)
-                var left = parseInt($content.css('left'), 10)
-
-                var targetTop = (dim.containerHeight - dim.imgHeight) / 2
-                var targetLeft = (dim.containerWidth - dim.imgWidth) / 2
-
-                // 1px delta, because of rounded values
-                expect(top).to.be.closeTo(targetTop, 1)
-                expect(left).to.be.closeTo(targetLeft, 1)
-
-                return done()
-            })
-        })
     })
 
     describe('API', function() {
@@ -571,32 +527,25 @@ function getExpectedDimensions(chocolat) {
     var imgWidth = chocolat.api.getElem('img').width
     var imgHeight = chocolat.api.getElem('img').height
 
-    var containerWidth = chocolat.api.getElem('wrapper').clientWidth
-    var containerHeight = chocolat.api.getElem('wrapper').clientHeight
-
-    var containerOutMarginH =
-        chocolat.api.getElem('top').offsetHeight + chocolat.api.getElem('bottom').offsetHeight
-    var containerOutMarginW =
-        chocolat.api.getElem('left').offsetWidth + chocolat.api.getElem('right').offsetWidth
+    var containerWidth = chocolat.api.getElem('container').clientWidth
+    var containerHeight = chocolat.api.getElem('container').clientHeight
 
-    var containerPaddedWidth = containerWidth - containerOutMarginW
-    var containerPaddedHeight = containerHeight - containerOutMarginH
+    var canvasWidth = chocolat.api.getElem('imageCanvas').clientWidth
+    var canvasHeight = chocolat.api.getElem('imageCanvas').clientHeight
 
     var imgRatio = imgHeight / imgWidth
     var containerRatio = containerHeight / containerWidth
-    var containerPaddedRatio = containerPaddedHeight / containerPaddedWidth
+    var canvasRatio = canvasHeight / canvasWidth
 
     return {
         imgWidth: imgWidth,
         imgHeight: imgHeight,
         containerWidth: containerWidth,
         containerHeight: containerHeight,
-        containerOutMarginH: containerOutMarginH,
-        containerOutMarginW: containerOutMarginW,
-        containerPaddedWidth: containerPaddedWidth,
-        containerPaddedHeight: containerPaddedHeight,
+        canvasWidth: canvasWidth,
+        canvasHeight: canvasHeight,
         imgRatio: imgRatio,
         containerRatio: containerRatio,
-        containerPaddedRatio: containerPaddedRatio,
+        canvasRatio: canvasRatio,
     }
 }

From d8ba48972192a75e664ae9ea0e56a7003325f727 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 10 Nov 2019 21:31:43 +0100
Subject: [PATCH 41/65] Renamed undocumented backgroundClose option

---
 dist/js/chocolat.cjs.js  |  5 +++--
 dist/js/chocolat.esm.js  |  5 +++--
 dist/js/chocolat.iife.js |  5 +++--
 src/js/chocolat.js       |  5 +++--
 test/test.js             | 15 +++++----------
 5 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index f450ccc..747d1de 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -127,6 +127,7 @@ const defaults = {
   lastImageIndex: false,
   currentImageIndex: undefined,
   allowZoom: true,
+  closeOnBackgroundClick: true,
   setTitle: function () {
     return '';
   },
@@ -274,7 +275,7 @@ class Chocolat {
       return Promise.all([position, appear]);
     }).then(() => {
       this.zoomable();
-      this.settings.afterImageLoad();
+      this.settings.afterImageLoad.call(this);
     });
   }
 
@@ -495,7 +496,7 @@ class Chocolat {
       this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     });
 
-    if (this.settings.backgroundClose) {
+    if (this.settings.closeOnBackgroundClick) {
       this.off(this.elems.overlay, 'click.chocolat');
       this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this));
     }
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 71c9021..07437aa 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -125,6 +125,7 @@ const defaults = {
   lastImageIndex: false,
   currentImageIndex: undefined,
   allowZoom: true,
+  closeOnBackgroundClick: true,
   setTitle: function () {
     return '';
   },
@@ -272,7 +273,7 @@ class Chocolat {
       return Promise.all([position, appear]);
     }).then(() => {
       this.zoomable();
-      this.settings.afterImageLoad();
+      this.settings.afterImageLoad.call(this);
     });
   }
 
@@ -493,7 +494,7 @@ class Chocolat {
       this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     });
 
-    if (this.settings.backgroundClose) {
+    if (this.settings.closeOnBackgroundClick) {
       this.off(this.elems.overlay, 'click.chocolat');
       this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this));
     }
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index aee51ac..1d705b3 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -128,6 +128,7 @@
       lastImageIndex: false,
       currentImageIndex: undefined,
       allowZoom: true,
+      closeOnBackgroundClick: true,
       setTitle: function () {
         return '';
       },
@@ -275,7 +276,7 @@
           return Promise.all([position, appear]);
         }).then(() => {
           this.zoomable();
-          this.settings.afterImageLoad();
+          this.settings.afterImageLoad.call(this);
         });
       }
 
@@ -496,7 +497,7 @@
           this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
         });
 
-        if (this.settings.backgroundClose) {
+        if (this.settings.closeOnBackgroundClick) {
           this.off(this.elems.overlay, 'click.chocolat');
           this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this));
         }
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 5eaea28..b9bf74c 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -19,6 +19,7 @@ export const defaults = {
     lastImageIndex: false,
     currentImageIndex: undefined,
     allowZoom: true,
+    closeOnBackgroundClick: true,
     setTitle: function() {
         return ''
     },
@@ -195,7 +196,7 @@ export class Chocolat {
             })
             .then(() => {
                 this.zoomable()
-                this.settings.afterImageLoad()
+                this.settings.afterImageLoad.call(this)
             })
     }
 
@@ -439,7 +440,7 @@ export class Chocolat {
             this.state.fullScreenOpen = openFullScreen(this.elems.wrapper)
         })
 
-        if (this.settings.backgroundClose) {
+        if (this.settings.closeOnBackgroundClick) {
             this.off(this.elems.overlay, 'click.chocolat')
             this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this))
         }
diff --git a/test/test.js b/test/test.js
index 45dabcb..a6514e9 100644
--- a/test/test.js
+++ b/test/test.js
@@ -461,16 +461,11 @@ describe('Chocolat', function() {
 
     describe('API', function() {
         before(function() {
-            chocolat = Chocolat(
-                [
-                    { src: '../demo/demo-images/1.jpg', title: 'You can zoom in the image' },
-                    { src: '../demo/demo-images/2.jpg', title: 'You can zoom in the image' },
-                    { src: '../demo/demo-images/3.jpg', title: 'You can zoom in the image' },
-                ],
-                {
-                    backgroundClose: false,
-                }
-            )
+            chocolat = Chocolat([
+                { src: '../demo/demo-images/1.jpg', title: 'You can zoom in the image' },
+                { src: '../demo/demo-images/2.jpg', title: 'You can zoom in the image' },
+                { src: '../demo/demo-images/3.jpg', title: 'You can zoom in the image' },
+            ])
         })
 
         it('should have a open method', function() {

From bd5abe3f57c99108bc35eeb79afe2243e3b54c36 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 10 Nov 2019 21:35:41 +0100
Subject: [PATCH 42/65] Update readme.md

---
 readme.md | 12 +++++-------
 1 file changed, 5 insertions(+), 7 deletions(-)

diff --git a/readme.md b/readme.md
index eb9c909..a2ae210 100644
--- a/readme.md
+++ b/readme.md
@@ -8,19 +8,17 @@ Chocolat is a responsive lightbox
 
 ## Documentation
 -----------
-
-[Documentation](https://chocolat.gitbook.io/chocolat/)
+You can access the full documentation at this page :   
+[Documentation](https://chocolat.gitbook.io/chocolat/)   
+If you have trouble using Chocolat, or want to report a bug, please open an issue here : 
+https://github.com/nicolas-t/Chocolat/issues/new
 
 
 ## Upgrading
 -----------
-
+A few breaking changes have been made between v0.4 and v1 :
 [Upgrading](https://chocolat.gitbook.io/chocolat/upgrading-from-v0.4)
 
-## Contributing
------------
-[Contributing](https://chocolat.gitbook.io/chocolat/contributing)
-
 
 ## License
 -----------

From 1a7bb9060415cd2e777497b43042eede2577e03f Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 10 Nov 2019 21:40:07 +0100
Subject: [PATCH 43/65] Bumped version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 2dc8856..92f3b30 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "chocolat",
-  "version": "1.0.0",
+  "version": "1.0.0-beta.1",
   "description": "Responsive Lightbox Plugin",
   "main": "dist/js/chocolat.cjs.js",
   "module": "dist/js/chocolat.esm.js",

From effa47533b4c9f41a69ae83725ce35ea6e1097bb Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Sun, 10 Nov 2019 22:39:28 +0100
Subject: [PATCH 44/65] Removed IIFE from package.json because we dont want it
 to be importer by bundlers

---
 package.json | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/package.json b/package.json
index 92f3b30..e96f97d 100644
--- a/package.json
+++ b/package.json
@@ -1,10 +1,9 @@
 {
   "name": "chocolat",
-  "version": "1.0.0-beta.1",
+  "version": "1.0.0-beta.2",
   "description": "Responsive Lightbox Plugin",
   "main": "dist/js/chocolat.cjs.js",
   "module": "dist/js/chocolat.esm.js",
-  "browser": "dist/js/chocolat.iife.js",
   "directories": {
     "test": "test"
   },

From 9cf882c054ea3b46e1a8704b327e38a2094c01c4 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 11 Nov 2019 18:38:59 +0100
Subject: [PATCH 45/65] Renamed iife bundle, and fixed rollup config

---
 demo/index.html  |  2 +-
 rollup.config.js | 11 +++++++----
 test/index.html  |  2 +-
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index 3b3357b..b05422d 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -3,7 +3,7 @@
     <head>
         <meta charset="utf-8" />
         <link rel="stylesheet" href="../dist/css/chocolat.css" />
-        <script type="text/javascript" src="../dist/js/chocolat.iife.js"></script>
+        <script type="text/javascript" src="../dist/js/chocolat.js"></script>
         <style>
             body {
                 text-align: center;
diff --git a/rollup.config.js b/rollup.config.js
index bcd6323..a9596e0 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -7,10 +7,13 @@ import pkg from './package.json'
 export default [
     // browser-friendly UMD build
     {
-        entry: 'src/js/main.iife.js',
+        input: 'src/js/main.iife.js',
         dest: pkg.browser,
-        format: 'iife',
-        moduleName: 'chocolat',
+        output: {
+            name: 'chocolat',
+            format: 'iife',
+            file: 'dist/js/chocolat.js'
+        },
         plugins: [
             resolve(),
             commonjs(),
@@ -31,7 +34,7 @@ export default [
     // builds from a single configuration where possible, using
     // the `targets` option which can specify `dest` and `format`)
     {
-        entry: 'src/js/main.esm.js',
+        input: 'src/js/main.esm.js',
         external: ['es6-promise/auto'],
         targets: [
             { dest: pkg.main, format: 'cjs' },
diff --git a/test/index.html b/test/index.html
index 8f55bec..3ed3cd8 100644
--- a/test/index.html
+++ b/test/index.html
@@ -27,7 +27,7 @@
     <script src="../node_modules/chai/chai.js"></script>
     <script src="../node_modules/sinon/pkg/sinon.js"></script>
     <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
-    <script src="../dist/js/chocolat.iife.js"></script>
+    <script src="../dist/js/chocolat.js"></script>
     <script>
         mocha.setup('bdd')
         mocha.reporter('html');

From 8830c25b018a7971123fc481ffe18db9d69e8fb4 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 11 Nov 2019 18:40:38 +0100
Subject: [PATCH 46/65] Improved preloading and fix white flickering

---
 dist/css/chocolat.css    |   7 +-
 dist/js/chocolat.cjs.js  | 107 +++---
 dist/js/chocolat.esm.js  | 107 +++---
 dist/js/chocolat.iife.js |  86 +++--
 dist/js/chocolat.js      | 703 +++++++++++++++++++++++++++++++++++++++
 src/css/chocolat.css     |   7 +-
 src/js/chocolat.js       |  69 ++--
 src/js/utils.js          |  38 ++-
 8 files changed, 969 insertions(+), 155 deletions(-)
 create mode 100644 dist/js/chocolat.js

diff --git a/dist/css/chocolat.css b/dist/css/chocolat.css
index 034a219..4e6f3bb 100644
--- a/dist/css/chocolat.css
+++ b/dist/css/chocolat.css
@@ -61,7 +61,7 @@
 }
 
 .chocolat-image-wrapper {
-    transition: top 0.2s ease, left 0.2s ease, width 0.2s ease, height 0.2s ease; /* center */
+    transition: width 0s ease, height 0s ease; /* center */
     position: fixed;
     width: 0px;
     height: 0px;
@@ -97,9 +97,14 @@
     right: 0;
 }
 .chocolat-image-canvas {
+    transition: opacity 0s;
+    opacity: 0;
     flex-grow: 1;
     align-self: stretch;
 }
+.chocolat-image-canvas.chocolat-visible {
+    opacity: 1;
+}
 .chocolat-center {
     flex-grow: 1;
     display: flex;
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 747d1de..7f7eacb 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -23,17 +23,41 @@ function transitionAsPromise(triggeringFunc, el) {
     if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
       handleTransitionEnd();
     }
+
+    if (parseFloat(getComputedStyle(el)['transitionDuration']) === 0) {
+      handleTransitionEnd();
+    }
   });
-}
-function loadImage(src, image) {
+} // export function loadImage(src, image) {
+//     if ('decode' in image) {
+//         image.src = src
+//         return image.decode()
+//     } else {
+//         return new Promise(function(resolve, reject) {
+//             image.onload = resolve
+//             image.onerror = resolve
+//             image.src = src
+//         })
+//     }
+// }
+
+function loadImage(path) {
+  let image = new Image();
+
   if ('decode' in image) {
-    image.src = src;
-    return image.decode();
+    return new Promise((resolve, reject) => {
+      image.src = path;
+      image.decode().then(() => {
+        resolve(image);
+      }).catch(() => {
+        reject(image);
+      });
+    });
   } else {
-    return new Promise(function (resolve, reject) {
-      image.onload = resolve;
-      image.onerror = resolve;
-      image.src = src;
+    return new Promise((resolve, reject) => {
+      image.onload = resolve(image);
+      image.onerror = reject(image);
+      image.src = path;
     });
   }
 }
@@ -242,12 +266,12 @@ class Chocolat {
     return this.load(i);
   }
 
-  load(i) {
+  load(index) {
     if (this.settings.fullScreen) {
       this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     }
 
-    if (this.settings.currentImageIndex === i) {
+    if (this.settings.currentImageIndex === index) {
       return Promise.resolve();
     }
 
@@ -257,35 +281,41 @@ class Chocolat {
     }, 0);
     this.elems.container.classList.add('chocolat-open');
     this.state.timer = setTimeout(() => {
-      if (this.elems !== undefined) {
-        this.elems.loader.classList.add('chocolat-visible');
-      }
-    }, 300);
-    const imgLoader = new Image();
-    return loadImage(this.images[i].src, imgLoader).then(() => {
-      const nextIndex = i + 1;
+      this.elems.loader.classList.add('chocolat-visible');
+    }, 1000);
+    return loadImage(this.images[index].src).then(image => {
+      return transitionAsPromise(() => {
+        this.elems.imageCanvas.classList.remove('chocolat-visible');
+      }, this.elems.imageCanvas).then(() => {
+        return Promise.resolve(image);
+      });
+    }).then(image => {
+      const nextIndex = index + 1;
 
       if (this.images[nextIndex] != undefined) {
-        loadImage(this.images[nextIndex].src, new Image());
+        loadImage(this.images[nextIndex].src);
       }
 
-      this.settings.currentImageIndex = i;
-      const position = this.position(imgLoader);
-      const appear = this.appear(i);
-      return Promise.all([position, appear]);
+      this.settings.currentImageIndex = index;
+      this.elems.description.textContent = this.settings.description.call(this);
+      this.elems.pagination.textContent = this.settings.pagination.call(this);
+      this.arrows();
+      return this.position(image).then(() => {
+        return this.appear(image);
+      });
     }).then(() => {
       this.zoomable();
       this.settings.afterImageLoad.call(this);
     });
   }
 
-  position(image) {
-    this.elems.description.textContent = this.settings.description.call(this);
-    this.elems.pagination.textContent = this.settings.pagination.call(this);
-    this.arrows();
+  position({
+    naturalHeight,
+    naturalWidth
+  }) {
     const fitOptions = {
-      imgHeight: image.naturalHeight,
-      imgWidth: image.naturalWidth,
+      imgHeight: naturalHeight,
+      imgWidth: naturalWidth,
       containerHeight: this.elems.container.clientHeight,
       containerWidth: this.elems.container.clientWidth,
       canvasWidth: this.elems.imageCanvas.clientWidth,
@@ -308,18 +338,17 @@ class Chocolat {
     }, this.elems.imageWrapper);
   }
 
-  appear(i) {
+  appear(image) {
     clearTimeout(this.state.timer);
-
-    if (!this.elems.loader.classList.contains('chocolat-visible')) {
-      return loadImage(this.images[i].src, this.elems.img);
-    }
-
-    return transitionAsPromise(() => {
-      this.elems.loader.classList.remove('chocolat-visible');
-    }, this.elems.loader).then(() => {
-      return loadImage(this.images[i].src, this.elems.img);
-    });
+    this.elems.loader.classList.remove('chocolat-visible');
+    this.elems.img = image;
+    this.elems.imageWrapper.innerHTML = '';
+    this.elems.img.setAttribute('class', 'chocolat-img');
+    this.elems.imageWrapper.appendChild(this.elems.img);
+    const fadeInPromise = transitionAsPromise(() => {
+      this.elems.imageCanvas.classList.add('chocolat-visible');
+    }, this.elems.imageCanvas);
+    return fadeInPromise;
   }
 
   change(step) {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 07437aa..7e34bcc 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -21,17 +21,41 @@ function transitionAsPromise(triggeringFunc, el) {
     if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
       handleTransitionEnd();
     }
+
+    if (parseFloat(getComputedStyle(el)['transitionDuration']) === 0) {
+      handleTransitionEnd();
+    }
   });
-}
-function loadImage(src, image) {
+} // export function loadImage(src, image) {
+//     if ('decode' in image) {
+//         image.src = src
+//         return image.decode()
+//     } else {
+//         return new Promise(function(resolve, reject) {
+//             image.onload = resolve
+//             image.onerror = resolve
+//             image.src = src
+//         })
+//     }
+// }
+
+function loadImage(path) {
+  let image = new Image();
+
   if ('decode' in image) {
-    image.src = src;
-    return image.decode();
+    return new Promise((resolve, reject) => {
+      image.src = path;
+      image.decode().then(() => {
+        resolve(image);
+      }).catch(() => {
+        reject(image);
+      });
+    });
   } else {
-    return new Promise(function (resolve, reject) {
-      image.onload = resolve;
-      image.onerror = resolve;
-      image.src = src;
+    return new Promise((resolve, reject) => {
+      image.onload = resolve(image);
+      image.onerror = reject(image);
+      image.src = path;
     });
   }
 }
@@ -240,12 +264,12 @@ class Chocolat {
     return this.load(i);
   }
 
-  load(i) {
+  load(index) {
     if (this.settings.fullScreen) {
       this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     }
 
-    if (this.settings.currentImageIndex === i) {
+    if (this.settings.currentImageIndex === index) {
       return Promise.resolve();
     }
 
@@ -255,35 +279,41 @@ class Chocolat {
     }, 0);
     this.elems.container.classList.add('chocolat-open');
     this.state.timer = setTimeout(() => {
-      if (this.elems !== undefined) {
-        this.elems.loader.classList.add('chocolat-visible');
-      }
-    }, 300);
-    const imgLoader = new Image();
-    return loadImage(this.images[i].src, imgLoader).then(() => {
-      const nextIndex = i + 1;
+      this.elems.loader.classList.add('chocolat-visible');
+    }, 1000);
+    return loadImage(this.images[index].src).then(image => {
+      return transitionAsPromise(() => {
+        this.elems.imageCanvas.classList.remove('chocolat-visible');
+      }, this.elems.imageCanvas).then(() => {
+        return Promise.resolve(image);
+      });
+    }).then(image => {
+      const nextIndex = index + 1;
 
       if (this.images[nextIndex] != undefined) {
-        loadImage(this.images[nextIndex].src, new Image());
+        loadImage(this.images[nextIndex].src);
       }
 
-      this.settings.currentImageIndex = i;
-      const position = this.position(imgLoader);
-      const appear = this.appear(i);
-      return Promise.all([position, appear]);
+      this.settings.currentImageIndex = index;
+      this.elems.description.textContent = this.settings.description.call(this);
+      this.elems.pagination.textContent = this.settings.pagination.call(this);
+      this.arrows();
+      return this.position(image).then(() => {
+        return this.appear(image);
+      });
     }).then(() => {
       this.zoomable();
       this.settings.afterImageLoad.call(this);
     });
   }
 
-  position(image) {
-    this.elems.description.textContent = this.settings.description.call(this);
-    this.elems.pagination.textContent = this.settings.pagination.call(this);
-    this.arrows();
+  position({
+    naturalHeight,
+    naturalWidth
+  }) {
     const fitOptions = {
-      imgHeight: image.naturalHeight,
-      imgWidth: image.naturalWidth,
+      imgHeight: naturalHeight,
+      imgWidth: naturalWidth,
       containerHeight: this.elems.container.clientHeight,
       containerWidth: this.elems.container.clientWidth,
       canvasWidth: this.elems.imageCanvas.clientWidth,
@@ -306,18 +336,17 @@ class Chocolat {
     }, this.elems.imageWrapper);
   }
 
-  appear(i) {
+  appear(image) {
     clearTimeout(this.state.timer);
-
-    if (!this.elems.loader.classList.contains('chocolat-visible')) {
-      return loadImage(this.images[i].src, this.elems.img);
-    }
-
-    return transitionAsPromise(() => {
-      this.elems.loader.classList.remove('chocolat-visible');
-    }, this.elems.loader).then(() => {
-      return loadImage(this.images[i].src, this.elems.img);
-    });
+    this.elems.loader.classList.remove('chocolat-visible');
+    this.elems.img = image;
+    this.elems.imageWrapper.innerHTML = '';
+    this.elems.img.setAttribute('class', 'chocolat-img');
+    this.elems.imageWrapper.appendChild(this.elems.img);
+    const fadeInPromise = transitionAsPromise(() => {
+      this.elems.imageCanvas.classList.add('chocolat-visible');
+    }, this.elems.imageCanvas);
+    return fadeInPromise;
   }
 
   change(step) {
diff --git a/dist/js/chocolat.iife.js b/dist/js/chocolat.iife.js
index 1d705b3..9e9ed39 100644
--- a/dist/js/chocolat.iife.js
+++ b/dist/js/chocolat.iife.js
@@ -25,16 +25,36 @@
           handleTransitionEnd();
         }
       });
-    }
-    function loadImage(src, image) {
+    } // export function loadImage(src, image) {
+    //     if ('decode' in image) {
+    //         image.src = src
+    //         return image.decode()
+    //     } else {
+    //         return new Promise(function(resolve, reject) {
+    //             image.onload = resolve
+    //             image.onerror = resolve
+    //             image.src = src
+    //         })
+    //     }
+    // }
+
+    function loadImage(path) {
+      let image = new Image();
+
       if ('decode' in image) {
-        image.src = src;
-        return image.decode();
+        return new Promise((resolve, reject) => {
+          image.src = path;
+          image.decode().then(() => {
+            resolve(image);
+          }).catch(() => {
+            reject(image);
+          });
+        });
       } else {
-        return new Promise(function (resolve, reject) {
-          image.onload = resolve;
-          image.onerror = resolve;
-          image.src = src;
+        return new Promise((resolve, reject) => {
+          image.onload = resolve(image);
+          image.onerror = reject(image);
+          image.src = path;
         });
       }
     }
@@ -243,12 +263,12 @@
         return this.load(i);
       }
 
-      load(i) {
+      load(index) {
         if (this.settings.fullScreen) {
           this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
         }
 
-        if (this.settings.currentImageIndex === i) {
+        if (this.settings.currentImageIndex === index) {
           return Promise.resolve();
         }
 
@@ -262,31 +282,32 @@
             this.elems.loader.classList.add('chocolat-visible');
           }
         }, 300);
-        const imgLoader = new Image();
-        return loadImage(this.images[i].src, imgLoader).then(() => {
-          const nextIndex = i + 1;
+        this.elems.description.textContent = this.settings.description.call(this);
+        this.elems.pagination.textContent = this.settings.pagination.call(this);
+        this.arrows();
+        return loadImage(this.images[index].src).then(image => {
+          const nextIndex = index + 1;
 
           if (this.images[nextIndex] != undefined) {
-            loadImage(this.images[nextIndex].src, new Image());
+            loadImage(this.images[nextIndex].src);
           }
 
-          this.settings.currentImageIndex = i;
-          const position = this.position(imgLoader);
-          const appear = this.appear(i);
-          return Promise.all([position, appear]);
+          this.settings.currentImageIndex = index;
+          this.appear(image);
+          return this.position(image);
         }).then(() => {
           this.zoomable();
           this.settings.afterImageLoad.call(this);
         });
       }
 
-      position(image) {
-        this.elems.description.textContent = this.settings.description.call(this);
-        this.elems.pagination.textContent = this.settings.pagination.call(this);
-        this.arrows();
+      position({
+        naturalHeight,
+        naturalWidth
+      }) {
         const fitOptions = {
-          imgHeight: image.naturalHeight,
-          imgWidth: image.naturalWidth,
+          imgHeight: naturalHeight,
+          imgWidth: naturalWidth,
           containerHeight: this.elems.container.clientHeight,
           containerWidth: this.elems.container.clientWidth,
           canvasWidth: this.elems.imageCanvas.clientWidth,
@@ -309,18 +330,13 @@
         }, this.elems.imageWrapper);
       }
 
-      appear(i) {
+      appear(image) {
         clearTimeout(this.state.timer);
-
-        if (!this.elems.loader.classList.contains('chocolat-visible')) {
-          return loadImage(this.images[i].src, this.elems.img);
-        }
-
-        return transitionAsPromise(() => {
-          this.elems.loader.classList.remove('chocolat-visible');
-        }, this.elems.loader).then(() => {
-          return loadImage(this.images[i].src, this.elems.img);
-        });
+        this.elems.loader.classList.remove('chocolat-visible');
+        this.elems.img = image;
+        this.elems.img.setAttribute('class', 'chocolat-img');
+        this.elems.imageWrapper.innerHTML = '';
+        this.elems.imageWrapper.appendChild(this.elems.img);
       }
 
       change(step) {
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
new file mode 100644
index 0000000..ed52469
--- /dev/null
+++ b/dist/js/chocolat.js
@@ -0,0 +1,703 @@
+(function () {
+    'use strict';
+
+    let timerDebounce = undefined;
+    function debounce(duration, callback) {
+      clearTimeout(timerDebounce);
+      timerDebounce = setTimeout(function () {
+        callback();
+      }, duration);
+      return timerDebounce;
+    }
+    function transitionAsPromise(triggeringFunc, el) {
+      return new Promise(resolve => {
+        const handleTransitionEnd = () => {
+          el.removeEventListener('transitionend', handleTransitionEnd);
+          resolve();
+        };
+
+        el.addEventListener('transitionend', handleTransitionEnd);
+        const classesBefore = el.getAttribute('class');
+        const stylesBefore = el.getAttribute('style');
+        triggeringFunc();
+
+        if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
+          handleTransitionEnd();
+        }
+
+        if (parseFloat(getComputedStyle(el)['transitionDuration']) === 0) {
+          handleTransitionEnd();
+        }
+      });
+    } // export function loadImage(src, image) {
+    //     if ('decode' in image) {
+    //         image.src = src
+    //         return image.decode()
+    //     } else {
+    //         return new Promise(function(resolve, reject) {
+    //             image.onload = resolve
+    //             image.onerror = resolve
+    //             image.src = src
+    //         })
+    //     }
+    // }
+
+    function loadImage(path) {
+      let image = new Image();
+
+      if ('decode' in image) {
+        return new Promise((resolve, reject) => {
+          image.src = path;
+          image.decode().then(() => {
+            resolve(image);
+          }).catch(() => {
+            reject(image);
+          });
+        });
+      } else {
+        return new Promise((resolve, reject) => {
+          image.onload = resolve(image);
+          image.onerror = reject(image);
+          image.src = path;
+        });
+      }
+    }
+    function fit(options) {
+      let height;
+      let width;
+      const {
+        imgHeight,
+        imgWidth,
+        containerHeight,
+        containerWidth,
+        canvasWidth,
+        canvasHeight,
+        imageSize
+      } = options;
+      const canvasRatio = canvasHeight / canvasWidth;
+      const containerRatio = containerHeight / containerWidth;
+      const imgRatio = imgHeight / imgWidth;
+
+      if (imageSize == 'cover') {
+        if (imgRatio < containerRatio) {
+          height = containerHeight;
+          width = height / imgRatio;
+        } else {
+          width = containerWidth;
+          height = width * imgRatio;
+        }
+      } else if (imageSize == 'native') {
+        height = imgHeight;
+        width = imgWidth;
+      } else {
+        if (imgRatio > canvasRatio) {
+          height = canvasHeight;
+          width = height / imgRatio;
+        } else {
+          width = canvasWidth;
+          height = width * imgRatio;
+        }
+
+        if (imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
+          width = imgWidth;
+          height = imgHeight;
+        }
+      }
+
+      return {
+        height: height,
+        width: width
+      };
+    }
+    function openFullScreen(wrapper) {
+      if (wrapper.requestFullscreen) {
+        wrapper.requestFullscreen();
+        return true;
+      } else if (wrapper.webkitRequestFullscreen) {
+        wrapper.webkitRequestFullscreen();
+        return true;
+      } else if (wrapper.msRequestFullscreen) {
+        wrapper.msRequestFullscreen();
+        return true;
+      } else {
+        return false;
+      }
+    }
+    function exitFullScreen() {
+      if (document.exitFullscreen) {
+        document.exitFullscreen();
+        return false;
+      } else if (document.webkitExitFullscreen) {
+        document.webkitExitFullscreen();
+        return false;
+      } else if (document.msExitFullscreen) {
+        document.msExitFullscreen();
+        return false;
+      } else {
+        return true;
+      }
+    }
+
+    const defaults = {
+      container: document.body,
+      // window or element
+      className: undefined,
+      imageSize: 'scale-down',
+      // 'scale-down', 'contain', 'cover' or 'native'
+      fullScreen: false,
+      loop: false,
+      linkImages: true,
+      setIndex: 0,
+      firstImageIndex: 0,
+      lastImageIndex: false,
+      currentImageIndex: undefined,
+      allowZoom: true,
+      closeOnBackgroundClick: true,
+      setTitle: function () {
+        return '';
+      },
+      description: function () {
+        return this.images[this.settings.currentImageIndex].title;
+      },
+      pagination: function () {
+        const last = this.settings.lastImageIndex + 1;
+        const position = this.settings.currentImageIndex + 1;
+        return position + '/' + last;
+      },
+
+      afterInitialize() {},
+
+      afterMarkup() {},
+
+      afterImageLoad() {},
+
+      zoomedPaddingX: function (canvasWidth, imgWidth) {
+        return 0;
+      },
+      zoomedPaddingY: function (canvasHeight, imgHeight) {
+        return 0;
+      }
+    };
+    class Chocolat {
+      constructor(elements, settings) {
+        this.settings = settings;
+        this.elems = {};
+        this.images = [];
+        this.events = [];
+        this.state = {
+          fullScreenOpen: false,
+          initialZoomState: null,
+          initialized: false,
+          timer: false
+        };
+        this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
+
+        if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
+          elements.forEach((el, i) => {
+            this.images.push({
+              title: el.getAttribute('title'),
+              src: el.getAttribute('href'),
+              height: undefined,
+              width: undefined
+            });
+            this.off(el, 'click.chocolat');
+            this.on(el, 'click.chocolat', e => {
+              this.init(i);
+              e.preventDefault();
+            });
+          });
+        } else {
+          this.images = elements;
+        }
+
+        if (this.settings.container instanceof Element || this.settings.container instanceof HTMLElement) {
+          this.elems.container = this.settings.container;
+        } else {
+          this.elems.container = document.body;
+        }
+
+        this.api = {
+          open: i => {
+            i = parseInt(i) || 0;
+            return this.init(i);
+          },
+          close: () => {
+            return this.close();
+          },
+          next: () => {
+            return this.change(1);
+          },
+          prev: () => {
+            return this.change(-1);
+          },
+          goto: i => {
+            return this.open(i);
+          },
+          current: () => {
+            return this.settings.currentImageIndex;
+          },
+          position: () => {
+            return this.position(this.elems.img);
+          },
+          destroy: () => {
+            return this.destroy();
+          },
+          set: (property, value) => {
+            this.settings[property] = value;
+            return value;
+          },
+          get: property => {
+            return this.settings[property];
+          },
+          getElem: name => {
+            return this.elems[name];
+          }
+        };
+      }
+
+      init(i) {
+        if (!this.state.initialized) {
+          this.markup();
+          this.attachListeners();
+          this.settings.lastImageIndex = this.images.length - 1;
+          this.state.initialized = true;
+        }
+
+        this.settings.afterInitialize.call(this);
+        return this.load(i);
+      }
+
+      load(index) {
+        if (this.settings.fullScreen) {
+          this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
+        }
+
+        if (this.settings.currentImageIndex === index) {
+          return Promise.resolve();
+        }
+
+        setTimeout(() => {
+          this.elems.overlay.classList.add('chocolat-visible');
+          this.elems.wrapper.classList.add('chocolat-visible');
+        }, 0);
+        this.elems.container.classList.add('chocolat-open');
+        this.state.timer = setTimeout(() => {
+          this.elems.loader.classList.add('chocolat-visible');
+        }, 1000);
+        return loadImage(this.images[index].src).then(image => {
+          return transitionAsPromise(() => {
+            this.elems.imageCanvas.classList.remove('chocolat-visible');
+          }, this.elems.imageCanvas).then(() => {
+            return Promise.resolve(image);
+          });
+        }).then(image => {
+          const nextIndex = index + 1;
+
+          if (this.images[nextIndex] != undefined) {
+            loadImage(this.images[nextIndex].src);
+          }
+
+          this.settings.currentImageIndex = index;
+          this.elems.description.textContent = this.settings.description.call(this);
+          this.elems.pagination.textContent = this.settings.pagination.call(this);
+          this.arrows();
+          return this.position(image).then(() => {
+            return this.appear(image);
+          });
+        }).then(() => {
+          this.zoomable();
+          this.settings.afterImageLoad.call(this);
+        });
+      }
+
+      position({
+        naturalHeight,
+        naturalWidth
+      }) {
+        const fitOptions = {
+          imgHeight: naturalHeight,
+          imgWidth: naturalWidth,
+          containerHeight: this.elems.container.clientHeight,
+          containerWidth: this.elems.container.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
+          imageSize: this.settings.imageSize
+        };
+        const {
+          width,
+          height
+        } = fit(fitOptions);
+        return this.center(width, height);
+      }
+
+      center(width, height) {
+        return transitionAsPromise(() => {
+          Object.assign(this.elems.imageWrapper.style, {
+            width: width + 'px',
+            height: height + 'px'
+          });
+        }, this.elems.imageWrapper);
+      }
+
+      appear(image) {
+        clearTimeout(this.state.timer);
+        this.elems.loader.classList.remove('chocolat-visible');
+        this.elems.img = image;
+        this.elems.imageWrapper.innerHTML = '';
+        this.elems.img.setAttribute('class', 'chocolat-img');
+        this.elems.imageWrapper.appendChild(this.elems.img);
+        const fadeInPromise = transitionAsPromise(() => {
+          this.elems.imageCanvas.classList.add('chocolat-visible');
+        }, this.elems.imageCanvas);
+        return fadeInPromise;
+      }
+
+      change(step) {
+        this.zoomOut();
+        this.zoomable();
+        const requestedImage = this.settings.currentImageIndex + parseInt(step);
+
+        if (requestedImage > this.settings.lastImageIndex) {
+          if (this.settings.loop) {
+            return this.load(this.settings.firstImageIndex);
+          }
+        } else if (requestedImage < this.settings.firstImageIndex) {
+          if (this.settings.loop) {
+            return this.load(this.settings.lastImageIndex);
+          }
+        } else {
+          return this.load(requestedImage);
+        }
+      }
+
+      arrows() {
+        if (this.settings.loop) {
+          this.elems.left.classList.add('active');
+          this.elems.right.classList.add('active');
+        } else if (this.settings.linkImages) {
+          this.elems.right.classList.toggle('active', this.settings.currentImageIndex !== this.settings.lastImageIndex);
+          this.elems.left.classList.toggle('active', this.settings.currentImageIndex !== this.settings.firstImageIndex);
+        } else {
+          this.elems.left.classList.remove('active');
+          this.elems.right.classList.remove('active');
+        }
+      }
+
+      close() {
+        if (this.state.fullScreenOpen) {
+          this.state.fullScreenOpen = exitFullScreen();
+          return;
+        }
+
+        this.settings.currentImageIndex = undefined;
+        const promiseOverlay = transitionAsPromise(() => {
+          this.elems.overlay.classList.remove('chocolat-visible');
+        }, this.elems.overlay);
+        const promiseWrapper = transitionAsPromise(() => {
+          this.elems.wrapper.classList.remove('chocolat-visible');
+        }, this.elems.wrapper);
+        return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
+          this.elems.container.classList.remove('chocolat-open');
+        });
+      }
+
+      destroy() {
+        for (let i = this.events.length - 1; i >= 0; i--) {
+          const {
+            element,
+            eventName
+          } = this.events[i];
+          this.off(element, eventName);
+        }
+
+        if (!this.state.initialized) {
+          return;
+        }
+
+        if (this.state.fullScreenOpen) {
+          this.state.fullScreenOpen = exitFullScreen();
+        }
+
+        this.settings.currentImageIndex = undefined;
+        this.state.initialized = false;
+        this.elems.container.classList.remove(...this._cssClasses);
+        this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
+      }
+
+      markup() {
+        this.elems.container.classList.add('chocolat-open', this.settings.className);
+
+        if (this.settings.imageSize == 'cover') {
+          this.elems.container.classList.add('chocolat-cover');
+        }
+
+        if (this.elems.container !== document.body) {
+          this.elems.container.classList.add('chocolat-in-container');
+        }
+
+        this.elems.wrapper = document.createElement('div');
+        this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
+        this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
+        this.elems.container.appendChild(this.elems.wrapper);
+        this.elems.overlay = document.createElement('div');
+        this.elems.overlay.setAttribute('class', 'chocolat-overlay');
+        this.elems.wrapper.appendChild(this.elems.overlay);
+        this.elems.loader = document.createElement('div');
+        this.elems.loader.setAttribute('class', 'chocolat-loader');
+        this.elems.wrapper.appendChild(this.elems.loader);
+        this.elems.layout = document.createElement('div');
+        this.elems.layout.setAttribute('class', 'chocolat-layout');
+        this.elems.wrapper.appendChild(this.elems.layout);
+        this.elems.top = document.createElement('div');
+        this.elems.top.setAttribute('class', 'chocolat-top');
+        this.elems.layout.appendChild(this.elems.top);
+        this.elems.center = document.createElement('div');
+        this.elems.center.setAttribute('class', 'chocolat-center');
+        this.elems.layout.appendChild(this.elems.center);
+        this.elems.left = document.createElement('div');
+        this.elems.left.setAttribute('class', 'chocolat-left');
+        this.elems.center.appendChild(this.elems.left);
+        this.elems.imageCanvas = document.createElement('div');
+        this.elems.imageCanvas.setAttribute('class', 'chocolat-image-canvas');
+        this.elems.center.appendChild(this.elems.imageCanvas);
+        this.elems.imageWrapper = document.createElement('div');
+        this.elems.imageWrapper.setAttribute('class', 'chocolat-image-wrapper');
+        this.elems.imageCanvas.appendChild(this.elems.imageWrapper);
+        this.elems.img = document.createElement('img');
+        this.elems.img.setAttribute('class', 'chocolat-img');
+        this.elems.imageWrapper.appendChild(this.elems.img);
+        this.elems.right = document.createElement('div');
+        this.elems.right.setAttribute('class', 'chocolat-right');
+        this.elems.center.appendChild(this.elems.right);
+        this.elems.bottom = document.createElement('div');
+        this.elems.bottom.setAttribute('class', 'chocolat-bottom');
+        this.elems.layout.appendChild(this.elems.bottom);
+        this.elems.close = document.createElement('span');
+        this.elems.close.setAttribute('class', 'chocolat-close');
+        this.elems.top.appendChild(this.elems.close);
+        this.elems.description = document.createElement('span');
+        this.elems.description.setAttribute('class', 'chocolat-description');
+        this.elems.bottom.appendChild(this.elems.description);
+        this.elems.pagination = document.createElement('span');
+        this.elems.pagination.setAttribute('class', 'chocolat-pagination');
+        this.elems.bottom.appendChild(this.elems.pagination);
+        this.elems.setTitle = document.createElement('span');
+        this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
+        this.elems.setTitle.textContent = this.settings.setTitle();
+        this.elems.bottom.appendChild(this.elems.setTitle);
+        this.elems.fullscreen = document.createElement('span');
+        this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
+        this.elems.bottom.appendChild(this.elems.fullscreen);
+        this.settings.afterMarkup.call(this);
+      }
+
+      attachListeners() {
+        this.off(document, 'keydown.chocolat');
+        this.on(document, 'keydown.chocolat', e => {
+          if (this.state.initialized) {
+            if (e.keyCode == 37) {
+              this.change(-1);
+            } else if (e.keyCode == 39) {
+              this.change(1);
+            } else if (e.keyCode == 27) {
+              this.close();
+            }
+          }
+        });
+        const right = this.elems.wrapper.querySelector('.chocolat-right');
+        this.off(right, 'click.chocolat');
+        this.on(right, 'click.chocolat', () => {
+          this.change(+1);
+        });
+        const left = this.elems.wrapper.querySelector('.chocolat-left');
+        this.off(left, 'click.chocolat');
+        this.on(left, 'click.chocolat', () => {
+          this.change(-1);
+        });
+        this.off(this.elems.close, 'click.chocolat');
+        this.on(this.elems.close, 'click.chocolat', this.close.bind(this));
+        this.off(this.elems.fullscreen, 'click.chocolat');
+        this.on(this.elems.fullscreen, 'click.chocolat', () => {
+          if (this.state.fullScreenOpen) {
+            this.state.fullScreenOpen = exitFullScreen();
+            return;
+          }
+
+          this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
+        });
+
+        if (this.settings.closeOnBackgroundClick) {
+          this.off(this.elems.overlay, 'click.chocolat');
+          this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this));
+        }
+
+        this.off(this.elems.wrapper, 'click.chocolat');
+        this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this));
+        const img = this.elems.wrapper.querySelector('.chocolat-img');
+        this.off(img, 'click.chocolat');
+        this.on(img, 'click.chocolat', e => {
+          if (this.state.initialZoomState === null && this.elems.container.classList.contains('chocolat-zoomable')) {
+            e.stopPropagation();
+            this.zoomIn(e);
+          }
+        });
+        this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
+          if (this.state.initialZoomState === null) {
+            return;
+          }
+
+          if (this.settings.currentImageIndex === undefined) {
+            return;
+          }
+
+          const rect = this.elems.wrapper.getBoundingClientRect();
+          const pos = {
+            top: rect.top + window.scrollY,
+            left: rect.left + window.scrollX
+          };
+          const height = this.elems.wrapper.clientHeight;
+          const width = this.elems.wrapper.clientWidth;
+          const imgWidth = this.elems.img.width;
+          const imgHeight = this.elems.img.height;
+          const coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
+          let mvtX = 0;
+
+          if (imgWidth > width) {
+            const paddingX = this.settings.zoomedPaddingX(imgWidth, width);
+            mvtX = coord[0] / (width / 2);
+            mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
+          }
+
+          let mvtY = 0;
+
+          if (imgHeight > height) {
+            const paddingY = this.settings.zoomedPaddingY(imgHeight, height);
+            mvtY = coord[1] / (height / 2);
+            mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
+          }
+
+          this.elems.img.style.marginLeft = -mvtX + 'px';
+          this.elems.img.style.marginTop = -mvtY + 'px';
+        });
+        this.on(window, 'resize.chocolat', e => {
+          if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
+            return;
+          }
+
+          debounce(50, () => {
+            const fitOptions = {
+              imgHeight: this.elems.img.naturalHeight,
+              imgWidth: this.elems.img.naturalWidth,
+              containerHeight: this.elems.wrapper.clientHeight,
+              containerWidth: this.elems.wrapper.clientWidth,
+              canvasWidth: this.elems.imageCanvas.clientWidth,
+              canvasHeight: this.elems.imageCanvas.clientHeight,
+              imageSize: this.settings.imageSize
+            };
+            const {
+              width,
+              height
+            } = fit(fitOptions);
+            this.center(width, height);
+            this.zoomable();
+          });
+        });
+      }
+
+      zoomable() {
+        const currentImageIndex = this.images[this.settings.currentImageIndex];
+        const wrapperWidth = this.elems.wrapper.clientWidth;
+        const wrapperHeight = this.elems.wrapper.clientHeight;
+        const isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+        const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
+
+        if (isImageZoomable && !isImageStretched) {
+          this.elems.container.classList.add('chocolat-zoomable');
+        } else {
+          this.elems.container.classList.remove('chocolat-zoomable');
+        }
+      }
+
+      zoomIn(e) {
+        this.state.initialZoomState = this.settings.imageSize;
+        this.settings.imageSize = 'native';
+        this.elems.container.classList.add('chocolat-zoomed');
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
+          imageSize: this.settings.imageSize
+        };
+        const {
+          width,
+          height
+        } = fit(fitOptions);
+        return this.center(width, height);
+      }
+
+      zoomOut(e) {
+        if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+          return;
+        }
+
+        this.settings.imageSize = this.state.initialZoomState;
+        this.state.initialZoomState = null;
+        this.elems.img.style.margin = 0;
+        this.elems.container.classList.remove('chocolat-zoomed');
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
+          imageSize: this.settings.imageSize
+        };
+        const {
+          width,
+          height
+        } = fit(fitOptions);
+        return this.center(width, height);
+      }
+
+      on(element, eventName, cb) {
+        // const eventName = this.settings.setIndex + '-' + eventName
+        const length = this.events.push({
+          element,
+          eventName,
+          cb
+        });
+        element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
+      }
+
+      off(element, eventName) {
+        // const eventName = this.settings.setIndex + '-' + eventName
+        const index = this.events.findIndex(event => {
+          return event.element === element && event.eventName === eventName;
+        });
+
+        if (this.events[index]) {
+          element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
+          this.events.splice(index, 1);
+        }
+      }
+
+    }
+
+    const instances = [];
+
+    window.Chocolat = function (elements, options) {
+      const settings = Object.assign({}, defaults, {
+        images: []
+      }, options, {
+        setIndex: instances.length
+      });
+      const instance = new Chocolat(elements, settings);
+      instances.push(instance);
+      return instance;
+    };
+
+}());
diff --git a/src/css/chocolat.css b/src/css/chocolat.css
index 034a219..4e6f3bb 100644
--- a/src/css/chocolat.css
+++ b/src/css/chocolat.css
@@ -61,7 +61,7 @@
 }
 
 .chocolat-image-wrapper {
-    transition: top 0.2s ease, left 0.2s ease, width 0.2s ease, height 0.2s ease; /* center */
+    transition: width 0s ease, height 0s ease; /* center */
     position: fixed;
     width: 0px;
     height: 0px;
@@ -97,9 +97,14 @@
     right: 0;
 }
 .chocolat-image-canvas {
+    transition: opacity 0s;
+    opacity: 0;
     flex-grow: 1;
     align-self: stretch;
 }
+.chocolat-image-canvas.chocolat-visible {
+    opacity: 1;
+}
 .chocolat-center {
     flex-grow: 1;
     display: flex;
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index b9bf74c..c71ce2c 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -157,12 +157,12 @@ export class Chocolat {
         return this.load(i)
     }
 
-    load(i) {
+    load(index) {
         if (this.settings.fullScreen) {
             this.state.fullScreenOpen = openFullScreen(this.elems.wrapper)
         }
 
-        if (this.settings.currentImageIndex === i) {
+        if (this.settings.currentImageIndex === index) {
             return Promise.resolve()
         }
 
@@ -174,25 +174,30 @@ export class Chocolat {
         this.elems.container.classList.add('chocolat-open')
 
         this.state.timer = setTimeout(() => {
-            if (this.elems !== undefined) {
-                this.elems.loader.classList.add('chocolat-visible')
-            }
-        }, 300)
-
-        const imgLoader = new Image()
-
-        return loadImage(this.images[i].src, imgLoader)
-            .then(() => {
-                const nextIndex = i + 1
+            this.elems.loader.classList.add('chocolat-visible')
+        }, 1000)
+
+        return loadImage(this.images[index].src).then((image) => {
+                return transitionAsPromise(() => {
+                    this.elems.imageCanvas.classList.remove('chocolat-visible')
+                }, this.elems.imageCanvas).then(() => {
+                    return Promise.resolve(image)
+                })
+            })
+            .then((image) => {
+                const nextIndex = index + 1
                 if (this.images[nextIndex] != undefined) {
-                    loadImage(this.images[nextIndex].src, new Image())
+                    loadImage(this.images[nextIndex].src)
                 }
 
-                this.settings.currentImageIndex = i
+                this.settings.currentImageIndex = index
+                this.elems.description.textContent = this.settings.description.call(this)
+                this.elems.pagination.textContent = this.settings.pagination.call(this)
+                this.arrows()
 
-                const position = this.position(imgLoader)
-                const appear = this.appear(i)
-                return Promise.all([position, appear])
+                return this.position(image).then(() => {
+                    return this.appear(image)
+                })
             })
             .then(() => {
                 this.zoomable()
@@ -200,14 +205,10 @@ export class Chocolat {
             })
     }
 
-    position(image) {
-        this.elems.description.textContent = this.settings.description.call(this)
-        this.elems.pagination.textContent = this.settings.pagination.call(this)
-        this.arrows()
-
+    position({ naturalHeight, naturalWidth }) {
         const fitOptions = {
-            imgHeight: image.naturalHeight,
-            imgWidth: image.naturalWidth,
+            imgHeight: naturalHeight,
+            imgWidth: naturalWidth,
             containerHeight: this.elems.container.clientHeight,
             containerWidth: this.elems.container.clientWidth,
             canvasWidth: this.elems.imageCanvas.clientWidth,
@@ -228,18 +229,20 @@ export class Chocolat {
         }, this.elems.imageWrapper)
     }
 
-    appear(i) {
+    appear(image) {
         clearTimeout(this.state.timer)
+        this.elems.loader.classList.remove('chocolat-visible')
 
-        if (!this.elems.loader.classList.contains('chocolat-visible')) {
-            return loadImage(this.images[i].src, this.elems.img)
-        }
+        this.elems.img = image
+        this.elems.imageWrapper.innerHTML = '';
+        this.elems.img.setAttribute('class', 'chocolat-img')
+        this.elems.imageWrapper.appendChild(this.elems.img)
 
-        return transitionAsPromise(() => {
-            this.elems.loader.classList.remove('chocolat-visible')
-        }, this.elems.loader).then(() => {
-            return loadImage(this.images[i].src, this.elems.img)
-        })
+        const fadeInPromise = transitionAsPromise(() => {
+            this.elems.imageCanvas.classList.add('chocolat-visible')
+        }, this.elems.imageCanvas)
+
+        return fadeInPromise
     }
 
     change(step) {
diff --git a/src/js/utils.js b/src/js/utils.js
index 6878513..d9a105b 100644
--- a/src/js/utils.js
+++ b/src/js/utils.js
@@ -28,22 +28,46 @@ export function transitionAsPromise(triggeringFunc, el) {
         ) {
             handleTransitionEnd()
         }
+        if (parseFloat(getComputedStyle(el)['transitionDuration']) === 0) {
+            handleTransitionEnd()
+        }
     })
 }
 
-export function loadImage(src, image) {
+// export function loadImage(src, image) {
+//     if ('decode' in image) {
+//         image.src = src
+//         return image.decode()
+//     } else {
+//         return new Promise(function(resolve, reject) {
+//             image.onload = resolve
+//             image.onerror = resolve
+//             image.src = src
+//         })
+//     }
+// }
+
+export function loadImage(path) {
+    let image = new Image()
     if ('decode' in image) {
-        image.src = src
-        return image.decode()
+        return new Promise((resolve, reject) => {
+            image.src = path
+            image.decode().then(() => {
+                resolve(image)
+            }).catch(() => {
+                reject(image)
+            })
+        })
     } else {
-        return new Promise(function(resolve, reject) {
-            image.onload = resolve
-            image.onerror = resolve
-            image.src = src
+        return new Promise((resolve, reject) => {
+            image.onload  = resolve(image)
+            image.onerror = reject(image)
+            image.src = path
         })
     }
 }
 
+
 export function fit(options) {
     let height
     let width

From 3eeccef717b732606491dc6f1154fa8c379170cf Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 11 Nov 2019 19:05:28 +0100
Subject: [PATCH 47/65] Proper build

---
 dist/js/chocolat.js | 674 ++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 674 insertions(+)
 create mode 100644 dist/js/chocolat.js

diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
new file mode 100644
index 0000000..1d705b3
--- /dev/null
+++ b/dist/js/chocolat.js
@@ -0,0 +1,674 @@
+(function () {
+    'use strict';
+
+    let timerDebounce = undefined;
+    function debounce(duration, callback) {
+      clearTimeout(timerDebounce);
+      timerDebounce = setTimeout(function () {
+        callback();
+      }, duration);
+      return timerDebounce;
+    }
+    function transitionAsPromise(triggeringFunc, el) {
+      return new Promise(resolve => {
+        const handleTransitionEnd = () => {
+          el.removeEventListener('transitionend', handleTransitionEnd);
+          resolve();
+        };
+
+        el.addEventListener('transitionend', handleTransitionEnd);
+        const classesBefore = el.getAttribute('class');
+        const stylesBefore = el.getAttribute('style');
+        triggeringFunc();
+
+        if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
+          handleTransitionEnd();
+        }
+      });
+    }
+    function loadImage(src, image) {
+      if ('decode' in image) {
+        image.src = src;
+        return image.decode();
+      } else {
+        return new Promise(function (resolve, reject) {
+          image.onload = resolve;
+          image.onerror = resolve;
+          image.src = src;
+        });
+      }
+    }
+    function fit(options) {
+      let height;
+      let width;
+      const {
+        imgHeight,
+        imgWidth,
+        containerHeight,
+        containerWidth,
+        canvasWidth,
+        canvasHeight,
+        imageSize
+      } = options;
+      const canvasRatio = canvasHeight / canvasWidth;
+      const containerRatio = containerHeight / containerWidth;
+      const imgRatio = imgHeight / imgWidth;
+
+      if (imageSize == 'cover') {
+        if (imgRatio < containerRatio) {
+          height = containerHeight;
+          width = height / imgRatio;
+        } else {
+          width = containerWidth;
+          height = width * imgRatio;
+        }
+      } else if (imageSize == 'native') {
+        height = imgHeight;
+        width = imgWidth;
+      } else {
+        if (imgRatio > canvasRatio) {
+          height = canvasHeight;
+          width = height / imgRatio;
+        } else {
+          width = canvasWidth;
+          height = width * imgRatio;
+        }
+
+        if (imageSize === 'scale-down' && (width >= imgWidth || height >= imgHeight)) {
+          width = imgWidth;
+          height = imgHeight;
+        }
+      }
+
+      return {
+        height: height,
+        width: width
+      };
+    }
+    function openFullScreen(wrapper) {
+      if (wrapper.requestFullscreen) {
+        wrapper.requestFullscreen();
+        return true;
+      } else if (wrapper.webkitRequestFullscreen) {
+        wrapper.webkitRequestFullscreen();
+        return true;
+      } else if (wrapper.msRequestFullscreen) {
+        wrapper.msRequestFullscreen();
+        return true;
+      } else {
+        return false;
+      }
+    }
+    function exitFullScreen() {
+      if (document.exitFullscreen) {
+        document.exitFullscreen();
+        return false;
+      } else if (document.webkitExitFullscreen) {
+        document.webkitExitFullscreen();
+        return false;
+      } else if (document.msExitFullscreen) {
+        document.msExitFullscreen();
+        return false;
+      } else {
+        return true;
+      }
+    }
+
+    const defaults = {
+      container: document.body,
+      // window or element
+      className: undefined,
+      imageSize: 'scale-down',
+      // 'scale-down', 'contain', 'cover' or 'native'
+      fullScreen: false,
+      loop: false,
+      linkImages: true,
+      setIndex: 0,
+      firstImageIndex: 0,
+      lastImageIndex: false,
+      currentImageIndex: undefined,
+      allowZoom: true,
+      closeOnBackgroundClick: true,
+      setTitle: function () {
+        return '';
+      },
+      description: function () {
+        return this.images[this.settings.currentImageIndex].title;
+      },
+      pagination: function () {
+        const last = this.settings.lastImageIndex + 1;
+        const position = this.settings.currentImageIndex + 1;
+        return position + '/' + last;
+      },
+
+      afterInitialize() {},
+
+      afterMarkup() {},
+
+      afterImageLoad() {},
+
+      zoomedPaddingX: function (canvasWidth, imgWidth) {
+        return 0;
+      },
+      zoomedPaddingY: function (canvasHeight, imgHeight) {
+        return 0;
+      }
+    };
+    class Chocolat {
+      constructor(elements, settings) {
+        this.settings = settings;
+        this.elems = {};
+        this.images = [];
+        this.events = [];
+        this.state = {
+          fullScreenOpen: false,
+          initialZoomState: null,
+          initialized: false,
+          timer: false
+        };
+        this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
+
+        if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
+          elements.forEach((el, i) => {
+            this.images.push({
+              title: el.getAttribute('title'),
+              src: el.getAttribute('href'),
+              height: undefined,
+              width: undefined
+            });
+            this.off(el, 'click.chocolat');
+            this.on(el, 'click.chocolat', e => {
+              this.init(i);
+              e.preventDefault();
+            });
+          });
+        } else {
+          this.images = elements;
+        }
+
+        if (this.settings.container instanceof Element || this.settings.container instanceof HTMLElement) {
+          this.elems.container = this.settings.container;
+        } else {
+          this.elems.container = document.body;
+        }
+
+        this.api = {
+          open: i => {
+            i = parseInt(i) || 0;
+            return this.init(i);
+          },
+          close: () => {
+            return this.close();
+          },
+          next: () => {
+            return this.change(1);
+          },
+          prev: () => {
+            return this.change(-1);
+          },
+          goto: i => {
+            return this.open(i);
+          },
+          current: () => {
+            return this.settings.currentImageIndex;
+          },
+          position: () => {
+            return this.position(this.elems.img);
+          },
+          destroy: () => {
+            return this.destroy();
+          },
+          set: (property, value) => {
+            this.settings[property] = value;
+            return value;
+          },
+          get: property => {
+            return this.settings[property];
+          },
+          getElem: name => {
+            return this.elems[name];
+          }
+        };
+      }
+
+      init(i) {
+        if (!this.state.initialized) {
+          this.markup();
+          this.attachListeners();
+          this.settings.lastImageIndex = this.images.length - 1;
+          this.state.initialized = true;
+        }
+
+        this.settings.afterInitialize.call(this);
+        return this.load(i);
+      }
+
+      load(i) {
+        if (this.settings.fullScreen) {
+          this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
+        }
+
+        if (this.settings.currentImageIndex === i) {
+          return Promise.resolve();
+        }
+
+        setTimeout(() => {
+          this.elems.overlay.classList.add('chocolat-visible');
+          this.elems.wrapper.classList.add('chocolat-visible');
+        }, 0);
+        this.elems.container.classList.add('chocolat-open');
+        this.state.timer = setTimeout(() => {
+          if (this.elems !== undefined) {
+            this.elems.loader.classList.add('chocolat-visible');
+          }
+        }, 300);
+        const imgLoader = new Image();
+        return loadImage(this.images[i].src, imgLoader).then(() => {
+          const nextIndex = i + 1;
+
+          if (this.images[nextIndex] != undefined) {
+            loadImage(this.images[nextIndex].src, new Image());
+          }
+
+          this.settings.currentImageIndex = i;
+          const position = this.position(imgLoader);
+          const appear = this.appear(i);
+          return Promise.all([position, appear]);
+        }).then(() => {
+          this.zoomable();
+          this.settings.afterImageLoad.call(this);
+        });
+      }
+
+      position(image) {
+        this.elems.description.textContent = this.settings.description.call(this);
+        this.elems.pagination.textContent = this.settings.pagination.call(this);
+        this.arrows();
+        const fitOptions = {
+          imgHeight: image.naturalHeight,
+          imgWidth: image.naturalWidth,
+          containerHeight: this.elems.container.clientHeight,
+          containerWidth: this.elems.container.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
+          imageSize: this.settings.imageSize
+        };
+        const {
+          width,
+          height
+        } = fit(fitOptions);
+        return this.center(width, height);
+      }
+
+      center(width, height) {
+        return transitionAsPromise(() => {
+          Object.assign(this.elems.imageWrapper.style, {
+            width: width + 'px',
+            height: height + 'px'
+          });
+        }, this.elems.imageWrapper);
+      }
+
+      appear(i) {
+        clearTimeout(this.state.timer);
+
+        if (!this.elems.loader.classList.contains('chocolat-visible')) {
+          return loadImage(this.images[i].src, this.elems.img);
+        }
+
+        return transitionAsPromise(() => {
+          this.elems.loader.classList.remove('chocolat-visible');
+        }, this.elems.loader).then(() => {
+          return loadImage(this.images[i].src, this.elems.img);
+        });
+      }
+
+      change(step) {
+        this.zoomOut();
+        this.zoomable();
+        const requestedImage = this.settings.currentImageIndex + parseInt(step);
+
+        if (requestedImage > this.settings.lastImageIndex) {
+          if (this.settings.loop) {
+            return this.load(this.settings.firstImageIndex);
+          }
+        } else if (requestedImage < this.settings.firstImageIndex) {
+          if (this.settings.loop) {
+            return this.load(this.settings.lastImageIndex);
+          }
+        } else {
+          return this.load(requestedImage);
+        }
+      }
+
+      arrows() {
+        if (this.settings.loop) {
+          this.elems.left.classList.add('active');
+          this.elems.right.classList.add('active');
+        } else if (this.settings.linkImages) {
+          this.elems.right.classList.toggle('active', this.settings.currentImageIndex !== this.settings.lastImageIndex);
+          this.elems.left.classList.toggle('active', this.settings.currentImageIndex !== this.settings.firstImageIndex);
+        } else {
+          this.elems.left.classList.remove('active');
+          this.elems.right.classList.remove('active');
+        }
+      }
+
+      close() {
+        if (this.state.fullScreenOpen) {
+          this.state.fullScreenOpen = exitFullScreen();
+          return;
+        }
+
+        this.settings.currentImageIndex = undefined;
+        const promiseOverlay = transitionAsPromise(() => {
+          this.elems.overlay.classList.remove('chocolat-visible');
+        }, this.elems.overlay);
+        const promiseWrapper = transitionAsPromise(() => {
+          this.elems.wrapper.classList.remove('chocolat-visible');
+        }, this.elems.wrapper);
+        return Promise.all([promiseOverlay, promiseWrapper]).then(() => {
+          this.elems.container.classList.remove('chocolat-open');
+        });
+      }
+
+      destroy() {
+        for (let i = this.events.length - 1; i >= 0; i--) {
+          const {
+            element,
+            eventName
+          } = this.events[i];
+          this.off(element, eventName);
+        }
+
+        if (!this.state.initialized) {
+          return;
+        }
+
+        if (this.state.fullScreenOpen) {
+          this.state.fullScreenOpen = exitFullScreen();
+        }
+
+        this.settings.currentImageIndex = undefined;
+        this.state.initialized = false;
+        this.elems.container.classList.remove(...this._cssClasses);
+        this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
+      }
+
+      markup() {
+        this.elems.container.classList.add('chocolat-open', this.settings.className);
+
+        if (this.settings.imageSize == 'cover') {
+          this.elems.container.classList.add('chocolat-cover');
+        }
+
+        if (this.elems.container !== document.body) {
+          this.elems.container.classList.add('chocolat-in-container');
+        }
+
+        this.elems.wrapper = document.createElement('div');
+        this.elems.wrapper.setAttribute('id', 'chocolat-content-' + this.settings.setIndex);
+        this.elems.wrapper.setAttribute('class', 'chocolat-wrapper');
+        this.elems.container.appendChild(this.elems.wrapper);
+        this.elems.overlay = document.createElement('div');
+        this.elems.overlay.setAttribute('class', 'chocolat-overlay');
+        this.elems.wrapper.appendChild(this.elems.overlay);
+        this.elems.loader = document.createElement('div');
+        this.elems.loader.setAttribute('class', 'chocolat-loader');
+        this.elems.wrapper.appendChild(this.elems.loader);
+        this.elems.layout = document.createElement('div');
+        this.elems.layout.setAttribute('class', 'chocolat-layout');
+        this.elems.wrapper.appendChild(this.elems.layout);
+        this.elems.top = document.createElement('div');
+        this.elems.top.setAttribute('class', 'chocolat-top');
+        this.elems.layout.appendChild(this.elems.top);
+        this.elems.center = document.createElement('div');
+        this.elems.center.setAttribute('class', 'chocolat-center');
+        this.elems.layout.appendChild(this.elems.center);
+        this.elems.left = document.createElement('div');
+        this.elems.left.setAttribute('class', 'chocolat-left');
+        this.elems.center.appendChild(this.elems.left);
+        this.elems.imageCanvas = document.createElement('div');
+        this.elems.imageCanvas.setAttribute('class', 'chocolat-image-canvas');
+        this.elems.center.appendChild(this.elems.imageCanvas);
+        this.elems.imageWrapper = document.createElement('div');
+        this.elems.imageWrapper.setAttribute('class', 'chocolat-image-wrapper');
+        this.elems.imageCanvas.appendChild(this.elems.imageWrapper);
+        this.elems.img = document.createElement('img');
+        this.elems.img.setAttribute('class', 'chocolat-img');
+        this.elems.imageWrapper.appendChild(this.elems.img);
+        this.elems.right = document.createElement('div');
+        this.elems.right.setAttribute('class', 'chocolat-right');
+        this.elems.center.appendChild(this.elems.right);
+        this.elems.bottom = document.createElement('div');
+        this.elems.bottom.setAttribute('class', 'chocolat-bottom');
+        this.elems.layout.appendChild(this.elems.bottom);
+        this.elems.close = document.createElement('span');
+        this.elems.close.setAttribute('class', 'chocolat-close');
+        this.elems.top.appendChild(this.elems.close);
+        this.elems.description = document.createElement('span');
+        this.elems.description.setAttribute('class', 'chocolat-description');
+        this.elems.bottom.appendChild(this.elems.description);
+        this.elems.pagination = document.createElement('span');
+        this.elems.pagination.setAttribute('class', 'chocolat-pagination');
+        this.elems.bottom.appendChild(this.elems.pagination);
+        this.elems.setTitle = document.createElement('span');
+        this.elems.setTitle.setAttribute('class', 'chocolat-set-title');
+        this.elems.setTitle.textContent = this.settings.setTitle();
+        this.elems.bottom.appendChild(this.elems.setTitle);
+        this.elems.fullscreen = document.createElement('span');
+        this.elems.fullscreen.setAttribute('class', 'chocolat-fullscreen');
+        this.elems.bottom.appendChild(this.elems.fullscreen);
+        this.settings.afterMarkup.call(this);
+      }
+
+      attachListeners() {
+        this.off(document, 'keydown.chocolat');
+        this.on(document, 'keydown.chocolat', e => {
+          if (this.state.initialized) {
+            if (e.keyCode == 37) {
+              this.change(-1);
+            } else if (e.keyCode == 39) {
+              this.change(1);
+            } else if (e.keyCode == 27) {
+              this.close();
+            }
+          }
+        });
+        const right = this.elems.wrapper.querySelector('.chocolat-right');
+        this.off(right, 'click.chocolat');
+        this.on(right, 'click.chocolat', () => {
+          this.change(+1);
+        });
+        const left = this.elems.wrapper.querySelector('.chocolat-left');
+        this.off(left, 'click.chocolat');
+        this.on(left, 'click.chocolat', () => {
+          this.change(-1);
+        });
+        this.off(this.elems.close, 'click.chocolat');
+        this.on(this.elems.close, 'click.chocolat', this.close.bind(this));
+        this.off(this.elems.fullscreen, 'click.chocolat');
+        this.on(this.elems.fullscreen, 'click.chocolat', () => {
+          if (this.state.fullScreenOpen) {
+            this.state.fullScreenOpen = exitFullScreen();
+            return;
+          }
+
+          this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
+        });
+
+        if (this.settings.closeOnBackgroundClick) {
+          this.off(this.elems.overlay, 'click.chocolat');
+          this.on(this.elems.overlay, 'click.chocolat', this.close.bind(this));
+        }
+
+        this.off(this.elems.wrapper, 'click.chocolat');
+        this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this));
+        const img = this.elems.wrapper.querySelector('.chocolat-img');
+        this.off(img, 'click.chocolat');
+        this.on(img, 'click.chocolat', e => {
+          if (this.state.initialZoomState === null && this.elems.container.classList.contains('chocolat-zoomable')) {
+            e.stopPropagation();
+            this.zoomIn(e);
+          }
+        });
+        this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
+          if (this.state.initialZoomState === null) {
+            return;
+          }
+
+          if (this.settings.currentImageIndex === undefined) {
+            return;
+          }
+
+          const rect = this.elems.wrapper.getBoundingClientRect();
+          const pos = {
+            top: rect.top + window.scrollY,
+            left: rect.left + window.scrollX
+          };
+          const height = this.elems.wrapper.clientHeight;
+          const width = this.elems.wrapper.clientWidth;
+          const imgWidth = this.elems.img.width;
+          const imgHeight = this.elems.img.height;
+          const coord = [e.pageX - width / 2 - pos.left, e.pageY - height / 2 - pos.top];
+          let mvtX = 0;
+
+          if (imgWidth > width) {
+            const paddingX = this.settings.zoomedPaddingX(imgWidth, width);
+            mvtX = coord[0] / (width / 2);
+            mvtX = ((imgWidth - width) / 2 + paddingX) * mvtX;
+          }
+
+          let mvtY = 0;
+
+          if (imgHeight > height) {
+            const paddingY = this.settings.zoomedPaddingY(imgHeight, height);
+            mvtY = coord[1] / (height / 2);
+            mvtY = ((imgHeight - height) / 2 + paddingY) * mvtY;
+          }
+
+          this.elems.img.style.marginLeft = -mvtX + 'px';
+          this.elems.img.style.marginTop = -mvtY + 'px';
+        });
+        this.on(window, 'resize.chocolat', e => {
+          if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
+            return;
+          }
+
+          debounce(50, () => {
+            const fitOptions = {
+              imgHeight: this.elems.img.naturalHeight,
+              imgWidth: this.elems.img.naturalWidth,
+              containerHeight: this.elems.wrapper.clientHeight,
+              containerWidth: this.elems.wrapper.clientWidth,
+              canvasWidth: this.elems.imageCanvas.clientWidth,
+              canvasHeight: this.elems.imageCanvas.clientHeight,
+              imageSize: this.settings.imageSize
+            };
+            const {
+              width,
+              height
+            } = fit(fitOptions);
+            this.center(width, height);
+            this.zoomable();
+          });
+        });
+      }
+
+      zoomable() {
+        const currentImageIndex = this.images[this.settings.currentImageIndex];
+        const wrapperWidth = this.elems.wrapper.clientWidth;
+        const wrapperHeight = this.elems.wrapper.clientHeight;
+        const isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
+        const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
+
+        if (isImageZoomable && !isImageStretched) {
+          this.elems.container.classList.add('chocolat-zoomable');
+        } else {
+          this.elems.container.classList.remove('chocolat-zoomable');
+        }
+      }
+
+      zoomIn(e) {
+        this.state.initialZoomState = this.settings.imageSize;
+        this.settings.imageSize = 'native';
+        this.elems.container.classList.add('chocolat-zoomed');
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
+          imageSize: this.settings.imageSize
+        };
+        const {
+          width,
+          height
+        } = fit(fitOptions);
+        return this.center(width, height);
+      }
+
+      zoomOut(e) {
+        if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+          return;
+        }
+
+        this.settings.imageSize = this.state.initialZoomState;
+        this.state.initialZoomState = null;
+        this.elems.img.style.margin = 0;
+        this.elems.container.classList.remove('chocolat-zoomed');
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
+          imageSize: this.settings.imageSize
+        };
+        const {
+          width,
+          height
+        } = fit(fitOptions);
+        return this.center(width, height);
+      }
+
+      on(element, eventName, cb) {
+        // const eventName = this.settings.setIndex + '-' + eventName
+        const length = this.events.push({
+          element,
+          eventName,
+          cb
+        });
+        element.addEventListener(eventName.split('.')[0], this.events[length - 1].cb);
+      }
+
+      off(element, eventName) {
+        // const eventName = this.settings.setIndex + '-' + eventName
+        const index = this.events.findIndex(event => {
+          return event.element === element && event.eventName === eventName;
+        });
+
+        if (this.events[index]) {
+          element.removeEventListener(eventName.split('.')[0], this.events[index].cb);
+          this.events.splice(index, 1);
+        }
+      }
+
+    }
+
+    const instances = [];
+
+    window.Chocolat = function (elements, options) {
+      const settings = Object.assign({}, defaults, {
+        images: []
+      }, options, {
+        setIndex: instances.length
+      });
+      const instance = new Chocolat(elements, settings);
+      instances.push(instance);
+      return instance;
+    };
+
+}());

From c76d27fcb2e26cd8ad403cd5d276d05d99647839 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 12 Nov 2019 15:27:37 +0100
Subject: [PATCH 48/65] FadeOut image only if loading takes more than 100ms

---
 src/js/chocolat.js | 34 +++++++++++++++++++++++-----------
 1 file changed, 23 insertions(+), 11 deletions(-)

diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index c71ce2c..a659a69 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -173,18 +173,30 @@ export class Chocolat {
 
         this.elems.container.classList.add('chocolat-open')
 
-        this.state.timer = setTimeout(() => {
+        let loaderTimer = setTimeout(() => {
             this.elems.loader.classList.add('chocolat-visible')
         }, 1000)
 
-        return loadImage(this.images[index].src).then((image) => {
-                return transitionAsPromise(() => {
-                    this.elems.imageCanvas.classList.remove('chocolat-visible')
-                }, this.elems.imageCanvas).then(() => {
-                    return Promise.resolve(image)
-                })
+        let fadeOutPromise
+        let image
+
+        let fadeOutTimer = setTimeout(() => {
+            fadeOutTimer = undefined
+            fadeOutPromise = transitionAsPromise(() => {
+                this.elems.imageCanvas.classList.remove('chocolat-visible')
+            }, this.elems.imageCanvas)
+        }, 100)
+
+        return loadImage(this.images[index].src).then((loadedImage) => {
+                image = loadedImage
+                if (fadeOutTimer) {
+                    clearTimeout(fadeOutTimer)
+                    return Promise.resolve()
+                } else {
+                    return fadeOutPromise
+                }
             })
-            .then((image) => {
+            .then(() => {
                 const nextIndex = index + 1
                 if (this.images[nextIndex] != undefined) {
                     loadImage(this.images[nextIndex].src)
@@ -196,6 +208,9 @@ export class Chocolat {
                 this.arrows()
 
                 return this.position(image).then(() => {
+                    this.elems.loader.classList.remove('chocolat-visible')
+                    clearTimeout(loaderTimer)
+
                     return this.appear(image)
                 })
             })
@@ -230,9 +245,6 @@ export class Chocolat {
     }
 
     appear(image) {
-        clearTimeout(this.state.timer)
-        this.elems.loader.classList.remove('chocolat-visible')
-
         this.elems.img = image
         this.elems.imageWrapper.innerHTML = '';
         this.elems.img.setAttribute('class', 'chocolat-img')

From 59f36a02a08c16fccdd078e230fa8220b05195c4 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 12 Nov 2019 15:32:37 +0100
Subject: [PATCH 49/65] Proper build

---
 dist/js/chocolat.cjs.js | 29 +++++++++----
 dist/js/chocolat.esm.js | 29 +++++++++----
 dist/js/chocolat.js     | 95 +++++++++--------------------------------
 src/js/chocolat.js      |  5 ++-
 src/js/utils.js         | 16 ++++---
 5 files changed, 72 insertions(+), 102 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 7f7eacb..f543702 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -280,16 +280,27 @@ class Chocolat {
       this.elems.wrapper.classList.add('chocolat-visible');
     }, 0);
     this.elems.container.classList.add('chocolat-open');
-    this.state.timer = setTimeout(() => {
+    let loaderTimer = setTimeout(() => {
       this.elems.loader.classList.add('chocolat-visible');
     }, 1000);
-    return loadImage(this.images[index].src).then(image => {
-      return transitionAsPromise(() => {
+    let fadeOutPromise;
+    let image;
+    let fadeOutTimer = setTimeout(() => {
+      fadeOutTimer = undefined;
+      fadeOutPromise = transitionAsPromise(() => {
         this.elems.imageCanvas.classList.remove('chocolat-visible');
-      }, this.elems.imageCanvas).then(() => {
-        return Promise.resolve(image);
-      });
-    }).then(image => {
+      }, this.elems.imageCanvas);
+    }, 100);
+    return loadImage(this.images[index].src).then(loadedImage => {
+      image = loadedImage;
+
+      if (fadeOutTimer) {
+        clearTimeout(fadeOutTimer);
+        return Promise.resolve();
+      } else {
+        return fadeOutPromise;
+      }
+    }).then(() => {
       const nextIndex = index + 1;
 
       if (this.images[nextIndex] != undefined) {
@@ -301,6 +312,8 @@ class Chocolat {
       this.elems.pagination.textContent = this.settings.pagination.call(this);
       this.arrows();
       return this.position(image).then(() => {
+        this.elems.loader.classList.remove('chocolat-visible');
+        clearTimeout(loaderTimer);
         return this.appear(image);
       });
     }).then(() => {
@@ -339,8 +352,6 @@ class Chocolat {
   }
 
   appear(image) {
-    clearTimeout(this.state.timer);
-    this.elems.loader.classList.remove('chocolat-visible');
     this.elems.img = image;
     this.elems.imageWrapper.innerHTML = '';
     this.elems.img.setAttribute('class', 'chocolat-img');
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 7e34bcc..f5a1dfd 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -278,16 +278,27 @@ class Chocolat {
       this.elems.wrapper.classList.add('chocolat-visible');
     }, 0);
     this.elems.container.classList.add('chocolat-open');
-    this.state.timer = setTimeout(() => {
+    let loaderTimer = setTimeout(() => {
       this.elems.loader.classList.add('chocolat-visible');
     }, 1000);
-    return loadImage(this.images[index].src).then(image => {
-      return transitionAsPromise(() => {
+    let fadeOutPromise;
+    let image;
+    let fadeOutTimer = setTimeout(() => {
+      fadeOutTimer = undefined;
+      fadeOutPromise = transitionAsPromise(() => {
         this.elems.imageCanvas.classList.remove('chocolat-visible');
-      }, this.elems.imageCanvas).then(() => {
-        return Promise.resolve(image);
-      });
-    }).then(image => {
+      }, this.elems.imageCanvas);
+    }, 100);
+    return loadImage(this.images[index].src).then(loadedImage => {
+      image = loadedImage;
+
+      if (fadeOutTimer) {
+        clearTimeout(fadeOutTimer);
+        return Promise.resolve();
+      } else {
+        return fadeOutPromise;
+      }
+    }).then(() => {
       const nextIndex = index + 1;
 
       if (this.images[nextIndex] != undefined) {
@@ -299,6 +310,8 @@ class Chocolat {
       this.elems.pagination.textContent = this.settings.pagination.call(this);
       this.arrows();
       return this.position(image).then(() => {
+        this.elems.loader.classList.remove('chocolat-visible');
+        clearTimeout(loaderTimer);
         return this.appear(image);
       });
     }).then(() => {
@@ -337,8 +350,6 @@ class Chocolat {
   }
 
   appear(image) {
-    clearTimeout(this.state.timer);
-    this.elems.loader.classList.remove('chocolat-visible');
     this.elems.img = image;
     this.elems.imageWrapper.innerHTML = '';
     this.elems.img.setAttribute('class', 'chocolat-img');
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
index 02db0ab..c451a4c 100644
--- a/dist/js/chocolat.js
+++ b/dist/js/chocolat.js
@@ -24,7 +24,6 @@
         if (classesBefore === el.getAttribute('class') && stylesBefore === el.getAttribute('style')) {
           handleTransitionEnd();
         }
-<<<<<<< HEAD
 
         if (parseFloat(getComputedStyle(el)['transitionDuration']) === 0) {
           handleTransitionEnd();
@@ -60,19 +59,6 @@
           image.onload = resolve(image);
           image.onerror = reject(image);
           image.src = path;
-=======
-      });
-    }
-    function loadImage(src, image) {
-      if ('decode' in image) {
-        image.src = src;
-        return image.decode();
-      } else {
-        return new Promise(function (resolve, reject) {
-          image.onload = resolve;
-          image.onerror = resolve;
-          image.src = src;
->>>>>>> 3eeccef717b732606491dc6f1154fa8c379170cf
         });
       }
     }
@@ -281,20 +267,12 @@
         return this.load(i);
       }
 
-<<<<<<< HEAD
       load(index) {
-=======
-      load(i) {
->>>>>>> 3eeccef717b732606491dc6f1154fa8c379170cf
         if (this.settings.fullScreen) {
           this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
         }
 
-<<<<<<< HEAD
         if (this.settings.currentImageIndex === index) {
-=======
-        if (this.settings.currentImageIndex === i) {
->>>>>>> 3eeccef717b732606491dc6f1154fa8c379170cf
           return Promise.resolve();
         }
 
@@ -303,17 +281,27 @@
           this.elems.wrapper.classList.add('chocolat-visible');
         }, 0);
         this.elems.container.classList.add('chocolat-open');
-        this.state.timer = setTimeout(() => {
-<<<<<<< HEAD
+        let loaderTimer = setTimeout(() => {
           this.elems.loader.classList.add('chocolat-visible');
         }, 1000);
-        return loadImage(this.images[index].src).then(image => {
-          return transitionAsPromise(() => {
+        let fadeOutPromise;
+        let image;
+        let fadeOutTimer = setTimeout(() => {
+          fadeOutTimer = undefined;
+          fadeOutPromise = transitionAsPromise(() => {
             this.elems.imageCanvas.classList.remove('chocolat-visible');
-          }, this.elems.imageCanvas).then(() => {
-            return Promise.resolve(image);
-          });
-        }).then(image => {
+          }, this.elems.imageCanvas);
+        }, 100);
+        return loadImage(this.images[index].src).then(loadedImage => {
+          image = loadedImage;
+
+          if (fadeOutTimer) {
+            clearTimeout(fadeOutTimer);
+            return Promise.resolve();
+          } else {
+            return fadeOutPromise;
+          }
+        }).then(() => {
           const nextIndex = index + 1;
 
           if (this.images[nextIndex] != undefined) {
@@ -325,33 +313,16 @@
           this.elems.pagination.textContent = this.settings.pagination.call(this);
           this.arrows();
           return this.position(image).then(() => {
+            this.elems.loader.classList.remove('chocolat-visible');
+            clearTimeout(loaderTimer);
             return this.appear(image);
           });
-=======
-          if (this.elems !== undefined) {
-            this.elems.loader.classList.add('chocolat-visible');
-          }
-        }, 300);
-        const imgLoader = new Image();
-        return loadImage(this.images[i].src, imgLoader).then(() => {
-          const nextIndex = i + 1;
-
-          if (this.images[nextIndex] != undefined) {
-            loadImage(this.images[nextIndex].src, new Image());
-          }
-
-          this.settings.currentImageIndex = i;
-          const position = this.position(imgLoader);
-          const appear = this.appear(i);
-          return Promise.all([position, appear]);
->>>>>>> 3eeccef717b732606491dc6f1154fa8c379170cf
         }).then(() => {
           this.zoomable();
           this.settings.afterImageLoad.call(this);
         });
       }
 
-<<<<<<< HEAD
       position({
         naturalHeight,
         naturalWidth
@@ -359,15 +330,6 @@
         const fitOptions = {
           imgHeight: naturalHeight,
           imgWidth: naturalWidth,
-=======
-      position(image) {
-        this.elems.description.textContent = this.settings.description.call(this);
-        this.elems.pagination.textContent = this.settings.pagination.call(this);
-        this.arrows();
-        const fitOptions = {
-          imgHeight: image.naturalHeight,
-          imgWidth: image.naturalWidth,
->>>>>>> 3eeccef717b732606491dc6f1154fa8c379170cf
           containerHeight: this.elems.container.clientHeight,
           containerWidth: this.elems.container.clientWidth,
           canvasWidth: this.elems.imageCanvas.clientWidth,
@@ -390,10 +352,7 @@
         }, this.elems.imageWrapper);
       }
 
-<<<<<<< HEAD
       appear(image) {
-        clearTimeout(this.state.timer);
-        this.elems.loader.classList.remove('chocolat-visible');
         this.elems.img = image;
         this.elems.imageWrapper.innerHTML = '';
         this.elems.img.setAttribute('class', 'chocolat-img');
@@ -402,20 +361,6 @@
           this.elems.imageCanvas.classList.add('chocolat-visible');
         }, this.elems.imageCanvas);
         return fadeInPromise;
-=======
-      appear(i) {
-        clearTimeout(this.state.timer);
-
-        if (!this.elems.loader.classList.contains('chocolat-visible')) {
-          return loadImage(this.images[i].src, this.elems.img);
-        }
-
-        return transitionAsPromise(() => {
-          this.elems.loader.classList.remove('chocolat-visible');
-        }, this.elems.loader).then(() => {
-          return loadImage(this.images[i].src, this.elems.img);
-        });
->>>>>>> 3eeccef717b732606491dc6f1154fa8c379170cf
       }
 
       change(step) {
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index a659a69..96cf3d8 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -187,7 +187,8 @@ export class Chocolat {
             }, this.elems.imageCanvas)
         }, 100)
 
-        return loadImage(this.images[index].src).then((loadedImage) => {
+        return loadImage(this.images[index].src)
+            .then((loadedImage) => {
                 image = loadedImage
                 if (fadeOutTimer) {
                     clearTimeout(fadeOutTimer)
@@ -246,7 +247,7 @@ export class Chocolat {
 
     appear(image) {
         this.elems.img = image
-        this.elems.imageWrapper.innerHTML = '';
+        this.elems.imageWrapper.innerHTML = ''
         this.elems.img.setAttribute('class', 'chocolat-img')
         this.elems.imageWrapper.appendChild(this.elems.img)
 
diff --git a/src/js/utils.js b/src/js/utils.js
index d9a105b..d25ead0 100644
--- a/src/js/utils.js
+++ b/src/js/utils.js
@@ -52,22 +52,24 @@ export function loadImage(path) {
     if ('decode' in image) {
         return new Promise((resolve, reject) => {
             image.src = path
-            image.decode().then(() => {
-                resolve(image)
-            }).catch(() => {
-                reject(image)
-            })
+            image
+                .decode()
+                .then(() => {
+                    resolve(image)
+                })
+                .catch(() => {
+                    reject(image)
+                })
         })
     } else {
         return new Promise((resolve, reject) => {
-            image.onload  = resolve(image)
+            image.onload = resolve(image)
             image.onerror = reject(image)
             image.src = path
         })
     }
 }
 
-
 export function fit(options) {
     let height
     let width

From 6113b794118906522ed008bed6cb4acf368f55bf Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 12 Nov 2019 23:01:53 +0100
Subject: [PATCH 50/65] Refacto and better classname for zooming transitions

---
 demo/index.html         |   8 ++-
 dist/css/chocolat.css   |  13 +++--
 dist/js/chocolat.cjs.js | 102 +++++++++++------------------------
 dist/js/chocolat.esm.js | 102 +++++++++++------------------------
 dist/js/chocolat.js     | 102 +++++++++++------------------------
 src/css/chocolat.css    |  13 +++--
 src/js/chocolat.js      | 115 ++++++++++++++++------------------------
 7 files changed, 165 insertions(+), 290 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index b05422d..4bcd0e4 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -37,15 +37,18 @@ <h2>
            Full window, contain, click the numbers to open:
         </h2>
         <div id="example0">
-            <a class="chocolat-image" href="demo-images/5.jpg" title="HO">
+            <a class="chocolat-image" href="https://nicolasturlais.com/0full.jpg" title="HO">
                 1
             </a>
             <a class="chocolat-image" href="demo-images/6.jpg" title="HAI">
                 2
             </a>
-            <a class="chocolat-image" href="demo-images/3.jpg" title="IO">
+            <a class="chocolat-image" href="https://nicolasturlais.com/1full.jpg" title="IO">
                 3
             </a>
+            <a class="chocolat-image" href="demo-images/5.jpg" title="HAI">
+                4
+            </a>
         </div>
 
         <h2>
@@ -117,6 +120,7 @@ <h2>
         <script>
             // standard demos
             Chocolat(document.querySelectorAll('#example0 .chocolat-image'), {
+                loop: true,
                 imageSize: 'contain',
             })
 
diff --git a/dist/css/chocolat.css b/dist/css/chocolat.css
index 4e6f3bb..22c1cbd 100644
--- a/dist/css/chocolat.css
+++ b/dist/css/chocolat.css
@@ -61,7 +61,6 @@
 }
 
 .chocolat-image-wrapper {
-    transition: width 0s ease, height 0s ease; /* center */
     position: fixed;
     width: 0px;
     height: 0px;
@@ -73,7 +72,6 @@
 }
 
 .chocolat-image-wrapper .chocolat-img {
-    transition: margin 0.2s ease; /*  zoomout */
     position: absolute;
     width: 100%;
     height: 100%;
@@ -97,7 +95,7 @@
     right: 0;
 }
 .chocolat-image-canvas {
-    transition: opacity 0s;
+    transition: opacity .2s;
     opacity: 0;
     flex-grow: 1;
     align-self: stretch;
@@ -202,8 +200,13 @@ body.chocolat-open > .chocolat-image-wrapper {
     position: relative;
 }
 
-.chocolat-zoomable.chocolat-zoomed .chocolat-img {
-    transition: margin 0s ease;
+.chocolat-zoomable.chocolat-zooming-in .chocolat-image-wrapper,
+.chocolat-zoomable.chocolat-zooming-out .chocolat-image-wrapper {
+    transition: width .2s ease, height .2s ease;
+}
+.chocolat-zoomable.chocolat-zooming-in .chocolat-img,
+.chocolat-zoomable.chocolat-zooming-out .chocolat-img {
+    transition: margin .2s ease;
 }
 
 /* uncomment to hide controls when zoomed-in*/
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index f543702..9358dbc 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -290,7 +290,7 @@ class Chocolat {
       fadeOutPromise = transitionAsPromise(() => {
         this.elems.imageCanvas.classList.remove('chocolat-visible');
       }, this.elems.imageCanvas);
-    }, 100);
+    }, 80);
     return loadImage(this.images[index].src).then(loadedImage => {
       image = loadedImage;
 
@@ -317,7 +317,7 @@ class Chocolat {
         return this.appear(image);
       });
     }).then(() => {
-      this.zoomable();
+      this.elems.container.classList.toggle('chocolat-zoomable', this.zoomable(image, this.elems.wrapper));
       this.settings.afterImageLoad.call(this);
     });
   }
@@ -339,10 +339,6 @@ class Chocolat {
       width,
       height
     } = fit(fitOptions);
-    return this.center(width, height);
-  }
-
-  center(width, height) {
     return transitionAsPromise(() => {
       Object.assign(this.elems.imageWrapper.style, {
         width: width + 'px',
@@ -364,7 +360,6 @@ class Chocolat {
 
   change(step) {
     this.zoomOut();
-    this.zoomable();
     const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
     if (requestedImage > this.settings.lastImageIndex) {
@@ -542,13 +537,26 @@ class Chocolat {
     }
 
     this.off(this.elems.wrapper, 'click.chocolat');
-    this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this));
-    const img = this.elems.wrapper.querySelector('.chocolat-img');
-    this.off(img, 'click.chocolat');
-    this.on(img, 'click.chocolat', e => {
+    this.on(this.elems.wrapper, 'click.chocolat', () => {
+      if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+        return;
+      }
+
+      this.elems.container.classList.add('chocolat-zooming-out');
+      this.zoomOut().then(() => {
+        this.elems.container.classList.remove('chocolat-zoomed');
+        this.elems.container.classList.remove('chocolat-zooming-out');
+      });
+    });
+    this.off(this.elems.imageWrapper, 'click.chocolat');
+    this.on(this.elems.imageWrapper, 'click.chocolat', e => {
       if (this.state.initialZoomState === null && this.elems.container.classList.contains('chocolat-zoomable')) {
         e.stopPropagation();
-        this.zoomIn(e);
+        this.elems.container.classList.add('chocolat-zooming-in');
+        this.zoomIn(e).then(() => {
+          this.elems.container.classList.add('chocolat-zoomed');
+          this.elems.container.classList.remove('chocolat-zooming-in');
+        });
       }
     });
     this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
@@ -595,82 +603,36 @@ class Chocolat {
       }
 
       debounce(50, () => {
-        const fitOptions = {
-          imgHeight: this.elems.img.naturalHeight,
-          imgWidth: this.elems.img.naturalWidth,
-          containerHeight: this.elems.wrapper.clientHeight,
-          containerWidth: this.elems.wrapper.clientWidth,
-          canvasWidth: this.elems.imageCanvas.clientWidth,
-          canvasHeight: this.elems.imageCanvas.clientHeight,
-          imageSize: this.settings.imageSize
-        };
         const {
           width,
           height
         } = fit(fitOptions);
-        this.center(width, height);
-        this.zoomable();
+        this.position(this.elems.img).then(() => {
+          this.elems.container.classList.toggle('chocolat-zoomable', this.zoomable(this.elems.img, this.elems.wrapper));
+        });
       });
     });
   }
 
-  zoomable() {
-    const currentImageIndex = this.images[this.settings.currentImageIndex];
-    const wrapperWidth = this.elems.wrapper.clientWidth;
-    const wrapperHeight = this.elems.wrapper.clientHeight;
-    const isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
-    const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
-
-    if (isImageZoomable && !isImageStretched) {
-      this.elems.container.classList.add('chocolat-zoomable');
-    } else {
-      this.elems.container.classList.remove('chocolat-zoomable');
-    }
+  zoomable(image, wrapper) {
+    const wrapperWidth = wrapper.clientWidth;
+    const wrapperHeight = wrapper.clientHeight;
+    const isImageZoomable = this.settings.allowZoom && (image.naturalWidth > wrapperWidth || image.naturalHeight > wrapperHeight) ? true : false;
+    const isImageStretched = image.clientWidth > image.naturalWidth || image.clientHeight > image.naturalHeight;
+    return isImageZoomable && !isImageStretched;
   }
 
   zoomIn(e) {
     this.state.initialZoomState = this.settings.imageSize;
     this.settings.imageSize = 'native';
-    this.elems.container.classList.add('chocolat-zoomed');
-    const fitOptions = {
-      imgHeight: this.elems.img.naturalHeight,
-      imgWidth: this.elems.img.naturalWidth,
-      containerHeight: this.elems.wrapper.clientHeight,
-      containerWidth: this.elems.wrapper.clientWidth,
-      canvasWidth: this.elems.imageCanvas.clientWidth,
-      canvasHeight: this.elems.imageCanvas.clientHeight,
-      imageSize: this.settings.imageSize
-    };
-    const {
-      width,
-      height
-    } = fit(fitOptions);
-    return this.center(width, height);
+    return this.position(this.elems.img);
   }
 
   zoomOut(e) {
-    if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
-      return;
-    }
-
-    this.settings.imageSize = this.state.initialZoomState;
+    this.settings.imageSize = this.state.initialZoomState || this.settings.imageSize;
     this.state.initialZoomState = null;
     this.elems.img.style.margin = 0;
-    this.elems.container.classList.remove('chocolat-zoomed');
-    const fitOptions = {
-      imgHeight: this.elems.img.naturalHeight,
-      imgWidth: this.elems.img.naturalWidth,
-      containerHeight: this.elems.wrapper.clientHeight,
-      containerWidth: this.elems.wrapper.clientWidth,
-      canvasWidth: this.elems.imageCanvas.clientWidth,
-      canvasHeight: this.elems.imageCanvas.clientHeight,
-      imageSize: this.settings.imageSize
-    };
-    const {
-      width,
-      height
-    } = fit(fitOptions);
-    return this.center(width, height);
+    return this.position(this.elems.img);
   }
 
   on(element, eventName, cb) {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index f5a1dfd..9af44b2 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -288,7 +288,7 @@ class Chocolat {
       fadeOutPromise = transitionAsPromise(() => {
         this.elems.imageCanvas.classList.remove('chocolat-visible');
       }, this.elems.imageCanvas);
-    }, 100);
+    }, 80);
     return loadImage(this.images[index].src).then(loadedImage => {
       image = loadedImage;
 
@@ -315,7 +315,7 @@ class Chocolat {
         return this.appear(image);
       });
     }).then(() => {
-      this.zoomable();
+      this.elems.container.classList.toggle('chocolat-zoomable', this.zoomable(image, this.elems.wrapper));
       this.settings.afterImageLoad.call(this);
     });
   }
@@ -337,10 +337,6 @@ class Chocolat {
       width,
       height
     } = fit(fitOptions);
-    return this.center(width, height);
-  }
-
-  center(width, height) {
     return transitionAsPromise(() => {
       Object.assign(this.elems.imageWrapper.style, {
         width: width + 'px',
@@ -362,7 +358,6 @@ class Chocolat {
 
   change(step) {
     this.zoomOut();
-    this.zoomable();
     const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
     if (requestedImage > this.settings.lastImageIndex) {
@@ -540,13 +535,26 @@ class Chocolat {
     }
 
     this.off(this.elems.wrapper, 'click.chocolat');
-    this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this));
-    const img = this.elems.wrapper.querySelector('.chocolat-img');
-    this.off(img, 'click.chocolat');
-    this.on(img, 'click.chocolat', e => {
+    this.on(this.elems.wrapper, 'click.chocolat', () => {
+      if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+        return;
+      }
+
+      this.elems.container.classList.add('chocolat-zooming-out');
+      this.zoomOut().then(() => {
+        this.elems.container.classList.remove('chocolat-zoomed');
+        this.elems.container.classList.remove('chocolat-zooming-out');
+      });
+    });
+    this.off(this.elems.imageWrapper, 'click.chocolat');
+    this.on(this.elems.imageWrapper, 'click.chocolat', e => {
       if (this.state.initialZoomState === null && this.elems.container.classList.contains('chocolat-zoomable')) {
         e.stopPropagation();
-        this.zoomIn(e);
+        this.elems.container.classList.add('chocolat-zooming-in');
+        this.zoomIn(e).then(() => {
+          this.elems.container.classList.add('chocolat-zoomed');
+          this.elems.container.classList.remove('chocolat-zooming-in');
+        });
       }
     });
     this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
@@ -593,82 +601,36 @@ class Chocolat {
       }
 
       debounce(50, () => {
-        const fitOptions = {
-          imgHeight: this.elems.img.naturalHeight,
-          imgWidth: this.elems.img.naturalWidth,
-          containerHeight: this.elems.wrapper.clientHeight,
-          containerWidth: this.elems.wrapper.clientWidth,
-          canvasWidth: this.elems.imageCanvas.clientWidth,
-          canvasHeight: this.elems.imageCanvas.clientHeight,
-          imageSize: this.settings.imageSize
-        };
         const {
           width,
           height
         } = fit(fitOptions);
-        this.center(width, height);
-        this.zoomable();
+        this.position(this.elems.img).then(() => {
+          this.elems.container.classList.toggle('chocolat-zoomable', this.zoomable(this.elems.img, this.elems.wrapper));
+        });
       });
     });
   }
 
-  zoomable() {
-    const currentImageIndex = this.images[this.settings.currentImageIndex];
-    const wrapperWidth = this.elems.wrapper.clientWidth;
-    const wrapperHeight = this.elems.wrapper.clientHeight;
-    const isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
-    const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
-
-    if (isImageZoomable && !isImageStretched) {
-      this.elems.container.classList.add('chocolat-zoomable');
-    } else {
-      this.elems.container.classList.remove('chocolat-zoomable');
-    }
+  zoomable(image, wrapper) {
+    const wrapperWidth = wrapper.clientWidth;
+    const wrapperHeight = wrapper.clientHeight;
+    const isImageZoomable = this.settings.allowZoom && (image.naturalWidth > wrapperWidth || image.naturalHeight > wrapperHeight) ? true : false;
+    const isImageStretched = image.clientWidth > image.naturalWidth || image.clientHeight > image.naturalHeight;
+    return isImageZoomable && !isImageStretched;
   }
 
   zoomIn(e) {
     this.state.initialZoomState = this.settings.imageSize;
     this.settings.imageSize = 'native';
-    this.elems.container.classList.add('chocolat-zoomed');
-    const fitOptions = {
-      imgHeight: this.elems.img.naturalHeight,
-      imgWidth: this.elems.img.naturalWidth,
-      containerHeight: this.elems.wrapper.clientHeight,
-      containerWidth: this.elems.wrapper.clientWidth,
-      canvasWidth: this.elems.imageCanvas.clientWidth,
-      canvasHeight: this.elems.imageCanvas.clientHeight,
-      imageSize: this.settings.imageSize
-    };
-    const {
-      width,
-      height
-    } = fit(fitOptions);
-    return this.center(width, height);
+    return this.position(this.elems.img);
   }
 
   zoomOut(e) {
-    if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
-      return;
-    }
-
-    this.settings.imageSize = this.state.initialZoomState;
+    this.settings.imageSize = this.state.initialZoomState || this.settings.imageSize;
     this.state.initialZoomState = null;
     this.elems.img.style.margin = 0;
-    this.elems.container.classList.remove('chocolat-zoomed');
-    const fitOptions = {
-      imgHeight: this.elems.img.naturalHeight,
-      imgWidth: this.elems.img.naturalWidth,
-      containerHeight: this.elems.wrapper.clientHeight,
-      containerWidth: this.elems.wrapper.clientWidth,
-      canvasWidth: this.elems.imageCanvas.clientWidth,
-      canvasHeight: this.elems.imageCanvas.clientHeight,
-      imageSize: this.settings.imageSize
-    };
-    const {
-      width,
-      height
-    } = fit(fitOptions);
-    return this.center(width, height);
+    return this.position(this.elems.img);
   }
 
   on(element, eventName, cb) {
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
index c451a4c..075c532 100644
--- a/dist/js/chocolat.js
+++ b/dist/js/chocolat.js
@@ -291,7 +291,7 @@
           fadeOutPromise = transitionAsPromise(() => {
             this.elems.imageCanvas.classList.remove('chocolat-visible');
           }, this.elems.imageCanvas);
-        }, 100);
+        }, 80);
         return loadImage(this.images[index].src).then(loadedImage => {
           image = loadedImage;
 
@@ -318,7 +318,7 @@
             return this.appear(image);
           });
         }).then(() => {
-          this.zoomable();
+          this.elems.container.classList.toggle('chocolat-zoomable', this.zoomable(image, this.elems.wrapper));
           this.settings.afterImageLoad.call(this);
         });
       }
@@ -340,10 +340,6 @@
           width,
           height
         } = fit(fitOptions);
-        return this.center(width, height);
-      }
-
-      center(width, height) {
         return transitionAsPromise(() => {
           Object.assign(this.elems.imageWrapper.style, {
             width: width + 'px',
@@ -365,7 +361,6 @@
 
       change(step) {
         this.zoomOut();
-        this.zoomable();
         const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
         if (requestedImage > this.settings.lastImageIndex) {
@@ -543,13 +538,26 @@
         }
 
         this.off(this.elems.wrapper, 'click.chocolat');
-        this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this));
-        const img = this.elems.wrapper.querySelector('.chocolat-img');
-        this.off(img, 'click.chocolat');
-        this.on(img, 'click.chocolat', e => {
+        this.on(this.elems.wrapper, 'click.chocolat', () => {
+          if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+            return;
+          }
+
+          this.elems.container.classList.add('chocolat-zooming-out');
+          this.zoomOut().then(() => {
+            this.elems.container.classList.remove('chocolat-zoomed');
+            this.elems.container.classList.remove('chocolat-zooming-out');
+          });
+        });
+        this.off(this.elems.imageWrapper, 'click.chocolat');
+        this.on(this.elems.imageWrapper, 'click.chocolat', e => {
           if (this.state.initialZoomState === null && this.elems.container.classList.contains('chocolat-zoomable')) {
             e.stopPropagation();
-            this.zoomIn(e);
+            this.elems.container.classList.add('chocolat-zooming-in');
+            this.zoomIn(e).then(() => {
+              this.elems.container.classList.add('chocolat-zoomed');
+              this.elems.container.classList.remove('chocolat-zooming-in');
+            });
           }
         });
         this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
@@ -596,82 +604,36 @@
           }
 
           debounce(50, () => {
-            const fitOptions = {
-              imgHeight: this.elems.img.naturalHeight,
-              imgWidth: this.elems.img.naturalWidth,
-              containerHeight: this.elems.wrapper.clientHeight,
-              containerWidth: this.elems.wrapper.clientWidth,
-              canvasWidth: this.elems.imageCanvas.clientWidth,
-              canvasHeight: this.elems.imageCanvas.clientHeight,
-              imageSize: this.settings.imageSize
-            };
             const {
               width,
               height
             } = fit(fitOptions);
-            this.center(width, height);
-            this.zoomable();
+            this.position(this.elems.img).then(() => {
+              this.elems.container.classList.toggle('chocolat-zoomable', this.zoomable(this.elems.img, this.elems.wrapper));
+            });
           });
         });
       }
 
-      zoomable() {
-        const currentImageIndex = this.images[this.settings.currentImageIndex];
-        const wrapperWidth = this.elems.wrapper.clientWidth;
-        const wrapperHeight = this.elems.wrapper.clientHeight;
-        const isImageZoomable = this.settings.allowZoom && (this.elems.img.naturalWidth > wrapperWidth || this.elems.img.naturalHeight > wrapperHeight) ? true : false;
-        const isImageStretched = this.elems.img.clientWidth > this.elems.img.naturalWidth || this.elems.img.clientHeight > this.elems.img.naturalHeight;
-
-        if (isImageZoomable && !isImageStretched) {
-          this.elems.container.classList.add('chocolat-zoomable');
-        } else {
-          this.elems.container.classList.remove('chocolat-zoomable');
-        }
+      zoomable(image, wrapper) {
+        const wrapperWidth = wrapper.clientWidth;
+        const wrapperHeight = wrapper.clientHeight;
+        const isImageZoomable = this.settings.allowZoom && (image.naturalWidth > wrapperWidth || image.naturalHeight > wrapperHeight) ? true : false;
+        const isImageStretched = image.clientWidth > image.naturalWidth || image.clientHeight > image.naturalHeight;
+        return isImageZoomable && !isImageStretched;
       }
 
       zoomIn(e) {
         this.state.initialZoomState = this.settings.imageSize;
         this.settings.imageSize = 'native';
-        this.elems.container.classList.add('chocolat-zoomed');
-        const fitOptions = {
-          imgHeight: this.elems.img.naturalHeight,
-          imgWidth: this.elems.img.naturalWidth,
-          containerHeight: this.elems.wrapper.clientHeight,
-          containerWidth: this.elems.wrapper.clientWidth,
-          canvasWidth: this.elems.imageCanvas.clientWidth,
-          canvasHeight: this.elems.imageCanvas.clientHeight,
-          imageSize: this.settings.imageSize
-        };
-        const {
-          width,
-          height
-        } = fit(fitOptions);
-        return this.center(width, height);
+        return this.position(this.elems.img);
       }
 
       zoomOut(e) {
-        if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
-          return;
-        }
-
-        this.settings.imageSize = this.state.initialZoomState;
+        this.settings.imageSize = this.state.initialZoomState || this.settings.imageSize;
         this.state.initialZoomState = null;
         this.elems.img.style.margin = 0;
-        this.elems.container.classList.remove('chocolat-zoomed');
-        const fitOptions = {
-          imgHeight: this.elems.img.naturalHeight,
-          imgWidth: this.elems.img.naturalWidth,
-          containerHeight: this.elems.wrapper.clientHeight,
-          containerWidth: this.elems.wrapper.clientWidth,
-          canvasWidth: this.elems.imageCanvas.clientWidth,
-          canvasHeight: this.elems.imageCanvas.clientHeight,
-          imageSize: this.settings.imageSize
-        };
-        const {
-          width,
-          height
-        } = fit(fitOptions);
-        return this.center(width, height);
+        return this.position(this.elems.img);
       }
 
       on(element, eventName, cb) {
diff --git a/src/css/chocolat.css b/src/css/chocolat.css
index 4e6f3bb..22c1cbd 100644
--- a/src/css/chocolat.css
+++ b/src/css/chocolat.css
@@ -61,7 +61,6 @@
 }
 
 .chocolat-image-wrapper {
-    transition: width 0s ease, height 0s ease; /* center */
     position: fixed;
     width: 0px;
     height: 0px;
@@ -73,7 +72,6 @@
 }
 
 .chocolat-image-wrapper .chocolat-img {
-    transition: margin 0.2s ease; /*  zoomout */
     position: absolute;
     width: 100%;
     height: 100%;
@@ -97,7 +95,7 @@
     right: 0;
 }
 .chocolat-image-canvas {
-    transition: opacity 0s;
+    transition: opacity .2s;
     opacity: 0;
     flex-grow: 1;
     align-self: stretch;
@@ -202,8 +200,13 @@ body.chocolat-open > .chocolat-image-wrapper {
     position: relative;
 }
 
-.chocolat-zoomable.chocolat-zoomed .chocolat-img {
-    transition: margin 0s ease;
+.chocolat-zoomable.chocolat-zooming-in .chocolat-image-wrapper,
+.chocolat-zoomable.chocolat-zooming-out .chocolat-image-wrapper {
+    transition: width .2s ease, height .2s ease;
+}
+.chocolat-zoomable.chocolat-zooming-in .chocolat-img,
+.chocolat-zoomable.chocolat-zooming-out .chocolat-img {
+    transition: margin .2s ease;
 }
 
 /* uncomment to hide controls when zoomed-in*/
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 96cf3d8..ca27a97 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -62,6 +62,8 @@ export class Chocolat {
             'chocolat-cover',
             'chocolat-zoomable',
             'chocolat-zoomed',
+            'chocolat-zooming-in',
+            'chocolat-zooming-out',
         ]
 
         if (
@@ -185,7 +187,7 @@ export class Chocolat {
             fadeOutPromise = transitionAsPromise(() => {
                 this.elems.imageCanvas.classList.remove('chocolat-visible')
             }, this.elems.imageCanvas)
-        }, 100)
+        }, 80)
 
         return loadImage(this.images[index].src)
             .then((loadedImage) => {
@@ -216,7 +218,10 @@ export class Chocolat {
                 })
             })
             .then(() => {
-                this.zoomable()
+                this.elems.container.classList.toggle(
+                    'chocolat-zoomable',
+                    this.zoomable(image, this.elems.wrapper)
+                )
                 this.settings.afterImageLoad.call(this)
             })
     }
@@ -233,10 +238,7 @@ export class Chocolat {
         }
 
         const { width, height } = fit(fitOptions)
-        return this.center(width, height)
-    }
 
-    center(width, height) {
         return transitionAsPromise(() => {
             Object.assign(this.elems.imageWrapper.style, {
                 width: width + 'px',
@@ -260,7 +262,6 @@ export class Chocolat {
 
     change(step) {
         this.zoomOut()
-        this.zoomable()
 
         const requestedImage = this.settings.currentImageIndex + parseInt(step)
         if (requestedImage > this.settings.lastImageIndex) {
@@ -462,17 +463,34 @@ export class Chocolat {
         }
 
         this.off(this.elems.wrapper, 'click.chocolat')
-        this.on(this.elems.wrapper, 'click.chocolat', this.zoomOut.bind(this))
+        this.on(this.elems.wrapper, 'click.chocolat', () => {
+            if (
+                this.state.initialZoomState === null ||
+                this.settings.currentImageIndex === undefined
+            ) {
+                return
+            }
 
-        const img = this.elems.wrapper.querySelector('.chocolat-img')
-        this.off(img, 'click.chocolat')
-        this.on(img, 'click.chocolat', (e) => {
+            this.elems.container.classList.add('chocolat-zooming-out')
+            this.zoomOut().then(() => {
+                this.elems.container.classList.remove('chocolat-zoomed')
+                this.elems.container.classList.remove('chocolat-zooming-out')
+            })
+        })
+
+        this.off(this.elems.imageWrapper, 'click.chocolat')
+        this.on(this.elems.imageWrapper, 'click.chocolat', (e) => {
             if (
                 this.state.initialZoomState === null &&
                 this.elems.container.classList.contains('chocolat-zoomable')
             ) {
                 e.stopPropagation()
-                this.zoomIn(e)
+
+                this.elems.container.classList.add('chocolat-zooming-in')
+                this.zoomIn(e).then(() => {
+                    this.elems.container.classList.add('chocolat-zoomed')
+                    this.elems.container.classList.remove('chocolat-zooming-in')
+                })
             }
         })
 
@@ -522,88 +540,49 @@ export class Chocolat {
                 return
             }
             debounce(50, () => {
-                const fitOptions = {
-                    imgHeight: this.elems.img.naturalHeight,
-                    imgWidth: this.elems.img.naturalWidth,
-                    containerHeight: this.elems.wrapper.clientHeight,
-                    containerWidth: this.elems.wrapper.clientWidth,
-                    canvasWidth: this.elems.imageCanvas.clientWidth,
-                    canvasHeight: this.elems.imageCanvas.clientHeight,
-                    imageSize: this.settings.imageSize,
-                }
-
                 const { width, height } = fit(fitOptions)
 
-                this.center(width, height)
-                this.zoomable()
+                this.position(this.elems.img).then(() => {
+                    this.elems.container.classList.toggle(
+                        'chocolat-zoomable',
+                        this.zoomable(this.elems.img, this.elems.wrapper)
+                    )
+                })
             })
         })
     }
 
-    zoomable() {
-        const currentImageIndex = this.images[this.settings.currentImageIndex]
-        const wrapperWidth = this.elems.wrapper.clientWidth
-        const wrapperHeight = this.elems.wrapper.clientHeight
+    zoomable(image, wrapper) {
+        const wrapperWidth = wrapper.clientWidth
+        const wrapperHeight = wrapper.clientHeight
 
         const isImageZoomable =
             this.settings.allowZoom &&
-            (this.elems.img.naturalWidth > wrapperWidth ||
-                this.elems.img.naturalHeight > wrapperHeight)
+            (image.naturalWidth > wrapperWidth ||
+                image.naturalHeight > wrapperHeight)
                 ? true
                 : false
+
         const isImageStretched =
-            this.elems.img.clientWidth > this.elems.img.naturalWidth ||
-            this.elems.img.clientHeight > this.elems.img.naturalHeight
+            image.clientWidth > image.naturalWidth ||
+            image.clientHeight > image.naturalHeight
 
-        if (isImageZoomable && !isImageStretched) {
-            this.elems.container.classList.add('chocolat-zoomable')
-        } else {
-            this.elems.container.classList.remove('chocolat-zoomable')
-        }
+        return isImageZoomable && !isImageStretched
     }
 
     zoomIn(e) {
         this.state.initialZoomState = this.settings.imageSize
         this.settings.imageSize = 'native'
 
-        this.elems.container.classList.add('chocolat-zoomed')
-
-        const fitOptions = {
-            imgHeight: this.elems.img.naturalHeight,
-            imgWidth: this.elems.img.naturalWidth,
-            containerHeight: this.elems.wrapper.clientHeight,
-            containerWidth: this.elems.wrapper.clientWidth,
-            canvasWidth: this.elems.imageCanvas.clientWidth,
-            canvasHeight: this.elems.imageCanvas.clientHeight,
-            imageSize: this.settings.imageSize,
-        }
-
-        const { width, height } = fit(fitOptions)
-        return this.center(width, height)
+        return this.position(this.elems.img)
     }
 
     zoomOut(e) {
-        if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
-            return
-        }
-        this.settings.imageSize = this.state.initialZoomState
+        this.settings.imageSize = this.state.initialZoomState || this.settings.imageSize
         this.state.initialZoomState = null
         this.elems.img.style.margin = 0
 
-        this.elems.container.classList.remove('chocolat-zoomed')
-
-        const fitOptions = {
-            imgHeight: this.elems.img.naturalHeight,
-            imgWidth: this.elems.img.naturalWidth,
-            containerHeight: this.elems.wrapper.clientHeight,
-            containerWidth: this.elems.wrapper.clientWidth,
-            canvasWidth: this.elems.imageCanvas.clientWidth,
-            canvasHeight: this.elems.imageCanvas.clientHeight,
-            imageSize: this.settings.imageSize,
-        }
-
-        const { width, height } = fit(fitOptions)
-        return this.center(width, height)
+        return this.position(this.elems.img)
     }
 
     on(element, eventName, cb) {

From 0401e59ff4a02e94730684d2c1fd8c7dfcb1f024 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 12 Nov 2019 23:07:24 +0100
Subject: [PATCH 51/65] prettier

---
 dist/js/chocolat.cjs.js | 2 +-
 dist/js/chocolat.esm.js | 2 +-
 dist/js/chocolat.js     | 2 +-
 src/js/chocolat.js      | 6 ++----
 4 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 9358dbc..94e9a57 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -189,7 +189,7 @@ class Chocolat {
       initialized: false,
       timer: false
     };
-    this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
+    this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed', 'chocolat-zooming-in', 'chocolat-zooming-out'];
 
     if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
       elements.forEach((el, i) => {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 9af44b2..bb85e3c 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -187,7 +187,7 @@ class Chocolat {
       initialized: false,
       timer: false
     };
-    this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
+    this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed', 'chocolat-zooming-in', 'chocolat-zooming-out'];
 
     if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
       elements.forEach((el, i) => {
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
index 075c532..aec54bd 100644
--- a/dist/js/chocolat.js
+++ b/dist/js/chocolat.js
@@ -190,7 +190,7 @@
           initialized: false,
           timer: false
         };
-        this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed'];
+        this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed', 'chocolat-zooming-in', 'chocolat-zooming-out'];
 
         if (NodeList.prototype.isPrototypeOf(elements) || HTMLCollection.prototype.isPrototypeOf(elements)) {
           elements.forEach((el, i) => {
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index ca27a97..a620019 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -558,14 +558,12 @@ export class Chocolat {
 
         const isImageZoomable =
             this.settings.allowZoom &&
-            (image.naturalWidth > wrapperWidth ||
-                image.naturalHeight > wrapperHeight)
+            (image.naturalWidth > wrapperWidth || image.naturalHeight > wrapperHeight)
                 ? true
                 : false
 
         const isImageStretched =
-            image.clientWidth > image.naturalWidth ||
-            image.clientHeight > image.naturalHeight
+            image.clientWidth > image.naturalWidth || image.clientHeight > image.naturalHeight
 
         return isImageZoomable && !isImageStretched
     }

From 1673d36580681f5f84dfb8b4813fa8f40de1a940 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 12 Nov 2019 23:08:44 +0100
Subject: [PATCH 52/65] Reverted demo

---
 demo/index.html | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index 4bcd0e4..b05422d 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -37,18 +37,15 @@ <h2>
            Full window, contain, click the numbers to open:
         </h2>
         <div id="example0">
-            <a class="chocolat-image" href="https://nicolasturlais.com/0full.jpg" title="HO">
+            <a class="chocolat-image" href="demo-images/5.jpg" title="HO">
                 1
             </a>
             <a class="chocolat-image" href="demo-images/6.jpg" title="HAI">
                 2
             </a>
-            <a class="chocolat-image" href="https://nicolasturlais.com/1full.jpg" title="IO">
+            <a class="chocolat-image" href="demo-images/3.jpg" title="IO">
                 3
             </a>
-            <a class="chocolat-image" href="demo-images/5.jpg" title="HAI">
-                4
-            </a>
         </div>
 
         <h2>
@@ -120,7 +117,6 @@ <h2>
         <script>
             // standard demos
             Chocolat(document.querySelectorAll('#example0 .chocolat-image'), {
-                loop: true,
                 imageSize: 'contain',
             })
 

From 41e2badee33b75346bb6ce6cfe2d295ad8785b2a Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Thu, 14 Nov 2019 17:41:58 +0100
Subject: [PATCH 53/65] Bumped version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index e96f97d..f1e5106 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "chocolat",
-  "version": "1.0.0-beta.2",
+  "version": "1.0.0-beta.3",
   "description": "Responsive Lightbox Plugin",
   "main": "dist/js/chocolat.cjs.js",
   "module": "dist/js/chocolat.esm.js",

From 599ae53278e3a95867af9fbc21df0e0aa62d9a47 Mon Sep 17 00:00:00 2001
From: Diego Scafati <dscafati@gmail.com>
Date: Sat, 18 Jan 2020 18:40:35 +0100
Subject: [PATCH 54/65] Fixed relative urls in demo page

---
 demo/index.html | 41 +++++++++++++++++++----------------------
 1 file changed, 19 insertions(+), 22 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index b05422d..698e020 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -7,7 +7,7 @@
         <style>
             body {
                 text-align: center;
-                font-family: Arial;
+                font-family: Arial, sans-serif;
                 font-size: 12px;
             }
             h2 {
@@ -21,9 +21,6 @@
                 color: #2645FF;
                 text-decoration: none;
             }
-            .demo {
-
-            }
         </style>
         <title>Chocolat — demo</title>
 
@@ -37,13 +34,13 @@ <h2>
            Full window, contain, click the numbers to open:
         </h2>
         <div id="example0">
-            <a class="chocolat-image" href="demo-images/5.jpg" title="HO">
+            <a class="chocolat-image" href="demo/demo-images/5.jpg" title="HO">
                 1
             </a>
-            <a class="chocolat-image" href="demo-images/6.jpg" title="HAI">
+            <a class="chocolat-image" href="demo/demo-images/6.jpg" title="HAI">
                 2
             </a>
-            <a class="chocolat-image" href="demo-images/3.jpg" title="IO">
+            <a class="chocolat-image" href="demo/demo-images/3.jpg" title="IO">
                 3
             </a>
         </div>
@@ -52,10 +49,10 @@ <h2>
             Full window, cover, looping :
         </h2>
         <div id="example1">
-            <a class="chocolat-image" href="demo-images/1.jpg" title="foo">
+            <a class="chocolat-image" href="demo/demo-images/1.jpg" title="foo">
                 C
             </a>
-            <a class="chocolat-image" href="demo-images/2.jpg" title="bar">
+            <a class="chocolat-image" href="demo/demo-images/2.jpg" title="bar">
                 D
             </a>
         </div>
@@ -65,14 +62,14 @@ <h2>
         </h2>
 
         <div id="example3">
-            <a class="chocolat-image" href="demo-images/3.jpg" title="Rose">
-                <img src="demo-images/3.jpg" style="width:75px; height:50px" alt="">
+            <a class="chocolat-image" href="demo/demo-images/3.jpg" title="Rose">
+                <img src="demo/demo-images/3.jpg" style="width:75px; height:50px" alt="">
             </a>
-            <a class="chocolat-image" href="demo-images/4.jpg" title="Black">
-                <img src="demo-images/4.jpg" style="width:75px; height:50px" alt="">
+            <a class="chocolat-image" href="demo/demo-images/4.jpg" title="Black">
+                <img src="demo/demo-images/4.jpg" style="width:75px; height:50px" alt="">
             </a>
-            <a class="chocolat-image" href="demo-images/5.jpg" title="Yellow">
-                <img src="demo-images/5.jpg" style="width:75px; height:50px" alt="">
+            <a class="chocolat-image" href="demo/demo-images/5.jpg" title="Yellow">
+                <img src="demo/demo-images/5.jpg" style="width:75px; height:50px" alt="">
             </a>
         </div>
         <!-- Container (notice the relative width) :  -->
@@ -83,13 +80,13 @@ <h2>
         </h2>
 
         <div id="example2">
-            <a class="chocolat-image" href="demo-images/3.jpg" title="Rose">
+            <a class="chocolat-image" href="demo/demo-images/3.jpg" title="Rose">
                 A
             </a>
-            <a class="chocolat-image" href="demo-images/4.jpg" title="Black">
+            <a class="chocolat-image" href="demo/demo-images/4.jpg" title="Black">
                 B
             </a>
-            <a class="chocolat-image" href="demo-images/5.jpg" title="Yellow">
+            <a class="chocolat-image" href="demo/demo-images/5.jpg" title="Yellow">
                 C
             </a>
         </div>
@@ -140,9 +137,9 @@ <h2>
         <script>
             // api demo
             var instance = Chocolat([
-                    {src : 'demo-images/1.jpg', title : 'caption 1'},
-                    {src : 'demo-images/6.jpg', title : 'caption 2'},
-                    {src : 'demo-images/8.jpg', title : 'caption 3'},
+                    {src : 'demo/demo-images/1.jpg', title : 'caption 1'},
+                    {src : 'demo/demo-images/6.jpg', title : 'caption 2'},
+                    {src : 'demo/demo-images/8.jpg', title : 'caption 3'},
                 ], {
                 setTitle : function () { return 'set title' },
                 loop: true,
@@ -236,4 +233,4 @@ <h2>
         </script>
     </body>
 
-</html>
\ No newline at end of file
+</html>

From 5964e7c8497c941aa1816fb43754469e8006bffa Mon Sep 17 00:00:00 2001
From: Diego Scafati <dscafati@gmail.com>
Date: Sat, 18 Jan 2020 19:33:32 +0100
Subject: [PATCH 55/65] Added support for srcset and sizes attributes through
 data-srcset and data-sizes

---
 .gitignore                     |   1 +
 demo/demo-images/1280x720.png  | Bin 0 -> 4790 bytes
 demo/demo-images/1920x1080.png | Bin 0 -> 7940 bytes
 demo/demo-images/320x180.png   | Bin 0 -> 1178 bytes
 demo/demo-images/640x360.png   | Bin 0 -> 2516 bytes
 demo/demo-images/75x50.png     | Bin 0 -> 242 bytes
 demo/demo-images/960x540.png   | Bin 0 -> 3746 bytes
 demo/index.html                |  22 ++++++++++++++++++++
 dist/js/chocolat.cjs.js        |  36 ++++++++++++++++-----------------
 dist/js/chocolat.esm.js        |  36 ++++++++++++++++-----------------
 dist/js/chocolat.js            |  36 ++++++++++++++++-----------------
 src/js/chocolat.js             |   6 ++++--
 src/js/utils.js                |  26 +++++++++---------------
 13 files changed, 88 insertions(+), 75 deletions(-)
 create mode 100644 demo/demo-images/1280x720.png
 create mode 100644 demo/demo-images/1920x1080.png
 create mode 100644 demo/demo-images/320x180.png
 create mode 100644 demo/demo-images/640x360.png
 create mode 100644 demo/demo-images/75x50.png
 create mode 100644 demo/demo-images/960x540.png

diff --git a/.gitignore b/.gitignore
index 3c3629e..944c283 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,2 @@
 node_modules
+.idea/
diff --git a/demo/demo-images/1280x720.png b/demo/demo-images/1280x720.png
new file mode 100644
index 0000000000000000000000000000000000000000..7758cf7eb413f5ea14cfb8082d303211d52e8af0
GIT binary patch
literal 4790
zcmdT{_g53z(hZ`50>Nhi1VZ%MP-y~6m2!cLh%_Mtqy(-M={2;_6eTJeE+7V}B3w!W
zglaH>5R4cB=>~xSp|{W?gpv^Q;kVvD@n)^F=A3o**>irFwP)sqwWX=pap~g#06@&_
zj`4i};K;%DQ14;E19#h&?0Mj1tnb;GeE<Ia?c2Axxw#k&rmd~5rlzK-s0fe8lSm{a
zBDCxPb}aagV;BGc{PKGVWL^i#001Wq&5RB0qH<TpEW%`{kB?5AKlW1hc)j9UT5#<P
z)aS45bHXF8R8zx-*{-x#dG}FI@)|=gHn*?tFJGFgLlA_>2B+OG_1JovWyy(-(3A;?
zm_$RHgINFjM%FK(g==?7?5%1P+*2m)#_c<Lx4g4RU@_^jlQYT*SuU{~^T=|B(q#sJ
zveXXrHEUi_Gx}y_Y;ew1UZGNKp3c;8SMuk`NqsLkJf53T1}yqsE1-*WS{ZN4Dc&T0
zTt_e3_ISx0rxLP(jSE}51%XUr6;M1-wd-iGTs^za1gG+dRS&u15?;z6!PybQ6K0KC
z(QU{|p!lkS3>jSXbzgJi&0wd6RdXDDDL{N;S7Bs)tqS~6TetDbCqVx810CS7>NW1U
zc;DP^*KjIbj!cZ=ny%F!++&>qh}Y7{<zi?Q=r;U}WXT5gHU@t+k+<Ek*+#55_{F<p
zZvAC8l0$w2nt8m^{Z1$QAU^<iEwfQ1c429K!s{JC?n)Qvl}kpk%Cfy4bKZj$L8D8P
z9q<2A!cvT|b9b6wZ`3zS2DoQ;izk(iZ;Id;Rq^ygLj~eZ(@X2UC^dl!YGq0SpFV?y
zno$&qpK;h)?=f4Z7Qc?6Ov3!cFha*$6cgFPdvz^Jq#f?^7!--T)pK~=jP@Bnn-tT9
z%h82AqiJqOL!#&su1BmYB@D(xd+8EnObWtvpXjKYfTT@6rd@Do3V{Urb?cB)h?xUr
zMte76e$4Ee?7VNW)a-TxV8dS5O)yqWQX?Heaznb3<eWzp+220|{wrIj|6GLb2!%iC
ze`D_`R_Y->ZHBJJ)CF4UV8T!z@$tD!)h%<XhV>!+%&U4L#54?|DNqFWS*~o=n%<vN
zw%+;%;^5&*ir23XN~M+qxxV`ACxzD4eZS1*7B6bexiIn1R(71{3Uj<>yMyK4j~EIy
zi!x+P!YupkCTuX2_{)4Q9RE}zQ+C@F6Rml%XDZx&tm8v`^{b<6G09uKQ1FxgG(I@u
z9PW9g@4DVy_>g(ipE74$*fE*DMj(QjeqN+|(c9?8<>TJ0D4xob|3vjOE0~K$w!5a~
zK*Wn4rJ@g>IA}Q`GiG?Yf{{!$Oo1k`1E7sdRJOpIjV6MVjs;3zTy<NX=B_Vus4<Y@
zJ(;}W_BSN?hI5DJu|rYP7aQzKHXfJqCPnfux{SE|Q**$}9X>&J?7v$Vn00#*e$57*
zr5=3tvHbU-HKm33soWr>Zzna?0kowiOZIpRP4$D6ZWQb56$m{Xhw#fYd=j?tk|h1A
zbP77?A91-F?PYJxME4KASfxZN?{e;8A}+o3XxzM@mKbchO5^Jw=$B9`6ttx-OP*0L
zl4D~msO`_2$JgsQ^SWpMgLVnOFq_|J?W))xAWntse1WJICo|KDP^77bEIFe-t%?AU
z^E6%7PUJy8X%o;!$_XI<t3+%{cn>K$>(g#MKQqzn1bGZgDWabwqZhl;v-+vGL|Zdv
z9B8Xn187`TXL5m6K3iiZ^R}}N&Phl`50)LSC1(SY8=Faa(0|v8ll1UMAeGne))6JK
zsW;ggT9eJzZrU-rMaee~O3m3^7~}V3Ed{G^53A&s=S8$G!i<%cR@L#p>`{%ak1=x5
zH4Oxo5A`bmRSp!&5TE#C<chGHBj-a4qM^`#eCGny+ei2sO^fQujUqi%_v$kry_a!a
z=D(z7fQ)Bv9|5EK3rt+#5C8skHF+QD$vNUOh1nhH!4KYg@U(nNs>Mx3NY)kv^zr~$
zamPApWop7~_h!~#=R7(omGIJY$eR@?BdCedmc845vHef;`j{IpLT!y<OwmwjNo7@>
zlLaSx;01BtT}WYCPT}=XbmV&*+N5<lAfL}@jw*ntuyUS#DkoNHpKOhRGfSA~9zqJX
z-5cp!0|RD3csOJ_NvN*r_lt<LZ{`da-i92tZ~aGhPCaHRU@og~`zGe>Bzv$UKX6P@
zvj+qL0X@-x<Wu#&3r&^g81b_(d-1nMiurl;OvF#hWXSrOMb*c-`7(sjD=bi`)(Ft^
z`8&kOJ50J(wC-%g8<R$(E$ly#1x#WEA>OZOHk@v@jA6c~LXd*P=Mz2cvelk)oU#+H
zfq%fZs!~G7%mZaB>?nbmnZL5=lI|Q^@~a8kooNi^@$w0>r;3wb5Q<G*C4nq1hMuY*
zPD&_S33u!-hiA9n{knB^!l$<qRRKiS+)kYDd+&q~DKoQNJsoD0!f3d_^>)`Mw9*E1
z$B&$mb_4+*A^=$BUYC!l=;pnKK3RVjb2-FnWLgO?Ub%8T==<Wuy;qcPOTki3f(}+3
z0_qBh8DM=f&ZIHo=IB($WfD#Qm(C^lSQO@$;|@ydH=iE>`<IwbzH-st?I8TTlA6CS
z%QJ2QbKQ9+@^~@q^Kv=kI+_bXCJjlDIhQvlXBmV%zp+=o)oscf$Uwbku+=(>w;gI4
zZO)T|w?D*E4E;qWFyOlVi`Ar5w;QCk9LREL#VASG)?y+M*~$E5c*;{CR@wiUTU@uy
z_|KXI#%zTBTb&<$B@)UR+kMeP0Rgq+aRaL1yswWw=n}MLKhFVfwWyuW{ZNAM4T_<*
zN`N^Me>FV1Z+SJ+;pwrpmze|iEP}QxfyipD#4fSJN&8pj5=#wn>V!6IT`H&rWw#Qi
z<uJPU_k9_g-*H9V>K0@-b$BLO??q(CrdpNtoP%&a(Pfj&#x9wnIGpeV!rc}?2XjQU
z$&ltnHbVjy2c8ext7u_bNE#70U893rl&1;H2kGTz3xJvx-O3v@p`E&^|BN6HejUWx
z(lCwK{m{!<PqJ<M_z<O!Q%=;6mN_)ECwvdz+dq0HmgB=)SC=)Q;-h48Koag983nD(
za~m9kvD!ue37jlAv=8*%Q6pkq(NU7R<I^KhuUFvvBv5iylKK_%Nh=xR>1|gj;DoA%
zuKkNo0bpo~Y7e27{zvWX65nNvx@z55BxdTXUwEnt%~kn~a92rOIm4)qT#C!XKO%gg
zv-P(hv0~mZW&_V+C-ZA>JHE6(c4WO-<uo~>St~oA9Uoov=<+kq9yPEpYm$j)Yjv?F
zfO(_OrAgoF`8v)BJ0w-(G}#M)D&;NWkr-i@D!x|FrVUn6QLn)3@AOmSk(H&O#A%by
zaTrRGjIi6PXk*zGR)}avez~reL&^D}Eyec)q0#dv+ZE4hZxE__rn`P~qQ%{~FR)hA
zE1u#fdxlm=JQUO%vx5RzWAll#)&<SUeX*KTNhVEksY~lSzXbfH+34n#&WNS}P=g@+
zT{m;*n8v#h73;XpC^Ywon9_Uowak=#?DB!M!fqv66m98bVuW5GGHd;=p?yP3vp(7O
z#j`BmIRIA%o1l6tlK%z5fZ^9Z$rW?8vPM0VM`xc~A~11U_0&PZo8~G!(n!~f@l(Tq
z!PlIC+HHjuLju=kR?jybJSnr%Fi{z4BD@-N28$C*MjQA}V<`eN*~P9uzvYH`#r&fr
z{Z2<ke6FO{_fTU4v|}^~Un?t1p+b>@-;Pv27<!F{CpAy6jCC!TGEQmiL=1d<mQ_ek
z`I!{8N)Zk0<GOx3T;1KqMj`O@zZhq98{0pBWK=hGyejphUA?oVFk;cc5P5ee4`|gH
z%JU>Dh6&AewWL_bfy4Bq3dz0`iZ-vw!<o%}w8;~yX$0xOABE?4KJcJ(X!oNCylM>C
zUOAHZDSKnjI7oHR^(+hoJb#M38(ieo{UnL_SLwgA{=Y&e{>ARnJ24c{$kmFuKZav}
z16@GCKg8TJQ}!HNdsXk<?C;7@S3ru>D&8w#uFfZ~IZ04TagmF<IJH`BSz~GPI%zsi
z!v`5Q?&+2pu2Q%6%`u#q@MG+PS5hG)YnS{ZxL_&xgb$!oYnY5yR~3sN5gUT?t`5$@
zp6Am9w8qs@_MgFju7UOO&h=Js&FAWgonm9g!{uMF=Ud;+X6(<f!i~Hi6!^FJld|hs
zqZ1fJ+RTZhr0vE7CG-J!%RE@T7QmW#35|4Yj2KNd2(3t&JEMUU_kO~V<HszR9q6?C
zMS)idY4~~h6(f5WVa)j|zT#FP93L$+x75+OlKenv!;DDREJk60$h5=N%Nohur>*+S
zp3Yy=U{_S#p!XUbDVW7sB89fhT`yLTj)wiN!Rd!pHW00O3rL^4^X?a+EaAApwI}I6
z%a0@QhG2~6gYulN+am`R{hS#fwIpZIxP-Sj5~3*&9Uz$4+PjpwoOX<C6%80KsAT6}
zX;}6R)7q=QL7Oy4FKMQ0R&;Tj?`ULPPY((h-yD!WjxNw}-n)LO^i<}CMcuQs-!OoZ
z1}Yh1M^I~D#Y+rMnb*;@JITA>9i>o9@)V8d(dnt(i*L`vjp3SaE+#VLr-pI&Ay&2t
zuPb*CeJ%cZ!CoBZA-4%a4iFYf)sPXEj5D4}E$u(xvHy=BLmEG%U2_hzYUfu(xLQuP
z)-0XFDxdnPA^KnjhL4@ATj*Qg^mhXhc*Y5gouy!TGXPS$!S$#sO`N}jZ<9>GwdnMl
z6p<JszngVVA!nZaNbf~~)PA_vR~PHY<i3x9Rc8>e1WewPn+X9Fc)WZvF}m4VwV_Pc
z(br@i`Q-gcsrlY51{+oZCg))(t($^bM4@mgvYECqvb2=P2$td$8}O%0qkpt^)^Ef{
z*gFX}`oT4`;sFC-$}7RFdY{;>ku?LPcEf)9oipDG)kef5|GXs>{PUp0;sNrDyUq%!
zEFPM6^*kd9G`_YAxOcM_7KrhPDcc<ctU7>z-r)d53uFjJN<pp{Y9)mBr;YEbTIbb_
zUZzJ1PXy8?gE<1<^E|!?EWeKBy`W!HkX;JF7%4na-0(2>UbyQV`ZDckFn%dm6LEN5
z*MDbb|3=1p^=7<jvz4Q?qAt`tV)t2AtxTu$wed@dL_4J5lE%=)RA9Aeq=dR}jBoIu
z<;ek=qclv&K1DHSs`fiPz3}EnS>0%%c2iI{j26IA&?vjP8_Qc@cW_=nkU}gXBUZI}
zr!7IT_F2XnU!{3xt|!&0$X&l?>3?zX-a8GV@mmdr&!xJ>uoex>loPGiz#xm#fvFGj
zsDdi+I5&2SAWzDTcan9HXj>i|e3Nj;>Pm~WeEZ?*y^Y}jmJx{D-lDY6-A`3^RYdLE
z<&HIRM}CRV`>-5YLHgHGlHS{VP2P-2$mY@_2bW>>cKcsbT)e$*bQtX9;q__e6dXj(
zK-0jb%BXnx{0iVMzZJ2hmsrY(-~Bby1!2Xp*pe+uD3T(d!%2Z7Bf??f@s4{0;X^x{
zyStts^0Wz?I`eB`XUp`|UtfvfC#jMdog0$4@x6~byK%6{dU-x4Is^`j35VG=k@#!z
zwT=1wOo6@0_8jd*(=M=8YIhY(<lOXF!P7S&`s@a?6aH;5`T?I^|4vX(F<v*?_UY{j
zR;0;@phQd4X@jo_f@Louhqyn$j>AJs{CUt`LAe%8WQAZ9$0n^?AZ6BEz@v$Ku5v!H
z4XeRuR)}|qC0P!0aDhOF+&Jeo2cha%>;1F2M<gZ0hN;?jw!K^1#-@C2a=Y?z59{}_
zIwDHlN=y(1U{BecAMgTIpD-9tyAlL+5!^42i(ELqZnd(oTj=*Y(+s}y1w|U}>c`$q
RmHK@)GqE(T`qS;n{{iS{7>fV^

literal 0
HcmV?d00001

diff --git a/demo/demo-images/1920x1080.png b/demo/demo-images/1920x1080.png
new file mode 100644
index 0000000000000000000000000000000000000000..d2ffd8c7ff950a9f31b7a0cef5554556d8fdb1e8
GIT binary patch
literal 7940
zcmeHshg;HZ^f&G&OMS{rGsja;Wm%%--j$k}t1|a4M{aYVsi-ZjOs&k7gUprSMnqH`
zshOgp5#nGuk{mctaG>(T=e^!P;&;6-*Tuz`n{)2Zxz4!H=RUl?V`VBLEG-NG07T4g
z8Q%i{gc1P&el31J?uzstF_imp>W;;IlYxPOtgNj3{Cp@B+SAihS65eDT#Q5_+uGWa
zW5d33#SVquatsFmM7s~(Jeik7PXPdO>1M{)??>m;NtRJF-=6|K7GR~`Hu}M_7ZLQ=
z*@MKfz7Ju6>Dgrpntk_f=WChc3Zq-SbXjKctW4wM2Ew-2o<6{+60qS`#M2J^hxMZG
zzP!QnX^;!{|6l)$J+Qy&JP;z1rM1t70BOqmyQDwR{cW}+Qh;;SX>}{l(6x}mX6H@o
zEccF(vJ7N_HV%lHb`E1%VY@4ANtZM8ToU<v-@(N+=TF$>4o;Ku<HhX+k?KD)c~Igm
zy+-ix=%wAsjR}M9sp!PRFgr<I4$}h#cTa)@t0L;}%tjj=qt?(;DMvoCL2eGUh;LC*
zl^em;H~Cx~5LjpDoxlv`s2E4CRv=QRs}}bjfLz!8r4or5OvqH)0=JAQ%iUvEj6UQ6
zRysx5tfwxHd&9=ILu>d!;c7Be>t<9wP5Q$M?WI7mMEn|6<N{LaP^c$<+7jGok*(V{
ze>}GEqM+ECmr6(ZV<1+uFHGSv%B9l^_EDMTL_8wYRO`QI306h7Y5iHDdy4-PrY=Rb
z9VbhxYw)!&b%3nzg^dr1tUyC~>Nlv;PTtN{+v=z#4CuB;)M61po*6azWWi;*%NRAg
zKS6=Xhae4PMGw%!-{@j(7M(ZW=#%T-K+^My0LsT=10HDVwOM@3Gc>OZ#VcpcCoWSm
zrU2QtN_fJpLf~fX#QZ~fz3xW$+(V&I9xHlMpP&{#@thN?ce1KR@W5LNeM**Uor}hG
zrn+`(@W)q=Q-4`$LE7<`vI8^k1u<dw>k=k6HM}eT6E=ylshJ7$?R$XP3qC3%%CChM
zXGL{I7=Z)CB`l&4SobcUQWsGHt^@i&F@;)orMl-NV<{Kn=SKN>3<j2}2zOClGm*4{
zuO7{uT)A#ii(+gpK+=w`h^)xtuGxH$K9MN&Rl0CCHf3N)T3vJg`z1tsHLhm|%per$
z$awQ|4Ib#bQ4=(X_?1Vf_1t~?vhL@vSWB^;ZF$2_;2p~hoOihk?s@!vvV0a~AC1Te
z(GkciG33lJwjhzH-g%>%q=P-qXJgygf136(jD-+oLVMZrJ`fFDx3U|yaV=b;`9;O%
zg4{+6hD|7E29xLxqojUiWKDWFJD^~LKHD{88@(r${R}q6vN%Xh&RP7Rv?c1#=f=NM
zkm279hh}Bu&a0iS*c@H6vd5|~fi8CqO$_YUC>#aV<h>|KcI;%T<9nr&MaRt#GG$7k
zVrBl(F{1X@m&GRFr%i?Xb;L=*>#7kMG4MBw+x2e8CMt%!v9<6<+D0;|d6G}WtY(ur
z{50WhUBSB_5nKyE;<7)Tz$-&B=`j$u9(RD)sKuq*ttW>zC*W_t1vmLA9d6n2eT@bA
z+;~xf1aWHHe#>e2IFR_yAB0~;ahMFX-jNTI-k8%o)c*6K>&6_-LzcC0KM^*H3YT;l
z6RB~=h#u1o1$$Sxs;HSOvs2vIW}&J(ACGX866#G7f4=a~*nHsSMob}7Qu~mPdz!OY
z)~!}o@7h?U%`!?_CHrpB1QgT>bzInJ7hjB(H3&{h$>3Jr#C7F4xKGEE@yo&@JCU%l
zjQA_jiJV97IEz+y^^<u+-^AGTA0YKA)!(tO_)gn1mG%`HL6o#fYqpsn*Kv~%og(}$
z%D|i~BmaE8Jem153sv+~Uu*x0Ua-<BYEZF6s&WAfQ~s}m$WCJv3)3y<LSN`(ud!xv
zoFxmj|F(e5mf6j>2WQEY#dE>O28ER8-pA*{jf>S_QA|tp=QkTB_kn6!nCO>x?UdO;
zcmvtJi-qU2ghT!C!5{Ks@Xl+n`*vbD!wVLp5cZg|jmTJcmpQ&|`znyIc#_<Wfjt|U
z?T*|DV3isc=t@w3LQ6H7C7bg-puRGjN}Zo4d!{>Y^Tv$@BrNN{epstSfQXC-yo4V8
zoH9!=Hs36}-0{*@*PL_K*0&h%S*VbZff-O15YOa~p1iVTS@%a>GdFCHlu!`ZZWTL7
zaLYU>yYgKA;DjN~X|eCLempV|M3HW?KSqrVQ#dj>2><G0n22{H<};Ljws7<&*qgBb
z5c*_bCq@{>TVn`Y#JXHiuMrpF{WvM)OM$-qvQ}{WhvJE;^_l>w=KrK`%j2LA9c-$1
zenyXaWiBqdA_WxB@w8bizlbyqJ?TdA>hF=oz_o@m?MHT4unQffwy__8qb+(a;NXmX
z>8@eD`(}wq3>zm}{Y5kEH`I&3Q*BkKJpCYfTw=-SZlXC1lyit`dz@;!p)<C>R2bN6
zB*DL><q!5BiTD<X^4F|pms&SNV6xs>E2anH8Zy*5&DQzgCqeHWMRCXZx76TzOLPJr
z19w4f4b%$npI<kT9Pdv;eMcXg)H{-%AR*Ay;4hRbA!FR$$?|T8q4!K&Os9*4dE<Vj
zy3c&gdrmCPB<Fe(E%1$)b>AdUmJgA6BpeN_hvZ8La#c|PQ;6XZ_^!mp?>jF&T^=Wj
zlhA({cQpR2<xc6?uU^Hu^&nEkj!nh4cfx630NHl*f5N}MZfw|jSsk7^e#BPlJ9w2a
zVR^m-Wq!U0yX#Z#0zGvKVV*)f>iOQ)$lKLKxjE4(l_~0;sN>(bQ8WI3ci530hwlt5
z-5+y}+dnZ2%zXh!M(do~h#nk2Jr>9&RNbzbhl%R{4sWXG0ai_T&K)L@0KUC=xTWfn
zq9m0#BuznOh{Uwc1rk4Kj-PM4;$PDBlQFdz_@B$aelIZ5q@k|V-T9p|E!~yV$5Wm3
zXsEZ}Bw#3Q>G%=)<+;~qaFEdVu<MWUg%Qu4QqG5Y_jcdxUG#uX0TfsWm95E(*}|bw
zkIMbQ)$HHjlR@A9oz_XE#}xXB!NatbsweL5ygN!s-B8R}f3~KRbAfBotAHQZ$5P?f
z(|O}Q{Gi$`Cr#gEyiUW9ZJ6vooPV>)=i-9Mh_IYF)nK=&Y_qO@f>hG=TtrAqeLVpQ
zpgnXFp&v;dwDSz|J>w!<s3M>$Nu7pze_Gf|2mXH8+?LR*w6}zv1tbGE%3OgG)L?6d
z8O<hWTP`q2e+8_wHc)j11(39_ih6Ea4q^%t&zh6^qN+VLGg^j6a1!fE%w{;!M{f1X
zCFwj7+?DD)6Iet}(k!ow8zRpO0Nd~MB@wnCenNfZVqCBMa}iq30W09&lWty)hz+OM
z$R7m?DxPeEzYbXF!#oV*0oF_?zF9!4{2Qpv(%+lRq87<XQ(KqmFSY|N@#)4jRNGBv
z$1oT<#LbWPbVY+SqN8af#ywM7>wZV@d3PbvV$+A>7rvxi;zRewWy9?(^8y7wK`&S~
zt1C-ZGN87;n1bZ7WWI^Kk!LC03ygxuvBBAjj}?aLACHkXYSTUqXYGErR*JAu{`Sly
zif(dXkJDd^v1n@~R71t{s-cTuOP_$2Zm+i2e2iDm$ht3K`$YJAHuR>}Z?I~N{(M{F
z6hP9pYM~zq)P6bRn9;A;Q6bmAbuJ{wN2}vCTIcOw?r$r%Y&B^xwtb)Z=agM%1ig0#
z){jei9>!C62Qi#k!#Tlld=;^7UND=k6m0r{62>z`rp4ZoqUHq$sJ{E~6zM-zd$+1u
z_-BK*r7pi#JS;c_#t%{Y_AF}pYQ;y<RsmhEh3s1e!+*IRsnL8JsRSdW#7&Rh71wBJ
zUT}sLcQHd{&!7O-6;6*rX|#l`sV!W{9KzDo>oY`exFxAzmNy^lK;j-@c$LSbK2q6P
z?R&Pzs4C76CZ&=(O9oec&vfwsVNTK4>?<WW#c?G595BZ1(*WY%B9Ue(w-AL;cxTbv
zmqSTKQ|@H+SHU0W4JcP6sTXZ^mkm=d>=y_oeLC!u`t9sEz`g8LipsvO-r5(=@zi8N
zt;*H?-N&+3tpf(UdhD~g6jri8j_F5{)iVX}W2AhwI*JO?&i^G=;^k$mEu*zx<v9MU
z^Ro-O+&1X_kCp8*TMz2KPx`C}rJje}7=|t?7(ON{)C5EvG3O@G-}x=U;gO2txqsVw
z81ficMtsrTJI*tA)SItW_T@rkU>EAq2=Vu*K+e<c58gJrT@SUhB8|()Qid|zQepPi
zHPfc~*3TVYo=h~W=NVEv8_8BZPK}XIP}m{z@yhHhD=#|AO8yIZMOWzPO>s-4xi=jC
zOC|lnDe8v%u1;0d#8UtSf06PFGbbhzsuj^HVR-MeLp2!(Wq}RbN#RsJp1CzIJ{Nl6
z2!H9EvaHK20VV3~Brj*#_s0^1cY-7vVP=J#mt?3Q{I~n7)vOvdIqKA!Va`7ZDGT2I
zrY^_%o5p)<@?P?_1W&ovPmR@?ku#k=w75+XR{kIoEwf`WV&4g5v`qT5hji)Q3WLDd
z_s%nqRY{@am%-7AT^q1P6J=Fz)=?_aqSBWSa*?e#W)dHDIOBA7l{f4epl0z5eaTR-
zqi8L**ohss!S`ODUrX~Sj5PkYhumGRp#Ie6PD&ClQ4#K^L^evSnG3?n4>czP40CC%
z@AoXGxac<_e>5N*;AQOqq#<FRiJ160WVQerF%qo%vR0fj!l?VNaJ2ahI9*~GYYyts
zf(<rF<5kbU(vOrE(CeC$gsC|um&w=UxyIn!+L8hC*vT@((dj9k;3NRqH8^{B%+TeK
zO8TRJIxMr9^p*G=F3H6=8cYgm=_mdAv`CRX7r$zp=14mdmt9^=`)T8b*pc+p8EB{5
z{xBAm8@ZO~Y%~-U;=OFsj9c(BRn6QyO6>wEeNX9?lcVlzYh%i8fqw|Q@^Z6AL<Ch*
z^Q4WqpV2DuXyiEi3w!8!h))ip{3$)coE(~X7;2Z0;5*r+k$fdeQ+4$f*D<mz5raXY
zrpQdSw()p*o?!XASpq%(iiw6wJzo}0gczH1Q(f&i6_jEh3wQb?W$eF+nnB9P7$v~G
z7Pju3IXJOj)}*JoraV!c%j;es4rALy++Mhz<BbD<n7p3uEHWFrmKS>{H2kz*c6%6y
z3a~dz4UpEqVw3p9_&JZ&0MXFhXWt4;Gbo^;qma6sA?s42KkzJ_;Wg^QZEGjm_6ok<
z(eDjs|FpUI#JCIh`2-r!F7A}$?b2Al+9$VU0|?CVd9hu6wGLlYs&i1bJ^DXS2sIJ-
zA<9PSSAY}C*Ls6~Ep>{4YF>CED#T`*vJZ3FpH-Mp`m*>9y|DsQwW~*;$O>$wtiC1(
z6Bn+POXF-=1yF&@!l7Cu;_u_pXFF!N3`jRRKSHA=Mtv3eo<9eD@=$05dyr)CNiN(!
z)gh|T`e<eEy?ejDRy#9uE=zKGqU|8Zq~?BPn2RiK_pz$n$XM02f@Br4sVcf%`O`i3
zvv#U#zw}guWz6+p<u1Sjj+Gf?2upP*w@XR+vuGyc$dTA>gW$omR!WrpCdY7Lt<fqA
zXF1;y*Y~vI?fbbK>yg*z9S#(oeP@ut$V%=xu=g~C6}0O^#0@tYOcLAM%z7I96500e
zmPLqRYRaOas_KE+cPpm=>GnaHO7>NrlNw^&A3}?dEtSj$@5mcQUrAV_tw8N71mWsJ
zm%^WAQ=$}z50TJz@9f1}sFjOV6RdwS7yRv&7BQ^N646_wnpQU|e)f9)`tT&+L#7^2
zp~&FhK*&GDw$stcPd^{TuaO>8auWj+f3--5?GhIlj+8q-VTm?R0;H*d1P#M@8-w=R
z+1Cbq+<sOy;SD<6f*l?b>(8{7et9*6FTZ)fk>d4Eo4c>;^^;A((tgX{W53@!9PlY6
zN_`=SxAli0IFd7DMd<j)FDwzpf`YG<q8#!eU*5IrIK@A12v1<txAtcqSdt|cinOmE
z`mQD)#BHqrg(0a$Uv<{<b^lpxgwQgCzCb2vfp0uMaOh;)EfK58UIB)0GhdWkm(_Wp
zEhq(04Yl~KJ8blDu!mqbVf}0ToFGd2qn(oTWhbNfO6`Qd5=j=KtIdSA7cCJ<r+NaH
z+%iW!NQYK8iarMd4j;g8RxK!yHf|S)RPunXYIjV|HG-3}<9}LQ*5=F%HLIoLb6JFS
zmuok@X1Ifvr>t=HXb;PT8M|S<01HoCtdK~q?BiKpp%;0}$R#;#JTqk7JiB}MTc~2(
zT{l`)AomuT1!0UA=sSvlne2bZH9hQY_~M8m$<VCFUZIhv*1LzT_8I>6k^b9uQf~|O
za`HsDmp_Kl9TFf)SrH+VCG*GQO$8UA!1F}!kN8~KiFx^>KN|<9f`l4$R15TqE}r7f
zI#S(kHj~@>Mc?EK50bt4c01ie_DYdW6p`K9%IgEJO8t%Y?^W(MR$x)(WJ$;YLVbCE
zQSg*$-#IXP@~IG`o~O-hB~S=G2g0XB+*{_a-RQ1;Ltj7NZ=>AH?KBREo;}#Fz8$~K
zS066rxbrM=Ta`)76V4Z`_g|y6F6OZgWBGROyLPUKKC>SOS4dbOpS0z945DGu-9Opv
z^Sca@RZx`c_Y}#;E-;qLnoLXe%=tuFTa{S%<FKUuYTv=2&SJ=X|AFe_67nX}$R*NU
z5U=blClt%==sGBIR_|N5y*>`Iq@I@&*fM$)C`YorK+KHL-zktCKNxh_g3OEM>tbU=
ztDvl&2B)rffr-eL03w`@JY)YjBOiV{0jDQh=pgZiy>e(%z&hVDS1i;KFZvUe&-5{b
zl(b*uJQ>5^N~|d^B{>sTDyNNUC8ug}-!4~A{I;u7%f<*bRr*`U2-SFuSjI$tOzDLY
zCVTSy5J{)G#6$#frpk4%zQM7=AZElhCMVt2`B4OtBEBy?-Ei^fc8DU(DRTApksCcv
z3!<E7`@NUTlM1}~;&K8{64t66&jo1jTblNP{79m6f0AJ<hr&&P-`f%A<f--0g3@qD
zO}r(p^_HwV^j`IuI_q(O{JAJ3ITY)+=9Ww5z<m5v8B?%jazbv<5uw?GP%YGsv`pKo
z;|a`X_7yYcw*91zB^!+ng^Dr+Vf4N>gmIrWv=7;fHF}@7ELlUVm`MF`FfK{4;3uq=
zi`n#M+bZH$RmK63(ocE&0w10;&|!G<1X6vPdZ{PFc56B`gi|v9k&jF2CUn3JhiEiR
zOrKeZnT`Jf{~f6h?YW+lijfMB?gtH*IWiQjBHS`x4UIkiRX_J)9*bFsY*N(oyVrd!
z5d%FTdTM0UU>>aXf*Io>?jg_MAtxciL9wG0EHcP`Bs5g&Rg8Aig$jT6r+#AhVc{eE
z+z=FbrnVt;py+Y;jlk%mdJYC1uTzTgzw=mTR1LGd4>iK{doY`3#lS4!%xEo?Sds!g
zFw|+!V|$V1Yglo@ts(1WU!i4!_6v&fZI+@ub^ohhbX;Hynh4x!e^OPS5{(qCB09h$
zjwRGCzjL!5`}LHYT}mHg+WfNc*k3{N^WVxTf55-=E*~hr`(%keI{<NLygk_4(4Pdl
zsE1~3mDM^fP|$zhM3m`eJ-pE2ZF{(M4!iJ4CfN&=)VR>7vs;=wY@sXQ)6U>oj=a<b
z5e^nRNw6-td?<8J(t+$iPUuu@l{=N|%50B*|7!465qIWTwJm-%BoIm$+fD@n@emGa
z50k!#wfw65_EdC<)!3ngI`ESd(xoYOxyxOnro6;m@G>pIMUEpis`=?#=mkGyQqh%s
zmAtSE2NchI5Sy@9^V^iO(>Oj9Olf+O#B@JkKkOa6$&<*Uj%$gFqBH9&20Hr$P3BOG
zU#8!l>j;<B;Y_~obWXixz`N^H7?!d}xaH$kYEIH|2MN!K2Fg9^jThn95+52e*gNZ5
zR_eNQ!F4vKB<-{YX0*P$X)T8?boC$-`_U5CSf{h*+g&e~#)oY#Dre|UMYjC#tiR>l
zvhg@9_3jMbKJrn9s<^^i;UJ9f!Avm%NZZ40iDi`DggEo!jtFRtdoC^Ggix~08g1X}
zUjLd`K>3!Lh>T@nNlgxR2qF)R&`@T&snL`9@{AFWRpAeG#?DsantED+WSN3NGC6RY
zq(8|(9n5k`cglx&M_=FDuf4$5I8MEvd}ZOj8`IplIlzT^_-$d2-Q6EVdG~lHloA9S
zam^9`({;x9+`V#4u$Ko#kS||q{PoZ@qpSWpGVTFVjs%01_!Qo;AuEwiU<J9!$~=;u
zcHb}_f9dxbl~_$FYP`4%=Ma^9nr~h<ZOKIShRFD2`39xX<jFR6i2ImN7C!CP%hJbU
zHD#z|vb3f;x*+~?hwq5l?6yy366)fq3}2hHgIN@1Q=_hy8e1yy@<A6*TGTi9?v<J{
z!KPe^R;I~rJod|Nvz635;;EC|DSVYvNS>+!&)pE+<<<_lxBN{lNLI@m9G@P$c`tb7
z)o@10Bcn}p#G^-Q2dS~*{&iQ;ezk#A0$IGaF8*kxY6ZAi-;Z?;AYz0!%PakRs~)Vc
zQ+^*VY?!k;^>nWMuJsrv%spV&)L|xsh4_xXSm_jw?3#Qo5&(w(gbx}791_ppqd|aJ
z&feaj9ARsaB%OfnRbRIB#HS_fQhRoHd)OTH#<m1<RxFp}uxzyd7yohd|BmU2W7nC6
z)P&PKNu0GgT6=%1xWLvt9rk=X&OjG3C<-B?TbYv>WnZ}Uocn+%&<BnoINN-t&98C#
zS~LDy-AjOk_)zS44C14<(<eD`8`}(O2ppG3aCiPZGr!a|u1qPE1zLx2uze}n@aI?v
zc`tn9K_q**lNN$4jEiJjUFryN!?soO#%+wV3>B2c+PDOZ^Kp{L&>YEQusxlDO>1lZ
z1XgA5nXX_(+nPAEO?i^~S0Q9bf$IPng5cfVK*LiMJCZT<gfwMQQB8`jXHqX{@}+@`
zoO?cccNaz(Afti;#IiOyt*R}};7uy4YCIdsY0-CV)8(MWR*}|iP~Nz|_t!V58$0Ga
zNxd3|96Y!yW{u43alN&|h~C8FLPd8YSbHP(aM0nnEoLQ!7aRZhbjRvgA^F^DbuM~;
zk{JY#h5T$ua8g>GqS<yTb|{1l?9e*kcwgQl>2!@(QQT*2`_2x09EqWjOE;Dwb28DO
z9Ut3T;nlqqHmC7skuOlXYo_J!G}mK;Zb~&-a2#fH`9buiwW_ebF8Zr*BVQ}shXazU
z=EL$!?VH9h@Yb$;9=`6JUlITiXqC+U_J7iL-*A-!7(U<qudRUX(!r9MiIs8n4UcF4
E14I$F5&!@I

literal 0
HcmV?d00001

diff --git a/demo/demo-images/320x180.png b/demo/demo-images/320x180.png
new file mode 100644
index 0000000000000000000000000000000000000000..58c67cd37d7174f1844fa9e107ca3a9ead838948
GIT binary patch
literal 1178
zcmV;L1ZDe)P)<h;3K|Lk000e1NJLTq00BS%006WE0{{R37s}`&0000RP)t-s%*@P|
zmX@5HoT{p-#l^+3v9Y70qqn!WzP`SPdvd4%000SaNLh0L01m_e01m_fl`9S#000Cf
zNkl<Zc%1E;J8#=c5QT>nUnQ5aD3@d&h)OAOa8pv(zOF?fNG%!;oKkiG*HY5tXJ=-Y
zw3f2$n?ht<oDcAh2oA8vvopgXKq3GD00000000000000000000000000000000000
z0G{E$tMrq$RdOaayh_&x9mB+!_sQ4dIlm(lDdw8@6T2YtDy7omkY}I;dO7<IpYuC1
zbCu+Zx88~!vkbATgPvNTs}hzrea7#|%s33UYE5}scr(SnlTDP54>)?c7FZ@5_CI~v
z@7Uy-9PcVpnM99;o^mwP$9~@{r3F?e;y--S@95~fQ<*O|Qd3WkE#OF!oIab|S_Ge~
z7AXISr&8OmQ#=kDFRMUpwADg=rR#IRsiq^<5*TZNwqN(~ZYCHi8;H<Il!=a0KFw+4
z<(MNLi}I1}*E!KFDf|yqN3zgX-zZZq+M+FRt3F4wJ-?3G>OLrNxLhSaB+*D(%BCDX
z_!)t^Uk<6|*S)|q^J}g)j=eEgcYd-bkV@Uqoqh#MLh(`O!&*fin_GD*wa^k6NCeY8
zzmADYrQ=j`O0_rMn##2WR-A+E*sDNJ_7Sg_YFIQ!S8p6B>sg^SMe@IJdAI#KN4ha*
z|C;ua-&ea7Gy(_u%*$bKMdJOEb)L!rOD(tC$6W1-*a$TJa+~(nW(GPEPRhX=nd^<!
zfM?2jm}!9~a!%4)qxS2Fa6N3~I<y~Qo_cG=$co@R4f}f3g?f*2)I4)rL%=|-n@2G{
z<e>O(hdmApnJgz!)9@;5jM^qV_O%6ux-QtM>TBGZac{YkDW)*j_8`iGfxA1!y7lqE
zddcDIZD2Jcf1w``iZ`}Kd5KoI>m<#vpsu8JdK>ve^U~xRftmd>q@!1j+5#haX`1x-
z(nRNZ@(=Ic2&AxTUMKZ1y?rQzdRPdrlCRoU{k(Pp0000000000000000000000000
z@RD%qzZc635vY>0C+_SCjQL7FU!sJ_jmdo6dY<3Nx3SmcWJGx<0%PyPp9|D$x}p18
zp!c@;$;-vEaK2Gkbt91erT4GNEkgd`znYS>jKvIIl_GHYnu0aou>_7+bW;l)EX?9h
zoqGyyyAtSMUoHmgIen)u7az&F*5=EF1jON6QAQtaf$=2DYJqNH7B6$$&5v#pmXFvi
zyeyh7*PrMO$I2<Rc|&s%$hYW*|2SDC|FppSU|kDznk9C^)lD}7xkz+ivdJnF5wf3{
zxXHnoehlO@y<G&|J9->JdY5$+LD@mVwEDK<uxS-ytO&YGY6<j5^f(8pTy!Q-a*&qm
zy9M1B=b}Q)E(a+bw*~48y;@aFT{TVFh^v^k#k`;}pU5_1c2!Jac0iy>gLBpN!OjH!
s0l`cEQuOX`3-}+L$=_B0001q115&e}^iS#c;Q#;t07*qoM6N<$g2I9&#sB~S

literal 0
HcmV?d00001

diff --git a/demo/demo-images/640x360.png b/demo/demo-images/640x360.png
new file mode 100644
index 0000000000000000000000000000000000000000..5f64a715cf41d5c297cbcaa9e407a82241ff8902
GIT binary patch
literal 2516
zcmb_d={FmQ9*ylOTJ2zlT5AmLv>is3Xwa5gYpq&p&1fgKCd86jBS{Sg#i+*8AS!AJ
zjS@>@S8FTi*kZ3TnnomH>>~2?UwG%;bME<_bI(2Z_u+oHsZI`7XCxIR0RX@m8*6iC
z06-WG00;$&ikv9=%I*(Oj*^p|iv^8F%gxO#EG#4viG6*2b#-+F0-?FNxuc^aB`&=3
z#3li^_J{xgq<g<n2zy0Z=|ltDn47vp7qaJuBWC@D2R5zDgfsvA$suzvrYg&SJS0NS
zVfKrHu~C7l`c7utAJBfP*=*7A9CC5T_*(Besa4^CS6~B>_+w|~?=3BxQzu{kKS)_i
zIonfF9evMN?l@+*BYrb$p?QiI7ZdLxCiM>^3)~0Z8@<~w$TCwTl|phrUC^2-R4Z#L
ze224ax+<SPith!>*W8Lmwh#0X0zXrvH*D+Fm)_KmK{=`5dIPCNYOP+V;mpzIorbH+
zCNA~w!~?g^$Q%&$c)Jh%<hRrI#p`2!sP;No;R58HUN|*N!ymeztu8WfHvlq($*B;|
zD%tChx2KJWyMFoy5(~fx;WM?phSI-$i7(aQ*Ry<YQW{OB^*rXzphgm;q(OeWv&Q$W
zmVlFv;oU1fP30e0)objDP?84T1l+FDIyxlzX#Z!P0%}41zSTz3NBh1(or%>!V|#m#
z>>JALdg|*N24w17;ng84YzW9M`>OrDT+B#F(Aiy@riSh8oldy3IHhTT6WtsP{*Qar
z0I6Ek$Jv%#8k)5*GV*532N>2poR~?YNW(+CvdBf3yJ?M0oYY{wZANQ(0e5!l&h8UW
zX9))%0mMU%5MDcA&_$c{`L|MazOAtsMW2RhN2TuC*%VS*LKROVq&=BWes>1;)aO&O
zt&0X72D~{#%rU4o0zYc^ni2`lYbd*ze{gJ0SAA?Y8J8u~N>ITMQgq#BDp^YIyg0if
z2BU?j&|1stHQ7s?+!Cu697I6mbNdFx@(-WZKYRJPF0_H+mr|C{y3jSIv%j)+v7LGG
zI6a`bNj`2uB2FiFzBx$>zC5)06R|;y6tZr?$Mtsptg8uE-WheppuXbSP8EwtW^zB`
zM~yI>8YCddC1^FIGTRdINah(}=g{)eTrH}$UWK3kKKZ-u2b`C-51Argd%0I(DoxK4
zFys~a-5F1LT8%E6ImuP!8Z=N@Q*@;sJ9e2Ad<~arOxnq7x{5{2$?C!!I{$tmu2jGo
zyR?9eMgN6TIIjOUJu+flxMs*k=jQbN@$Mm<Y^t08bG;SZ-l~+5hKk$@#3**`zK82-
z@LEanuRhh*-slMM)59?G4Dimg_sN#l%$KXwSi{<jPOS(Gm}@}kU`?R?lpS@j!EaZE
zukue(zbjemC|ncjEBE+bKchBxNCwCfCHn<U&p<8ETgw>SJF<A7qx*fj2u%@Uf3}o7
zoO3-GWGlE(-&^F6c+h#F%Vxg&hRe0vKnOH_sbH}VC$e7Y2rYE+pm(O6-f%TkpX&e&
zEobAe`7$-jXDUS^7Z&`{vBi-3piE2gz**Jv)6}^m*{#|3YJDN;^yLHY3>FtLYUj!j
zKHV=h{3_A-dcc-_k%CG|foKlqeds>*Fv!<j%qSst&}DO+|5ufX0?ded2Tjx<*U3JT
z{%o~tQqIW3$t-pN7Nie#*|QT#Mxucu?jeTM9|})7ct0oh+;|*>ZaUv+MS$stkVM!A
zEg2Qbi{3LJM=`_k^p+Oeg$~f$jp54k-|s;&ZPf1#G+|z+z_hbDa@_|@18iuL&)#%l
zgCV(5pe^(yjZK~?IImHGxOER75d=X$iNv!mRWu30R-7F2GwmMTgH-_wr{2(9EM_`h
zc{BH{9VZVS?%om))KVPZkje5>5~(o?2er<#momt@@4R2vAsj~KzJ?&1Jk;vhxQz4k
z;nKD8$h40eSGF+Atc*X4;y4pXHGWP*=uLR+9kf?KSrWUy_f<zcQ@i&%!}woIG#i)g
z+n=)02xu;n{SId|W=gIhu=J%r?-t2=d^-1Aq#G&i=4Dyrtn!D+s{AjNpHBS>y0Yig
zaC`Zz9kO)S6TPt11}AjnSP3dhvxAYC4A>~kzrWDESe%h$)!eSf`?!O3p0}pB8Ged|
zn3W3`8@%*Kea0At-Q1J1Bk02Buo6_AQ(-C$;q}mVgK~l-y{xW5yWF582>zNF%V>eo
z`?vYJO_`aN^1nqR+`I$qp`DwRb?{aEFElrKPP%H^{#wo5225+X%S{QwMvnaoj4qyu
zkb}%qZTQo_Lxu19NHjkN!P;)Z%T<*Efbr-#k`o)}uzf8=3S^2gkyKk?c*P_UTas^3
z=I?F^P0_6fGT?M`Y(IfY8$Oo_yB*wZv41cI)-aKIQ}SgNFCgjQz+&mhlbkW29xWIl
zSEF2{j3h1=^J0>NUX7-{Aocz-_XL}ORI{2;oRH;2G$%|QO@AOsw`y>dtGE{q=bY9G
zm}kIIgGbs{iS-+x#!Kgh=r9%qK?-fCYqvycyl5YP|EX#sE$q*+^r(+Sk@@)A`2w$x
zu=$98q-w6@4fS(Z65dY!!W}ryZ`DP(f~7_ZU~OLG`ir1XaIDhlL&fpMqAD-q5+a>5
zb$xHkK#TDd09?>1oUF@GYFxpNT%@S&BU~<cMR&e!Asl_>)z%6eIS&MTDa-r3%MUhs
zQkL^9wp$=kHQz@5e}<uGDnCUaBg83FNN9!FYjk1av2qsb$!29DJI=8_zLJ}d!qlH<
zpIZg<@)qwUuCM0mD+x~s)ZX-B&-@za%hwXbMfhrVrY#=T3LbMyFov?IxXWY2i}-&A
zDt^47R+%!g=|Zv}!KZP|ND{*F#<F<^T_Z+Y;Dndnshn^;uMT*v>u7l(s;JNW$hHl&
zRb;Kb-NOSCZ)=9TqJHX-HAN@p91s2{-|b5$^hH^<&K~*QixjvggmBC}SjI+c4S6~<
zQvx3TNY@I-QeFsthg7ZIQdx41@)NO}M<td4TiftLA1uw~YyN%@Ei-eDsZ7CCi-<4V
z2B^Q2$xo1@+m`J6N8S=qt`v3A#qmKoeGV06s!wI|i|2r|fGw-#Sd~lVTn-FPl$K+p
zXK{O7cRXL0sjh*XwpG75cBJ^IkCN%U*&r9wLAM7r)i#>3tEp+GCKGSoe$7}{>H!S<
z9k;;wx5L09^QKXC+|H#g<ouo*eCc@(QXqCxn?N2V3`F~CXK4a7zO`s$;b2ZO`|as}
E0Ym@cOaK4?

literal 0
HcmV?d00001

diff --git a/demo/demo-images/75x50.png b/demo/demo-images/75x50.png
new file mode 100644
index 0000000000000000000000000000000000000000..e16063f3b98aae1b26f9c65f5d25d1df56b64ff5
GIT binary patch
literal 242
zcmeAS@N?(olHy`uVBq!ia0vp^-au@`!VDyz`C4B9QqloFA+Bf6oS8Ol+NxEn_U+qu
z^ytyWix+R-zJ24yjdSMAne@uwKTsKGfk$L90|Va?5N4dJ%_j{Mto3wp46*1<PLN<-
zoFKx(wLoKqRs=&DYuD~=Ru4jsr?9A8v5=4uk+^bGv_Px)(F=ow4;sk{FEa8HGY_oP
zIda#wp>c0x<I*J|4UP=cwWcw!i7~P*6H~Y>*q@oh>XyUEv+gO+8LpKTcaEhTVEHoN
nsGYgljl*t!UsIq#6C=ZBGr`nL?AMrp4q@<g^>bP0l+XkK6AM>7

literal 0
HcmV?d00001

diff --git a/demo/demo-images/960x540.png b/demo/demo-images/960x540.png
new file mode 100644
index 0000000000000000000000000000000000000000..1ffda0ab6410b269f9bd3e0384496cb5020c05d1
GIT binary patch
literal 3746
zcmd5<_fr#y5)MUCsz?(AVx?#_N;L$;qoafx2#5p?U8FZLfdJ|uO+*wF5)dLSG((G2
z^Yj8pix7HC5Tu1By@fpP-Ms(dc4lXHcD~*HWoP%>I7@S5A$}Qt001ClYGPmw0Ps)%
z0B%`cp2J9c(6Gs&Ic;eMH|*%>NJ~q@;c!GEkxHeKNF)M*Kqix$nwnzKfrW>#<NhWN
zK>&d8Uw<pt+sneI51lKf27kaG;}*v{)9E!bln06dH`54QN7KFouH3;W`=kq74qwbN
zv`9})L(c|s>r}Nrt08aEnn<9ba#u+A#|gdf%a8&y6x5D5P!7Vjnw~st^skqLfTo>+
zh4m$oXld-h4JgN}F9X-KV}-}Q{lWnEA#O)Rp>z$UZr3x^Ck6agFVItIcFP-%5|L3H
zU20^^xbkF;=43Vg_t*D0clXsK3`g%R%g8$#9?o^sgw!(YWzz}9OVe0$1+_S&---GE
zj6ctZ@@TK}U|yh-t+c#}L&rbj&K3uQeg;<i6{X_2kWc<e#FxyVQO#nI^M3hY>J)S@
z?b0_1;gt@7l|SNj^i(YH;-Ma9nRDj%SNr)V1;dVfzIzKpdn%58X5?$AyYQ}?_rtPT
z_L9TGeMHm@GD^f|LG<oC|K5D^dKjJrGp;LipQ4S=OI?QQTxQ_euQByX&ZEPX_I~vb
z`EIOnW8R^XE&5Kdc$~(RvieowI{M3b;LhMNsFu^)a(66&6f9ODcb|Sdh{0i_l4-X-
zmI{B=nUYgi?NRYsYMldTrl;?{9T^d2Hc2sgB+!`Y+?~E549dNPny7e=+dF0Y*Q(~$
z)vbjuuQk7{aAQ6kc00RO@BQ2TEHc^932d;~r4OauU@c}>MNB{W8Xd25Q*~%mC`0Z2
zjYVcj*EC#X@*8{W&-O*Ryl5$=z63g0A@{6C-#b=1Pr*seiEDh8=D)Q1B6SS+I>=R~
zD>l;q!?fMVQukAJv*1bVyq}8tRbLd@7nU#ekfGo6Xm73%mVj|Qx@}37$2SG4csY^V
zpVL#M`<AD>g15#(KsAw{M(3Q{06^j(Vba$2%aRcor=Rj50#_BBpWM5dRx?sESI+ll
zZ1b()N>03vmUqF=;Lf>Q`CUy8%fw<CADQ1hkCzV?HjOkcBQEn`3Q@`CIa6~U_@cV$
z=AWM`;RA&u(XdA9f*K@1+TN&q=7D$aJt|C*QlDUGIlXDzQbSW;37jf-#<ENIp#f00
zx{I{NkhIfDCS->~9T<7@sqvGtWBz8OV-7d2kjhN(GHgru$&{aejs)ASJ2V&V8|?k{
z^TJAPvo%&gl=%)N`ZG^20tiRwhA@vbL2miZt|2$BCuvK~U!`Z*XU^#vM7hKpwt`MD
zZLRy5YM=I71@^VxWC_%^bi~NzPSj|G+Lyw4ZxHQyA9I;6ELF~$q+|t(_&v!H`op>4
zT6TY?S^bq$N}Mc@2S^{ca}+D;xm)29rDii8-K5k^wE74ldU7cG*gU1ITYb1+sEde`
zVqE#Bn9q_rLh4@R$SfJ(dDmABc<fol@@Bl8Sf%;zvD|pWTb@A7`|TFI(3db91<yTP
zV0UoIl&x`20XZsAsm-G_M=2t8?Hnb5n%gPxsnNuKE1xrJ!2C^g_^=`~n#1q3$r^|?
z5}SEdbRDd#(cgGIWO`A6|Nj|KVfoC~K{0{8!H@KE))5syhU`tRLIgpz1gLG&<Fm9F
z*9hL~bvRQE0dvbDK*J4Py+1DCiYU8T+jZd`4Ua>5*S|hGQ|BYJ_(+q!EFQYJBy&__
zuMuD@o*-Gic=|m6;qfvflWwtS#B{^3WOH*w-n7wz$8Orb6WDFmS+1-*CdzC@byvX6
zx2in2wSVk=R-odb)q%fv)b7!FNIAU81**SZx#UW&)-`X$8zzL^w)Pm0gQ(960#&@^
z9q2_vO4Dt?_wUqLDH-DO1B@2{U{sjZSyirnMDKtKcRp=CduP7R9|5Ne^aZ$$OK(jX
zuuL1(;{Yv^0@-K_yO2ua@fA7EW0xBZ9>G{CabRn@HTnIggETBcDADW56Ng4UZVX__
z>1|&pk$#Dy**3sAIM2Rp1H-wuL1Ra)=yl;=ApZSV;f~ho)|}Jq-TZe!^~h?$!?E;y
z|6SH`#Bw-A|4E6-#_Tg<l3jF$Fj8G<0PQ_qU2Nvo-<0YTT<hgjV<+bX!aOg$r+V)3
zUB1DO*6JrfU}vL&s&Tt1f8JOmA>v__{I085#8ATpO6-U7mP{UL)sLJCc^UVxM6J7Z
zGh$Bkjg=qFkR1{|R9CdUGeh+h@Ae7ebwcrOo}m92M{WQ*F*|Oqb4FLBQ?9KVv4g41
zdJr@|!e=azAUOugK6r)Tq0n5Tz^vygr(bPnbP>1z1Rocq;d`&nADJOSDvhE<zCwm=
z8Hgk|+MT8++RhjltysdmzAZulnNGEpi+*k|$941A%me8H_9aSPYRESy6NKl!a$ZjT
zX~siOm!Z-7+5QSFOBGQjG(WDFOA^tmsFB0Y7!T}sCbI*q3YRxn?Q-AJ070Y)8CU-D
ze%qc}vWB8<Rhw%=vl~8-obpIjwSHXhXpexuE6GzigSRF&XZMV;JkxbLB0smhfks}6
zadO`%s?-o=dW$Ed^&*EM?LPc-fOfPiKRpyl$Pb|d!<{=T?nVr~Q&TiLwvzJ#O{gGR
z8;2Hn4vokNNT7q>gbQ2CZwPhF?{y6uMolIdzKHy>IjP+Z{Z>KNUU6~pGeZ(L7n3GZ
z>Zaj#qX4nWC!7g~x0wUVl8!^)lKWlEA4TbFD#b#r@6<acTa_KS-Z?BnwG*rKOQpej
z76wJJ9VX5pW6{243N0HUXehU=GpMFw=7pn$BbjTnB{5j|B++lsk@{w2q}#w)Dq(T{
z>{%yR6+>g!r(liCN5*EUEW$sSG+0)yRVLF3OEMDa?R*n{!W!;uvYz{t%N?^4-Qh#s
zDR}v)ZJY0do2-5^s&J|K5`0QM+KKDs70IUcA=Pk)f)2q5y|Xq;?~i1v95_UBE|6^H
zOjuDzxUXZ@XH(W}be=yf3wXvY>j=VlYjTHBOKtbydBUGZLc@?Xj;t4nFbt-YAnV5q
z%iI4HA?E<X1S!6PQ8yZpW@E1PMPuP@{&vs(C9@b>qIr7K$~>}%2;VcA@oPr*nz67u
zGdxboxJrU}`t9e!Z}tH&SCDrg>K@56K;&9xKE0i^yW@}|l2k=7g35O-0o{|~vxzV6
zDV5n*eMak}t44;~lja|{=xkPB6QvhPx2l6lGm)uIU{~k0sv(_Pi&J98z)gOvTj`Wf
zG88ykQovet7hMu|^F?|5C-Du}ba*#9qv}#ugECGlyD#E;L7<})ek!<eUt2aIkM3_a
zPnA>odvD)Yxa51GXGl6kMI1(yE&ZXc=7u!Bb<@gp781w4Fe(ug+IyXP?u=ONh04$~
zl@FDFk|fJLE@Aq7t^AZ%<8H^$cY4mdb1!}t`}^p8xO{a0+@g|i>-v}AOjznwcDnF&
z>zulY%OY0;+!emqOhiGrUMfkRt*f~?0IpQ%kBdvpvKp&&JHO1~9U?Y%HQ7hXkAJzE
zfhwLLMBm{vk2)W3XcEHeW$X4Vw{6GkXEfn|BSKp2d_87=%>zXR@s@Yvf5lF$mo(dq
zvM+L$k^&J7e{NYTP>jk&^|&c^OeHYfTgKk)J&HV)8JgV6`Q7~^Tv?N{zdM_S%Z^TS
z!hbF5p0@Ou5!splSc>k_!jJISOA=i+gbp#0D_J<Rx3uEG*JfEBcb8hVw+6}TCb>T!
zAtoH}j{%lJl5+j$qJtpkS*_Q09_RfStXK_#*<3r$_k$hro9U$trqst9#+usnrFRKh
z5qz6_EpC)#e`S`?5(<42*ZNU3!v?)#ujHQ$BuGoAdSkOzlkhScB45)3(r!cnV?F02
z&-sh5*S$ovoI0XQ8A&kI6r0$q)t%IplhC^E;$(*{wm<y<TR$IsNaebx+JiQR4*4x3
z5+cxL!oU@;^`|zJvqoT~0$uh=PV_f%fqxrKXKt@|V7CoKnHDix>|B?ZQq0uO`Yh{9
z5ZLPj)1A=Cxdq$T+6Zv!xSFZ^@>V7atT;z_35f=<ur#~xj$+L9$b-G<Y!9jM<r&w8
z#~g;_K<I02(}NJrxtYn%go&MRAHxEy52SHYnYE1x_1|Y7sv7fdZ@R6v@jhP3-Syc1
zw51_^MR$tBr}c<i8?&=dWj@SmFm1wa-k59b#WrE>6kPpOy;WfHisvYbA__KQ%t$0V
z)f~<4gN6<Q2{5rS8hvhRg4#Fmy%AQn8OWYNsxUehecUgWYjAu*`+prE__h~k+ju{F
za3FI@U}sTga(8}eo><T>Gw|+FQX*n!=C7rv7O%se78|(xb3%H$m{V)YTnDG{Z$vNA
z*H>rSVZ-xEX;_1!Ti}iu1<E%^Q#24K4nDTh;we@b2*lmH*BF`7(3zcP1>&gfF<mhu
zAW!ZR#w^wltTpjrXA*w&Aw9voe@EM*xsuQAU7IcptR-#H8KXk6RXu<YO){SWI4((L
vH`g^O=#5={ELQ`fkq@|g_$LAY6y0GCU=Zo4OQ^ve{2eegG&d;IyC3sk#IfPp

literal 0
HcmV?d00001

diff --git a/demo/index.html b/demo/index.html
index 698e020..eb2b61b 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -111,6 +111,24 @@ <h2>
         <a class="api-close" href="#">Close</a>
         <!-- Container (notice the relative width) :  -->
         <div id="container3" style="width: 80%; max-width:1000px; height: 600px; background: #E0E0E0; margin:auto;"></div>
+
+        <h2>Usage with srcset and sizes attributes. Full window, contained.</h2>
+        <p>Be careful while using "cover" and data-sizes="100vw", the image could be wider than the viewport width.</p>
+        <div id="example4">
+            <a class="chocolat-image" href="demo/demo-images/1920x1080.png" title="responsive"
+               data-srcset="demo/demo-images/320x180.png 320w,
+                            demo/demo-images/640x360.png 640w,
+                            demo/demo-images/960x540.png 960w,
+                            demo/demo-images/1280x720.png 1280w,
+                            demo/demo-images/1920x1080.png 1920w"
+               data-sizes="100vw">
+                <img src="demo/demo-images/75x50.png" style="width:75px; height:50px" alt="">
+            </a>
+        </div>
+
+
+
+
         <script>
             // standard demos
             Chocolat(document.querySelectorAll('#example0 .chocolat-image'), {
@@ -133,6 +151,10 @@ <h2>
                 container: document.querySelector('#container2'),
                 imageSize: 'cover',
             })
+            Chocolat(document.querySelectorAll('#example4 .chocolat-image'), {
+                imageSize: 'contain',
+                loop: true,
+            })
         </script>
         <script>
             // api demo
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 94e9a57..e1f94f4 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -28,25 +28,22 @@ function transitionAsPromise(triggeringFunc, el) {
       handleTransitionEnd();
     }
   });
-} // export function loadImage(src, image) {
-//     if ('decode' in image) {
-//         image.src = src
-//         return image.decode()
-//     } else {
-//         return new Promise(function(resolve, reject) {
-//             image.onload = resolve
-//             image.onerror = resolve
-//             image.src = src
-//         })
-//     }
-// }
-
-function loadImage(path) {
-  let image = new Image();
+}
+function loadImage(img) {
+  const path = img.src;
+  const image = new Image();
+  image.src = path;
+
+  if (img.srcset) {
+    image.srcset = img.srcset;
+  }
+
+  if (img.sizes) {
+    image.sizes = img.sizes;
+  }
 
   if ('decode' in image) {
     return new Promise((resolve, reject) => {
-      image.src = path;
       image.decode().then(() => {
         resolve(image);
       }).catch(() => {
@@ -57,7 +54,6 @@ function loadImage(path) {
     return new Promise((resolve, reject) => {
       image.onload = resolve(image);
       image.onerror = reject(image);
-      image.src = path;
     });
   }
 }
@@ -196,6 +192,8 @@ class Chocolat {
         this.images.push({
           title: el.getAttribute('title'),
           src: el.getAttribute('href'),
+          srcset: el.getAttribute('data-srcset'),
+          sizes: el.getAttribute('data-sizes'),
           height: undefined,
           width: undefined
         });
@@ -291,7 +289,7 @@ class Chocolat {
         this.elems.imageCanvas.classList.remove('chocolat-visible');
       }, this.elems.imageCanvas);
     }, 80);
-    return loadImage(this.images[index].src).then(loadedImage => {
+    return loadImage(this.images[index]).then(loadedImage => {
       image = loadedImage;
 
       if (fadeOutTimer) {
@@ -304,7 +302,7 @@ class Chocolat {
       const nextIndex = index + 1;
 
       if (this.images[nextIndex] != undefined) {
-        loadImage(this.images[nextIndex].src);
+        loadImage(this.images[nextIndex]);
       }
 
       this.settings.currentImageIndex = index;
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index bb85e3c..2ab14e3 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -26,25 +26,22 @@ function transitionAsPromise(triggeringFunc, el) {
       handleTransitionEnd();
     }
   });
-} // export function loadImage(src, image) {
-//     if ('decode' in image) {
-//         image.src = src
-//         return image.decode()
-//     } else {
-//         return new Promise(function(resolve, reject) {
-//             image.onload = resolve
-//             image.onerror = resolve
-//             image.src = src
-//         })
-//     }
-// }
-
-function loadImage(path) {
-  let image = new Image();
+}
+function loadImage(img) {
+  const path = img.src;
+  const image = new Image();
+  image.src = path;
+
+  if (img.srcset) {
+    image.srcset = img.srcset;
+  }
+
+  if (img.sizes) {
+    image.sizes = img.sizes;
+  }
 
   if ('decode' in image) {
     return new Promise((resolve, reject) => {
-      image.src = path;
       image.decode().then(() => {
         resolve(image);
       }).catch(() => {
@@ -55,7 +52,6 @@ function loadImage(path) {
     return new Promise((resolve, reject) => {
       image.onload = resolve(image);
       image.onerror = reject(image);
-      image.src = path;
     });
   }
 }
@@ -194,6 +190,8 @@ class Chocolat {
         this.images.push({
           title: el.getAttribute('title'),
           src: el.getAttribute('href'),
+          srcset: el.getAttribute('data-srcset'),
+          sizes: el.getAttribute('data-sizes'),
           height: undefined,
           width: undefined
         });
@@ -289,7 +287,7 @@ class Chocolat {
         this.elems.imageCanvas.classList.remove('chocolat-visible');
       }, this.elems.imageCanvas);
     }, 80);
-    return loadImage(this.images[index].src).then(loadedImage => {
+    return loadImage(this.images[index]).then(loadedImage => {
       image = loadedImage;
 
       if (fadeOutTimer) {
@@ -302,7 +300,7 @@ class Chocolat {
       const nextIndex = index + 1;
 
       if (this.images[nextIndex] != undefined) {
-        loadImage(this.images[nextIndex].src);
+        loadImage(this.images[nextIndex]);
       }
 
       this.settings.currentImageIndex = index;
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
index aec54bd..eab7be8 100644
--- a/dist/js/chocolat.js
+++ b/dist/js/chocolat.js
@@ -29,25 +29,22 @@
           handleTransitionEnd();
         }
       });
-    } // export function loadImage(src, image) {
-    //     if ('decode' in image) {
-    //         image.src = src
-    //         return image.decode()
-    //     } else {
-    //         return new Promise(function(resolve, reject) {
-    //             image.onload = resolve
-    //             image.onerror = resolve
-    //             image.src = src
-    //         })
-    //     }
-    // }
-
-    function loadImage(path) {
-      let image = new Image();
+    }
+    function loadImage(img) {
+      const path = img.src;
+      const image = new Image();
+      image.src = path;
+
+      if (img.srcset) {
+        image.srcset = img.srcset;
+      }
+
+      if (img.sizes) {
+        image.sizes = img.sizes;
+      }
 
       if ('decode' in image) {
         return new Promise((resolve, reject) => {
-          image.src = path;
           image.decode().then(() => {
             resolve(image);
           }).catch(() => {
@@ -58,7 +55,6 @@
         return new Promise((resolve, reject) => {
           image.onload = resolve(image);
           image.onerror = reject(image);
-          image.src = path;
         });
       }
     }
@@ -197,6 +193,8 @@
             this.images.push({
               title: el.getAttribute('title'),
               src: el.getAttribute('href'),
+              srcset: el.getAttribute('data-srcset'),
+              sizes: el.getAttribute('data-sizes'),
               height: undefined,
               width: undefined
             });
@@ -292,7 +290,7 @@
             this.elems.imageCanvas.classList.remove('chocolat-visible');
           }, this.elems.imageCanvas);
         }, 80);
-        return loadImage(this.images[index].src).then(loadedImage => {
+        return loadImage(this.images[index]).then(loadedImage => {
           image = loadedImage;
 
           if (fadeOutTimer) {
@@ -305,7 +303,7 @@
           const nextIndex = index + 1;
 
           if (this.images[nextIndex] != undefined) {
-            loadImage(this.images[nextIndex].src);
+            loadImage(this.images[nextIndex]);
           }
 
           this.settings.currentImageIndex = index;
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index a620019..d20580f 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -74,6 +74,8 @@ export class Chocolat {
                 this.images.push({
                     title: el.getAttribute('title'),
                     src: el.getAttribute('href'),
+                    srcset: el.getAttribute('data-srcset'),
+                    sizes: el.getAttribute('data-sizes'),
                     height: undefined,
                     width: undefined,
                 })
@@ -189,7 +191,7 @@ export class Chocolat {
             }, this.elems.imageCanvas)
         }, 80)
 
-        return loadImage(this.images[index].src)
+        return loadImage(this.images[index])
             .then((loadedImage) => {
                 image = loadedImage
                 if (fadeOutTimer) {
@@ -202,7 +204,7 @@ export class Chocolat {
             .then(() => {
                 const nextIndex = index + 1
                 if (this.images[nextIndex] != undefined) {
-                    loadImage(this.images[nextIndex].src)
+                    loadImage(this.images[nextIndex])
                 }
 
                 this.settings.currentImageIndex = index
diff --git a/src/js/utils.js b/src/js/utils.js
index d25ead0..d0e701e 100644
--- a/src/js/utils.js
+++ b/src/js/utils.js
@@ -34,24 +34,19 @@ export function transitionAsPromise(triggeringFunc, el) {
     })
 }
 
-// export function loadImage(src, image) {
-//     if ('decode' in image) {
-//         image.src = src
-//         return image.decode()
-//     } else {
-//         return new Promise(function(resolve, reject) {
-//             image.onload = resolve
-//             image.onerror = resolve
-//             image.src = src
-//         })
-//     }
-// }
+export function loadImage(img) {
+    const path = img.src
+    const image = new Image()
+    image.src = path
+    if (img.srcset) {
+        image.srcset = img.srcset
+    }
+    if (img.sizes) {
+        image.sizes = img.sizes
+    }
 
-export function loadImage(path) {
-    let image = new Image()
     if ('decode' in image) {
         return new Promise((resolve, reject) => {
-            image.src = path
             image
                 .decode()
                 .then(() => {
@@ -65,7 +60,6 @@ export function loadImage(path) {
         return new Promise((resolve, reject) => {
             image.onload = resolve(image)
             image.onerror = reject(image)
-            image.src = path
         })
     }
 }

From aaa52b617ff4ae370e19c6fac9ecf3e9ebb7c874 Mon Sep 17 00:00:00 2001
From: Diego Scafati <dscafati@gmail.com>
Date: Sat, 18 Jan 2020 20:38:28 +0100
Subject: [PATCH 56/65] Added tests for srcset and sizes attributes

---
 test/index.html | 88 +++++++++++++++++++++++++++++--------------------
 test/test.js    | 34 +++++++++++++++++--
 2 files changed, 84 insertions(+), 38 deletions(-)

diff --git a/test/index.html b/test/index.html
index 3ed3cd8..dd474a5 100644
--- a/test/index.html
+++ b/test/index.html
@@ -1,41 +1,57 @@
 <!DOCTYPE html>
 <html>
-<head>
-    <meta charset="utf-8">
-    <title>Chocolat tests</title>
-    <link rel="stylesheet" media="all" href="../node_modules/mocha/mocha.css">
-    <link rel="stylesheet" media="all" href="../dist/css/chocolat.css">
-</head>
-<body>
-    <div style="width: 299px;height: 500px;background: silver;margin-left: 250px;margin-top: 250px;" id="container"></div>
+    <head>
+        <meta charset="utf-8" />
+        <title>Chocolat tests</title>
+        <link rel="stylesheet" media="all" href="../node_modules/mocha/mocha.css" />
+        <link rel="stylesheet" media="all" href="../dist/css/chocolat.css" />
+    </head>
+    <body>
+        <div
+            style="width: 299px;height: 500px;background: silver;margin-left: 250px;margin-top: 250px;"
+            id="container"
+        ></div>
 
-    <div id="example0">
-        <a class="chocolat-image" href="../demo/demo-images/1.jpg" title="foo">
-            1
-        </a>
-        <a class="chocolat-image" href="../demo/demo-images/2.jpg" title="baz">
-            2
-        </a>
-        <a class="chocolat-image" href="../demo/demo-images/3.jpg" title="bar">
-            3
-        </a>
-    </div>
+        <div id="example0">
+            <a class="chocolat-image" href="../demo/demo-images/1.jpg" title="foo"> 1 </a>
+            <a class="chocolat-image" href="../demo/demo-images/2.jpg" title="baz"> 2 </a>
+            <a class="chocolat-image" href="../demo/demo-images/3.jpg" title="bar"> 3 </a>
+        </div>
 
-    <div id="mocha"><p><a href=".">Index</a></p></div>
+        <!-- To test srcset and sizes -->
+        <div id="example1">
+            <a
+                class="chocolat-image"
+                href="../demo/demo-images/1920x1080.png"
+                title="responsive"
+                data-srcset="../demo/demo-images/320x180.png 320w,
+                            ../demo/demo-images/640x360.png 640w,
+                            ../demo/demo-images/960x540.png 960w,
+                            ../demo/demo-images/1280x720.png 1280w,
+                            ../demo/demo-images/1920x1080.png 1920w"
+                data-sizes="100vw"
+            >
+                <img src="../demo/demo-images/75x50.png" style="width:75px; height:50px" alt="" />
+            </a>
+        </div>
 
-    <script src="../node_modules/mocha/mocha.js"></script>
-    <script src="../node_modules/chai/chai.js"></script>
-    <script src="../node_modules/sinon/pkg/sinon.js"></script>
-    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
-    <script src="../dist/js/chocolat.js"></script>
-    <script>
-        mocha.setup('bdd')
-        mocha.reporter('html');
-        expect = chai.expect;
-    </script>
-    <script src="test.js"></script>
-    <script>
-        mocha.run()
-    </script>
-</body>
-</html>
\ No newline at end of file
+        <div id="mocha">
+            <p><a href=".">Index</a></p>
+        </div>
+
+        <script src="../node_modules/mocha/mocha.js"></script>
+        <script src="../node_modules/chai/chai.js"></script>
+        <script src="../node_modules/sinon/pkg/sinon.js"></script>
+        <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
+        <script src="../dist/js/chocolat.js"></script>
+        <script>
+            mocha.setup('bdd')
+            mocha.reporter('html')
+            expect = chai.expect
+        </script>
+        <script src="test.js"></script>
+        <script>
+            mocha.run()
+        </script>
+    </body>
+</html>
diff --git a/test/test.js b/test/test.js
index a6514e9..b4ce89b 100644
--- a/test/test.js
+++ b/test/test.js
@@ -70,7 +70,7 @@ describe('Chocolat', function() {
             })
         })
 
-        it('should add custom css classe', function(done) {
+        it('should add custom css classes', function(done) {
             chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
                 className: 'custom-class-name',
             })
@@ -202,7 +202,7 @@ describe('Chocolat', function() {
                 return 'prefix ' + position + '/' + last + ' suffix'
             }
 
-            chocolat = Chocolat(document.querySelectorAll('.chocolat-image'), {
+            chocolat = Chocolat(document.querySelectorAll('#example0 .chocolat-image'), {
                 container: document.querySelector('#container'),
                 pagination: pagination,
             })
@@ -512,6 +512,36 @@ describe('Chocolat', function() {
             expect(typeof chocolat.api.getElem).to.equal('function')
         })
     })
+
+    describe('srcset and sizes attributes', function() {
+        before(function() {
+            chocolat = Chocolat(document.querySelectorAll('#example1 .chocolat-image'), {})
+        })
+        it('Should include the same srcset and sizes attributes from the trigger link (data-srcset and data-sizes)', function() {
+            const trigger = document.querySelector('#example1 .chocolat-image')
+
+            chocolat.api.open().then(function() {
+                const openedImg = document.querySelector('.chocolat-image-wrapper img.chocolat-img')
+
+                expect(openedImg.getAttribute('srcset')).to.be.equal(
+                    trigger.getAttribute('data-srcset')
+                )
+                expect(openedImg.getAttribute('sizes')).to.be.equal(
+                    trigger.getAttribute('data-sizes')
+                )
+            })
+        })
+        it('Should not add empty srcset or sizes attributes', function() {
+            const trigger = document.querySelector('#example0 .chocolat-image')
+
+            chocolat.api.open().then(function() {
+                const openedImg = document.querySelector('.chocolat-image-wrapper img.chocolat-img')
+
+                expect(openedImg.getAttribute('srcset')).to.be.null()
+                expect(openedImg.getAttribute('sizes')).to.be.null()
+            })
+        })
+    })
 })
 
 function getJqueryElement(name) {}

From 8bdefa7e567c03d80a71d4656d55b32fbcc6b820 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Tue, 21 Jan 2020 10:20:50 +0100
Subject: [PATCH 57/65] Fixed regression

---
 dist/js/chocolat.cjs.js |  9 +++++++++
 dist/js/chocolat.esm.js |  9 +++++++++
 dist/js/chocolat.js     |  9 +++++++++
 src/js/chocolat.js      | 10 ++++++++++
 4 files changed, 37 insertions(+)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 94e9a57..60864f8 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -603,6 +603,15 @@ class Chocolat {
       }
 
       debounce(50, () => {
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
+          imageSize: this.settings.imageSize
+        };
         const {
           width,
           height
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index bb85e3c..d4e69cb 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -601,6 +601,15 @@ class Chocolat {
       }
 
       debounce(50, () => {
+        const fitOptions = {
+          imgHeight: this.elems.img.naturalHeight,
+          imgWidth: this.elems.img.naturalWidth,
+          containerHeight: this.elems.wrapper.clientHeight,
+          containerWidth: this.elems.wrapper.clientWidth,
+          canvasWidth: this.elems.imageCanvas.clientWidth,
+          canvasHeight: this.elems.imageCanvas.clientHeight,
+          imageSize: this.settings.imageSize
+        };
         const {
           width,
           height
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
index aec54bd..d3e6d58 100644
--- a/dist/js/chocolat.js
+++ b/dist/js/chocolat.js
@@ -604,6 +604,15 @@
           }
 
           debounce(50, () => {
+            const fitOptions = {
+              imgHeight: this.elems.img.naturalHeight,
+              imgWidth: this.elems.img.naturalWidth,
+              containerHeight: this.elems.wrapper.clientHeight,
+              containerWidth: this.elems.wrapper.clientWidth,
+              canvasWidth: this.elems.imageCanvas.clientWidth,
+              canvasHeight: this.elems.imageCanvas.clientHeight,
+              imageSize: this.settings.imageSize
+            };
             const {
               width,
               height
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index a620019..7f8e88d 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -540,6 +540,16 @@ export class Chocolat {
                 return
             }
             debounce(50, () => {
+                const fitOptions = {
+                    imgHeight: this.elems.img.naturalHeight,
+                    imgWidth: this.elems.img.naturalWidth,
+                    containerHeight: this.elems.wrapper.clientHeight,
+                    containerWidth: this.elems.wrapper.clientWidth,
+                    canvasWidth: this.elems.imageCanvas.clientWidth,
+                    canvasHeight: this.elems.imageCanvas.clientHeight,
+                    imageSize: this.settings.imageSize,
+                }
+
                 const { width, height } = fit(fitOptions)
 
                 this.position(this.elems.img).then(() => {

From c6976b9dcaeba108c59ee0e42530685b5ec88582 Mon Sep 17 00:00:00 2001
From: Diego Scafati <dscafati@gmail.com>
Date: Tue, 21 Jan 2020 11:32:38 +0100
Subject: [PATCH 58/65] Rolled back 599ae53278e3a95867af9fbc21df0e0aa62d9a47
 Fixed relative urls in demo page

---
 demo/index.html | 49 ++++++++++++++++++++++++-------------------------
 1 file changed, 24 insertions(+), 25 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index eb2b61b..fa3cc46 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -34,13 +34,13 @@ <h2>
            Full window, contain, click the numbers to open:
         </h2>
         <div id="example0">
-            <a class="chocolat-image" href="demo/demo-images/5.jpg" title="HO">
+            <a class="chocolat-image" href="demo-images/5.jpg" title="HO">
                 1
             </a>
-            <a class="chocolat-image" href="demo/demo-images/6.jpg" title="HAI">
+            <a class="chocolat-image" href="demo-images/6.jpg" title="HAI">
                 2
             </a>
-            <a class="chocolat-image" href="demo/demo-images/3.jpg" title="IO">
+            <a class="chocolat-image" href="demo-images/3.jpg" title="IO">
                 3
             </a>
         </div>
@@ -49,10 +49,10 @@ <h2>
             Full window, cover, looping :
         </h2>
         <div id="example1">
-            <a class="chocolat-image" href="demo/demo-images/1.jpg" title="foo">
+            <a class="chocolat-image" href="demo-images/1.jpg" title="foo">
                 C
             </a>
-            <a class="chocolat-image" href="demo/demo-images/2.jpg" title="bar">
+            <a class="chocolat-image" href="demo-images/2.jpg" title="bar">
                 D
             </a>
         </div>
@@ -62,14 +62,14 @@ <h2>
         </h2>
 
         <div id="example3">
-            <a class="chocolat-image" href="demo/demo-images/3.jpg" title="Rose">
-                <img src="demo/demo-images/3.jpg" style="width:75px; height:50px" alt="">
+            <a class="chocolat-image" href="demo-images/3.jpg" title="Rose">
+                <img src="demo-images/3.jpg" style="width:75px; height:50px" alt="">
             </a>
-            <a class="chocolat-image" href="demo/demo-images/4.jpg" title="Black">
-                <img src="demo/demo-images/4.jpg" style="width:75px; height:50px" alt="">
+            <a class="chocolat-image" href="demo-images/4.jpg" title="Black">
+                <img src="demo-images/4.jpg" style="width:75px; height:50px" alt="">
             </a>
-            <a class="chocolat-image" href="demo/demo-images/5.jpg" title="Yellow">
-                <img src="demo/demo-images/5.jpg" style="width:75px; height:50px" alt="">
+            <a class="chocolat-image" href="demo-images/5.jpg" title="Yellow">
+                <img src="demo-images/5.jpg" style="width:75px; height:50px" alt="">
             </a>
         </div>
         <!-- Container (notice the relative width) :  -->
@@ -80,13 +80,13 @@ <h2>
         </h2>
 
         <div id="example2">
-            <a class="chocolat-image" href="demo/demo-images/3.jpg" title="Rose">
+            <a class="chocolat-image" href="demo-images/3.jpg" title="Rose">
                 A
             </a>
-            <a class="chocolat-image" href="demo/demo-images/4.jpg" title="Black">
+            <a class="chocolat-image" href="demo-images/4.jpg" title="Black">
                 B
             </a>
-            <a class="chocolat-image" href="demo/demo-images/5.jpg" title="Yellow">
+            <a class="chocolat-image" href="demo-images/5.jpg" title="Yellow">
                 C
             </a>
         </div>
@@ -115,14 +115,14 @@ <h2>
         <h2>Usage with srcset and sizes attributes. Full window, contained.</h2>
         <p>Be careful while using "cover" and data-sizes="100vw", the image could be wider than the viewport width.</p>
         <div id="example4">
-            <a class="chocolat-image" href="demo/demo-images/1920x1080.png" title="responsive"
-               data-srcset="demo/demo-images/320x180.png 320w,
-                            demo/demo-images/640x360.png 640w,
-                            demo/demo-images/960x540.png 960w,
-                            demo/demo-images/1280x720.png 1280w,
-                            demo/demo-images/1920x1080.png 1920w"
+            <a class="chocolat-image" href="demo-images/1920x1080.png" title="responsive"
+               data-srcset="demo-images/320x180.png 320w,
+                            demo-images/640x360.png 640w,
+                            demo-images/960x540.png 960w,
+                            demo-images/1280x720.png 1280w,
+                            demo-images/1920x1080.png 1920w"
                data-sizes="100vw">
-                <img src="demo/demo-images/75x50.png" style="width:75px; height:50px" alt="">
+                <img src="demo-images/75x50.png" style="width:75px; height:50px" alt="">
             </a>
         </div>
 
@@ -153,15 +153,14 @@ <h2>Usage with srcset and sizes attributes. Full window, contained.</h2>
             })
             Chocolat(document.querySelectorAll('#example4 .chocolat-image'), {
                 imageSize: 'contain',
-                loop: true,
             })
         </script>
         <script>
             // api demo
             var instance = Chocolat([
-                    {src : 'demo/demo-images/1.jpg', title : 'caption 1'},
-                    {src : 'demo/demo-images/6.jpg', title : 'caption 2'},
-                    {src : 'demo/demo-images/8.jpg', title : 'caption 3'},
+                    {src : 'demo-images/1.jpg', title : 'caption 1'},
+                    {src : 'demo-images/6.jpg', title : 'caption 2'},
+                    {src : 'demo-images/8.jpg', title : 'caption 3'},
                 ], {
                 setTitle : function () { return 'set title' },
                 loop: true,

From ea3879d1d8a4df243dbdb0e936cba82317234497 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Wed, 22 Jan 2020 16:44:59 +0100
Subject: [PATCH 59/65] Srcset support #111

---
 demo/index.html         |  2 --
 dist/js/chocolat.cjs.js | 21 +++++++++++----------
 dist/js/chocolat.esm.js | 21 +++++++++++----------
 dist/js/chocolat.js     | 21 +++++++++++----------
 src/js/chocolat.js      |  2 --
 src/js/utils.js         | 14 +++++++-------
 6 files changed, 40 insertions(+), 41 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index fa3cc46..8249275 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -127,8 +127,6 @@ <h2>Usage with srcset and sizes attributes. Full window, contained.</h2>
         </div>
 
 
-
-
         <script>
             // standard demos
             Chocolat(document.querySelectorAll('#example0 .chocolat-image'), {
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 1d5d330..9f76060 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -29,17 +29,20 @@ function transitionAsPromise(triggeringFunc, el) {
     }
   });
 }
-function loadImage(img) {
-  const path = img.src;
+function loadImage({
+  src,
+  srcset,
+  sizes
+}) {
   const image = new Image();
-  image.src = path;
+  image.src = src;
 
-  if (img.srcset) {
-    image.srcset = img.srcset;
+  if (srcset) {
+    image.srcset = srcset;
   }
 
-  if (img.sizes) {
-    image.sizes = img.sizes;
+  if (sizes) {
+    image.sizes = sizes;
   }
 
   if ('decode' in image) {
@@ -193,9 +196,7 @@ class Chocolat {
           title: el.getAttribute('title'),
           src: el.getAttribute('href'),
           srcset: el.getAttribute('data-srcset'),
-          sizes: el.getAttribute('data-sizes'),
-          height: undefined,
-          width: undefined
+          sizes: el.getAttribute('data-sizes')
         });
         this.off(el, 'click.chocolat');
         this.on(el, 'click.chocolat', e => {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 8789c16..38e5825 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -27,17 +27,20 @@ function transitionAsPromise(triggeringFunc, el) {
     }
   });
 }
-function loadImage(img) {
-  const path = img.src;
+function loadImage({
+  src,
+  srcset,
+  sizes
+}) {
   const image = new Image();
-  image.src = path;
+  image.src = src;
 
-  if (img.srcset) {
-    image.srcset = img.srcset;
+  if (srcset) {
+    image.srcset = srcset;
   }
 
-  if (img.sizes) {
-    image.sizes = img.sizes;
+  if (sizes) {
+    image.sizes = sizes;
   }
 
   if ('decode' in image) {
@@ -191,9 +194,7 @@ class Chocolat {
           title: el.getAttribute('title'),
           src: el.getAttribute('href'),
           srcset: el.getAttribute('data-srcset'),
-          sizes: el.getAttribute('data-sizes'),
-          height: undefined,
-          width: undefined
+          sizes: el.getAttribute('data-sizes')
         });
         this.off(el, 'click.chocolat');
         this.on(el, 'click.chocolat', e => {
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
index 2af8d4f..df16c2b 100644
--- a/dist/js/chocolat.js
+++ b/dist/js/chocolat.js
@@ -30,17 +30,20 @@
         }
       });
     }
-    function loadImage(img) {
-      const path = img.src;
+    function loadImage({
+      src,
+      srcset,
+      sizes
+    }) {
       const image = new Image();
-      image.src = path;
+      image.src = src;
 
-      if (img.srcset) {
-        image.srcset = img.srcset;
+      if (srcset) {
+        image.srcset = srcset;
       }
 
-      if (img.sizes) {
-        image.sizes = img.sizes;
+      if (sizes) {
+        image.sizes = sizes;
       }
 
       if ('decode' in image) {
@@ -194,9 +197,7 @@
               title: el.getAttribute('title'),
               src: el.getAttribute('href'),
               srcset: el.getAttribute('data-srcset'),
-              sizes: el.getAttribute('data-sizes'),
-              height: undefined,
-              width: undefined
+              sizes: el.getAttribute('data-sizes')
             });
             this.off(el, 'click.chocolat');
             this.on(el, 'click.chocolat', e => {
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 4ac7528..b310786 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -76,8 +76,6 @@ export class Chocolat {
                     src: el.getAttribute('href'),
                     srcset: el.getAttribute('data-srcset'),
                     sizes: el.getAttribute('data-sizes'),
-                    height: undefined,
-                    width: undefined,
                 })
 
                 this.off(el, 'click.chocolat')
diff --git a/src/js/utils.js b/src/js/utils.js
index d0e701e..5138f74 100644
--- a/src/js/utils.js
+++ b/src/js/utils.js
@@ -34,15 +34,15 @@ export function transitionAsPromise(triggeringFunc, el) {
     })
 }
 
-export function loadImage(img) {
-    const path = img.src
+export function loadImage({ src, srcset, sizes }) {
     const image = new Image()
-    image.src = path
-    if (img.srcset) {
-        image.srcset = img.srcset
+
+    image.src = src
+    if (srcset) {
+        image.srcset = srcset
     }
-    if (img.sizes) {
-        image.sizes = img.sizes
+    if (sizes) {
+        image.sizes = sizes
     }
 
     if ('decode' in image) {

From a710f1c71e85e6e429303382c6c78a49f7af295e Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Wed, 22 Jan 2020 16:47:06 +0100
Subject: [PATCH 60/65] Bumped

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index f1e5106..be21399 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "chocolat",
-  "version": "1.0.0-beta.3",
+  "version": "1.0.0-beta.4",
   "description": "Responsive Lightbox Plugin",
   "main": "dist/js/chocolat.cjs.js",
   "module": "dist/js/chocolat.esm.js",

From e086cebc8fd47beb1e7404ad18fdea0fe3cf4ad4 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 30 Mar 2020 16:13:37 +0200
Subject: [PATCH 61/65] Made text non selectable

---
 src/css/chocolat.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/css/chocolat.css b/src/css/chocolat.css
index 22c1cbd..e5ad53c 100644
--- a/src/css/chocolat.css
+++ b/src/css/chocolat.css
@@ -108,6 +108,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
+    user-select: none;
 }
 
 .chocolat-wrapper .chocolat-right {

From 2295e6eff0804f90d49defaac0f9acb8f5001cdf Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 30 Mar 2020 16:14:16 +0200
Subject: [PATCH 62/65] Use new visible state to know if chocolat is visible or
 not

---
 src/js/chocolat.js | 23 ++++++++++++-----------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index b310786..131c943 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -54,6 +54,7 @@ export class Chocolat {
             initialZoomState: null,
             initialized: false,
             timer: false,
+            visible: false,
         }
 
         this._cssClasses = [
@@ -160,6 +161,8 @@ export class Chocolat {
     }
 
     load(index) {
+        this.state.visible = true
+
         if (this.settings.fullScreen) {
             this.state.fullScreenOpen = openFullScreen(this.elems.wrapper)
         }
@@ -261,6 +264,10 @@ export class Chocolat {
     }
 
     change(step) {
+        if (!this.state.visible) {
+            return
+        }
+
         this.zoomOut()
 
         const requestedImage = this.settings.currentImageIndex + parseInt(step)
@@ -302,7 +309,7 @@ export class Chocolat {
             return
         }
 
-        this.settings.currentImageIndex = undefined
+        this.state.visible = false
 
         const promiseOverlay = transitionAsPromise(() => {
             this.elems.overlay.classList.remove('chocolat-visible')
@@ -330,6 +337,7 @@ export class Chocolat {
             this.state.fullScreenOpen = exitFullScreen()
         }
         this.settings.currentImageIndex = undefined
+        this.state.visible = false
         this.state.initialized = false
 
         this.elems.container.classList.remove(...this._cssClasses)
@@ -464,10 +472,7 @@ export class Chocolat {
 
         this.off(this.elems.wrapper, 'click.chocolat')
         this.on(this.elems.wrapper, 'click.chocolat', () => {
-            if (
-                this.state.initialZoomState === null ||
-                this.settings.currentImageIndex === undefined
-            ) {
+            if (this.state.initialZoomState === null || !this.state.visible) {
                 return
             }
 
@@ -495,11 +500,7 @@ export class Chocolat {
         })
 
         this.on(this.elems.wrapper, 'mousemove.chocolat', (e) => {
-            if (this.state.initialZoomState === null) {
-                return
-            }
-
-            if (this.settings.currentImageIndex === undefined) {
+            if (this.state.initialZoomState === null || !this.state.visible) {
                 return
             }
 
@@ -536,7 +537,7 @@ export class Chocolat {
         })
 
         this.on(window, 'resize.chocolat', (e) => {
-            if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
+            if (!this.state.initialized || !this.state.visible) {
                 return
             }
             debounce(50, () => {

From 0f458be620d4687f791d0c913e8769546eb4e4cc Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 30 Mar 2020 16:15:20 +0200
Subject: [PATCH 63/65] Remove maybe unused line, preventing from modifing
 imageWrapper content in hooks

---
 src/js/chocolat.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 131c943..9f23b17 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -252,7 +252,8 @@ export class Chocolat {
 
     appear(image) {
         this.elems.img = image
-        this.elems.imageWrapper.innerHTML = ''
+        // Not sure if needed to avoid white flickering ?
+        // this.elems.imageWrapper.innerHTML = ''
         this.elems.img.setAttribute('class', 'chocolat-img')
         this.elems.imageWrapper.appendChild(this.elems.img)
 

From 6f78852ac37d4e52f37aa9e5f5d226e906ba50d8 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 30 Mar 2020 21:03:40 +0200
Subject: [PATCH 64/65] Bumped beta.6

---
 dist/css/chocolat.css   |  1 +
 dist/js/chocolat.cjs.js | 27 ++++++++++++++++-----------
 dist/js/chocolat.esm.js | 27 ++++++++++++++++-----------
 dist/js/chocolat.js     | 27 ++++++++++++++++-----------
 package.json            |  2 +-
 5 files changed, 50 insertions(+), 34 deletions(-)

diff --git a/dist/css/chocolat.css b/dist/css/chocolat.css
index 22c1cbd..e5ad53c 100644
--- a/dist/css/chocolat.css
+++ b/dist/css/chocolat.css
@@ -108,6 +108,7 @@
     display: flex;
     justify-content: center;
     align-items: center;
+    user-select: none;
 }
 
 .chocolat-wrapper .chocolat-right {
diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 9f76060..1a72536 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -186,7 +186,8 @@ class Chocolat {
       fullScreenOpen: false,
       initialZoomState: null,
       initialized: false,
-      timer: false
+      timer: false,
+      visible: false
     };
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed', 'chocolat-zooming-in', 'chocolat-zooming-out'];
 
@@ -266,6 +267,8 @@ class Chocolat {
   }
 
   load(index) {
+    this.state.visible = true;
+
     if (this.settings.fullScreen) {
       this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     }
@@ -347,8 +350,9 @@ class Chocolat {
   }
 
   appear(image) {
-    this.elems.img = image;
-    this.elems.imageWrapper.innerHTML = '';
+    this.elems.img = image; // Not sure if needed to avoid white flickering ?
+    // this.elems.imageWrapper.innerHTML = ''
+
     this.elems.img.setAttribute('class', 'chocolat-img');
     this.elems.imageWrapper.appendChild(this.elems.img);
     const fadeInPromise = transitionAsPromise(() => {
@@ -358,6 +362,10 @@ class Chocolat {
   }
 
   change(step) {
+    if (!this.state.visible) {
+      return;
+    }
+
     this.zoomOut();
     const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
@@ -393,7 +401,7 @@ class Chocolat {
       return;
     }
 
-    this.settings.currentImageIndex = undefined;
+    this.state.visible = false;
     const promiseOverlay = transitionAsPromise(() => {
       this.elems.overlay.classList.remove('chocolat-visible');
     }, this.elems.overlay);
@@ -423,6 +431,7 @@ class Chocolat {
     }
 
     this.settings.currentImageIndex = undefined;
+    this.state.visible = false;
     this.state.initialized = false;
     this.elems.container.classList.remove(...this._cssClasses);
     this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
@@ -537,7 +546,7 @@ class Chocolat {
 
     this.off(this.elems.wrapper, 'click.chocolat');
     this.on(this.elems.wrapper, 'click.chocolat', () => {
-      if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+      if (this.state.initialZoomState === null || !this.state.visible) {
         return;
       }
 
@@ -559,11 +568,7 @@ class Chocolat {
       }
     });
     this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
-      if (this.state.initialZoomState === null) {
-        return;
-      }
-
-      if (this.settings.currentImageIndex === undefined) {
+      if (this.state.initialZoomState === null || !this.state.visible) {
         return;
       }
 
@@ -597,7 +602,7 @@ class Chocolat {
       this.elems.img.style.marginTop = -mvtY + 'px';
     });
     this.on(window, 'resize.chocolat', e => {
-      if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
+      if (!this.state.initialized || !this.state.visible) {
         return;
       }
 
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index 38e5825..b46cc0a 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -184,7 +184,8 @@ class Chocolat {
       fullScreenOpen: false,
       initialZoomState: null,
       initialized: false,
-      timer: false
+      timer: false,
+      visible: false
     };
     this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed', 'chocolat-zooming-in', 'chocolat-zooming-out'];
 
@@ -264,6 +265,8 @@ class Chocolat {
   }
 
   load(index) {
+    this.state.visible = true;
+
     if (this.settings.fullScreen) {
       this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
     }
@@ -345,8 +348,9 @@ class Chocolat {
   }
 
   appear(image) {
-    this.elems.img = image;
-    this.elems.imageWrapper.innerHTML = '';
+    this.elems.img = image; // Not sure if needed to avoid white flickering ?
+    // this.elems.imageWrapper.innerHTML = ''
+
     this.elems.img.setAttribute('class', 'chocolat-img');
     this.elems.imageWrapper.appendChild(this.elems.img);
     const fadeInPromise = transitionAsPromise(() => {
@@ -356,6 +360,10 @@ class Chocolat {
   }
 
   change(step) {
+    if (!this.state.visible) {
+      return;
+    }
+
     this.zoomOut();
     const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
@@ -391,7 +399,7 @@ class Chocolat {
       return;
     }
 
-    this.settings.currentImageIndex = undefined;
+    this.state.visible = false;
     const promiseOverlay = transitionAsPromise(() => {
       this.elems.overlay.classList.remove('chocolat-visible');
     }, this.elems.overlay);
@@ -421,6 +429,7 @@ class Chocolat {
     }
 
     this.settings.currentImageIndex = undefined;
+    this.state.visible = false;
     this.state.initialized = false;
     this.elems.container.classList.remove(...this._cssClasses);
     this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
@@ -535,7 +544,7 @@ class Chocolat {
 
     this.off(this.elems.wrapper, 'click.chocolat');
     this.on(this.elems.wrapper, 'click.chocolat', () => {
-      if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+      if (this.state.initialZoomState === null || !this.state.visible) {
         return;
       }
 
@@ -557,11 +566,7 @@ class Chocolat {
       }
     });
     this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
-      if (this.state.initialZoomState === null) {
-        return;
-      }
-
-      if (this.settings.currentImageIndex === undefined) {
+      if (this.state.initialZoomState === null || !this.state.visible) {
         return;
       }
 
@@ -595,7 +600,7 @@ class Chocolat {
       this.elems.img.style.marginTop = -mvtY + 'px';
     });
     this.on(window, 'resize.chocolat', e => {
-      if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
+      if (!this.state.initialized || !this.state.visible) {
         return;
       }
 
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
index df16c2b..8d7869a 100644
--- a/dist/js/chocolat.js
+++ b/dist/js/chocolat.js
@@ -187,7 +187,8 @@
           fullScreenOpen: false,
           initialZoomState: null,
           initialized: false,
-          timer: false
+          timer: false,
+          visible: false
         };
         this._cssClasses = ['chocolat-open', 'chocolat-in-container', 'chocolat-cover', 'chocolat-zoomable', 'chocolat-zoomed', 'chocolat-zooming-in', 'chocolat-zooming-out'];
 
@@ -267,6 +268,8 @@
       }
 
       load(index) {
+        this.state.visible = true;
+
         if (this.settings.fullScreen) {
           this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
         }
@@ -348,8 +351,9 @@
       }
 
       appear(image) {
-        this.elems.img = image;
-        this.elems.imageWrapper.innerHTML = '';
+        this.elems.img = image; // Not sure if needed to avoid white flickering ?
+        // this.elems.imageWrapper.innerHTML = ''
+
         this.elems.img.setAttribute('class', 'chocolat-img');
         this.elems.imageWrapper.appendChild(this.elems.img);
         const fadeInPromise = transitionAsPromise(() => {
@@ -359,6 +363,10 @@
       }
 
       change(step) {
+        if (!this.state.visible) {
+          return;
+        }
+
         this.zoomOut();
         const requestedImage = this.settings.currentImageIndex + parseInt(step);
 
@@ -394,7 +402,7 @@
           return;
         }
 
-        this.settings.currentImageIndex = undefined;
+        this.state.visible = false;
         const promiseOverlay = transitionAsPromise(() => {
           this.elems.overlay.classList.remove('chocolat-visible');
         }, this.elems.overlay);
@@ -424,6 +432,7 @@
         }
 
         this.settings.currentImageIndex = undefined;
+        this.state.visible = false;
         this.state.initialized = false;
         this.elems.container.classList.remove(...this._cssClasses);
         this.elems.wrapper.parentNode.removeChild(this.elems.wrapper);
@@ -538,7 +547,7 @@
 
         this.off(this.elems.wrapper, 'click.chocolat');
         this.on(this.elems.wrapper, 'click.chocolat', () => {
-          if (this.state.initialZoomState === null || this.settings.currentImageIndex === undefined) {
+          if (this.state.initialZoomState === null || !this.state.visible) {
             return;
           }
 
@@ -560,11 +569,7 @@
           }
         });
         this.on(this.elems.wrapper, 'mousemove.chocolat', e => {
-          if (this.state.initialZoomState === null) {
-            return;
-          }
-
-          if (this.settings.currentImageIndex === undefined) {
+          if (this.state.initialZoomState === null || !this.state.visible) {
             return;
           }
 
@@ -598,7 +603,7 @@
           this.elems.img.style.marginTop = -mvtY + 'px';
         });
         this.on(window, 'resize.chocolat', e => {
-          if (!this.state.initialized || this.settings.currentImageIndex === undefined) {
+          if (!this.state.initialized || !this.state.visible) {
             return;
           }
 
diff --git a/package.json b/package.json
index be21399..578767d 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "chocolat",
-  "version": "1.0.0-beta.4",
+  "version": "1.0.0-beta.6",
   "description": "Responsive Lightbox Plugin",
   "main": "dist/js/chocolat.cjs.js",
   "module": "dist/js/chocolat.esm.js",

From 4d73c4df320c5ceea51640acd2441c3c3cf8a931 Mon Sep 17 00:00:00 2001
From: Nicolas Turlais <nicolas.turlais@gmail.com>
Date: Mon, 30 Mar 2020 22:21:41 +0200
Subject: [PATCH 65/65] Allow openning same image twice, fix multiple images
 leaked into imageWrapper

---
 dist/js/chocolat.cjs.js | 19 ++++++++++---------
 dist/js/chocolat.esm.js | 19 ++++++++++---------
 dist/js/chocolat.js     | 19 ++++++++++---------
 package.json            |  2 +-
 src/js/chocolat.js      | 21 +++++++++++----------
 5 files changed, 42 insertions(+), 38 deletions(-)

diff --git a/dist/js/chocolat.cjs.js b/dist/js/chocolat.cjs.js
index 1a72536..769f1c2 100644
--- a/dist/js/chocolat.cjs.js
+++ b/dist/js/chocolat.cjs.js
@@ -267,7 +267,14 @@ class Chocolat {
   }
 
   load(index) {
-    this.state.visible = true;
+    if (!this.state.visible) {
+      this.state.visible = true;
+      setTimeout(() => {
+        this.elems.overlay.classList.add('chocolat-visible');
+        this.elems.wrapper.classList.add('chocolat-visible');
+      }, 0);
+      this.elems.container.classList.add('chocolat-open');
+    }
 
     if (this.settings.fullScreen) {
       this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
@@ -277,11 +284,6 @@ class Chocolat {
       return Promise.resolve();
     }
 
-    setTimeout(() => {
-      this.elems.overlay.classList.add('chocolat-visible');
-      this.elems.wrapper.classList.add('chocolat-visible');
-    }, 0);
-    this.elems.container.classList.add('chocolat-open');
     let loaderTimer = setTimeout(() => {
       this.elems.loader.classList.add('chocolat-visible');
     }, 1000);
@@ -350,9 +352,8 @@ class Chocolat {
   }
 
   appear(image) {
-    this.elems.img = image; // Not sure if needed to avoid white flickering ?
-    // this.elems.imageWrapper.innerHTML = ''
-
+    this.elems.imageWrapper.removeChild(this.elems.img);
+    this.elems.img = image;
     this.elems.img.setAttribute('class', 'chocolat-img');
     this.elems.imageWrapper.appendChild(this.elems.img);
     const fadeInPromise = transitionAsPromise(() => {
diff --git a/dist/js/chocolat.esm.js b/dist/js/chocolat.esm.js
index b46cc0a..794c7b9 100644
--- a/dist/js/chocolat.esm.js
+++ b/dist/js/chocolat.esm.js
@@ -265,7 +265,14 @@ class Chocolat {
   }
 
   load(index) {
-    this.state.visible = true;
+    if (!this.state.visible) {
+      this.state.visible = true;
+      setTimeout(() => {
+        this.elems.overlay.classList.add('chocolat-visible');
+        this.elems.wrapper.classList.add('chocolat-visible');
+      }, 0);
+      this.elems.container.classList.add('chocolat-open');
+    }
 
     if (this.settings.fullScreen) {
       this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
@@ -275,11 +282,6 @@ class Chocolat {
       return Promise.resolve();
     }
 
-    setTimeout(() => {
-      this.elems.overlay.classList.add('chocolat-visible');
-      this.elems.wrapper.classList.add('chocolat-visible');
-    }, 0);
-    this.elems.container.classList.add('chocolat-open');
     let loaderTimer = setTimeout(() => {
       this.elems.loader.classList.add('chocolat-visible');
     }, 1000);
@@ -348,9 +350,8 @@ class Chocolat {
   }
 
   appear(image) {
-    this.elems.img = image; // Not sure if needed to avoid white flickering ?
-    // this.elems.imageWrapper.innerHTML = ''
-
+    this.elems.imageWrapper.removeChild(this.elems.img);
+    this.elems.img = image;
     this.elems.img.setAttribute('class', 'chocolat-img');
     this.elems.imageWrapper.appendChild(this.elems.img);
     const fadeInPromise = transitionAsPromise(() => {
diff --git a/dist/js/chocolat.js b/dist/js/chocolat.js
index 8d7869a..f76259a 100644
--- a/dist/js/chocolat.js
+++ b/dist/js/chocolat.js
@@ -268,7 +268,14 @@
       }
 
       load(index) {
-        this.state.visible = true;
+        if (!this.state.visible) {
+          this.state.visible = true;
+          setTimeout(() => {
+            this.elems.overlay.classList.add('chocolat-visible');
+            this.elems.wrapper.classList.add('chocolat-visible');
+          }, 0);
+          this.elems.container.classList.add('chocolat-open');
+        }
 
         if (this.settings.fullScreen) {
           this.state.fullScreenOpen = openFullScreen(this.elems.wrapper);
@@ -278,11 +285,6 @@
           return Promise.resolve();
         }
 
-        setTimeout(() => {
-          this.elems.overlay.classList.add('chocolat-visible');
-          this.elems.wrapper.classList.add('chocolat-visible');
-        }, 0);
-        this.elems.container.classList.add('chocolat-open');
         let loaderTimer = setTimeout(() => {
           this.elems.loader.classList.add('chocolat-visible');
         }, 1000);
@@ -351,9 +353,8 @@
       }
 
       appear(image) {
-        this.elems.img = image; // Not sure if needed to avoid white flickering ?
-        // this.elems.imageWrapper.innerHTML = ''
-
+        this.elems.imageWrapper.removeChild(this.elems.img);
+        this.elems.img = image;
         this.elems.img.setAttribute('class', 'chocolat-img');
         this.elems.imageWrapper.appendChild(this.elems.img);
         const fadeInPromise = transitionAsPromise(() => {
diff --git a/package.json b/package.json
index 578767d..b7a01aa 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "chocolat",
-  "version": "1.0.0-beta.6",
+  "version": "1.0.0-beta.7",
   "description": "Responsive Lightbox Plugin",
   "main": "dist/js/chocolat.cjs.js",
   "module": "dist/js/chocolat.esm.js",
diff --git a/src/js/chocolat.js b/src/js/chocolat.js
index 9f23b17..b7d0411 100644
--- a/src/js/chocolat.js
+++ b/src/js/chocolat.js
@@ -161,7 +161,16 @@ export class Chocolat {
     }
 
     load(index) {
-        this.state.visible = true
+        if (!this.state.visible) {
+            this.state.visible = true
+
+            setTimeout(() => {
+                this.elems.overlay.classList.add('chocolat-visible')
+                this.elems.wrapper.classList.add('chocolat-visible')
+            }, 0)
+
+            this.elems.container.classList.add('chocolat-open')
+        }
 
         if (this.settings.fullScreen) {
             this.state.fullScreenOpen = openFullScreen(this.elems.wrapper)
@@ -171,13 +180,6 @@ export class Chocolat {
             return Promise.resolve()
         }
 
-        setTimeout(() => {
-            this.elems.overlay.classList.add('chocolat-visible')
-            this.elems.wrapper.classList.add('chocolat-visible')
-        }, 0)
-
-        this.elems.container.classList.add('chocolat-open')
-
         let loaderTimer = setTimeout(() => {
             this.elems.loader.classList.add('chocolat-visible')
         }, 1000)
@@ -251,9 +253,8 @@ export class Chocolat {
     }
 
     appear(image) {
+        this.elems.imageWrapper.removeChild(this.elems.img)
         this.elems.img = image
-        // Not sure if needed to avoid white flickering ?
-        // this.elems.imageWrapper.innerHTML = ''
         this.elems.img.setAttribute('class', 'chocolat-img')
         this.elems.imageWrapper.appendChild(this.elems.img)