@loaders.gl/images 3.4.0-alpha.1 → 3.4.0-alpha.2

package/dist/esm/lib/category-api/parse-isobmff-binary.js

@@ -0,0 +1,45 @@
+
+
+export function getISOBMFFMediaType(buffer) {
+  if (!checkString(buffer, 'ftyp', 4)) {
+    return null;
+  }
+
+  if ((buffer[8] & 0x60) === 0x00) {
+    return null;
+  }
+
+  return decodeMajorBrand(buffer);
+}
+
+export function decodeMajorBrand(buffer) {
+  const brandMajor = getUTF8String(buffer, 8, 12).replace('\0', ' ').trim();
+  switch (brandMajor) {
+    case 'avif':
+    case 'avis':
+      return {
+        extension: 'avif',
+        mimeType: 'image/avif'
+      };
+    default:
+      return null;
+  }
+}
+
+function getUTF8String(array, start, end) {
+  return String.fromCharCode(...array.slice(start, end));
+}
+function stringToBytes(string) {
+  return [...string].map(character => character.charCodeAt(0));
+}
+function checkString(buffer, header) {
+  let offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  const headerBytes = stringToBytes(header);
+  for (let i = 0; i < headerBytes.length; ++i) {
+    if (headerBytes[i] !== buffer[i + offset]) {
+      return false;
+    }
+  }
+  return true;
+}
+//# sourceMappingURL=parse-isobmff-binary.js.map

