From 2e31c3ed601f84b86fd8e4fb4ab130a848d43ca5 Mon Sep 17 00:00:00 2001 From: Quoc Huy Nguyen Dinh Date: Fri, 10 May 2019 20:16:08 +1000 Subject: [PATCH 01/11] Fixes #2758 - set theme-dark / light to the body tag --- src/app/components/App.jsx | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/app/components/App.jsx b/src/app/components/App.jsx index db96b9b78b..569de70ec8 100644 --- a/src/app/components/App.jsx +++ b/src/app/components/App.jsx @@ -163,7 +163,15 @@ class App extends React.Component { ); } - const themeClass = nightmodeEnabled ? ' theme-dark' : ' theme-light'; + let themeClass = 'theme-light'; + if (nightmodeEnabled) { + themeClass = 'theme-dark'; + document.body.classList.remove('theme-light'); + document.body.classList.add('theme-dark'); + } else { + document.body.classList.remove('theme-dark'); + document.body.classList.add('theme-light'); + } return (
Date: Fri, 10 May 2019 21:28:54 +1000 Subject: [PATCH 02/11] Fixes #2418 - Add ellipsis overflow for author description --- src/app/components/elements/AuthorDropdown.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/app/components/elements/AuthorDropdown.scss b/src/app/components/elements/AuthorDropdown.scss index 4ab2b094bc..e89e46639b 100644 --- a/src/app/components/elements/AuthorDropdown.scss +++ b/src/app/components/elements/AuthorDropdown.scss @@ -50,6 +50,8 @@ clear: both; font-size: 90%; padding-top: 15px; + overflow: hidden; + text-overflow: ellipsis; } } } From 1754a269da285dcdc9f80ba1f9673e7de15e1cd3 Mon Sep 17 00:00:00 2001 From: roadscape Date: Fri, 17 May 2019 13:16:19 -0500 Subject: [PATCH 03/11] themeClass as const --- src/app/components/App.jsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/app/components/App.jsx b/src/app/components/App.jsx index 2adaba8bb7..dd0d47e059 100644 --- a/src/app/components/App.jsx +++ b/src/app/components/App.jsx @@ -161,9 +161,8 @@ class App extends React.Component { ); } - let themeClass = 'theme-light'; - if (nightmodeEnabled) { - themeClass = 'theme-dark'; + const themeClass = nightmodeEnabled ? ' theme-dark' : ' theme-light'; + if (themeClass == 'theme-dark') { document.body.classList.remove('theme-light'); document.body.classList.add('theme-dark'); } else { From 8f2068f9f4738ebad8abeede58c4ae6bd91a2754 Mon Sep 17 00:00:00 2001 From: Seungwon Eugene Jeong Date: Fri, 17 May 2019 23:17:16 +0100 Subject: [PATCH 04/11] Fix #3340 non-existing post 404 Fix #3340 non-existing post 404 --- src/app/components/pages/Post.jsx | 82 ++++++++++++++++--------------- 1 file changed, 43 insertions(+), 39 deletions(-) diff --git a/src/app/components/pages/Post.jsx b/src/app/components/pages/Post.jsx index 4a22fdda82..382575cfdd 100644 --- a/src/app/components/pages/Post.jsx +++ b/src/app/components/pages/Post.jsx @@ -19,6 +19,8 @@ import { SIGNUP_URL } from 'shared/constants'; import { isLoggedIn } from 'app/utils/UserUtil'; +import Icon from 'app/components/elements/Icon'; + class Post extends React.Component { static propTypes = { content: PropTypes.object.isRequired, @@ -63,7 +65,47 @@ class Post extends React.Component { } const dis = content.get(post); - if (!dis) return null; + // check if the post doesn't exist + // !dis may be enough but keep 'created' & 'body' test for potential compatibility + const emptyPost = + !dis || + (dis.get('created') === '1970-01-01T00:00:00' && + dis.get('body') === ''); + + if (emptyPost) + return ( +
+
+ +

+ Sorry! This page doesnt exist. +

+

+ Not to worry. You can head back to{' '} + + our homepage + , or check out some great posts. +

+ +
+
+ ); // A post should be hidden if it is not pinned, is not told to "show // anyway", and is designated "gray". @@ -157,44 +199,6 @@ class Post extends React.Component { link: selflink + '?sort=' + sort_orders[o] + '#comments', }); } - const emptyPost = - dis.get('created') === '1970-01-01T00:00:00' && - dis.get('body') === ''; - if (emptyPost) - return ( -
-
-
-

- Sorry! This page doesnt exist. -

-

- Not to worry. You can head back to{' '} - - our homepage - , or check out some great posts. -

