From 60d881be72255e359eeba06f6f8661b1a51de3bd Mon Sep 17 00:00:00 2001
From: Katie Sexton <ksexton@adobe.com>
Date: Mon, 12 Sep 2022 13:55:37 -0600
Subject: [PATCH] test: delay prebid

---
 head.html          | 28 ----------------------------
 scripts/delayed.js | 33 +++++++++++++++++++++++----------
 scripts/scripts.js |  1 +
 styles/styles.css  | 26 ++++++++++++++++++++++++++
 4 files changed, 50 insertions(+), 38 deletions(-)

diff --git a/head.html b/head.html
index fd6c01ca..80afcaab 100644
--- a/head.html
+++ b/head.html
@@ -2,31 +2,3 @@
 <script src="/scripts/scripts.js" type="module" crossorigin="use-credentials"></script>
 <link rel="stylesheet" href="/styles/styles.css" />
 <link rel="icon" href="data:,">
-
-<link rel="preload" as="script" href='https://www.googletagservices.com/tag/js/gpt.js' />
-<link rel="preload" as="script" href='https://web.prebidwrapper.com/et-DAz5JreYZr/default/prebid-load.js' />
-<link rel="preload" as="script" href='https://web.prebidwrapper.com/et-DAz5JreYZr/default/prebid-library.js' />
-<link rel="preload" as="script" href='https://web.prebidwrapper.com/et-DAz5JreYZr/default/prebid-wrapper.js' />
-
-<script>
-  var tude = window.tude || { cmd: [] };
-  tude.cmd.push(function() {
-    // tude.setDeviceType('mobile'); // optional: mobile, tablet, desktop
-    tude.setPageTargeting({ // optional
-      et_uid: '/dpworld-tour/schedule/',
-      et_platform: 'web',
-      et_environment: 'stg',
-      et_slug: '',
-      et_player: 'bob-barker',
-      et_language: 'en-gb',
-      et_main_tour: 'dpworldtour',
-      et_L2: 'schedule',
-      et_L3: 'index',
-      et_event: 'british-masters-2022',
-      et_edt_content_type: 'Callaway',
-      et_appsection: '',
-    });
-    tude.setAdUnitPath('/9517547/ET/web'); // or whatever you want to set the ad unit of all ads on the page to be
-  });
-</script>
-<script async src="https://web.prebidwrapper.com/et-DAz5JreYZr/default/prebid-load.js"></script>
diff --git a/scripts/delayed.js b/scripts/delayed.js
index 7b3951a3..5f99a2ff 100644
--- a/scripts/delayed.js
+++ b/scripts/delayed.js
@@ -518,16 +518,29 @@ const cookieScript = loadScript('https://cdn.cookielaw.org/scripttemplates/otSDK
 cookieScript.setAttribute('data-domain-script', '262c6c79-a114-41f0-9c07-52cb1fb7390c');
 
 function loadAds() {
-  // eslint-disable-next-line no-var
-  var tude = window.tude || { cmd: [] };
-  // eslint-disable-next-line prefer-arrow-callback
-  tude.cmd.push(function () {
-    tude.refreshAdsViaDivMappings([
-      {
-        divId: 'pb-slot-content-1',
-        baseDivId: 'pb-slot-content-1',
-      },
-    ]);
+  window.tude = window.tude || { cmd: [] };
+  loadScript('https://www.googletagservices.com/tag/js/gpt.js', () => {
+    loadScript('https://web.prebidwrapper.com/et-DAz5JreYZr/default/prebid-load.js', () => {
+      loadScript('https://web.prebidwrapper.com/et-DAz5JreYZr/default/prebid-library.js', () => {
+        loadScript('https://web.prebidwrapper.com/et-DAz5JreYZr/default/prebid-wrapper.js', () => {
+          window.tude.cmd.push(() => {
+            window.tude.setPageTargeting({ // optional
+              et_platform: 'web',
+            });
+            window.tude.setAdUnitPath('/9517547/ET/web'); // or whatever you want to set the ad unit of all ads on the page to be
+          });
+          window.tude.cmd.push(() => {
+            [...document.querySelectorAll('.ad')].forEach((ad) => {
+              const slot = ad.getAttribute('data-slot');
+              window.tude.refreshAdsViaDivMappings([{
+                divId: slot,
+                baseDivId: slot,
+              }]);
+            });
+          });
+        });
+      });
+    });
   });
 }
 
diff --git a/scripts/scripts.js b/scripts/scripts.js
index a7759b8b..595830e4 100644
--- a/scripts/scripts.js
+++ b/scripts/scripts.js
@@ -865,6 +865,7 @@ async function preloadAdPlaceholders(doc) {
       if (placements[position]) {
         const pos = placements[position];
         const placeholder = document.createElement('aside');
+        placeholder.setAttribute('data-slot', pos.slot);
         placeholder.className = `ad ad-${toClassName(position)}`;
         placeholder.innerHTML = `<div id="${pos.slot}"></div>`;
         if (pos.insertAfter) {
diff --git a/styles/styles.css b/styles/styles.css
index fb2dc506..7a6a9096 100644
--- a/styles/styles.css
+++ b/styles/styles.css
@@ -493,6 +493,32 @@ main .section.teaser picture.section-background img {
   }
 }
 
+/* ads */
+.ad {
+  box-sizing: border-box;
+  align-items: center;
+  justify-content: center;
+}
+
+.ad.ad-top {
+  display: none;
+  visibility: hidden;
+  min-height: 90px;
+  margin: 32px 0;
+}
+
+@media (min-width: 980px) {
+  .ad.ad-top {
+    display: flex;
+    visibility: visible;
+  }
+}
+
+.ad > div {
+  max-width: 100%;
+  overflow-x: hidden;
+}
+
 /* icons */
 .icon[class*=icon-flag-] svg {
   fill: #000;