package/dist/esm/lib/category-api/parse-isobmff-binary.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"parse-isobmff-binary.js","names":["getISOBMFFMediaType","buffer","checkString","decodeMajorBrand","brandMajor","getUTF8String","replace","trim","extension","mimeType","array","start","end","String","fromCharCode","slice","stringToBytes","string","map","character","charCodeAt","header","offset","headerBytes","i","length"],"sources":["../../../../src/lib/category-api/parse-isobmff-binary.ts"],"sourcesContent":["// loaders.gl, MIT license\n// code adapted from https://github.com/sindresorhus/file-type under MIT license\n\n/**\n * Box is a container format that can contain a variety of media related files,\n * so we want to return information about which type of file is actually contained inside\n */\nexport type BoxFileType = {extension: string; mimeType: string};\n\n/**\n * Tests if a buffer is in ISO base media file format (ISOBMFF) @see https://en.wikipedia.org/wiki/ISO_base_media_file_format\n * (ISOBMFF is a media container standard based on the Apple QuickTime container format)\n */\nexport function getISOBMFFMediaType(buffer: Uint8Array): BoxFileType | null {\n  // Almost all ISO base media files start with `ftyp` box. (It's not required to be first, but it's recommended to be.)\n  if (!checkString(buffer, 'ftyp', 4)) {\n    return null;\n  }\n\n  // Extra check: test for 8859-1 printable characters (for simplicity, it's a mask which also catches one non-printable character).\n  if ((buffer[8] & 0x60) === 0x00) {\n    return null;\n  }\n\n  // `ftyp` box must contain a brand major identifier, which must consist of ISO 8859-1 printable characters.\n  return decodeMajorBrand(buffer);\n}\n\n/**\n * brands explained @see https://github.com/strukturag/libheif/issues/83\n * code adapted from @see https://github.com/sindresorhus/file-type/blob/main/core.js#L489-L492\n */\nexport function decodeMajorBrand(buffer: Uint8Array): BoxFileType | null {\n  const brandMajor = getUTF8String(buffer, 8, 12).replace('\\0', ' ').trim();\n\n  switch (brandMajor) {\n    case 'avif':\n    case 'avis':\n      return {extension: 'avif', mimeType: 'image/avif'};\n    default:\n      return null;\n  }\n  // We don't need these now, but they are easy to add\n  // case 'mif1':\n  //   return {extension: 'heic', mimeType: 'image/heif'};\n  // case 'msf1':\n  //   return {extension: 'heic', mimeType: 'image/heif-sequence'};\n  // case 'heic':\n  // case 'heix':\n  //   return {extension: 'heic', mimeType: 'image/heic'};\n  // case 'hevc':\n  // case 'hevx':\n  //   return {extension: 'heic', mimeType: 'image/heic-sequence'};\n  // case 'qt':\n  //   return {ext: 'mov', mime: 'video/quicktime'};\n  // case 'M4V':\n  // case 'M4VH':\n  // case 'M4VP':\n  //   return {ext: 'm4v', mime: 'video/x-m4v'};\n  // case 'M4P':\n  //   return {ext: 'm4p', mime: 'video/mp4'};\n  // case 'M4B':\n  //   return {ext: 'm4b', mime: 'audio/mp4'};\n  // case 'M4A':\n  //   return {ext: 'm4a', mime: 'audio/x-m4a'};\n  // case 'F4V':\n  //   return {ext: 'f4v', mime: 'video/mp4'};\n  // case 'F4P':\n  //   return {ext: 'f4p', mime: 'video/mp4'};\n  // case 'F4A':\n  //   return {ext: 'f4a', mime: 'audio/mp4'};\n  // case 'F4B':\n  //   return {ext: 'f4b', mime: 'audio/mp4'};\n  // case 'crx':\n  //   return {ext: 'cr3', mime: 'image/x-canon-cr3'};\n  // default:\n  // if (brandMajor.startsWith('3g')) {\n  //   if (brandMajor.startsWith('3g2')) {\n  //     return {ext: '3g2', mime: 'video/3gpp2'};\n  //   }\n  //   return {ext: '3gp', mime: 'video/3gpp'};\n  // }\n  // return {ext: 'mp4', mime: 'video/mp4'};\n}\n\n/** Interpret a chunk of bytes as a UTF8 string */\nfunction getUTF8String(array: Uint8Array, start: number, end: number): string {\n  return String.fromCharCode(...array.slice(start, end));\n}\n\nfunction stringToBytes(string: string): number[] {\n  return [...string].map((character) => character.charCodeAt(0));\n}\n\nfunction checkString(buffer: ArrayLike<number>, header: string, offset: number = 0): boolean {\n  const headerBytes = stringToBytes(header);\n\n  for (let i = 0; i < headerBytes.length; ++i) {\n    if (headerBytes[i] !== buffer[i + offset]) {\n      return false;\n    }\n  }\n\n  return true;\n}\n"],"mappings":";;AAaA,OAAO,SAASA,mBAAmB,CAACC,MAAkB,EAAsB;EAE1E,IAAI,CAACC,WAAW,CAACD,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC,EAAE;IACnC,OAAO,IAAI;EACb;;EAGA,IAAI,CAACA,MAAM,CAAC,CAAC,CAAC,GAAG,IAAI,MAAM,IAAI,EAAE;IAC/B,OAAO,IAAI;EACb;;EAGA,OAAOE,gBAAgB,CAACF,MAAM,CAAC;AACjC;;AAMA,OAAO,SAASE,gBAAgB,CAACF,MAAkB,EAAsB;EACvE,MAAMG,UAAU,GAAGC,aAAa,CAACJ,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CAACK,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAACC,IAAI,EAAE;EAEzE,QAAQH,UAAU;IAChB,KAAK,MAAM;IACX,KAAK,MAAM;MACT,OAAO;QAACI,SAAS,EAAE,MAAM;QAAEC,QAAQ,EAAE;MAAY,CAAC;IACpD;MACE,OAAO,IAAI;EAAC;AA2ClB;;AAGA,SAASJ,aAAa,CAACK,KAAiB,EAAEC,KAAa,EAAEC,GAAW,EAAU;EAC5E,OAAOC,MAAM,CAACC,YAAY,CAAC,GAAGJ,KAAK,CAACK,KAAK,CAACJ,KAAK,EAAEC,GAAG,CAAC,CAAC;AACxD;AAEA,SAASI,aAAa,CAACC,MAAc,EAAY;EAC/C,OAAO,CAAC,GAAGA,MAAM,CAAC,CAACC,GAAG,CAAEC,SAAS,IAAKA,SAAS,CAACC,UAAU,CAAC,CAAC,CAAC,CAAC;AAChE;AAEA,SAASlB,WAAW,CAACD,MAAyB,EAAEoB,MAAc,EAA+B;EAAA,IAA7BC,MAAc,uEAAG,CAAC;EAChF,MAAMC,WAAW,GAAGP,aAAa,CAACK,MAAM,CAAC;EAEzC,KAAK,IAAIG,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGD,WAAW,CAACE,MAAM,EAAE,EAAED,CAAC,EAAE;IAC3C,IAAID,WAAW,CAACC,CAAC,CAAC,KAAKvB,MAAM,CAACuB,CAAC,GAAGF,MAAM,CAAC,EAAE;MACzC,OAAO,KAAK;IACd;EACF;EAEA,OAAO,IAAI;AACb"}

package/dist/esm/lib/utils/version.js

@@ -1,3 +1,3 @@
 
-export const VERSION = typeof "3.4.0-alpha.1" !== 'undefined' ? "3.4.0-alpha.1" : 'latest';
+export const VERSION = typeof "3.4.0-alpha.2" !== 'undefined' ? "3.4.0-alpha.2" : 'latest';
 //# sourceMappingURL=version.js.map

