From ac15dc8d28a0879024d2640ba1706be6b9446a52 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tom=C3=A1=C5=A1=20Glawaty?= Date: Tue, 1 Oct 2024 06:09:26 +0200 Subject: [PATCH] Reflected AMP v2.16.0 API changes --- CHANGELOG.md | 1 + src/banner/managed/banner-data.mjs | 4 ++++ src/banner/managed/managed-banner.mjs | 1 - src/banner/position-data.mjs | 12 +----------- src/template/multiple.mjs | 4 ++-- src/template/random.mjs | 4 ++-- src/template/single.mjs | 4 ++-- 7 files changed, 12 insertions(+), 18 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e4c6e88..6ca463f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed - Changed arguments that are passed to the listeners `amp:banner:attached`, `amp:banner:state-changed`, `amp:fetch:error` and `amp:fetch:success`. Arguments are now passed as an object, so instead of `(banner) => {}` it is necessary to write `({ banner }) => {}`, respectively `({ response }) => {}` in case of events `amp:fetch:error` and `amp:fetch:success`. +- Moved `dimensions` field from the `positionData` to the content object of type `img` according to changes in AMP v2.16.0 API changes. - Updated docs. ### Removed diff --git a/src/banner/managed/banner-data.mjs b/src/banner/managed/banner-data.mjs index f634872..720190e 100644 --- a/src/banner/managed/banner-data.mjs +++ b/src/banner/managed/banner-data.mjs @@ -11,6 +11,10 @@ export class BannerData { this.#contents = new Contents(dimensionsProvider, breakpointType); for (let content of this.#data.contents) { + if ('img' === content.type && !('dimensions' in content)) { // BC compatibility + content.dimensions = { width: null, height: null }; + } + this.#contents.addContent(content['breakpoint'], content); } } diff --git a/src/banner/managed/managed-banner.mjs b/src/banner/managed/managed-banner.mjs index 1de524c..17862e4 100644 --- a/src/banner/managed/managed-banner.mjs +++ b/src/banner/managed/managed-banner.mjs @@ -197,7 +197,6 @@ export class ManagedBanner extends Banner { rotationSeconds: responseData['rotation_seconds'], displayType: responseData['display_type'], breakpointType: responseData['breakpoint_type'], - dimensions: responseData['dimensions'] || { width: null, height: null }, }); if ('options' in responseData) { diff --git a/src/banner/position-data.mjs b/src/banner/position-data.mjs index add0a8d..d94df00 100644 --- a/src/banner/position-data.mjs +++ b/src/banner/position-data.mjs @@ -6,19 +6,14 @@ export class PositionData { * @param {int} rotationSeconds * @param {string|null} displayType * @param {string|null} breakpointType - * @param {{width: int|null, height: int|null}} dimensions */ - constructor({ id, code, name, rotationSeconds, displayType, breakpointType, dimensions }) { + constructor({ id, code, name, rotationSeconds, displayType, breakpointType }) { this.id = id; this.code = code; this.name = name; this.rotationSeconds = rotationSeconds; this.displayType = displayType; this.breakpointType = breakpointType; - this.dimensions = { - width: dimensions.width || null, - height: dimensions.height || null, - } } static createInitial(code) { @@ -29,10 +24,6 @@ export class PositionData { rotationSeconds: 0, displayType: null, breakpointType: null, - dimensions: { - width: null, - height: null, - }, }); } @@ -56,7 +47,6 @@ export class PositionData { rotationSeconds: this.rotationSeconds, displayType: this.displayType, breakpointType: this.breakpointType, - dimensions: this.dimensions, } } } diff --git a/src/template/multiple.mjs b/src/template/multiple.mjs index 708c1ae..6bb6cda 100644 --- a/src/template/multiple.mjs +++ b/src/template/multiple.mjs @@ -23,8 +23,8 @@ export default ` src="<%= b.content.src %>" sizes="<%- b.content.sizes %>" alt="<%- b.content.alt %>" - <% if(null !== banner.positionData.dimensions.width) { %>width="<%- banner.positionData.dimensions.width %>"<% } %> - <% if(null !== banner.positionData.dimensions.height) { %>height="<%- banner.positionData.dimensions.height %>"<% } %> + <% if(null !== b.content.dimensions.width) { %>width="<%- b.content.dimensions.width %>"<% } %> + <% if(null !== b.content.dimensions.height) { %>height="<%- b.content.dimensions.height %>"<% } %> <% if('' !== b.content.title) { %>title="<%- b.content.title %>"<% } %> <% var loading; if(loading = banner.options.evaluate('loading', index)) { %>loading="<%- loading %>"<% } %> <% var fetchPriority; if(fetchPriority = banner.options.evaluate('fetchpriority', index)) { %>fetchpriority="<%- fetchPriority %>"<% } %>> diff --git a/src/template/random.mjs b/src/template/random.mjs index 8936cc5..ea55c39 100644 --- a/src/template/random.mjs +++ b/src/template/random.mjs @@ -20,8 +20,8 @@ export default ` src="<%= data.content.src %>" sizes="<%- data.content.sizes %>" alt="<%- data.content.alt %>" - <% if(null !== banner.positionData.dimensions.width) { %>width="<%- banner.positionData.dimensions.width %>"<% } %> - <% if(null !== banner.positionData.dimensions.height) { %>height="<%- banner.positionData.dimensions.height %>"<% } %> + <% if(null !== data.content.dimensions.width) { %>width="<%- data.content.dimensions.width %>"<% } %> + <% if(null !== data.content.dimensions.height) { %>height="<%- data.content.dimensions.height %>"<% } %> <% if('' !== data.content.title) { %>title="<%- data.content.title %>"<% } %> <% var loading; if(loading = banner.options.evaluate('loading', 0)) { %>loading="<%- loading %>"<% } %> <% var fetchPriority; if(fetchPriority = banner.options.evaluate('fetchpriority', 0)) { %>fetchpriority="<%- fetchPriority %>"<% } %>> diff --git a/src/template/single.mjs b/src/template/single.mjs index 4047d03..2d87192 100644 --- a/src/template/single.mjs +++ b/src/template/single.mjs @@ -20,8 +20,8 @@ export default ` src="<%= data.content.src %>" sizes="<%- data.content.sizes %>" alt="<%- data.content.alt %>" - <% if(null !== banner.positionData.dimensions.width) { %>width="<%- banner.positionData.dimensions.width %>"<% } %> - <% if(null !== banner.positionData.dimensions.height) { %>height="<%- banner.positionData.dimensions.height %>"<% } %> + <% if(null !== data.content.dimensions.width) { %>width="<%- data.content.dimensions.width %>"<% } %> + <% if(null !== data.content.dimensions.height) { %>height="<%- data.content.dimensions.height %>"<% } %> <% if('' !== data.content.title) { %>title="<%- data.content.title %>"<% } %> <% var loading; if(loading = banner.options.evaluate('loading', 0)) { %>loading="<%- loading %>"<% } %> <% var fetchPriority; if(fetchPriority = banner.options.evaluate('fetchpriority', 0)) { %>fetchpriority="<%- fetchPriority %>"<% } %>>