vue-files-preview-inno/es/packages/preview/supports/video-preview/index.vue2.mjs.map

A tool for previewing files such as doc, excel, pdf, image, markdown, txt, audio, and video and so on.

{"version":3,"file":"index.vue2.mjs","sources":["../../../../../../packages/preview/supports/video-preview/index.vue"],"sourcesContent":["<script lang='ts' setup>\nimport {onBeforeUnmount, onMounted, ref, shallowRef, watch} from 'vue'\nimport type {PreviewProps} from '../../preview.interface'\nimport {getFileRenderByFile, getFileRenderByUrl} from '../../utils/utils'\n\nconst props = withDefaults(\n  defineProps<PreviewProps>(),\n  {\n    url: () => null,\n    file: () => null,\n  },\n)\n\nconst emit = defineEmits<{\n  rendered: []\n  error: [error: Error]\n}>()\n\nconst fileRender = ref(null)\nconst isUrlSource = ref(false)\n\nwatch(\n  () => props.file,\n  (file) => {\n    if (file) {\n      fileRender.value && !isUrlSource.value && URL.revokeObjectURL(fileRender.value)\n      isUrlSource.value = false\n      getFileRenderByFile(file).then((render) => {\n        fileRender.value = render\n        videoPreviewRef.value.src = fileRender.value\n      }).catch((e: Error) => {\n        emit('error', e)\n      })\n    }\n  },\n  {immediate: true},\n)\n\nwatch(\n  () => props.url,\n  (url) => {\n    if (url && !props.file) {\n      fileRender.value && !isUrlSource.value && URL.revokeObjectURL(fileRender.value)\n      isUrlSource.value = true\n      getFileRenderByUrl(url).then((render) => {\n        fileRender.value = render\n        videoPreviewRef.value.src = fileRender.value\n      }).catch((e: Error) => {\n        emit('error', e)\n      })\n    }\n  },\n  {immediate: true},\n)\n\nconst videoPreviewRef = shallowRef(null)\nonMounted(() => {\n  // Listen for video elements loadedmetadata. Event to automatically play the video once it has loaded\n  videoPreviewRef.value.addEventListener('loadedmetadata', () => {\n    videoPreviewRef.value.play()\n    emit('rendered')\n  })\n  videoPreviewRef.value.addEventListener('error', () => {\n    emit('error', new Error('Video load failed'))\n  })\n})\n\nonBeforeUnmount(() => {\n  // When the component is destroyed. Release the video element src\n  videoPreviewRef.value.pause()\n  if (fileRender.value && !isUrlSource.value) {\n    URL.revokeObjectURL(fileRender.value)\n  }\n})\n</script>\n\n<template>\n  <div class=\"video-preview web-full-screen\">\n    <video ref=\"videoPreviewRef\" class=\"player-video-main\" controls autoplay crossorigin=\"anonymous\"/>\n  </div>\n</template>\n\n<style scoped lang='scss'>\n.web-full-screen {\n  z-index: 9999999;\n  position: fixed;\n  left: 0;\n  top: 0;\n  width: 100vw !important;\n  height: 100vh !important;\n  overflow: hidden; /* Hide overflow content. Keep the full screen experience */\n  background: rgba(0, 0, 0, 0.8); /* Background color can improve video contrast */\n  display: flex; /* Use flexbox to the center video */\n  align-items: center; /* Center vertically */\n  justify-content: center; /* Center horizontally */\n}\n\n.player-video-main {\n  width: 100%;\n  height: auto; /* Keep video aspect ratio */\n  max-height: 100%; /* Limit the maximum height to prevent overflow */\n  object-fit: contain; /* Keep aspect ratio. Black edges may appear */\n  transition: .2s;\n}\n\n.player-video-main.video-mirror {\n  transform: rotateY(180deg);\n}\n</style>"],"names":["props","__props","emit","__emit","fileRender","ref","isUrlSource","watch","file","getFileRenderByFile","render","videoPreviewRef","e","url","getFileRenderByUrl","shallowRef","onMounted","onBeforeUnmount","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode"],"mappings":";;;;;;;;;;;AAKA,UAAMA,IAAQC,GAQRC,IAAOC,GAKPC,IAAaC,EAAI,IAAI,GACrBC,IAAcD,EAAI,EAAK;AAE7B,IAAAE;AAAA,MACE,MAAMP,EAAM;AAAA,MACZ,CAACQ,MAAS;AACR,QAAIA,MACFJ,EAAW,SAAS,CAACE,EAAY,SAAS,IAAI,gBAAgBF,EAAW,KAAK,GAC9EE,EAAY,QAAQ,IACpBG,EAAoBD,CAAI,EAAE,KAAK,CAACE,MAAW;AACzC,UAAAN,EAAW,QAAQM,GACnBC,EAAgB,MAAM,MAAMP,EAAW;AAAA,QACzC,CAAC,EAAE,MAAM,CAACQ,MAAa;AACrB,UAAAV,EAAK,SAASU,CAAC;AAAA,QACjB,CAAC;AAAA,MAEL;AAAA,MACA,EAAC,WAAW,GAAA;AAAA,IAAI,GAGlBL;AAAA,MACE,MAAMP,EAAM;AAAA,MACZ,CAACa,MAAQ;AACP,QAAIA,KAAO,CAACb,EAAM,SAChBI,EAAW,SAAS,CAACE,EAAY,SAAS,IAAI,gBAAgBF,EAAW,KAAK,GAC9EE,EAAY,QAAQ,IACpBQ,EAAmBD,CAAG,EAAE,KAAK,CAACH,MAAW;AACvC,UAAAN,EAAW,QAAQM,GACnBC,EAAgB,MAAM,MAAMP,EAAW;AAAA,QACzC,CAAC,EAAE,MAAM,CAACQ,MAAa;AACrB,UAAAV,EAAK,SAASU,CAAC;AAAA,QACjB,CAAC;AAAA,MAEL;AAAA,MACA,EAAC,WAAW,GAAA;AAAA,IAAI;AAGlB,UAAMD,IAAkBI,EAAW,IAAI;AACvC,WAAAC,EAAU,MAAM;AAEd,MAAAL,EAAgB,MAAM,iBAAiB,kBAAkB,MAAM;AAC7D,QAAAA,EAAgB,MAAM,KAAA,GACtBT,EAAK,UAAU;AAAA,MACjB,CAAC,GACDS,EAAgB,MAAM,iBAAiB,SAAS,MAAM;AACpD,QAAAT,EAAK,SAAS,IAAI,MAAM,mBAAmB,CAAC;AAAA,MAC9C,CAAC;AAAA,IACH,CAAC,GAEDe,EAAgB,MAAM;AAEpB,MAAAN,EAAgB,MAAM,MAAA,GAClBP,EAAW,SAAS,CAACE,EAAY,SACnC,IAAI,gBAAgBF,EAAW,KAAK;AAAA,IAExC,CAAC,cAICc,EAAA,GAAAC,EAEM,OAFNC,GAEM;AAAA,MADJC,EAAkG,SAAA;AAAA,iBAAvF;AAAA,QAAJ,KAAIV;AAAA,QAAkB,OAAM;AAAA,QAAoB,UAAA;AAAA,QAAS,UAAA;AAAA,QAAS,aAAY;AAAA,MAAA;;;;"}