diff options
Diffstat (limited to 'hsm-web/Client/src/CamStream.vue')
| -rw-r--r-- | hsm-web/Client/src/CamStream.vue | 20 |
1 files changed, 11 insertions, 9 deletions
diff --git a/hsm-web/Client/src/CamStream.vue b/hsm-web/Client/src/CamStream.vue index 9c6e202..60cd44d 100644 --- a/hsm-web/Client/src/CamStream.vue +++ b/hsm-web/Client/src/CamStream.vue @@ -3,7 +3,9 @@ <div id='playerCont'> <video id='player' muted></video> </div> - <button @click='toggleStream()' :disabled='disabled'>{{ command }}</button> + <button @click='toggleStream()' :disabled='disabled'> + {{ command }} + </button> </template> <script> @@ -33,7 +35,7 @@ export default { // Continuously checks if WebRTC stream is running on server async monitor() { const res = await axios.get(config.api + '/isStreaming') - + switch (res.status) { case 200: this.command = res.data ? 'Stop' : 'Play' @@ -45,7 +47,7 @@ export default { this.disabled = true this.streaming = false } - + setTimeout(this.monitor, 1000) }, @@ -69,7 +71,7 @@ export default { this.listener = { producerAdded: (producer) => { console.log("Producer added", producer) - + this.session = this.api.createConsumerSession(producer.id) this.session.addEventListener('streamsChanged', () => { if (this.session.streams.length > 0) { @@ -77,19 +79,19 @@ export default { this.player.play() } }) - + this.session.connect() }, - + producerRemoved: (producer) => { console.log("Producer removed", producer) - + this.player.pause() this.player.srcObject = null this.session = null } } - + this.api.registerProducersListener(this.listener) } } @@ -98,7 +100,7 @@ export default { <style> #playerCont { - border: 1px solid black; + background-color: #073642; } #player { aspect-ratio: 32 / 27; |
