format framerate in webcam

Signed-off-by: Stefan Dej <meteyou@gmail.com>
This commit is contained in:
Stefan Dej 2021-03-29 00:26:21 +02:00
parent 8af80463c3
commit 10ab6ec088
2 changed files with 16 additions and 4 deletions

View File

@ -207,7 +207,7 @@ export default {
valid: false,
name: "",
icon: "mdi-webcam",
service: "mjpegstreamer-adaptiv",
service: "mjpegstreamer-adaptive",
targetFps: 15,
url: "/webcam/?action=stream",
flipX: false,

View File

@ -10,7 +10,6 @@
<v-toolbar-title>
<span class="subheading">
<v-icon left>mdi-webcam</v-icon> {{ $t('Panels.WebcamPanel.Webcam')}}
<small v-if="'service' in this.currentCam && this.currentCam.service === 'mjpegstreamer-adaptive' && this.time">( {{ $t('Panels.WebcamPanel.FPS')}}: {{ currentFPS }})</small>
</span>
</v-toolbar-title>
<v-spacer></v-spacer>
@ -34,7 +33,7 @@
</v-toolbar>
<v-card-text class="px-0 py-0 content">
<v-row>
<v-col class="pb-0">
<v-col class="pb-0" style="position: relative;">
<template v-if="'service' in this.currentCam && this.currentCam.service === 'mjpegstreamer'">
<vue-load-image>
<img slot="image" :src="url" alt="Preview" :style="webcamStyle" class="webcamImage" @load="onLoad" />
@ -45,6 +44,19 @@
</div>
</vue-load-image>
</template>
<template v-else-if="'service' in this.currentCam && this.currentCam.service === 'mjpegstreamer-adaptive'">
<img slot="image" :src="url" alt="Preview" :style="webcamStyle" class="webcamImage" @load="onLoad" />
<span
style="
position:absolute;
bottom: 6px;
right: 12px;
background: rgba(0,0,0,0.8);
width: 75px;
padding: 3px 10px;
border-top-left-radius: 5px;
">{{ $t('Panels.WebcamPanel.FPS')}}: {{ currentFPS }}</span>
</template>
<template v-else>
<img slot="image" :src="url" alt="Preview" :style="webcamStyle" class="webcamImage" @load="onLoad" />
</template>
@ -55,7 +67,7 @@
</template>
<script>
import VueLoadImage from "vue-load-image";
import VueLoadImage from "vue-load-image"
export default {
components: {