From 25a6e06aeba96281f6cdf3160a8ddb7f352cf189 Mon Sep 17 00:00:00 2001 From: Artem L Date: Thu, 11 Mar 2021 21:08:25 +0200 Subject: [PATCH 1/3] Improving Accessibility (44%>77%) --- components/UI/Footer.vue | 9 +++++---- layouts/default.vue | 2 +- 2 files changed, 6 insertions(+), 5 deletions(-) diff --git a/components/UI/Footer.vue b/components/UI/Footer.vue index d99e0fd..ad46e17 100644 --- a/components/UI/Footer.vue +++ b/components/UI/Footer.vue @@ -17,14 +17,15 @@ Enjoy your word cards! - Developed by Artu + Developed by + Artu
Powered by
 diff --git a/layouts/default.vue b/layouts/default.vue index d94e39b..2ff1e04 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -33,7 +33,7 @@ - + mdi-{{ `chevron-${miniVariant ? 'right' : 'left'}` }}

From 008968abffd57cbf4e018e89e8bbfe57165d0a3d Mon Sep 17 00:00:00 2001 From: Artem L Date: Fri, 12 Mar 2021 22:57:35 +0200 Subject: [PATCH 2/3] Resize an uploaded image --- package-lock.json | 38 ++++++++++++++++++++++++++++++++++++++ package.json | 1 + plugins/api-helpers.js | 26 ++++++++++++++++++-------- 3 files changed, 57 insertions(+), 8 deletions(-) diff --git a/package-lock.json b/package-lock.json index cbc7143..e359220 100644 --- a/package-lock.json +++ b/package-lock.json @@ -7617,6 +7617,11 @@ "integrity": "sha1-L0SUrIkZ43Z8XLtpHp9GMyQoXUM=", "dev": true }, + "glur": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/glur/-/glur-1.1.2.tgz", + "integrity": "sha1-8g6jbbEDv8KSNDkh8fkeg8NGdok=" + }, "gonzales-pe": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/gonzales-pe/-/gonzales-pe-4.3.0.tgz", @@ -8288,6 +8293,14 @@ "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.8.tgz", "integrity": "sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw==" }, + "image-blob-reduce": { + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/image-blob-reduce/-/image-blob-reduce-2.2.2.tgz", + "integrity": "sha512-4pfusXGLRfMyASVr/nvHxHoYDcB+VbfYnOrLdK2VWO56yhkLvSP9l2HXwYIJUFBw4bPqQoZPWFm7rz01lgaOgA==", + "requires": { + "pica": "^6.1.1" + } + }, "import-cwd": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/import-cwd/-/import-cwd-2.1.0.tgz", @@ -9657,6 +9670,15 @@ "integrity": "sha512-0ZIR9PasPxGXmRsEF8jsDzndzHDj7tIav+JUmvIFB/WHswliFnquxECT/De7GR4yg99ky/NlRKJT82G1y271bw==", "dev": true }, + "multimath": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/multimath/-/multimath-2.0.0.tgz", + "integrity": "sha512-toRx66cAMJ+Ccz7pMIg38xSIrtnbozk0dchXezwQDMgQmbGpfxjtv68H+L00iFL8hxDaVjrmwAFSb3I6bg8Q2g==", + "requires": { + "glur": "^1.1.2", + "object-assign": "^4.1.1" + } + }, "mustache": { "version": "2.3.2", "resolved": "https://registry.npmjs.org/mustache/-/mustache-2.3.2.tgz", @@ -10316,6 +10338,17 @@ "sha.js": "^2.4.8" } }, + "pica": { + "version": "6.1.1", + "resolved": "https://registry.npmjs.org/pica/-/pica-6.1.1.tgz", + "integrity": "sha512-dmjQheDGFOl+30rQhN3NM3MyDNjeOZvco6IL3ZVYgyVDmhgvcSCGOAsydRCIaZ36mcXO7ci0XFeD+h6unEcBvA==", + "requires": { + "inherits": "^2.0.3", + "multimath": "^2.0.0", + "object-assign": "^4.1.1", + "webworkify": "^1.5.0" + } + }, "picomatch": { "version": "2.2.2", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz", @@ -14851,6 +14884,11 @@ "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz", "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==" }, + "webworkify": { + "version": "1.5.0", + "resolved": "https://registry.npmjs.org/webworkify/-/webworkify-1.5.0.tgz", + "integrity": "sha512-AMcUeyXAhbACL8S2hqqdqOLqvJ8ylmIbNwUIqQujRSouf4+eUFaXbG6F1Rbu+srlJMmxQWsiU7mOJi0nMBfM1g==" + }, "whatwg-fetch": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz", diff --git a/package.json b/package.json index 320ed9f..081720b 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "core-js": "^3.8.3", "express": "^4.17.1", "firebase": "^8.2.7", + "image-blob-reduce": "^2.2.2", "js-cookie": "^2.2.1", "lodash.orderby": "^4.6.0", "nuxt": "^2.14.12", diff --git a/plugins/api-helpers.js b/plugins/api-helpers.js index afc8551..1cf2224 100644 --- a/plugins/api-helpers.js +++ b/plugins/api-helpers.js @@ -4,7 +4,10 @@ */ import { authenticate } from 'pixabay-api' + +import imageBlobReduce from 'image-blob-reduce' const { searchImages } = authenticate(process.env.pixabayKey) +const reduce = imageBlobReduce() const fakeRequestPromise = (delay = 1000) => { return new Promise((resolve, reject) => { @@ -119,7 +122,7 @@ function getStorageDirName() { else return 'demo' } -// ToDo: Resize an uploaded image +// ToDo: Improve readability and error handling function uploadURLToStorage(url) { const that = this const dirName = getStorageDirName.call(this) @@ -127,14 +130,21 @@ function uploadURLToStorage(url) { return new Promise(function (resolve, reject) { getFileBlob(url, (blob) => { try { - const path = `${dirName}/${fileName}` - const storageRef = that.$fire.storage.ref().child(path) - storageRef.put(blob).then(function (snapshot) { - storageRef.getDownloadURL().then(function (url) { - const res = { imagePath: path, url } - resolve(res) + reduce + .toBlob(blob, { max: 400 }) + .then((blob) => { + return blob + }) + .then((blobResized) => { + const path = `${dirName}/${fileName}` + const storageRef = that.$fire.storage.ref().child(path) + storageRef.put(blobResized).then(function (snapshot) { + storageRef.getDownloadURL().then(function (url) { + const res = { imagePath: path, url } + resolve(res) + }) + }) }) - }) } catch (e) { alert(e.message) } From 2acca7692fc67ae17444c818b668430b94444f73 Mon Sep 17 00:00:00 2001 From: Artem L Date: Sat, 13 Mar 2021 00:23:30 +0200 Subject: [PATCH 3/3] Adding a hint to ImageUpload.vue --- components/UI/ImageUpload.vue | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/components/UI/ImageUpload.vue b/components/UI/ImageUpload.vue index bf8c5c1..2f49b93 100644 --- a/components/UI/ImageUpload.vue +++ b/components/UI/ImageUpload.vue @@ -1,6 +1,6 @@