Remove games

src/components/GameController.js

@@ -10,11 +10,6 @@ import useLocalStorage from "../hooks/useLocalStorage";
 
 import throttle from "lodash.throttle";
 
-import tiktok from "../games/tiktok";
-import card from "../games/card";
-import gloomhaven from "../games/gloomhaven";
-import gloomhavenBox from "../games/gloomhaven-box";
-import settlers from "../games/settlers";
 import testGame from "../games/testGame";
 import LoadGame from "./LoadGame";
 import AvailableItems from "./AvailableItems";
@@ -50,10 +45,25 @@ const AvailableItemList = styled.div`
 
 const Title = styled.h3``;
 
+const GAMELIST_URL = process.env.REACT_APP_GAMELIST_URL || "/gamelist.json";
+
+const loadGameList = async () => {
+  console.log(GAMELIST_URL);
+  const result = await fetch(GAMELIST_URL);
+  return await result.json();
+};
+
+const fetchGame = async (url) => {
+  console.log(url);
+  const result = await fetch(url);
+  return await result.json();
+};
+
 export const GameController = ({ availableItemList, boardConfig }) => {
   const { t } = useTranslation();
   const [c2c, , isMaster] = useC2C();
   const { itemList } = useItems();
+  const [gameList, setGameList] = React.useState([]);
   const [downloadURI, setDownloadURI] = React.useState({});
   const [date, setDate] = React.useState(Date.now());
   const [gameLocalSave, setGameLocalSave] = useLocalStorage("savedGame", {
@@ -62,6 +72,12 @@ export const GameController = ({ availableItemList, boardConfig }) => {
     availableItems: availableItemList,
   });
 
+  React.useEffect(() => {
+    loadGameList().then((content) => {
+      setGameList(content);
+    });
+  }, []);
+
   const loadGame = React.useCallback(
     (game) => {
       game.items = game.items.map((item) => ({ ...item, id: nanoid() }));
@@ -70,6 +86,15 @@ export const GameController = ({ availableItemList, boardConfig }) => {
     [c2c]
   );
 
+  const loadGameUrl = React.useCallback(
+    (url) => {
+      fetchGame(url).then((content) => {
+        loadGame(content);
+      });
+    },
+    [loadGame]
+  );
+
   const newGame = React.useCallback(() => {
     loadGame({
       items: [],
@@ -78,26 +103,6 @@ export const GameController = ({ availableItemList, boardConfig }) => {
     });
   }, [loadGame]);
 
-  const loadTikTok = React.useCallback(() => {
-    tiktok.availableItems = [];
-    loadGame(tiktok);
-  }, [loadGame]);
-
-  const loadCard = React.useCallback(() => {
-    card.availableItems = [];
-    loadGame(card);
-  }, [loadGame]);
-
-  const loadGloomhaven = React.useCallback(() => {
-    gloomhaven.availableItems = gloomhavenBox.items;
-    loadGame(gloomhaven);
-  }, [loadGame]);
-
-  const loadSettlers = React.useCallback(() => {
-    settlers.availableItems = [];
-    loadGame(settlers);
-  }, [loadGame]);
-
   const loadTestGame = React.useCallback(() => {
     testGame.availableItems = [];
     loadGame(testGame);
@@ -151,10 +156,11 @@ export const GameController = ({ availableItemList, boardConfig }) => {
       <Title onClick={logGame}>{t("Games")}</Title>
       <button onClick={newGame}>New Game</button>
       <button onClick={loadTestGame}>Test Game</button>
-      <button onClick={loadTikTok}>TikTok</button>
-      <button onClick={loadCard}>Card</button>
-      <button onClick={loadGloomhaven}>Gloomhaven</button>
-      <button onClick={loadSettlers}>Settlers of Catan</button>
+      {gameList.map(({ name, url }) => (
+        <button key={name} onClick={() => loadGameUrl(url)}>
+          {name}
+        </button>
+      ))}
       <Title>{t("Save/Load")}</Title>
       <button onClick={loadLocalSavedGame}>{t("Load last game")}</button>
       <LoadGame onLoad={loadGame} />

src/games/card.js

@@ -1,44 +0,0 @@
-const genGame = () => {
-  const items = [];
-
-  [...Array(3).keys()].forEach(() => {
-    items.push({
-      type: "image",
-      content: "/games/card.jpg",
-      backContent: "/games/back.jpg",
-      width: 100,
-      flipped: true,
-      x: 100,
-      y: 100,
-    });
-
-    items.push({
-      type: "image",
-      content: "/games/card.jpg",
-      backContent: "/games/back.jpg",
-      width: 100,
-      flipped: true,
-      x: 100,
-      y: 100,
-    });
-
-    items.push({
-      type: "image",
-      content: "/games/8diamond.png",
-      backContent: "/games/back.jpg",
-      width: 100,
-      flipped: true,
-      x: 100,
-      y: 100,
-    });
-  });
-
-  return {
-    items,
-    board: { size: 1000, scale: 0.5 },
-  };
-};
-
-export const game = genGame();
-
-export default game;

src/games/gloomhaven-box.js

@@ -1,473 +0,0 @@
-const genGloomhavenBox = () => {
-  const items = [];
-
-  // map-tiles
-
-  Array.from("abcdefghijkl").forEach((l) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/map-tiles/${l}1a.png`,
-      backContent: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/map-tiles/${l}1b.png`,
-      text: `${l}1a`,
-      backText: `${l}1b`,
-      label: `Tiles ${l}1a / ${l}1b`,
-      groupId: "map-tiles",
-    });
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/map-tiles/${l}2a.png`,
-      backContent: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/map-tiles/${l}2b.png`,
-      text: `${l}2a`,
-      backText: `${l}2b`,
-      label: `Tiles ${l}2a / ${l}2b`,
-      groupId: "map-tiles",
-    });
-  });
-
-  // character-mats
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-mats/brute.png",
-    backContent:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-mats/brute-back.png",
-    width: 300,
-    label: "Brute mat-board",
-    groupId: "characters",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-mats/spellweaver.png",
-    backContent:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-mats/spellweaver-back.png",
-    width: 300,
-    label: "Spellweaver mat-board",
-    groupId: "characters",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-perks/brute-perks.png",
-    width: 300,
-    label: "Brute perks-board",
-    groupId: "characters",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-perks/spellweaver-perks.png",
-    width: 300,
-    label: "Spellweaver perks-board",
-    groupId: "characters",
-  });
-
-  // Attack modifiers
-
-  [...Array(19).keys()].forEach((_, index) => {
-    const number = index < 9 ? "0" + (index + 1) : "" + (index + 1);
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/attack-modifiers/base/player/am-p-${number}.png`,
-      backContent: "/games/gloom/attackback.png",
-      width: 100,
-      flipped: true,
-      label: `Player Attack modifier am-p-${number}`,
-      groupId: "attack-modifiers",
-    });
-  });
-
-  [...Array(19).keys()].forEach((_, index) => {
-    const number = index < 9 ? "0" + (index + 1) : "" + (index + 1);
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/attack-modifiers/base/monster/am-m-${number}.png`,
-      backContent: "/games/gloom/attackback.png",
-      width: 100,
-      flipped: true,
-      label: `Monster Attack modifier am-p-${number}`,
-      groupId: "attack-modifiers",
-    });
-  });
-
-  // monster tokens
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/bandit-guard.png",
-    width: 60,
-    text: "X",
-    overlay: {
-      content:
-        "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/normal-monster-overlay.svg",
-    },
-    label: "Bandit guard normal",
-    groupId: "monster-tokens",
-  });
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/bandit-guard.png",
-    width: 60,
-    text: "X",
-    overlay: {
-      content:
-        "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/elite-monster-overlay.svg",
-    },
-    label: "Bandit guard elite",
-    groupId: "monster-tokens",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/bandit-archer.png",
-    width: 60,
-    text: "X",
-    overlay: {
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/normal-monster-overlay.svg`,
-    },
-    label: "Bandit archer normal",
-    groupId: "monster-tokens",
-  });
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/bandit-archer.png",
-    width: 60,
-    text: "X",
-    overlay: {
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/elite-monster-overlay.svg`,
-    },
-    label: "Bandit archer elite",
-    groupId: "monster-tokens",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/living-bones.png",
-    width: 60,
-    text: "X",
-    overlay: {
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/normal-monster-overlay.svg`,
-    },
-    label: "Living bones normal",
-    groupId: "monster-tokens",
-  });
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/living-bones.png",
-    width: 60,
-    text: "X",
-    overlay: {
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/elite-monster-overlay.svg`,
-    },
-    label: "Living bones elite",
-    groupId: "monster-tokens",
-  });
-
-  const monsters = ["bandit-guard", "bandit-archer", "living-bones"];
-  monsters.forEach((monsterName) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com//romgar/gloomhaven/master/images/monster-stat-cards/${monsterName}-0.png`,
-      width: 200,
-      label: `${monsterName}`,
-      groupId: `monster-stats-cards`,
-    });
-  });
-
-  // Overlay tokens
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/treasures/coin-1.png",
-    width: 50,
-    label: "Coin 1",
-    groupId: "treasures",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/treasures/treasure.png",
-    width: 50,
-    label: "Treasure",
-    groupId: "treasures",
-  });
-
-  items.push({
-    type: "counter",
-    value: 0,
-    width: 50,
-    label: "Life counter",
-    groupId: "counters",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/doors/stone-door.png",
-    width: 50,
-    label: "Stone door",
-    groupId: "doors",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/traps/spike-pit-trap.png",
-    width: 50,
-    label: "Spike pit trap",
-    groupId: "traps",
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/obstacles/table.png",
-    width: 50,
-    label: "Table",
-    groupId: "obstacles",
-  });
-
-  // Character ability cards
-  const brute = {
-    code: "BR",
-    abilityCards: {
-      "level-1": [
-        "eye-for-an-eye",
-        "grab-and-go",
-        "leaping-cleave",
-        "overwhelming-assault",
-        "provoking-roar",
-        "shield-bash",
-        "spare-dagger",
-        "sweeping-blow",
-        "trample",
-        "warding-strength",
-      ],
-      "level-X": ["balanced-measure", "skewer", "wall-of-doom"],
-      "level-2": ["fatal-advance", "juggernaut"],
-      "level-3": ["brute-force", "hook-and-chain"],
-      "level-4": ["devastating-hack", "unstoppable-charge"],
-      "level-5": ["skirmishing-maneuver", "whirlwind"],
-      "level-6": ["immovable-phalanx", "quietus"],
-      "level-7": ["crippling-offensive", "defensive-tactics"],
-      "level-8": ["frenzied-onslaught", "selfish-retribution"],
-      "level-9": ["face-your-end", "king-of-the-hill"],
-    },
-    backCard:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/character-ability-cards/BR/br-back.png",
-    icon:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-icons/brute-icon.png",
-    token:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-icons/brute-character-token.png",
-  };
-
-  brute.abilityCards["level-1"].forEach((abilityName) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com//romgar/gloomhaven/master/images/character-ability-cards/${brute.code}/${abilityName}.png`,
-      backContent: `${brute.backCard}`,
-      width: 100,
-      label: `Level 1 card: ${abilityName}`,
-      groupId: "brute",
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: brute.icon,
-    width: 40,
-    label: "Brute icon",
-    groupId: "brute",
-  });
-
-  items.push({
-    type: "image",
-    content: brute.token,
-    width: 20,
-    label: "Brute token",
-    groupId: "brute",
-  });
-
-  const spellWeaver = {
-    code: "SW",
-    abilityCards: {
-      "level-1": [
-        "fire-orbs",
-        "flame-strike",
-        "freezing-nova",
-        "frost-armor",
-        "impaling-eruption",
-        "mana-bolt",
-        "reviving-ether",
-        "ride-the-wind",
-      ],
-      "level-X": ["crackling-air", "hardened-spikes", "aid-from-the-ether"],
-      "level-2": ["flashing-burst", "icy-blast"],
-      "level-3": ["elemental-aid", "cold-fire"],
-      "level-4": ["forked-beam", "spirit-of-doom"],
-      "level-5": ["engulfed-in-flames", "chromatic-explosion"],
-      "level-6": ["frozen-night", "living-torch"],
-      "level-7": ["stone-fists", "twin-restoration"],
-      "level-8": ["zephyr-wings", "cold-front"],
-      "level-9": ["inferno", "black-hole"],
-    },
-    backCard:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/character-ability-cards/SW/sw-back.png",
-    icon:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-icons/spellweaver-icon.png",
-    token:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-icons/spellweaver-character-token.png",
-  };
-
-  spellWeaver.abilityCards["level-1"].forEach((abilityName) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com//romgar/gloomhaven/master/images/character-ability-cards/${spellWeaver.code}/${abilityName}.png`,
-      backContent: `${spellWeaver.backCard}`,
-      width: 100,
-      label: `Level 1 card: ${abilityName}`,
-      groupId: "spellweaver",
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: spellWeaver.icon,
-    width: 40,
-    label: "Spellweaver icon",
-    groupId: "spellweaver",
-  });
-
-  items.push({
-    type: "image",
-    content: spellWeaver.token,
-    width: 20,
-    label: "Spellweaver token",
-    groupId: "spellweaver",
-  });
-
-  const elements = ["ice", "air", "earth", "fire", "dark", "light"];
-  elements.forEach((elementName) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/elements/${elementName}-element.svg`,
-      width: 30,
-      label: `Element ${elementName}`,
-      groupId: "elements",
-    });
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/elements/element-matboard.png",
-    width: 300,
-    label: "Element matboard",
-    groupId: "elements",
-  });
-
-  const ailments = [
-    "reinforcement",
-    "disarm",
-    "immobilise",
-    "wound",
-    "stun",
-    "invisible",
-    "confusion",
-    "poison",
-  ];
-  ailments.forEach((ailmentName) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/ailments/${ailmentName}.png`,
-      width: 30,
-      label: `${ailmentName} icon`,
-      groupId: "ailments",
-    });
-  });
-
-  const battleGoals = [
-    "aggressor",
-    "diehard",
-    "dynamo",
-    "executioner",
-    "explorer",
-    "fasthealer",
-    "hoarder",
-    "hunter",
-    "indigent",
-    "layabout",
-    "masochist",
-    "neutralizer",
-    "opener",
-    "pacifist",
-    "plunderer",
-    "professional",
-    "protector",
-    "purist",
-    "sadist",
-    "scrambler",
-    "straggler",
-    "streamliner",
-    "workhorse",
-    "zealot",
-  ];
-  battleGoals.forEach((battleGoalName) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/battle-goals/${battleGoalName}.png`,
-      backContent:
-        "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/battle-goals/battlegoal-back.png",
-      flipped: true,
-      width: 30,
-      label: `${battleGoalName}`,
-      groupId: "battle-goals",
-    });
-  });
-
-  const characterItems = [
-    "boots-of-striding",
-    "cloak-of-invisibility",
-    "eagle-eye-goggles",
-    "heater-shield",
-    "hide-armor",
-    "iron-helmet",
-    "leather-armor",
-    "minor-healing-potion",
-    "minor-power-potion",
-    "minor-stamina-potion",
-    "piercing-bow",
-    "poison-dagger",
-    "war-hammer",
-    "winged-shoes",
-  ];
-  characterItems.forEach((itemName) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/items/1-14/${itemName}.png`,
-      flipped: true,
-      width: 40,
-      label: `${itemName}`,
-      groupId: "items 1-14",
-    });
-  });
-
-  return {
-    items,
-    board: { size: 3000, scale: 0.5 },
-  };
-};
-
-export const gameBox = genGloomhavenBox();
-
-export default gameBox;

