mirror of
https://git.haroon.hackclub.app/haroon/Battler-Generator.git
synced 2025-06-25 06:14:20 +00:00
stuff from before
This commit is contained in:
commit
0ee0fa5a53
337 changed files with 1327 additions and 0 deletions
117
utils.ts
Normal file
117
utils.ts
Normal file
|
@ -0,0 +1,117 @@
|
|||
import { Canvas, createCanvas, loadImage, GlobalFonts, SKRSContext2D } from "@napi-rs/canvas";
|
||||
import {
|
||||
GenerateBattlerOptions,
|
||||
Colour,
|
||||
Opponents,
|
||||
PlayerActions,
|
||||
} from "./types";
|
||||
|
||||
export const validColours = Object.entries(Colour).map((x) => x[0]);
|
||||
export const validOpponents = Object.entries(Opponents).map((x) => x[0]);
|
||||
export const validPlayerActions = Object.entries(PlayerActions).map((x) => x[1]);
|
||||
|
||||
export async function generateBattler(
|
||||
opts: GenerateBattlerOptions & { direction?: "right" | "left" },
|
||||
): Promise<Canvas> {
|
||||
// Image dimensions
|
||||
const canvas = createCanvas(1280, 1280);
|
||||
const context = canvas.getContext("2d");
|
||||
if (!validColours.includes(opts.colour)) opts.colour = Colour.Black;
|
||||
|
||||
// Load + draw the necessary images
|
||||
|
||||
// [Glow]
|
||||
if (opts.glow && opts.glow !== "None") {
|
||||
const glow = await loadImage(`./assets/glows/${opts.glow}.png`);
|
||||
context.drawImage(glow, 0, 0, canvas.width, canvas.height);
|
||||
}
|
||||
|
||||
// [Back]
|
||||
if (opts.back && opts.back !== "None") {
|
||||
const back = await loadImage(`./assets/backs/${opts.back}.png`)
|
||||
context.drawImage(back, 0, 0, canvas.width, canvas.height)
|
||||
}
|
||||
|
||||
// [Base]
|
||||
const base = await loadImage(`./assets/bases/${opts.colour || "Black"}.png`);
|
||||
context.drawImage(base, 0, 0, canvas.width, canvas.height);
|
||||
|
||||
// [Face]
|
||||
if (opts.face && opts.face !== "None") {
|
||||
const face = await loadImage(`./assets/faces/${opts.face}.png`);
|
||||
context.drawImage(face, 0, 0, canvas.width, canvas.height);
|
||||
}
|
||||
|
||||
// [Hat]
|
||||
if (opts.hat && opts.hat !== "None") {
|
||||
const hat = await loadImage(`./assets/hats/${opts.hat}.png`);
|
||||
context.drawImage(hat, 0, 0, canvas.width, canvas.height);
|
||||
}
|
||||
|
||||
// [Eyes]
|
||||
if (opts.eye && opts.eye !== "None") {
|
||||
const eye = await loadImage(`./assets/eyes/${opts.eye}.png`);
|
||||
context.drawImage(eye, 0, 0, canvas.width, canvas.height);
|
||||
}
|
||||
|
||||
// [Bottom]
|
||||
if (opts.bottom && opts.bottom !== "None") {
|
||||
const bottom = await loadImage(`./assets/bottoms/${opts.bottom}.png`);
|
||||
context.drawImage(bottom, 0, 0, canvas.width, canvas.height);
|
||||
}
|
||||
|
||||
// [Top]
|
||||
if (opts.top && opts.top !== "None") {
|
||||
const top = await loadImage(`./assets/tops/${opts.top}.png`);
|
||||
context.drawImage(top, 0, 0, canvas.width, canvas.height);
|
||||
}
|
||||
|
||||
// [Neck]
|
||||
if (opts.neck && opts.neck !== "None") {
|
||||
const neck = await loadImage(`./assets/necks/${opts.neck}.png`)
|
||||
context.drawImage(neck, 0, 0, canvas.width, canvas.height)
|
||||
}
|
||||
|
||||
// [Buddy]
|
||||
if (opts.buddy && opts.buddy !== "None") {
|
||||
const buddy = await loadImage(`./assets/buddies/${opts.buddy}.png`)
|
||||
context.drawImage(buddy, 0, 0, canvas.width, canvas.height)
|
||||
}
|
||||
|
||||
if (opts.direction && opts.direction == "left") {
|
||||
let flipped = createCanvas(1280, 1280);
|
||||
let flippedCtx = flipped.getContext("2d");
|
||||
|
||||
flippedCtx.scale(-1, 1);
|
||||
flippedCtx.drawImage(canvas, -canvas.width, 0, canvas.width, canvas.height);
|
||||
|
||||
return flipped;
|
||||
}
|
||||
|
||||
return canvas;
|
||||
}
|
||||
|
||||
export function drawText(pos: [number, number], text: string, colour: string, outline: { colour: string, width: number }, ctx: SKRSContext2D) {
|
||||
ctx.strokeStyle = outline.colour;
|
||||
ctx.lineWidth = outline.width;
|
||||
ctx.fillStyle = colour;
|
||||
|
||||
ctx.strokeText(text, pos[0], pos[1])
|
||||
ctx.fillText(text, pos[0], pos[1])
|
||||
}
|
||||
|
||||
export const applyText = (canvas: Canvas, text: string, width: number) => {
|
||||
const context = canvas.getContext('2d');
|
||||
|
||||
// Declare a base size of the font
|
||||
let fontSize = 175;
|
||||
|
||||
do {
|
||||
// Assign the font to the context and decrement it so it can be measured again
|
||||
context.font = `${fontSize -= 10}px Lilita One`;
|
||||
// Compare pixel width of the text to the canvas minus the approximate avatar size
|
||||
} while (context.measureText(text).width > width);
|
||||
|
||||
// Return the result to use in the actual canvas
|
||||
return context.font;
|
||||
};
|
Loading…
Add table
Add a link
Reference in a new issue