Plugin pattern improvements

content/artifacts/artifactory/plugin.js

@@ -1,5 +1,5 @@
 // Artifactory
-// 
+//
 // The artifactory plugin is your one-stop-shop for things related to artifacts.
 // * Find artifacts on your planets
 // * See when artifacts unlock
@@ -16,11 +16,8 @@ import {
 } from 'https://unpkg.com/htm/preact/standalone.module.js';
 
 import {
-  BiomeNames,
   energy,
   coords,
-  isMine,
-  isUnowned,
   unlockTime,
   canWithdraw,
   hasArtifact,
@@ -35,11 +32,27 @@ import {
   Speed,
 } from 'https://plugins.zkga.me/game/Icons.js';
 
+import {
+  EMPTY_ADDRESS
+} from "https://cdn.skypack.dev/@darkforest_eth/constants"
+
+import {
+  BiomeNames
+} from "https://cdn.skypack.dev/@darkforest_eth/types"
+
 // 30 seconds
 let REFRESH_INTERVAL = 1000 * 30;
 // 10 minutes
 let AUTO_INTERVAL = 1000 * 60 * 10;
 
+function isUnowned(planet) {
+  return planet.owner === EMPTY_ADDRESS;
+}
+
+function isMine(planet) {
+  return planet.owner === df.account;
+}
+
 function canDeposit(planet) {
   return planet && isMine(planet) && !planet.heldArtifactId
 }
@@ -246,7 +259,7 @@ function Unfound({ selected }) {
   let [lastLocationId, setLastLocationId] = useState(null);
 
   let planets = myPlanetsWithFindable()
-  .filter(planet => !planet.hasTriedFindingArtifact && (planet.prospectedBlockNumber === undefined || !prospectExpired(currentBlockNumber, planet.prospectedBlockNumber)))
+    .filter(planet => !planet.hasTriedFindingArtifact && (planet.prospectedBlockNumber === undefined || !prospectExpired(currentBlockNumber, planet.prospectedBlockNumber)))
 
   let planetsChildren = planets.map(planet => {
     let planetEntry = {
@@ -352,14 +365,11 @@ function Deposit({ selected }) {
   let [planet, setPlanet] = useState(ui.getSelectedPlanet);
 
   useLayoutEffect(() => {
-    let onClick = () => {
+    const sub = ui.selectedPlanetId$.subscribe(() => {
       setPlanet(ui.getSelectedPlanet());
-    }
-    window.addEventListener('click', onClick);
+    });
 
-    return () => {
-      window.removeEventListener('click', onClick);
-    }
+    return sub.unsubscribe;
   }, []);
 
   let artifacts = myArtifactsToDeposit();
@@ -592,7 +602,6 @@ function App() {
 
 class Artifactory {
   constructor() {
-    this.root = null;
     this.container = null
   }
 
@@ -601,11 +610,11 @@ class Artifactory {
 
     container.style.width = '450px';
 
-    this.root = render(html`<${App} />`, container);
+    render(html`<${App} />`, container);
   }
 
   destroy() {
-    render(null, this.container, this.root);
+    render(null, this.container);
   }
 }
 

content/artifacts/artifacts-finder/plugin.js

@@ -7,12 +7,14 @@
 // Author: SnowTiger
 
 import {
-  BiomeNames,
   energy,
   coords,
   canHaveArtifact,
 } from 'https://plugins.zkga.me/utils/utils.js';
 
+import {
+  BiomeNames
+} from "https://cdn.skypack.dev/@darkforest_eth/types"
 
 // prospect artifacts every 5 minutes
 let AUTO_INTERVAL = 1000 * 60 * 5;

content/artifacts/easy-highlight-artifacts/plugin.js

@@ -5,9 +5,20 @@ import {
   useState,
 } from "https://unpkg.com/htm/preact/standalone.module.js";
 
-const PIRATES = "0x0000000000000000000000000000000000000000";
-
-const PLANET_LEVELS = [1, 2, 3, 4, 5, 6, 7, 8, 9].map((level) => ({
+import { EMPTY_ADDRESS } from "https://cdn.skypack.dev/@darkforest_eth/constants";
+import {
+  ArtifactType,
+  ArtifactTypeNames,
+  ArtifactRarity,
+  ArtifactRarityNames,
+  PlanetLevel,
+  PlanetType,
+  PlanetTypeNames
+} from "https://cdn.skypack.dev/@darkforest_eth/types";
+
+const PIRATES = EMPTY_ADDRESS;
+
+const PLANET_LEVELS = Object.values(PlanetLevel).map((level) => ({
   value: level,
   text: level.toString(),
 }));
@@ -17,11 +28,7 @@ const ARTIFACT_ANY_RARITY = -1;
 
 const PLANET_TYPES = [
   { value: PLANET_ANY_TYPE, text: "Any" },
-  { value: 0, text: "Planet" },
-  { value: 1, text: "Asteroid Field" },
-  { value: 2, text: "Foundry" },
-  { value: 3, text: "Spacetime Rip" },
-  { value: 4, text: "Quasar" },
+  ...Object.values(PlanetType).filter((type) => type !== PlanetType.Unknown).map((type) => ({ value: type, text: PlanetTypeNames[type] }))
 ];
 
 const OwnerType = {
@@ -43,69 +50,15 @@ const ARTIFACT_TYPES = [
     value: ARTIFACT_ANY_TYPE,
     text: "Any",
   },
-  {
-    value: 1,
-    text: "Monolith",
-  },
-  {
-    value: 2,
-    text: "Colossus",
-  },
-  {
-    value: 3,
-    text: "Spaceship",
-  },
-  {
-    value: 4,
-    text: "Pyramid",
-  },
-  {
-    value: 5,
-    text: "Wormhole",
-  },
-  {
-    value: 6,
-    text: "PlanetaryShield",
-  },
-  {
-    value: 7,
-    text: "PhotoidCannon",
-  },
-  {
-    value: 8,
-    text: "BloomFilter",
-  },
-  {
-    value: 9,
-    text: "BlackDomain",
-  },
+  ...Object.values(ArtifactType).filter((type) => type !== ArtifactType.Unknown).map((type) => ({ value: type, text: ArtifactTypeNames[type] }))
 ];
 
 const ARTIFACT_RARITIES = [
   {
     value: ARTIFACT_ANY_RARITY,
     text: "Any",
   },
-  {
-    value: 1,
-    text: "Common",
-  },
-  {
-    value: 2,
-    text: "Rare",
-  },
-  {
-    value: 3,
-    text: "Epic",
-  },
-  {
-    value: 4,
-    text: "Legendary",
-  },
-  {
-    value: 5,
-    text: "Mythic",
-  },
+  ...Object.values(ArtifactRarity).filter((rarity) => rarity !== ArtifactRarity.Unknown).map((rarity) => ({ value: rarity, text: ArtifactRarityNames[rarity] }))
 ];
 
 function CreateSelectFilter({ items, selectedValue, onSelect }) {

content/artifacts/highlight-artifacts/plugin.js

@@ -1,5 +1,7 @@
 // Highlight Artifacts
 
+import { PlanetLevel, PlanetLevelNames } from "https://cdn.skypack.dev/@darkforest_eth/types";
+
 let viewport = ui.getViewport();
 
 class Plugin {
@@ -36,10 +38,10 @@ class Plugin {
     levelSelect.style.width = '100%';
     levelSelect.style.marginTop = '10px';
     levelSelect.style.marginBottom = '10px';
-    [0, 1, 2, 3, 4, 5, 6, 7].forEach(lvl => {
+    Object.values(PlanetLevel).forEach(lvl => {
       let opt = document.createElement('option');
       opt.value = `${lvl}`;
-      opt.innerText = `Level ${lvl}`;
+      opt.innerText = PlanetLevelNames[lvl];
       levelSelect.appendChild(opt);
     });
     levelSelect.value = `${this.levelFilter}`;
@@ -63,18 +65,20 @@ class Plugin {
     ctx.fillStyle = 'red';
     ctx.strokeStyle = 'red';
     for (let planet of this.artifacts) {
-      let { x, y } = planet.location.coords;
-      ctx.beginPath();
-      ctx.arc(
-        viewport.worldToCanvasX(x),
-        viewport.worldToCanvasY(y),
-        viewport.worldToCanvasDist(planet.planetLevel * 20),
-        0,
-        2 * Math.PI,
-      );
-      ctx.fill();
-      ctx.stroke();
-      ctx.closePath();
+      if (planet.location) {
+        let { x, y } = planet.location.coords;
+        ctx.beginPath();
+        ctx.arc(
+          viewport.worldToCanvasX(x),
+          viewport.worldToCanvasY(y),
+          viewport.worldToCanvasDist(planet.planetLevel * 20),
+          0,
+          2 * Math.PI,
+        );
+        ctx.fill();
+        ctx.stroke();
+        ctx.closePath();
+      }
     }
     ctx.restore();
   }

content/artifacts/hunt-artifacts/plugin.js

@@ -1,6 +1,11 @@
 // Hunt Artifacts
 
-const planetLevels = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
+import { EMPTY_ADDRESS } from "https://cdn.skypack.dev/@darkforest_eth/constants";
+import {
+  PlanetType,
+  PlanetLevel,
+  PlanetLevelNames
+} from "https://cdn.skypack.dev/@darkforest_eth/types";
 
 class Plugin {
   constructor() {
@@ -45,10 +50,10 @@ class Plugin {
     level.style.width = '100%';
     level.style.marginTop = '10px';
     level.style.marginBottom = '10px';
-    planetLevels.forEach(lvl => {
+    Object.values(PlanetLevel).forEach(lvl => {
       let opt = document.createElement('option');
       opt.value = `${lvl}`;
-      opt.innerText = `Level ${lvl}`;
+      opt.innerText = PlanetLevelNames[lvl];
       level.appendChild(opt);
     });
     level.value = `${this.minPlanetLevel}`;
@@ -116,7 +121,7 @@ class Plugin {
 export default Plugin;
 
 function isAsteroid(planet) {
-  return planet.planetResource === 1;
+  return planet.planetType === PlanetType.SILVER_MINE;
 }
 
 function captureArtifacts(fromId, maxDistributeEnergyPercent, minCaptureLevel) {
@@ -130,7 +135,7 @@ function captureArtifacts(fromId, maxDistributeEnergyPercent, minCaptureLevel) {
   }
 
   const candidates_ = df.getPlanetsInRange(fromId, maxDistributeEnergyPercent)
-    .filter(p => df.isPlanetMineable(p) && p.owner === "0x0000000000000000000000000000000000000000" && p.planetLevel >= minCaptureLevel)
+    .filter(p => df.isPlanetMineable(p) && p.owner === EMPTY_ADDRESS && p.planetLevel >= minCaptureLevel)
     .map(to => {
       return [to, distance(from, to)]
     })

content/casual/heatmap/plugin.js

@@ -3,6 +3,8 @@
 // The heatmap plugin highlights enemy territories on the board.
 // For each planet a semi transparent circle in the color of the owner and the size of the planet's range is rendered.
 
+import { EMPTY_ADDRESS } from "https://cdn.skypack.dev/@darkforest_eth/constants";
+
 class Plugin {
   constructor() {
     this.rangePercent = 10;
@@ -92,7 +94,7 @@ class Plugin {
     planets.sort((a, b) => b.range - a.range);
 
     for (const p of planets) {
-      if (p.owner === '0x0000000000000000000000000000000000000000') {
+      if (p.owner === EMPTY_ADDRESS) {
         continue;
       }
 

content/casual/universe-scout/plugin.js

@@ -4,29 +4,10 @@
 // space type, and biome of your mouse as you hover (even for unexplored
 // space!).
 
-
-// Fake their enum
-const SpaceType = {
-  0: 'Nebula',
-  1: 'Space',
-  2: 'Deep Space',
-  3: 'Dead Space',
-}
-
-// Fake their enum
-const BiomeNames = [
-  'Unknown',
-  'Ocean',
-  'Forest',
-  'Grassland',
-  'Tundra',
-  'Swamp',
-  'Desert',
-  'Ice',
-  'Wasteland',
-  'Lava',
-  "Corrupted",
-];
+import {
+  SpaceTypeNames,
+  BiomeNames
+} from "https://cdn.skypack.dev/@darkforest_eth/types";
 
 class Plugin {
   constructor() {
@@ -53,7 +34,7 @@ class Plugin {
       // Space perlin stuff
       let spacePerlin = df.spaceTypePerlin(coords, true);
       let sk = df.spaceTypeFromPerlin(spacePerlin);
-      this.spaceType.innerHTML = `Space: ${SpaceType[sk]}`;
+      this.spaceType.innerHTML = `Space: ${SpaceTypeNames[sk]}`;
       // Biome perlin stuff
       let biomePerlin = df.biomebasePerlin(coords, true);
       let fakeLoc = {