bare-media 1.7.0 → 2.0.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,74 +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
 
-## API
+| Parameter        | Type   | Description                                               |
+| ---------------- | ------ | --------------------------------------------------------- |
+| `buffer`         | object | The encoded image                                         |
+| `opts.maxFrames` | number | Max number of frames to decode in case of animated images |
 
-> See [schema.js](shared/spec/schema.js) for the complete reference of parameters
+### encode()
 
-### createPreview()
+Encodes an image to a specific format
 
-Create a preview from a media file
+| 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                                                 |
 
-| 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()
 
-### decodeImage()
+Crop an image
 
-Decode an image to RGBA
+| 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 |
+
+### resize()
+
+Resize an image
+
+| 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 |
+
+### 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         |
+- `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,22 +1,31 @@
 {
   "name": "bare-media",
-  "version": "1.7.0",
+  "version": "2.0.0",
   "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": "lunte",
-    "test": "npm run lint && npm run format:check && brittle-bare test/index.js"
+    "lint": "npm run format:check && lunte",
+    "test": "brittle-bare test/index.js"
   },
   "keywords": [],
   "author": "Holepunch Inc",
   "license": "Apache-2.0",
   "description": "",
   "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",
@@ -25,28 +34,19 @@
     "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,26 @@
+import { IMAGE } from '../types'
+
+export const codecs = {
+  [IMAGE.AVIF]: () => import('bare-heif'),
+  [IMAGE.GIF]: () => import('bare-gif'),
+  [IMAGE.BMP]: () => import('bare-bmp'),
+  [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.WEBP]: () => import('bare-webp'),
+  [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/{worker → src}/util.js

@@ -1,10 +1,8 @@
 import getMimeType from 'get-mime-type'
 import getFileFormat from 'get-file-format'
 
-export const log = (...args) => console.log('[bare-media]', ...args)
-
-export function detectMimeType(buffer, path) {
-  return getMimeType(getFileFormat(buffer)) || getMimeType(path)
+export function detectMimeType(buffer) {
+  return getMimeType(getFileFormat(buffer))
 }
 
 export function calculateFitDimensions(width, height, maxWidth, maxHeight) {
@@ -21,3 +19,12 @@ export function calculateFitDimensions(width, height, maxWidth, maxHeight) {
     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
+  }
+}

package/src/video.js

@@ -0,0 +1,112 @@
+import fs from 'bare-fs'
+import ffmpeg from 'bare-ffmpeg'
+
+function extractFrames(fd, opts = {}) {
+  const { frameIndex } = opts
+
+  const fileSize = fs.fstatSync(fd).size
+  let offset = 0
+
+  const io = new ffmpeg.IOContext(4096, {
+    onread: (buffer, requested) => {
+      const read = fs.readSync(fd, buffer, 0, requested, offset)
+      if (read === 0) return 0
+      offset += read
+      return read
+    },
+    onseek: (o, whence) => {
+      if (whence === ffmpeg.constants.seek.SIZE) return fileSize
+      if (whence === ffmpeg.constants.seek.SET) offset = o
+      else if (whence === ffmpeg.constants.seek.CUR) offset += o
+      else if (whence === ffmpeg.constants.seek.END) offset = fileSize + o
+      else return -1
+      return offset
+    }
+  })
+
+  using inputFormat = new ffmpeg.InputFormatContext(io)
+  const stream = inputFormat.getBestStream(ffmpeg.constants.mediaTypes.VIDEO)
+  const decoder = stream.decoder()
+  decoder.open()
+
+  using packet = new ffmpeg.Packet()
+  using frame = new ffmpeg.Frame()
+
+  let currentFrame = 0
+  let result = null
+
+  while (inputFormat.readFrame(packet)) {
+    if (packet.streamIndex === stream.index) {
+      if (decoder.sendPacket(packet)) {
+        while (decoder.receiveFrame(frame)) {
+          if (currentFrame === frameIndex) {
+            // Convert to RGBA
+            using scaler = new ffmpeg.Scaler(
+              frame.format,
+              frame.width,
+              frame.height,
+              ffmpeg.constants.pixelFormats.RGBA,
+              frame.width,
+              frame.height
+            )
+
+            using rgbaFrame = new ffmpeg.Frame()
+            rgbaFrame.width = frame.width
+            rgbaFrame.height = frame.height
+            rgbaFrame.format = ffmpeg.constants.pixelFormats.RGBA
+            rgbaFrame.alloc()
+
+            scaler.scale(frame, rgbaFrame)
+
+            const image = new ffmpeg.Image(
+              ffmpeg.constants.pixelFormats.RGBA,
+              rgbaFrame.width,
+              rgbaFrame.height
+            )
+            image.read(rgbaFrame)
+
+            result = {
+              width: rgbaFrame.width,
+              height: rgbaFrame.height,
+              data: image.data
+            }
+            break
+          }
+          currentFrame++
+        }
+      }
+    }
+    packet.unref()
+    if (result) break
+  }
+
+  decoder.destroy()
+
+  if (!result) {
+    throw new Error(`Frame ${frameIndex} not found (video only has ${currentFrame} frames)`)
+  }
+
+  return result
+}
+
+class VideoPipeline {
+  constructor(input) {
+    this.input = input
+    this.steps = []
+  }
+
+  extractFrames(opts) {
+    const fd = fs.openSync(this.input, 'r')
+    const result = extractFrames(fd, opts)
+    fs.closeSync(fd)
+    return result
+  }
+}
+
+function video(input) {
+  return new VideoPipeline(input)
+}
+
+video.extractFrames = extractFrames
+
+export { video }