Fixed issues with input fields in Saves Manager
This commit is contained in:
parent
bb7db73eba
commit
4869f042a9
6 changed files with 31 additions and 8 deletions
|
@ -5,16 +5,18 @@
|
||||||
<textarea-autosize
|
<textarea-autosize
|
||||||
v-if="textarea"
|
v-if="textarea"
|
||||||
:placeholder="placeholder"
|
:placeholder="placeholder"
|
||||||
:value="value"
|
:value="val"
|
||||||
:maxHeight="maxHeight"
|
:maxHeight="maxHeight"
|
||||||
@input="value => $emit('change', value)"
|
@input="change"
|
||||||
|
@blur="() => $emit('blur')"
|
||||||
ref="field"
|
ref="field"
|
||||||
/>
|
/>
|
||||||
<input
|
<input
|
||||||
v-else
|
v-else
|
||||||
type="text"
|
type="text"
|
||||||
:value="value"
|
:value="val"
|
||||||
@input="e => $emit('change', e.target.value)"
|
@input="e => change(e.target.value)"
|
||||||
|
@blur="() => $emit('blur')"
|
||||||
:placeholder="placeholder"
|
:placeholder="placeholder"
|
||||||
ref="field"
|
ref="field"
|
||||||
:class="{ fullWidth: !title }"
|
:class="{ fullWidth: !title }"
|
||||||
|
@ -31,13 +33,25 @@ export default defineComponent({
|
||||||
props: {
|
props: {
|
||||||
title: String,
|
title: String,
|
||||||
value: String,
|
value: String,
|
||||||
|
modelValue: String,
|
||||||
textarea: Boolean,
|
textarea: Boolean,
|
||||||
placeholder: String,
|
placeholder: String,
|
||||||
maxHeight: Number
|
maxHeight: Number
|
||||||
},
|
},
|
||||||
emits: ["change", "submit"],
|
emits: ["change", "submit", "blur", "update:modelValue"],
|
||||||
mounted() {
|
mounted() {
|
||||||
(this.$refs.field as HTMLElement).focus();
|
(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>
|
</script>
|
||||||
|
|
|
@ -49,7 +49,7 @@
|
||||||
<div v-if="time">Last played {{ dateFormat.format(time) }}</div>
|
<div v-if="time">Last played {{ dateFormat.format(time) }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="details" v-else-if="save.error == undefined && editing">
|
<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>
|
||||||
<div v-else class="details error">Error: Failed to load save with id {{ save.id }}</div>
|
<div v-else class="details error">Error: Failed to load save with id {{ save.id }}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -20,7 +20,7 @@
|
||||||
<TextField
|
<TextField
|
||||||
:value="saveToImport"
|
:value="saveToImport"
|
||||||
@submit="importSave"
|
@submit="importSave"
|
||||||
@input="importSave"
|
@change="importSave"
|
||||||
title="Import Save"
|
title="Import Save"
|
||||||
placeholder="Paste your save here!"
|
placeholder="Paste your save here!"
|
||||||
:class="{ importingFailed }"
|
:class="{ importingFailed }"
|
||||||
|
@ -227,11 +227,16 @@ export default defineComponent({
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
importSave(text: string) {
|
importSave(text: string) {
|
||||||
|
console.log(text);
|
||||||
this.saveToImport = text;
|
this.saveToImport = text;
|
||||||
if (text) {
|
if (text) {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
try {
|
try {
|
||||||
const playerData = JSON.parse(decodeURIComponent(escape(atob(text))));
|
const playerData = JSON.parse(decodeURIComponent(escape(atob(text))));
|
||||||
|
if (typeof playerData !== "object") {
|
||||||
|
this.importingFailed = true;
|
||||||
|
return;
|
||||||
|
}
|
||||||
const id = getUniqueID();
|
const id = getUniqueID();
|
||||||
playerData.id = id;
|
playerData.id = id;
|
||||||
localStorage.setItem(
|
localStorage.setItem(
|
||||||
|
|
|
@ -468,7 +468,7 @@ export default {
|
||||||
<spacer height="5px" />
|
<spacer height="5px" />
|
||||||
<button onclick='console.log("yeet")'>'HI'</button>
|
<button onclick='console.log("yeet")'>'HI'</button>
|
||||||
<div>Name your points!</div>
|
<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>
|
<sticky style="color: red; font-size: 32px; font-family: Comic Sans MS;">I have {{ format(player.points) }} {{ player.layers.c.thingy }} points!</sticky>
|
||||||
<hr />
|
<hr />
|
||||||
<milestones />
|
<milestones />
|
||||||
|
|
|
@ -566,6 +566,7 @@ export function addLayer(layer: RawLayer, player?: Partial<PlayerData>): void {
|
||||||
}
|
}
|
||||||
if (layer.hotkeys) {
|
if (layer.hotkeys) {
|
||||||
for (const id in 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], "press", undefined, false);
|
||||||
setDefault(layer.hotkeys[id], "unlocked", function() {
|
setDefault(layer.hotkeys[id], "unlocked", function() {
|
||||||
return layers[this.layer].unlocked;
|
return layers[this.layer].unlocked;
|
||||||
|
|
|
@ -395,6 +395,9 @@ export const defaultLayerProperties = {
|
||||||
} as Omit<RawLayer, "id"> & Partial<Pick<RawLayer, "id">> & ThisType<Layer>;
|
} as Omit<RawLayer, "id"> & Partial<Pick<RawLayer, "id">> & ThisType<Layer>;
|
||||||
|
|
||||||
document.onkeydown = function(e) {
|
document.onkeydown = function(e) {
|
||||||
|
if ((e.target as HTMLElement | null)?.tagName === "INPUT") {
|
||||||
|
return;
|
||||||
|
}
|
||||||
if (player.hasWon && !player.keepGoing) {
|
if (player.hasWon && !player.keepGoing) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue