diff --git a/extensions/amp-apester-media/0.1/amp-apester-media.css b/extensions/amp-apester-media/0.1/amp-apester-media.css index b9a52ac6b3d71..77f8dd2830c7c 100644 --- 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 index b12849382623a..bb6a5e1f00c12 100644 --- a/extensions/amp-apester-media/0.1/monetization/companion/bottomAd.js +++ b/extensions/amp-apester-media/0.1/monetization/companion/bottomAd.js @@ -38,6 +38,7 @@ 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', @@ -45,14 +46,13 @@ function constructCompanionBottomAd(slot, bannerSizes, apesterElement) { '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 index 44cf3b8daabf3..578ced9da0111 100644 --- a/extensions/amp-apester-media/0.1/monetization/companion/display.js +++ b/extensions/amp-apester-media/0.1/monetization/companion/display.js @@ -30,9 +30,16 @@ 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 + ); } } @@ -40,9 +47,15 @@ export function handleCompanionDisplay(media, apesterElement) { * @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 index ae62247be93f7..c708b042a2218 100644 --- 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}`, }) );