Merge remote-tracking branch 'template/main'

src/data/common.tsx

@@ -20,6 +20,7 @@ import type {
     ProcessedComputable
 } from "util/computed";
 import { convertComputable, processComputable } from "util/computed";
+import { createLazyProxy } from "util/proxies";
 import { renderJSX } from "util/vue";
 import type { Ref } from "vue";
 import { computed, unref } from "vue";
@@ -253,10 +254,14 @@ export interface Section {
 /**
  * Takes an array of modifier "sections", and creates a JSXFunction that can render all those sections, and allow each section to be collapsed.
  * Also returns a list of persistent refs that are used to control which sections are currently collapsed.
+ * @param sectionsFunc A function that returns the sections to display.
  */
 export function createCollapsibleModifierSections(
-    sections: Section[]
+    sectionsFunc: () => Section[]
 ): [JSXFunction, Persistent<boolean>[]] {
+    return createLazyProxy(() => {
+        const sections = sectionsFunc();
+
         const processedBase = sections.map(s => convertComputable(s.base));
         const processedBaseText = sections.map(s => convertComputable(s.baseText));
         const processedVisible = sections.map(s => convertComputable(s.visible));
@@ -309,6 +314,7 @@ export function createCollapsibleModifierSections(
             return <>{sectionJSX}</>;
         });
         return [jsxFunc, collapsed];
+    });
 }
 
 /**

src/data/layers/prestige.tsx

@@ -10,13 +10,13 @@ import MainDisplay from "features/resources/MainDisplay.vue";
 import { createResource } from "features/resources/resource";
 import { addTooltip } from "features/tooltips/tooltip";
 import { createResourceTooltip } from "features/trees/tree";
-import { createLayer } from "game/layers";
+import { BaseLayer, createLayer } from "game/layers";
 import type { DecimalSource } from "util/bignum";
 import { render } from "util/vue";
 import { createLayerTreeNode, createResetButton } from "../common";
 
 const id = "p";
-const layer = createLayer(id, () => {
+const layer = createLayer(id, function (this: BaseLayer) {
     const name = "Prestige";
     const color = "#4BDC13";
     const points = createResource<DecimalSource>(0, "prestige points");

src/data/projEntry.tsx

@@ -5,7 +5,7 @@ import { createResource, trackBest, trackOOMPS, trackTotal } from "features/reso
 import type { GenericTree } from "features/trees/tree";
 import { branchedResetPropagation, createTree } from "features/trees/tree";
 import { globalBus } from "game/events";
-import type { GenericLayer } from "game/layers";
+import type { BaseLayer, GenericLayer } from "game/layers";
 import { setupLayerModal } from "game/layers";
 import { createLayer } from "game/layers";
 import type { PlayerData } from "game/player";
@@ -21,7 +21,7 @@ import f from "./layers/aca/f";
 /**
  * @hidden
  */
