From d423a7f70d27bfefc69a3a0b204333126e047ca8 Mon Sep 17 00:00:00 2001
From: MarcZierle <online@marczierle.com>
Date: Tue, 25 Jan 2022 14:46:49 +0100
Subject: [PATCH] fix camera size in capture
---
src/views/CameraCapture.vue | 15 ++++++++++-----
1 file changed, 10 insertions(+), 5 deletions(-)
diff --git a/src/views/CameraCapture.vue b/src/views/CameraCapture.vue
index b85a811..a9095c5 100644
--- a/src/views/CameraCapture.vue
+++ b/src/views/CameraCapture.vue
@@ -227,8 +227,12 @@ export default {
this.photo.width = document.getElementById('camera_preview').offsetWidth
this.photo.height = document.getElementById('camera_preview').offsetHeight
- this.$refs.camera.width = this.stream.width
- this.$refs.camera.height = this.stream.height
+ if (this.stream.width > this.stream.height) {
+ this.$refs.camera.width = this.photo.width
+ } else {
+ let ratio = this.photo.height / this.stream.height
+ this.$refs.camera.width = this.stream.width * ratio
+ }
}).catch(error => {
this.message.error('Cannot load device camera! '+error)
})
@@ -319,6 +323,7 @@ html, body {
#camera_preview {
height: 75vh;
+ width: 100%;
}
#group_select {
@@ -330,7 +335,7 @@ html, body {
display: flex;
flex-direction: column;
text-align: center;
- margin-top: 30%;
+ margin-top: 25vh;
}
#prompt_select .n-icon {
@@ -343,11 +348,11 @@ html, body {
display: flex;
justify-content: center;
bottom: 0;
- position: absolute;
+ position: fixed;
width: 100%;
}
#take_photo .n-button {
- margin-top: 30%;
+ margin-top: 5vh;
}
</style>
\ No newline at end of file