src/games/gloomhaven.js

@@ -1,580 +0,0 @@
-const genGloomhaven = () => {
-  const items = [];
-
-  [...Array(7).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-ability-cards/archer/ma-ar-${
-        index + 1
-      }.png`,
-      backContent: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-ability-cards/archer/ma-ar-back.png`,
-      width: 100,
-      x: 200,
-      y: 200,
-    });
-  });
-
-  [...Array(7).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-ability-cards/guard/ma-gu-${
-        index + 1
-      }.png`,
-      backContent: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-ability-cards/guard/ma-gu-back.png`,
-      width: 100,
-      x: 200,
-      y: 300,
-    });
-  });
-
-  [...Array(7).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-ability-cards/living-bones/ma-lb-${
-        index + 1
-      }.png`,
-      backContent: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-ability-cards/living-bones/ma-lb-back.png`,
-      width: 100,
-      x: 200,
-      y: 500,
-    });
-  });
-
-  // map-tiles
-
-  [
-    "a4",
-    "b4",
-    "c2",
-    "d2",
-    "e1",
-    "f1",
-    "g2",
-    "h3",
-    "i2",
-    "j2",
-    "k2",
-    "l3",
-    "m1",
-    "n1",
-  ].forEach((ln) => {
-    const [l, n] = Array.from(ln);
-    [...Array(n).keys()].forEach((y) => {
-      items.push({
-        type: "image",
-        content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/map-tiles/${l}${
-          y + 1
-        }a.png`,
-        backContent: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/map-tiles/${l}${
-          y + 1
-        }b.png`,
-        text: `${l}${y}a`,
-        backText: `${l}${y}b`,
-        x: 558,
-        y: 80,
-      });
-    });
-  });
-
-  // character-mats
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-mats/brute.png",
-    backContent:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-mats/brute-back.png",
-    width: 300,
-    x: 500,
-    y: 500,
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-mats/spellweaver.png",
-    backContent:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-mats/spellweaver-back.png",
-    width: 300,
-    x: 500,
-    y: 700,
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-perks/brute-perks.png",
-    width: 300,
-    x: 1000,
-    y: 500,
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-perks/spellweaver-perks.png",
-    width: 300,
-    x: 1000,
-    y: 700,
-  });
-
-  // Attack modifiers
-
-  [...Array(19).keys()].forEach((_, index) => {
-    const number = index < 9 ? "0" + (index + 1) : "" + (index + 1);
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/attack-modifiers/base/player/am-p-${number}.png`,
-      backContent: "/games/gloom/attackback.png",
-      width: 100,
-      flipped: true,
-      x: 300,
-      y: 200,
-    });
-  });
-
-  [...Array(19).keys()].forEach((_, index) => {
-    const number = index < 9 ? "0" + (index + 1) : "" + (index + 1);
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/attack-modifiers/base/player/am-p-${number}.png`,
-      backContent: "/games/gloom/attackback.png",
-      width: 100,
-      flipped: true,
-      x: 300,
-      y: 600,
-    });
-  });
-
-  [...Array(19).keys()].forEach((_, index) => {
-    const number = index < 9 ? "0" + (index + 1) : "" + (index + 1);
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/attack-modifiers/base/monster/am-m-${number}.png`,
-      backContent: "/games/gloom/attackback.png",
-      width: 100,
-      flipped: true,
-      x: 1000,
-      y: 300,
-    });
-  });
-
-  // monster tokens
-  [...Array(10).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content:
-        "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/bandit-guard.png",
-      x: 1400 + 60 * index,
-      y: 0,
-      width: 60,
-      text: `${index}`,
-      overlay: {
-        content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/${
-          index < 7 ? "normal" : "elite"
-        }-monster-overlay.svg`,
-      },
-    });
-    items.push({
-      type: "image",
-      content:
-        "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/bandit-archer.png",
-      x: 1400 + 60 * index,
-      y: 50,
-      width: 60,
-      text: `${index}`,
-      overlay: {
-        content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/${
-          index < 7 ? "normal" : "elite"
-        }-monster-overlay.svg`,
-      },
-    });
-    items.push({
-      type: "image",
-      content:
-        "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/living-bones.png",
-      x: 1400 + 60 * index,
-      y: 100,
-      width: 60,
-      text: `${index}`,
-      overlay: {
-        content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/monster-tokens/${
-          index < 7 ? "normal" : "elite"
-        }-monster-overlay.svg`,
-      },
-    });
-  });
-
-  const monsters = ["bandit-guard", "bandit-archer", "living-bones"];
-
-  monsters.forEach((monsterName, index) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com//romgar/gloomhaven/master/images/monster-stat-cards/${monsterName}-0.png`,
-      x: 1300 + 200 * index,
-      y: 300,
-      width: 200,
-    });
-  });
-
-  // Overlay tokens
-  [...Array(20).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content:
-        "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/treasures/coin-1.png",
-      x: 1100 + 20 * index,
-      y: 200,
-      width: 50,
-    });
-  });
-
-  items.push({
-    type: "counter",
-    label: "Life #1",
-    value: 0,
-    x: 100,
-    y: 100,
-    width: 50,
-  });
-
-  items.push({
-    type: "counter",
-    label: "Life #2",
-    value: 0,
-    x: 100,
-    y: 300,
-    width: 50,
-  });
-
-  items.push({
-    type: "counter",
-    label: "XP #1",
-    value: 0,
-    x: 300,
-    y: 100,
-    width: 50,
-  });
-
-  items.push({
-    type: "counter",
-    label: "XP #2",
-    value: 0,
-    x: 300,
-    y: 300,
-    width: 50,
-  });
-
-  items.push({
-    type: "counter",
-    label: "Gold #1",
-    value: 0,
-    x: 100,
-    y: 600,
-    width: 50,
-  });
-
-  items.push({
-    type: "counter",
-    label: "Gold #2",
-    value: 0,
-    x: 100,
-    y: 900,
-    width: 50,
-  });
-
-  [...Array(3).keys()].forEach(() => {
-    [...Array(9).keys()].forEach((_, index) => {
-      items.push({
-        type: "counter",
-        label: `Monster #${index + 1}`,
-        value: 0,
-        x: 200 + 10 * index,
-        y: 900 + 10 * index,
-        width: 50,
-      });
-    });
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/treasures/treasure.png",
-    x: 1100,
-    y: 250,
-    width: 50,
-  });
-
-  [...Array(2).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content:
-        "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/doors/stone-door.png",
-      x: 1100 + 20 * index,
-      y: 300,
-      width: 50,
-    });
-  });
-
-  [...Array(2).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content:
-        "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/traps/spike-pit-trap.png",
-      x: 1100 + 20 * index,
-      y: 350,
-      width: 50,
-    });
-  });
-
-  [...Array(2).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content:
-        "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/overlay-tokens/obstacles/table.png",
-      x: 1100 + 20 * index,
-      y: 400,
-      width: 50,
-    });
-  });
-
-  // Character ability cards
-  const brute = {
-    code: "BR",
-    abilityCards: {
-      "level-1": [
-        "eye-for-an-eye",
-        "grab-and-go",
-        "leaping-cleave",
-        "overwhelming-assault",
-        "provoking-roar",
-        "shield-bash",
-        "spare-dagger",
-        "sweeping-blow",
-        "trample",
-        "warding-strength",
-      ],
-      "level-X": ["balanced-measure", "skewer", "wall-of-doom"],
-      "level-2": ["fatal-advance", "juggernaut"],
-      "level-3": ["brute-force", "hook-and-chain"],
-      "level-4": ["devastating-hack", "unstoppable-charge"],
-      "level-5": ["skirmishing-maneuver", "whirlwind"],
-      "level-6": ["immovable-phalanx", "quietus"],
-      "level-7": ["crippling-offensive", "defensive-tactics"],
-      "level-8": ["frenzied-onslaught", "selfish-retribution"],
-      "level-9": ["face-your-end", "king-of-the-hill"],
-    },
-    backCard:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/character-ability-cards/BR/br-back.png",
-    icon:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-icons/brute-icon.png",
-    token:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-icons/brute-character-token.png",
-  };
-
-  brute.abilityCards["level-1"].forEach((abilityName, index) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com//romgar/gloomhaven/master/images/character-ability-cards/${brute.code}/${abilityName}.png`,
-      backContent: `${brute.backCard}`,
-      x: 0 + 100 * index,
-      y: 1000,
-      width: 100,
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: brute.icon,
-    x: 450,
-    y: 500,
-    width: 40,
-  });
-
-  [...Array(5).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content: brute.token,
-      x: 350 + 20 * index,
-      y: 500,
-      width: 20,
-    });
-  });
-
-  const spellWeaver = {
-    code: "SW",
-    abilityCards: {
-      "level-1": [
-        "fire-orbs",
-        "flame-strike",
-        "freezing-nova",
-        "frost-armor",
-        "impaling-eruption",
-        "mana-bolt",
-        "reviving-ether",
-        "ride-the-wind",
-      ],
-      "level-X": ["crackling-air", "hardened-spikes", "aid-from-the-ether"],
-      "level-2": ["flashing-burst", "icy-blast"],
-      "level-3": ["elemental-aid", "cold-fire"],
-      "level-4": ["forked-beam", "spirit-of-doom"],
-      "level-5": ["engulfed-in-flames", "chromatic-explosion"],
-      "level-6": ["frozen-night", "living-torch"],
-      "level-7": ["stone-fists", "twin-restoration"],
-      "level-8": ["zephyr-wings", "cold-front"],
-      "level-9": ["inferno", "black-hole"],
-    },
-    backCard:
-      "https://raw.githubusercontent.com//romgar/gloomhaven/master/images/character-ability-cards/SW/sw-back.png",
-    icon:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-icons/spellweaver-icon.png",
-    token:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/character-icons/spellweaver-character-token.png",
-  };
-
-  spellWeaver.abilityCards["level-1"].forEach((abilityName, index) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com//romgar/gloomhaven/master/images/character-ability-cards/${spellWeaver.code}/${abilityName}.png`,
-      backContent: `${spellWeaver.backCard}`,
-      x: 0 + 100 * index,
-      y: 1150,
-      width: 100,
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: spellWeaver.icon,
-    x: 450,
-    y: 700,
-    width: 40,
-  });
-
-  [...Array(5).keys()].forEach((_, index) => {
-    items.push({
-      type: "image",
-      content: spellWeaver.token,
-      x: 350 + 20 * index,
-      y: 700,
-      width: 20,
-    });
-  });
-
-  const elements = ["ice", "air", "earth", "fire", "dark", "light"];
-  elements.forEach((elementName, index) => {
-    items.push({
-      type: "image",
-      content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/elements/${elementName}-element.svg`,
-      x: 0 + 30 * index,
-      y: 0,
-      width: 30,
-    });
-  });
-
-  items.push({
-    type: "image",
-    content:
-      "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/elements/element-matboard.png",
-    x: 0,
-    y: 100,
-    width: 300,
-  });
-
-  const ailments = [
-    "reinforcement",
-    "disarm",
-    "immobilise",
-    "wound",
-    "stun",
-    "invisible",
-    "confusion",
-    "poison",
-  ];
-  [...Array(5).keys()].forEach((_, rowIndex) => {
-    ailments.forEach((ailmentName, index) => {
-      items.push({
-        type: "image",
-        content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/ailments/${ailmentName}.png`,
-        x: 0 + 30 * index,
-        y: 100 + 40 * rowIndex,
-        width: 30,
-      });
-    });
-
-    const battleGoals = [
-      "aggressor",
-      "diehard",
-      "dynamo",
-      "executioner",
-      "explorer",
-      "fasthealer",
-      "hoarder",
-      "hunter",
-      "indigent",
-      "layabout",
-      "masochist",
-      "neutralizer",
-      "opener",
-      "pacifist",
-      "plunderer",
-      "professional",
-      "protector",
-      "purist",
-      "sadist",
-      "scrambler",
-      "straggler",
-      "streamliner",
-      "workhorse",
-      "zealot",
-    ];
-    battleGoals.forEach((battleGoalName, index) => {
-      items.push({
-        type: "image",
-        content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/battle-goals/${battleGoalName}.png`,
-        backContent:
-          "https://raw.githubusercontent.com/romgar/gloomhaven/master/images/battle-goals/battlegoal-back.png",
-        x: 200 + 1 * index,
-        y: 0 + 1 * index,
-        flipped: true,
-        width: 30,
-      });
-    });
-
-    const characterItems = [
-      "boots-of-striding",
-      "cloak-of-invisibility",
-      "eagle-eye-goggles",
-      "heater-shield",
-      "hide-armor",
-      "iron-helmet",
-      "leather-armor",
-      "minor-healing-potion",
-      "minor-power-potion",
-      "minor-stamina-potion",
-      "piercing-bow",
-      "poison-dagger",
-      "war-hammer",
-      "winged-shoes",
-    ];
-    characterItems.forEach((itemName, index) => {
-      items.push({
-        type: "image",
-        content: `https://raw.githubusercontent.com/romgar/gloomhaven/master/images/items/1-14/${itemName}.png`,
-        x: 1500 + 40 * index,
-        y: 1500,
-        flipped: true,
-        width: 40,
-      });
-    });
-  });
-
-  return {
-    items,
-    board: { size: 3000, scale: 0.5 },
-  };
-};
-
-export const game = genGloomhaven();
-
-export default game;

