Implemented basic stream preview
This commit is contained in:
parent
79f094066e
commit
473fff799d
4 changed files with 86 additions and 24 deletions
36
src/components/paneDisplayComponents/streamDisplay.vue
Normal file
36
src/components/paneDisplayComponents/streamDisplay.vue
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
<template>
|
||||
<div class="streamDisplay">
|
||||
<div class="streamContainer" v-if="$store.state.connected">
|
||||
<img v-bind:src="streamImgUri" alt="Stream">
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Export main app
|
||||
export default {
|
||||
name: 'streanmDisplay',
|
||||
|
||||
computed: {
|
||||
// a computed getter
|
||||
streamImgUri: function () {
|
||||
// `this` points to the vm instance
|
||||
return this.$store.getters.uri + "/stream"
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.streamContainer img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain
|
||||
}
|
||||
|
||||
.streamContainer, .streamDisplay {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
Loading…
Add table
Add a link
Reference in a new issue