Add props parameter aspectRatio

README.md

@@ -116,5 +116,15 @@ default:
 }
 ```
 
+### aspectRatio: Object {min: Number, max: Number}
 
+Set aspect ratio. it affects <video> aspect ratio.
 
+default:
+
+```js
+{
+  min: 1,
+  max: 2,
+}
+```

examples/src/App.vue

@@ -1,6 +1,12 @@
 <template>
   <div>
-    <v-quagga :onDetected="logIt" :readerSize="readerSize" :readerType="'ean_reader'"></v-quagga>
+    <h1>Barcode Reader</h1>
+    <v-quagga
+      :onDetected="logIt"
+      :readerSize="readerSize"
+      :readerType="'ean_reader'"
+      :aspectRatio="aspectRatio"
+    ></v-quagga>
   </div>
 </template>
 
@@ -13,6 +19,7 @@
           width: 640,
           height: 480
         },
+        aspectRatio: { min: 1, max: 2 },
         detecteds: []
       }
     },

package.json

@@ -3,7 +3,7 @@
   "description": "A Vue.js component, accessing the device camera and allowing users to read barcodes, within the browser",
   "main": "dist/vue-quagga.js",
   "module": "src/index.js",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "author": "Shintaro Tanaka <genaxy@gmail.com>",
   "license": "MIT",
   "scripts": {

src/Scanner.vue

@@ -74,6 +74,14 @@ export default {
       validator: o =>
         typeof o.width === 'number' && typeof o.height === 'number',
     },
+    aspectRatio: {
+      type: Object,
+      default: () => ({
+        min: 1,
+        max: 2,
+      }),
+      validator: o => typeof o.min === 'number' && typeof o.max === 'number',
+    },
   },
   data: function() {
     return {
@@ -103,7 +111,7 @@ export default {
   mounted: function() {
     Quagga.init(this.quaggaState, function(err) {
       if (err) {
-        return console.log(err);
+        return console.error(err);
       }
       Quagga.start();
     });