bare-media 1.8.0 → 2.1.0

package/README.md

@@ -1,6 +1,6 @@
 # bare-media
 
-A set of media apis for Bare
+A set of media APIs for Bare
 
 ## Install
 
@@ -10,90 +10,123 @@ npm i bare-media
 
 ## Usage
 
-From a single worker:
+Image:
 
 ```js
-import worker from 'bare-media'
+import { image } from 'bare-media'
 
-const data = await worker.createPreview({ path, maxWidth, maxHeight })
+const preview = await image(path)
+  .decode({ maxFrames })
+  .resize({ maxWidth, maxHeight })
+  .encode({ mimetype: 'image/webp' })
 ```
 
-Manually instantiate one or multiple workers:
+Video:
 
 ```js
-import { WorkerClient } from 'bare-media/client'
+import { video } from 'bare-media'
 
-const worker = new WorkerClient()
-const data = await worker.createPreview({ path, maxWidth, maxHeight })
+const frames = video(path).extractFrames({ frameIndex })
 ```
 
-> NOTE: A worker spawns when an operation is requested and it stays running until the parent process is killed.
-
-Terminate the worker:
+Each method can also be used independently:
 
 ```js
-worker.close()
-
-worker.onClose = () => {
-  // worker terminated
-}
+const rgba = await image.decode(buffer, { maxFrames })
 ```
 
-Call the methods directly without a worker:
+## Image API
 
-```js
-import { createPreview } from 'bare-media/worker/media.js'
+### decode()
 
-const data = await createPreview({ path, maxWidth, maxHeight })
-```
+Decode an image to RGBA
+
+| Parameter        | Type   | Description                                               |
+| ---------------- | ------ | --------------------------------------------------------- |
+| `buffer`         | object | The encoded image                                         |
+| `opts.maxFrames` | number | Max number of frames to decode in case of animated images |
 
-## API
+### encode()
 
-> See [schema.js](shared/spec/schema.js) for the complete reference of parameters
+Encodes an image to a specific format
 
-### createPreview()
+| Parameter       | Type   | Description                                                                         |
+| --------------- | ------ | ----------------------------------------------------------------------------------- |
+| `buffer`        | object | The rgba image                                                                      |
+| `opts.mimetype` | string | The mimetype of the output image                                                    |
+| `opts.maxBytes` | number | Max bytes for the encoded image (reduces quality or fps in case of animated images) |
+| `opts...`       | any    | Additional encoder-specific options                                                 |
 
-Create a preview from a media file
+### crop()
 
-| Property    | Type   | Description                                                               |
-| ----------- | ------ | ------------------------------------------------------------------------- |
-| `path`      | string | Path to the input file. Either `path`, `httpLink` or `buffer` is required |
-| `httpLink`  | string | Http link to the input file                                               |
-| `buffer`    | object | Bytes of the input file                                                   |
-| `mimetype`  | string | Media type of the input file. If not provided it will be detected         |
-| `maxWidth`  | number | Max width for the generated preview                                       |
-| `maxHeight` | number | Max height for the generated preview                                      |
-| `maxFrames` | number | Max frames for the generated preview in case the file is animated         |
-| `maxBytes`  | number | Max bytes for the generated preview                                       |
-| `format`    | string | Media type for the generated preview. Default `image/webp`                |
-| `encoding`  | string | `base64` or nothing for buffer                                            |
+Crop an image
 
-### decodeImage()
+| Parameter     | Type   | Description                  |
+| ------------- | ------ | ---------------------------- |
+| `buffer`      | object | The rgba image               |
+| `opts.left`   | number | Offset from left edge        |
+| `opts.top`    | number | Offset from top edge         |
+| `opts.width`  | number | Width of the region to crop  |
+| `opts.height` | number | Height of the region to crop |
 
-Decode an image to RGBA
+### resize()
 
