Web: Common: Layout: refactoring

This commit is contained in:
Artem Tarasov 2020-12-03 11:02:19 +03:00
parent be710bf469
commit 96bfc3f8f9
2 changed files with 7 additions and 11 deletions

View File

@ -1,7 +1,7 @@
import React, { Component, createRef } from "react"; import React, { Component, createRef } from "react";
import { Scrollbar, utils } from "asc-web-components"; import { Scrollbar, utils } from "asc-web-components";
import { LayoutContextProvider } from "./context"; import { LayoutContextProvider } from "./context";
import { isMobile, isSafari, isIOS, isChrome } from "react-device-detect"; import { isMobile, isSafari, isIOS } from "react-device-detect";
const { isTouchDevice } = utils.device; const { isTouchDevice } = utils.device;
class MobileLayout extends Component { class MobileLayout extends Component {
@ -44,12 +44,10 @@ class MobileLayout extends Component {
? this.documentElement.scrollTop ? this.documentElement.scrollTop
: window.pageYOffset; : window.pageYOffset;
let isVisible;
if (visibleContent && isMobile && !isTouchDevice) { if (visibleContent && isMobile && !isTouchDevice) {
return; return;
} }
if (window.pageYOffset !== 0) { if (!isIOS && window.pageYOffset !== 0) {
window.scroll(0, 0); window.scroll(0, 0);
return; return;
} }
@ -65,7 +63,7 @@ class MobileLayout extends Component {
} }
} }
isVisible = prevScrollPosition >= currentScrollPosition; let isVisible = prevScrollPosition >= currentScrollPosition;
if ( if (
(isSafari || isIOS) && (isSafari || isIOS) &&

View File

@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
import styled from "styled-components"; import styled from "styled-components";
import MobileLayout from "./MobileLayout"; import MobileLayout from "./MobileLayout";
import { utils } from "asc-web-components"; import { utils } from "asc-web-components";
import { isIOS, isFirefox, isChrome, isMobile } from "react-device-detect"; import { isIOS, isFirefox } from "react-device-detect";
const { size } = utils.device; const { size } = utils.device;
@ -29,14 +29,13 @@ const Layout = (props) => {
}, []); }, []);
useEffect(() => { useEffect(() => {
if (isMobile) { if (isIOS && !isFirefox) {
window.addEventListener("resize", resizeHandler); window.addEventListener("resize", resizeHandler);
resizeHandler(); resizeHandler();
} }
return () => { return () => {
if (isMobile) { if (isIOS && !isFirefox) {
window.removeEventListener("resize", resizeHandler); window.removeEventListener("resize", resizeHandler);
} }
}; };
@ -44,7 +43,7 @@ const Layout = (props) => {
const resizeHandler = () => { const resizeHandler = () => {
const intervalTime = 100; const intervalTime = 100;
const endTimeout = 500; const endTimeout = 300;
let interval, timeout, lastInnerHeight, noChangeCount; let interval, timeout, lastInnerHeight, noChangeCount;
@ -56,7 +55,6 @@ const Layout = (props) => {
timeout = null; timeout = null;
const vh = (window.innerHeight - 57) * 0.01; const vh = (window.innerHeight - 57) * 0.01;
document.documentElement.style.setProperty("--vh", `${vh}px`); document.documentElement.style.setProperty("--vh", `${vh}px`);
}; };
interval = setInterval(() => { interval = setInterval(() => {