mirror of
https://github.com/thepaperpilot/Advent-Incremental.git
synced 2024-11-22 00:21:34 +00:00
Fix coloring on coal and oil upgrades
This commit is contained in:
parent
53e8669061
commit
3155a5dc94
2 changed files with 86 additions and 31 deletions
|
@ -29,6 +29,7 @@ import {
|
||||||
import { noPersist, persistent } from "game/persistence";
|
import { noPersist, persistent } from "game/persistence";
|
||||||
import Decimal, { DecimalSource, format, formatWhole } from "util/bignum";
|
import Decimal, { DecimalSource, format, formatWhole } from "util/bignum";
|
||||||
import { WithRequired } from "util/common";
|
import { WithRequired } from "util/common";
|
||||||
|
import { Computable } from "util/computed";
|
||||||
import { render, renderGrid, renderRow } from "util/vue";
|
import { render, renderGrid, renderRow } from "util/vue";
|
||||||
import { computed, ref, unref } from "vue";
|
import { computed, ref, unref } from "vue";
|
||||||
import boxes from "./boxes";
|
import boxes from "./boxes";
|
||||||
|
@ -48,7 +49,7 @@ interface BetterFertilizerUpgOptions {
|
||||||
canAfford: () => boolean;
|
canAfford: () => boolean;
|
||||||
onPurchase: VoidFunction;
|
onPurchase: VoidFunction;
|
||||||
display: JSXFunction;
|
display: JSXFunction;
|
||||||
style: StyleValue;
|
style: Computable<StyleValue>;
|
||||||
visibility: () => Visibility;
|
visibility: () => Visibility;
|
||||||
}
|
}
|
||||||
interface UnlockKilnUpgOptions {
|
interface UnlockKilnUpgOptions {
|
||||||
|
@ -58,7 +59,7 @@ interface UnlockKilnUpgOptions {
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string;
|
||||||
};
|
};
|
||||||
style: StyleValue;
|
style: Computable<StyleValue>;
|
||||||
visibility: () => Visibility;
|
visibility: () => Visibility;
|
||||||
}
|
}
|
||||||
interface EfficientSmeltherUpgOptions {
|
interface EfficientSmeltherUpgOptions {
|
||||||
|
@ -68,7 +69,7 @@ interface EfficientSmeltherUpgOptions {
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string;
|
||||||
};
|
};
|
||||||
style: StyleValue;
|
style: Computable<StyleValue>;
|
||||||
visibility: () => Visibility;
|
visibility: () => Visibility;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -361,7 +362,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Warmer Cutters",
|
title: "Warmer Cutters",
|
||||||
description: "Cut down twice as many trees/s"
|
description: "Cut down twice as many trees/s"
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
}));
|
}));
|
||||||
const warmerPlanters = createUpgrade(() => ({
|
const warmerPlanters = createUpgrade(() => ({
|
||||||
resource: noPersist(coal),
|
resource: noPersist(coal),
|
||||||
|
@ -370,7 +373,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Warmer Planters",
|
title: "Warmer Planters",
|
||||||
description: "Plant twice as many trees/s"
|
description: "Plant twice as many trees/s"
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
}));
|
}));
|
||||||
const basicFertilizer = createUpgrade(() => ({
|
const basicFertilizer = createUpgrade(() => ({
|
||||||
resource: noPersist(ash),
|
resource: noPersist(ash),
|
||||||
|
@ -379,7 +384,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Ashy Soil",
|
title: "Ashy Soil",
|
||||||
description: "Trees give 25% more logs"
|
description: "Trees give 25% more logs"
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
}));
|
}));
|
||||||
const unlockBonfire = createUpgrade(() => ({
|
const unlockBonfire = createUpgrade(() => ({
|
||||||
resource: fireResource,
|
resource: fireResource,
|
||||||
|
@ -389,9 +396,11 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
description: "Put all those fires together into a larger blaze"
|
description: "Put all those fires together into a larger blaze"
|
||||||
},
|
},
|
||||||
onPurchase() {
|
onPurchase() {
|
||||||
fireResource.value = Decimal.add(fireResource.value, this.cost);
|
fireResource.value = Decimal.add(fireResource.value, this.cost as number);
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
}));
|
}));
|
||||||
const row1upgrades = [warmerCutters, warmerPlanters, basicFertilizer, unlockBonfire];
|
const row1upgrades = [warmerCutters, warmerPlanters, basicFertilizer, unlockBonfire];
|
||||||
|
|
||||||
|
@ -402,7 +411,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Dedicated Cutter Heaters",
|
title: "Dedicated Cutter Heaters",
|
||||||
description: "Double the bonus from Heated Cutters"
|
description: "Double the bonus from Heated Cutters"
|
||||||
},
|
},
|
||||||
style: { color: colorText },
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
},
|
||||||
visibility: () => showIf(unlockBonfire.bought.value)
|
visibility: () => showIf(unlockBonfire.bought.value)
|
||||||
}));
|
}));
|
||||||
const dedicatedPlanters = createUpgrade(() => ({
|
const dedicatedPlanters = createUpgrade(() => ({
|
||||||
|
@ -412,7 +423,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Dedicated Planter Heaters",
|
title: "Dedicated Planter Heaters",
|
||||||
description: "Double the bonus from Heated Planters"
|
description: "Double the bonus from Heated Planters"
|
||||||
},
|
},
|
||||||
style: { color: colorText },
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
},
|
||||||
visibility: () => showIf(unlockBonfire.bought.value)
|
visibility: () => showIf(unlockBonfire.bought.value)
|
||||||
}));
|
}));
|
||||||
const betterFertilizer: Upgrade<BetterFertilizerUpgOptions> = createUpgrade(() => ({
|
const betterFertilizer: Upgrade<BetterFertilizerUpgOptions> = createUpgrade(() => ({
|
||||||
|
@ -435,7 +448,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
{formatWhole(1e5)} {ash.displayName}
|
{formatWhole(1e5)} {ash.displayName}
|
||||||
</>
|
</>
|
||||||
)),
|
)),
|
||||||
style: { color: colorText },
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
},
|
||||||
visibility: () => showIf(unlockBonfire.bought.value)
|
visibility: () => showIf(unlockBonfire.bought.value)
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
@ -446,7 +461,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Efficient Fires",
|
title: "Efficient Fires",
|
||||||
description: "Move the fires underground to keep the coal from turning to ash"
|
description: "Move the fires underground to keep the coal from turning to ash"
|
||||||
},
|
},
|
||||||
style: { color: colorText },
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
},
|
||||||
visibility: () => showIf(unlockBonfire.bought.value)
|
visibility: () => showIf(unlockBonfire.bought.value)
|
||||||
}));
|
}));
|
||||||
const row2upgrades = [dedicatedCutters, dedicatedPlanters, betterFertilizer, unlockKiln];
|
const row2upgrades = [dedicatedCutters, dedicatedPlanters, betterFertilizer, unlockKiln];
|
||||||
|
@ -458,7 +475,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Efficient Crucibles",
|
title: "Efficient Crucibles",
|
||||||
description: "Double auto smelting speed and triple metal gain from auto smelting"
|
description: "Double auto smelting speed and triple metal gain from auto smelting"
|
||||||
},
|
},
|
||||||
style: { color: colorText },
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
},
|
||||||
visibility: () => showIf(oil.depthMilestones[4].earned.value)
|
visibility: () => showIf(oil.depthMilestones[4].earned.value)
|
||||||
}));
|
}));
|
||||||
const arsonistAssistance = createUpgrade(() => ({
|
const arsonistAssistance = createUpgrade(() => ({
|
||||||
|
@ -468,7 +487,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Arsonist Assistance",
|
title: "Arsonist Assistance",
|
||||||
description: "Every elf at or above level 5 doubles ash gain"
|
description: "Every elf at or above level 5 doubles ash gain"
|
||||||
},
|
},
|
||||||
style: { color: colorText },
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
},
|
||||||
visibility: () =>
|
visibility: () =>
|
||||||
showIf(management.elfTraining.coalDrillElfTraining.milestones[3].earned.value)
|
showIf(management.elfTraining.coalDrillElfTraining.milestones[3].earned.value)
|
||||||
}));
|
}));
|
||||||
|
@ -479,7 +500,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Refined Coal",
|
title: "Refined Coal",
|
||||||
description: "Refineries boost coal gain"
|
description: "Refineries boost coal gain"
|
||||||
},
|
},
|
||||||
style: { color: colorText },
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
},
|
||||||
visibility: () =>
|
visibility: () =>
|
||||||
showIf(management.elfTraining.coalDrillElfTraining.milestones[3].earned.value)
|
showIf(management.elfTraining.coalDrillElfTraining.milestones[3].earned.value)
|
||||||
}));
|
}));
|
||||||
|
@ -490,7 +513,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Colored Fire",
|
title: "Colored Fire",
|
||||||
description: "Green dye also affects small fire synergy"
|
description: "Green dye also affects small fire synergy"
|
||||||
},
|
},
|
||||||
style: { color: colorText },
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
},
|
||||||
visibility: () =>
|
visibility: () =>
|
||||||
showIf(management.elfTraining.coalDrillElfTraining.milestones[3].earned.value)
|
showIf(management.elfTraining.coalDrillElfTraining.milestones[3].earned.value)
|
||||||
}));
|
}));
|
||||||
|
|
|
@ -626,7 +626,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
description: "Increase drill power by +4% per Coal Drill owned.",
|
description: "Increase drill power by +4% per Coal Drill owned.",
|
||||||
effectDisplay: jsx(() => <>x{format(row1UpgradeEffects[0].value)}</>)
|
effectDisplay: jsx(() => <>x{format(row1UpgradeEffects[0].value)}</>)
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: metal.metal,
|
resource: metal.metal,
|
||||||
|
@ -636,7 +638,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
description: "Increase drill power by +4% per Metal Drill owned.",
|
description: "Increase drill power by +4% per Metal Drill owned.",
|
||||||
effectDisplay: jsx(() => <>x{format(row1UpgradeEffects[1].value)}</>)
|
effectDisplay: jsx(() => <>x{format(row1UpgradeEffects[1].value)}</>)
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: coal.coal,
|
resource: coal.coal,
|
||||||
|
@ -646,7 +650,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
description: "Increase drill power by +6% per OoM of coal owned.",
|
description: "Increase drill power by +6% per OoM of coal owned.",
|
||||||
effectDisplay: jsx(() => <>x{format(row1UpgradeEffects[2].value)}</>)
|
effectDisplay: jsx(() => <>x{format(row1UpgradeEffects[2].value)}</>)
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: metal.metal,
|
resource: metal.metal,
|
||||||
|
@ -656,7 +662,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
description: "Increase drill power by +10% per OoM of metal ingot owned.",
|
description: "Increase drill power by +10% per OoM of metal ingot owned.",
|
||||||
effectDisplay: jsx(() => <>x{format(row1UpgradeEffects[3].value)}</>)
|
effectDisplay: jsx(() => <>x{format(row1UpgradeEffects[3].value)}</>)
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -668,7 +676,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
<>+{format(Decimal.mul(row1UpgradeEffects[4].value, 100))}%</>
|
<>+{format(Decimal.mul(row1UpgradeEffects[4].value, 100))}%</>
|
||||||
))
|
))
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
}))
|
}))
|
||||||
];
|
];
|
||||||
const row1UpgradeEffects: ComputedRef<DecimalSource>[] = [
|
const row1UpgradeEffects: ComputedRef<DecimalSource>[] = [
|
||||||
|
@ -707,7 +717,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Oil the Oil Pump",
|
title: "Oil the Oil Pump",
|
||||||
description: "Double oil gain."
|
description: "Double oil gain."
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -717,7 +729,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
description:
|
description:
|
||||||
"Double ore mining speed and square the coal drill amount in its effect."
|
"Double ore mining speed and square the coal drill amount in its effect."
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -726,7 +740,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Blaster Burner",
|
title: "Blaster Burner",
|
||||||
description: "The Oil Burner can now increase your auto smelting multi."
|
description: "The Oil Burner can now increase your auto smelting multi."
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -735,7 +751,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
title: "Oil Integration",
|
title: "Oil Integration",
|
||||||
description: "Reduce Oil Pump's coal consumption multipler from 5 to 4"
|
description: "Reduce Oil Pump's coal consumption multipler from 5 to 4"
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -749,7 +767,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
</>
|
</>
|
||||||
))
|
))
|
||||||
},
|
},
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
}))
|
}))
|
||||||
];
|
];
|
||||||
const row3Upgrades = [
|
const row3Upgrades = [
|
||||||
|
@ -762,7 +782,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
},
|
},
|
||||||
visibility: () =>
|
visibility: () =>
|
||||||
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -773,7 +795,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
},
|
},
|
||||||
visibility: () =>
|
visibility: () =>
|
||||||
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -789,7 +813,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
},
|
},
|
||||||
visibility: () =>
|
visibility: () =>
|
||||||
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -800,7 +826,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
},
|
},
|
||||||
visibility: () =>
|
visibility: () =>
|
||||||
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
})),
|
})),
|
||||||
createUpgrade(() => ({
|
createUpgrade(() => ({
|
||||||
resource: noPersist(oil),
|
resource: noPersist(oil),
|
||||||
|
@ -811,7 +839,9 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
||||||
},
|
},
|
||||||
visibility: () =>
|
visibility: () =>
|
||||||
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
showIf(management.elfTraining.oilElfTraining.milestones[4].earned.value),
|
||||||
style: { color: colorText }
|
style() {
|
||||||
|
return this.bought.value ? "" : { color: colorText };
|
||||||
|
}
|
||||||
}))
|
}))
|
||||||
];
|
];
|
||||||
const coalConsumption = createSequentialModifier(() => [
|
const coalConsumption = createSequentialModifier(() => [
|
||||||
|
|
Loading…
Reference in a new issue