thm/slitscan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix video position slider & playback crashes

Browse source
This commit is contained in:
Tomáš Mládek 2018-01-25 11:43:14 +01:00 committed by Tomáš Mládek
parent 27ad99bf26
commit 8c97483c3e
1 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/components/Player.vue
View file

@ -4,8 +4,8 @@
<canvas ref="canvas" id="player-canvas" :height="height" :width="width"></canvas> <canvas ref="canvas" id="player-canvas" :height="height" :width="width"></canvas>
</div> </div>
<div> <div>
<label for="posSlider">POS</label> <!--suppress HtmlFormInputWithoutLabel -->
<input type="range" min="0" :max="frames - 1" value="0" class="slider" id="posSlider" v-model="position"> <input type="range" min="0" :max="frames - 1" value="0" class="slider" v-model.number="position">
</div> </div>
<button @click="playPause">{{buttonLabel}}</button> <button @click="playPause">{{buttonLabel}}</button>
</div> </div>
@ -60,6 +60,9 @@
}, },
methods: { methods: {
playPause: function () { playPause: function () {
if (this.frames === 0) {
return
}
this.playing = !this.playing this.playing = !this.playing
if (this.playing) { if (this.playing) {
this.tmp_ctx = this.$refs.canvas.getContext('2d') this.tmp_ctx = this.$refs.canvas.getContext('2d')
@ -88,7 +91,10 @@
this.$render() this.$render()
if (this.position < this.frames) { if (this.position < this.frames) {
this.position += 1 this.position += 1
requestAnimationFrame(this.$render_advance) this.animation_id = requestAnimationFrame(this.$render_advance)
} else {
this.playPause()
this.position = 0
} }
} }
} }