nolanlawson
/
pinafore
forked from cybrespace/pinafore
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix(video): stop playing video when modal closed (#640) 

fixes #622
This commit is contained in:
Nolan Lawson 2018-11-12 16:20:59 -08:00 committed by GitHub
parent 94baf9e396
commit c54aaf2fa4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
routes/_components/dialog/components/ModalDialog.html
View File

@ -131,8 +131,9 @@
let dialogElement = this.refs.node.parentElement let dialogElement = this.refs.node.parentElement
this._a11yDialog = new A11yDialog(dialogElement) this._a11yDialog = new A11yDialog(dialogElement)
this._a11yDialog.on('hide', () => { this._a11yDialog.on('hide', () => {
this._a11yDialog.destroy()
let { id } = this.get() let { id } = this.get()
this.fire('close')
this._a11yDialog.destroy()
emit('destroyDialog', id) emit('destroyDialog', id)
requestAnimationFrame(() => document.body.removeChild(dialogElement)) requestAnimationFrame(() => document.body.removeChild(dialogElement))
}) })

9
routes/_components/dialog/components/VideoDialog.html
View File

@ -4,6 +4,7 @@
background="var(--muted-modal-bg)" background="var(--muted-modal-bg)"
muted="true" muted="true"
className="video-modal-dialog" className="video-modal-dialog"
on:close="onClose()"
> >
<video {poster} <video {poster}
{src} {src}
@ -11,6 +12,7 @@
{height} {height}
aria-label="Video: {description || ''}" aria-label="Video: {description || ''}"
controls controls
ref:video
/> />
</ModalDialog> </ModalDialog>
<style> <style>
@ -32,7 +34,12 @@
ModalDialog ModalDialog
}, },
methods: { methods: {
show show,
onClose () {
if (this.refs.video && !this.refs.video.paused) {
this.refs.video.pause()
}
}
} }
} }
</script> </script>