diff --git a/src/client/lazy-app/Compress/index.tsx b/src/client/lazy-app/Compress/index.tsx index 5c37caae..193aff6d 100644 --- a/src/client/lazy-app/Compress/index.tsx +++ b/src/client/lazy-app/Compress/index.tsx @@ -114,7 +114,7 @@ async function decodeImage( } } // Otherwise fall through and try built-in decoding for a laugh. - return await builtinDecode(signal, blob, mimeType); + return await builtinDecode(signal, blob); } catch (err) { if (err instanceof Error && err.name === 'AbortError') throw err; console.log(err); diff --git a/src/client/lazy-app/util/canvas.ts b/src/client/lazy-app/util/canvas.ts index 04b88a3d..9986205a 100644 --- a/src/client/lazy-app/util/canvas.ts +++ b/src/client/lazy-app/util/canvas.ts @@ -63,35 +63,17 @@ interface DrawableToImageDataOptions { sh?: number; } -function getWidth( - drawable: ImageBitmap | HTMLImageElement | VideoFrame, -): number { - if ('displayWidth' in drawable) { - return drawable.displayWidth; - } - return drawable.width; -} - -function getHeight( - drawable: ImageBitmap | HTMLImageElement | VideoFrame, -): number { - if ('displayHeight' in drawable) { - return drawable.displayHeight; - } - return drawable.height; -} - export function drawableToImageData( - drawable: ImageBitmap | HTMLImageElement | VideoFrame, + drawable: ImageBitmap | HTMLImageElement, opts: DrawableToImageDataOptions = {}, ): ImageData { const { - width = getWidth(drawable), - height = getHeight(drawable), + width = drawable.width, + height = drawable.height, sx = 0, sy = 0, - sw = getWidth(drawable), - sh = getHeight(drawable), + sw = drawable.width, + sh = drawable.height, } = opts; // Make canvas same size as image diff --git a/src/client/lazy-app/util/index.ts b/src/client/lazy-app/util/index.ts index 89555a5b..fb5caea6 100644 --- a/src/client/lazy-app/util/index.ts +++ b/src/client/lazy-app/util/index.ts @@ -10,8 +10,6 @@ * See the License for the specific language governing permissions and * limitations under the License. */ - -import * as WebCodecs from '../util/web-codecs'; import { drawableToImageData } from './canvas'; /** If render engine is Safari */ @@ -139,15 +137,7 @@ export async function blobToImg(blob: Blob): Promise { export async function builtinDecode( signal: AbortSignal, blob: Blob, - mimeType: string, ): Promise { - // If WebCodecs are supported, use that. - if (await WebCodecs.isTypeSupported(mimeType)) { - assertSignal(signal); - try { - return await abortable(signal, WebCodecs.decode(blob, mimeType)); - } catch (e) {} - } assertSignal(signal); // Prefer createImageBitmap as it's the off-thread option for Firefox. diff --git a/src/client/lazy-app/util/web-codecs/index.ts b/src/client/lazy-app/util/web-codecs/index.ts deleted file mode 100644 index 7f2b1949..00000000 --- a/src/client/lazy-app/util/web-codecs/index.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { drawableToImageData } from '../canvas'; - -const hasImageDecoder = typeof ImageDecoder !== 'undefined'; - -export async function isTypeSupported(mimeType: string): Promise { - if (!hasImageDecoder) return false; - // Some old versions of this API threw here. - // It only impacted folks with experimental web platform flags enabled in Chrome 90. - // The API was updated in Chrome 91. - try { - return await ImageDecoder.isTypeSupported(mimeType); - } catch (err) { - return false; - } -} - -export async function decode( - blob: Blob | File, - mimeType: string, -): Promise { - if (!hasImageDecoder) { - throw Error( - `This browser does not support ImageDecoder. This function should not have been called.`, - ); - } - const decoder = new ImageDecoder({ - type: mimeType, - // Non-obvious way to turn an Blob into a ReadableStream - data: new Response(blob).body!, - }); - const { image } = await decoder.decode(); - return drawableToImageData(image); -} diff --git a/src/client/lazy-app/util/web-codecs/missing-types.d.ts b/src/client/lazy-app/util/web-codecs/missing-types.d.ts deleted file mode 100644 index 6e832db8..00000000 --- a/src/client/lazy-app/util/web-codecs/missing-types.d.ts +++ /dev/null @@ -1,60 +0,0 @@ -interface ImageDecoderInit { - type: string; - data: BufferSource | ReadableStream; - premultiplyAlpha?: PremultiplyAlpha; - colorSpaceConversion?: ColorSpaceConversion; - desiredWidth?: number; - desiredHeight?: number; - preferAnimation?: boolean; -} - -interface ImageDecodeOptions { - frameIndex: number; - completeFramesOnly: boolean; -} - -interface ImageDecodeResult { - image: VideoFrame; - complete: boolean; -} - -// I didn’t do all the types because the class is kinda complex. -// I focused on what we need. -// See https://w3c.github.io/webcodecs/#videoframe -declare class VideoFrame { - displayWidth: number; - displayHeight: number; -} - -// Add VideoFrame to canvas’ drawImage() -interface CanvasDrawImage { - drawImage( - image: CanvasImageSource | VideoFrame, - dx: number, - dy: number, - ): void; - drawImage( - image: CanvasImageSource | VideoFrame, - dx: number, - dy: number, - dw: number, - dh: number, - ): void; - drawImage( - image: CanvasImageSource | VideoFrame, - sx: number, - sy: number, - sw: number, - sh: number, - dx: number, - dy: number, - dw: number, - dh: number, - ): void; -} - -declare class ImageDecoder { - static isTypeSupported(type: string): Promise; - constructor(desc: ImageDecoderInit); - decode(opts?: Partial): Promise; -}