Switch to an event-based architecture

This commit is contained in:
Surma
2018-12-17 16:40:29 +00:00
parent bfe74b5fb2
commit 672c57b61f
3 changed files with 94 additions and 23 deletions

View File

@@ -2,14 +2,16 @@ import App from './index';
import { expose } from 'comlink';
const API_VERSION = 1;
export function exposeAPI(app: App) {
self.parent.postMessage('READY', '*');
self.parent.postMessage({ type: 'READY', version: API_VERSION }, '*');
self.addEventListener('message', (ev: MessageEvent) => {
if (ev.data !== 'READY?') {
return;
}
ev.stopPropagation();
self.parent.postMessage('READY', '*');
self.parent.postMessage({ type: 'READY', version: API_VERSION }, '*');
});
expose(new API(app), self.parent);
}
@@ -18,11 +20,13 @@ class API {
constructor(private app: App) { }
async setFile(blob: Blob, name: string) {
await new Promise((resolve) => {
this.app.setState({ file: new File([blob], name) }, resolve);
});
await new Promise((resolve) => {
document.addEventListener('squooshingdone', resolve, { once: true });
return new Promise(async (resolve) => {
document.addEventListener(
'squoosh:processingstart',
() => resolve(),
{ once: true },
);
this.app.openFile(new File([blob], name));
});
}
@@ -30,8 +34,41 @@ class API {
if (!this.app.state.file || !this.app.compressInstance) {
throw new Error('No file has been loaded');
}
if (
!this.app.compressInstance!.state.loading &&
!this.app.compressInstance!.state.sides[side].loading
) {
return this.app.compressInstance!.state.sides[side].file;
}
await this.app.compressInstance.compressionJobs[side];
return this.app.compressInstance.state.sides[side].file;
return new Promise((resolve, reject) => {
document.addEventListener(
'squoosh:processingdone',
(ev) => {
if ((ev as CustomEvent).detail.side !== side) {
return;
}
resolve(this.app.compressInstance!.state.sides[side].file);
},
);
document.addEventListener(
'squoosh:processingabort',
(ev) => {
if ((ev as CustomEvent).detail.side !== side) {
return;
}
reject('aborted');
},
);
document.addEventListener(
'squoosh:processingerroor',
(ev) => {
if ((ev as CustomEvent).detail.side !== side) {
return;
}
reject((ev as CustomEvent).detail.msg);
},
);
});
}
}