<template>
  <iframe
    data-cy="srf-embed"
    :src="`https://www.srf.ch/play/embed?urn=urn:srf:video:${videoId}&subdivisions=false`"
    class="srf-embed"
    allowfullscreen
    allow="geolocation *; autoplay; encrypted-media"
    frameborder="0"
  />
</template>

<script>
import { getVideoId } from '@/helpers/video';

export default {
  props: ['url'],

  computed: {
    videoId() {
      return getVideoId(this.url);
    },
  },
};
</script>

<style scoped lang="scss">
.srf-embed {
  width: 100%;
  height: 350px;
}
</style>
