/
var
/
www
/
html
/
wordpress
/
wp-content
/
plugins
/
presto-player
/
dist
/
components
/
web-components
/
Upload File
HOME
{"version":3,"names":["prestoPlaylistCss","PrestoPlaylist","constructor","hostRef","this","transitionDuration","playing","rewatch","handlePlay","next","handleNext","handleCurrentPlay","value","previousValue","addOverlay","currentPlyr","elements","container","getRootNode","host","style","currentPlaylistItem","config","styles","isIOS","undefined","provider","muted","_a","embed","unMute","play","resetPlayingStateOnItemChange","overlay","document","createElement","nextItemTitle","getNextItemTitle","isLastItem","nextItemString","listTextSingular","_b","closest","append","componentWillLoad","items","handleItemClick","item","show","el","height","offsetHeight","width","offsetWidth","getNextItem","handlePause","pause","nextItem","i","length","id","_c","_d","lastIndex","title","render","listTextS","listTextP","listTextPlural","h","src","slot","videoId","_e","_f","class","_g","playerClass","key","_h","_j","onPlayerReady","e","detail","onPlayedMedia","onPausedMedia","onEndedMedia","name","heading","map","onClick","active","onTriggerPause","onTriggerPlay","duration"],"sources":["src/components/core/features/presto-playlist/presto-playlist.scss?tag=presto-playlist&encapsulation=shadow","src/components/core/features/presto-playlist/presto-playlist.tsx"],"sourcesContent":[":host {\n display: block;\n overflow: hidden;\n}\npresto-player {\n opacity: 0;\n visibility: hidden;\n transition: 0.35s opacity, 0.35s visibility;\n\n &.ready {\n opacity: 1;\n visibility: visible;\n }\n}\n","import { Component, h, Prop, State, Watch, Listen, Element } from '@stencil/core';\n\nimport { PlaylistItem } from '../../../../interfaces';\nimport { isIOS } from '../../../../util';\n\n@Component({\n tag: 'presto-playlist',\n styleUrl: 'presto-playlist.scss',\n shadow: true,\n})\nexport class PrestoPlaylist {\n @Element() el: HTMLElement;\n\n /** Overlay component */\n private overlay: any;\n\n /** Array of videos from the Playlist */\n @Prop() items: Array<PlaylistItem>;\n\n /** Title for the Playlist */\n @Prop() heading: string;\n\n /** Count prefix string for the Playlist - Singular */\n @Prop() listTextSingular: string;\n\n /** Count prefix string for the Playlist - Plural */\n @Prop() listTextPlural: string;\n\n /** Transition duration for next video. */\n @Prop() transitionDuration: number = 5;\n\n /** Stores current video that is shown in the preview. */\n @State() currentPlaylistItem: PlaylistItem;\n\n /** Stores current video Plyr object that is shown in the preview. */\n @State() currentPlyr: any;\n\n /** Is a video playing. */\n @State() playing: boolean = false;\n\n /**\n * Listening to the Rewatch Video button click event.\n */\n @Listen('rewatch')\n rewatch() {\n this.handlePlay();\n }\n\n /**\n * Listening to the Next Video button click event.\n */\n @Listen('next')\n next() {\n this.handleNext();\n }\n\n /**\n * Plays the video, adds overlay and Presto Video styles as soon as a new object is assigned.\n * @param value Current value\n * @param previousValue Previous value\n */\n @Watch('currentPlyr')\n handleCurrentPlay(value, previousValue) {\n if (!value) return;\n\n // add the overlay.\n this.addOverlay();\n\n // add styles from the current video config.\n this.currentPlyr.elements.container.getRootNode().host.style = this.currentPlaylistItem.config.styles;\n\n // iOS has strict autoplay policies, so we rely on user interaction for playback.\n if (isIOS()) {\n return;\n }\n\n // if we have a previous value, then we need to autoplay the video since we are switching.\n if (previousValue !== undefined) {\n // Restore audio (YouTube starts playing on seek if the video hasn't been played yet)\n if (this.currentPlyr.provider === 'youtube' && !this.currentPlyr.muted && this.currentPlyr?.embed) {\n this.currentPlyr.embed.unMute();\n }\n\n this.currentPlyr.play();\n }\n }\n\n /**\n * Resets the playing state whenever the current playlist item changes.\n * This ensures the playing state starts fresh with each new video selection.\n */\n @Watch('currentPlaylistItem')\n resetPlayingStateOnItemChange() {\n this.playing = false;\n }\n\n /**\n * Adds overlay to the player which will regulate the Next video button.\n */\n addOverlay() {\n // create overlay\n this.overlay = document.createElement('presto-playlist-overlay');\n // assign properties.\n this.overlay.nextItemTitle = this.getNextItemTitle();\n this.overlay.isLastItem = this.isLastItem();\n this.overlay.nextItemString = this?.listTextSingular || 'Video';\n this.overlay.transitionDuration = this.transitionDuration;\n // append\n this.currentPlyr.elements?.container?.closest('.presto-player__wrapper').append(this.overlay);\n }\n\n /**\n * Lifecycle: Component will load.\n */\n componentWillLoad() {\n // Select the first video as a current video to be shown in the playlist.\n this.currentPlaylistItem = this?.items?.[0] || null;\n }\n\n /**\n * Handles the click on the playlist item.\n * @param item PlaylistItem\n */\n handleItemClick(item: PlaylistItem) {\n if (this.overlay) {\n this.overlay.show = false;\n }\n this.el.style.height = this.el.offsetHeight + 'px';\n this.el.style.width = this.el.offsetWidth + 'px';\n this.currentPlaylistItem = item;\n }\n\n /**\n * Assign the next item in the playlist as a current item.\n */\n handleNext() {\n this.overlay.show = false;\n this.currentPlaylistItem = this.getNextItem() || this.currentPlaylistItem;\n }\n\n /**\n * Play the current video.\n */\n handlePlay() {\n if (this.overlay) {\n this.overlay.show = false;\n }\n this.currentPlyr.play();\n }\n\n /**\n * Pause the current video.\n */\n handlePause() {\n this.overlay.show = false;\n this.currentPlyr.pause();\n }\n\n /**\n * Get the next item in the playlist.\n * @returns PlaylistItem Next item in the playlist.\n */\n getNextItem() {\n if (this.isLastItem()) return this.items[0];\n\n let nextItem: PlaylistItem;\n for (let i = 0; i < this.items?.length; i++) {\n if (this.items[i]?.id === this.currentPlaylistItem?.id && this.items?.length !== i + 1) {\n nextItem = this.items[i + 1];\n break;\n }\n }\n return nextItem;\n }\n\n /**\n * Checks if the current item is the last item in the playlist.\n * @returns boolean True if the current item is the last item in the playlist.\n */\n isLastItem() {\n const lastIndex = this.items?.length - 1;\n return this.items[lastIndex]?.id === this.currentPlaylistItem?.id;\n }\n\n /**\n * Get the title of the next item in the playlist.\n * @returns string Title of the next item in the playlist.\n */\n getNextItemTitle() {\n const nextItem = this.getNextItem();\n if (undefined !== nextItem) {\n return nextItem?.title || nextItem?.config?.title;\n }\n return '';\n }\n\n /**\n * Rendering the component.\n * @returns Web Component\n */\n render() {\n if (!this.items?.length) return '';\n\n const listTextS = this.listTextSingular ? this.listTextSingular : 'Video';\n const listTextP = this.listTextPlural ? this.listTextPlural : 'Videos';\n\n return (\n <presto-playlist-ui>\n {!!this.currentPlaylistItem.config?.src ? (\n <presto-player\n slot=\"preview\"\n src={this.currentPlaylistItem.config?.src}\n {...this.currentPlaylistItem.config}\n videoId={this.currentPlaylistItem.config?.id}\n id={`presto-player-${this.currentPlaylistItem.config?.id}`}\n media-title={this.currentPlaylistItem.config?.title}\n class={this.currentPlaylistItem.config?.playerClass}\n key={this.currentPlaylistItem.config?.id}\n provider={this.currentPlaylistItem.config?.provider}\n onPlayerReady={e => {\n this.currentPlyr = e.detail;\n this.el.style.height = null;\n this.el.style.width = null;\n }}\n onPlayedMedia={() => (this.playing = true)}\n onPausedMedia={() => (this.playing = false)}\n onEndedMedia={() => (this.overlay.show = true)}\n />\n ) : (\n <slot name=\"unauthorized\" slot=\"preview\" />\n )}\n\n <div slot=\"title\">{this.heading || 'Playlist'}</div>\n\n <div slot=\"count\">\n {this.items.length} {this.items.length > 1 ? listTextP : listTextS}\n </div>\n\n {this.items.map(item => {\n return (\n <presto-playlist-item\n slot=\"list\"\n onClick={() => this.handleItemClick(item)}\n active={this.currentPlaylistItem?.id === item?.id}\n playing={this.currentPlaylistItem?.id === item?.id && this.playing}\n class={this.currentPlaylistItem?.id === item?.id ? 'active' : ''}\n key={item?.id}\n onTriggerPause={() => this.handlePause()}\n onTriggerPlay={() => this.handlePlay()}\n >\n <span slot=\"item-title\">\n <span>{item?.title || item?.config?.title}</span>\n </span>\n <span slot=\"item-duration\">\n <span>{item?.duration}</span>\n </span>\n </presto-playlist-item>\n );\n })}\n </presto-playlist-ui>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}