fix video position slider & playback crashes
This commit is contained in:
parent
27ad99bf26
commit
8c97483c3e
1 changed files with 9 additions and 3 deletions
|
@ -4,8 +4,8 @@
|
|||
<canvas ref="canvas" id="player-canvas" :height="height" :width="width"></canvas>
|
||||
</div>
|
||||
<div>
|
||||
<label for="posSlider">POS</label>
|
||||
<input type="range" min="0" :max="frames - 1" value="0" class="slider" id="posSlider" v-model="position">
|
||||
<!--suppress HtmlFormInputWithoutLabel -->
|
||||
<input type="range" min="0" :max="frames - 1" value="0" class="slider" v-model.number="position">
|
||||
</div>
|
||||
<button @click="playPause">{{buttonLabel}}</button>
|
||||
</div>
|
||||
|
@ -60,6 +60,9 @@
|
|||
},
|
||||
methods: {
|
||||
playPause: function () {
|
||||
if (this.frames === 0) {
|
||||
return
|
||||
}
|
||||
this.playing = !this.playing
|
||||
if (this.playing) {
|
||||
this.tmp_ctx = this.$refs.canvas.getContext('2d')
|
||||
|
@ -88,7 +91,10 @@
|
|||
this.$render()
|
||||
if (this.position < this.frames) {
|
||||
this.position += 1
|
||||
requestAnimationFrame(this.$render_advance)
|
||||
this.animation_id = requestAnimationFrame(this.$render_advance)
|
||||
} else {
|
||||
this.playPause()
|
||||
this.position = 0
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue