Release 9

blocks/embed/embed.css

@@ -11,12 +11,43 @@
 .embed-video-element {
   aspect-ratio: 16/9;
   width: 100%;
+  display: block;
 }
 
 .embed .video-icon-wrapper {
   pointer-events: none;
 }
 
+.embed .cookie-message {
+  aspect-ratio: 16/9;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 16px;
+}
+
+.embed .cookie-message__title,
+.embed .cookie-message__text {
+  max-width: var(--text-block-max-width);
+  margin: 0 auto;
+  text-align: center;
+}
+
+.embed .cookie-message__title {
+  font: var(--f-heading-5-font-size)/var(--f-heading-5-line-height) var(--ff-volvo-novum-medium);
+  letter-spacing: var(--f-heading-5-letter-spacing);
+}
+
+.embed .cookie-message__text {
+  font: var(--f-body-font-size)/var(--f-body-line-height) var(--font-family-body);
+}
+
+.embed .cookie-message__text a {
+  color: inherit;
+  text-decoration: underline;
+}
+
 @media screen and (min-width: 768px) {
   .embed-video {
     width: 726px;
@@ -35,4 +66,4 @@
   .embed.embed-full-width .embed-video {
     width: 100%;
   }
-}
+}

blocks/embed/embed.js

@@ -1,5 +1,6 @@
 import {
-  selectVideoLink, addPlayIcon, showVideoModal, isLowResolutionVideoUrl,
+  selectVideoLink, addPlayIcon,
+  showVideoModal, isLowResolutionVideoUrl,
   createLowResolutionBanner, createIframe,
 } from '../../scripts/video-helper.js';
 
@@ -13,8 +14,13 @@ export default function decorate(block) {
   block.classList.remove('loop', 'autoplay', 'full-width');
   videoWrapper.classList.add('embed-video');
 
+  const preferredType = (() => {
+    if (isFullWidth) return 'local';
+    return 'auto';
+  })();
+
   const links = block.querySelectorAll('a');
-  const selectedLink = selectVideoLink(links, isFullWidth ? 'local' : 'auto');
+  const selectedLink = selectVideoLink(links, preferredType);
   const video = document.createElement('video');
   const source = document.createElement('source');
 

blocks/key-facts/key-facts.css

@@ -44,20 +44,34 @@
 }
 
 .key-facts .key-facts__main-text-wrapper--small {
+  flex-direction: column;
   font-size: var(--f-heading-5-font-size);
   letter-spacing: var(--f-heading-5-letter-spacing);
   line-height: var(--f-heading-5-line-height);
 }
 
+.key-facts .key-facts__main-text-wrapper--small br {
+  content: '';
+  display: none;
+}
+
 .key-facts__main-text-wrapper .key-facts__main-text {
   display: flex;
   font-family: var(--ff-volvo-novum);
 }
 
+.key-facts__main-text + .key-facts__main-text--small::before {
+  content: '\00a0';
+}
+
 .key-facts__main-text--small {
   font-size: 0.75em;
 }
 
+.key-facts__main-text-wrapper--small .key-facts__main-text--small {
+  width: 100%;
+}
+
 .key-facts__main-text--extra-small {
   font-size: 0.5em;
 }

blocks/v2-livestream-embed/v2-livestream-embed.css

@@ -0,0 +1,63 @@
+.v2-livestream-embed {
+  border-radius: var(--border-radius);
+  aspect-ratio: 16/9;
+  width: 100%;
+}
+
+.v2-livestream-embed iframe {
+  display: block;
+}
+
+.v2-livestream-embed .cookie-message {
+  aspect-ratio: 16/9;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 16px;
+}
+
+.v2-livestream-embed .cookie-message__title,
+.v2-livestream-embed .cookie-message__text {
+  max-width: var(--text-block-max-width);
+  margin: 0 auto;
+  text-align: center;
+}
+
+.v2-livestream-embed .cookie-message__title {
+  font: var(--f-heading-5-font-size)/var(--f-heading-5-line-height) var(--ff-volvo-novum-medium);
+  letter-spacing: var(--f-heading-5-letter-spacing);
+}
+
+.v2-livestream-embed .cookie-message__text {
+  font: var(--f-body-font-size)/var(--f-body-line-height) var(--font-family-body);
+}
+
+.v2-livestream-embed .cookie-message__text a {
+  color: inherit;
+  text-decoration: underline;
+}
+
+.v2-livestream-embed .cookie-message__text a:hover {
+  color: var(--c-grey-300);
+}
+
+.v2-livestream-embed .cookie-message__button-container {
+  margin-top: 16px;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  gap: 16px;
+}
+
+@media screen and (min-width: 1200px) {
+  .v2-livestream-embed .cookie-message__title {
+    font-size: var(--f-heading-4-font-size);
+    line-height: var(--f-heading-4-line-height);
+  }
+
+  .v2-livestream-embed .cookie-message__text {
+    font-size: var(--f-body-2-font-size);
+    line-height: var(--f-body-2-line-height);
+  }
+}

blocks/v2-livestream-embed/v2-livestream-embed.js

@@ -0,0 +1,111 @@
+/* eslint-disable no-unused-vars */
+import { loadScript } from '../../scripts/lib-franklin.js';
+import { createElement, getTextLabel, isExternalVideoAllowed } from '../../scripts/common.js';
+import { updateCookieValue } from '../../scripts/delayed.js';
+import { hideModal } from '../../common/modal/modal.js';
+
+let player;
+
+function onPlayerReady(event) {
+  event.target.playVideo();
+}
+
+function onPlayerError(event) {
+  /* eslint-disable-next-line no-console */
+  console.warn(event.data);
+}
+
+function onPlayerAutoplayBlocked(event) {
+  /* eslint-disable-next-line no-console */
+  console.warn(event.data);
+}
+
+export function playVideo() {
+  if (player && player.playVideo) {
+    player.playVideo();
+  }
+}
+
+function addVideo(block, videoLink) {
+  const iframeYT = document.createRange().createContextualFragment(`
+    <iframe class="v2-livestream-embed" id="livestream"
+      frameborder="0" allowfullscreen="" allow="autoplay"
+      src="https://www.youtube.com/embed/${videoLink}?color=white&amp;rel=0&amp;playsinline=1&amp;enablejsapi=1&amp;autoplay=1">
+    </iframe>
+  `);
+
+  block.innerHTML = '';
+
+  block.append(...iframeYT.childNodes);
+}
+
+export default function decorate(block) {
+  loadScript('https://www.youtube.com/iframe_api');
+
+  let [videoLink] = block.querySelectorAll('a');
+  const [, videoId] = videoLink.getAttribute('href').split('/embed/');
+  const [videoCode] = videoId.split('?');
+  videoLink = videoCode;
+
+  if (!videoLink) {
+    block.innerHTML = '';
+    /* eslint-disable-next-line no-console */
+    console.warn('V2 Livestream Embed block: There is no video link. Please check the provided URL.');
+    return;
+  }
+
+  // eslint-disable-next-line func-names
+  window.onYouTubeIframeAPIReady = function () {
+    setTimeout(() => {
+      // eslint-disable-next-line no-undef
+      player = new YT.Player('livestream', {
+        events: {
+          onReady: onPlayerReady,
+          onError: onPlayerError,
+          onAutoplayBlocked: onPlayerAutoplayBlocked,
+        },
+      });
+    }, 3000);
+  };
+
+  if (!isExternalVideoAllowed()) {
+    const img = block.querySelector('picture img');
+    block.innerHTML = '';
+
+    const cookieMsgContainer = createElement('div', {
+      classes: 'cookie-message',
+    });
+    cookieMsgContainer.style.background = `linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.80) 100%), url(${img.src}) center / cover no-repeat`;
+
+    const cookieMessage = document.createRange().createContextualFragment(`
+      <h3 class="cookie-message__title">${getTextLabel('single video message title')}</h3>
+      ${getTextLabel('single video message text')}
+      <div class="cookie-message__button-container">
+        <button class="primary dark">${getTextLabel('single video message button')}</button>
+        <button class="button secondary dark">${getTextLabel('single video message button deny')}</button>
+      </div>
+    `);
+
+    cookieMsgContainer.append(cookieMessage);
+    block.append(cookieMsgContainer);
+
+    block.querySelector('.cookie-message__button-container .primary')?.addEventListener('click', () => {
+      const domain = '.volvotrucks.us';
+      const path = '/'; // assuming root path
+      const expirationDate = new Date();
+      expirationDate.setFullYear(expirationDate.getFullYear() + 1); // 1 year from now
+      const sameSite = 'Lax';
+
+      updateCookieValue('OptanonConsent=', 'C0005:0', 'C0005:1', domain, path, expirationDate, sameSite);
+      addVideo(block, videoLink);
+    });
+
+    block.querySelector('.cookie-message__button-container .secondary')?.addEventListener('click', () => {
+      hideModal();
+    });
+
+    return;
+  } else {
+    addVideo(block, videoLink);
+  }
+}

blocks/v2-media-with-tabs/v2-media-with-tabs.js

@@ -1,6 +1,7 @@
 import {
   addClassIfChildHasClass,
   createElement,
+  removeEmptyTags,
   unwrapDivs,
   variantsClassesToBEM,
 } from '../../scripts/common.js';
@@ -74,4 +75,5 @@ export default function decorate(block) {
   block.append(imageSection, textSection);
 
   unwrapDivs(block);
+  removeEmptyTags(block);
 }

common/modal/modal.css

@@ -25,7 +25,6 @@
 .modal--black {
   --background-color: var(--c-black);
   --text-color: var(--c-white);
-  --color-icon: var(--c-white);
 }
 
 .modal--gray {
@@ -237,3 +236,20 @@
     width: 100%;
   }
 }
+
+.modal-reveal {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+/* stylelint-disable-next-line no-descending-specificity */
+.modal-reveal .modal-content {
+  height: auto;
+  aspect-ratio: auto;
+}
+
+.modal-reveal .section > div {
+  padding-top: 0;
+  padding-bottom: 0;
+}

common/modal/modal.js

@@ -35,8 +35,10 @@ const createModal = () => {
   modalBackground.setAttribute('role', 'dialog');
 
   modalBackground.addEventListener('click', () => {
-    // eslint-disable-next-line no-use-before-define
-    hideModal();
+    if (!modalBackground.classList.contains('modal-reveal')) {
+      // eslint-disable-next-line no-use-before-define
+      hideModal();
+    }
   });
 
   const keyDownAction = (event) => {

news-and-stories/press-releases/feed.xml

@@ -2,10 +2,18 @@
 <feed xmlns="http://www.w3.org/2005/Atom">
     <id>https://www.volvotrucks.us/news-and-stories/press-releases/</id>
     <title>Volvo Trucks USA Press Releases</title>
-    <updated>2023-12-04T00:00:00.000Z</updated>
+    <updated>2024-01-10T00:00:00.000Z</updated>
     <generator>AEM News feed generator (GitHub action)</generator>
     <link rel="alternate" href="https://www.volvotrucks.us/news-and-stories/press-releases/"/>
     <subtitle>Volvo Trucks USA Press Releases</subtitle>
+    <entry>
+        <title type="html"><![CDATA[Vanguard Truck Centers Acquires Nacarato Truck Centers, Becoming One of Volvo Trucks’ Largest Dealer Groups | Volvo Trucks USA]]></title>
+        <id>https://www.volvotrucks.us/news-and-stories/press-releases/2024/january/vanguard-truck-centers-acquires-nacarato-truck-centers-becoming-one-of-volvo-trucks-largest-dealer-groups/</id>
+        <link href="https://www.volvotrucks.us/news-and-stories/press-releases/2024/january/vanguard-truck-centers-acquires-nacarato-truck-centers-becoming-one-of-volvo-trucks-largest-dealer-groups/"/>
+        <updated>2024-01-10T00:00:00.000Z</updated>
+        <content type="html"><![CDATA[“This acquisition is not just about numbers – it's about joining two exemplary dealer groups to implement best practices, bolster synergies and continue growing customer satisfaction, expanding customer access to the seamless support and services they have come to expect from both dealer groups,” said Peter Voorhoeve, president, Volvo Trucks North America.]]></content>
+        <published>2024-01-10T00:00:00.000Z</published>
+    </entry>
     <entry>
         <title type="html"><![CDATA[Volvo Trucks Expands Certified EV Dealer Network into Arizona, Georgia and North Carolina as Vanguard Truck Centers Adds Five Locations]]></title>
         <id>https://www.volvotrucks.us/news-and-stories/press-releases/2023/december/volvo-trucks-expands-certified-ev-dealer-network-into-arizona-georgia-and-north-carolina-as-vanguard-truck-centers-adds-five-locations/</id>

placeholder.json

@@ -228,8 +228,20 @@
       "Text": "Model year"
     },
     {
-      "Key": "go to top",
-      "Text": "Go to the top of the page"
+      "Key": "single video message title",
+      "Text": "Enable cookies to view the reveal in high resolution?"
+    },
+    {
+      "Key": "single video message text",
+      "Text": "<p class=\"cookie-message__text\">Our media viewer uses social media cookies and/or similar technologies set by third-party services, as outlined in our <a href=\"/cookies/\">Cookie Notice</a>. We and our digital partners use cookies to improve your browsing experience, save your preferences and provide us with information on how you use our website.</p><p class=\"cookie-message__text\">You can click “Accept All Cookies” to view the reveal and to agree to the storing of cookies on your device and to our use of cookies. You can also configure or reject cookies by clicking on “Cookie Settings” or “Reject All.” Please note that rejecting cookies means that you will not be able to view the reveal. Please also note that selecting “Reject All” still implies that necessary cookies will remain.</p>"
+    },
+    {
+      "Key": "single video message button",
+      "Text": "Accept All Cookies"
+    },
+    {
+      "Key": "single video message button deny",
+      "Text": "Reject All"
     }
   ],
   ":type": "sheet"