FR: Magazine Tabbed Carousel - Video - (#2 of 4)

[shirin27]

From vg-macktrucks-com-rd created by Gonzalo-CG: Netcentric#208

Description

This issue must be picked after #604

This issue aims to add the tab auto-scrolling functionality and the ability to add videos to tabs to the Tabbed Carousel Variant: Dark Block. An auto-scroll toggle is available to turn on and off the auto-scroll functionality.

Acceptance Criteria

• As an author, I can add a video to any tab (instead of an image)
• The tabs of the component auto-scroll. Completed as part of FR: Magazine Tabbed Carousel (#1 of 4) #604
• A on-off auto-scroll toggle button is in the lower left corner of the block Completed as part of FR: Magazine Tabbed Carousel (#1 of 4) #604
• The video should autoplay once the slide is in view
• The video should loop for the period of the time interval
• A default time to be set for the video

Open Questions

1. Confirmation of time intervals for auto-scroll functionality > it should be 6s (agreed in the SRB meeting 18/06/2024)
2. Should the time interval be configurable - setting a time value > yes, it will be configurable thanks to a data-attribute that needs to be defined in the section metada (the value should be added in milliseconds, e.g. 6000). (agreed in the SRB meeting 18/06/2024).

Attachments

[shirin27]

Design was updated to include the pause button in the upper right corner, and a toggle for the auto-scroll in the lower left corner.

[BeckyMedlin]

@shirin27 Is this one really blocked?

[shirin27]

@BeckyMedlin no it's not, based on the history of the ticket, I changed the status to Ready for refinement. :)

[ZoeBeykirch]

Split this ticket - 1 for adding auto scroll to carousel / another for the video - this will be dedicated to the carousel

[girishdigrajkar]

Validated and able to get the correct results and hence, closing the ticket.

Below observations are now fixed :
Mobile

1. Page content is not displayed when clicked on ‘Mack Keeps Going ->’ link on second tab : Passed
2. Hero image/ Page content is not displayed when clicked on ‘PETS For the Ride ->’ link on third tab : Passed
3. For mobile viewport, if video has presentation with text then it is cropped / cut off
   [AB] FYI Girish, after discussing with the design team, we have decided not to take any action on this matter. They do not anticipate adding videos with embedded text in that carousel. Users are expected to visit the article page to view the full video, rather than viewing them in the tabbed carousel.