danog/telegram-tt
1
0
Fork 0
mirror of https://github.com/danog/telegram-tt.git synced 2024-12-04 10:40:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

Another attempt to refresh only when orientation has changed (#1101)

Browse Source
This commit is contained in:
Alexander Zinchuk 2021-05-21 14:44:14 +03:00
parent c061bc312a
commit 3246ea95fc
1 changed files with 31 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/util/windowSize.ts
View File

@ -1,12 +1,31 @@
import { throttle } from './schedulers'; import { throttle } from './schedulers';
import {
MOBILE_SCREEN_LANDSCAPE_MAX_HEIGHT,
MOBILE_SCREEN_LANDSCAPE_MAX_WIDTH,
MOBILE_SCREEN_MAX_WIDTH,
} from '../config';
import { IS_MOBILE_SCREEN } from './environment';
type IDimensions = { type IDimensions = {
width: number; width: number;
height: number; height: number;
}; };
const IS_LANDSCAPE = IS_MOBILE_SCREEN && isLandscape();
let windowSize = updateSizes(); let windowSize = updateSizes();
const handleResize = throttle(() => {
windowSize = updateSizes();
if ((isMobileScreen() !== IS_MOBILE_SCREEN) || (IS_MOBILE_SCREEN && IS_LANDSCAPE !== isLandscape())) {
window.location.reload();
}
}, 250, true);
window.addEventListener('resize', handleResize);
window.addEventListener('orientationchange', handleResize);
export function updateSizes(): IDimensions { export function updateSizes(): IDimensions {
const vh = window.innerHeight * 0.01; const vh = window.innerHeight * 0.01;
@ -18,12 +37,19 @@ export function updateSizes(): IDimensions {
}; };
} }
const handleResize = throttle(() => { function isMobileScreen() {
windowSize = updateSizes(); return windowSize.width <= MOBILE_SCREEN_MAX_WIDTH || (
}, 250, true); windowSize.width <= MOBILE_SCREEN_LANDSCAPE_MAX_WIDTH && windowSize.height <= MOBILE_SCREEN_LANDSCAPE_MAX_HEIGHT
);
}
window.addEventListener('resize', handleResize); function isLandscape() {
window.addEventListener('orientationchange', handleResize); // eslint-disable-next-line max-len
// Source: https://web.archive.org/web/20160509220835/http://blog.abouthalf.com/development/orientation-media-query-challenges-in-android-browsers/
// Feature is marked as deprecated now, but it is still supported
// https://developer.mozilla.org/en-US/docs/Web/CSS/@media/device-aspect-ratio#browser_compatibility
return window.matchMedia('screen and (min-device-aspect-ratio: 1/1) and (orientation: landscape)').matches;
}
export default { export default {
get: () => windowSize, get: () => windowSize,