diff --git a/src/components/fields/Text.vue b/src/components/fields/Text.vue index 1e71298..f57b8c3 100644 --- a/src/components/fields/Text.vue +++ b/src/components/fields/Text.vue @@ -5,16 +5,18 @@ <textarea-autosize v-if="textarea" :placeholder="placeholder" - :value="value" + :value="val" :maxHeight="maxHeight" - @input="value => $emit('change', value)" + @input="change" + @blur="() => $emit('blur')" ref="field" /> <input v-else type="text" - :value="value" - @input="e => $emit('change', e.target.value)" + :value="val" + @input="e => change(e.target.value)" + @blur="() => $emit('blur')" :placeholder="placeholder" ref="field" :class="{ fullWidth: !title }" @@ -31,13 +33,25 @@ export default defineComponent({ props: { title: String, value: String, + modelValue: String, textarea: Boolean, placeholder: String, maxHeight: Number }, - emits: ["change", "submit"], + emits: ["change", "submit", "blur", "update:modelValue"], mounted() { (this.$refs.field as HTMLElement).focus(); + }, + computed: { + val() { + return this.modelValue || this.value || ""; + } + }, + methods: { + change(value: string) { + this.$emit("change", value); + this.$emit("update:modelValue", value); + } } }); </script> diff --git a/src/components/system/Save.vue b/src/components/system/Save.vue index 4ae1439..9b23384 100644 --- a/src/components/system/Save.vue +++ b/src/components/system/Save.vue @@ -49,7 +49,7 @@ <div v-if="time">Last played {{ dateFormat.format(time) }}</div> </div> <div class="details" v-else-if="save.error == undefined && editing"> - <TextField v-model="newName" class="editname" @submit="changeName" /> + <TextField v-model="newName" class="editname" @submit="changeName" @blur="changeName" /> </div> <div v-else class="details error">Error: Failed to load save with id {{ save.id }}</div> </div> diff --git a/src/components/system/SavesManager.vue b/src/components/system/SavesManager.vue index 93073e4..c811900 100644 --- a/src/components/system/SavesManager.vue +++ b/src/components/system/SavesManager.vue @@ -20,7 +20,7 @@ <TextField :value="saveToImport" @submit="importSave" - @input="importSave" + @change="importSave" title="Import Save" placeholder="Paste your save here!" :class="{ importingFailed }" @@ -227,11 +227,16 @@ export default defineComponent({ } }, importSave(text: string) { + console.log(text); this.saveToImport = text; if (text) { this.$nextTick(() => { try { const playerData = JSON.parse(decodeURIComponent(escape(atob(text)))); + if (typeof playerData !== "object") { + this.importingFailed = true; + return; + } const id = getUniqueID(); playerData.id = id; localStorage.setItem( diff --git a/src/data/layers/aca/c.ts b/src/data/layers/aca/c.ts index 1c2f6d2..e9142ea 100644 --- a/src/data/layers/aca/c.ts +++ b/src/data/layers/aca/c.ts @@ -468,7 +468,7 @@ export default { <spacer height="5px" /> <button onclick='console.log("yeet")'>'HI'</button> <div>Name your points!</div> - <TextField :value="player.layers.c.thingy" @input="value => player.layers.c.thingy = value" :field="false" /> + <TextField :value="player.layers.c.thingy" @change="value => player.layers.c.thingy = value" :field="false" /> <sticky style="color: red; font-size: 32px; font-family: Comic Sans MS;">I have {{ format(player.points) }} {{ player.layers.c.thingy }} points!</sticky> <hr /> <milestones /> diff --git a/src/game/layers.ts b/src/game/layers.ts index 495aa50..7a43e17 100644 --- a/src/game/layers.ts +++ b/src/game/layers.ts @@ -566,6 +566,7 @@ export function addLayer(layer: RawLayer, player?: Partial<PlayerData>): void { } if (layer.hotkeys) { for (const id in layer.hotkeys) { + layer.hotkeys[id].layer = layer.id; setDefault(layer.hotkeys[id], "press", undefined, false); setDefault(layer.hotkeys[id], "unlocked", function() { return layers[this.layer].unlocked; diff --git a/src/util/layers.ts b/src/util/layers.ts index e790ee5..cf7caec 100644 --- a/src/util/layers.ts +++ b/src/util/layers.ts @@ -395,6 +395,9 @@ export const defaultLayerProperties = { } as Omit<RawLayer, "id"> & Partial<Pick<RawLayer, "id">> & ThisType<Layer>; document.onkeydown = function(e) { + if ((e.target as HTMLElement | null)?.tagName === "INPUT") { + return; + } if (player.hasWon && !player.keepGoing) { return; }