chromatic-lattice/src/components/NaNScreen.vue
thepaperpilot f5a25b2c2d Fix NaN detection
Also removes the proxy around player and cleaned up types
2023-02-15 20:21:26 -06:00

130 lines
3.8 KiB
Vue

<template>
<Modal v-model="hasNaN" v-bind="$attrs">
<template v-slot:header>
<div class="nan-modal-header">
<h2>NaN value detected!</h2>
</div>
</template>
<template v-slot:body>
<div>
Attempted to assign "{{ path }}" to NaN<span v-if="previous">
{{ " " }}(previously {{ format(previous) }})</span
>. Auto-saving has been {{ autosave ? "enabled" : "disabled" }}. Check the console
for more details, and consider sharing it with the developers on discord.
</div>
<br />
<div>
<a
:href="discordLink || 'https://discord.gg/WzejVAx'"
class="nan-modal-discord-link"
>
<span class="material-icons nan-modal-discord">discord</span>
{{ discordName || "The Paper Pilot Community" }}
</a>
</div>
<br />
<Toggle title="Autosave" v-model="autosave" />
<Toggle v-if="projInfo.enablePausing" title="Pause game" v-model="isPaused" />
</template>
<template v-slot:footer>
<div class="nan-footer">
<button @click="savesManager?.open()" class="button">Open Saves Manager</button>
<button @click="setZero" class="button">Set to 0</button>
<button @click="setOne" class="button">Set to 1</button>
<button
@click="hasNaN = false"
class="button"
v-if="previous && Decimal.neq(previous, 0) && Decimal.neq(previous, 1)"
>
Set to previous
</button>
<button @click="ignore" class="button danger">Ignore</button>
</div>
</template>
</Modal>
<SavesManager ref="savesManager" />
</template>
<script setup lang="ts">
import Modal from "components/Modal.vue";
import projInfo from "data/projInfo.json";
import player from "game/player";
import state from "game/state";
import type { DecimalSource } from "util/bignum";
import Decimal, { format } from "util/bignum";
import type { ComponentPublicInstance } from "vue";
import { computed, ref, toRef, watch } from "vue";
import Toggle from "./fields/Toggle.vue";
import SavesManager from "./SavesManager.vue";
const { discordName, discordLink } = projInfo;
const autosave = ref(true);
const isPaused = ref(true);
const hasNaN = toRef(state, "hasNaN");
const savesManager = ref<ComponentPublicInstance<typeof SavesManager> | null>(null);
watch(hasNaN, hasNaN => {
if (hasNaN) {
autosave.value = player.autosave;
isPaused.value = player.devSpeed === 0;
} else {
player.autosave = autosave.value;
player.devSpeed = isPaused.value ? 0 : null;
}
});
const path = computed(() => state.NaNPath?.join("."));
const previous = computed<DecimalSource | null>(() => {
if (state.NaNPersistent != null) {
return state.NaNPersistent.value;
}
return null;
});
function setZero() {
if (state.NaNPersistent != null) {
state.NaNPersistent.value = new Decimal(0);
state.hasNaN = false;
}
}
function setOne() {
if (state.NaNPersistent) {
state.NaNPersistent.value = new Decimal(1);
state.hasNaN = false;
}
}
function ignore() {
if (state.NaNPersistent) {
state.NaNPersistent.value = new Decimal(NaN);
state.hasNaN = false;
}
}
</script>
<style scoped>
.nan-modal-header {
padding: 10px 0;
margin-left: 10px;
}
.nan-footer {
display: flex;
justify-content: flex-end;
}
.nan-footer button {
margin: 0 10px;
}
.nan-modal-discord-link {
display: flex;
align-items: center;
}
.nan-modal-discord {
margin: 0;
margin-right: 4px;
}
</style>