package/dist/image-loader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-loader.d.ts","sourceRoot":"","sources":["../src/image-loader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,aAAa,EAAE,gBAAgB,EAAC,MAAM,0BAA0B,CAAC;AAE9E,OAAO,UAAU,MAAM,2BAA2B,CAAC;AAcnD,MAAM,MAAM,kBAAkB,GAAG,aAAa,GAAG;IAC/C,KAAK,CAAC,EAAE;QACN,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,OAAO,CAAC;QACjD,MAAM,CAAC,EAAE,OAAO,CAAC;KAClB,CAAC;IACF,WAAW,CAAC,EAAE,kBAAkB,CAAC;CAClC,CAAC;AAUF;;;GAGG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;CAWvB,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,gBAA8B,CAAC"}
+{"version":3,"file":"image-loader.d.ts","sourceRoot":"","sources":["../src/image-loader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,aAAa,EAAE,gBAAgB,EAAC,MAAM,0BAA0B,CAAC;AAE9E,OAAO,UAAU,MAAM,2BAA2B,CAAC;AAenD,MAAM,MAAM,kBAAkB,GAAG,aAAa,GAAG;IAC/C,KAAK,CAAC,EAAE;QACN,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,OAAO,CAAC;QACjD,MAAM,CAAC,EAAE,OAAO,CAAC;KAClB,CAAC;IACF,WAAW,CAAC,EAAE,kBAAkB,CAAC;CAClC,CAAC;AAUF;;;GAGG;AACH,eAAO,MAAM,WAAW;;;;;;;;;;CAWvB,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,gBAA8B,CAAC"}

package/dist/image-loader.js

@@ -7,12 +7,13 @@ exports._typecheckImageLoader = exports.ImageLoader = void 0;
 const version_1 = require("./lib/utils/version");
 const parse_image_1 = __importDefault(require("./lib/parsers/parse-image"));
 const binary_image_api_1 = require("./lib/category-api/binary-image-api");
-const EXTENSIONS = ['png', 'jpg', 'jpeg', 'gif', 'webp', 'bmp', 'ico', 'svg'];
+const EXTENSIONS = ['png', 'jpg', 'jpeg', 'gif', 'webp', 'bmp', 'ico', 'svg', 'avif'];
 const MIME_TYPES = [
     'image/png',
     'image/jpeg',
     'image/gif',
     'image/webp',
+    'image/avif',
     'image/bmp',
     'image/vnd.microsoft.icon',
     'image/svg+xml'

package/dist/index.d.ts

@@ -5,6 +5,7 @@ export { ImageWriter } from './image-writer';
 export { getBinaryImageMetadata } from './lib/category-api/binary-image-api';
 export { isImageTypeSupported, getDefaultImageType } from './lib/category-api/image-type';
 export { isImage, getImageType, getImageSize, getImageData } from './lib/category-api/parsed-image-api';
-export { _isImageFormatSupported } from './lib/category-api/image-format';
+export { getSupportedImageFormats } from './lib/category-api/image-format';
+export { isImageFormatSupported } from './lib/category-api/image-format';
 export { loadImage } from './lib/texture-api/load-image';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,YAAY,EAAC,aAAa,EAAE,SAAS,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AACrE,YAAY,EAAC,kBAAkB,EAAC,MAAM,gBAAgB,CAAC;AAGvD,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAK3C,OAAO,EAAC,sBAAsB,EAAC,MAAM,qCAAqC,CAAC;AAG3E,OAAO,EAAC,oBAAoB,EAAE,mBAAmB,EAAC,MAAM,+BAA+B,CAAC;AAExF,OAAO,EACL,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,YAAY,EACb,MAAM,qCAAqC,CAAC;AAG7C,OAAO,EAAC,uBAAuB,EAAC,MAAM,iCAAiC,CAAC;AAGxE,OAAO,EAAC,SAAS,EAAC,MAAM,8BAA8B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,YAAY,EAAC,aAAa,EAAE,SAAS,EAAE,aAAa,EAAC,MAAM,SAAS,CAAC;AACrE,YAAY,EAAC,kBAAkB,EAAC,MAAM,gBAAgB,CAAC;AAGvD,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAK3C,OAAO,EAAC,sBAAsB,EAAC,MAAM,qCAAqC,CAAC;AAG3E,OAAO,EAAC,oBAAoB,EAAE,mBAAmB,EAAC,MAAM,+BAA+B,CAAC;AAExF,OAAO,EACL,OAAO,EACP,YAAY,EACZ,YAAY,EACZ,YAAY,EACb,MAAM,qCAAqC,CAAC;AAG7C,OAAO,EAAC,wBAAwB,EAAC,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAC,sBAAsB,EAAC,MAAM,iCAAiC,CAAC;AAGvE,OAAO,EAAC,SAAS,EAAC,MAAM,8BAA8B,CAAC"}

package/dist/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.loadImage = exports._isImageFormatSupported = exports.getImageData = exports.getImageSize = exports.getImageType = exports.isImage = exports.getDefaultImageType = exports.isImageTypeSupported = exports.getBinaryImageMetadata = exports.ImageWriter = exports.ImageLoader = void 0;
+exports.loadImage = exports.isImageFormatSupported = exports.getSupportedImageFormats = exports.getImageData = exports.getImageSize = exports.getImageType = exports.isImage = exports.getDefaultImageType = exports.isImageTypeSupported = exports.getBinaryImageMetadata = exports.ImageWriter = exports.ImageLoader = void 0;
 // LOADERS AND WRITERS
 var image_loader_1 = require("./image-loader");
 Object.defineProperty(exports, "ImageLoader", { enumerable: true, get: function () { return image_loader_1.ImageLoader; } });
@@ -21,7 +21,9 @@ Object.defineProperty(exports, "getImageSize", { enumerable: true, get: function
 Object.defineProperty(exports, "getImageData", { enumerable: true, get: function () { return parsed_image_api_1.getImageData; } });
 // EXPERIMENTAL
 var image_format_1 = require("./lib/category-api/image-format");
-Object.defineProperty(exports, "_isImageFormatSupported", { enumerable: true, get: function () { return image_format_1._isImageFormatSupported; } });
-// DEPRECATED - Remove in V3 (fix dependency in luma.gl)
+Object.defineProperty(exports, "getSupportedImageFormats", { enumerable: true, get: function () { return image_format_1.getSupportedImageFormats; } });
+var image_format_2 = require("./lib/category-api/image-format");
+Object.defineProperty(exports, "isImageFormatSupported", { enumerable: true, get: function () { return image_format_2.isImageFormatSupported; } });
+// DEPRECATED - Remove in V4 (fix dependency in luma.gl)
 var load_image_1 = require("./lib/texture-api/load-image");
 Object.defineProperty(exports, "loadImage", { enumerable: true, get: function () { return load_image_1.loadImage; } });

package/dist/lib/category-api/binary-image-api.d.ts

@@ -7,13 +7,9 @@ export type BinaryImageMetadata = {
 /**
  * Extracts `{mimeType, width and height}` from a memory buffer containing a known image format
  * Currently supports `image/png`, `image/jpeg`, `image/bmp` and `image/gif`.
- * @param binaryData image file memory to parse
+ * @param binaryData: DataView | ArrayBuffer image file memory to parse
  * @returns metadata or null if memory is not a valid image file format layout.
  */
 export declare function getBinaryImageMetadata(binaryData: DataView | ArrayBuffer): BinaryImageMetadata | null;
-export declare function getBmpMetadata(binaryData: any): {
-    mimeType: string;
-    width: number;
-    height: number;
-} | null;
+export declare function getBmpMetadata(binaryData: DataView | ArrayBuffer): BinaryImageMetadata | null;
 //# sourceMappingURL=binary-image-api.d.ts.map

package/dist/lib/category-api/binary-image-api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"binary-image-api.d.ts","sourceRoot":"","sources":["../../../src/lib/category-api/binary-image-api.ts"],"names":[],"mappings":"AAQA,8EAA8E;AAC9E,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAKF;;;;;GAKG;AACH,wBAAgB,sBAAsB,CACpC,UAAU,EAAE,QAAQ,GAAG,WAAW,GACjC,mBAAmB,GAAG,IAAI,CAQ5B;AA2CD,wBAAgB,cAAc,CAAC,UAAU,KAAA;;;;SAmBxC"}
+{"version":3,"file":"binary-image-api.d.ts","sourceRoot":"","sources":["../../../src/lib/category-api/binary-image-api.ts"],"names":[],"mappings":"AAUA,8EAA8E;AAC9E,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAKF;;;;;GAKG;AACH,wBAAgB,sBAAsB,CACpC,UAAU,EAAE,QAAQ,GAAG,WAAW,GACjC,mBAAmB,GAAG,IAAI,CAS5B;AA2DD,wBAAgB,cAAc,CAAC,UAAU,EAAE,QAAQ,GAAG,WAAW,GAAG,mBAAmB,GAAG,IAAI,CAmB7F"}

package/dist/lib/category-api/binary-image-api.js

@@ -3,12 +3,17 @@
 // * Based on binary-gltf-utils under MIT license: Copyright (c) 2016-17 Karl Cheng
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getBmpMetadata = exports.getBinaryImageMetadata = void 0;
+// TODO: make these functions work for Node.js buffers?
+// Quarantine references to Buffer to prevent bundler from adding big polyfills
+// import {bufferToArrayBuffer} from '../node/buffer-to-array-buffer';
+// TODO - this should be handled in @loaders.gl/polyfills
+const parse_isobmff_binary_1 = require("./parse-isobmff-binary");
 const BIG_ENDIAN = false;
 const LITTLE_ENDIAN = true;
 /**
  * Extracts `{mimeType, width and height}` from a memory buffer containing a known image format
  * Currently supports `image/png`, `image/jpeg`, `image/bmp` and `image/gif`.
- * @param binaryData image file memory to parse
+ * @param binaryData: DataView | ArrayBuffer image file memory to parse
  * @returns metadata or null if memory is not a valid image file format layout.
  */
 function getBinaryImageMetadata(binaryData) {
@@ -16,9 +21,24 @@ function getBinaryImageMetadata(binaryData) {
     return (getPngMetadata(dataView) ||
         getJpegMetadata(dataView) ||
         getGifMetadata(dataView) ||
-        getBmpMetadata(dataView));
+        getBmpMetadata(dataView) ||
+        getISOBMFFMetadata(dataView));
 }
 exports.getBinaryImageMetadata = getBinaryImageMetadata;
+// ISOBMFF
+function getISOBMFFMetadata(binaryData) {
+    const buffer = new Uint8Array(binaryData instanceof DataView ? binaryData.buffer : binaryData);
+    const mediaType = (0, parse_isobmff_binary_1.getISOBMFFMediaType)(buffer);
+    if (!mediaType) {
+        return null;
+    }
+    return {
+        mimeType: mediaType.mimeType,
+        // TODO - decode width and height
+        width: 0,
+        height: 0
+    };
+}
 // PNG
 function getPngMetadata(binaryData) {
     const dataView = toDataView(binaryData);

package/dist/lib/category-api/image-format.d.ts

@@ -1,5 +1,7 @@
+/** Run-time browser detection of file formats requires async tests for most precise results */
+export declare function getSupportedImageFormats(): Promise<Set<string>>;
 /**
- * Check if image MIME type is supported. Result is cached.
+ * Check if image MIME type is supported. Result is cached to avoid repeated tests.
  */
-export declare function _isImageFormatSupported(mimeType: string): boolean;
+export declare function isImageFormatSupported(mimeType: string): boolean;
 //# sourceMappingURL=image-format.d.ts.map

package/dist/lib/category-api/image-format.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image-format.d.ts","sourceRoot":"","sources":["../../../src/lib/category-api/image-format.ts"],"names":[],"mappings":"AAQA;;GAEG;AACH,wBAAgB,uBAAuB,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAKjE"}
+{"version":3,"file":"image-format.d.ts","sourceRoot":"","sources":["../../../src/lib/category-api/image-format.ts"],"names":[],"mappings":"AAqBA,+FAA+F;AAC/F,wBAAsB,wBAAwB,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAgBrE;AAKD;;GAEG;AACH,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAQhE"}

package/dist/lib/category-api/image-format.js

@@ -1,63 +1,110 @@
 "use strict";
+// loaders.gl, MIT license
 Object.defineProperty(exports, "__esModule", { value: true });
-exports._isImageFormatSupported = void 0;
+exports.isImageFormatSupported = exports.getSupportedImageFormats = void 0;
 const loader_utils_1 = require("@loaders.gl/loader-utils");
-// The following formats are supported by loaders.gl polyfills
-const NODE_FORMAT_SUPPORT = ['image/png', 'image/jpeg', 'image/gif'];
-/** Cache values for speed */
-const mimeTypeSupported = {};
+const MIME_TYPES = [
+    'image/png',
+    'image/jpeg',
+    'image/gif',
+    'image/webp',
+    'image/avif',
+    'image/tiff',
+    // TODO - what is the correct type for SVG
+    'image/svg',
+    'image/svg+xml',
+    'image/bmp',
+    'image/vnd.microsoft.icon'
+];
+/** Only one round of tests is performed */
+const mimeTypeSupportedPromise = null;
+/** Run-time browser detection of file formats requires async tests for most precise results */
+async function getSupportedImageFormats() {
+    if (mimeTypeSupportedPromise) {
+        return await mimeTypeSupportedPromise;
+    }
+    const supportedMimeTypes = new Set();
+    for (const mimeType of MIME_TYPES) {
+        const supported = loader_utils_1.isBrowser
+            ? await checkBrowserImageFormatSupportAsync(mimeType)
+            : checkNodeImageFormatSupport(mimeType);
+        if (supported) {
+            supportedMimeTypes.add(mimeType);
+        }
+    }
+    return supportedMimeTypes;
+}
+exports.getSupportedImageFormats = getSupportedImageFormats;
+/** Cache sync values for speed */
+const mimeTypeSupportedSync = {};
 /**
- * Check if image MIME type is supported. Result is cached.
+ * Check if image MIME type is supported. Result is cached to avoid repeated tests.
  */
-function _isImageFormatSupported(mimeType) {
-    if (mimeTypeSupported[mimeType] === undefined) {
-        mimeTypeSupported[mimeType] = checkFormatSupport(mimeType);
+function isImageFormatSupported(mimeType) {
+    if (mimeTypeSupportedSync[mimeType] === undefined) {
+        const supported = loader_utils_1.isBrowser
+            ? checkBrowserImageFormatSupport(mimeType)
+            : checkNodeImageFormatSupport(mimeType);
+        mimeTypeSupportedSync[mimeType] = supported;
     }
-    return mimeTypeSupported[mimeType];
+    return mimeTypeSupportedSync[mimeType];
 }
-exports._isImageFormatSupported = _isImageFormatSupported;
+exports.isImageFormatSupported = isImageFormatSupported;
 /**
- * Check if image MIME type is supported.
+ * Checks that polyfills are installed and that mimeType is supported by polyfills
+ * @todo Ideally polyfills should declare what formats they support, instead of storing that data here.
  */
-function checkFormatSupport(mimeType) {
+function checkNodeImageFormatSupport(mimeType) {
+    /** @deprecated Remove these in 4.0 and rely on polyfills to inject them */
+    const NODE_FORMAT_SUPPORT = ['image/png', 'image/jpeg', 'image/gif'];
+    // @ts-ignore
+    const { _parseImageNode, _imageFormatsNode = NODE_FORMAT_SUPPORT } = globalThis;
+    return Boolean(_parseImageNode) && _imageFormatsNode.includes(mimeType);
+}
+/** Checks image format support synchronously.
+ * @note Unreliable, fails on AVIF
+ */
+function checkBrowserImageFormatSupport(mimeType) {
     switch (mimeType) {
+        case 'image/avif': // Will fail
         case 'image/webp':
-            return checkWebPSupport();
-        case 'image/svg':
-            return loader_utils_1.isBrowser;
+            return testBrowserImageFormatSupport(mimeType);
         default:
-            if (!loader_utils_1.isBrowser) {
-                // @ts-ignore
-                const { _parseImageNode } = globalThis;
-                return Boolean(_parseImageNode) && NODE_FORMAT_SUPPORT.includes(mimeType);
-            }
             return true;
     }
 }
-/** Check WebPSupport synchronously */
-function checkWebPSupport() {
-    if (!loader_utils_1.isBrowser) {
-        return false;
-    }
+const TEST_IMAGE = {
+    'image/avif': 'data:image/avif;base64,AAAAIGZ0eXBhdmlmAAAAAGF2aWZtaWYxbWlhZk1BMUIAAADybWV0YQAAAAAAAAAoaGRscgAAAAAAAAAAcGljdAAAAAAAAAAAAAAAAGxpYmF2aWYAAAAADnBpdG0AAAAAAAEAAAAeaWxvYwAAAABEAAABAAEAAAABAAABGgAAAB0AAAAoaWluZgAAAAAAAQAAABppbmZlAgAAAAABAABhdjAxQ29sb3IAAAAAamlwcnAAAABLaXBjbwAAABRpc3BlAAAAAAAAAAIAAAACAAAAEHBpeGkAAAAAAwgICAAAAAxhdjFDgQ0MAAAAABNjb2xybmNseAACAAIAAYAAAAAXaXBtYQAAAAAAAAABAAEEAQKDBAAAACVtZGF0EgAKCBgANogQEAwgMg8f8D///8WfhwB8+ErK42A=',
+    // Lossy test image. Support for lossy images doesn't guarantee support for all WebP images.
+    'image/webp': 'data:image/webp;base64,UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA'
+};
+/** Checks WebP and AVIF support asynchronously */
+async function checkBrowserImageFormatSupportAsync(mimeType) {
+    const dataURL = TEST_IMAGE[mimeType];
+    return dataURL ? await testBrowserImageFormatSupportAsync(dataURL) : true;
+}
+/**
+ * Checks browser synchronously
+ * Checks if toDataURL supports the mimeType.
+ * @note Imperfect testOn Chrome this is true for WebP but not for AVIF
+ */
+function testBrowserImageFormatSupport(mimeType) {
     try {
         const element = document.createElement('canvas');
-        return element.toDataURL('image/webp').indexOf('data:image/webp') === 0;
+        const dataURL = element.toDataURL(mimeType);
+        return dataURL.indexOf(`data:${mimeType}`) === 0;
     }
     catch {
         // Probably Safari...
         return false;
     }
 }
-// Note: better test but asynchronous
-// Lossy test image. Support for lossy images doesn't guarantee support for all WebP images.
-// https://stackoverflow.com/questions/5573096/detecting-webp-support
-// const WEBP_TEST_IMAGE = 'data:image/webp;base64,UklGRiIAAABXRUJQVlA4IBYAAAAwAQCdASoBAAEADsD+JaQAA3AAAAAA';
 // Check WebPSupport asynchronously
-// async function isWebPSupported() {
-//   return new Promise( resolve => {
-//     const image = new Image();
-//     image.src = WEBP_TEST_IMAGE;
-//     image.onload = image.onerror = function () {
-//     resolve( image.height === 1 );
-//   }
-// }
+async function testBrowserImageFormatSupportAsync(testImageDataURL) {
+    return new Promise((resolve) => {
+        const image = new Image();
+        image.src = testImageDataURL;
+        image.onload = () => resolve(image.height > 0);
+        image.onerror = () => resolve(false);
+    });
+}

package/dist/lib/category-api/parse-isobmff-binary.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Box is a container format that can contain a variety of media related files,
+ * so we want to return information about which type of file is actually contained inside
+ */
+export type BoxFileType = {
+    extension: string;
+    mimeType: string;
+};
+/**
+ * Tests if a buffer is in ISO base media file format (ISOBMFF) @see https://en.wikipedia.org/wiki/ISO_base_media_file_format
+ * (ISOBMFF is a media container standard based on the Apple QuickTime container format)
+ */
+export declare function getISOBMFFMediaType(buffer: Uint8Array): BoxFileType | null;
+/**
+ * brands explained @see https://github.com/strukturag/libheif/issues/83
+ * code adapted from @see https://github.com/sindresorhus/file-type/blob/main/core.js#L489-L492
+ */
+export declare function decodeMajorBrand(buffer: Uint8Array): BoxFileType | null;
+//# sourceMappingURL=parse-isobmff-binary.d.ts.map

package/dist/lib/category-api/parse-isobmff-binary.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"parse-isobmff-binary.d.ts","sourceRoot":"","sources":["../../../src/lib/category-api/parse-isobmff-binary.ts"],"names":[],"mappings":"AAGA;;;GAGG;AACH,MAAM,MAAM,WAAW,GAAG;IAAC,SAAS,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,MAAM,CAAA;CAAC,CAAC;AAEhE;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,UAAU,GAAG,WAAW,GAAG,IAAI,CAa1E;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,UAAU,GAAG,WAAW,GAAG,IAAI,CAmDvE"}

package/dist/lib/category-api/parse-isobmff-binary.js

@@ -0,0 +1,94 @@
+"use strict";
+// loaders.gl, MIT license
+// code adapted from https://github.com/sindresorhus/file-type under MIT license
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.decodeMajorBrand = exports.getISOBMFFMediaType = void 0;
+/**
+ * Tests if a buffer is in ISO base media file format (ISOBMFF) @see https://en.wikipedia.org/wiki/ISO_base_media_file_format
+ * (ISOBMFF is a media container standard based on the Apple QuickTime container format)
+ */
+function getISOBMFFMediaType(buffer) {
+    // Almost all ISO base media files start with `ftyp` box. (It's not required to be first, but it's recommended to be.)
+    if (!checkString(buffer, 'ftyp', 4)) {
+        return null;
+    }
+    // Extra check: test for 8859-1 printable characters (for simplicity, it's a mask which also catches one non-printable character).
+    if ((buffer[8] & 0x60) === 0x00) {
+        return null;
+    }
+    // `ftyp` box must contain a brand major identifier, which must consist of ISO 8859-1 printable characters.
+    return decodeMajorBrand(buffer);
+}
+exports.getISOBMFFMediaType = getISOBMFFMediaType;
+/**
+ * brands explained @see https://github.com/strukturag/libheif/issues/83
+ * code adapted from @see https://github.com/sindresorhus/file-type/blob/main/core.js#L489-L492
+ */
+function decodeMajorBrand(buffer) {
+    const brandMajor = getUTF8String(buffer, 8, 12).replace('\0', ' ').trim();
+    switch (brandMajor) {
+        case 'avif':
+        case 'avis':
+            return { extension: 'avif', mimeType: 'image/avif' };
+        default:
+            return null;
+    }
+    // We don't need these now, but they are easy to add
+    // case 'mif1':
+    //   return {extension: 'heic', mimeType: 'image/heif'};
+    // case 'msf1':
+    //   return {extension: 'heic', mimeType: 'image/heif-sequence'};
+    // case 'heic':
+    // case 'heix':
+    //   return {extension: 'heic', mimeType: 'image/heic'};
+    // case 'hevc':
+    // case 'hevx':
+    //   return {extension: 'heic', mimeType: 'image/heic-sequence'};
+    // case 'qt':
+    //   return {ext: 'mov', mime: 'video/quicktime'};
+    // case 'M4V':
+    // case 'M4VH':
+    // case 'M4VP':
+    //   return {ext: 'm4v', mime: 'video/x-m4v'};
+    // case 'M4P':
+    //   return {ext: 'm4p', mime: 'video/mp4'};
+    // case 'M4B':
+    //   return {ext: 'm4b', mime: 'audio/mp4'};
+    // case 'M4A':
+    //   return {ext: 'm4a', mime: 'audio/x-m4a'};
+    // case 'F4V':
+    //   return {ext: 'f4v', mime: 'video/mp4'};
+    // case 'F4P':
+    //   return {ext: 'f4p', mime: 'video/mp4'};
+    // case 'F4A':
+    //   return {ext: 'f4a', mime: 'audio/mp4'};
+    // case 'F4B':
+    //   return {ext: 'f4b', mime: 'audio/mp4'};
+    // case 'crx':
+    //   return {ext: 'cr3', mime: 'image/x-canon-cr3'};
+    // default:
+    // if (brandMajor.startsWith('3g')) {
+    //   if (brandMajor.startsWith('3g2')) {
+    //     return {ext: '3g2', mime: 'video/3gpp2'};
+    //   }
+    //   return {ext: '3gp', mime: 'video/3gpp'};
+    // }
+    // return {ext: 'mp4', mime: 'video/mp4'};
+}
+exports.decodeMajorBrand = decodeMajorBrand;
+/** Interpret a chunk of bytes as a UTF8 string */
+function getUTF8String(array, start, end) {
+    return String.fromCharCode(...array.slice(start, end));
+}
+function stringToBytes(string) {
+    return [...string].map((character) => character.charCodeAt(0));
+}
+function checkString(buffer, header, offset = 0) {
+    const headerBytes = stringToBytes(header);
+    for (let i = 0; i < headerBytes.length; ++i) {
+        if (headerBytes[i] !== buffer[i + offset]) {
+            return false;
+        }
+    }
+    return true;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loaders.gl/images",
-  "version": "3.4.0-alpha.1",
+  "version": "3.4.0-alpha.2",
   "description": "Framework-independent loaders and writers for images (PNG, JPG, ...)",
   "license": "MIT",
   "publishConfig": {
@@ -32,7 +32,10 @@
     "build-bundle": "esbuild src/bundle.ts --outfile=dist/dist.min.js --bundle --minify --sourcemap"
   },
   "dependencies": {
-    "@loaders.gl/loader-utils": "3.4.0-alpha.1"
+    "@loaders.gl/loader-utils": "3.4.0-alpha.2"
   },
-  "gitHead": "4085b0323050e4361614471319a1fb4729547bbf"
+  "gitHead": "f1c00c124d8d0c41a138ff40afb0d1a00711bf2e",
+  "devDependencies": {
+    "@types/get-pixels": "^3.3.2"
+  }
 }

package/src/image-loader.ts

@@ -3,12 +3,13 @@ import {VERSION} from './lib/utils/version';
 import parseImage from './lib/parsers/parse-image';
 import {getBinaryImageMetadata} from './lib/category-api/binary-image-api';
 
-const EXTENSIONS = ['png', 'jpg', 'jpeg', 'gif', 'webp', 'bmp', 'ico', 'svg'];
+const EXTENSIONS = ['png', 'jpg', 'jpeg', 'gif', 'webp', 'bmp', 'ico', 'svg', 'avif'];
 const MIME_TYPES = [
   'image/png',
   'image/jpeg',
   'image/gif',
   'image/webp',
+  'image/avif',
   'image/bmp',
   'image/vnd.microsoft.icon',
   'image/svg+xml'

package/src/index.ts

@@ -22,7 +22,8 @@ export {
 } from './lib/category-api/parsed-image-api';
 
 // EXPERIMENTAL
-export {_isImageFormatSupported} from './lib/category-api/image-format';
+export {getSupportedImageFormats} from './lib/category-api/image-format';
+export {isImageFormatSupported} from './lib/category-api/image-format';
 
-// DEPRECATED - Remove in V3 (fix dependency in luma.gl)
+// DEPRECATED - Remove in V4 (fix dependency in luma.gl)
 export {loadImage} from './lib/texture-api/load-image';

package/src/lib/category-api/binary-image-api.ts

@@ -6,6 +6,8 @@
 // import {bufferToArrayBuffer} from '../node/buffer-to-array-buffer';
 // TODO - this should be handled in @loaders.gl/polyfills
 
+import {getISOBMFFMediaType} from './parse-isobmff-binary';
+
 /** MIME type, width and height extracted from binary compressed image data */
 export type BinaryImageMetadata = {
   mimeType: string;
@@ -19,7 +21,7 @@ const LITTLE_ENDIAN = true;
 /**
  * Extracts `{mimeType, width and height}` from a memory buffer containing a known image format
  * Currently supports `image/png`, `image/jpeg`, `image/bmp` and `image/gif`.
- * @param binaryData image file memory to parse
+ * @param binaryData: DataView | ArrayBuffer image file memory to parse
  * @returns metadata or null if memory is not a valid image file format layout.
  */
 export function getBinaryImageMetadata(
@@ -30,13 +32,30 @@ export function getBinaryImageMetadata(
     getPngMetadata(dataView) ||
     getJpegMetadata(dataView) ||
     getGifMetadata(dataView) ||
-    getBmpMetadata(dataView)
+    getBmpMetadata(dataView) ||
+    getISOBMFFMetadata(dataView)
   );
 }
 
+// ISOBMFF
+
+function getISOBMFFMetadata(binaryData: DataView | ArrayBuffer): BinaryImageMetadata | null {
+  const buffer = new Uint8Array(binaryData instanceof DataView ? binaryData.buffer : binaryData);
+  const mediaType = getISOBMFFMediaType(buffer);
+  if (!mediaType) {
+    return null;
+  }
+  return {
+    mimeType: mediaType.mimeType,
+    // TODO - decode width and height
+    width: 0,
+    height: 0
+  };
+}
+
 // PNG
 
-function getPngMetadata(binaryData) {
+function getPngMetadata(binaryData: DataView | ArrayBuffer): BinaryImageMetadata | null {
   const dataView = toDataView(binaryData);
   // Check file contains the first 4 bytes of the PNG signature.
   const isPng = dataView.byteLength >= 24 && dataView.getUint32(0, BIG_ENDIAN) === 0x89504e47;
@@ -56,7 +75,7 @@ function getPngMetadata(binaryData) {
 
 // Extract size from a binary GIF file
 // TODO: GIF is not this simple
-function getGifMetadata(binaryData) {
+function getGifMetadata(binaryData: DataView | ArrayBuffer): BinaryImageMetadata | null {
   const dataView = toDataView(binaryData);
   // Check first 4 bytes of the GIF signature ("GIF8").
   const isGif = dataView.byteLength >= 10 && dataView.getUint32(0, BIG_ENDIAN) === 0x47494638;
@@ -75,7 +94,7 @@ function getGifMetadata(binaryData) {
 // BMP
 
 // TODO: BMP is not this simple
-export function getBmpMetadata(binaryData) {
+export function getBmpMetadata(binaryData: DataView | ArrayBuffer): BinaryImageMetadata | null {
   const dataView = toDataView(binaryData);
   // Check magic number is valid (first 2 characters should be "BM").
   // The mandatory bitmap file header is 14 bytes long.
@@ -99,7 +118,7 @@ export function getBmpMetadata(binaryData) {
 // JPEG
 
 // Extract width and height from a binary JPEG file
-function getJpegMetadata(binaryData) {
+function getJpegMetadata(binaryData: DataView | ArrayBuffer): BinaryImageMetadata | null {
   const dataView = toDataView(binaryData);
   // Check file contains the JPEG "start of image" (SOI) marker
   // followed by another marker.