35 lines
1 KiB
Vue
35 lines
1 KiB
Vue
<script setup lang="ts">
|
|
const runtimeConfig = useRuntimeConfig();
|
|
const cdnUrl = runtimeConfig.public.cdn_url;
|
|
|
|
const props = defineProps<{
|
|
media: string | null | undefined;
|
|
}>();
|
|
|
|
const mediaSplit = computed(() => {
|
|
const dotSplit = props.media?.split('.');
|
|
const extension = dotSplit?.pop()?.toLowerCase();
|
|
return [dotSplit?.join('.'), extension];
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
class="select-none z-[-1] flex-1 flex items-stretch w-full justify-center *:object-contain"
|
|
>
|
|
<!-- Reserved for getting to know the question (20s) in basic questions section
|
|
src="~/public/placeholder.svg" -->
|
|
<img
|
|
v-if="mediaSplit[1] === 'jpg'"
|
|
:key="`${media}-photo`"
|
|
:src="cdnUrl + media"
|
|
alt=""
|
|
/>
|
|
<video v-else-if="mediaSplit[1] === 'wmv'" :key="`${media}-video`" autoplay>
|
|
<source :src="cdnUrl + mediaSplit[0] + '.mp4'" type="video/mp4" />
|
|
</video>
|
|
<span v-else class="text-4xl font-bold flex items-center justify-center"
|
|
>Brak mediów</span
|
|
>
|
|
</div>
|
|
</template>
|