From 48f5f94833997e97897a34aa2beca1e73561cd3c Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 10:00:25 -0500 Subject: [PATCH 01/15] - Move Ad Logic Elsewhere --- scripts/delayed.js | 72 ---------------------------------------- scripts/dependencies.js | 73 +++++++++++++++++++++++++++++++++++++++++ scripts/scripts.js | 9 +++++ 3 files changed, 82 insertions(+), 72 deletions(-) create mode 100644 scripts/dependencies.js diff --git a/scripts/delayed.js b/scripts/delayed.js index 65ee7fa9..6c7d8024 100644 --- a/scripts/delayed.js +++ b/scripts/delayed.js @@ -3,12 +3,9 @@ import { decorateIcons, fetchPlaceholders, sampleRUM, - decorateBlock, - loadBlock, loadScript, getMetadata, fetchGraphQL, - sendAnalyticsPageEvent, } from './scripts.js'; const placeholders = await fetchPlaceholders(); @@ -646,75 +643,6 @@ async function populateStatusBar(statusBar) { populateStatusBar(document.querySelector('header > .status-bar')); -/* setup cookie preferences */ -function getCookie(cookieName) { - const name = `${cookieName}=`; - const decodedCookie = decodeURIComponent(document.cookie); - const split = decodedCookie.split(';'); - // eslint-disable-next-line no-plusplus - for (let i = 0; i < split.length; i++) { - let c = split[i]; - while (c.charAt(0) === ' ') c = c.substring(1); - if (c.indexOf(name) === 0) return c.substring(name.length, c.length); - } - return null; -} - -async function OptanonWrapper() { - const geoInfo = window.Optanon.getGeolocationData(); - Object.keys(geoInfo).forEach((key) => { - const cookieName = `PGAT_${key.charAt(0).toUpperCase() + key.slice(1)}`; - const cookie = getCookie(cookieName); - if (!cookie || cookie !== geoInfo[key]) document.cookie = `${cookieName}=${geoInfo[key]}`; - }); - - const prevOptIn = localStorage.getItem('OptIn_PreviousPermissions'); - if (prevOptIn) { - try { - const settings = JSON.parse(prevOptIn); - if (settings.tempImplied) { - localStorage.removeItem('OptIn_PreviousPermissions'); - } - } catch (e) { - // eslint-disable-next-line no-console - console.error('OptIn_PreviousPermissions parse failed'); - } - } - sendAnalyticsPageEvent(); -} - -const otId = placeholders.onetrustId; -if (otId) { - const cookieScript = loadScript('https://cdn.cookielaw.org/scripttemplates/otSDKStub.js'); - cookieScript.setAttribute('data-domain-script', `${otId}${isProd ? '' : '-test'}`); - cookieScript.setAttribute('data-dlayer-name', 'dataLayer'); - cookieScript.setAttribute('data-nscript', 'beforeInteractive'); - - const gtmId = placeholders.googletagmanagerId; - if (gtmId) { - const GTMScript = document.createElement('script'); - GTMScript.innerHTML = `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': - new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], - j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= - 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); - })(window,document,'script','dataLayer','${gtmId}');`; - document.head.append(GTMScript); - - const GTMFrame = document.createElement('no-script'); - GTMFrame.innerHTML = ``; - document.body.prepend(GTMFrame); - } - - window.OptanonWrapper = OptanonWrapper; - - if (document.querySelector('.marketing')) { - const marketingBlock = document.querySelector('.marketing'); - decorateBlock(marketingBlock); - loadBlock(marketingBlock); - } -} - async function loadLiveChat() { const liveChat = getMetadata('live-chat'); if (liveChat && ['yes', 'on', 'true'].includes(liveChat.toLowerCase())) { diff --git a/scripts/dependencies.js b/scripts/dependencies.js new file mode 100644 index 00000000..75b22126 --- /dev/null +++ b/scripts/dependencies.js @@ -0,0 +1,73 @@ +import { decorateBlock, fetchPlaceholders, loadBlock, loadScript, sendAnalyticsPageEvent } from './scripts.js'; + +const placeholders = await fetchPlaceholders(); +const isProd = window.location.hostname.endsWith(placeholders.hostname); + +/* setup cookie preferences */ +function getCookie(cookieName) { + const name = `${cookieName}=`; + const decodedCookie = decodeURIComponent(document.cookie); + const split = decodedCookie.split(';'); + // eslint-disable-next-line no-plusplus + for (let i = 0; i < split.length; i++) { + let c = split[i]; + while (c.charAt(0) === ' ') c = c.substring(1); + if (c.indexOf(name) === 0) return c.substring(name.length, c.length); + } + return null; +} + +async function OptanonWrapper() { + const geoInfo = window.Optanon.getGeolocationData(); + Object.keys(geoInfo).forEach((key) => { + const cookieName = `PGAT_${key.charAt(0).toUpperCase() + key.slice(1)}`; + const cookie = getCookie(cookieName); + if (!cookie || cookie !== geoInfo[key]) document.cookie = `${cookieName}=${geoInfo[key]}`; + }); + + const prevOptIn = localStorage.getItem('OptIn_PreviousPermissions'); + if (prevOptIn) { + try { + const settings = JSON.parse(prevOptIn); + if (settings.tempImplied) { + localStorage.removeItem('OptIn_PreviousPermissions'); + } + } catch (e) { + // eslint-disable-next-line no-console + console.error('OptIn_PreviousPermissions parse failed'); + } + } + sendAnalyticsPageEvent(); +} + +const otId = placeholders.onetrustId; +if (otId) { + const cookieScript = loadScript('https://cdn.cookielaw.org/scripttemplates/otSDKStub.js'); + cookieScript.setAttribute('data-domain-script', `${otId}${isProd ? '' : '-test'}`); + cookieScript.setAttribute('data-dlayer-name', 'dataLayer'); + cookieScript.setAttribute('data-nscript', 'beforeInteractive'); + + const gtmId = placeholders.googletagmanagerId; + if (gtmId) { + const GTMScript = document.createElement('script'); + GTMScript.innerHTML = `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': + new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], + j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= + 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); + })(window,document,'script','dataLayer','${gtmId}');`; + document.head.append(GTMScript); + + const GTMFrame = document.createElement('no-script'); + GTMFrame.innerHTML = ``; + document.body.prepend(GTMFrame); + } + + window.OptanonWrapper = OptanonWrapper; + + if (document.querySelector('.marketing')) { + const marketingBlock = document.querySelector('.marketing'); + decorateBlock(marketingBlock); + loadBlock(marketingBlock); + } +} \ No newline at end of file diff --git a/scripts/scripts.js b/scripts/scripts.js index 0d58e1de..ff7ce928 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -1052,11 +1052,20 @@ async function loadEager(doc) { } } +/** + * Loads everything that required HTML to be in place. + */ +function loadDependencies() { + // eslint-disable-next-line import/no-cycle + import('./dependencies.js'); +} + /** * loads everything that doesn't need to be delayed. */ async function loadLazy(doc) { const main = doc.querySelector('main'); + loadDependencies(); await loadBlocks(main); const { hash } = window.location; From c5994577d182ae031786bcbb6e3677056f0cefc4 Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 10:04:52 -0500 Subject: [PATCH 02/15] - Lint Fix --- scripts/dependencies.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/scripts/dependencies.js b/scripts/dependencies.js index 75b22126..b00c577f 100644 --- a/scripts/dependencies.js +++ b/scripts/dependencies.js @@ -1,4 +1,10 @@ -import { decorateBlock, fetchPlaceholders, loadBlock, loadScript, sendAnalyticsPageEvent } from './scripts.js'; +import { + decorateBlock, + fetchPlaceholders, + loadBlock, + loadScript, + sendAnalyticsPageEvent +} from './scripts.js'; const placeholders = await fetchPlaceholders(); const isProd = window.location.hostname.endsWith(placeholders.hostname); From c246412d7b115539ac0b300150c001f15ff36e60 Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 10:07:02 -0500 Subject: [PATCH 03/15] - Lint Fix --- scripts/dependencies.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/scripts/dependencies.js b/scripts/dependencies.js index b00c577f..e455a073 100644 --- a/scripts/dependencies.js +++ b/scripts/dependencies.js @@ -3,7 +3,7 @@ import { fetchPlaceholders, loadBlock, loadScript, - sendAnalyticsPageEvent + sendAnalyticsPageEvent, } from './scripts.js'; const placeholders = await fetchPlaceholders(); @@ -76,4 +76,4 @@ if (otId) { decorateBlock(marketingBlock); loadBlock(marketingBlock); } -} \ No newline at end of file +} From 6687474a9a1a1cb8de5c485ed86b3532d374167d Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 10:09:26 -0500 Subject: [PATCH 04/15] - Lint Fix --- scripts/dependencies.js | 1 + 1 file changed, 1 insertion(+) diff --git a/scripts/dependencies.js b/scripts/dependencies.js index e455a073..797ace3e 100644 --- a/scripts/dependencies.js +++ b/scripts/dependencies.js @@ -1,3 +1,4 @@ +// eslint-disable-next-line import/no-cycle import { decorateBlock, fetchPlaceholders, From 02f790b2785505686e4d68dcf5b108916d4016c6 Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 10:20:01 -0500 Subject: [PATCH 05/15] - Added Ad parameters - Updated styling to prevent overflow --- blocks/marketing/marketing.js | 9 +++++++-- styles/styles.css | 1 + 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/blocks/marketing/marketing.js b/blocks/marketing/marketing.js index d4687b16..f584cc6b 100644 --- a/blocks/marketing/marketing.js +++ b/blocks/marketing/marketing.js @@ -42,7 +42,10 @@ export default async function decorate(block) { window.tude = window.tude || { cmd: [] }; loadScript('https://www.googletagservices.com/tag/js/gpt.js', () => { loadScript(`https://dn0qt3r0xannq.cloudfront.net/${placeholders.adsPath}/prebid-load.js`, () => { - // loadScript(`https://web.prebidwrapper.com/${placeholders.adsPath}/prebid-load.js`, () => { + let pageName = window.location.pathname.slice(1); + if (!pageName) { + pageName = 'homepage'; + } window.tude.cmd.push(() => { window.tude.setDeviceType(getDevice()); // optional window.tude.setPageTargeting({ // optional @@ -50,6 +53,8 @@ export default async function decorate(block) { s1: placeholders.adsS1, s2: placeholders.adsS2, s3: placeholders.adsS3, + s4: pageName, + pos: 'midcontent', m_data: '0', m_safety: 'safe', m_catagories: 'moat_safe', @@ -59,7 +64,7 @@ export default async function decorate(block) { kuid: '', aid: '20767395437692810572475817725693908164', }); - window.tude.setAdUnitPath(`/${placeholders.adsNetwork}/pgat.${getDevice() === 'mobile' ? 'phone' : getDevice()}/pgatour`); + window.tude.setAdUnitPath(`/${placeholders.adsNetwork}/pgatour-web/pgatour`); }); window.tude.cmd.push(() => { document.querySelectorAll('.ad').forEach((ad) => { diff --git a/styles/styles.css b/styles/styles.css index 831ac6d8..d0361718 100644 --- a/styles/styles.css +++ b/styles/styles.css @@ -548,6 +548,7 @@ main .ad { align-items: center; justify-content: center; margin: 32px 0; + overflow: hidden; } main .ad .ad-top { From 4e9fe6655dab96e05da99b84470d37827551c63d Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 10:28:27 -0500 Subject: [PATCH 06/15] - Added Ad parameters - Updated styling to prevent overflow --- scripts/scripts.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/scripts/scripts.js b/scripts/scripts.js index ff7ce928..9577ceea 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -1064,8 +1064,9 @@ function loadDependencies() { * loads everything that doesn't need to be delayed. */ async function loadLazy(doc) { - const main = doc.querySelector('main'); loadDependencies(); + + const main = doc.querySelector('main'); await loadBlocks(main); const { hash } = window.location; From f0176875065006b8eb4be244acc2d65246b0d7cb Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 11:01:20 -0500 Subject: [PATCH 07/15] - Added Ad parameters - Updated styling to prevent overflow --- blocks/marketing/marketing.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/blocks/marketing/marketing.js b/blocks/marketing/marketing.js index f584cc6b..a1150554 100644 --- a/blocks/marketing/marketing.js +++ b/blocks/marketing/marketing.js @@ -45,6 +45,10 @@ export default async function decorate(block) { let pageName = window.location.pathname.slice(1); if (!pageName) { pageName = 'homepage'; + } else if (pageName.startsWith("news")) { + pageName = 'news'; + } else { + pageName = pageName.substring(pageName.lastIndexOf('/') + 1); } window.tude.cmd.push(() => { window.tude.setDeviceType(getDevice()); // optional From 6ac9fddd91f26e6be8dadeadfa8324d39c01debf Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 11:07:11 -0500 Subject: [PATCH 08/15] - Update pageName handling --- blocks/marketing/marketing.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/blocks/marketing/marketing.js b/blocks/marketing/marketing.js index a1150554..75173cbf 100644 --- a/blocks/marketing/marketing.js +++ b/blocks/marketing/marketing.js @@ -47,7 +47,7 @@ export default async function decorate(block) { pageName = 'homepage'; } else if (pageName.startsWith("news")) { pageName = 'news'; - } else { + } if (pageName.includes('/')) { pageName = pageName.substring(pageName.lastIndexOf('/') + 1); } window.tude.cmd.push(() => { From 3fcc7bab6e81e8f213758cf542e488bf9364708f Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 11:19:56 -0500 Subject: [PATCH 09/15] - Lint Fix --- blocks/marketing/marketing.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/blocks/marketing/marketing.js b/blocks/marketing/marketing.js index 75173cbf..1bb173e4 100644 --- a/blocks/marketing/marketing.js +++ b/blocks/marketing/marketing.js @@ -45,7 +45,7 @@ export default async function decorate(block) { let pageName = window.location.pathname.slice(1); if (!pageName) { pageName = 'homepage'; - } else if (pageName.startsWith("news")) { + } else if (pageName.startsWith('news')) { pageName = 'news'; } if (pageName.includes('/')) { pageName = pageName.substring(pageName.lastIndexOf('/') + 1); From 5d1af64baaf8bcb24d8ce3979d571820c3fb615a Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 15:17:28 -0500 Subject: [PATCH 10/15] - Removed unused function - Moved to end of LoadLazy --- scripts/dependencies.js | 2 -- scripts/scripts.js | 28 ++-------------------------- 2 files changed, 2 insertions(+), 28 deletions(-) diff --git a/scripts/dependencies.js b/scripts/dependencies.js index 797ace3e..e0b8a616 100644 --- a/scripts/dependencies.js +++ b/scripts/dependencies.js @@ -4,7 +4,6 @@ import { fetchPlaceholders, loadBlock, loadScript, - sendAnalyticsPageEvent, } from './scripts.js'; const placeholders = await fetchPlaceholders(); @@ -44,7 +43,6 @@ async function OptanonWrapper() { console.error('OptIn_PreviousPermissions parse failed'); } } - sendAnalyticsPageEvent(); } const otId = placeholders.onetrustId; diff --git a/scripts/scripts.js b/scripts/scripts.js index 9577ceea..c4df1bcd 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -1064,8 +1064,6 @@ function loadDependencies() { * loads everything that doesn't need to be delayed. */ async function loadLazy(doc) { - loadDependencies(); - const main = doc.querySelector('main'); await loadBlocks(main); @@ -1079,6 +1077,8 @@ async function loadLazy(doc) { addFavIcon(`${window.hlx.codeBasePath}/styles/favicon.ico`); doc.querySelectorAll('div:not([class]):not([id]):empty').forEach((empty) => empty.remove()); + + loadDependencies(); } /** @@ -1143,30 +1143,6 @@ function getPageNameAndSections() { }; } -export async function sendAnalyticsPageEvent() { - window.dataLayer = window.dataLayer || []; - const dl = window.dataLayer; - const placeholders = await fetchPlaceholders(); - const isUserLoggedIn = window.gigyaAccountInfo && window.gigyaAccountInfo != null - && window.gigyaAccountInfo.errorCode === 0; - - const { pageName, sections } = getPageNameAndSections(); - dl.push({ - event: 'pageload', - pageName, - pageUrl: window.location.href, - siteSection: sections[0] || '', - siteSubSection: sections[1] || '', - siteSubSection2: sections[2] || '', - gigyaID: isUserLoggedIn && window.gigyaAccountInfo.UID ? window.gigyaAccountInfo.UID : '', - userLoggedIn: isUserLoggedIn ? 'Logged In' : 'Logged Out', - tourName: placeholders.tourName.toLowerCase().replaceAll(' ', '_'), - tournamentID: `${placeholders.tourCode.toUpperCase()}${placeholders.currentYear}${placeholders.tournamentId}`, - ipAddress: '127.0.0.1', - deviceType: 'Web', - }); -} - try { const hidden = Symbol('hidden'); const proxy = Symbol('proxy'); From ad607c5bd366151fd0babbfc24eba76728318cfe Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 15:45:31 -0500 Subject: [PATCH 11/15] - Removed unused function --- scripts/scripts.js | 11 ----------- 1 file changed, 11 deletions(-) diff --git a/scripts/scripts.js b/scripts/scripts.js index c4df1bcd..25792fb7 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -1132,17 +1132,6 @@ export function addHeaderSizing(block, classPrefix = 'heading', selector = 'h1, }); } -function getPageNameAndSections() { - const pageSectionParts = window.location.pathname.split('/').filter((subPath) => subPath !== ''); - const pageName = pageSectionParts.join(':'); - const finalPageName = pageName === '' ? 'Home' : pageName; - - return { - pageName: finalPageName, - sections: pageSectionParts, - }; -} - try { const hidden = Symbol('hidden'); const proxy = Symbol('proxy'); From bd6b2e8289c000ccc9852f5c7c81babb4d567cc4 Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 17:26:10 -0500 Subject: [PATCH 12/15] - test push --- scripts/scripts.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/scripts/scripts.js b/scripts/scripts.js index 25792fb7..bf614f05 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -709,6 +709,8 @@ async function loadPage(doc) { await loadEager(doc); // eslint-disable-next-line no-use-before-define await loadLazy(doc); + + loadDependencies(); // eslint-disable-next-line no-use-before-define loadDelayed(doc); } @@ -1077,8 +1079,6 @@ async function loadLazy(doc) { addFavIcon(`${window.hlx.codeBasePath}/styles/favicon.ico`); doc.querySelectorAll('div:not([class]):not([id]):empty').forEach((empty) => empty.remove()); - - loadDependencies(); } /** From ee7bb8f675c09943e51c7746c9a1746bf42213aa Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 18:06:56 -0500 Subject: [PATCH 13/15] - test push --- scripts/scripts.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/scripts/scripts.js b/scripts/scripts.js index bf614f05..25792fb7 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -709,8 +709,6 @@ async function loadPage(doc) { await loadEager(doc); // eslint-disable-next-line no-use-before-define await loadLazy(doc); - - loadDependencies(); // eslint-disable-next-line no-use-before-define loadDelayed(doc); } @@ -1079,6 +1077,8 @@ async function loadLazy(doc) { addFavIcon(`${window.hlx.codeBasePath}/styles/favicon.ico`); doc.querySelectorAll('div:not([class]):not([id]):empty').forEach((empty) => empty.remove()); + + loadDependencies(); } /** From 6432809acdf653a1ed4abaaf88404ffd5a13233f Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 19:43:49 -0500 Subject: [PATCH 14/15] - test push --- scripts/scripts.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/scripts/scripts.js b/scripts/scripts.js index 25792fb7..397c3d59 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -705,6 +705,7 @@ async function waitForLCP() { * Decorates the page. */ async function loadPage(doc) { + loadDependencies(); // eslint-disable-next-line no-use-before-define await loadEager(doc); // eslint-disable-next-line no-use-before-define @@ -1077,8 +1078,6 @@ async function loadLazy(doc) { addFavIcon(`${window.hlx.codeBasePath}/styles/favicon.ico`); doc.querySelectorAll('div:not([class]):not([id]):empty').forEach((empty) => empty.remove()); - - loadDependencies(); } /** From 5e00d65e4ad54887162416d0fc9512d94e2c2e4c Mon Sep 17 00:00:00 2001 From: Mark McConnell Date: Mon, 4 Mar 2024 19:47:06 -0500 Subject: [PATCH 15/15] - test push --- scripts/scripts.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/scripts/scripts.js b/scripts/scripts.js index 397c3d59..25792fb7 100644 --- a/scripts/scripts.js +++ b/scripts/scripts.js @@ -705,7 +705,6 @@ async function waitForLCP() { * Decorates the page. */ async function loadPage(doc) { - loadDependencies(); // eslint-disable-next-line no-use-before-define await loadEager(doc); // eslint-disable-next-line no-use-before-define @@ -1078,6 +1077,8 @@ async function loadLazy(doc) { addFavIcon(`${window.hlx.codeBasePath}/styles/favicon.ico`); doc.querySelectorAll('div:not([class]):not([id]):empty').forEach((empty) => empty.remove()); + + loadDependencies(); } /**