init

src/components/GamePlayer.vue

@@ -0,0 +1,40 @@
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+
+const emit = defineEmits<{
+  videoReady: [el: HTMLVideoElement]
+}>()
+
+const videoRef = ref<HTMLVideoElement | null>(null)
+
+onMounted(() => {
+  if (videoRef.value) {
+    emit('videoReady', videoRef.value)
+  }
+})
+
+defineExpose({ videoRef })
+</script>
+
+<template>
+  <div class="game-player">
+    <video ref="videoRef" class="player-video" preload="auto"></video>
+  </div>
+</template>
+
+<style scoped>
+.game-player {
+  width: 100%;
+  height: 100%;
+  background: #000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.player-video {
+  max-width: 100%;
+  max-height: 100%;
+  object-fit: contain;
+}
+</style>