src/games/settlers.js

@@ -1,433 +0,0 @@
-const genGame = () => {
-  const items = [];
-
-  // Resource Cards
-
-  // 20
-  [...Array(20)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/clay.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 100 - v,
-      y: 300 - v,
-    });
-
-    items.push({
-      type: "image",
-      content: "/games/settlers/stone.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 300 - v,
-      y: 300 - v,
-    });
-
-    items.push({
-      type: "image",
-      content: "/games/settlers/wood.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 500 - v,
-      y: 300 - v,
-    });
-
-    items.push({
-      type: "image",
-      content: "/games/settlers/wheat.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 700 - v,
-      y: 300 - v,
-    });
-
-    items.push({
-      type: "image",
-      content: "/games/settlers/sheep.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 900 - v,
-      y: 300 - v,
-    });
-  });
-
-  // search
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/cathedral.png",
-    backContent: "/games/settlers/back.png",
-    width: 150,
-    x: 100,
-    y: 700,
-  });
-
-  [...Array(15)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/knight.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 300 - v,
-      y: 700 - v,
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/librarie.png",
-    backContent: "/games/settlers/back.png",
-    width: 150,
-    x: 500,
-    y: 700,
-  });
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/market.png",
-    backContent: "/games/settlers/back.png",
-    width: 150,
-    x: 700,
-    y: 700,
-  });
-
-  [...Array(2)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/progress.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 900 - v,
-      y: 700 - v,
-    });
-  });
-
-  [...Array(2)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/progress2.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 1100 - v,
-      y: 700 - v,
-    });
-  });
-
-  [...Array(2)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/progress3.png",
-      backContent: "/games/settlers/back.png",
-      width: 150,
-      x: 1300 - v,
-      y: 700 - v,
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/universty.png",
-    backContent: "/games/settlers/back.png",
-    width: 150,
-    x: 1500,
-    y: 700,
-  });
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/cathedral.png",
-    backContent: "/games/settlers/back.png",
-    width: 150,
-    x: 1700,
-    y: 700,
-  });
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/cathedral.png",
-    backContent: "/games/settlers/back.png",
-    width: 150,
-    x: 1700,
-    y: 700,
-  });
-
-  // Tiles
-
-  [...Array(3)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/tileClay.png",
-      backContent: "/games/settlers/tileBack.png",
-      width: 300,
-      x: 100 - v,
-      y: 1000 - v,
-      rotation: 30,
-    });
-  });
-  [...Array(3)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/tileStone.png",
-      backContent: "/games/settlers/tileBack.png",
-      width: 300,
-      x: 400 - v,
-      y: 1000 - v,
-      rotation: 30,
-    });
-  });
-  [...Array(4)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/tileSheep.png",
-      backContent: "/games/settlers/tileBack.png",
-      width: 300,
-      x: 700 - v,
-      y: 1000 - v,
-      rotation: 30,
-    });
-  });
-  [...Array(4)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/tileWheat.png",
-      backContent: "/games/settlers/tileBack.png",
-      width: 300,
-      x: 1000 - v,
-      y: 1000 - v,
-      rotation: 30,
-    });
-  });
-  [...Array(4)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/tileWood.png",
-      backContent: "/games/settlers/tileBack.png",
-      width: 300,
-      x: 1300 - v,
-      y: 1000 - v,
-      rotation: 30,
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/tileDesert.png",
-    backContent: "/games/settlers/tileBack.png",
-    width: 300,
-    x: 1600,
-    y: 1000,
-    rotation: 30,
-  });
-
-  [...Array(9)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/tileSea2.png",
-      backContent: "/games/settlers/tileBack.png",
-      width: 300,
-      x: 1900 - v,
-      y: 1000 - v,
-      rotation: 30,
-    });
-  });
-
-  [...Array(4)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/portAll.png",
-      backContent: "/games/settlers/tileBack.png",
-      width: 300,
-      x: 300 - v,
-      y: 1400 - v,
-      rotation: 30,
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/portClay.png",
-    backContent: "/games/settlers/tileBack.png",
-    width: 300,
-    x: 600,
-    y: 1400,
-    rotation: 30,
-  });
-  items.push({
-    type: "image",
-    content: "/games/settlers/portStone.png",
-    backContent: "/games/settlers/tileBack.png",
-    width: 300,
-    x: 900,
-    y: 1400,
-    rotation: 30,
-  });
-  items.push({
-    type: "image",
-    content: "/games/settlers/portSheep.png",
-    backContent: "/games/settlers/tileBack.png",
-    width: 300,
-    x: 1200,
-    y: 1400,
-    rotation: 30,
-  });
-  items.push({
-    type: "image",
-    content: "/games/settlers/portWheat.png",
-    backContent: "/games/settlers/tileBack.png",
-    width: 300,
-    x: 1500,
-    y: 1400,
-    rotation: 30,
-  });
-  items.push({
-    type: "image",
-    content: "/games/settlers/portWood.png",
-    backContent: "/games/settlers/tileBack.png",
-    width: 300,
-    x: 1800,
-    y: 1400,
-    rotation: 30,
-  });
-
-  // Tokens
-
-  [...Array(5)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/houseRed.png",
-      width: 70,
-      x: 100 + 100 * v,
-      y: 1800,
-    });
-  });
-
-  [...Array(4)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/house2red.png",
-      width: 90,
-      x: 100 + 100 * v,
-      y: 1900,
-    });
-  });
-
-  [...Array(15)].forEach((_, v) => {
-    items.push({
-      type: "rect",
-      color: "#FF0000",
-      width: 20,
-      height: 100,
-      x: 700 + 40 * v,
-      y: 1800,
-    });
-  });
-
-  [...Array(5)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/houseBlue.png",
-      width: 70,
-      x: 100 + 100 * v,
-      y: 2050,
-    });
-  });
-
-  [...Array(4)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/house2Blue.png",
-      width: 90,
-      x: 100 + 100 * v,
-      y: 2100,
-    });
-  });
-
-  [...Array(15)].forEach((_, v) => {
-    items.push({
-      type: "rect",
-      color: "#0000FF",
-      width: 20,
-      height: 100,
-      x: 700 + 40 * v,
-      y: 2050,
-    });
-  });
-
-  [...Array(5)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/houseOrange.png",
-      width: 70,
-      x: 100 + 100 * v,
-      y: 2250,
-    });
-  });
-
-  [...Array(4)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/house2Orange.png",
-      width: 90,
-      x: 100 + 100 * v,
-      y: 2300,
-    });
-  });
-
-  [...Array(15)].forEach((_, v) => {
-    items.push({
-      type: "rect",
-      color: "#ff6600",
-      width: 20,
-      height: 100,
-      x: 700 + 40 * v,
-      y: 2250,
-    });
-  });
-
-  [...Array(5)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/houseWhite.png",
-      width: 70,
-      x: 100 + 100 * v,
-      y: 2450,
-    });
-  });
-
-  [...Array(4)].forEach((_, v) => {
-    items.push({
-      type: "image",
-      content: "/games/settlers/house2White.png",
-      width: 90,
-      x: 100 + 100 * v,
-      y: 2500,
-    });
-  });
-
-  [...Array(15)].forEach((_, v) => {
-    items.push({
-      type: "rect",
-      color: "#ffd5d5",
-      width: 20,
-      height: 100,
-      x: 700 + 40 * v,
-      y: 2450,
-    });
-  });
-
-  items.push({
-    type: "image",
-    content: "/games/settlers/rogue.png",
-    x: 100,
-    y: 2700,
-  });
-
-  return {
-    items,
-    board: { size: 4000, scale: 0.5 },
-  };
-};
-
-const game = genGame();
-
-export default game;

