mirror of
https://github.com/thepaperpilot/Advent-Incremental.git
synced 2024-11-22 00:21:34 +00:00
Toy bar gradient
This commit is contained in:
parent
be092fcada
commit
a0b147064e
2 changed files with 81 additions and 76 deletions
|
@ -48,3 +48,18 @@
|
|||
);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes toys-bar {
|
||||
from {
|
||||
background: 0 0 / 114px 114px repeat repeating-linear-gradient(-45deg,
|
||||
#4bdc13 0 10px,
|
||||
green 10px 20px
|
||||
);
|
||||
}
|
||||
to {
|
||||
background: 114px 0px / 114px 114px repeat repeating-linear-gradient(-45deg,
|
||||
#4bdc13 0 10px,
|
||||
green 10px 20px
|
||||
);
|
||||
}
|
||||
}
|
|
@ -51,15 +51,18 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
const clothes = createResource<DecimalSource>(0, "clothes");
|
||||
const woodenBlocks = createResource<DecimalSource>(0, " wooden blocks");
|
||||
const trucks = createResource<DecimalSource>(0, "trucks");
|
||||
const toyGain = createSequentialModifier(() => [
|
||||
|
||||
]);
|
||||
const toySum = createResource(computed(() => Decimal.add(clothes.value, woodenBlocks.value).add(trucks.value)), "toys");
|
||||
const toyGain = createSequentialModifier(() => []);
|
||||
const toySum = createResource(
|
||||
computed(() => Decimal.add(clothes.value, woodenBlocks.value).add(trucks.value)),
|
||||
"toys"
|
||||
);
|
||||
|
||||
const clothesCost = computed(() => {
|
||||
var clothFactor = Decimal.add(1,clothesBuyable.amount.value);
|
||||
let clothFactor = Decimal.add(1, clothesBuyable.amount.value);
|
||||
if (milestones.milestone1.earned) {
|
||||
clothFactor=clothFactor.div(Decimal.div(workshop.foundationProgress.value,100).floor())
|
||||
clothFactor = clothFactor.div(
|
||||
Decimal.div(workshop.foundationProgress.value, 100).floor()
|
||||
);
|
||||
}
|
||||
return {
|
||||
cloth: clothFactor.mul(1e8),
|
||||
|
@ -71,17 +74,13 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
<>
|
||||
<h3>Make Clothes</h3>
|
||||
|
||||
<div>
|
||||
Click this buyable to make some clothes!
|
||||
</div>
|
||||
<div>Click this buyable to make some clothes!</div>
|
||||
|
||||
<div>You have {formatWhole(clothes.value)} clothes.</div>
|
||||
|
||||
<div>
|
||||
You have {formatWhole(clothes.value)} clothes.
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Costs {format(clothesCost.value.cloth)} cloth and requires {format(clothesCost.value.dye)} of red, yellow, and
|
||||
blue dye
|
||||
Costs {format(clothesCost.value.cloth)} cloth and requires{" "}
|
||||
{format(clothesCost.value.dye)} of red, yellow, and blue dye
|
||||
</div>
|
||||
</>
|
||||
)),
|
||||
|
@ -96,13 +95,15 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
onPurchase() {
|
||||
cloth.cloth.value = Decimal.sub(cloth.cloth.value, clothesCost.value.cloth);
|
||||
this.amount.value = Decimal.add(this.amount.value, 1);
|
||||
clothes.value = this.amount.value
|
||||
},
|
||||
clothes.value = this.amount.value;
|
||||
}
|
||||
})) as GenericBuyable;
|
||||
const woodenBlocksCost = computed(() => {
|
||||
var woodFactor = Decimal.add(1,woodenBlocksBuyable.amount.value).pow(5);
|
||||
let woodFactor = Decimal.add(1, woodenBlocksBuyable.amount.value).pow(5);
|
||||
if (milestones.milestone1.earned) {
|
||||
woodFactor=woodFactor.div(Decimal.div(workshop.foundationProgress.value,100).floor())
|
||||
woodFactor = woodFactor.div(
|
||||
Decimal.div(workshop.foundationProgress.value, 100).floor()
|
||||
);
|
||||
}
|
||||
return {
|
||||
wood: woodFactor.mul(1e40)
|
||||
|
@ -113,41 +114,34 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
<>
|
||||
<h3>Make Wooden Blocks</h3>
|
||||
|
||||
<div>
|
||||
Click this buyable to make some wooden blocks!
|
||||
</div>
|
||||
<div>Click this buyable to make some wooden blocks!</div>
|
||||
|
||||
<div>
|
||||
You have {formatWhole(woodenBlocks.value)} wooden blocks.
|
||||
</div>
|
||||
<div>You have {formatWhole(woodenBlocks.value)} wooden blocks.</div>
|
||||
|
||||
<div>
|
||||
Costs {format(woodenBlocksCost.value.wood)} logs
|
||||
</div>
|
||||
<div>Costs {format(woodenBlocksCost.value.wood)} logs</div>
|
||||
</>
|
||||
)),
|
||||
canPurchase(): boolean {
|
||||
return (
|
||||
woodenBlocksCost.value.wood.lte(trees.logs.value)
|
||||
);
|
||||
return woodenBlocksCost.value.wood.lte(trees.logs.value);
|
||||
},
|
||||
onPurchase() {
|
||||
trees.logs.value = Decimal.sub(trees.logs.value, woodenBlocksCost.value.wood);
|
||||
this.amount.value = Decimal.add(this.amount.value, 1);
|
||||
woodenBlocks.value = this.amount.value
|
||||
},
|
||||
woodenBlocks.value = this.amount.value;
|
||||
}
|
||||
})) as GenericBuyable;
|
||||
const trucksCost = computed(() => {
|
||||
var factor = Decimal.add(1,trucksBuyable.amount.value).pow(3);
|
||||
var plasticFactor = Decimal.add(1,trucksBuyable.amount.value);
|
||||
let factor = Decimal.add(1, trucksBuyable.amount.value).pow(3);
|
||||
let plasticFactor = Decimal.add(1, trucksBuyable.amount.value);
|
||||
if (milestones.milestone1.earned) {
|
||||
factor=factor.div(Decimal.div(workshop.foundationProgress.value,100).floor())
|
||||
plasticFactor=plasticFactor.div(Decimal.div(workshop.foundationProgress.value,100).floor())
|
||||
factor = factor.div(Decimal.div(workshop.foundationProgress.value, 100).floor());
|
||||
plasticFactor = plasticFactor.div(
|
||||
Decimal.div(workshop.foundationProgress.value, 100).floor()
|
||||
);
|
||||
}
|
||||
return {
|
||||
metal: factor.mul(1e25),
|
||||
plastic: plasticFactor.mul(1e10)
|
||||
|
||||
};
|
||||
});
|
||||
const trucksBuyable = createBuyable(() => ({
|
||||
|
@ -155,16 +149,13 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
<>
|
||||
<h3>Make Trucks</h3>
|
||||
|
||||
<div>
|
||||
Click this buyable to make some trucks!
|
||||
</div>
|
||||
<div>Click this buyable to make some trucks!</div>
|
||||
|
||||
<div>You have {formatWhole(trucks.value)} trucks.</div>
|
||||
|
||||
<div>
|
||||
You have {formatWhole(trucks.value)} trucks.
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Costs {format(trucksCost.value.metal)} metal and {format(trucksCost.value.plastic)} plastic
|
||||
Costs {format(trucksCost.value.metal)} metal and{" "}
|
||||
{format(trucksCost.value.plastic)} plastic
|
||||
</div>
|
||||
</>
|
||||
)),
|
||||
|
@ -178,8 +169,8 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
metal.metal.value = Decimal.sub(metal.metal.value, trucksCost.value.metal);
|
||||
plastic.plastic.value = Decimal.sub(plastic.plastic.value, trucksCost.value.plastic);
|
||||
this.amount.value = Decimal.add(this.amount.value, 1);
|
||||
trucks.value = this.amount.value
|
||||
},
|
||||
trucks.value = this.amount.value;
|
||||
}
|
||||
})) as GenericBuyable;
|
||||
const buyables = [clothesBuyable, woodenBlocksBuyable, trucksBuyable];
|
||||
const trucksUpgrade1 = createUpgrade(() => ({
|
||||
|
@ -189,15 +180,16 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
title: "Load logs onto trucks",
|
||||
description: "Log gain is doubled."
|
||||
}
|
||||
}))
|
||||
}));
|
||||
const clothesUpgrade1 = createUpgrade(() => ({
|
||||
resource: noPersist(clothes),
|
||||
cost: 30,
|
||||
display: {
|
||||
title: "Give elves clothes to wear",
|
||||
description: "Multiply ore per mining operation and auto-smelt purity by the number of clothes you have."
|
||||
description:
|
||||
"Multiply ore per mining operation and auto-smelt purity by the number of clothes you have."
|
||||
}
|
||||
}))
|
||||
}));
|
||||
|
||||
const woodenBlocksUpgrade1 = createUpgrade(() => ({
|
||||
resource: noPersist(woodenBlocks),
|
||||
|
@ -206,16 +198,13 @@ const layer = createLayer(id, function (this: BaseLayer) {
|
|||
title: "Build wooden towers",
|
||||
description: "You can now build 2 extra tall workshops!"
|
||||
}
|
||||
}))
|
||||
const row1Upgrades = [
|
||||
trucksUpgrade1,
|
||||
clothesUpgrade1,
|
||||
woodenBlocksUpgrade1
|
||||
];
|
||||
}));
|
||||
const row1Upgrades = [trucksUpgrade1, clothesUpgrade1, woodenBlocksUpgrade1];
|
||||
const milestone1 = createMilestone(() => ({
|
||||
display: {
|
||||
requirement: "10 toys",
|
||||
effectDisplay: "The cost of making toys is divided by the number of complete workshops you have."
|
||||
effectDisplay:
|
||||
"The cost of making toys is divided by the number of complete workshops you have."
|
||||
},
|
||||
shouldEarn: () => Decimal.gte(toySum.value, 10)
|
||||
}));
|
||||
|
@ -226,7 +215,7 @@ const row1Upgrades = [
|
|||
},
|
||||
shouldEarn: () => Decimal.gte(toySum.value, 100)
|
||||
}));
|
||||
const milestones = {milestone1, milestone2}
|
||||
const milestones = { milestone1, milestone2 };
|
||||
const { collapseMilestones, display: milestonesDisplay } =
|
||||
createCollapsibleMilestones(milestones);
|
||||
|
||||
|
@ -255,24 +244,25 @@ const { collapseMilestones, display: milestonesDisplay } =
|
|||
return;
|
||||
}
|
||||
if (Decimal.lt(clothes.value, clothesBuyable.amount.value)) {
|
||||
clothesBuyable.amount.value = clothes.value
|
||||
clothesBuyable.amount.value = clothes.value;
|
||||
}
|
||||
if (Decimal.lt(woodenBlocks.value, woodenBlocksBuyable.amount.value)) {
|
||||
woodenBlocksBuyable.amount.value = woodenBlocks.value
|
||||
woodenBlocksBuyable.amount.value = woodenBlocks.value;
|
||||
}
|
||||
if (Decimal.lt(trucks.value, trucksBuyable.amount.value)) {
|
||||
trucksBuyable.amount.value = trucks.value
|
||||
trucksBuyable.amount.value = trucks.value;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
const { total: totalToys, trackerDisplay } = setUpDailyProgressTracker({
|
||||
resource: toySum,
|
||||
goal: 200,
|
||||
name,
|
||||
day,
|
||||
color: colorDark,
|
||||
background: {
|
||||
gradient: "toys-bar",
|
||||
duration: "15s"
|
||||
},
|
||||
modal: {
|
||||
show: showModifiersModal,
|
||||
display: modifiersModal
|
||||
|
|
Loading…
Reference in a new issue