half working frame rendering

This commit is contained in:
Elijah R 2024-07-09 19:47:10 -04:00
parent 5d5f620fec
commit 9f211ec36a
3 changed files with 52 additions and 3 deletions

45
msagent.js/src/agent.ts Normal file
View file

@ -0,0 +1,45 @@
import { AcsData } from "./character.js";
import { AcsAnimationFrameInfo } from "./structs/animation.js";
export class Agent {
private data: AcsData;
private cnv: HTMLCanvasElement;
private ctx: CanvasRenderingContext2D;
constructor(data: AcsData) {
this.data = data;
this.cnv = document.createElement("canvas");
this.ctx = this.cnv.getContext("2d")!;
this.cnv.width = data.characterInfo.charWidth;
this.cnv.height = data.characterInfo.charHeight;
this.cnv.style.position = "fixed";
this.hide();
this.renderFrame(this.data.animInfo[0].animationData.frameInfo[0]);
}
private renderFrame(frame: AcsAnimationFrameInfo) {
for (const mimg of frame.images) {
const img = this.data.images[mimg.imageIndex];
let data = this.ctx.createImageData(img.image.width, img.image.height);
for (let i = 0; i < img.image.data.length; i++) {
let px = this.data.characterInfo.palette[img.image.data[i]];
data.data[(i * 4)] = px.r;
data.data[(i * 4) + 1] = px.g;
data.data[(i * 4) + 2] = px.b;
data.data[(i * 4) + 3] = px.a;
}
this.ctx.putImageData(data, mimg.xOffset, mimg.yOffset);
}
}
addToDom(parent: HTMLElement = document.body) {
parent.appendChild(this.cnv);
}
show() {
this.cnv.style.display = "block";
}
hide() {
this.cnv.style.display = "none";
}
}

View file

@ -4,9 +4,10 @@ import { LOCATION } from './structs/core.js';
import { AcsCharacterInfo } from './structs/character.js';
import { AcsAnimationEntry } from './structs/animation.js';
import { AcsImageEntry } from './structs/image.js';
import { Agent } from './agent.js';
// Experiment for storing parsed data
class AcsData {
export class AcsData {
characterInfo = new AcsCharacterInfo();
animInfo: AcsAnimationEntry[] = [];
images: AcsImageEntry[] = [];
@ -53,12 +54,13 @@ function agentCharacterParseACS(buffer: BufferStream) {
});
console.log(acsData);
return acsData;
}
// For the testbed code only, remove when that gets axed
// (or don't, I'm not your dad)
export function agentParseCharacterTestbed(buffer: Uint8Array) {
return agentCharacterParseACS(new BufferStream(buffer));
return new Agent(agentCharacterParseACS(new BufferStream(buffer)));
}
// TODO this will be the public API

View file

@ -11,7 +11,9 @@ input.addEventListener("change", async () => {
let buffer = await input.files![0].arrayBuffer();
console.log("About to parse character");
msagent.agentParseCharacterTestbed(new Uint8Array(buffer));
let agent = msagent.agentParseCharacterTestbed(new Uint8Array(buffer));
agent.addToDom(document.body);
agent.show();
console.log("parsed character");
})