-| Property   | Type   | Description                                                               |
-| ---------- | ------ | ------------------------------------------------------------------------- |
-| `path`     | string | Path to the input file. Either `path`, `httpLink` or `buffer` is required |
-| `httpLink` | string | Http link to the input file                                               |
-| `buffer`   | object | Bytes of the input file                                                   |
-| `mimetype` | string | Media type of the input file. If not provided it will be detected         |
+Resize an image
 
-### cropImage()
+| Parameter        | Type   | Description                   |
+| ---------------- | ------ | ----------------------------- |
+| `buffer`         | object | The rgba image                |
+| `opts.maxWidth`  | number | Max width of the output rgba  |
+| `opts.maxHeight` | number | Max height of the output rgba |
 
-Crop an image
+### slice()
+
+Limits an animated image to a subset of frames. If the image is not animated, it returns the same rgba.
+
+| Parameter    | Type   | Description                                                              |
+| ------------ | ------ | ------------------------------------------------------------------------ |
+| `buffer`     | object | The rgba image                                                           |
+| `opts.start` | number | Frame index at which to start extraction. Default 0.                     |
+| `opts.end`   | number | Frame index at which to end extraction. Defaults to end of the animation |
+
+### read()
+
+Read an image from a file path, URL, or buffer.
+
+| Parameter | Type   | Description                                 |
+| --------- | ------ | ------------------------------------------- |
+| `input`   | object | File path, http(s) URL, or raw image buffer |
+
+### save()
+
+Write an encoded image buffer to a file.
+
+| Parameter  | Type   | Description                              |
+| ---------- | ------ | ---------------------------------------- |
+| `filename` | string | Destination file path                    |
+| `buffer`   | object | Encoded image buffer                     |
+| `opts`     | object | Options passed through to `fs.writeFile` |
+
+## Video API
+
+### extractFrames()
+
+Extracts frames from a video in RGBA
+
+| Parameter         | Type   | Description                    |
+| ----------------- | ------ | ------------------------------ |
+| `fd`              | number | File descriptor                |
+| `opts.frameIndex` | number | Number of the frame to extract |
+
+## Supported Types
+
+Helpers to check supported media types are exposed in `bare-media/types`:
 
-| Property   | Type   | Description                                                               |
-| ---------- | ------ | ------------------------------------------------------------------------- |
-| `path`     | string | Path to the input file. Either `path`, `httpLink` or `buffer` is required |
-| `httpLink` | string | Http link to the input file                                               |
-| `buffer`   | object | Bytes of the input file                                                   |
-| `mimetype` | string | Media type of the input file. If not provided it will be detected         |
-| `left`     | number | Offset from left edge                                                     |
-| `top`      | number | Offset from top edge                                                      |
-| `width`    | number | Width of the region to crop                                               |
-| `height`   | number | Height of the region to crop                                              |
-| `format`   | string | Media type for the cropped image. Default same as the input image         |
+- `supportedImageMimetypes`: list of supported image mimetypes.
+- `supportedVideoMimetypes`: list of supported video mimetypes.
+- `isImageSupported(mimetype)`: returns `true` if the mimetype is a supported image format.
+- `isVideoSupported(mimetype)`: returns `true` if the mimetype is a supported video format.
+- `isMediaSupported(mimetype)`: returns `true` if the mimetype is either a supported image or video format.
 
 ## License
 

package/index.js

@@ -1,5 +1,3 @@
-import { WorkerClient } from './client'
-
-const worker = new WorkerClient()
-
-export default worker
+export * from './src/codecs'
+export * from './src/image'
+export * from './src/video'

package/package.json

