extern/kalker
1
0
Fork 0
mirror of https://github.com/PaddiM8/kalker.git synced 2025-01-19 03:38:13 +01:00
Code Issues Packages Projects Releases Wiki Activity

kalk_web: Avoid automatic scrolling during input on phones

Browse Source
This commit is contained in:
bakk 2021-05-28 19:08:15 +02:00
parent 8015993907
commit 910b5a425f
2 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
kalk_web/public/index.html
View File

@ -38,6 +38,8 @@
height: 100%; height: 100%;
margin: 0; margin: 0;
padding: 0; padding: 0;
padding-top: 300px;
padding-bottom: 300px;
} }
#wrapper { #wrapper {

12
kalk_web/src/KalkCalculator.svelte
View File

@ -164,7 +164,7 @@
} }
function insertText(input: string) { function insertText(input: string) {
inputElement.focus(); inputElement.focus({ preventScroll: true });
let cursorPos = getCursorPos(inputElement); let cursorPos = getCursorPos(inputElement);
const textContent = inputElement.textContent; const textContent = inputElement.textContent;
let movementOffset = input.length; let movementOffset = input.length;
@ -196,8 +196,16 @@
const [highlighted, offset] = highlight(newString); const [highlighted, offset] = highlight(newString);
inputElement.innerHTML = highlighted; inputElement.innerHTML = highlighted;
inputElement.focus(); inputElement.focus({ preventScroll: true });
setCursorPos(inputElement, cursorPos - offset + movementOffset); setCursorPos(inputElement, cursorPos - offset + movementOffset);
// I know this sucks, but it keeps scrolling away on some browsers >:(
let i = 0;
setInterval(() => {
if (i == 60) return;
calculatorElement.scrollIntoView();
i++;
}, 20);
} }
function focus(element: HTMLInputElement) { function focus(element: HTMLInputElement) {