feat: update demos

fudan-generative-vision · Dec 9, 2024 · 39382bf · 39382bf
1 parent 8683ff6
commit 39382bf
Show file tree

Hide file tree

Showing 3 changed files with 560 additions and 104 deletions.
diff --git a/src/components/AbstractSection.vue b/src/components/AbstractSection.vue
@@ -1,7 +1,7 @@
 <template>
     <section class="abstract">
         <div>
-            <h3>Abstract</h3>
+            <h3>{{ title }}</h3>
             <div v-if="figure" class="figure">
                 <img :src="figure">
             </div>
@@ -15,11 +15,13 @@
 
 <script setup lang="ts">
 interface Props {
+    title?: string
     content?: string
     figure?: string
     video?: string
 }
 const { props } = defineProps<{ props: Props }>()
+const title = props.title || "Abstract"
 const figure = (props.figure || "").startsWith("assets") ? new URL(`../${props.figure}`, import.meta.url).href : props.figure
 const video = (props.video || "").startsWith("assets") ? new URL(`../${props.video}`, import.meta.url).href : props.video
 

diff --git a/src/components/VideoCarousel.vue b/src/components/VideoCarousel.vue
@@ -14,15 +14,17 @@
                         <div v-for="(video, vi) in videos" :key="vi"
                             :style="{ width: `${100 / videos.length - 1}%`, 'margin-right': `1%`, 'position': 'relative' }"
                             @mouseenter.capture.stop="hideCaption" @mouseleave.capture.stop="showCaption">
-                            <div v-if="captions[vi]" class="caption">
+                            <div v-if="captions[(i * count) + vi]" class="caption">
                                 <span>
-                                    {{ captions[vi] }}
+                                    {{ captions[(i * count) + vi] }}
                                 </span>
                             </div>
-                            <video :ref="(el: any) => videos[i + vi] = el" :muted="Boolean(captions[vi])"
-                                :style="{ 'cursor': 'pointer' }" :loop="Boolean(captions[vi])"
-                                :autoplay="Boolean(captions[vi])" :controls="!Boolean(captions[vi])" :src="video"
-                                preload="metadata" @click="(evt) => showFeature(vi, evt)"></video>
+                            <video :ref="(el: any) => videos[(i * count) + vi] = el"
+                                :muted="Boolean(captions[(i * count) + vi])" :style="{ 'cursor': 'pointer' }"
+                                :loop="Boolean(captions[(i * count) + vi])"
+                                :autoplay="Boolean(captions[(i * count) + vi])"
+                                :controls="!Boolean(captions[(i * count) + vi])" :src="video" preload="metadata"
+                                @click="(evt) => showFeature((i * count) + vi, evt)"></video>
                         </div>
                     </div>
                 </div>
@@ -170,6 +172,7 @@ section {
 .video-group {
     .caption {
         @apply w-full h-full px-1 text-white;
+        opacity: 0.5;
         white-space: pre-line;
         word-break: break-word;
         text-overflow: ellipsis;