@@ -1,10 +1,19 @@
 {
   "name": "bare-media",
-  "version": "1.8.0",
+  "version": "2.1.0",
+  "description": "A set of media APIs for Bare",
   "main": "index.js",
   "type": "module",
+  "exports": {
+    ".": "./index.js",
+    "./types": "./types.js"
+  },
+  "files": [
+    "src",
+    "index.js",
+    "types.js"
+  ],
   "scripts": {
-    "build:rpc": "cd shared/spec && bare ./build.js",
     "format": "prettier --write .",
     "format:check": "prettier --check .",
     "lint": "npm run format:check && lunte",
@@ -13,40 +22,40 @@
   "keywords": [],
   "author": "Holepunch Inc",
   "license": "Apache-2.0",
-  "description": "",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/holepunchto/bare-media.git"
+  },
+  "bugs": {
+    "url": "https://github.com/holepunchto/bare-media/issues"
+  },
+  "homepage": "https://github.com/holepunchto/bare-media#readme",
   "dependencies": {
-    "b4a": "^1.6.7",
+    "bare-bmp": "^1.0.0",
     "bare-fetch": "^2.4.1",
+    "bare-ffmpeg": "^1.0.0",
     "bare-fs": "^4.1.5",
     "bare-gif": "^1.1.2",
     "bare-heif": "^1.0.5",
+    "bare-ico": "^1.0.0",
     "bare-image-resample": "^1.0.1",
     "bare-jpeg": "^1.0.1",
     "bare-png": "^1.0.2",
     "bare-tiff": "^1.0.1",
     "bare-webp": "^1.0.3",
-    "cross-worker": "^1.1.0",
     "get-file-format": "^1.0.1",
-    "get-mime-type": "^2.0.1",
-    "hrpc": "^4.0.0",
-    "hyperschema": "^1.12.3",
-    "ready-resource": "^1.2.0",
-    "uncaughts": "^1.1.1"
+    "get-mime-type": "^2.0.1"
   },
   "devDependencies": {
+    "b4a": "^1.7.3",
+    "bare-os": "^3.6.2",
     "brittle": "^3.16.3",
     "corestore": "^7.4.5",
     "hyperblobs": "^2.8.0",
     "hypercore-blob-server": "^1.11.0",
-    "lunte": "^1.3.0",
-    "prettier": "^3.6.2",
-    "prettier-config-holepunch": "^1.0.0",
+    "lunte": "^1.4.0",
+    "prettier": "^3.7.4",
+    "prettier-config-holepunch": "^2.0.0",
     "test-tmp": "^1.4.0"
-  },
-  "files": [
-    "shared",
-    "worker",
-    "client.js",
-    "index.js"
-  ]
+  }
 }

package/src/codecs.js

@@ -0,0 +1,28 @@
+import { IMAGE } from '../types'
+
+export const codecs = {
+  [IMAGE.AVIF]: () => import('bare-heif'),
+  [IMAGE.BMP]: () => import('bare-bmp'),
+  [IMAGE.GIF]: () => import('bare-gif'),
+  [IMAGE.HEIC]: () => import('bare-heif'),
+  [IMAGE.HEIF]: () => import('bare-heif'),
+  [IMAGE.JPEG]: () => import('bare-jpeg'),
+  [IMAGE.JPG]: () => import('bare-jpeg'),
+  [IMAGE.PNG]: () => import('bare-png'),
+  [IMAGE.TIF]: () => import('bare-tiff'),
+  [IMAGE.TIFF]: () => import('bare-tiff'),
+  [IMAGE.VND_MS_ICON]: () => import('bare-ico'),
+  [IMAGE.WEBP]: () => import('bare-webp'),
+  [IMAGE.X_ICON]: () => import('bare-ico'),
+  [IMAGE.X_MS_BMP]: () => import('bare-bmp')
+}
+
+export async function importCodec(mimetype) {
+  const codecImport = codecs[mimetype]
+  if (!codecImport) throw new Error(`Unsupported file type: No codec available for ${mimetype}`)
+  return await codecImport()
+}
+
+export function supportsQuality(mimetype) {
+  return { 'image/webp': true, 'image/jpeg': true }[mimetype] || false
+}

package/src/image.js

