Updated Profectus changes
This commit is contained in:
parent
601c088a98
commit
8ea777f797
5 changed files with 301 additions and 281 deletions
BIN
public/particle.png
Normal file
BIN
public/particle.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 629 B |
|
|
@ -1,5 +1,5 @@
|
|||
import Row from "components/layout/Row.vue";
|
||||
import Tooltip from "components/Tooltip.vue";
|
||||
import Tooltip from "features/tooltips/Tooltip.vue";
|
||||
import { main } from "data/projEntry";
|
||||
import { createAchievement } from "features/achievements/achievement";
|
||||
import { jsx } from "features/feature";
|
||||
|
|
@ -13,8 +13,8 @@ import { render, renderRow } from "util/vue";
|
|||
import { computed } from "vue";
|
||||
import f from "./f";
|
||||
|
||||
const layer = createLayer(() => {
|
||||
const id = "a";
|
||||
const id = "a";
|
||||
const layer = createLayer(id, () => {
|
||||
const color = "yellow";
|
||||
const name = "Achievements";
|
||||
const points = createResource<DecimalSource>(0, "achievement power");
|
||||
|
|
|
|||
|
|
@ -16,11 +16,8 @@ import { createChallenge } from "features/challenges/challenge";
|
|||
import { createClickable } from "features/clickables/clickable";
|
||||
import {
|
||||
addSoftcap,
|
||||
createAdditiveModifier,
|
||||
createCumulativeConversion,
|
||||
createExponentialModifier,
|
||||
createPolynomialScaling,
|
||||
createSequentialModifier
|
||||
createPolynomialScaling
|
||||
} from "features/conversion";
|
||||
import { jsx, showIf, Visibility } from "features/feature";
|
||||
import { createHotkey } from "features/hotkey";
|
||||
|
|
@ -36,6 +33,11 @@ import { createTabFamily } from "features/tabs/tabFamily";
|
|||
import { createTree, createTreeNode, GenericTreeNode, TreeBranch } from "features/trees/tree";
|
||||
import { createUpgrade } from "features/upgrades/upgrade";
|
||||
import { createLayer } from "game/layers";
|
||||
import {
|
||||
createAdditiveModifier,
|
||||
createExponentialModifier,
|
||||
createSequentialModifier
|
||||
} from "game/modifiers";
|
||||
import { persistent } from "game/persistence";
|
||||
import settings from "game/settings";
|
||||
import { DecimalSource } from "lib/break_eternity";
|
||||
|
|
@ -44,8 +46,8 @@ import { render, renderCol, renderRow } from "util/vue";
|
|||
import { computed, ComputedRef, ref } from "vue";
|
||||
import f from "./f";
|
||||
|
||||
const layer = createLayer(() => {
|
||||
const id = "c";
|
||||
const id = "c";
|
||||
const layer = createLayer(id, () => {
|
||||
const color = "#4BDC13";
|
||||
const name = "Candies";
|
||||
const points = createResource<DecimalSource>(0, "lollipops");
|
||||
|
|
@ -486,9 +488,9 @@ const layer = createLayer(() => {
|
|||
]
|
||||
}));
|
||||
|
||||
const illuminatiTabs = createTabFamily(() => ({
|
||||
tabs: {
|
||||
first: {
|
||||
const illuminatiTabs = createTabFamily(
|
||||
{
|
||||
first: () => ({
|
||||
tab: jsx(() => (
|
||||
<>
|
||||
{renderRow(...upgrades)}
|
||||
|
|
@ -497,159 +499,157 @@ const layer = createLayer(() => {
|
|||
</>
|
||||
)),
|
||||
display: "first"
|
||||
},
|
||||
second: {
|
||||
}),
|
||||
second: () => ({
|
||||
tab: f.display,
|
||||
display: "second"
|
||||
}
|
||||
})
|
||||
},
|
||||
style: {
|
||||
width: "660px",
|
||||
backgroundColor: "brown",
|
||||
"--background": "brown",
|
||||
border: "solid white",
|
||||
marginLeft: "auto",
|
||||
marginRight: "auto"
|
||||
}
|
||||
}));
|
||||
|
||||
const tabs = createTabFamily(() => ({
|
||||
tabs: {
|
||||
mainTab: {
|
||||
tab: createTab(() => ({
|
||||
display: jsx(() => (
|
||||
<>
|
||||
<MainDisplay
|
||||
resource={points}
|
||||
color={color}
|
||||
effectDisplay={`which are boosting waffles by ${format(
|
||||
waffleBoost.value
|
||||
)} and increasing the Ice Cream cap by ${format(
|
||||
icecreamCap.value
|
||||
)}`}
|
||||
/>
|
||||
<Sticky>{render(resetButton)}</Sticky>
|
||||
<Resource resource={points} color={color} />
|
||||
<Spacer height="5px" />
|
||||
<button onClick={() => console.log("yeet")}>'HI'</button>
|
||||
<div>Name your points!</div>
|
||||
<Text
|
||||
modelValue={thingy.value}
|
||||
onUpdate:modelValue={value => (thingy.value = value)}
|
||||
/>
|
||||
<Sticky style="color: red; font-size: 32px; font-family: Comic Sans MS;">
|
||||
I have {displayResource(main.points)} {thingy.value} points!
|
||||
</Sticky>
|
||||
<hr />
|
||||
{renderCol(...lollipopMilestones)}
|
||||
<Spacer />
|
||||
{renderRow(...upgrades)}
|
||||
{renderRow(quasiUpgrade)}
|
||||
{renderRow(funChallenge)}
|
||||
</>
|
||||
))
|
||||
})),
|
||||
display: "main tab",
|
||||
glowColor() {
|
||||
if (
|
||||
generatorUpgrade.canPurchase.value ||
|
||||
lollipopMultiplierUpgrade.canPurchase.value ||
|
||||
unlockIlluminatiUpgrade.canPurchase.value ||
|
||||
funChallenge.canComplete.value
|
||||
) {
|
||||
return "blue";
|
||||
}
|
||||
return "";
|
||||
},
|
||||
style: { color: "orange" }
|
||||
},
|
||||
thingies: {
|
||||
tab: createTab(() => ({
|
||||
style() {
|
||||
return { backgroundColor: "#222222", "--background": "#222222" };
|
||||
},
|
||||
display: jsx(() => (
|
||||
<>
|
||||
{render(buyablesDisplay)}
|
||||
<Spacer />
|
||||
<Row style="width: 600px; height: 350px; background-color: green; border-style: solid;">
|
||||
<Toggle
|
||||
onUpdate:modelValue={value => (beep.value = value)}
|
||||
modelValue={beep.value}
|
||||
/>
|
||||
<Spacer width="30px" height="10px" />
|
||||
<div>
|
||||
<span>Beep</span>
|
||||
</div>
|
||||
<Spacer />
|
||||
<VerticalRule height="200px" />
|
||||
</Row>
|
||||
<Spacer />
|
||||
<img src="https://unsoftcapped2.github.io/The-Modding-Tree-2/discord.png" />
|
||||
</>
|
||||
))
|
||||
})),
|
||||
glowColor: "white",
|
||||
display: "thingies",
|
||||
style: { borderColor: "orange" }
|
||||
},
|
||||
jail: {
|
||||
tab: createTab(() => ({
|
||||
display: jsx(() => (
|
||||
<>
|
||||
{render(coolInfo)}
|
||||
{render(longBoi)}
|
||||
<Spacer />
|
||||
<Row>
|
||||
<Column style="background-color: #555555; padding: 15px">
|
||||
<div style="color: teal">Sugar level:</div>
|
||||
<Spacer />
|
||||
{render(tallBoi)}
|
||||
</Column>
|
||||
<Spacer />
|
||||
<Column>
|
||||
<div>idk</div>
|
||||
<Spacer width="0" height="50px" />
|
||||
{render(flatBoi)}
|
||||
</Column>
|
||||
</Row>
|
||||
<Spacer />
|
||||
<div>It's jail because "bars"! So funny! Ha ha!</div>
|
||||
{render(tree)}
|
||||
</>
|
||||
))
|
||||
})),
|
||||
display: "jail"
|
||||
},
|
||||
illuminati: {
|
||||
tab: createTab(() => ({
|
||||
display: jsx(() => (
|
||||
// This should really just be <> and </>, however for some reason the
|
||||
// typescript interpreter can't figure out this layer and f.tsx otherwise
|
||||
<div>
|
||||
<h1> C O N F I R M E D </h1>
|
||||
<Spacer />
|
||||
{render(illuminatiTabs)}
|
||||
<div>Adjust how many points H gives you!</div>
|
||||
<Slider
|
||||
onUpdate:modelValue={value => (otherThingy.value = value)}
|
||||
modelValue={otherThingy.value}
|
||||
min={1}
|
||||
max={30}
|
||||
/>
|
||||
</div>
|
||||
)),
|
||||
style: {
|
||||
backgroundColor: "#3325CC"
|
||||
}
|
||||
})),
|
||||
visibility() {
|
||||
return showIf(unlockIlluminatiUpgrade.bought.value);
|
||||
},
|
||||
display: "illuminati"
|
||||
() => ({
|
||||
style: {
|
||||
width: "660px",
|
||||
backgroundColor: "brown",
|
||||
"--background": "brown",
|
||||
border: "solid white",
|
||||
marginLeft: "auto",
|
||||
marginRight: "auto"
|
||||
}
|
||||
}
|
||||
}));
|
||||
})
|
||||
);
|
||||
|
||||
const tabs = createTabFamily({
|
||||
mainTab: () => ({
|
||||
tab: createTab(() => ({
|
||||
display: jsx(() => (
|
||||
<>
|
||||
<MainDisplay
|
||||
resource={points}
|
||||
color={color}
|
||||
effectDisplay={`which are boosting waffles by ${format(
|
||||
waffleBoost.value
|
||||
)} and increasing the Ice Cream cap by ${format(icecreamCap.value)}`}
|
||||
/>
|
||||
<Sticky>{render(resetButton)}</Sticky>
|
||||
<Resource resource={points} color={color} />
|
||||
<Spacer height="5px" />
|
||||
<button onClick={() => console.log("yeet")}>'HI'</button>
|
||||
<div>Name your points!</div>
|
||||
<Text
|
||||
modelValue={thingy.value}
|
||||
onUpdate:modelValue={value => (thingy.value = value)}
|
||||
/>
|
||||
<Sticky style="color: red; font-size: 32px; font-family: Comic Sans MS;">
|
||||
I have {displayResource(main.points)} {thingy.value} points!
|
||||
</Sticky>
|
||||
<hr />
|
||||
{renderCol(...lollipopMilestones)}
|
||||
<Spacer />
|
||||
{renderRow(...upgrades)}
|
||||
{renderRow(quasiUpgrade)}
|
||||
{renderRow(funChallenge)}
|
||||
</>
|
||||
))
|
||||
})),
|
||||
display: "main tab",
|
||||
glowColor() {
|
||||
if (
|
||||
generatorUpgrade.canPurchase.value ||
|
||||
lollipopMultiplierUpgrade.canPurchase.value ||
|
||||
unlockIlluminatiUpgrade.canPurchase.value ||
|
||||
funChallenge.canComplete.value
|
||||
) {
|
||||
return "blue";
|
||||
}
|
||||
return "";
|
||||
},
|
||||
style: { color: "orange" }
|
||||
}),
|
||||
thingies: () => ({
|
||||
tab: createTab(() => ({
|
||||
style() {
|
||||
return { backgroundColor: "#222222", "--background": "#222222" };
|
||||
},
|
||||
display: jsx(() => (
|
||||
<>
|
||||
{render(buyablesDisplay)}
|
||||
<Spacer />
|
||||
<Row style="width: 600px; height: 350px; background-color: green; border-style: solid;">
|
||||
<Toggle
|
||||
onUpdate:modelValue={value => (beep.value = value)}
|
||||
modelValue={beep.value}
|
||||
/>
|
||||
<Spacer width="30px" height="10px" />
|
||||
<div>
|
||||
<span>Beep</span>
|
||||
</div>
|
||||
<Spacer />
|
||||
<VerticalRule height="200px" />
|
||||
</Row>
|
||||
<Spacer />
|
||||
<img src="https://unsoftcapped2.github.io/The-Modding-Tree-2/discord.png" />
|
||||
</>
|
||||
))
|
||||
})),
|
||||
glowColor: "white",
|
||||
display: "thingies",
|
||||
style: { borderColor: "orange" }
|
||||
}),
|
||||
jail: () => ({
|
||||
tab: createTab(() => ({
|
||||
display: jsx(() => (
|
||||
<>
|
||||
{render(coolInfo)}
|
||||
{render(longBoi)}
|
||||
<Spacer />
|
||||
<Row>
|
||||
<Column style="background-color: #555555; padding: 15px">
|
||||
<div style="color: teal">Sugar level:</div>
|
||||
<Spacer />
|
||||
{render(tallBoi)}
|
||||
</Column>
|
||||
<Spacer />
|
||||
<Column>
|
||||
<div>idk</div>
|
||||
<Spacer width="0" height="50px" />
|
||||
{render(flatBoi)}
|
||||
</Column>
|
||||
</Row>
|
||||
<Spacer />
|
||||
<div>It's jail because "bars"! So funny! Ha ha!</div>
|
||||
{render(tree)}
|
||||
</>
|
||||
))
|
||||
})),
|
||||
display: "jail"
|
||||
}),
|
||||
illuminati: () => ({
|
||||
tab: createTab(() => ({
|
||||
display: jsx(() => (
|
||||
// This should really just be <> and </>, however for some reason the
|
||||
// typescript interpreter can't figure out this layer and f.tsx otherwise
|
||||
<div>
|
||||
<h1> C O N F I R M E D </h1>
|
||||
<Spacer />
|
||||
{render(illuminatiTabs)}
|
||||
<div>Adjust how many points H gives you!</div>
|
||||
<Slider
|
||||
onUpdate:modelValue={value => (otherThingy.value = value)}
|
||||
modelValue={otherThingy.value}
|
||||
min={1}
|
||||
max={30}
|
||||
/>
|
||||
</div>
|
||||
)),
|
||||
style: {
|
||||
backgroundColor: "#3325CC"
|
||||
}
|
||||
})),
|
||||
visibility() {
|
||||
return showIf(unlockIlluminatiUpgrade.bought.value);
|
||||
},
|
||||
display: "illuminati"
|
||||
})
|
||||
});
|
||||
|
||||
return {
|
||||
id,
|
||||
|
|
|
|||
|
|
@ -1,102 +1,134 @@
|
|||
{
|
||||
"number": {
|
||||
"value": 0
|
||||
"lifetime": {
|
||||
"min": 0.5,
|
||||
"max": 1
|
||||
},
|
||||
"color": {
|
||||
"value": ["#00FFFC", "#FC00FF", "#fffc00"]
|
||||
},
|
||||
"shape": {
|
||||
"type": ["circle", "triangle"],
|
||||
"options": {}
|
||||
},
|
||||
"opacity": {
|
||||
"value": 1,
|
||||
"animation": {
|
||||
"enable": true,
|
||||
"minimumValue": 0,
|
||||
"speed": 2,
|
||||
"startValue": "max",
|
||||
"destroy": "min"
|
||||
}
|
||||
},
|
||||
"size": {
|
||||
"value": 4,
|
||||
"random": {
|
||||
"enable": true,
|
||||
"minimumValue": 2
|
||||
}
|
||||
},
|
||||
"links": {
|
||||
"enable": false
|
||||
},
|
||||
"life": {
|
||||
"duration": {
|
||||
"sync": true,
|
||||
"value": 5
|
||||
"ease": [
|
||||
{
|
||||
"s": 0,
|
||||
"cp": 0.329,
|
||||
"e": 0.548
|
||||
},
|
||||
"count": 1
|
||||
},
|
||||
"move": {
|
||||
"enable": true,
|
||||
"gravity": {
|
||||
"enable": true,
|
||||
"acceleration": 10
|
||||
{
|
||||
"s": 0.548,
|
||||
"cp": 0.767,
|
||||
"e": 0.876
|
||||
},
|
||||
"speed": {
|
||||
"min": 10,
|
||||
"max": 20
|
||||
},
|
||||
"decay": 0.1,
|
||||
"direction": "none",
|
||||
"straight": false,
|
||||
"outModes": {
|
||||
"default": "destroy",
|
||||
"top": "none"
|
||||
{
|
||||
"s": 0.876,
|
||||
"cp": 0.985,
|
||||
"e": 1
|
||||
}
|
||||
],
|
||||
"frequency": 0.001,
|
||||
"emitterLifetime": 0.1,
|
||||
"maxParticles": 100,
|
||||
"addAtBack": true,
|
||||
"pos": {
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"rotate": {
|
||||
"value": {
|
||||
"min": 0,
|
||||
"max": 360
|
||||
"emit": false,
|
||||
"behaviors": [
|
||||
{
|
||||
"type": "alpha",
|
||||
"config": {
|
||||
"alpha": {
|
||||
"list": [
|
||||
{
|
||||
"time": 0,
|
||||
"value": 0.74
|
||||
},
|
||||
{
|
||||
"time": 1,
|
||||
"value": 0
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"direction": "random",
|
||||
"move": true,
|
||||
"animation": {
|
||||
"enable": true,
|
||||
"speed": 60
|
||||
}
|
||||
},
|
||||
"tilt": {
|
||||
"direction": "random",
|
||||
"enable": true,
|
||||
"move": true,
|
||||
"value": {
|
||||
"min": 0,
|
||||
"max": 360
|
||||
{
|
||||
"type": "moveSpeed",
|
||||
"config": {
|
||||
"speed": {
|
||||
"list": [
|
||||
{
|
||||
"time": 0,
|
||||
"value": 300
|
||||
},
|
||||
{
|
||||
"time": 1,
|
||||
"value": 0
|
||||
}
|
||||
]
|
||||
},
|
||||
"minMult": 1
|
||||
}
|
||||
},
|
||||
"animation": {
|
||||
"enable": true,
|
||||
"speed": 60
|
||||
}
|
||||
},
|
||||
"roll": {
|
||||
"darken": {
|
||||
"enable": true,
|
||||
"value": 25
|
||||
{
|
||||
"type": "scale",
|
||||
"config": {
|
||||
"scale": {
|
||||
"list": [
|
||||
{
|
||||
"time": 0,
|
||||
"value": 1
|
||||
},
|
||||
{
|
||||
"time": 1,
|
||||
"value": 0.25
|
||||
}
|
||||
]
|
||||
},
|
||||
"minMult": 1
|
||||
}
|
||||
},
|
||||
"enable": true,
|
||||
"speed": {
|
||||
"min": 15,
|
||||
"max": 25
|
||||
{
|
||||
"type": "color",
|
||||
"config": {
|
||||
"color": {
|
||||
"list": [
|
||||
{
|
||||
"time": 0,
|
||||
"value": "#ffdfa0"
|
||||
},
|
||||
{
|
||||
"time": 1,
|
||||
"value": "#100f0c"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "rotation",
|
||||
"config": {
|
||||
"accel": 0,
|
||||
"minSpeed": 0,
|
||||
"maxSpeed": 200,
|
||||
"minStart": 0,
|
||||
"maxStart": 360
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "textureRandom",
|
||||
"config": {
|
||||
"textures": [
|
||||
"/particle.png"
|
||||
]
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "spawnShape",
|
||||
"config": {
|
||||
"type": "rect",
|
||||
"data": {
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"w": 0,
|
||||
"h": 0
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"wobble": {
|
||||
"distance": 30,
|
||||
"enable": true,
|
||||
"move": true,
|
||||
"speed": {
|
||||
"min": -15,
|
||||
"max": 15
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,15 +10,16 @@ import { createReset } from "features/reset";
|
|||
import MainDisplay from "features/resources/MainDisplay.vue";
|
||||
import { createResource, displayResource } from "features/resources/resource";
|
||||
import { createLayer } from "game/layers";
|
||||
import { createMultiplicativeModifier } from "game/modifiers";
|
||||
import { persistent } from "game/persistence";
|
||||
import Decimal, { DecimalSource, formatWhole } from "util/bignum";
|
||||
import { IParticlesOptions } from "tsparticles-engine";
|
||||
import { render, renderRow } from "util/vue";
|
||||
import { ref } from "vue";
|
||||
import c from "./c";
|
||||
import confetti from "./confetti.json";
|
||||
|
||||
const layer = createLayer(() => {
|
||||
const id = "f";
|
||||
const id = "f";
|
||||
const layer = createLayer(id, () => {
|
||||
const color = "#FE0102";
|
||||
const name = "Farms";
|
||||
const points = createResource<DecimalSource>(0, "farm points");
|
||||
|
|
@ -56,32 +57,13 @@ const layer = createLayer(() => {
|
|||
break;
|
||||
case "Maybe that's a bit too far...":
|
||||
const pos = e == undefined ? undefined : "touches" in e ? e.touches[0] : e;
|
||||
particles.addEmitter({
|
||||
// TODO this case is annoying but required because move.direction is a string rather than keyof MoveDirection
|
||||
particles: confetti as unknown as IParticlesOptions,
|
||||
autoPlay: true,
|
||||
fill: false,
|
||||
shape: "square",
|
||||
startCount: 0,
|
||||
life: {
|
||||
count: 1,
|
||||
duration: 0.1,
|
||||
wait: false
|
||||
},
|
||||
rate: {
|
||||
delay: 0,
|
||||
quantity: 100
|
||||
},
|
||||
position: {
|
||||
x: (100 * (pos?.clientX ?? 0)) / window.innerWidth,
|
||||
y: (100 * (pos?.clientY ?? 0)) / window.innerHeight
|
||||
},
|
||||
size: {
|
||||
width: 0,
|
||||
height: 0,
|
||||
mode: "precise"
|
||||
const confettiParticles = Object.assign({}, confetti, {
|
||||
pos: {
|
||||
x: (pos?.clientX ?? 0) - (particles.boundingRect?.value?.left ?? 0),
|
||||
y: (pos?.clientY ?? 0) - (particles.boundingRect?.value?.top ?? 0)
|
||||
}
|
||||
});
|
||||
particles.addEmitter(confettiParticles).then(e => e.playOnceAndDestroy());
|
||||
clickableState.value = "Borkened...";
|
||||
break;
|
||||
default:
|
||||
|
|
@ -128,7 +110,7 @@ const layer = createLayer(() => {
|
|||
scaling: createPolynomialScaling(10, 0.5),
|
||||
baseResource: main.points,
|
||||
gainResource: points,
|
||||
modifyGainAmount: gain => Decimal.times(gain, c.otherThingy.value)
|
||||
modifyGainAmount: createMultiplicativeModifier(c.otherThingy)
|
||||
}));
|
||||
|
||||
const treeNode = createLayerTreeNode(() => ({
|
||||
|
|
@ -174,7 +156,13 @@ const layer = createLayer(() => {
|
|||
})
|
||||
}));
|
||||
|
||||
const particles = createParticles(() => ({}));
|
||||
const particles = createParticles(() => ({
|
||||
boundingRect: ref<null | DOMRect>(null),
|
||||
onContainerResized(boundingRect) {
|
||||
this.boundingRect.value = boundingRect;
|
||||
},
|
||||
style: "z-index: 2"
|
||||
}));
|
||||
|
||||
const tab = jsx(() => (
|
||||
<>
|
||||
|
|
|
|||
Loading…
Reference in a new issue