external-repos/squoosh
1
0
Fork 1
mirror of https://github.com/GoogleChromeLabs/squoosh.git synced 2025-11-14 09:39:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Remove raceyness of getter API

Browse Source
This commit is contained in:
Surma
2018-11-28 19:17:39 +00:00
parent 9a230adc03
commit 853b305465
3 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
lul/index.html
View File

@@ -12,13 +12,12 @@ const squoosh = Comlink.proxy(ifr.contentWindow);
async function load() { async function load() {
const blob = await fetch("/profile.jpg").then(resp => resp.blob()); const blob = await fetch("/profile.jpg").then(resp => resp.blob());
await squoosh.setFile(blob); await squoosh.setFile(blob);
console.log('done') extract();
} }
document.all.load.onclick = load; document.all.load.onclick = load;
async function extract() { async function extract() {
const file = await squoosh.getBlob(1); const file = await squoosh.getBlob(1);
console.log('asdf', file)
const url = URL.createObjectURL(file); const url = URL.createObjectURL(file);
const img = document.createElement('img'); const img = document.createElement('img');
img.src = url; img.src = url;

4
src/components/App/index.tsx
View File

@@ -108,12 +108,16 @@ export default class App extends Component<Props, State> {
private exposeAPI() { private exposeAPI() {
const api = { const api = {
setFile: (blob: Blob, name: string) => { setFile: (blob: Blob, name: string) => {
return new Promise((resolve) => {
this.setState({ file: new File([blob], name) }); this.setState({ file: new File([blob], name) });
document.addEventListener('squooshingdone', () => resolve(), { once: true });
});
}, },
getBlob: async (side: 0 | 1) => { getBlob: async (side: 0 | 1) => {
if (!this.state.file || !this.compressInstance) { if (!this.state.file || !this.compressInstance) {
throw new Error('No file has been loaded'); throw new Error('No file has been loaded');
} }
await this.compressInstance.compressionJobs[side];
return this.compressInstance.state.images[side].file; return this.compressInstance.state.images[side].file;
}, },
}; };

7
src/components/compress/index.tsx
View File

@@ -205,6 +205,7 @@ const originalDocumentTitle = document.title;
export default class Compress extends Component<Props, State> { export default class Compress extends Component<Props, State> {
widthQuery = window.matchMedia('(max-width: 599px)'); widthQuery = window.matchMedia('(max-width: 599px)');
compressionJobs: [Promise<void>, Promise<void>] = [Promise.resolve(), Promise.resolve()];
state: State = { state: State = {
source: undefined, source: undefined,
@@ -305,7 +306,7 @@ export default class Compress extends Component<Props, State> {
// The image only needs updated if the encoder/preprocessor settings have changed, or the // The image only needs updated if the encoder/preprocessor settings have changed, or the
// source has changed. // source has changed.
if (sourceDataChanged || encoderChanged || preprocessorChanged) { if (sourceDataChanged || encoderChanged || preprocessorChanged) {
this.queueUpdateImage(i, { this.compressionJobs[i] = this.updateImage(i, {
skipPreprocessing: !sourceDataChanged && !preprocessorChanged, skipPreprocessing: !sourceDataChanged && !preprocessorChanged,
}); });
} }
@@ -489,7 +490,9 @@ export default class Compress extends Component<Props, State> {
loading: true, loading: true,
}); });
this.setState({ sides }); this.setState({ sides }, () => this.base!.dispatchEvent(
new CustomEvent('squooshingdone', { bubbles: true }),
));
const side = sides[index]; const side = sides[index];
const settings = side.latestSettings; const settings = side.latestSettings;