Fix autoplay pause / play (glidejs#439)

Co-authored-by: jedrzejchalubek <[email protected]>

src/components/autoplay.js

@@ -18,20 +18,45 @@ export default function (Glide, Components, Events) {
  * @return {Void}
  */
  mount () {
+ this.enable();
  this.start()
 
  if (Glide.settings.hoverpause) {
  this.bind()
  }
  },
 
+ /**
+ * Enables autoplaying
+ *
+ * @returns {Void}
+ */
+ enable () {
+ this._e = true
+ },
+
+ /**
+ * Disables autoplaying.
+ *
+ * @returns {Void}
+ */
+ disable () {
+ this._e = false
+ },
+
  /**
  * Starts autoplaying in configured interval.
  *
  * @param {Boolean|Number} force Run autoplaying with passed interval regardless of `autoplay` settings
  * @return {Void}
  */
  start () {
+ if (!this._e) {
+ return
+ }
+
+ this.enable()
+
  if (Glide.settings.autoplay) {
  if (isUndefined(this._i)) {
  this._i = setInterval(() => {
@@ -62,16 +87,16 @@ export default function (Glide, Components, Events) {
  * @return {Void}
  */
  bind () {
- Binder.on('mouseenter', Components.Html.root, () => {
- this.stop()
-
- Events.emit('autoplay.enter')
+ Binder.on('mouseover', Components.Html.root, () => {
+ if (this._e) {
+ this.stop()
+ }
  })
 
- Binder.on('mouseleave', Components.Html.root, () => {
- this.start()
-
- Events.emit('autoplay.leave')
+ Binder.on('mouseout', Components.Html.root, () => {
+ if (this._e) {
+ this.start()
+ }
  })
  },
 
@@ -120,7 +145,12 @@ export default function (Glide, Components, Events) {
  * - while starting a swipe
  * - on updating via API to reset interval that may changed
  */
- Events.on(['run.before', 'pause', 'destroy', 'swipe.start', 'update'], () => {
+ Events.on(['run.before', 'swipe.start', 'update'], () => {
+ Autoplay.stop()
+ })
+
+ Events.on(['pause', 'destroy'], () => {
+ Autoplay.disable();
  Autoplay.stop()
  })
 
@@ -130,7 +160,19 @@ export default function (Glide, Components, Events) {
  * - on playing via API
  * - while ending a swipe
  */
- Events.on(['run.after', 'play', 'swipe.end'], () => {
+ Events.on(['run.after', 'swipe.end'], () => {
+ Autoplay.start()
+ })
+
+
+ /**
+ * Start autoplaying:
+ * - after each run, to restart autoplaying
+ * - on playing via API
+ * - while ending a swipe
+ */
+ Events.on(['play'], () => {
+ Autoplay.enable();
  Autoplay.start()
  })