profectus/TMT-Demo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix various issues from typescript update

Browse source
This commit is contained in:
thepaperpilot 2021-09-04 00:37:45 -05:00
parent c1ab09f0fb
commit d56aa82297
13 changed files with 130 additions and 139 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

39
src/components/features/Achievements.vue
View file

@ -1,47 +1,30 @@
<template>
<div v-if="filteredAchievements" class="table">
<template v-if="filteredAchievements.rows && filteredAchievements.cols">
<div v-for="row in filteredAchievements.rows" class="row" :key="row">
<div v-for="col in filteredAchievements.cols" :key="col">
<div v-if="filtered" class="table">
<template v-if="rows && cols">
<div v-for="row in rows" class="row" :key="row">
<div v-for="col in cols" :key="col">
<achievement
v-if="filteredAchievements[row * 10 + col] !== undefined"
v-if="filtered[row * 10 + col] !== undefined"
class="align"
:id="row * 10 + col"
/>
</div>
</div>
</template>
<template v-frag v-else>
<achievement v-for="(achievement, id) in filteredAchievements" :key="id" :id="id" />
</template>
<row v-else>
<achievement v-for="(achievement, id) in filtered" :key="id" :id="id" />
</row>
</div>
</template>
<script lang="ts">
import { layers } from "@/game/layers";
import { Achievement } from "@/typings/features/achievement";
import { getFiltered, InjectLayerMixin } from "@/util/vue";
import { defineComponent, PropType } from "vue";
import { FilteredFeaturesMixin, InjectLayerMixin } from "@/util/vue";
import { defineComponent } from "vue";
export default defineComponent({
name: "achievements",
mixins: [InjectLayerMixin],
props: {
achievements: {
type: Object as PropType<Array<string>>
}
},
computed: {
filteredAchievements(): Record<string, Achievement> {
if (layers[this.layer].achievements) {
return getFiltered<Achievement>(
layers[this.layer].achievements!.data,
this.achievements
);
}
return {};
}
}
mixins: [InjectLayerMixin, FilteredFeaturesMixin<Achievement>("achievements")]
});
</script>

27
src/components/features/Buyables.vue
View file