@@ -0,0 +1,262 @@
+import fs from 'bare-fs'
+import fetch from 'bare-fetch'
+
+import { importCodec, supportsQuality } from './codecs.js'
+import { isHttpUrl, detectMimeType, calculateFitDimensions } from './util'
+
+const animatableMimetypes = ['image/gif', 'image/webp']
+
+async function read(input) {
+  let buffer
+
+  if (typeof input === 'string') {
+    if (isHttpUrl(input)) {
+      const response = await fetch(input)
+      buffer = await response.buffer()
+    } else {
+      buffer = await fs.readFile(input)
+    }
+  } else {
+    buffer = input
+  }
+
+  return buffer
+}
+
+async function save(filename, buffer, opts) {
+  return fs.writeFile(filename, buffer, opts)
+}
+
+async function decode(buffer, opts = {}) {
+  const { maxFrames = 0 } = opts
+
+  let rgba
+
+  const mimetype = detectMimeType(buffer)
+  const codec = await importCodec(mimetype)
+
+  if (animatableMimetypes.includes(mimetype)) {
+    const { width, height, loops, frames } = codec.decodeAnimated(buffer)
+    const data = []
+    for (const frame of frames) {
+      if (maxFrames > 0 && data.length >= maxFrames) break
+      data.push(frame)
+    }
+    rgba = { width, height, loops, frames: data }
+  } else {
+    rgba = codec.decode(buffer)
+  }
+
+  return rgba
+}
+
+async function encode(rgba, opts = {}) {
+  const { mimetype, maxBytes, ...codecOpts } = opts
+
+  let encoded = await _encodeRGBA(rgba, mimetype, codecOpts)
+
+  if (maxBytes) {
+    if (encoded.byteLength > maxBytes && supportsQuality(mimetype)) {
+      const MIN_QUALITY = 50
+      for (let quality = 80; quality >= MIN_QUALITY; quality -= 15) {
+        encoded = await _encodeRGBA(rgba, mimetype, { quality })
+        if (encoded.byteLength <= maxBytes) {
+          break
+        }
+      }
+    }
+
+    if (encoded.byteLength > maxBytes && rgba.frames?.length > 1) {
+      const quality = 75
+
+      for (const dropEvery of [4, 3, 2]) {
+        const frames = rgba.frames.filter((frame, index) => index % dropEvery !== 0)
+        const filtered = { ...rgba, frames }
+        encoded = await _encodeRGBA(filtered, mimetype, { quality })
+        if (encoded.byteLength <= maxBytes) {
+          break
+        }
+      }
+
+      if (encoded.byteLength > maxBytes) {
+        const frames = rgba.frames.slice(0, 50).filter((frame, index) => index % 2 === 0)
+        const capped = { ...rgba, frames }
+        encoded = await _encodeRGBA(capped, mimetype, { quality })
+      }
+
+      if (encoded.byteLength > maxBytes) {
+        const oneFrame = { ...rgba, frames: rgba.frames.slice(0, 1) }
+        encoded = await _encodeRGBA(oneFrame, mimetype)
+      }
+    }
+
+    if (encoded.byteLength > maxBytes) {
+      throw new Error(
+        `Could not create preview under maxBytes, reached ${encoded.byteLength} bytes`
+      )
+    }
+  }
+
+  return encoded
+}
+
+async function crop(rgba, opts = {}) {
+  const { left, top, width, height } = opts
+
+  if (
+    left < 0 ||
+    top < 0 ||
+    width <= 0 ||
+    height <= 0 ||
+    left + width > rgba.width ||
+    top + height > rgba.height
+  ) {
+    throw new Error('Crop rectangle out of bounds')
+  }
+
+  const data = Buffer.alloc(width * height * 4)
+
+  for (let y = 0; y < height; y++) {
+    for (let x = 0; x < width; x++) {
+      const srcIndex = ((y + top) * rgba.width + (x + left)) * 4
+      const dstIndex = (y * width + x) * 4
+
+      data[dstIndex] = rgba.data[srcIndex]
+      data[dstIndex + 1] = rgba.data[srcIndex + 1]
+      data[dstIndex + 2] = rgba.data[srcIndex + 2]
+      data[dstIndex + 3] = rgba.data[srcIndex + 3]
+    }
+  }
+
+  return { width, height, data }
+}
+
+async function resize(rgba, opts = {}) {
+  const { maxWidth, maxHeight } = opts
+  const { width, height } = rgba
+
+  let maybeResizedRGBA
+
+  if (maxWidth && maxHeight && (width > maxWidth || height > maxHeight)) {
+    const { resize } = await import('bare-image-resample')
+    const dimensions = calculateFitDimensions(width, height, maxWidth, maxHeight)
+    if (Array.isArray(rgba.frames)) {
+      const frames = []
+      for (const frame of rgba.frames) {
+        const resized = resize(frame, dimensions.width, dimensions.height)
+        frames.push({ ...resized, timestamp: frame.timestamp })
+      }
+      maybeResizedRGBA = {
+        width: frames[0].width,
+        height: frames[0].height,
+        loops: rgba.loops,
+        frames
+      }
+    } else {
+      maybeResizedRGBA = resize(rgba, dimensions.width, dimensions.height)
+    }
+  } else {
+    maybeResizedRGBA = rgba
+  }
+
+  return maybeResizedRGBA
+}
+
+function slice(rgba, opts = {}) {
+  if (Array.isArray(rgba.frames)) {
+    let { start = 0, end = rgba.frames.length } = opts
+
+    start = Math.max(0, start)
+    end = Math.max(0, end)
+
+    if (start >= end) {
+      throw new Error('slice(): "start" must be less than "end"')
+    }
+
+    return {
+      ...rgba,
+      frames: rgba.frames.slice(start, end)
+    }
+  }
+
+  return rgba
+}
+
+async function _encodeRGBA(rgba, mimetype, opts) {
+  const codec = await importCodec(mimetype)
+
+  let encoded
+  if (Array.isArray(rgba.frames)) {
+    encoded = codec.encodeAnimated(rgba, opts)
+  } else {
+    encoded = codec.encode(rgba, opts)
+  }
+
+  return encoded
+}
+
+class ImagePipeline {
+  constructor(input) {
+    this.input = input
+    this.steps = []
+
+    const methods = ['decode', 'resize', 'crop', 'slice', 'encode']
+    for (let method of methods) {
+      this[method] = (opts) => {
+        this.steps.push({ op: method, opts })
+        return this
+      }
+    }
+  }
+
+  async then(resolve, reject) {
+    try {
+      let buffer = await read(this.input)
+
+      for (const step of this.steps) {
+        if (step.op === 'decode') {
+          buffer = await decode(buffer, step.opts)
+        }
+
+        if (step.op === 'resize') {
+          buffer = await resize(buffer, step.opts)
+        }
+
+        if (step.op === 'crop') {
+          buffer = await crop(buffer, step.opts)
+        }
+
+        if (step.op === 'slice') {
+          buffer = slice(buffer, step.opts)
+        }
+
+        if (step.op === 'encode') {
+          buffer = await encode(buffer, step.opts)
+        }
+      }
+
+      resolve(buffer)
+    } catch (err) {
+      reject(err)
+    }
+  }
+
+  async save(filename, opts) {
+    const buffer = await this
+    return save(filename, buffer, opts)
+  }
+}
+
+function image(input) {
+  return new ImagePipeline(input)
+}
+
+image.read = read
+image.save = save
+image.decode = decode
+image.resize = resize
+image.crop = crop
+image.slice = slice
+image.encode = encode
+
+export { image }

package/src/util.js

@@ -0,0 +1,30 @@
+import getMimeType from 'get-mime-type'
+import getFileFormat from 'get-file-format'
+
+export function detectMimeType(buffer) {
+  return getMimeType(getFileFormat(buffer))
+}
+
+export function calculateFitDimensions(width, height, maxWidth, maxHeight) {
+  if (width <= maxWidth && height <= maxHeight) {
+    return { width, height }
+  }
+
+  const widthRatio = maxWidth / width
+  const heightRatio = maxHeight / height
+  const ratio = Math.min(widthRatio, heightRatio)
+
+  return {
+    width: Math.round(width * ratio),
+    height: Math.round(height * ratio)
+  }
+}
+
+export function isHttpUrl(value) {
+  try {
+    const url = new URL(value)
+    return url.protocol === 'http:' || url.protocol === 'https:'
+  } catch {
+    return false
+  }
+}