use second card on small screens and dont load script if authenticated (#406)
This commit is contained in:
parent
935eaa6edb
commit
6d3ec149b3
3 changed files with 19 additions and 7 deletions
|
@ -149,10 +149,20 @@ function HomePage(props: Props) {
|
|||
} else {
|
||||
// find the last fully visible card
|
||||
let lastCard;
|
||||
for (const card of cards) {
|
||||
const isFullyVisible = isScrolledIntoView(card);
|
||||
if (!isFullyVisible) break;
|
||||
lastCard = card;
|
||||
|
||||
// width of browser window
|
||||
const windowWidth = window.innerWidth;
|
||||
|
||||
// on small screens, grab the second item
|
||||
if (windowWidth <= 900) {
|
||||
lastCard = cards[1];
|
||||
} else {
|
||||
// otherwise, get the last fully visible card
|
||||
for (const card of cards) {
|
||||
const isFullyVisible = isScrolledIntoView(card);
|
||||
if (!isFullyVisible) break;
|
||||
lastCard = card;
|
||||
}
|
||||
}
|
||||
|
||||
// clone the last card
|
||||
|
|
|
@ -1,12 +1,14 @@
|
|||
import { connect } from 'react-redux';
|
||||
import { selectTheme } from 'redux/selectors/settings';
|
||||
import { makeSelectClaimForUri, selectClaimIsNsfwForUri } from 'redux/selectors/claims';
|
||||
import { selectUserVerifiedEmail } from 'redux/selectors/user';
|
||||
import Ads from './view';
|
||||
|
||||
const select = (state, props) => ({
|
||||
theme: selectTheme(state),
|
||||
claim: makeSelectClaimForUri(props.uri)(state),
|
||||
isMature: selectClaimIsNsfwForUri(state, props.uri),
|
||||
authenticated: selectUserVerifiedEmail(state),
|
||||
});
|
||||
|
||||
export default connect(select)(Ads);
|
||||
|
|
|
@ -29,6 +29,7 @@ type Props = {
|
|||
small: boolean,
|
||||
claim: Claim,
|
||||
isMature: boolean,
|
||||
authenticated: boolean,
|
||||
};
|
||||
|
||||
function Ads(props: Props) {
|
||||
|
@ -36,6 +37,7 @@ function Ads(props: Props) {
|
|||
location: { pathname },
|
||||
type = 'video',
|
||||
small,
|
||||
authenticated,
|
||||
} = props;
|
||||
|
||||
// load ad and tags here
|
||||
|
@ -56,7 +58,7 @@ function Ads(props: Props) {
|
|||
|
||||
// add script to DOM
|
||||
useEffect(() => {
|
||||
if (SHOW_ADS) {
|
||||
if (SHOW_ADS && !authenticated) {
|
||||
let script;
|
||||
try {
|
||||
script = document.createElement('script');
|
||||
|
@ -70,8 +72,6 @@ function Ads(props: Props) {
|
|||
};
|
||||
} catch (e) {}
|
||||
}
|
||||
|
||||
// TODO: remove the script when it exists?
|
||||
}, []);
|
||||
|
||||
// display to say "sign up to not see these"
|
||||
|
|
Loading…
Reference in a new issue