- -
-
-
- ); return (
From 35c3a9ea8c433c62270b088e93ef62f53e90f831 Mon Sep 17 00:00:00 2001 From: Quoc Huy Nguyen Dinh Date: Sat, 18 May 2019 17:41:57 +1000 Subject: [PATCH 05/11] Revert "Fixes #2758 - set theme-dark / light to the body tag" This reverts commit 2e31c3ed601f84b86fd8e4fb4ab130a848d43ca5. --- src/app/components/App.jsx | 10 +--------- 1 file changed, 1 insertion(+), 9 deletions(-) diff --git a/src/app/components/App.jsx b/src/app/components/App.jsx index 569de70ec8..db96b9b78b 100644 --- a/src/app/components/App.jsx +++ b/src/app/components/App.jsx @@ -163,15 +163,7 @@ class App extends React.Component { ); } - let themeClass = 'theme-light'; - if (nightmodeEnabled) { - themeClass = 'theme-dark'; - document.body.classList.remove('theme-light'); - document.body.classList.add('theme-dark'); - } else { - document.body.classList.remove('theme-dark'); - document.body.classList.add('theme-light'); - } + const themeClass = nightmodeEnabled ? ' theme-dark' : ' theme-light'; return (
Date: Sat, 18 May 2019 18:14:59 +1000 Subject: [PATCH 06/11] Fixes #2758 - accessing document.body from componentWillReceiveProps() and componentDidMount() --- src/app/components/App.jsx | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/src/app/components/App.jsx b/src/app/components/App.jsx index db96b9b78b..810de4c3a4 100644 --- a/src/app/components/App.jsx +++ b/src/app/components/App.jsx @@ -36,12 +36,30 @@ class App extends React.Component { this.setState({ gptBannerHeight: height }); } + toggleBodyNightmode(nightmodeEnabled) { + if (nightmodeEnabled) { + document.body.classList.remove('theme-light'); + document.body.classList.add('theme-dark'); + } else { + document.body.classList.remove('theme-dark'); + document.body.classList.add('theme-light'); + } + } + + componentWillReceiveProps(nextProps) { + const {nightmodeEnabled} = nextProps; + this.toggleBodyNightmode(nightmodeEnabled); + } + componentWillMount() { if (process.env.BROWSER) localStorage.removeItem('autopost'); // July 14 '16 compromise, renamed to autopost2 this.props.loginUser(); } componentDidMount() { + const {nightmodeEnabled} = this.props; + this.toggleBodyNightmode(nightmodeEnabled); + window.addEventListener('gptadshown', this.gptadshownListener); } From fd253a03804e05b7f76d172241d69a01ad7d3123 Mon Sep 17 00:00:00 2001 From: Jonathan Porta Date: Fri, 17 May 2019 13:45:10 -0600 Subject: [PATCH 07/11] Update GPT Slots and Cleanup --- config/default.json | 188 ++++++++++++++------ src/app/components/elements/GptAd.jsx | 57 ++---- src/app/components/modules/Header/index.jsx | 23 ++- src/app/components/pages/Post.jsx | 37 ++-- src/app/components/pages/PostsIndex.jsx | 36 +++- src/app/utils/DomUtils.js | 23 +++ src/app/utils/GptUtils.js | 26 +++ 7 files changed, 277 insertions(+), 113 deletions(-) create mode 100644 src/app/utils/GptUtils.js diff --git a/config/default.json b/config/default.json index 2b281dca2d..76de2fb9d0 100644 --- a/config/default.json +++ b/config/default.json @@ -73,78 +73,158 @@ }, "gpt_enabled": null, "gpt_basic_slots": { - "top_nav_premium": { - "slot_id": "div-gpt-ad-1548778664403-0", - "args": ["/21784675435/steemit_top-navi", [[220, 90], [728, 90], [970, 90]], "div-gpt-ad-1548778664403-0"], + "bottom-of-post": { + "path": "/21784675435/steemit_bottom-of-post", + "dimensions": [[728, 90], [970, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_bottom-of-post", [[728, 90], [970, 90]], ""], "kind": "basic" }, - "top_nav": { - "slot_id": "div-gpt-ad-1548778612404-0", - "args": ["/21784675435/steemit_premium_top-navi", [[970, 90], [728, 90], [220, 90]], "div-gpt-ad-1548778612404-0"], + "bottom-of-post-mobile": { + "path": "/21784675435/steemit_bottom-of-post/steemit_bottom-of-post_mobile", + "dimensions": [[220, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_bottom-of-post/steemit_bottom-of-post_mobile", [[220, 90]], ""], "kind": "basic" }, - "left_nav_premium": { - "slot_id": "div-gpt-ad-1548778771262-0", - "args": ["/21784675435/steemit_premium_left-navigation", [[125, 125], [120, 90], [120, 600], [120, 60], [160, 600], [120, 240]], "div-gpt-ad-1548778771262-0"], + + + + "left-navigation": { + "path": "/21784675435/steemit_left-navigation", + "dimensions": [[120, 600], [160, 600]], + "slot_id": "", + "args": ["/21784675435/steemit_left-navigation", [[120, 600], [160, 600]], ""], "kind": "basic" }, - "left_nav": { - "slot_id": "div-gpt-ad-1548778799404-0", - "args": ["/21784675435/steemit_left-navigation", [[160, 600], [120, 240], [120, 600], [120, 60], [125, 125], [120, 90]], "div-gpt-ad-1548778799404-0"], + "left-navigation-loggedin-mobile": { + "path": "/21784675435/steemit_left-navigation/steemit_left-navigation_loggedin_mobile", + "dimensions": [[120, 240]], + "slot_id": "", + "args": ["/21784675435/steemit_left-navigation/steemit_left-navigation_loggedin_mobile", [[120, 240]], ""], "kind": "basic" }, - "right_nav": { - "slot_id": "div-gpt-ad-1548778861089-0", - "args": ["/21784675435/steemit_right-navigation", [[120, 600], [120, 60], [125, 125], [120, 240], [160, 600], [120, 90]], "div-gpt-ad-1548778861089-0"], + "left-navigation-loggedin": { + "path": "", + "dimensions": [[120, 600], [160, 600]], + "slot_id": "/21784675435/steemit_left-navigation/steemit_left-navigation_loggedin", + "args": ["/21784675435/steemit_left-navigation/steemit_left-navigation_loggedin", [[120, 600], [160, 600]], ""], "kind": "basic" }, - "bottom_post": { - "slot_id": "div-gpt-ad-1553686705417-0", - "args": ["/21784675435/steemit_bottom-of-post", [[300, 100], [234, 60], [728, 90], [220, 90], [970, 90], [336, 280], [890, 222], [320, 50], [468, 60]], "div-gpt-ad-1553686705417-0"] + "left-navigation-mobile": { + "path": "/21784675435/steemit_left-navigation/steemit_left-navigation_mobile", + "dimensions": [[120, 240]], + "slot_id": "", + "args": ["/21784675435/steemit_left-navigation/steemit_left-navigation_mobile", [[120, 240]], ""], + "kind": "basic" }, - "basic_bottom_post": { - "slot_id": "div-gpt-ad-1553686705417-0", - "args": ["/21784675435/steemit_bottom-of-post", [[300, 100], [234, 60], [728, 90], [220, 90], [970, 90], [336, 280], [890, 222], [320, 50], [468, 60]], "div-gpt-ad-1553686705417-0"] + + + "post-page-above-comments": { + "path": "/21784675435/steemit_post-page-above-comments", + "dimensions": [[728, 90], [970, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_post-page-above-comments", [[728, 90], [970, 90]], ""], + "kind": "basic" }, - "in_feed": { - "slot_id": "div-gpt-ad-1548778917304-0", - "args": ["/21784675435/steemit_in-feed", [[728, 90], [300, 100], [890, 222], [468, 60], [970, 90], [336, 280], [234, 60]], "div-gpt-ad-1548778917304-0"], + "post-page-above-comments-loggedin-mobile": { + "path": "/21784675435/steemit_post-page-above-comments/steemit_post-page-above-comments_loggedin_mobile", + "dimensions": [[220, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_post-page-above-comments/steemit_post-page-above-comments_loggedin_mobile", [[220, 90]], ""], + "kind": "basic" + }, + "post-page-above-comments-loggedin": { + "path": "/21784675435/steemit_post-page-above-comments/steemit_post-page-above-comments_loggedin", + "dimensions": [[728, 90], [970, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_post-page-above-comments/steemit_post-page-above-comments_loggedin", [[728, 90], [970, 90]], ""], + "kind": "basic" + }, + "post-page-above-comments-mobile": { + "path": "/21784675435/steemit_post-page-above-comments/steemit_post-page-above-comments_mobile", + "dimensions": [[220, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_post-page-above-comments/steemit_post-page-above-comments_mobile", [[220, 90]], ""], + "kind": "basic" + }, + + + + "right-navigation": { + "path": "/21784675435/steemit_right-navigation", + "dimensions": [[120, 600], [160, 600]], + "slot_id": "", + "args": ["/21784675435/steemit_right-navigation", [[120, 600], [160, 600]], ""], + "kind": "basic" + }, + "right-navigation-loggedin-mobile": { + "path": "/21784675435/steemit_right-navigation/steemit_right-navigation_loggedin_mobile", + "dimensions": [[120, 240]], + "slot_id": "", + "args": ["/21784675435/steemit_right-navigation/steemit_right-navigation_loggedin_mobile", [[120, 240]], ""], + "kind": "basic" + }, + "right-navigation-loggedin": { + "path": "/21784675435/steemit_right-navigation/steemit_right-navigation_loggedin", + "dimensions": [[120, 600], [160, 600]], + "slot_id": "", + "args": ["/21784675435/steemit_right-navigation/steemit_right-navigation_loggedin", [[120, 600], [160, 600]], ""], + "kind": "basic" + }, + "right-navigation-mobile": { + "path": "/21784675435/steemit_right-navigation/steemit_right-navigation_mobile", + "dimensions": [[120, 240]], + "slot_id": "", + "args": ["/21784675435/steemit_right-navigation/steemit_right-navigation_mobile", [[120, 240]], ""], + "kind": "basic" + }, + + + + "top-navigation": { + "path": "/21784675435/steemit_top-navi", + "dimensions": [[728, 90], [970, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_top-navi", [[728, 90], [970, 90]], ""], + "kind": "basic" + }, + "top-navigation-loggedin-mobile": { + "path": "/21784675435/steemit_top-navi/steemit_top-navi_loggedin_mobile", + "dimensions": [[220, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_top-navi/steemit_top-navi_loggedin_mobile", [[220, 90]], ""], + "kind": "basic" + }, + "top-navigation-loggedin": { + "path": "/21784675435/steemit_top-navi/steemit_top-navi_loggedin", + "dimensions": [[728, 90], [970, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_top-navi/steemit_top-navi_loggedin", [[728, 90], [970, 90]], ""], + "kind": "basic" + }, + "top-navigation-mobile": { + "path": "/21784675435/steemit_top-navi/steemit_top-navi_mobile", + "dimensions": [[220, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_top-navi/steemit_top-navi_mobile", [[220, 90]], ""], "kind": "basic" } }, - "gpt_category_slots": { - "cryptocurrency": { - "top_nav": { - "slot_id": "div-gpt-ad-1550891917103-0", - "args": ["/21784675435/steemit_top-navi/steemit_top-navi_cryptocurrency", [[728, 90], [220, 90], [970, 90]], "div-gpt-ad-1550891917103-0"], - "kind": "category" - }, - "right_nav": { - "slot_id": "div-gpt-ad-1550892019550-0", - "args": ["/21784675435/steemit_right-navigation/steemit_right-navigation_cryptocurrency", [[120, 90], [120, 240], [120, 60], [160, 600], [120, 600], [125, 125]], "div-gpt-ad-1550892019550-0"], - "kind": "category" - }, - "left_nav": { - "slot_id": "div-gpt-ad-1550892097245-0", - "args": ["/21784675435/steemit_left-navigation/steemit_left-navigation_cryptocurrency", [[120, 240], [120, 600], [125, 125], [120, 90], [160, 600], [120, 60]], "div-gpt-ad-1550892097245-0"], - "kind": "category" - }, - "bottom_post": { - "slot_id": "div-gpt-ad-1550892163180-0", - "args": ["/21784675435/steemit_bottom-of-post/steemit_bottom-of-post_cryptocurrency", [[336, 280], [320, 50], [468, 60], [970, 90], [890, 222], [300, 100], [728, 90], [234, 60]], "div-gpt-ad-1550892163180-0"], - "kind": "category" - } - } - }, + "gpt_category_slots": {}, "gpt_bidding_slots":{ - "left_nav_2": { - "slot_id": "div-gpt-ad-1554687231046-0", - "args": ["/21784675435/steemit_left-navigation/steemit_left-navigation_prebid", [[120, 600],[160,600]], "div-gpt-ad-1554687231046-0"], + "left-navigation": { + "path": "/21784675435/steemit_bottom-of-post/steemit_bottom-of-post_prebid", + "dimensions": [[728, 90]], + "slot_id": "", + "args": ["/21784675435/steemit_bottom-of-post/steemit_bottom-of-post_prebid", [[728, 90]], ""], "kind": "bidding" }, - "bottom_post": { - "slot_id": "div-gpt-ad-1551233873698-0", - "args": ["/21784675435/steemit_bottom-of-post/steemit_bottom-of-post_prebid", [[728, 90], [320, 50], [234, 60], [336, 280], [970, 90], [468, 60], [300, 100], [890, 222]], "div-gpt-ad-1551233873698-0"], + "bottom-of-post": { + "path": "/21784675435/steemit_left-navigation/steemit_left-navigation_prebid", + "dimensions": [[120, 600], [160, 600]], + "slot_id": "", + "args": ["/21784675435/steemit_left-navigation/steemit_left-navigation_prebid", [[120, 600], [160, 600]], ""], "kind": "bidding" } }, diff --git a/src/app/components/elements/GptAd.jsx b/src/app/components/elements/GptAd.jsx index 1a14dfd9b9..e734781aba 100644 --- a/src/app/components/elements/GptAd.jsx +++ b/src/app/components/elements/GptAd.jsx @@ -3,18 +3,22 @@ import { connect } from 'react-redux'; class GptAd extends Component { componentDidMount() { - if (!this.ad.slot_id || !this.enabled) { + if (!this.ad.path || !this.enabled) { return; } googletag.cmd.push(() => { - const slot = googletag.defineSlot(...this.ad.args); + const slot = googletag.defineSlot( + this.ad.path, + this.ad.dimensions, + this.ad.path + ); if (slot) { slot.addService(googletag.pubads()); googletag.cmd.push(() => { - googletag.display(this.ad.slot_id); + googletag.display(this.ad.path); googletag.pubads().refresh([slot]); googletag .pubads() @@ -68,14 +72,17 @@ class GptAd extends Component {
); } } GptAd.propTypes = { - ad: PropTypes.object.isRequired, //TODO: Define this shape + ad: PropTypes.shape({ + path: PropTypes.string, + dimensions: PropTypes.array, + }).isRequired, enabled: PropTypes.bool.isRequired, type: PropTypes.oneOf(['Bidding', 'Category', 'Basic']), }; @@ -94,48 +101,10 @@ export default connect( `gptCategorySlots`, ]); - // Determine which type of ad to show - // - // * Show a bidding ad if it's a bidding ad (e.g. Coinzilla) - // * Show a category ad (an ad on just #cryptocurrency, for example) - // * Fall back to a regular GPT ad - // const slotName = props.slotName; - let type = props.type; - - // let slot = basicSlots.getIn([slotName]); let slot = state.app.getIn(['googleAds', `gpt${type}Slots`, slotName]); - //console.log('GOT TYPE OF', type, slot); - // if (categorySlots.getIn([postCategory, slotName])) { - // console.info( - // `GPT-[${slotName}]::Overriding type of '${ - // type - // }' to be 'category' due to category being set to '${ - // postCategory - // }' and the existence of a category named '${ - // postCategory - // }' which has a slot named '${slotName}'` - // ); - // type = 'category'; - // slot = categorySlots.getIn([postCategory, slotName]); - // } else if (biddingSlots.getIn([slotName])) { - // console.info( - // `GPT-[${slotName}]::Overriding type of '${ - // type - // }' to be 'bidding' because we have a bidding slot defined for slotName '${ - // slotName - // }'` - // ); - // type = 'bidding'; - // slot = biddingSlots.getIn([slotName]); - // } else { - // console.info( - // `GPT-[${slotName}]::No override for type. Sticking with '${ - // type - // }'` - // ); - // } + console.log('GOT TYPE OF', type, slot); return { enabled, diff --git a/src/app/components/modules/Header/index.jsx b/src/app/components/modules/Header/index.jsx index db684d94fa..5bb988fdb8 100644 --- a/src/app/components/modules/Header/index.jsx +++ b/src/app/components/modules/Header/index.jsx @@ -18,6 +18,7 @@ import { SIGNUP_URL } from 'shared/constants'; import SteemLogo from 'app/components/elements/SteemLogo'; import normalizeProfile from 'app/utils/NormalizeProfile'; import Announcement from 'app/components/elements/Announcement'; +import { GptUtils } from 'app/utils/GptUtils'; import GptAd from 'app/components/elements/GptAd'; class Header extends React.Component { @@ -31,6 +32,10 @@ class Header extends React.Component { constructor() { super(); + console.log( + 'askdfjbasdfasbdfhajbsdf', + GptUtils.MobilizeSlotName('asndkjasjdakjdnjksjdnkjasn') + ); this.gptadshown = event => { // This makes sure that the sticky header doesn't overlap the welcome splash. this.forceUpdate(); @@ -88,6 +93,7 @@ class Header extends React.Component { } render() { + console.log('GptUtils', GptUtils); const { category, order, @@ -283,7 +289,22 @@ class Header extends React.Component { )} {/* If announcement is shown, ad will not render unless it's in a parent div! */}
- + {/* TODO: Switch to Mobile Ad when, well, mobile! */} + {loggedIn ? ( + + ) : ( + + )}