completely prevent ads from rendering on mobile devices

This commit is contained in:
Sean Yesmunt 2020-02-05 00:13:29 -05:00
parent 574ac1f566
commit 3f3980d444
2 changed files with 18 additions and 22 deletions

View file

@ -6,6 +6,7 @@ import I18nMessage from 'component/i18nMessage';
import Button from 'component/button'; import Button from 'component/button';
const ADS_URL = '//assets.revcontent.com/master/delivery.js'; const ADS_URL = '//assets.revcontent.com/master/delivery.js';
const IS_MOBILE = typeof window.orientation !== 'undefined';
type Props = { type Props = {
location: { pathname: string }, location: { pathname: string },
@ -15,26 +16,27 @@ function Ads(props: Props) {
const { const {
location: { pathname }, location: { pathname },
} = props; } = props;
useEffect(() => { useEffect(() => {
const script = document.createElement('script'); if (!IS_MOBILE) {
const script = document.createElement('script');
script.src = ADS_URL; script.src = ADS_URL;
script.async = true; script.async = true;
// $FlowFixMe
document.body.appendChild(script);
return () => {
// $FlowFixMe // $FlowFixMe
document.body.removeChild(script); document.body.appendChild(script);
// if user navigates too rapidly, <style> tags can build up
// $FlowFixMe return () => {
if (document.body.getElementsByTagName('style').length) {
// $FlowFixMe // $FlowFixMe
document.body.getElementsByTagName('style')[0].remove(); document.body.removeChild(script);
} // if user navigates too rapidly, <style> tags can build up
}; // $FlowFixMe
if (document.body.getElementsByTagName('style').length) {
// $FlowFixMe
document.body.getElementsByTagName('style')[0].remove();
}
};
}
}, []); }, []);
return ( return (

View file

@ -8,7 +8,6 @@ import Tag from 'component/tag';
import StickyBox from 'react-sticky-box/dist/esnext'; import StickyBox from 'react-sticky-box/dist/esnext';
import Spinner from 'component/spinner'; import Spinner from 'component/spinner';
import usePersistedState from 'effects/use-persisted-state'; import usePersistedState from 'effects/use-persisted-state';
import useIsMobile from 'effects/use-is-mobile';
// @if TARGET='web' // @if TARGET='web'
import Ads from 'lbrytv/component/ads'; import Ads from 'lbrytv/component/ads';
// @endif // @endif
@ -42,7 +41,6 @@ function SideNavigation(props: Props) {
} = props; } = props;
const { pathname } = location; const { pathname } = location;
const isAuthenticated = Boolean(email); const isAuthenticated = Boolean(email);
const isMobile = useIsMobile();
const [sideInformation, setSideInformation] = usePersistedState( const [sideInformation, setSideInformation] = usePersistedState(
'side-navigation:information', 'side-navigation:information',
getSideInformation(pathname) getSideInformation(pathname)
@ -89,11 +87,7 @@ function SideNavigation(props: Props) {
// @if TARGET='web' // @if TARGET='web'
if (obscureSideNavigation) { if (obscureSideNavigation) {
return isMobile ? null : ( return <Ads />;
<Wrapper>
<Ads />
</Wrapper>
);
} }
// @endif // @endif