<template>
    <v-card
        tile
        flat
        :height="height"
    >
        <iframe 
            :style="{
                width: '100%',
                height: height + 'px',
            }" 
            :src="src"
            allowfullscreen
        >
        </iframe>
    </v-card>
</template>

<script>
    // https://www.youtube.com/embed/tgbNymZ7vqY">
    //https://www.youtube.com/watch?v=C_339sQXq9Y

    export default {
        props: {
            app: {required: true},
            curs: {required: true},
            width: {default: null},
            height: {default: null},

            youtubeSrc: {default: 'https://www.youtube.com/embed/[code]'},
        },

        computed: {
            src() {
                let code =  this.curs.my_url.split('=');
                code = code[code.length - 1]

                return _.replace(this.youtubeSrc, '[code]', code)
            },
        },

        name: 'CursOpenYoutube',
    }
</script>