feat(playground): handle videos

diff --git a/packages/playground/src/views/NasaPOD.vue b/packages/playground/src/views/NasaPOD.vue
index 22dd5a779be80552134035436003ca3af195ab45..9351979971c6a8c2debc47e9cc9b8da3daf2f04d 100644 (file)
--- a/packages/playground/src/views/NasaPOD.vue
+++ b/packages/playground/src/views/NasaPOD.vue
@@ -23,7 +23,18 @@
       <h3 class="mb-4 text-center">{{ image.title }}</h3>
 
       <figure class="mb-0">
+        <iframe
+          v-if="image.url.includes('youtube.com')"
+          width="560"
+          height="315"
+          :key="image.url"
+          :src="image.url"
+          frameborder="0"
+          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+          allowfullscreen
+        ></iframe>
         <img
+          v-else
           class="max-w-full m-auto max-h-[75vh]"
           :src="image.url"
           :key="image.url"

diff --git a/packages/playground/vite.config.ts b/packages/playground/vite.config.ts
index 05ea1eefb765bd5c26733d4b0b5146aae1529b4a..456e8764f598839621adaf563c2f2c89a2ab69da 100644 (file)
--- a/packages/playground/vite.config.ts
+++ b/packages/playground/vite.config.ts
@@ -1,10 +1,8 @@
 import { defineConfig, Plugin } from 'vite'
 import vue from '@vitejs/plugin-vue'
-import _fs from 'fs'
+import { promises as fs } from 'fs'
 import path from 'path'
 
-const fs = _fs.promises
-
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [vue(), copyPiniaPlugin()],