<script setup lang="ts">
const runtimeConfig = useRuntimeConfig();
const cdnUrl = runtimeConfig.public.cdn_url;

defineProps<{
  media: { fileName: string | undefined; fileType: string | undefined };
}>();
</script>

<template>
  <div
    class="select-none z-[-1] w-full flex items-center justify-center *:object-contain *:object-contain *:*:object-contain flex-1"
  >
    <div class="w-full *:w-full text-center">
      <img
        :src="cdnUrl + [media.fileName, media.fileType].join('.')"
        alt=""
        v-if="media.fileType == 'jpg'"
      />
      <video v-else-if="media.fileType == 'wmv'" :key="media.fileName" autoplay>
        <source
          :src="cdnUrl + [media.fileName, 'mp4'].join('.')"
          type="video/mp4"
        />
      </video>
      <span v-else class="text-4xl font-bold">Brak mediów</span>
    </div>
  </div>
</template>
