skillbox/client/src/components/content-blocks/VideoBlock.vue

52 lines
937 B
Vue

<template>
<div class="video-block">
<youtube-embed
:url="value.url"
v-if="isYoutube"
/>
<vimeo-embed
:url="value.url"
v-if="isVimeo"
/>
<srf-embed
:url="value.url"
v-if="isSrf"
/>
</div>
</template>
<script>
import YoutubeEmbed from '@/components/videos/YoutubeEmbed.vue';
import VimeoEmbed from '@/components/videos/VimeoEmbed.vue';
import SrfEmbed from '@/components/videos/SrfEmbed.vue';
import { isVimeoUrl, isYoutubeUrl, isSrfUrl } from '@/helpers/video';
export default {
props: ['value'],
components: {
YoutubeEmbed,
VimeoEmbed,
SrfEmbed,
},
computed: {
isYoutube() {
return isYoutubeUrl(this.value.url);
},
isVimeo() {
return isVimeoUrl(this.value.url);
},
isSrf() {
return isSrfUrl(this.value.url);
},
},
};
</script>
<style scoped lang="scss">
.video-block {
margin-bottom: 30px;
}
</style>