forked from profectus/Profectus
thepaperpilot
0afcd1cd3d
Oh man did this end up requiring a *ton* of other work as well. There's still a few typing issues I still can't quite work out, and others I'd like to improve when I have time. In fact, this version doesn't even really work, it has a stack overflow error caused by a tooltip for some reason have a tree inside it, which in turn has another tooltip, etc. There's also 17 errors that I *really* feel like shouldn't be there, but they are, and 113 warnings - mostly using ! to assert that things are non-null. Lots of work left to do, to sum up. The reason I'm committing this now is because I really need to get to work on my game jam, and since it won't use a tree or really many of TMT-X's features, I can get away with using a broken engine :)
79 lines
2.5 KiB
Vue
79 lines
2.5 KiB
Vue
<template>
|
|
<div v-if="filteredClickables" 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">
|
|
<clickable
|
|
v-if="filteredClickables[row * 10 + col] !== undefined"
|
|
class="align clickable-container"
|
|
:style="{ height }"
|
|
:id="row * 10 + col"
|
|
:size="height === 'inherit' ? null : height"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<row v-else>
|
|
<clickable
|
|
v-for="(clickable, id) in filteredClickables"
|
|
:key="id"
|
|
class="align clickable-container"
|
|
:style="{ height }"
|
|
:id="id"
|
|
:size="height === 'inherit' ? null : height"
|
|
/>
|
|
</row>
|
|
</div>
|
|
</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";
|
|
|
|
export default defineComponent({
|
|
name: "clickables",
|
|
mixins: [InjectLayerMixin],
|
|
props: {
|
|
achievements: {
|
|
type: Object as PropType<Array<string>>
|
|
},
|
|
showMasterButton: {
|
|
type: Boolean,
|
|
default: null
|
|
},
|
|
height: {
|
|
type: [Number, String],
|
|
default: "inherit"
|
|
}
|
|
},
|
|
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;
|
|
}
|
|
if (this.showMasterButton != undefined) {
|
|
return this.showMasterButton;
|
|
}
|
|
return layers[this.layer].clickables?.showMasterButton;
|
|
}
|
|
},
|
|
methods: {
|
|
press() {
|
|
layers[this.layer].clickables?.masterButtonClick?.();
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style scoped>
|
|
.clickable-container {
|
|
margin-left: 7px;
|
|
margin-right: 7px;
|
|
}
|
|
</style>
|