2nzi commited on
Commit
3890d0d
·
verified ·
1 Parent(s): b4f9490

update fps

Browse files
src/components/SegmentationSidebar.vue CHANGED
@@ -29,6 +29,25 @@
29
  {{ video.name }}
30
  </div>
31
  </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
32
  </div>
33
  </template>
34
 
@@ -41,7 +60,8 @@ export default {
41
  data() {
42
  const videoStore = useVideoStore()
43
  return {
44
- videoStore
 
45
  }
46
  },
47
 
@@ -96,6 +116,10 @@ export default {
96
  selectVideo(video) {
97
  this.videoStore.setSelectedVideo(video)
98
  this.$emit('video-selected', video)
 
 
 
 
99
  }
100
  }
101
  }
@@ -214,4 +238,43 @@ export default {
214
  .video-item.active {
215
  background: #3a3a3a;
216
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
217
  </style>
 
29
  {{ video.name }}
30
  </div>
31
  </div>
32
+
33
+ <!-- Sélecteur de FPS -->
34
+ <div class="fps-selector">
35
+ <select
36
+ id="fps-select"
37
+ v-model="selectedFps"
38
+ @change="updateFps"
39
+ class="fps-select"
40
+ >
41
+ <option value="15">15 FPS</option>
42
+ <option value="24">24 FPS</option>
43
+ <option value="25">25 FPS</option>
44
+ <option value="30">30 FPS</option>
45
+ <option value="50">50 FPS</option>
46
+ <option value="60">60 FPS</option>
47
+ <option value="120">120 FPS</option>
48
+ </select>
49
+ </div>
50
+
51
  </div>
52
  </template>
53
 
 
60
  data() {
61
  const videoStore = useVideoStore()
62
  return {
63
+ videoStore,
64
+ selectedFps: videoStore.fps || 25 // Utiliser la valeur du store ou 25 par défaut
65
  }
66
  },
67
 
 
116
  selectVideo(video) {
117
  this.videoStore.setSelectedVideo(video)
118
  this.$emit('video-selected', video)
119
+ },
120
+
121
+ updateFps() {
122
+ this.videoStore.setFps(parseInt(this.selectedFps))
123
  }
124
  }
125
  }
 
238
  .video-item.active {
239
  background: #3a3a3a;
240
  }
241
+
242
+ .fps-selector {
243
+ display: flex;
244
+ flex-direction: column;
245
+ gap: 8px;
246
+ padding: 12px;
247
+ border-radius: 8px;
248
+ }
249
+
250
+ .fps-label {
251
+ color: white;
252
+ font-size: 0.9rem;
253
+ font-weight: 500;
254
+ }
255
+
256
+ .fps-select {
257
+ background: #363636;
258
+ border: 1px solid #555;
259
+ border-radius: 4px;
260
+ color: white;
261
+ padding: 8px;
262
+ font-size: 0.9rem;
263
+ cursor: pointer;
264
+ transition: border-color 0.2s ease;
265
+ }
266
+
267
+ .fps-select:hover {
268
+ border-color: #777;
269
+ }
270
+
271
+ .fps-select:focus {
272
+ outline: none;
273
+ border-color: #4CAF50;
274
+ }
275
+
276
+ .fps-select option {
277
+ background: #363636;
278
+ color: white;
279
+ }
280
  </style>
src/components/TimelineSection.vue CHANGED
@@ -92,6 +92,9 @@ export default {
92
  },
93
 
94
  mounted() {
 
 
 
95
  // Ajouter un écouteur d'événement pour les touches Entrée et Espace
96
  this.keyboardListener = (event) => {
97
  if (event.key === ' ' || event.code === 'Space') {
@@ -128,6 +131,29 @@ export default {
128
  }
129
  },
130
  immediate: true
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
131
  }
132
  },
133
 
@@ -140,7 +166,8 @@ export default {
140
  // Mettre à jour les propriétés locales
141
  this.duration = duration
142
  this.videoElement = videoElement
143
- this.frameRate = frameRate || 30 // Utiliser 30 fps par défaut si non spécifié
 
144
 
145
  // Mettre à jour le frameRate dans le store d'annotation
146
  if (this.annotationStore.currentSession) {
 
92
  },
93
 
94
  mounted() {
95
+ // Synchroniser le frameRate avec le store au démarrage
96
+ this.frameRate = this.videoStore.fps || 25
97
+
98
  // Ajouter un écouteur d'événement pour les touches Entrée et Espace
99
  this.keyboardListener = (event) => {
100
  if (event.key === ' ' || event.code === 'Space') {
 
131
  }
132
  },
133
  immediate: true
134
+ },
135
+
136
+ // Watcher pour les changements de FPS
137
+ 'videoStore.fps': {
138
+ handler(newFps) {
139
+ if (newFps && newFps !== this.frameRate) {
140
+ console.log('FPS changé de', this.frameRate, 'à', newFps)
141
+
142
+ // Mettre à jour le frameRate
143
+ this.frameRate = newFps
144
+
145
+ // Recalculer la frame actuelle basée sur le nouveau FPS
146
+ this.currentFrame = this.getCurrentFrame()
147
+
148
+ // Mettre à jour le frameRate dans le store d'annotation
149
+ if (this.annotationStore.currentSession) {
150
+ this.annotationStore.currentSession.frameRate = this.frameRate
151
+ }
152
+
153
+ console.log('Frame actuelle après changement de FPS:', this.currentFrame)
154
+ }
155
+ },
156
+ immediate: true
157
  }
158
  },
159
 
 
166
  // Mettre à jour les propriétés locales
167
  this.duration = duration
168
  this.videoElement = videoElement
169
+ // Utiliser le FPS du store plutôt que celui détecté de la vidéo
170
+ this.frameRate = this.videoStore.fps || frameRate || 25
171
 
172
  // Mettre à jour le frameRate dans le store d'annotation
173
  if (this.annotationStore.currentSession) {