-export const main = createLayer("main", () => {
+export const main = createLayer("main", function (this: BaseLayer) {
     const points = createResource<DecimalSource>(10);
     const best = trackBest(points);
     const total = trackTotal(points);

src/features/reset.ts

@@ -70,7 +70,7 @@ const listeners: Record<string, Unsubscribe | undefined> = {};
 export function trackResetTime(layer: BaseLayer, reset: GenericReset): Persistent<Decimal> {
     const resetTime = persistent<Decimal>(new Decimal(0));
     globalBus.on("addLayer", layerBeingAdded => {
-        if (layer === layerBeingAdded) {
+        if (layer.id === layerBeingAdded.id) {
             listeners[layer.id]?.();
             listeners[layer.id] = layer.on("preUpdate", diff => {
                 resetTime.value = Decimal.add(resetTime.value, diff);

src/game/events.ts

@@ -45,6 +45,11 @@ export interface GlobalEvents {
      * @param vue The Vue App being constructed.
      */
     setupVue: (vue: App) => void;
+    /**
+     * Sent whenever a save has finished loading.
+     * Happens when the page is opened and upon switching saves in the saves manager.
+     */
+    onLoad: VoidFunction;
 }
 
 /** A global event bus for hooking into {@link GlobalEvents}. */

src/game/modifiers.tsx

@@ -6,6 +6,7 @@ import Decimal, { format } from "util/bignum";
 import type { WithRequired } from "util/common";
 import type { Computable, ProcessedComputable } from "util/computed";
 import { convertComputable } from "util/computed";
+import { createLazyProxy } from "util/proxies";
 import { renderJSX } from "util/vue";
 import { computed, unref } from "vue";
 
@@ -44,17 +45,31 @@ export type ModifierFromOptionalParams<T, S> = T extends undefined
     ? Omit<WithRequired<Modifier, "revert" | "description">, "enabled">
     : WithRequired<Modifier, "revert" | "enabled" | "description">;
 
+/** An object that configures an additive modifier via {@link createAdditiveModifier}. */
+export interface AdditiveModifierOptions<
+    T extends Computable<CoercableComponent> | undefined,
+    S extends Computable<boolean> | undefined
+> {
+    /** The amount to add to the input value. */
+    addend: Computable<DecimalSource>;
+    /** Description of what this modifier is doing. */
+    description?: T;
+    /** A computable that will be processed and passed directly into the returned modifier. */
+    enabled?: S;
+}
+
 /**
  * Create a modifier that adds some value to the input value.
- * @param addend The amount to add to the input value.
- * @param description Description of what this modifier is doing.
- * @param enabled A computable that will be processed and passed directly into the returned modifier.
+ * @param optionsFunc Additive modifier options.
  */
 export function createAdditiveModifier<
     T extends Computable<CoercableComponent> | undefined,
     S extends Computable<boolean> | undefined,
     R = ModifierFromOptionalParams<T, S>
->(addend: Computable<DecimalSource>, description?: T, enabled?: S): R {
+>(optionsFunc: () => AdditiveModifierOptions<T, S>): R {
+    return createLazyProxy(() => {
+        const { addend, description, enabled } = optionsFunc();
+
         const processedAddend = convertComputable(addend);
         const processedDescription = convertComputable(description);
         const processedEnabled = enabled == null ? undefined : convertComputable(enabled);
@@ -79,20 +94,35 @@ export function createAdditiveModifier<
                               ) : null}
                           </div>
                       ))
-    } as unknown as R;
+        };
+    }) as unknown as R;
+}
+
+/** An object that configures an multiplicative modifier via {@link createMultiplicativeModifier}. */
+export interface MultiplicativeModifierOptions<
+    T extends Computable<CoercableComponent> | undefined,
+    S extends Computable<boolean> | undefined
+> {
+    /** The amount to multiply the input value by. */
+    multiplier: Computable<DecimalSource>;
+    /** Description of what this modifier is doing. */
+    description?: T;
+    /** A computable that will be processed and passed directly into the returned modifier. */
+    enabled?: S;
 }
 
 /**
  * Create a modifier that multiplies the input value by some value.
- * @param multiplier The value to multiply the input value by.
- * @param description Description of what this modifier is doing.
- * @param enabled A computable that will be processed and passed directly into the returned modifier.
+ * @param optionsFunc Multiplicative modifier options.
  */
 export function createMultiplicativeModifier<
     T extends Computable<CoercableComponent> | undefined,
     S extends Computable<boolean> | undefined,
     R = ModifierFromOptionalParams<T, S>
->(multiplier: Computable<DecimalSource>, description?: T, enabled?: S): R {
+>(optionsFunc: () => MultiplicativeModifierOptions<T, S>): R {
+    return createLazyProxy(() => {
+        const { multiplier, description, enabled } = optionsFunc();
+
         const processedMultiplier = convertComputable(multiplier);
         const processedDescription = convertComputable(description);
         const processedEnabled = enabled == null ? undefined : convertComputable(enabled);
@@ -105,7 +135,9 @@ export function createMultiplicativeModifier<
                     ? undefined
                     : jsx(() => (
                           <div class="modifier-container">
-                          <span class="modifier-amount">x{format(unref(processedMultiplier))}</span>
+                              <span class="modifier-amount">
+                                  x{format(unref(processedMultiplier))}
+                              </span>
                               {unref(processedDescription) ? (
                                   <span class="modifier-description">
                                       {/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}
@@ -114,20 +146,35 @@ export function createMultiplicativeModifier<
                               ) : null}
                           </div>
                       ))
-    } as unknown as R;
+        };
+    }) as unknown as R;
+}
+
+/** An object that configures an exponential modifier via {@link createExponentialModifier}. */
+export interface ExponentialModifierOptions<
+    T extends Computable<CoercableComponent> | undefined,
+    S extends Computable<boolean> | undefined
+> {
+    /** The amount to raise the input value to the power of. */
+    exponent: Computable<DecimalSource>;
+    /** Description of what this modifier is doing. */
+    description?: T;
+    /** A computable that will be processed and passed directly into the returned modifier. */
+    enabled?: S;
 }
 
 /**
  * Create a modifier that raises the input value to the power of some value.
- * @param exponent The value to raise the input value to the power of.
- * @param description Description of what this modifier is doing.
- * @param enabled A computable that will be processed and passed directly into the returned modifier.
+ * @param optionsFunc Exponential modifier options.
  */
 export function createExponentialModifier<
     T extends Computable<CoercableComponent> | undefined,
     S extends Computable<boolean> | undefined,
     R = ModifierFromOptionalParams<T, S>
->(exponent: Computable<DecimalSource>, description?: T, enabled?: S): R {
+>(optionsFunc: () => ExponentialModifierOptions<T, S>): R {
+    return createLazyProxy(() => {
+        const { exponent, description, enabled } = optionsFunc();
+
         const processedExponent = convertComputable(exponent);
         const processedDescription = convertComputable(description);
         const processedEnabled = enabled == null ? undefined : convertComputable(enabled);
@@ -140,7 +187,9 @@ export function createExponentialModifier<
                     ? undefined
                     : jsx(() => (
                           <div class="modifier-container">
-                          <span class="modifier-amount">^{format(unref(processedExponent))}</span>
+                              <span class="modifier-amount">
+                                  ^{format(unref(processedExponent))}
+                              </span>
                               {unref(processedDescription) ? (
                                   <span class="modifier-description">
                                       {/* eslint-disable-next-line @typescript-eslint/no-non-null-assertion */}
@@ -149,7 +198,8 @@ export function createExponentialModifier<
                               ) : null}
                           </div>
                       ))
-    } as unknown as R;
+        };
+    }) as unknown as R;
 }
 
 /**

src/util/save.ts

@@ -1,4 +1,5 @@
 import projInfo from "data/projInfo.json";
+import { globalBus } from "game/events";
 import type { Player, PlayerData } from "game/player";
 import player, { stringifySave } from "game/player";
 import settings, { loadSettings } from "game/settings";
@@ -112,6 +113,8 @@ export async function loadSave(playerObj: Partial<PlayerData>): Promise<void> {
 
     Object.assign(player, playerObj);
     settings.active = player.id;
+
+    globalBus.emit("onLoad");
 }
 
 setInterval(() => {