added refresh interval for amp-ad blocks in the apester-media (#35961)

🐛 Bug fix. 1) Added refresh interval for amp-ad blocks in the amp-apester-media 2) Moved inline styles into class for amp-apester-media bottom ad block with the fix of centering this block.
ampproject · Sep 8, 2021 · 4b0e6be · 4b0e6be
1 parent 7780672
commit 4b0e6be
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 5 deletions.
diff --git a/extensions/amp-apester-media/0.1/amp-apester-media.css b/extensions/amp-apester-media/0.1/amp-apester-media.css
@@ -56,7 +56,17 @@
   zoom: 1;
   -webkit-overflow-scrolling: touch !important;
 }
+
 .i-amphtml-amp-apester-companion {
   display: block;
   margin: 10px auto;
 }
+
+.i-amphtml-amp-apester-bottom-ad {
+  display: block !important;
+  position: absolute !important;
+  bottom: 0 !important;
+  left: 50% !important;
+  transform: translateX(-50%) !important;
+  margin: 0 !important;
+}
diff --git a/extensions/amp-apester-media/0.1/monetization/companion/bottomAd.js b/extensions/amp-apester-media/0.1/monetization/companion/bottomAd.js
@@ -38,21 +38,21 @@ export function handleCompanionBottomAd(media, apesterElement) {
 function constructCompanionBottomAd(slot, bannerSizes, apesterElement) {
   const width = bannerSizes[0][0];
   const height = bannerSizes[0][1];
+  const refreshInterval = 30;
   const ampAd = createElementWithAttributes(
     /** @type {!Document} */ (apesterElement.ownerDocument),
     'amp-ad',
     dict({
       'width': `${width}`,
       'height': `${height}`,
       'type': 'doubleclick',
-      'style':
-        'position: absolute !important; bottom: 0;left: 50%;margin-left: -150px;margin-bottom: 0;',
       'layout': 'fixed',
       'data-slot': `${slot}`,
       'data-multi-size-validation': 'false',
+      'data-enable-refresh': `${refreshInterval}`,
     })
   );
-  ampAd.classList.add('i-amphtml-amp-apester-companion');
+  ampAd.classList.add('i-amphtml-amp-apester-bottom-ad');
   apesterElement.appendChild(ampAd);
   Services.mutatorForDoc(apesterElement).requestChangeSize(ampAd, height);
   return ampAd;

diff --git a/extensions/amp-apester-media/0.1/monetization/companion/display.js b/extensions/amp-apester-media/0.1/monetization/companion/display.js
@@ -30,19 +30,32 @@ export function handleCompanionDisplay(media, apesterElement) {
     settings['bannerAdProvider'] === ALLOWED_AD_PROVIDER
   ) {
     const slot = settings['slot'];
+    const refreshInterval =
+      settings['options']['autoRefreshTime'] === 60000 ? 60 : 30;
     const defaultBannerSizes = [[300, 250]];
     const bannerSizes = settings['bannerSizes'] || defaultBannerSizes;
-    constructCompanionDisplayAd(slot, bannerSizes, apesterElement);
+    constructCompanionDisplayAd(
+      slot,
+      bannerSizes,
+      apesterElement,
+      refreshInterval
+    );
   }
 }
 
 /**
  * @param {string} slot
  * @param {Array} bannerSizes
  * @param {!AmpElement} apesterElement
+ * @param {number} refreshInterval
  * @return {!Element}
  */
-function constructCompanionDisplayAd(slot, bannerSizes, apesterElement) {
+function constructCompanionDisplayAd(
+  slot,
+  bannerSizes,
+  apesterElement,
+  refreshInterval
+) {
   const maxWidth = Math.max.apply(
     null,
     bannerSizes.map((s) => s[0])
@@ -64,6 +77,7 @@ function constructCompanionDisplayAd(slot, bannerSizes, apesterElement) {
       'data-slot': `${slot}`,
       'data-multi-size-validation': 'false',
       'data-multi-size': multiSizeData,
+      'data-enable-refresh': `${refreshInterval}`,
     })
   );
   ampAd.classList.add('i-amphtml-amp-apester-companion');

diff --git a/extensions/amp-apester-media/0.1/monetization/companion/video.js b/extensions/amp-apester-media/0.1/monetization/companion/video.js
@@ -74,6 +74,7 @@ function getCompanionPosition(video) {
  */
 function addCompanionSrElement(videoTag, position, macros, apesterElement) {
   const size = getCompanionVideoAdSize(apesterElement);
+  const refreshInterval = 30;
   const ampBladeAd = createElementWithAttributes(
     /** @type {!Document} */ (apesterElement.ownerDocument),
     'amp-ad',
@@ -87,6 +88,7 @@ function addCompanionSrElement(videoTag, position, macros, apesterElement) {
       'data-blade_macros': JSON.stringify(macros),
       'data-blade_player_id': videoTag,
       'data-blade_api_key': '5857d2ee263dc90002000001',
+      'data-enable-refresh': `${refreshInterval}`,
     })
   );