03-Jan-2026 — YouTube and Albums #103

build 405 — commit ac867ec

• Added ability to embed YouTube videos across albums, carousels, and pages with centralised service architecture and automatic playback pausing.
• Brief description is provided below, but see here to find out about all the different ways to add video content.

About This Release

YouTube Embedding Foundation:

• Created reusable YoutubeEmbed component for privacy-enhanced video embedding
• Extended ContentMetadata, ContentText, and PageContent models with youtubeId field
• Updated album gallery and grid views to display YouTube videos alongside images
• Enhanced carousel editor to support adding YouTube videos to image lists
• Added YouTube embedding support to dynamic content pages
• Provided CMS migration scripts to convert existing YouTube links to embedded videos
• Auto-generate thumbnail from YouTube if no custom image provided

Centralized Service Architecture:

• Created youtube.model.ts with YouTubeDomain and YouTubeQuality enums for type-safe constants
• Implemented centralized YouTubeService with embedUrl() and thumbnailUrl() methods
• Refactored 5 files to use YouTubeService (location-extraction, index, card-editor, album-gallery, youtube-embed)
• Eliminated all hardcoded YouTube URLs across codebase

Playback Pausing — Carousel:

• Upgraded youtube-embed.ts to use official YouTube IFrame Player API
• Dynamically load iframe_api and create YT.Player instances
• Emit playbackStateChange events on video play/pause
• Carousel component listens to events and pauses auto-advance via noPause flag

Playback Pausing — Gallery:

• Implemented bidirectional postMessage communication with YouTube IFrame API
• Search document-wide for YouTube iframes (ng-gallery renders globally)
• Detect playing state and call galleryRef.stop() to pause slideshow
• Auto-resume slideshow with galleryRef.play() when video stops

Carousel UI Improvements:

• Added duplicate image list functionality with inline input and confirm/cancel buttons
• Improved button layouts from vertical stack to horizontal inline
• Enhanced carousel editor UX for managing image lists with YouTube videos