@ -1,5 +1,5 @@
<template>
<div v-if="filteredBuyables" class="table">
<div v-if="filtered" class="table">
<respec-button
v-if="showRespec"
style="margin-bottom: 12px;"
@ -8,11 +8,11 @@
@set-confirm-respec="setConfirmRespec"
@respec="respec"
/>
<template v-if="filteredBuyables.rows && filteredBuyables.cols">
<div v-for="row in filteredBuyables.rows" class="row" :key="row">
<div v-for="col in filteredBuyables.cols" :key="col">
<template v-if="rows && cols">
<div v-for="row in rows" class="row" :key="row">
<div v-for="col in cols" :key="col">
<buyable
v-if="filteredBuyables[row * 10 + col] !== undefined"
v-if="filtered[row * 10 + col] !== undefined"
class="align buyable-container"
:style="{ height }"
:id="row * 10 + col"
@ -23,7 +23,7 @@
</template>
<row v-else>
<buyable
v-for="(buyable, id) in filteredBuyables"
v-for="(buyable, id) in filtered"
:key="id"
class="align buyable-container"
:style="{ height }"
@ -39,28 +39,19 @@ import { layers } from "@/game/layers";
import player from "@/game/player";
import { CoercableComponent } from "@/typings/component";
import { Buyable } from "@/typings/features/buyable";
import { getFiltered, InjectLayerMixin } from "@/util/vue";
import { defineComponent, PropType } from "vue";
import { FilteredFeaturesMixin, InjectLayerMixin } from "@/util/vue";
import { defineComponent } from "vue";
export default defineComponent({
name: "buyables",
mixins: [InjectLayerMixin],
mixins: [InjectLayerMixin, FilteredFeaturesMixin<Buyable>("buyables")],
props: {
buyables: {
type: Object as PropType<Array<string>>
},
height: {
type: [Number, String],
default: "inherit"
}
},
computed: {
filteredBuyables(): Record<string, Buyable> {
if (layers[this.layer].buyables) {
return getFiltered<Buyable>(layers[this.layer].buyables!.data, this.buyables);
}
return {};
},
showRespec(): boolean | undefined {
return layers[this.layer].buyables!.showRespecButton;
},

32
src/components/features/Challenges.vue
View file

@ -1,40 +1,26 @@
<template>
<div v-if="filteredChallenges" class="table">
<template v-if="filteredChallenges.rows && filteredChallenges.cols">
<div v-for="row in filteredChallenges.rows" class="row" :key="row">
<div v-for="col in filteredChallenges.cols" :key="col">
<challenge
v-if="filteredChallenges[row * 10 + col] !== undefined"
:id="row * 10 + col"
/>
<div v-if="filtered" class="table">
<template v-if="rows && cols">
<div v-for="row in rows" class="row" :key="row">
<div v-for="col in cols" :key="col">
<challenge v-if="filtered[row * 10 + col] !== undefined" :id="row * 10 + col" />
</div>
</div>
</template>
<row v-else>
<challenge v-for="(challenge, id) in filteredChallenges" :key="id" :id="id" />
<challenge v-for="(challenge, id) in filtered" :key="id" :id="id" />
</row>
</div>
</template>
<script lang="ts">
import { layers } from "@/game/layers";
import { Challenge } from "@/typings/features/challenge";
import { getFiltered, InjectLayerMixin } from "@/util/vue";
import { defineComponent, PropType } from "vue";
import { FilteredFeaturesMixin, InjectLayerMixin } from "@/util/vue";
import { defineComponent } from "vue";
export default defineComponent({
name: "challenges",
mixins: [InjectLayerMixin],
props: {
challenges: {
type: Object as PropType<Array<string>>
}
},
computed: {
filteredChallenges(): Record<string, Challenge> {
return getFiltered(layers[this.layer].challenges!.data, this.challenges);
}
}
mixins: [InjectLayerMixin, FilteredFeaturesMixin<Challenge>("challenges")]
});
</script>

26
src/components/features/Clickables.vue
View file

@ -1,11 +1,11 @@
<template>
<div v-if="filteredClickables" class="table">
<div v-if="filtered != undefined" class="table">
<master-button v-if="showMaster" style="margin-bottom: 12px;" @press="press" />
<template v-if="filteredClickables.rows && filteredClickables.cols">
<div v-for="row in filteredClickables.rows" class="row" :key="row">
<div v-for="col in filteredClickables.cols" :key="col">
<template v-if="rows && cols">
<div v-for="row in rows" class="row" :key="row">
<div v-for="col in cols" :key="col">
<clickable
v-if="filteredClickables[row * 10 + col] !== undefined"
v-if="filtered[row * 10 + col] !== undefined"
class="align clickable-container"
:style="{ height }"
:id="row * 10 + col"
@ -16,7 +16,7 @@
</template>
<row v-else>
<clickable
v-for="(clickable, id) in filteredClickables"
v-for="(clickable, id) in filtered"
:key="id"
class="align clickable-container"
:style="{ height }"
@ -28,18 +28,15 @@
</template>
<script lang="ts">
import { Clickable } from "@/typings/features/clickable";
import { defineComponent, PropType } from "vue";
import { layers } from "@/game/layers";
import { getFiltered, InjectLayerMixin } from "@/util/vue";
import { Clickable } from "@/typings/features/clickable";
import { FilteredFeaturesMixin, InjectLayerMixin } from "@/util/vue";
import { defineComponent } from "vue";
export default defineComponent({
name: "clickables",
mixins: [InjectLayerMixin],
mixins: [InjectLayerMixin, FilteredFeaturesMixin<Clickable>("clickables")],
props: {
achievements: {
type: Object as PropType<Array<string>>
},
showMasterButton: {
type: Boolean,
default: null
@ -50,9 +47,6 @@ export default defineComponent({
}
},
computed: {
filteredClickables(): Record<string, Clickable> {
return getFiltered(layers[this.layer].clickables!.data, this.clickables);
},
showMaster(): boolean | undefined {
if (layers[this.layer].clickables?.masterButtonClick == undefined) {
return false;

6
src/components/features/GridCell.vue
View file

@ -1,9 +1,9 @@
<template>
<button
v-if="gridable.unlocked"
v-if="gridCell.unlocked"
:class="{ feature: true, tile: true, can: canClick, locked: !canClick }"
:style="style"
@click="gridable.click"
@click="gridCell.click"
@mousedown="start"
@mouseleave="stop"
@mouseup="stop"
@ -14,7 +14,7 @@
>
<div v-if="title"><component :is="title" /></div>
<component :is="display" style="white-space: pre-line;" />
<branch-node :branches="gridable.branches" :id="id" featureType="gridable" />
<branch-node :branches="gridCell.branches" :id="id" featureType="gridCell" />
</button>
</template>

24
src/components/features/Milestones.vue
View file

@ -1,31 +1,17 @@
<template>
<div v-if="filteredMilestones" class="table">
<milestone v-for="(milestone, id) in filteredMilestones" :key="id" :id="id" />
<div v-if="filtered" class="table">
<milestone v-for="(milestone, id) in filtered" :key="id" :id="id" />
</div>
</template>
<script lang="ts">
import { layers } from "@/game/layers";
import { Milestone } from "@/typings/features/milestone";
import { getFiltered, InjectLayerMixin } from "@/util/vue";
import { defineComponent, PropType } from "vue";
import { FilteredFeaturesMixin, InjectLayerMixin } from "@/util/vue";
import { defineComponent } from "vue";
export default defineComponent({
name: "milestones",
mixins: [InjectLayerMixin],
props: {
milestones: {
type: Object as PropType<Array<string>>
}
},
computed: {
filteredMilestones(): Record<string, Milestone> {
if (layers[this.layer].milestones) {
return getFiltered<Milestone>(layers[this.layer].milestones!.data, this.milestones);
}
return {};
}
}
mixins: [InjectLayerMixin, FilteredFeaturesMixin<Milestone>("milestones")]
});
</script>

32
src/components/features/Upgrades.vue
View file

@ -1,10 +1,10 @@
<template>
<div v-if="filteredUpgrades" class="table">
<template v-if="filteredUpgrades.rows && filteredUpgrades.cols">
<div v-for="row in filteredUpgrades.rows" class="row" :key="row">
<div v-for="col in filteredUpgrades.cols" :key="col">
<div v-if="filtered" class="table">
<template v-if="rows && cols">
<div v-for="row in rows" class="row" :key="row">
<div v-for="col in cols" :key="col">
<upgrade
v-if="filteredUpgrades[row * 10 + col] !== undefined"
v-if="filtered[row * 10 + col] !== undefined"
class="align"
:id="row * 10 + col"
/>
@ -12,33 +12,19 @@
</div>
</template>
<row v-else>
<upgrade v-for="(upgrade, id) in filteredUpgrades" :key="id" class="align" :id="id" />
<upgrade v-for="(upgrade, id) in filtered" :key="id" class="align" :id="id" />
</row>
</div>
</template>
<script lang="ts">
import { layers } from "@/game/layers";
import { Upgrade } from "@/typings/features/upgrade";
import { getFiltered, InjectLayerMixin } from "@/util/vue";
import { defineComponent, PropType } from "vue";
import { FilteredFeaturesMixin, InjectLayerMixin } from "@/util/vue";
import { defineComponent } from "vue";
export default defineComponent({
name: "upgrades",
mixins: [InjectLayerMixin],
props: {
upgrades: {
type: Object as PropType<Array<string>>
}
},
computed: {
filteredUpgrades(): Record<string, Upgrade> {
if (layers[this.layer].upgrades) {
return getFiltered<Upgrade>(layers[this.layer].upgrades!.data, this.upgrades);
}
return {};
}
}
mixins: [InjectLayerMixin, FilteredFeaturesMixin<Upgrade>("upgrades")]
});
</script>

3
src/components/fields/Toggle.vue
View file

@ -36,6 +36,7 @@ input {
span {
width: 100%;
position: relative;
}
/* track */
@ -55,7 +56,7 @@ span::before {
span::after {
content: "";
position: absolute;
top: 6px;
top: 2px;
right: 16px;
border-radius: 50%;
width: 20px;

14
src/components/system/LayerProvider.vue
View file

@ -3,21 +3,29 @@
</template>
<script lang="ts">
import { defineComponent } from "vue";
import { defineComponent, reactive } from "vue";
export default defineComponent({
name: "LayerProvider",
provide() {
return {
tab: {
tab: reactive({
layer: this.layer,
index: this.index
}
})
};
},
props: {
layer: String,
index: Number
},
watch: {
layer(layer) {
this.$.provides.tab.layer = layer;
},
index(index) {
this.$.provides.tab.index = index;
}
}
});
</script>

2
src/components/system/VerticalRule.vue
View file

@ -18,6 +18,6 @@ export default defineComponent({
width: 4px;
background: var(--separator);
height: 100%;
margin: 0 7px;
margin: auto 7px;
}
</style>

9
src/data/mod.ts
View file

@ -84,6 +84,15 @@ const main = {
({{ player.oompsMag != 0 ? format(player.oomps) + " OOM" + (player.oompsMag < 0 ? "^OOM" : player.oompsMag > 1 ? "^" + player.oompsMag : "") + "s" : formatSmall(pointGain) }}/sec)
</div>
<spacer />
<modal :show="false">
<svg style="height: 80vmin; width: 80vmin;">
<path d="M 32 222 Q 128 222, 128 0 Q 128 222, 224 222 L 224 224 L 32 224"/>
<circle cx="64" cy="128" r="64" fill="#8da8b0"/>
<circle cx="128" cy="64" r="64" fill="#71368a"/>
<circle cx="192" cy="128" r="64" fill="#fa8508"/>
</svg>
</modal>
<tree :append="true" />`,
name: "Tree"
} as RawLayer;

6
src/typings/player.d.ts vendored
View file

@ -54,9 +54,9 @@ export interface LayerSaveData {
unlockOrder?: number;
forceTooltip?: boolean;
resetTime: Decimal;
upgrades: Array<string>;
achievements: Array<string>;
milestones: Array<string>;
upgrades: Array<string | number>;
achievements: Array<string | number>;
milestones: Array<string | number>;
infoboxes: Record<string, boolean>;
buyables: Record<string, Decimal>;
clickables: Record<string, State>;

49
src/util/vue.ts
View file

@ -1,7 +1,9 @@
import { hasWon, pointGain } from "@/data/mod";
import { layers } from "@/game/layers";
import player from "@/game/player";
import { App, Component, ComponentOptions, defineComponent, inject } from "vue";
import { Feature, Features, GridFeatures } from "@/typings/features/feature";
import { Layer } from "@/typings/layer";
import { App, Component, ComponentOptions, defineComponent, inject, PropType } from "vue";
import Decimal, * as numberUtils from "./bignum";
import {
achievementEffect,
@ -112,3 +114,48 @@ export const InjectLayerMixin = {
}
}
};
export function FilteredFeaturesMixin<T extends Feature>(
feature: keyof Layer
): {
mixins: [typeof InjectLayerMixin];
props: {
[feature]: {
type: PropType<Array<string>>;
};
};
computed: {
filtered: () => Record<string, T> | undefined;
rows: () => number | undefined;
cols: () => number | undefined;
};
} {
return {
mixins: [InjectLayerMixin],
props: {
[feature]: {
type: Object as PropType<Array<string>>
}
},
computed: {
filtered(this: { layer: string; [feature]: string[] }) {
return (
(layers[this.layer][feature] as Features<T> | undefined) &&
getFiltered((layers[this.layer][feature] as Features<T>).data, this[feature])
);
},
rows(this: { layer: string }) {
return (
(layers[this.layer][feature] as Features<T> | undefined) &&
(layers[this.layer][feature] as Features<T> | GridFeatures<T>).rows
);
},
cols(this: { layer: string }) {
return (
(layers[this.layer][feature] as Features<T> | undefined) &&
(layers[this.layer][feature] as Features<T> | GridFeatures<T>).cols
);
}
}
};
}