From 73afb2fa898b1f235cdc33e09f0abb375c08cf22 Mon Sep 17 00:00:00 2001 From: David Huggins-Daines Date: Tue, 7 Feb 2023 08:56:15 -0500 Subject: [PATCH 1/2] build: add image-conversion package --- package-lock.json | 12 ++++++++++++ packages/studio-web/package.json | 5 +++-- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index d773d923..70927a31 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19180,6 +19180,11 @@ "node": ">=10" } }, + "node_modules/image-conversion": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/image-conversion/-/image-conversion-2.1.1.tgz", + "integrity": "sha512-hnMOmP7q2jxA+52FZ+wHNhg3fdFRlgfngsQH2JQHEQkafY7tj/8F15e6Rv/RxDegc872jvyaRHwMbkTZK1Cjbg==" + }, "node_modules/image-size": { "version": "0.5.5", "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz", @@ -32708,6 +32713,7 @@ "@angular/router": "~15.1.2", "@types/emscripten": "^1.39.6", "bootstrap": "^5.2.3", + "image-conversion": "^2.1.1", "ngx-toastr": "^16.0.2", "rxjs": "~7.5.0", "shepherd.js": "^11.0.1", @@ -49872,6 +49878,11 @@ } } }, + "image-conversion": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/image-conversion/-/image-conversion-2.1.1.tgz", + "integrity": "sha512-hnMOmP7q2jxA+52FZ+wHNhg3fdFRlgfngsQH2JQHEQkafY7tj/8F15e6Rv/RxDegc872jvyaRHwMbkTZK1Cjbg==" + }, "image-size": { "version": "0.5.5", "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz", @@ -56926,6 +56937,7 @@ "@types/emscripten": "^1.39.6", "@types/jasmine": "~4.0.0", "bootstrap": "^5.2.3", + "image-conversion": "*", "jasmine-core": "~4.1.0", "karma": "~6.3.0", "karma-chrome-launcher": "~3.1.0", diff --git a/packages/studio-web/package.json b/packages/studio-web/package.json index 2b9fcaec..9e5550b2 100644 --- a/packages/studio-web/package.json +++ b/packages/studio-web/package.json @@ -18,9 +18,9 @@ }, "private": true, "devDependencies": { - "@angular-devkit/core": "~15.1.4", - "@angular-devkit/build-angular": "~15.1.4", "@angular-builders/custom-webpack": "~15.0.0", + "@angular-devkit/build-angular": "~15.1.4", + "@angular-devkit/core": "~15.1.4", "@angular/cli": "~15.1.0", "@angular/compiler-cli": "~15.1.1", "@angular/localize": "~15.1.1", @@ -48,6 +48,7 @@ "@angular/router": "~15.1.2", "@types/emscripten": "^1.39.6", "bootstrap": "^5.2.3", + "image-conversion": "^2.1.1", "ngx-toastr": "^16.0.2", "rxjs": "~7.5.0", "shepherd.js": "^11.0.1", From 5938f831435ab1922b35dc1d633ae0a9407f0324 Mon Sep 17 00:00:00 2001 From: David Huggins-Daines Date: Tue, 7 Feb 2023 08:56:59 -0500 Subject: [PATCH 2/2] feat: compress images by default --- packages/studio-web/src/app/demo/demo.component.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/studio-web/src/app/demo/demo.component.ts b/packages/studio-web/src/app/demo/demo.component.ts index 9ff3a7db..8ec94c6f 100644 --- a/packages/studio-web/src/app/demo/demo.component.ts +++ b/packages/studio-web/src/app/demo/demo.component.ts @@ -6,6 +6,8 @@ import { Components } from "@readalongs/web-component/loader"; import { B64Service } from "../b64.service"; +import { compress } from "image-conversion"; + @Component({ selector: "app-demo", templateUrl: "./demo.component.html", @@ -45,6 +47,7 @@ export class DemoComponent implements OnInit { let graphic = doc.createElement("graphic"); // @ts-ignore let blob = await fetch(img).then((r) => r.blob()); + blob = await compress(blob, 0.75); let b64 = await this.b64Service.blobToB64(blob); // @ts-ignore graphic.setAttribute("url", b64);