Add image grid to the series view command (#294)
All checks were successful
Deploy To Stage / build (push) Successful in 10s
Deploy To Stage / deploy (push) Successful in 16s

- Add the image grid to the series view command
- Moved the image generation logic to its own class so we can have common logic between them
- Fixed a bug where paginated commands that deferred (series view, inventory) were creating new messages, rather than updating

#279

Reviewed-on: #294
Reviewed-by: VylpesTester <tester@vylpes.com>
Co-authored-by: Ethan Lane <ethan@vylpes.com>
Co-committed-by: Ethan Lane <ethan@vylpes.com>
This commit is contained in:
Ethan Lane 2024-07-09 17:45:50 +01:00 committed by Vylpes
parent 1b9857dfe5
commit acfdcb17f2
6 changed files with 72 additions and 51 deletions

View file

@ -5,8 +5,7 @@ import EmbedColours from "../constants/EmbedColours";
import { CardRarity, CardRarityToString } from "../constants/CardRarity";
import cloneDeep from "clone-deep";
import AppLogger from "../client/appLogger";
import { createCanvas, loadImage } from "canvas";
import path from "path";
import ImageHelper from "./ImageHelper";
interface InventoryPage {
id: number,
@ -113,44 +112,9 @@ export default class InventoryHelper {
.setStyle(ButtonStyle.Primary)
.setDisabled(page + 1 == pages.length));
const buffer = await this.GenerateInventoryImage(currentPage);
const buffer = await ImageHelper.GenerateCardImageGrid(currentPage.cards.map(x => x.path));
const image = new AttachmentBuilder(buffer, { name: "page.png" });
return { embed, row, image };
}
private static async GenerateInventoryImage(page: InventoryPage): Promise<Buffer> {
const gridWidth = 3;
const gridHeight = Math.ceil(page.cards.length / gridWidth);
const imageWidth = 526;
const imageHeight = 712;
const canvasWidth = imageWidth * gridWidth;
const canvasHeight = imageHeight * gridHeight;
const canvas = createCanvas(canvasWidth, canvasHeight);
const ctx = canvas.getContext("2d");
for (let i = 0; i < page.cards.length; i++) {
const card = page.cards[i];
const image = await loadImage(path.join(process.env.DATA_DIR!, "cards", card.path));
if (!image) {
AppLogger.LogError("InventoryHelper/GenerateInventoryImage", `Failed to load image for card ${card.id}`);
continue;
}
const x = i % gridWidth;
const y = Math.floor(i / gridWidth);
const imageX = imageWidth * x;
const imageY = imageHeight * y;
ctx.drawImage(image, imageX, imageY);
}
return canvas.toBuffer();
}
}