src/games/tiktok.js

@@ -1,124 +0,0 @@
-const genTikTok = () => {
-  const items = [];
-
-  items.push({
-    type: "image",
-    content: "/games/tiktok.svg",
-    locked: true,
-    x: 100,
-    y: 100,
-  });
-
-  items.push({
-    type: "rect",
-    color: "#00D022",
-    width: 80,
-    height: 80,
-    x: 10,
-    y: 10,
-  });
-
-  items.push({
-    type: "rect",
-    color: "#00D022",
-    width: 80,
-    height: 80,
-    x: 15,
-    y: 12,
-  });
-
-  items.push({
-    type: "rect",
-    color: "#00D022",
-    width: 80,
-    height: 80,
-    x: 20,
-    y: 14,
-  });
-
-  items.push({
-    type: "rect",
-    color: "#00D022",
-    width: 80,
-    height: 80,
-    x: 25,
-    y: 16,
-  });
-
-  items.push({
-    type: "rect",
-    color: "#00D022",
-    width: 80,
-    height: 80,
-    x: 30,
-    y: 18,
-  });
-
-  items.push({
-    type: "rect",
-    color: "#00D022",
-    width: 80,
-    height: 80,
-    x: 35,
-    y: 20,
-  });
-
-  // Red player
-
-  items.push({
-    type: "round",
-    color: "#D00022",
-    radius: 80,
-    x: 1010,
-    y: 1050,
-  });
-
-  items.push({
-    type: "round",
-    color: "#D00022",
-    radius: 80,
-    x: 1015,
-    y: 1052,
-  });
-
-  items.push({
-    type: "round",
-    color: "#D00022",
-    radius: 80,
-    x: 1020,
-    y: 1054,
-  });
-
-  items.push({
-    type: "round",
-    color: "#D00022",
-    radius: 80,
-    x: 1025,
-    y: 1056,
-  });
-
-  items.push({
-    type: "round",
-    color: "#D00022",
-    radius: 80,
-    x: 1030,
-    y: 1058,
-  });
-
-  items.push({
-    type: "round",
-    color: "#D00022",
-    radius: 80,
-    x: 1035,
-    y: 1060,
-  });
-
-  return {
-    items,
-    board: { size: 1200, scale: 0.5 },
-  };
-};
-
-export const tiktok = genTikTok();
-
-export default tiktok;