<template>
  <modal
    :hide-header="true"
    :fullscreen="true"
    class="fullscreen-video">
    <iframe
      :src="src"
      width="2000"
      height="1000"
      class="fullscreen-video__embed"
      frameborder="0"
      webkitallowfullscreen
      mozallowfullscreen
      allowfullscreen/>
  </modal>

</template>

<script>
  import Modal from '@/components/Modal';

  export default {
    components: {
      Modal
    },

    computed: {
      vimeoId() {
        return this.$store.state.vimeoId;
      },
      src() {
        return `https://player.vimeo.com/video/${this.vimeoId}`;
      }
    }
  };
</script>

<style scoped lang="scss">
  .fullscreen-video {
    &__embed {
      max-width: 100%;
      width: 100%;
      height: 95vh;
      vertical-align: bottom;
    }
  }
</style>
