mirror of
https://github.com/thepaperpilot/Planar-Pioneers.git
synced 2024-11-21 16:13:54 +00:00
New "plane complete" state
This commit is contained in:
parent
14315932f7
commit
01045a70ee
2 changed files with 86 additions and 35 deletions
|
|
@ -29,3 +29,12 @@
|
|||
.showNotif .body {
|
||||
filter: drop-shadow(0px 0px 20px var(--foreground));
|
||||
}
|
||||
|
||||
.plane .row {
|
||||
min-width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.plane .col {
|
||||
margin: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import SpacerVue from "components/layout/Spacer.vue";
|
|||
import StickyVue from "components/layout/Sticky.vue";
|
||||
import { GenericAchievement, createAchievement } from "features/achievements/achievement";
|
||||
import { createBar } from "features/bars/bar";
|
||||
import { BoardNode, getUniqueNodeID } from "features/boards/board";
|
||||
import { getUniqueNodeID } from "features/boards/board";
|
||||
import { GenericClickable, createClickable, setupAutoClick } from "features/clickables/clickable";
|
||||
import { createCumulativeConversion, setupPassiveGeneration } from "features/conversion";
|
||||
import {
|
||||
|
|
@ -47,7 +47,7 @@ import { createCostRequirement } from "game/requirements";
|
|||
import Decimal, { DecimalSource, format, formatWhole } from "util/bignum";
|
||||
import { Direction, WithRequired, camelToTitle } from "util/common";
|
||||
import { Computable, ProcessedComputable, convertComputable } from "util/computed";
|
||||
import { VueFeature, render, renderCol, renderRow, trackHover } from "util/vue";
|
||||
import { VueFeature, render, renderCol, renderJSX, renderRow, trackHover } from "util/vue";
|
||||
import { ComputedRef, Ref, computed, ref, unref } from "vue";
|
||||
import { useToast } from "vue-toastification";
|
||||
import { isEmpowered, isPowered } from "./boardUtils";
|
||||
|
|
@ -195,7 +195,7 @@ export function createPlane(
|
|||
// Makes cost formula value reactive on n, so nextCost will update as appropriate
|
||||
let costFormula = Formula.variable(n).times(0);
|
||||
let previousGain: DecimalSource = 0;
|
||||
let visibility: Computable<boolean> = true;
|
||||
let visibility: ProcessedComputable<boolean> = true;
|
||||
const nextCost = computed(() =>
|
||||
Decimal.add(difficulty, random() - 0.5)
|
||||
.pow_base(2)
|
||||
|
|
@ -303,7 +303,11 @@ export function createPlane(
|
|||
title,
|
||||
description
|
||||
},
|
||||
visibility: upgradeVisibility
|
||||
visibility: computed(
|
||||
() =>
|
||||
earnedTreasures.value.length !== length &&
|
||||
unref(upgradeVisibility)
|
||||
)
|
||||
}));
|
||||
prepareFeature({
|
||||
feature: upgrade,
|
||||
|
|
@ -455,7 +459,11 @@ export function createPlane(
|
|||
effectDisplay: unref(effect),
|
||||
showAmount: false
|
||||
}),
|
||||
visibility: repeatableVisibility,
|
||||
visibility: computed(
|
||||
() =>
|
||||
earnedTreasures.value.length !== length &&
|
||||
unref(repeatableVisibility)
|
||||
),
|
||||
limit: 100,
|
||||
bonusAmount: () =>
|
||||
Decimal.gt(repeatable.amount.value, 0)
|
||||
|
|
@ -566,7 +574,11 @@ export function createPlane(
|
|||
canClick: () => Decimal.gte(conversion.actualGain.value, 1),
|
||||
prestigeResource,
|
||||
onClick: conversion.convert,
|
||||
visibility: clickableVisibility
|
||||
visibility: computed(
|
||||
() =>
|
||||
earnedTreasures.value.length !== length &&
|
||||
unref(clickableVisibility)
|
||||
)
|
||||
}));
|
||||
const { isHovering } = prepareFeature({
|
||||
feature: clickable,
|
||||
|
|
@ -669,7 +681,9 @@ export function createPlane(
|
|||
Decimal.sub(xp.value, xpForCurrentLevel.value)
|
||||
.div(Decimal.sub(xpToNextLevel.value, xpForCurrentLevel.value))
|
||||
.toNumber(),
|
||||
visibility: barVisibility,
|
||||
visibility: computed(
|
||||
() => earnedTreasures.value.length !== length && unref(barVisibility)
|
||||
),
|
||||
xp,
|
||||
display: jsx(() => (
|
||||
<span>
|
||||
|
|
@ -811,7 +825,11 @@ export function createPlane(
|
|||
isEmpowered("diamondRelic") != null ? Decimal.dInf : 1,
|
||||
requiresPay: () => !isEmpowered("unobtainiumRelic")
|
||||
})),
|
||||
visibility: repeatableVisibility
|
||||
visibility: computed(
|
||||
() =>
|
||||
earnedTreasures.value.length !== length &&
|
||||
unref(repeatableVisibility)
|
||||
)
|
||||
}));
|
||||
clickables.push(clickable);
|
||||
const isHovering = trackHover(clickable);
|
||||
|
|
@ -875,7 +893,10 @@ export function createPlane(
|
|||
features.push(clickables);
|
||||
displays[i * 2] = jsx(() => (
|
||||
<>
|
||||
{isVisible(repeatableVisibility) ? (
|
||||
{isVisible(
|
||||
earnedTreasures.value.length !== length &&
|
||||
unref(repeatableVisibility)
|
||||
) ? (
|
||||
<div style="margin: 10px">
|
||||
You have{" "}
|
||||
<h2
|
||||
|
|
@ -933,7 +954,10 @@ export function createPlane(
|
|||
reset.reset();
|
||||
}
|
||||
},
|
||||
visibility: upgradeVisibility,
|
||||
visibility: computed(
|
||||
() =>
|
||||
earnedTreasures.value.length !== length && unref(upgradeVisibility)
|
||||
),
|
||||
requirements: createCostRequirement(() => ({
|
||||
resource: noPersist(resource),
|
||||
cost,
|
||||
|
|
@ -1089,7 +1113,7 @@ export function createPlane(
|
|||
resource: noPersist(resource),
|
||||
cost
|
||||
})),
|
||||
visibility: milestoneVisibility,
|
||||
visibility: computed(() => unref(milestoneVisibility)),
|
||||
display: {
|
||||
requirement: `${format(cost)} ${resource.displayName}`,
|
||||
effectDisplay: description
|
||||
|
|
@ -1110,8 +1134,8 @@ export function createPlane(
|
|||
direction: Direction.Down
|
||||
});
|
||||
features.push([milestone]);
|
||||
// Wrap milestone.earned so it doesn't get reset
|
||||
visibility = computed(() => milestone.earned.value);
|
||||
visibility = milestone.earned;
|
||||
displays[i * 2 + 1] = jsx(() => renderJSX(milestone));
|
||||
}
|
||||
|
||||
const upgrades = findFeatures(
|
||||
|
|
@ -1399,6 +1423,7 @@ export function createPlane(
|
|||
background,
|
||||
"--background": background
|
||||
},
|
||||
classes: { plane: true },
|
||||
features,
|
||||
resourceTabCollapsed,
|
||||
links,
|
||||
|
|
@ -1432,7 +1457,10 @@ export function createPlane(
|
|||
direction={Direction.Down}
|
||||
style={"width: 300px"}
|
||||
>
|
||||
<h3>{influences.length} influences</h3>
|
||||
<h3>
|
||||
{influences.length} influence
|
||||
{influences.length === 1 ? "" : "s"}
|
||||
</h3>
|
||||
</TooltipVue>
|
||||
</span>
|
||||
)}
|
||||
|
|
@ -1446,6 +1474,7 @@ export function createPlane(
|
|||
</button>
|
||||
</span>
|
||||
</StickyVue>
|
||||
{earnedTreasures.value.length === length ? null : (
|
||||
<StickyVue class="nav-container">
|
||||
<span class="nav-segment">
|
||||
<h3 style={`color: ${color}; text-shadow: 0px 0px 10px ${color};`}>
|
||||
|
|
@ -1467,7 +1496,13 @@ export function createPlane(
|
|||
</span>
|
||||
) : null}
|
||||
</StickyVue>
|
||||
<SpacerVue height="60px" />
|
||||
)}
|
||||
<SpacerVue height={earnedTreasures.value.length === length ? "30px" : "60px"} />
|
||||
{earnedTreasures.value.length === length ? (
|
||||
<div>
|
||||
<h1 style="color: var(--layer-color)">Plane Complete!</h1>
|
||||
</div>
|
||||
) : null}
|
||||
{renderableFeatures.value}
|
||||
{earnedTreasures.value.length + 1 < length ? (
|
||||
<div>
|
||||
|
|
@ -1483,8 +1518,15 @@ export function createPlane(
|
|||
<span>{name}</span>
|
||||
<span style="font-size: large; vertical-align: sub;">
|
||||
{" "}
|
||||
{tier}-tier |{" "}
|
||||
{earnedTreasures.value.length === length ? (
|
||||
<span>Plane Complete</span>
|
||||
) : (
|
||||
<span>
|
||||
{earnedTreasures.value.length}/{length} treasures
|
||||
</span>
|
||||
)}
|
||||
</span>
|
||||
</div>
|
||||
))
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in a new issue