msagent.js/.gitignore

@@ -0,0 +1 @@
+core/obj

msagent.js/README.md

@@ -1 +1,10 @@
 # msagent.js
+
+This project is split up into two subcompoennts:
+
+- `@msagent.js/core` contains the core inner workings. This is everything that works on either the Web or node.js.
+
+- `@msagent.js/web` contains most of the public API that msagent.js has exported.
+
+
+The web project is implicitly dependent on the core project. Do not introduce code that requires Web APIs in the core.

msagent.js/core/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "@msagent.js/core",
+  "description": "msagent.js core. Provides structures, parsing, and bitmap utilties for higher level usage",
+  "version": "0.1.0",
+  "packageManager": "yarn@4.2.2",
+  "devDependencies": {
+    "@parcel/core": "^2.12.0",
+    "parcel": "^2.12.0",
+    "typescript": "^5.5.3"
+  },
+  "scripts": {
+    "build": "parcel build"
+  },
+  "type": "module",
+  "source": "src/index.ts",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts"
+}

msagent.js/core/src/buffer.ts

@@ -94,8 +94,13 @@ export class BufferStream {
 	withOffset(where: number, cb: () => void) {
 		let last = this.tell();
 		this.seek(where, SeekDir.BEG);
-		cb();
-		this.seek(last, SeekDir.BEG);
+		try {
+			cb();
+		} catch(_) {
+			throw _;
+		} finally {
+			this.seek(last, SeekDir.BEG);
+		}
 	}
 
 	readBool(): boolean {

msagent.js/core/src/decompress.cpp

@@ -2,17 +2,25 @@
 // Integer types from WASI-libc
 using usize = unsigned int;
 using u32 = unsigned int;
+using u16 = unsigned short;
 using u8 = unsigned char;
 
-#define LOWORD(x) (x & 0xffff)
-#define LOBYTE(x) (x & 0xff)
+template<class T>
+constexpr auto LowOrderShortOf(T item) {
+	return static_cast<u16>(item & 0xffff);
+}
 
-#define PUBLIC __attribute__((visibility("default"))) extern "C"
+template<class T>
+constexpr auto LowOrderByteOf(T item) {
+	return static_cast<u8>(item & 0xff);
+}
 
-PUBLIC usize agentDecompressWASM(const void* pSrcData, usize pSrcSize, void* pTrgData, usize pTrgSize) {
-	const u8* lSrcPtr = (const u8*)pSrcData;
+#define PUBLIC extern "C" __attribute__((visibility("default")))
+
+PUBLIC usize agentDecompressWASM(const u8* pSrcData, usize pSrcSize, u8* pTrgData, usize pTrgSize) {
+	const u8* lSrcPtr = pSrcData;
 	const u8* lSrcEnd = lSrcPtr + pSrcSize;
-	u8* lTrgPtr = (u8*)pTrgData;
+	u8* lTrgPtr = pTrgData;
 	u8* lTrgEnd = lTrgPtr + pTrgSize;
 	u32 lSrcQuad;
 	u8 lTrgByte;
@@ -38,15 +46,15 @@ PUBLIC usize agentDecompressWASM(const void* pSrcData, usize pSrcSize, void* pTr
 	lSrcPtr += 5;
 
 	while((lSrcPtr < lSrcEnd) && (lTrgPtr < lTrgEnd)) {
-		lSrcQuad = *(const u32*)(lSrcPtr - sizeof(u32));
+		lSrcQuad = *reinterpret_cast<const u32*>(lSrcPtr - sizeof(u32));
 
-		if(lSrcQuad & (1 << LOWORD(lBitCount))) {
+		if(lSrcQuad & (1 << LowOrderShortOf(lBitCount))) {
 			lSrcOffset = 1;
 
-			if(lSrcQuad & (1 << LOWORD(lBitCount + 1))) {
-				if(lSrcQuad & (1 << LOWORD(lBitCount + 2))) {
-					if(lSrcQuad & (1 << LOWORD(lBitCount + 3))) {
-						lSrcQuad >>= LOWORD(lBitCount + 4);
+			if(lSrcQuad & (1 << LowOrderShortOf(lBitCount + 1))) {
+				if(lSrcQuad & (1 << LowOrderShortOf(lBitCount + 2))) {
+					if(lSrcQuad & (1 << LowOrderShortOf(lBitCount + 3))) {
+						lSrcQuad >>= LowOrderShortOf(lBitCount + 4);
 						lSrcQuad &= 0x000FFFFF;
 						if(lSrcQuad == 0x000FFFFF) {
 							break;
@@ -56,19 +64,19 @@ PUBLIC usize agentDecompressWASM(const void* pSrcData, usize pSrcSize, void* pTr
 
 						lSrcOffset = 2;
 					} else {
-						lSrcQuad >>= LOWORD(lBitCount + 4);
+						lSrcQuad >>= LowOrderShortOf(lBitCount + 4);
 						lSrcQuad &= 0x00000FFF;
 						lSrcQuad += 577;
 						lBitCount += 16;
 					}
 				} else {
-					lSrcQuad >>= LOWORD(lBitCount + 3);
+					lSrcQuad >>= LowOrderShortOf(lBitCount + 3);
 					lSrcQuad &= 0x000001FF;
 					lSrcQuad += 65;
 					lBitCount += 12;
 				}
 			} else {
-				lSrcQuad >>= LOWORD(lBitCount + 2);
+				lSrcQuad >>= LowOrderShortOf(lBitCount + 2);
 				lSrcQuad &= 0x0000003F;
 				lSrcQuad += 1;
 				lBitCount += 8;
@@ -76,16 +84,16 @@ PUBLIC usize agentDecompressWASM(const void* pSrcData, usize pSrcSize, void* pTr
 
 			lSrcPtr += (lBitCount / 8);
 			lBitCount &= 7;
-			lRunLgth = *(const u32*)(lSrcPtr - sizeof(u32));
+			lRunLgth = *reinterpret_cast<const u32*>(lSrcPtr - sizeof(u32));
 			lRunCount = 0;
-			while(lRunLgth & (1 << LOWORD(lBitCount + lRunCount))) {
+			while(lRunLgth & (1 << LowOrderShortOf(lBitCount + lRunCount))) {
 				lRunCount++;
 				if(lRunCount > 11) {
 					break;
 				}
 			}
 
-			lRunLgth >>= LOWORD(lBitCount + lRunCount + 1);
+			lRunLgth >>= LowOrderShortOf(lBitCount + lRunCount + 1);
 			lRunLgth &= (1 << lRunCount) - 1;
 			lRunLgth += 1 << lRunCount;
 			lRunLgth += lSrcOffset;
@@ -103,10 +111,10 @@ PUBLIC usize agentDecompressWASM(const void* pSrcData, usize pSrcSize, void* pTr
 				lRunLgth--;
 			}
 		} else {
-			lSrcQuad >>= LOWORD(lBitCount + 1);
+			lSrcQuad >>= LowOrderShortOf(lBitCount + 1);
 			lBitCount += 9;
 
-			lTrgByte = LOBYTE(lSrcQuad);
+			lTrgByte = LowOrderByteOf(lSrcQuad);
 			*(lTrgPtr++) = lTrgByte;
 		}
 
@@ -114,5 +122,5 @@ PUBLIC usize agentDecompressWASM(const void* pSrcData, usize pSrcSize, void* pTr
 		lBitCount &= 7;
 	}
 
-	return (usize)(lTrgPtr - (u8*)pTrgData);
+	return static_cast<usize>(lTrgPtr - pTrgData);
 }

msagent.js/core/src/decompress.ts

@@ -0,0 +1,48 @@
+import { WasmModule, WebassemblyOwnMemoryExports } from './wasm_module';
+
+// WASM exports for the decompression module.
+interface CompressWasmExports extends WebassemblyOwnMemoryExports {
+	agentDecompressWASM: (pSource: number, sourceLen: number, pDest: number, destLen: number) => number;
+}
+
+let compressWasm = new WasmModule<CompressWasmExports>(new URL('decompress.wasm', import.meta.url));
+
+// Initalize the decompression module
+export async function compressInit() {
+	await compressWasm.Initalize();
+}
+
+function compressWasmGetExports() {
+	return compressWasm.Exports;
+}
+
+function compressWASMGetMemory(): WebAssembly.Memory {
+	return compressWasmGetExports().memory;
+}
+
+// debugging
+//(window as any).DEBUGcompressGetWASM = () => {
+//	return compressWasm;
+//}
+
+// Decompress Agent compressed data. This compression algorithm sucks.
+// [dest] is to be preallocated to the decompressed data size.
+export function compressDecompress(src: Uint8Array, dest: Uint8Array) {
+	// Grow the WASM heap if needed.
+	compressWasm.growHeapTo(src.length + dest.length);
+
+	let memory = compressWASMGetMemory();
+	let copyBuffer = new Uint8Array(memory.buffer);
+
+	// Copy source to memory[0]. This will make things a bit simpler
+	copyBuffer.set(src, 0);
+
+	// Call the WASM compression routine
+	let nrBytesDecompressed = compressWasmGetExports().agentDecompressWASM(0, src.length, src.length, dest.length);
+
+	if (nrBytesDecompressed != dest.length) throw new Error(`Decompression failed: Output ${nrBytesDecompressed} != expected ${dest.length}`);
+
+	// The uncompressed data is located at memory[src.length..dest.length].
+	// Copy it into the destination buffer.
+	dest.set(copyBuffer.slice(src.length, src.length + dest.length), 0);
+}

msagent.js/core/src/image.ts

@@ -0,0 +1,35 @@
+import { AcsImageEntry } from './structs/image';
+import { RGBAColor } from './structs/core';
+
+// probably should be in a utility module
+function dwAlign(off: number): number {
+	let ul = off >>> 0;
+
+	ul += 3;
+	ul >>= 2;
+	ul <<= 2;
+	return ul;
+}
+
+/// Draws an ACS image to a newly allocated buffer.
+/// This function normalizes the agent 8bpp DIB format to a saner RGBA format,
+/// that can be directly converted to an ImageData for drawing to a web canvas.
+///
+/// However, that should be done (and is done) by a higher level web layer.
+export function imageDrawToBuffer(imageEntry: AcsImageEntry, palette: RGBAColor[]) {
+	let rgbaBuffer = new Uint32Array(imageEntry.image.width * imageEntry.image.height);
+	let buffer = imageEntry.image.data;
+
+	// Next, draw the rows converted to RGBA, top down (so it's drawn correctly,
+	// and in the RGBA format we want to return)
+	for (let y = 0; y < imageEntry.image.height - 1; ++y) {
+		// flip y so it's all top down properly
+		let yy = imageEntry.image.height - 1 - y;
+		let rowStartOffset = yy * dwAlign(imageEntry.image.width);
+
+		for (let x = 0; x < imageEntry.image.width; ++x) {
+			rgbaBuffer[y * imageEntry.image.width + x] = palette[buffer[rowStartOffset + x]].to_rgba();
+		}
+	}
+	return rgbaBuffer;
+}

msagent.js/core/src/index.ts

@@ -0,0 +1,13 @@
+export * from './buffer.js';
+
+// structs
+export * from './structs/core.js';
+export * from './structs/character.js';
+export * from './structs/animation.js';
+export * from './structs/image.js';
+
+export * from './types.js';
+export * from './decompress.js';
+
+export * from './image.js';
+export * from './parse.js';

msagent.js/core/src/parse.ts

@@ -4,7 +4,6 @@ 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';
 
 // Data
 export class AcsData {
@@ -13,14 +12,6 @@ export class AcsData {
 	images: AcsImageEntry[] = [];
 }
 
-// Cache of ACS data per character (for agentCreateCharacterFromUrl)
-let acsDataCache = new Map<string, AcsData>();
-
-// Purges the ACS cache.
-export function agentPurgeACSCache() {
-	acsDataCache.clear();
-}
-
 export function agentCharacterParseACS(buffer: BufferStream): AcsData {
 	// Make sure the magic is correct for the ACS file.
 	if (buffer.readU32LE() != 0xabcdabc3) {
@@ -53,23 +44,3 @@ export function agentCharacterParseACS(buffer: BufferStream): AcsData {
 
 	return acsData;
 }
-
-export function agentCreateCharacter(data: AcsData): Agent {
-	return new Agent(data);
-}
-
-export async function agentCreateCharacterFromUrl(url: string): Promise<Agent> {
-	// just return the cache object
-	if (acsDataCache.has(url)) {
-		return agentCreateCharacter(acsDataCache.get(url)!);
-	} else {
-		let res = await fetch(url);
-		let data = await res.arrayBuffer();
-
-		let buffer = new Uint8Array(data);
-		let acsData = agentCharacterParseACS(new BufferStream(buffer));
-
-		acsDataCache.set(url, acsData);
-		return agentCreateCharacter(acsData);
-	}
-}

msagent.js/core/src/structs/animation.ts

@@ -92,7 +92,10 @@ export class AcsAnimationFrameInfo {
 	soundIndex = 0;
 
 	frameDuration = 0; // The duration of the frame in (1/100)th seconds.
-	nextFrame = 0; // -2 = animation has ended (although, I imagine this could be detected in better ways!)
+
+	// Index of frame to go to when exiting a branch
+	// -2 = animation has ended/no exit? idk (although, I imagine this could be detected in better ways!)
+	branchExitFrameIndex = 0; 
 
 	branchInfo: AcsBranchInfo[] = [];
 	overlayInfo: AcsOverlayInfo[] = [];
@@ -106,7 +109,7 @@ export class AcsAnimationFrameInfo {
 
 		info.soundIndex = buffer.readS16LE();
 		info.frameDuration = buffer.readU16LE();
-		info.nextFrame = buffer.readS16LE();
+		info.branchExitFrameIndex = buffer.readS16LE();
 
 		info.branchInfo = buffer.readCountedList(() => {
 			return AcsBranchInfo.read(buffer);

msagent.js/core/src/wasm_module.ts

@@ -0,0 +1,44 @@
+export interface WebassemblyOwnMemoryExports extends WebAssembly.Exports {
+	memory: WebAssembly.Memory;
+}
+
+// A helper for WASM modules.
+// This currently only works for modules that export their own memory,
+// and do not import it.
+//
+// This covers all of the modules in the core so far, so
+// this is perfectly fine, but it's still worth noting.
+export class WasmModule<TExports extends WebassemblyOwnMemoryExports> {
+	private module: WebAssembly.WebAssemblyInstantiatedSource | null = null;
+	private url: URL;
+
+	constructor(url: URL) {
+		this.url = url;
+	}
+
+	async Initalize(): Promise<void> {
+		this.module = await WebAssembly.instantiateStreaming(fetch(this.url));
+	}
+
+	get Module() {
+		if (this.module == null) throw new Error('WasmModule<T> has not been initalized');
+		return this.module;
+	}
+
+	get Exports() {
+		let module = this.Module;
+		return module.instance.exports as TExports;
+	}
+
+    // Grows the WebAssembly heap if required.
+	growHeapTo(newSize: number) {
+		let exports = this.Exports;
+		let memory: WebAssembly.Memory = exports.memory;
+		if (memory.buffer.byteLength < newSize) {
+			// A WebAssembly page is 64kb, so we need to grow at least a single page,
+			// even if it would be relatively wasteful to do so.
+			let npages = Math.floor(newSize / 65535) + 1;
+			memory.grow(npages);
+		}
+	}
+}

msagent.js/src/decompress.ts

@@ -1,55 +0,0 @@
-// Please note that the "meaningless" shifts of 0 are to force
-// the value to be a 32-bit integer. Do not remove them.
-
-let compressWasm: WebAssembly.WebAssemblyInstantiatedSource;
-
-interface CompressWasmExports {
-	memory: WebAssembly.Memory;
-	agentDecompressWASM: any;
-}
-
-// Initalize the decompression module
-export async function compressInit() {
-	let url = new URL('decompress.wasm', import.meta.url);
-	compressWasm = await WebAssembly.instantiateStreaming(fetch(url));
-}
-
-function compressWasmGetExports() {
-	return compressWasm.instance.exports as any as CompressWasmExports;
-}
-
-function compressWASMGetMemory(): WebAssembly.Memory {
-	return compressWasmGetExports().memory;
-}
-
-// debugging
-//(window as any).DEBUGcompressGetWASM = () => {
-//	return compressWasm;
-//}
-
-// Decompress Agent compressed data. This compression algorithm sucks.
-// [dest] is to be preallocated to the decompressed data size.
-export function compressDecompress(src: Uint8Array, dest: Uint8Array) {
-	// Grow the WASM heap if needed. Funnily enough, this code is never hit in most
-	// ACSes, so IDK if it's even needed
-	let memory = compressWASMGetMemory();
-	if (memory.buffer.byteLength < src.length + dest.length) {
-		// A WebAssembly page is 64kb, so we need to grow at least that much
-		let npages = Math.floor((src.length + dest.length) / 65535) + 1;
-		console.log('Need to grow WASM heap', npages, 'pages', '(current byteLength is', memory.buffer.byteLength, ', we need', src.length + dest.length, ')');
-		memory.grow(npages);
-	}
-
-	let copyBuffer = new Uint8Array(memory.buffer);
-
-	// Copy source to memory[0]. This will make things a bit simpler
-	copyBuffer.set(src, 0);
-
-	// Call the WASM compression routine
-	let nrBytesDecompressed = compressWasmGetExports().agentDecompressWASM(0, src.length, src.length, dest.length);
-
-	if (nrBytesDecompressed != dest.length) throw new Error(`decompression failed: ${nrBytesDecompressed} != ${dest.length}`);
-
-	// Dest will be memory[src.length..dest.length]
-	dest.set(copyBuffer.slice(src.length, src.length + dest.length), 0);
-}

msagent.js/web/package.json

@@ -1,7 +1,10 @@
 {
-  "name": "@msagent-chat/msagent.js",
+  "name": "@msagent.js/web",
   "version": "0.1.0",
   "packageManager": "yarn@4.2.2",
+  "dependencies": {
+    "@msagent.js/core": "*"
+  },
   "devDependencies": {
     "@parcel/core": "^2.12.0",
     "parcel": "^2.12.0",

msagent.js/web/src/agent.ts

@@ -1,59 +1,151 @@
-import { BufferStream, SeekDir } from './buffer.js';
-import { AcsData } from './character.js';
+import { AcsBranchInfo, BufferStream, SeekDir, imageDrawToBuffer } from '@msagent.js/core';
+import { AcsData } from '@msagent.js/core';
 import { ContextMenu, ContextMenuItem } from './contextmenu.js';
-import { AcsAnimation, AcsAnimationFrameInfo } from './structs/animation.js';
-import { AcsImageEntry } from './structs/image.js';
-import { Point, Size } from './types.js';
+import { AcsAnimation, AcsAnimationFrameInfo } from '@msagent.js/core';
+import { AcsImageEntry } from '@msagent.js/core';
+import { Point, Size } from '@msagent.js/core';
 import { wordballoonDrawImage, wordballoonDrawText } from './wordballoon.js';
 
-// probably should be in a utility module
-function dwAlign(off: number): number {
-	let ul = off >>> 0;
-
-	ul += 3;
-	ul >>= 2;
-	ul <<= 2;
-	return ul;
-}
-
 function randint(min: number, max: number) {
 	return Math.floor(Math.random() * (max - min) + min);
 }
 
+enum AnimState {
+	Idle = 0,
+	Cancel = 1,
+	Playing = 2
+}
+
+// an externally resolveable promise
+class ExternallyResolveablePromise<T> {
+	private rescb: (t: T) => void;
+	private rejectcb: (e: Error) => void;
+	public promise: Promise<T>;
+
+	constructor() {
+		let rescb;
+		let rejectcb;
+
+		this.promise = new Promise<T>((res, rej) => {
+			rescb = res;
+			rejectcb = rej;
+		});
+
+		this.rescb = rescb!;
+		this.rejectcb = rejectcb!;
+	}
+
+	resolve(t: T) {
+		this.rescb(t);
+	}
+
+	reject(e: Error) {
+		this.rejectcb(e);
+	}
+
+	raw() {
+		return this.promise;
+	}
+}
+
 // animation state (used during animation playback)
 class AgentAnimationState {
 	char: Agent;
 	anim: AcsAnimation;
-	private cancelled: boolean = false;
 
-	finishCallback: () => void;
+	private animState: AnimState;
+	private finishPromise = new ExternallyResolveablePromise<void>();
+
 	frameIndex = 0;
-
 	interval = 0;
 
-	constructor(char: Agent, anim: AcsAnimation, finishCallback: () => void) {
+	constructor(char: Agent, anim: AcsAnimation) {
 		this.char = char;
 		this.anim = anim;
-		this.finishCallback = finishCallback;
+		this.animState = AnimState.Idle;
 	}
 
 	// start playing the animation
-	play() {
+	async play() {
+		this.animState = AnimState.Playing;
 		this.nextFrame();
+		await this.finishPromise.raw();
+
+		this.animState = AnimState.Idle;
+		clearInterval(this.interval);
 	}
 
-	cancel() {
-		this.cancelled = true;
-		clearTimeout(this.interval);
+	async cancel() {
+		this.animState = AnimState.Cancel;
+		await this.finishPromise.raw();
 	}
 
 	nextFrame() {
 		requestAnimationFrame(() => {
-			if (this.cancelled) return;
-			this.char.drawAnimationFrame(this.anim.frameInfo[this.frameIndex++]);
+			// Handle animation branching, if it is required
+			let bi = this.anim.frameInfo[this.frameIndex].branchInfo;
+			if (bi.length != 0) {
+				let biCopy = [...bi];
+
+				// This happens more often then you'd think, but this basically handles
+				// a branch that will always be taken.
+				//
+				// This is often used for looping from my understanding?
+				if (bi.length == 1 && bi[0].branchFrameProbability == 100) {
+					this.frameIndex = bi[0].branchFrameIndex;
+				} else {
+					let probabilityOnlyList = bi.map((bii) => bii.branchFrameProbability);
+					let totalProbability = probabilityOnlyList.reduce((sum, pro) => {
+						return sum + pro;
+					});
+
+					// Handles the off chance that there is a branch info list that sums less than 100%.
+					// (Office Logo 'Idle3', Victor has a couple, ...)
+					//
+					// I'm not entirely sure the correct action in this case but I just
+					// have this do nothing.
+					if (totalProbability != 100) {
+						let nothingBranchItem = new AcsBranchInfo();
+						nothingBranchItem.branchFrameIndex = this.frameIndex;
+						nothingBranchItem.branchFrameProbability = 100 - totalProbability;
+						biCopy.push(nothingBranchItem);
+					}
+
+					// Pick a random branch
+					let randProbability = randint(0, 100);
+					let cumulativeProbability = 0;
+
+					for (const branchItem of biCopy) {
+						cumulativeProbability += branchItem.branchFrameProbability;
+						if (randProbability < cumulativeProbability) {
+							//console.log('picked', branchItem);
+							this.frameIndex = branchItem.branchFrameIndex;
+							break;
+						}
+					}
+				}
+			}
+
+			// Actually draw the requested frame
+			let fi = this.anim.frameInfo[this.frameIndex];
+
+			this.char.drawAnimationFrame(fi);
+
+			// If we've requested to cancel the animation and we're in a branch loop,
+			// then this is how we get out of it.
+			if (this.animState == AnimState.Cancel) {
+				if (fi.branchExitFrameIndex != -2) {
+					this.frameIndex = fi.branchExitFrameIndex;
+				} else {
+					this.finishPromise.resolve();
+					return;
+				}
+			} else {
+				this.frameIndex += 1;
+			}
 
 			if (this.frameIndex >= this.anim.frameInfo.length) {
-				this.finishCallback();
+				this.finishPromise.resolve();
 				return;
 			}
 
@@ -316,34 +408,7 @@ export class Agent {
 
 	// Draw a single image from the agent's image table.
 	drawImage(imageEntry: AcsImageEntry, xOffset: number, yOffset: number) {
-		let rgbaBuffer = new Uint32Array(imageEntry.image.width * imageEntry.image.height);
-
-		let buffer = imageEntry.image.data;
-		let bufStream = new BufferStream(buffer);
-
-		let rows = new Array<Uint8Array>(imageEntry.image.height - 1);
-
-		// Read all the rows bottom-up first. This idiosyncracy is due to the fact
-		// that the bitmap data is actually formatted to be used as a GDI DIB
-		// (device-independent bitmap), so it inherits all the strange baggage from that.
-		for (let y = imageEntry.image.height - 1; y >= 0; --y) {
-			let row = bufStream.subBuffer(imageEntry.image.width).raw();
-			let rowResized = row.slice(0, imageEntry.image.width);
-			rows[y] = rowResized;
-
-			// Seek to the next DWORD aligned spot to get to the next row.
-			// For most images this may mean not seeking at all.
-			bufStream.seek(dwAlign(bufStream.tell()), SeekDir.BEG);
-		}
-
-		// Next, draw the rows converted to RGBA, top down (so it's drawn as you'd expect)
-		for (let y = 0; y < imageEntry.image.height - 1; ++y) {
-			let row = rows[y];
-			for (let x = 0; x < imageEntry.image.width; ++x) {
-				rgbaBuffer[y * imageEntry.image.width + x] = this.data.characterInfo.palette[row[x]].to_rgba();
-			}
-		}
-
+		let rgbaBuffer = imageDrawToBuffer(imageEntry, this.data.characterInfo.palette);
 		let data = new ImageData(new Uint8ClampedArray(rgbaBuffer.buffer), imageEntry.image.width, imageEntry.image.height);
 		this.ctx.putImageData(data, xOffset, yOffset);
 	}
@@ -358,30 +423,32 @@ export class Agent {
 	}
 
 	// add promise versions later.
-	playAnimation(index: number, finishCallback: () => void) {
+	async playAnimation(index: number): Promise<void> {
 		if (this.animState != null) {
-			this.animState.cancel();
-			this.animState = null;
+			await this.animState.cancel();
 		}
+
 		let animInfo = this.data.animInfo[index];
 
 		// Create and start the animation state
-		this.animState = new AgentAnimationState(this, animInfo.animationData, () => {
-			this.animState = null;
-			finishCallback();
-		});
-		this.animState.play();
+		this.animState = new AgentAnimationState(this, animInfo.animationData);
+		await this.animState.play();
+		this.animState = null;
 	}
 
-	playAnimationByName(name: string, finishCallback: () => void) {
+	async playAnimationByName(name: string): Promise<void> {
 		let index = this.data.animInfo.findIndex((n) => n.name == name);
-		if (index !== -1) this.playAnimation(index, finishCallback);
+		if (index !== -1) return this.playAnimation(index);
+		//throw new Error(`Unknown animation \"${name}\"`);
+		return;
 	}
 
-	playAnimationByNamePromise(name: string): Promise<void> {
-		return new Promise((res, rej) => {
-			this.playAnimationByName(name, () => res());
-		});
+	async exitAnimation(): Promise<void> {
+		if (this.animState != null) {
+			await this.animState.cancel();
+			this.animState = null;
+		}
+		// (After this we need to play the restpose animation or whatever exit is applicable)
 	}
 
 	setUsername(username: string, color: string) {

msagent.js/web/src/character.ts

@@ -0,0 +1,31 @@
+import { agentCharacterParseACS, AcsData, BufferStream } from '@msagent.js/core';
+import { Agent } from './agent.js';
+
+// Cache of ACS data per character (for agentCreateCharacterFromUrl)
+let acsDataCache = new Map<string, AcsData>();
+
+// Purges the ACS cache.
+//
+// FIXME: A smarter way to do this would probably be instead reference count
+// AcsData instances, then when an agent is disposed decrement reference count
+// (or leave it at 0). Once it's 0 then a globally running interval can remove
+// all keys that have no refcount.
+export function agentPurgeACSCache() {
+	acsDataCache.clear();
+}
+
+export async function agentCreateCharacterFromUrl(url: string): Promise<Agent> {
+	// just return the cache object
+	if (acsDataCache.has(url)) {
+		return new Agent(acsDataCache.get(url)!);
+	} else {
+		let res = await fetch(url);
+		let data = await res.arrayBuffer();
+
+		let buffer = new Uint8Array(data);
+		let acsData = agentCharacterParseACS(new BufferStream(buffer));
+
+		acsDataCache.set(url, acsData);
+		return new Agent(acsData);
+	}
+}

msagent.js/web/src/index.ts

@@ -1,9 +1,8 @@
-import { compressInit } from './decompress.js';
+import { compressInit } from '@msagent.js/core';
 import { wordballoonInit } from './wordballoon.js';
 
-export * from './types.js';
+export { Agent } from './agent.js';
 export * from './character.js';
-export * from './decompress.js';
 export * from './sprite.js';
 export * from './wordballoon.js';
 export * from './contextmenu.js';

msagent.js/web/src/sprite.ts

@@ -1,6 +1,6 @@
 // Sprite utilities
 
-import { Rect } from './types';
+import { Rect } from '@msagent.js/core';
 
 // Load a image asynchronously
 export async function spriteLoadImage(uri: string): Promise<HTMLImageElement> {

msagent.js/web/src/wordballoon.ts

@@ -1,5 +1,5 @@
 import { spriteCutSpriteFromSpriteSheet, spriteDraw, spriteDrawRotated, spriteLoadImage } from './sprite';
-import { Point, Rect, Size } from './types';
+import { Point, Rect, Size } from '@msagent.js/core';
 
 let corner_sprite: HTMLImageElement;
 let straight_sprite: HTMLImageElement;

msagent.js/web/tsconfig.json

@@ -0,0 +1,108 @@
+{
+  "compilerOptions": {
+    /* Visit https://aka.ms/tsconfig to read more about this file */
+
+    /* Projects */
+    // "incremental": true,                              /* Save .tsbuildinfo files to allow for incremental compilation of projects. */
+    // "composite": true,                                /* Enable constraints that allow a TypeScript project to be used with project references. */
+    // "tsBuildInfoFile": "./.tsbuildinfo",              /* Specify the path to .tsbuildinfo incremental compilation file. */
+    // "disableSourceOfProjectReferenceRedirect": true,  /* Disable preferring source files instead of declaration files when referencing composite projects. */
+    // "disableSolutionSearching": true,                 /* Opt a project out of multi-project reference checking when editing. */
+    // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
+
+    /* Language and Environment */
+    "target": "es2022",                                  /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
+    // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
+    // "jsx": "preserve",                                /* Specify what JSX code is generated. */
+    // "experimentalDecorators": true,                   /* Enable experimental support for legacy experimental decorators. */
+    // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
+    // "jsxFactory": "",                                 /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */
+    // "jsxFragmentFactory": "",                         /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */
+    // "jsxImportSource": "",                            /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */
+    // "reactNamespace": "",                             /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */
+    // "noLib": true,                                    /* Disable including any library files, including the default lib.d.ts. */
+    // "useDefineForClassFields": true,                  /* Emit ECMAScript-standard-compliant class fields. */
+    // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
+
+    /* Modules */
+    "module": "es2022",                                /* Specify what module code is generated. */
+    "rootDir": "src",                                  /* Specify the root folder within your source files. */
+    "moduleResolution": "node",                     /* Specify how TypeScript looks up a file from a given module specifier. */
+    // "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
+    // "paths": {},                                      /* Specify a set of entries that re-map imports to additional lookup locations. */
+    // "rootDirs": [],                                   /* Allow multiple folders to be treated as one when resolving modules. */
+    // "typeRoots": [],                                  /* Specify multiple folders that act like './node_modules/@types'. */
+    // "types": [],                                      /* Specify type package names to be included without being referenced in a source file. */
+    // "allowUmdGlobalAccess": true,                     /* Allow accessing UMD globals from modules. */
+    // "moduleSuffixes": [],                             /* List of file name suffixes to search when resolving a module. */
+    // "allowImportingTsExtensions": true,               /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */
+    // "resolvePackageJsonExports": true,                /* Use the package.json 'exports' field when resolving package imports. */
+    // "resolvePackageJsonImports": true,                /* Use the package.json 'imports' field when resolving imports. */
+    // "customConditions": [],                           /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */
+    // "resolveJsonModule": true,                        /* Enable importing .json files. */
+    // "allowArbitraryExtensions": true,                 /* Enable importing files with any extension, provided a declaration file is present. */
+    // "noResolve": true,                                /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
+
+    /* JavaScript Support */
+    // "allowJs": true,                                  /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */
+    // "checkJs": true,                                  /* Enable error reporting in type-checked JavaScript files. */
+    // "maxNodeModuleJsDepth": 1,                        /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */
+
+    /* Emit */
+    "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
+    // "declarationMap": true,                           /* Create sourcemaps for d.ts files. */
+    // "emitDeclarationOnly": true,                      /* Only output d.ts files and not JavaScript files. */
+    // "sourceMap": true,                                /* Create source map files for emitted JavaScript files. */
+    // "inlineSourceMap": true,                          /* Include sourcemap files inside the emitted JavaScript. */
+    // "outFile": "./",                                  /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */
+    "outDir": "./dist",                                   /* Specify an output folder for all emitted files. */
+    // "removeComments": true,                           /* Disable emitting comments. */
+    // "noEmit": true,                                   /* Disable emitting files from a compilation. */
+    // "importHelpers": true,                            /* Allow importing helper functions from tslib once per project, instead of including them per-file. */
+    // "downlevelIteration": true,                       /* Emit more compliant, but verbose and less performant JavaScript for iteration. */
+    // "sourceRoot": "",                                 /* Specify the root path for debuggers to find the reference source code. */
+    // "mapRoot": "",                                    /* Specify the location where debugger should locate map files instead of generated locations. */
+    // "inlineSources": true,                            /* Include source code in the sourcemaps inside the emitted JavaScript. */
+    // "emitBOM": true,                                  /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */
+    // "newLine": "crlf",                                /* Set the newline character for emitting files. */
+    // "stripInternal": true,                            /* Disable emitting declarations that have '@internal' in their JSDoc comments. */
+    // "noEmitHelpers": true,                            /* Disable generating custom helper functions like '__extends' in compiled output. */
+    // "noEmitOnError": true,                            /* Disable emitting files if any type checking errors are reported. */
+    // "preserveConstEnums": true,                       /* Disable erasing 'const enum' declarations in generated code. */
+    // "declarationDir": "./",                           /* Specify the output directory for generated declaration files. */
+
+    /* Interop Constraints */
+    // "isolatedModules": true,                          /* Ensure that each file can be safely transpiled without relying on other imports. */
+    // "verbatimModuleSyntax": true,                     /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */
+    // "isolatedDeclarations": true,                     /* Require sufficient annotation on exports so other tools can trivially generate declaration files. */
+    // "allowSyntheticDefaultImports": true,             /* Allow 'import x from y' when a module doesn't have a default export. */
+    "esModuleInterop": true,                             /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
+    // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
+    "forceConsistentCasingInFileNames": true,            /* Ensure that casing is correct in imports. */
+
+    /* Type Checking */
+    "strict": true,                                      /* Enable all strict type-checking options. */
+    // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied 'any' type. */
+    // "strictNullChecks": true,                         /* When type checking, take into account 'null' and 'undefined'. */
+    // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
+    // "strictBindCallApply": true,                      /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */
+    // "strictPropertyInitialization": true,             /* Check for class properties that are declared but not set in the constructor. */
+    // "noImplicitThis": true,                           /* Enable error reporting when 'this' is given the type 'any'. */
+    // "useUnknownInCatchVariables": true,               /* Default catch clause variables as 'unknown' instead of 'any'. */
+    // "alwaysStrict": true,                             /* Ensure 'use strict' is always emitted. */
+    // "noUnusedLocals": true,                           /* Enable error reporting when local variables aren't read. */
+    // "noUnusedParameters": true,                       /* Raise an error when a function parameter isn't read. */
+    // "exactOptionalPropertyTypes": true,               /* Interpret optional property types as written, rather than adding 'undefined'. */
+    // "noImplicitReturns": true,                        /* Enable error reporting for codepaths that do not explicitly return in a function. */
+    // "noFallthroughCasesInSwitch": true,               /* Enable error reporting for fallthrough cases in switch statements. */
+    // "noUncheckedIndexedAccess": true,                 /* Add 'undefined' to a type when accessed using an index. */
+    // "noImplicitOverride": true,                       /* Ensure overriding members in derived classes are marked with an override modifier. */
+    // "noPropertyAccessFromIndexSignature": true,       /* Enforces using indexed accessors for keys declared using an indexed type. */
+    // "allowUnusedLabels": true,                        /* Disable error reporting for unused labels. */
+    // "allowUnreachableCode": true,                     /* Disable error reporting for unreachable code. */
+
+    /* Completeness */
+    // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
+    "skipLibCheck": true                                 /* Skip type checking all .d.ts files. */
+  }
+}

package.json

@@ -4,7 +4,8 @@
     "server",
     "webapp",
     "protocol",
-    "msagent.js"
+    "msagent.js/core",
+    "msagent.js/web"
   ],
   "scripts": {
     "format": "prettier --write **/*.{ts,html,scss}",

webapp/package.json

@@ -9,7 +9,7 @@
   },
   "packageManager": "yarn@4.2.2",
   "devDependencies": {
-    "@msagent-chat/msagent.js": "*",
+    "@msagent.js/web": "*",
     "@parcel/core": "^2.12.0",
     "parcel": "^2.12.0",
     "run-script-os": "^1.1.6",

webapp/src/ts/client.ts

@@ -24,7 +24,7 @@ import {
 	MSAgentTalkMessage
 } from '@msagent-chat/protocol';
 import { User } from './user';
-import { agentCreateCharacterFromUrl, ContextMenuItem } from '@msagent-chat/msagent.js';
+import { agentCreateCharacterFromUrl, ContextMenuItem } from '@msagent.js/web';
 
 export interface MSAgentClientEvents {
 	close: () => void;
@@ -397,7 +397,7 @@ export class MSAgentClient {
 				let animMsg = msg as MSAgentAnimationMessage;
 				let user = this.users.find((u) => u.username === animMsg.data.username);
 				if (!user || user.muted) return;
-				await user.agent.playAnimationByNamePromise(animMsg.data.anim);
+				await user.agent.playAnimationByName(animMsg.data.anim);
 				await user.doAnim('rest');
 				break;
 			}

webapp/src/ts/main.ts

@@ -1,5 +1,5 @@
 import { MSWindow, MSWindowStartPosition } from './MSWindow.js';
-import { agentInit } from '@msagent-chat/msagent.js';
+import { agentInit, agentPurgeACSCache } from '@msagent.js/web';
 import { MSAgentClient } from './client.js';
 import { Config } from '../../config.js';
 import { RunCommand } from './commands.js';
@@ -36,6 +36,7 @@ function roomInit() {
 			user.agent.remove();
 		}
 		roomInit();
+		agentPurgeACSCache();
 		loggingIn = false;
 		elements.logonButton.disabled = false;
 		logonWindow.show();

webapp/src/ts/testbed.ts

@@ -1,7 +1,9 @@
 // Testbed code
 // This will go away when it isn't needed
 
-import * as msagent from '@msagent-chat/msagent.js';
+import * as msagent from '@msagent.js/web';
+import * as msagent_core from '@msagent.js/core';
+
 let w = window as any;
 w.agents = [];
 let input = document.getElementById('testbed-input') as HTMLInputElement;
@@ -12,13 +14,15 @@ input.addEventListener('change', async () => {
 	let buffer = await input.files![0].arrayBuffer();
 
 	console.log('Creating agent');
-	let agent = msagent.agentCreateCharacter(new Uint8Array(buffer));
+	let agentParsedData = msagent_core.agentCharacterParseACS(new msagent_core.BufferStream(new Uint8Array(buffer)));
+	let agent = new msagent.Agent(agentParsedData);
 
 	w.agents.push(agent);
 
 	agent.addToDom(mount);
 
 	agent.show();
+	await agent.playAnimationByName("Show");
 	console.log('Agent created');
 });
 
@@ -28,13 +32,15 @@ document.addEventListener('DOMContentLoaded', async () => {
 });
 
 let form = document.getElementById('acsUrlForm') as HTMLFormElement;
-form.addEventListener('submit', (e) => {
+form.addEventListener('submit', async (e) => {
 	e.preventDefault();
 	let url = (document.getElementById('acsUrl') as HTMLInputElement).value;
-	msagent.agentCreateCharacterFromUrl(url).then((agent) => {
-		w.agents.push(agent);
-		agent.addToDom(document.body);
-		agent.show();
-		console.log(`Loaded agent from ${url}`);
-	});
+	let agent = await msagent.agentCreateCharacterFromUrl(url)
+	w.agents.push(agent);
+	agent.addToDom(document.body);
+
+	agent.show();
+	await agent.playAnimationByName("Show");
+	
+	console.log(`Loaded agent from ${url}`);
 });

webapp/src/ts/user.ts

@@ -1,4 +1,4 @@
-import { Agent } from '@msagent-chat/msagent.js';
+import { Agent } from '@msagent.js/web';
 import { AgentAnimationConfig } from '@msagent-chat/protocol';
 
 export class User {
@@ -20,7 +20,7 @@ export class User {
 	async doAnim(action: string) {
 		// @ts-ignore
 		for (let anim of this.animations[action]) {
-			await this.agent.playAnimationByNamePromise(anim);
+			await this.agent.playAnimationByName(anim);
 		}
 	}
 }

yarn.lock

@@ -478,16 +478,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@msagent-chat/msagent.js@npm:*, @msagent-chat/msagent.js@workspace:msagent.js":
-  version: 0.0.0-use.local
-  resolution: "@msagent-chat/msagent.js@workspace:msagent.js"
-  dependencies:
-    "@parcel/core": "npm:^2.12.0"
-    parcel: "npm:^2.12.0"
-    typescript: "npm:^5.5.3"
-  languageName: unknown
-  linkType: soft
-
 "@msagent-chat/protocol@workspace:protocol":
   version: 0.0.0-use.local
   resolution: "@msagent-chat/protocol@workspace:protocol"
@@ -525,7 +515,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@msagent-chat/webapp@workspace:webapp"
   dependencies:
-    "@msagent-chat/msagent.js": "npm:*"
+    "@msagent.js/web": "npm:*"
     "@parcel/core": "npm:^2.12.0"
     nanoevents: "npm:^9.0.0"
     parcel: "npm:^2.12.0"
@@ -535,6 +525,27 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"@msagent.js/core@npm:*, @msagent.js/core@workspace:msagent.js/core":
+  version: 0.0.0-use.local
+  resolution: "@msagent.js/core@workspace:msagent.js/core"
+  dependencies:
+    "@parcel/core": "npm:^2.12.0"
+    parcel: "npm:^2.12.0"
+    typescript: "npm:^5.5.3"
+  languageName: unknown
+  linkType: soft
+
+"@msagent.js/web@npm:*, @msagent.js/web@workspace:msagent.js/web":
+  version: 0.0.0-use.local
+  resolution: "@msagent.js/web@workspace:msagent.js/web"
+  dependencies:
+    "@msagent.js/core": "npm:*"
+    "@parcel/core": "npm:^2.12.0"
+    parcel: "npm:^2.12.0"
+    typescript: "npm:^5.5.3"
+  languageName: unknown
+  linkType: soft
+
 "@msgpackr-extract/msgpackr-extract-darwin-arm64@npm:3.0.3":
   version: 3.0.3
   resolution: "@msgpackr-extract/msgpackr-extract-darwin-arm64@npm:3.0.3"
@@ -3608,11 +3619,11 @@ __metadata:
   linkType: hard
 
 "node-abi@npm:^3.3.0":
-  version: 3.65.0
-  resolution: "node-abi@npm:3.65.0"
+  version: 3.67.0
+  resolution: "node-abi@npm:3.67.0"
   dependencies:
     semver: "npm:^7.3.5"
-  checksum: 10c0/112672015d8f27d6be2f18d64569f28f5d6a15a94cc510da513c69c3e3ab5df6dac196ef13ff115a8fadb69b554974c47ef89b4f6350a2b02de2bca5c23db1e5
+  checksum: 10c0/72ce2edbdfb84745bc201a4e48aa7146fd88a0d2c80046b6b17f28439c9a7683eab846f40f1e819349c31f7d9331ed5c50d1e741208d938dd5f38b29cab2275e
   languageName: node
   linkType: hard
 
@@ -4235,7 +4246,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"semver@npm:^7.3.5, semver@npm:^7.3.8, semver@npm:^7.5.2, semver@npm:^7.5.4, semver@npm:^7.6.0":
+"semver@npm:^7.3.5, semver@npm:^7.5.2, semver@npm:^7.5.4, semver@npm:^7.6.0":
   version: 7.6.2
   resolution: "semver@npm:7.6.2"
   bin:
@@ -4244,6 +4255,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"semver@npm:^7.3.8":
+  version: 7.6.3
+  resolution: "semver@npm:7.6.3"
+  bin:
+    semver: bin/semver.js
+  checksum: 10c0/88f33e148b210c153873cb08cfe1e281d518aaa9a666d4d148add6560db5cd3c582f3a08ccb91f38d5f379ead256da9931234ed122057f40bb5766e65e58adaf
+  languageName: node
+  linkType: hard
+
 "seq-queue@npm:^0.0.5":
   version: 0.0.5
   resolution: "seq-queue@npm:0.0.5"