@agent-os-lab/agent-game-sdk 0.1.1

package/src/core/svg-pixel-avatar.ts

@@ -0,0 +1,372 @@
+import type { AgentAvatarDefinition } from "./assets.js";
+
+export const SVG_PIXEL_AVATAR_FRAME_NAMES = [
+  "idle-down-0",
+  "idle-up-0",
+  "idle-left-0",
+  "idle-right-0",
+  "walk-down-0",
+  "walk-down-1",
+  "walk-down-2",
+  "walk-down-3",
+  "walk-up-0",
+  "walk-up-1",
+  "walk-up-2",
+  "walk-up-3",
+  "walk-left-0",
+  "walk-left-1",
+  "walk-left-2",
+  "walk-left-3",
+  "walk-right-0",
+  "walk-right-1",
+  "walk-right-2",
+  "walk-right-3",
+  "work-typing-0",
+  "work-typing-1",
+  "think-down-0",
+  "think-down-1",
+  "talk-down-0",
+  "talk-down-1",
+] as const;
+
+export type SvgPixelAvatarFrameName = (typeof SVG_PIXEL_AVATAR_FRAME_NAMES)[number];
+
+export type SvgPixelAgentColors = {
+  hair: string;
+  skin: string;
+  shirt: string;
+  pants: string;
+  shoes: string;
+  cap: string;
+  shadow: string;
+  eye: string;
+};
+
+export type SvgPixelAgentAvatarOptions = {
+  id: string;
+  seed: string | number;
+  department?: string;
+  pixelSize?: number;
+  templateIndex?: number;
+  colors?: Partial<SvgPixelAgentColors>;
+};
+
+export type SvgPixelAgentAtlas = {
+  frames: Record<SvgPixelAvatarFrameName, { frame: { x: number; y: number; w: number; h: number } }>;
+  meta: {
+    app: string;
+    image: string;
+    format: "RGBA8888";
+    size: { w: number; h: number };
+    scale: "1";
+  };
+};
+
+export type SvgPixelAgentSpriteSheet = {
+  avatar: AgentAvatarDefinition;
+  atlas: SvgPixelAgentAtlas;
+  svg: string;
+  frameWidth: number;
+  frameHeight: number;
+};
+
+const SPRITE_WIDTH = 8;
+const SPRITE_HEIGHT = 11;
+const DEFAULT_PIXEL_SIZE = 3;
+
+const SPRITE_TEMPLATES: number[][][] = [
+  [
+    [0, 0, 1, 1, 1, 1, 0, 0],
+    [0, 1, 1, 1, 1, 1, 1, 0],
+    [0, 2, 2, 2, 2, 2, 2, 0],
+    [0, 2, 9, 2, 2, 9, 2, 0],
+    [0, 2, 2, 8, 8, 2, 2, 0],
+    [0, 3, 3, 3, 3, 3, 3, 0],
+    [3, 2, 3, 3, 3, 3, 2, 3],
+    [0, 0, 3, 3, 3, 3, 0, 0],
+    [0, 0, 4, 4, 4, 4, 0, 0],
+    [0, 0, 4, 0, 0, 4, 0, 0],
+    [0, 0, 5, 0, 0, 5, 0, 0],
+  ],
+  [
+    [0, 1, 0, 1, 0, 1, 0, 0],
+    [0, 1, 1, 1, 1, 1, 1, 0],
+    [0, 2, 2, 2, 2, 2, 2, 0],
+    [0, 2, 9, 2, 2, 9, 2, 0],
+    [0, 2, 2, 8, 8, 2, 2, 0],
+    [0, 3, 3, 3, 3, 3, 3, 0],
+    [3, 2, 3, 3, 3, 3, 2, 3],
+    [0, 0, 3, 3, 3, 3, 0, 0],
+    [0, 0, 4, 4, 4, 4, 0, 0],
+    [0, 0, 4, 0, 0, 4, 0, 0],
+    [0, 0, 5, 0, 0, 5, 0, 0],
+  ],
+  [
+    [0, 6, 6, 6, 6, 6, 6, 0],
+    [6, 6, 6, 6, 6, 6, 6, 6],
+    [0, 2, 2, 2, 2, 2, 2, 0],
+    [0, 2, 9, 2, 2, 9, 2, 0],
+    [0, 2, 2, 8, 8, 2, 2, 0],
+    [0, 3, 3, 3, 3, 3, 3, 0],
+    [3, 2, 3, 3, 3, 3, 2, 3],
+    [0, 0, 3, 3, 3, 3, 0, 0],
+    [0, 0, 4, 4, 4, 4, 0, 0],
+    [0, 0, 4, 0, 0, 4, 0, 0],
+    [0, 0, 5, 0, 0, 5, 0, 0],
+  ],
+  [
+    [0, 0, 1, 1, 1, 1, 0, 0],
+    [0, 1, 1, 1, 1, 1, 1, 0],
+    [1, 2, 2, 2, 2, 2, 2, 1],
+    [1, 2, 9, 2, 2, 9, 2, 1],
+    [1, 2, 2, 8, 8, 2, 2, 1],
+    [0, 3, 3, 3, 3, 3, 3, 0],
+    [3, 2, 3, 3, 3, 3, 2, 3],
+    [0, 0, 3, 3, 3, 3, 0, 0],
+    [0, 0, 4, 4, 4, 4, 0, 0],
+    [0, 0, 4, 0, 0, 4, 0, 0],
+    [0, 0, 5, 0, 0, 5, 0, 0],
+  ],
+  [
+    [0, 0, 1, 1, 1, 1, 0, 0],
+    [0, 1, 1, 1, 1, 1, 1, 0],
+    [0, 1, 2, 2, 2, 2, 1, 0],
+    [0, 2, 9, 2, 2, 9, 2, 0],
+    [0, 2, 2, 8, 8, 2, 2, 0],
+    [0, 3, 3, 3, 3, 3, 3, 0],
+    [3, 2, 3, 3, 3, 3, 2, 3],
+    [0, 0, 3, 3, 3, 3, 0, 0],
+    [0, 0, 4, 4, 4, 4, 0, 0],
+    [0, 0, 4, 0, 0, 4, 0, 0],
+    [0, 0, 5, 0, 0, 5, 0, 0],
+  ],
+  [
+    [0, 0, 1, 1, 1, 1, 1, 0],
+    [0, 1, 1, 1, 1, 1, 0, 1],
+    [0, 2, 2, 2, 2, 2, 0, 1],
+    [0, 2, 9, 2, 2, 9, 2, 0],
+    [0, 2, 2, 8, 8, 2, 2, 0],
+    [0, 3, 3, 3, 3, 3, 3, 0],
+    [3, 2, 3, 3, 3, 3, 2, 3],
+    [0, 0, 3, 3, 3, 3, 0, 0],
+    [0, 0, 4, 4, 4, 4, 0, 0],
+    [0, 0, 4, 0, 0, 4, 0, 0],
+    [0, 0, 5, 0, 0, 5, 0, 0],
+  ],
+];
+
+const HAIR_COLORS = ["#2c1810", "#4a3728", "#8b6914", "#1a1a2e", "#6b3a2a", "#c0392b", "#d4a574", "#3d2b1f"];
+const SKIN_COLORS = ["#ffdbb4", "#f0c8a0", "#d4a574", "#c49060", "#8d5524"];
+const PANTS_COLORS = ["#2e3a5c", "#3d3d50", "#5c4033", "#2a2a35", "#3b4252"];
+const SHIRT_COLORS = ["#4a7dbc", "#8b5fb0", "#d97a3a", "#29a693", "#d4527c", "#c9a832", "#7a8a99", "#3a9d5c"];
+const DEPARTMENT_SHIRT_COLORS: Record<string, string> = {
+  "交易部": "#4a7dbc",
+  "研发部": "#8b5fb0",
+  "市场部": "#d97a3a",
+  "人力资源部": "#29a693",
+  "法务部": "#d4527c",
+  "财务部": "#c9a832",
+  "行政部": "#7a8a99",
+  "项目管理部": "#3a9d5c",
+};
+
+export function createSvgPixelAgentAvatar(options: SvgPixelAgentAvatarOptions): AgentAvatarDefinition {
+  return createSvgPixelAgentSpriteSheet(options).avatar;
+}
+
+export function createSvgPixelAgentSpriteSheet(options: SvgPixelAgentAvatarOptions): SvgPixelAgentSpriteSheet {
+  const pixelSize = options.pixelSize ?? DEFAULT_PIXEL_SIZE;
+  const frameWidth = SPRITE_WIDTH * pixelSize;
+  const frameHeight = SPRITE_HEIGHT * pixelSize;
+  const sheetWidth = frameWidth * SVG_PIXEL_AVATAR_FRAME_NAMES.length;
+  const hash = hashSeed(`${options.seed}:${options.department ?? ""}`);
+  const template = SPRITE_TEMPLATES[options.templateIndex ?? hash % SPRITE_TEMPLATES.length];
+  const colors = createColors(hash, options.department, options.colors);
+  const svg = createSpriteSheetSvg(template, colors, pixelSize, frameWidth, frameHeight, sheetWidth);
+  const atlas = createAtlas(options.id, frameWidth, frameHeight, sheetWidth);
+  const avatar: AgentAvatarDefinition = {
+    id: options.id,
+    imageUrl: `data:image/svg+xml;base64,${encodeBase64(svg)}`,
+    atlasUrl: `data:application/json;base64,${encodeBase64(JSON.stringify(atlas))}`,
+    animations: {
+      "idle.down": ["idle-down-0"],
+      "idle.up": ["idle-up-0"],
+      "idle.left": ["idle-left-0"],
+      "idle.right": ["idle-right-0"],
+      "walk.down": ["walk-down-0", "walk-down-1", "walk-down-2", "walk-down-3"],
+      "walk.up": ["walk-up-0", "walk-up-1", "walk-up-2", "walk-up-3"],
+      "walk.left": ["walk-left-0", "walk-left-1", "walk-left-2", "walk-left-3"],
+      "walk.right": ["walk-right-0", "walk-right-1", "walk-right-2", "walk-right-3"],
+      "work.typing": ["work-typing-0", "work-typing-1"],
+      "emote.think": ["think-down-0", "think-down-1"],
+      "emote.talk": ["talk-down-0", "talk-down-1"],
+    },
+  };
+
+  return {
+    avatar,
+    atlas,
+    svg,
+    frameWidth,
+    frameHeight,
+  };
+}
+
+function createColors(
+  hash: number,
+  department: string | undefined,
+  overrides: Partial<SvgPixelAgentColors> | undefined,
+): SvgPixelAgentColors {
+  const skin = pick(SKIN_COLORS, hash >>> 8);
+  const shirt = department
+    ? DEPARTMENT_SHIRT_COLORS[department] ?? pick(SHIRT_COLORS, hashSeed(department))
+    : pick(SHIRT_COLORS, hash >>> 16);
+
+  return {
+    hair: pick(HAIR_COLORS, hash >>> 4),
+    skin,
+    shirt,
+    pants: pick(PANTS_COLORS, hash >>> 12),
+    shoes: "#2c1810",
+    cap: shirt,
+    shadow: skin === "#ffdbb4" ? "#e8b898" : skin === "#8d5524" ? "#6b3a2a" : "#c49060",
+    eye: "#1a1a2e",
+    ...overrides,
+  };
+}
+
+function createSpriteSheetSvg(
+  template: number[][],
+  colors: SvgPixelAgentColors,
+  pixelSize: number,
+  frameWidth: number,
+  frameHeight: number,
+  sheetWidth: number,
+): string {
+  const frames = SVG_PIXEL_AVATAR_FRAME_NAMES
+    .map((frame, index) => {
+      const frameX = index * frameWidth;
+      const rects = createFrameRects(template, colors, pixelSize, frameX, frame);
+      return `<g id="${frame}">${rects}</g>`;
+    })
+    .join("");
+
+  return `<svg xmlns="http://www.w3.org/2000/svg" width="${sheetWidth}" height="${frameHeight}" viewBox="0 0 ${sheetWidth} ${frameHeight}" shape-rendering="crispEdges">${frames}</svg>`;
+}
+
+function createFrameRects(
+  template: number[][],
+  colors: SvgPixelAgentColors,
+  pixelSize: number,
+  frameX: number,
+  frame: SvgPixelAvatarFrameName,
+): string {
+  const colorMap: Record<number, string> = {
+    1: colors.hair,
+    2: colors.skin,
+    3: colors.shirt,
+    4: colors.pants,
+    5: colors.shoes,
+    6: colors.cap,
+    8: colors.shadow,
+    9: colors.eye,
+  };
+
+  let rects = "";
+  const animatedTemplate = createAnimatedFrameTemplate(template, frame);
+  for (let y = 0; y < template.length; y++) {
+    for (let x = 0; x < animatedTemplate[y].length; x++) {
+      const token = animatedTemplate[y][x];
+      const fill = colorMap[token];
+      if (fill) {
+        rects += `<rect x="${frameX + x * pixelSize}" y="${y * pixelSize}" width="${pixelSize}" height="${pixelSize}" fill="${fill}"/>`;
+      }
+    }
+  }
+  return rects;
+}
+
+function createAnimatedFrameTemplate(template: number[][], frame: SvgPixelAvatarFrameName): number[][] {
+  if (!frame.startsWith("walk-")) {
+    return template;
+  }
+
+  const phase = Number(frame.at(-1));
+  if (phase !== 1 && phase !== 3) {
+    return template;
+  }
+
+  const next = template.map((row) => [...row]);
+  if (phase === 1) {
+    next[9][1] = 4;
+    next[10][1] = 5;
+    next[9][2] = 0;
+    next[10][2] = 0;
+    next[6][0] = 0;
+    next[6][1] = 0;
+    next[7][0] = 3;
+    next[7][1] = 2;
+    return next;
+  }
+
+  next[9][6] = 4;
+  next[10][6] = 5;
+  next[9][5] = 0;
+  next[10][5] = 0;
+  next[6][6] = 0;
+  next[6][7] = 0;
+  next[7][6] = 2;
+  next[7][7] = 3;
+  return next;
+}
+
+function createAtlas(id: string, frameWidth: number, frameHeight: number, sheetWidth: number): SvgPixelAgentAtlas {
+  const frames = {} as SvgPixelAgentAtlas["frames"];
+  SVG_PIXEL_AVATAR_FRAME_NAMES.forEach((frame, index) => {
+    frames[frame] = {
+      frame: {
+        x: index * frameWidth,
+        y: 0,
+        w: frameWidth,
+        h: frameHeight,
+      },
+    };
+  });
+
+  return {
+    frames,
+    meta: {
+      app: "agent-game-sdk/svg-pixel-avatar",
+      image: `${id}.svg`,
+      format: "RGBA8888",
+      size: {
+        w: sheetWidth,
+        h: frameHeight,
+      },
+      scale: "1",
+    },
+  };
+}
+
+function hashSeed(seed: string | number): number {
+  const input = String(seed);
+  let hash = 2166136261;
+  for (let index = 0; index < input.length; index++) {
+    hash ^= input.charCodeAt(index);
+    hash = Math.imul(hash, 16777619);
+  }
+  return hash >>> 0;
+}
+
+function pick<T>(items: readonly T[], hash: number): T {
+  return items[hash % items.length];
+}
+
+function encodeBase64(value: string): string {
+  const bytes = new TextEncoder().encode(value);
+  let binary = "";
+  for (let index = 0; index < bytes.length; index++) {
+    binary += String.fromCharCode(bytes[index]);
+  }
+  return btoa(binary);
+}

