ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Middle Column: Fixing the keyboard hiding issue on iOs (#3488)

Browse Source
This commit is contained in:
Alexander Zinchuk 2023-07-05 13:16:28 +02:00
parent 9e5e3ab196
commit 332ae408a4
2 changed files with 17 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/middle/MiddleColumn.tsx
View File

@ -1,7 +1,7 @@
import React, { import React, {
useEffect, useState, memo, useMemo, useEffect, useState, memo, useMemo,
} from '../../lib/teact/teact'; } from '../../lib/teact/teact';
import { requestMutation } from '../../lib/fasterdom/fasterdom'; import { requestMeasure, requestMutation } from '../../lib/fasterdom/fasterdom';
import { getActions, withGlobal } from '../../global'; import { getActions, withGlobal } from '../../global';
import type { ApiChat, ApiChatBannedRights } from '../../api/types'; import type { ApiChat, ApiChatBannedRights } from '../../api/types';
@ -304,6 +304,14 @@ function MiddleColumn({
requestMutation(() => { requestMutation(() => {
document.body.classList.toggle('keyboard-visible', isFixNeeded); document.body.classList.toggle('keyboard-visible', isFixNeeded);
requestMeasure(() => {
if (!isFixNeeded && visualViewport.offsetTop) {
requestMutation(() => {
window.scrollTo({ top: 0 });
});
}
});
}); });
}; };

10
src/util/windowSize.ts
View File

@ -7,16 +7,22 @@ type IDimensions = {
height: number; height: number;
}; };
const WINDOW_ORIENTATION_CHANGE_THROTTLE_MS = 100;
const WINDOW_RESIZE_THROTTLE_MS = 250; const WINDOW_RESIZE_THROTTLE_MS = 250;
const initialHeight = window.innerHeight; let initialHeight = window.innerHeight;
let currentWindowSize = updateSizes(); let currentWindowSize = updateSizes();
const handleResize = throttle(() => { const handleResize = throttle(() => {
currentWindowSize = updateSizes(); currentWindowSize = updateSizes();
}, WINDOW_RESIZE_THROTTLE_MS, true); }, WINDOW_RESIZE_THROTTLE_MS, true);
window.addEventListener('orientationchange', handleResize); const handleOrientationChange = throttle(() => {
initialHeight = window.innerHeight;
handleResize();
}, WINDOW_ORIENTATION_CHANGE_THROTTLE_MS, false);
window.addEventListener('orientationchange', handleOrientationChange);
if (IS_IOS) { if (IS_IOS) {
window.visualViewport!.addEventListener('resize', handleResize); window.visualViewport!.addEventListener('resize', handleResize);
} else { } else {