LIL-588 При создании курса висит браузер из-за загрузки больших фотографий

web/package.json

@@ -34,9 +34,13 @@
     "webpack": "^3.10.0"
   },
   "dependencies": {
+    "autosize": "^4.0.2",
+    "autosize-input": "^1.0.2",
     "axios": "^0.17.1",
     "babel-polyfill": "^6.26.0",
     "baguettebox.js": "^1.10.0",
+    "downscale": "^1.0.4",
+    "glob": "^7.1.2",
     "history": "^4.7.2",
     "ilyabirman-likely": "^2.3.0",
     "inputmask": "^3.3.11",

web/src/components/blocks/Image.vue

@@ -10,6 +10,7 @@
 
 <script>
     import {api} from "../../js/modules/api";
+    import downscale from 'downscale';
 
     export default {
         name: "lil-image",
@@ -25,16 +26,18 @@
                 let file = event.target.files[0];
                 let reader = new FileReader();
                 reader.onload = () => {
-                    api.uploadImage(reader.result, this.accessToken)
-                        .then((response) => {
-                            this.loading = false;
-                            this.$emit('update:imageId', response.data.id);
-                            this.$emit('update:imageUrl', response.data.image);
-                        })
-                        .catch((error) => {
-                            this.loading = false;
-                            console.log('error', error);
-                        });
+                    downscale(reader.result, 2000, 2000).then((dataURL) => {
+                        api.uploadImage(dataURL, this.accessToken)
+                            .then((response) => {
+                                this.loading = false;
+                                this.$emit('update:imageId', response.data.id);
+                                this.$emit('update:imageUrl', response.data.image);
+                            })
+                            .catch((error) => {
+                                this.loading = false;
+                                console.log('error', error);
+                            });
+                    });
                 };
                 if (file) {
                     reader.readAsDataURL(file);
@@ -51,4 +54,4 @@
     display: block;
     object-fit: contain;
   }
-</style>
+</style>