package/src/core/town-office-assets.ts

@@ -0,0 +1,109 @@
+export const TOWN_OFFICE_OBJECT_FRAMES = [
+  "desk-single",
+  "desk-long",
+  "chair-office",
+  "whiteboard",
+  "wall-art",
+  "plant-small",
+  "plant-large",
+  "monitor",
+  "sofa-long",
+  "laptop",
+  "bookshelf",
+  "filing-cabinet",
+  "meeting-table",
+  "coffee-machine",
+  "water-dispenser",
+  "locker",
+  "vending-machine",
+  "phone",
+  "schedule-board",
+  "trash-can",
+  "bench",
+  "flower-pot",
+  "clock",
+  "bulletin-board",
+  "fire-extinguisher",
+  "rug-mat",
+  "window",
+  "air-conditioner",
+  "exit-sign",
+  "picture",
+  "printer",
+  "door",
+  "light-switch",
+  "socket",
+  "server-rack",
+  "tv",
+  "monitor-wall",
+  "ticker-board",
+  "test-rack",
+  "cert-badge",
+  "henan-map",
+  "battery",
+  "solar-panel",
+  "ev-charger",
+  "megaphone",
+  "chart-board",
+  "red-banner",
+  "beaker",
+  "ping-pong-table",
+  "podium",
+  "party-flag",
+  "wind-turbine",
+  "transmission-tower",
+  "tree",
+  "gazebo",
+  "bicycle-rack",
+  "big-screen",
+  "kpi-card",
+  "seal",
+] as const;
+
+export type TownOfficeObjectFrame = (typeof TOWN_OFFICE_OBJECT_FRAMES)[number];
+
+export const TOWN_OFFICE_ROOM_TYPES = [
+  "trading",
+  "meeting",
+  "lab",
+  "admin",
+  "meeting_small",
+  "innovation",
+  "infrastructure",
+  "legal",
+  "training",
+  "research",
+  "business",
+  "cafeteria",
+  "lounge",
+  "fitness",
+  "outdoor",
+  "executive",
+  "party_building",
+  "library",
+  "honor_hall",
+  "employee_home",
+  "interest_class",
+  "club",
+  "counseling",
+  "mental_health",
+  "testing_room",
+  "regional_office",
+  "dispatch",
+  "testing",
+  "resource",
+  "archive",
+] as const;
+
+export type TownOfficeRoomType = (typeof TOWN_OFFICE_ROOM_TYPES)[number];
+
+const TOWN_OFFICE_OBJECT_FRAME_SET = new Set<string>(TOWN_OFFICE_OBJECT_FRAMES);
+const TOWN_OFFICE_ROOM_TYPE_SET = new Set<string>(TOWN_OFFICE_ROOM_TYPES);
+
+export function isTownOfficeObjectFrame(value: string): value is TownOfficeObjectFrame {
+  return TOWN_OFFICE_OBJECT_FRAME_SET.has(value);
+}
+
+export function isTownOfficeRoomType(value: string): value is TownOfficeRoomType {
+  return TOWN_OFFICE_ROOM_TYPE_SET.has(value);
+}