fix: Video stops on closing modal
This commit is contained in:
parent
526af9d268
commit
15f6faad9b
@ -9,7 +9,7 @@
|
|||||||
<div v-html="program.description"></div>
|
<div v-html="program.description"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class='text-right p-3'>
|
<div class='text-right p-3'>
|
||||||
<button class='btn btn-secondary btn-sm' data-toggle="modal" data-target="#videoModal">Watch Intro</button>
|
<button class='btn btn-secondary btn-sm text-white' data-toggle="modal" data-target="#videoModal">Watch Intro</button>
|
||||||
<a-button v-if="enrolled" type="dark" size="sm" :route="programPageRoute">
|
<a-button v-if="enrolled" type="dark" size="sm" :route="programPageRoute">
|
||||||
{{ buttonName }}
|
{{ buttonName }}
|
||||||
</a-button>
|
</a-button>
|
||||||
|
|||||||
@ -5,35 +5,30 @@
|
|||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<h5 class="modal-title">{{ title }}</h5>
|
<h5 class="modal-title">{{ title }}</h5>
|
||||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||||
<span aria-hidden="true">×</span>
|
<span id="close_modal" aria-hidden="true" @click="stopVideo()">×</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-body">
|
<div class="modal-body">
|
||||||
<div class="embed-responsive embed-responsive-16by9">
|
<youtube-player :url="video" :allowfullscreen="'false'"/>
|
||||||
<iframe class="embed-responsive-item" :src="'https://www.youtube.com/embed/' + videoID"></iframe>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
|
import YoutubePlayer from './YoutubePlayer.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'VideoModal',
|
name: 'VideoModal',
|
||||||
props: ['title', 'video'],
|
props: ['title', 'video'],
|
||||||
computed: {
|
components: {
|
||||||
videoID() {
|
YoutubePlayer
|
||||||
if (!Array.prototype.last){
|
},
|
||||||
Array.prototype.last = function(){
|
methods: {
|
||||||
return this[this.length - 1];
|
stopVideo() {
|
||||||
};
|
$('.yvideo').each(function() {
|
||||||
};
|
this.contentWindow.postMessage('{"event":"command","func":"stopVideo","args":""}', '*')
|
||||||
if (this.video.includes('v=')){
|
});
|
||||||
return this.video.split('v=')[1].split('&')[0]
|
|
||||||
}
|
|
||||||
else if (this.video.includes('youtu.be')) {
|
|
||||||
return this.video.split('/').last().split('?')[0]
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user