From c5f6b4617fa03699b5e4c2628bd1ce57456c2fec Mon Sep 17 00:00:00 2001
From: Nachtalb <info@nachtalb.io>
Date: Sat, 1 May 2021 00:51:55 +0200
Subject: [PATCH] Preserve location on first and last line when scrolling
 through inputs

---
 client/components/ChatInput.vue | 33 +++++++++++++++++++++++++++------
 1 file changed, 27 insertions(+), 6 deletions(-)

diff --git a/client/components/ChatInput.vue b/client/components/ChatInput.vue
index 35c68b7d..49f4d6fb 100644
--- a/client/components/ChatInput.vue
+++ b/client/components/ChatInput.vue
@@ -140,11 +140,10 @@ export default {
 				return;
 			}
 
-			const onRow = (
-				this.$refs.input.value.slice(null, this.$refs.input.selectionStart).match(/\n/g) ||
-				[]
-			).length;
-			const totalRows = (this.$refs.input.value.match(/\n/g) || []).length;
+			const oldValue = this.$refs.input.value;
+			const oldPosition = this.$refs.input.selectionStart;
+			const onRow = (oldValue.slice(null, oldPosition).match(/\n/g) || []).length;
+			const totalRows = (oldValue.match(/\n/g) || []).length;
 
 			const {channel} = this;
 
@@ -165,7 +164,29 @@ export default {
 			}
 
 			channel.pendingMessage = channel.inputHistory[channel.inputHistoryPosition];
-			this.$refs.input.value = channel.pendingMessage;
+			const newValue = channel.pendingMessage;
+			this.$refs.input.value = newValue;
+
+			let newPosition;
+
+			if (key === "up") {
+				const lastIndexOfNewLine = newValue.lastIndexOf("\n");
+				const lastLine = newValue.slice(null, lastIndexOfNewLine);
+				newPosition =
+					oldPosition > lastLine.length
+						? newValue.length
+						: lastIndexOfNewLine + oldPosition + 1;
+			} else {
+				const lastPositionOnFirstLine =
+					newValue.indexOf("\n") === -1 ? newValue.length + 1 : newValue.indexOf("\n");
+				const relativeRowPos = oldPosition - oldValue.lastIndexOf("\n") - 1;
+				newPosition =
+					relativeRowPos > lastPositionOnFirstLine
+						? lastPositionOnFirstLine
+						: relativeRowPos;
+			}
+
+			this.$refs.input.setSelectionRange(newPosition, newPosition);
 			this.setInputSize();
 
 			return false;