From c54aaf2fa4aa023f336c6f2fcefdb96a5f18d43f Mon Sep 17 00:00:00 2001
From: Nolan Lawson <nolan@nolanlawson.com>
Date: Mon, 12 Nov 2018 16:20:59 -0800
Subject: [PATCH] fix(video): stop playing video when modal closed (#640)

fixes #622
---
 routes/_components/dialog/components/ModalDialog.html | 3 ++-
 routes/_components/dialog/components/VideoDialog.html | 9 ++++++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/routes/_components/dialog/components/ModalDialog.html b/routes/_components/dialog/components/ModalDialog.html
index 3af45b2..fb605bd 100644
--- a/routes/_components/dialog/components/ModalDialog.html
+++ b/routes/_components/dialog/components/ModalDialog.html
@@ -131,8 +131,9 @@
       let dialogElement = this.refs.node.parentElement
       this._a11yDialog = new A11yDialog(dialogElement)
       this._a11yDialog.on('hide', () => {
-        this._a11yDialog.destroy()
         let { id } = this.get()
+        this.fire('close')
+        this._a11yDialog.destroy()
         emit('destroyDialog', id)
         requestAnimationFrame(() => document.body.removeChild(dialogElement))
       })
diff --git a/routes/_components/dialog/components/VideoDialog.html b/routes/_components/dialog/components/VideoDialog.html
index 2d5ded0..17b7d1b 100644
--- a/routes/_components/dialog/components/VideoDialog.html
+++ b/routes/_components/dialog/components/VideoDialog.html
@@ -4,6 +4,7 @@
   background="var(--muted-modal-bg)"
   muted="true"
   className="video-modal-dialog"
+  on:close="onClose()"
 >
   <video {poster}
          {src}
@@ -11,6 +12,7 @@
          {height}
          aria-label="Video: {description || ''}"
          controls
+         ref:video
   />
 </ModalDialog>
 <style>
@@ -32,7 +34,12 @@
       ModalDialog
     },
     methods: {
-      show
+      show,
+      onClose () {
+        if (this.refs.video && !this.refs.video.paused) {
+          this.refs.video.pause()
+        }
+      }
     }
   }
 </script>
\ No newline at end of file