out-of-your-element/m2d/converters/emoji-sheet.js

105 lines
3.5 KiB
JavaScript
Raw Normal View History

// @ts-check
const assert = require("assert").strict
const {pipeline} = require("stream").promises
const sharp = require("sharp")
const {GIFrame} = require("giframe")
const utils = require("./utils")
const fetch = require("node-fetch").default
const streamMimeType = require("stream-mime-type")
const SIZE = 48
const RESULT_WIDTH = 400
const IMAGES_ACROSS = Math.floor(RESULT_WIDTH / SIZE)
/**
* Composite a bunch of Matrix emojis into a kind of spritesheet image to upload to Discord.
* @param {string[]} mxcs mxc URLs, in order
* @returns {Promise<Buffer>} PNG image
*/
async function compositeMatrixEmojis(mxcs) {
let buffers = await Promise.all(mxcs.map(async mxc => {
const abortController = new AbortController()
try {
const url = utils.getPublicUrlForMxc(mxc)
assert(url)
/** @type {import("node-fetch").Response} res */
// If it turns out to be a GIF, we want to abandon the connection without downloading the whole thing.
// If we were using connection pooling, we would be forced to download the entire GIF.
// So we set no agent to ensure we are not connection pooling.
// @ts-ignore the signal is slightly different from the type it wants (still works fine)
const res = await fetch(url, {agent: false, signal: abortController.signal})
const {stream, mime} = await streamMimeType.getMimeType(res.body)
if (mime === "image/png" || mime === "image/jpeg" || mime === "image/webp") {
/** @type {{info: sharp.OutputInfo, buffer: Buffer}} */
const result = await new Promise((resolve, reject) => {
const transformer = sharp()
2023-09-27 10:23:46 +00:00
.resize(SIZE, SIZE, {fit: "contain", background: {r: 0, g: 0, b: 0, alpha: 0}})
.png({compressionLevel: 0})
.toBuffer((err, buffer, info) => {
2023-10-07 09:47:31 +00:00
/* c8 ignore next */
if (err) return reject(err)
resolve({info, buffer})
})
pipeline(
stream,
transformer
)
})
return result.buffer
} else if (mime === "image/gif") {
const giframe = new GIFrame(0)
stream.on("data", chunk => {
giframe.feed(chunk)
})
const frame = await giframe.getFrame()
const buffer = await sharp(frame.pixels, {raw: {width: frame.width, height: frame.height, channels: 4}})
.resize(SIZE, SIZE, {fit: "contain", background: {r: 0, g: 0, b: 0, alpha: 0}})
.png({compressionLevel: 0})
.toBuffer({resolveWithObject: true})
return buffer.data
} else {
// unsupported mime type
console.error(`I don't know what a ${mime} emoji is.`)
return null
}
} finally {
abortController.abort()
}
}))
2023-10-07 09:47:31 +00:00
// Calculate the size of the final composited image
const totalWidth = Math.min(buffers.length, IMAGES_ACROSS) * SIZE
const imagesDown = Math.ceil(buffers.length / IMAGES_ACROSS)
const totalHeight = imagesDown * SIZE
const comp = []
let left = 0, top = 0
for (const buffer of buffers) {
if (Buffer.isBuffer(buffer)) {
2023-10-07 09:47:31 +00:00
// Composite the current buffer into the sprite sheet
comp.push({left, top, input: buffer})
2023-10-07 09:47:31 +00:00
// The next buffer should be placed one slot to the right
left += SIZE
// If we're out of space to fit the entire next buffer there, wrap to the next line
if (left + SIZE > RESULT_WIDTH) {
left = 0
top += SIZE
}
}
}
const output = await sharp({create: {width: totalWidth, height: totalHeight, channels: 4, background: {r: 0, g: 0, b: 0, alpha: 0}}})
.composite(comp)
.png()
.toBuffer({resolveWithObject: true})
return output.data
}
module.exports.compositeMatrixEmojis = compositeMatrixEmojis