/**

[0] Fix | Delete

* Note: This is complex initialization, but it is necessary for Gutenberg and Elementor compatibility. There are some known issues in Gutenberg that require this complex setup.

[1] Fix | Delete

*/

[2] Fix | Delete

var playerInit = [];

[3] Fix | Delete

[4] Fix | Delete

// Event listener for when the DOM content is loaded

[5] Fix | Delete

document.addEventListener('DOMContentLoaded', function () {

[6] Fix | Delete

[7] Fix | Delete

[8] Fix | Delete

const overlayMask = document.createElement('div');

[9] Fix | Delete

overlayMask.className = 'overlay-mask';

[10] Fix | Delete

[11] Fix | Delete

[12] Fix | Delete

// Select all embed wrappers with the class 'ep-embed-content-wraper'

[13] Fix | Delete

let embedWrappers = document.querySelectorAll('.ep-embed-content-wraper');

[14] Fix | Delete

[15] Fix | Delete

// Initialize the player for each embed wrapper

[16] Fix | Delete

embedWrappers.forEach(wrapper => {

[17] Fix | Delete

initPlayer(wrapper);

[18] Fix | Delete

});

[19] Fix | Delete

[20] Fix | Delete

// Mutation observer to detect any changes in the DOM

[21] Fix | Delete

const observer = new MutationObserver(mutations => {

[22] Fix | Delete

mutations.forEach(mutation => {

[23] Fix | Delete

const addedNodes = Array.from(mutation.addedNodes);

[24] Fix | Delete

addedNodes.forEach(node => {

[25] Fix | Delete

traverseAndInitPlayer(node);

[26] Fix | Delete

});

[27] Fix | Delete

});

[28] Fix | Delete

});

[29] Fix | Delete

[30] Fix | Delete

// Start observing changes in the entire document body and its subtree

[31] Fix | Delete

observer.observe(document.body, { childList: true, subtree: true });

[32] Fix | Delete

[33] Fix | Delete

// Recursive function to traverse the DOM and initialize the player for each embed wrapper

[34] Fix | Delete

function traverseAndInitPlayer(node) {

[35] Fix | Delete

if (node.nodeType === Node.ELEMENT_NODE && node.classList.contains('ep-embed-content-wraper')) {

[36] Fix | Delete

initPlayer(node);

[37] Fix | Delete

}

[38] Fix | Delete

[39] Fix | Delete

if (node.hasChildNodes()) {

[40] Fix | Delete

node.childNodes.forEach(childNode => {

[41] Fix | Delete

traverseAndInitPlayer(childNode);

[42] Fix | Delete

});

[43] Fix | Delete

}

[44] Fix | Delete

}

[45] Fix | Delete

[46] Fix | Delete

[47] Fix | Delete

});

[48] Fix | Delete

[49] Fix | Delete

[50] Fix | Delete

// Function to initialize the player for a given wrapper

[51] Fix | Delete

function initPlayer(wrapper) {

[52] Fix | Delete

const playerId = wrapper.getAttribute('data-playerid');

[53] Fix | Delete

[54] Fix | Delete

// Get the options for the player from the wrapper's data attribute

[55] Fix | Delete

let options = document.querySelector(`[data-playerid='${playerId}']`)?.getAttribute('data-options');

[56] Fix | Delete

[57] Fix | Delete

if (!options) {

[58] Fix | Delete

return false;

[59] Fix | Delete

}

[60] Fix | Delete

[61] Fix | Delete

// Parse the options string into a JSON object

[62] Fix | Delete

if (typeof options === 'string') {

[63] Fix | Delete

try {

[64] Fix | Delete

options = JSON.parse(options);

[65] Fix | Delete

} catch (e) {

[66] Fix | Delete

console.error('Invalid JSON format:', e);

[67] Fix | Delete

return;

[68] Fix | Delete

}

[69] Fix | Delete

} else {

[70] Fix | Delete

console.error('Options is not a string');

[71] Fix | Delete

return;

[72] Fix | Delete

}

[73] Fix | Delete

[74] Fix | Delete

[75] Fix | Delete

// Create DOM elements from the icon strings

[76] Fix | Delete

const pipPlayIconElement = document.createElement('div');

[77] Fix | Delete

pipPlayIconElement.className = 'pip-play';

[78] Fix | Delete

pipPlayIconElement.innerHTML = '<svg width="20" height="20" viewBox="-0.15 -0.112 0.9 0.9" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin" class="jam jam-play"><path fill="#fff" d="M.518.357A.037.037 0 0 0 .506.306L.134.08a.039.039 0 0 0-.02-.006.038.038 0 0 0-.038.037v.453c0 .007.002.014.006.02a.039.039 0 0 0 .052.012L.506.37A.034.034 0 0 0 .518.358zm.028.075L.174.658A.115.115 0 0 1 .017.622.109.109 0 0 1 0 .564V.111C0 .05.051 0 .114 0c.021 0 .042.006.06.017l.372.226a.11.11 0 0 1 0 .189z"/></svg>';

[79] Fix | Delete

pipPlayIconElement.style.display = 'none';

[80] Fix | Delete

[81] Fix | Delete

[82] Fix | Delete

const pipPauseIconElement = document.createElement('div');

[83] Fix | Delete

pipPauseIconElement.className = 'pip-pause';

[84] Fix | Delete

pipPauseIconElement.innerHTML = '<svg fill="#fff" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 2.5 2.5" xml:space="preserve"><path d="M1.013.499 1.006.5V.499H.748a.054.054 0 0 0-.054.054v1.394c0 .03.024.054.054.054h.266a.054.054 0 0 0 .054-.054V.553a.054.054 0 0 0-.054-.054zm.793 1.448V.553a.054.054 0 0 0-.054-.054L1.745.5V.499h-.258a.054.054 0 0 0-.054.054v1.394c0 .03.024.054.054.054h.265a.054.054 0 0 0 .054-.054z"/></svg>';

[85] Fix | Delete

[86] Fix | Delete

const pipCloseElement = document.createElement('div');

[87] Fix | Delete

pipCloseElement.className = 'pip-close';

[88] Fix | Delete

pipCloseElement.innerHTML = '<svg width="20" height="20" viewBox="0 0 0.9 0.9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M.198.198a.037.037 0 0 1 .053 0L.45.397.648.199a.037.037 0 1 1 .053.053L.503.45l.198.198a.037.037 0 0 1-.053.053L.45.503.252.701A.037.037 0 0 1 .199.648L.397.45.198.252a.037.037 0 0 1 0-.053z" fill="#fff"/></svg>';

[89] Fix | Delete

[90] Fix | Delete

// Check if the player has not been initialized for this wrapper

[91] Fix | Delete

if (playerId && !wrapper.classList.contains('plyr-initialized')) {

[92] Fix | Delete

[93] Fix | Delete

[94] Fix | Delete

let selector = `[data-playerid='${playerId}'] .ose-embedpress-responsive`;

[95] Fix | Delete

[96] Fix | Delete

if (options.self_hosted && options.hosted_format === 'video') {

[97] Fix | Delete

selector = `[data-playerid='${playerId}'] .ose-embedpress-responsive video`;

[98] Fix | Delete

}

[99] Fix | Delete

else if (options.self_hosted && options.hosted_format === 'audio') {

[100] Fix | Delete

selector = `[data-playerid='${playerId}'] .ose-embedpress-responsive audio`;

[101] Fix | Delete

wrapper.style.opacity = "1";

[102] Fix | Delete

}

[103] Fix | Delete

[104] Fix | Delete

[105] Fix | Delete

// Set the main color of the player

[106] Fix | Delete

document.querySelector(`[data-playerid='${playerId}']`).style.setProperty('--plyr-color-main', options.player_color);

[107] Fix | Delete

document.querySelector(`[data-playerid='${playerId}'].custom-player-preset-1, [data-playerid='${playerId}'].custom-player-preset-3, [data-playerid='${playerId}'].custom-player-preset-4`)?.style.setProperty('--plyr-range-fill-background', '#ffffff');

[108] Fix | Delete

[109] Fix | Delete

// Set the poster thumbnail for the player

[110] Fix | Delete

if (document.querySelector(`[data-playerid='${playerId}'] iframe`)) {

[111] Fix | Delete

document.querySelector(`[data-playerid='${playerId}'] iframe`).setAttribute('data-poster', options.poster_thumbnail);

[112] Fix | Delete

}

[113] Fix | Delete

if (document.querySelector(`[data-playerid='${playerId}'] video`)) {

[114] Fix | Delete

document.querySelector(`[data-playerid='${playerId}'] video`).setAttribute('data-poster', options.poster_thumbnail);

[115] Fix | Delete

}

[116] Fix | Delete

[117] Fix | Delete

// Define the controls to be displayed

[118] Fix | Delete

const controls = [

[119] Fix | Delete

'play-large',

[120] Fix | Delete

options.restart ? 'restart' : '',

[121] Fix | Delete

options.rewind ? 'rewind' : '',

[122] Fix | Delete

'play',

[123] Fix | Delete

options.fast_forward ? 'fast-forward' : '',

[124] Fix | Delete

'progress',

[125] Fix | Delete

'current-time',

[126] Fix | Delete

'duration',

[127] Fix | Delete

'mute',

[128] Fix | Delete

'volume',

[129] Fix | Delete

'captions',

[130] Fix | Delete

'settings',

[131] Fix | Delete

options.pip ? 'pip' : '',

[132] Fix | Delete

'airplay',

[133] Fix | Delete

options.download ? 'download' : '',

[134] Fix | Delete

options.fullscreen ? 'fullscreen' : '',

[135] Fix | Delete

[136] Fix | Delete

].filter(control => control !== '');

[137] Fix | Delete

[138] Fix | Delete

// Create a new Plyr player instance with the specified options and controls

[139] Fix | Delete

const player = new Plyr(selector, {

[140] Fix | Delete

controls: controls,

[141] Fix | Delete

seekTime: 10,

[142] Fix | Delete

poster: options.poster_thumbnail,

[143] Fix | Delete

storage: {

[144] Fix | Delete

enabled: true,

[145] Fix | Delete

key: 'plyr_volume'

[146] Fix | Delete

},

[147] Fix | Delete

displayDuration: true,

[148] Fix | Delete

tooltips: { controls: options.player_tooltip, seek: options.player_tooltip },

[149] Fix | Delete

hideControls: options.hide_controls,

[150] Fix | Delete

youtube: {

[151] Fix | Delete

...(options.autoplay && { autoplay: options.autoplay }),

[152] Fix | Delete

...(options.start && { start: options.start }),

[153] Fix | Delete

...(options.end && { end: options.end }),

[154] Fix | Delete

...(options.rel && { rel: options.rel }),

[155] Fix | Delete

...(options.fullscreen && { fs: options.fullscreen })

[156] Fix | Delete

},

[157] Fix | Delete

vimeo: {

[158] Fix | Delete

byline: false,

[159] Fix | Delete

portrait: false,

[160] Fix | Delete

title: false,

[161] Fix | Delete

speed: true,

[162] Fix | Delete

transparent: false,

[163] Fix | Delete

controls: false,

[164] Fix | Delete

...(options.t && { t: options.t }),

[165] Fix | Delete

...(options.vautoplay && { autoplay: options.vautoplay }),

[166] Fix | Delete

...(options.autopause && { autopause: options.autopause }),

[167] Fix | Delete

...(options.dnt && { dnt: options.dnt }),

[168] Fix | Delete

}

[169] Fix | Delete

});

[170] Fix | Delete

[171] Fix | Delete

playerInit[playerId] = player;

[172] Fix | Delete

[173] Fix | Delete

[174] Fix | Delete

[175] Fix | Delete

// Mark the wrapper as initialized

[176] Fix | Delete

wrapper.classList.add('plyr-initialized');

[177] Fix | Delete

[178] Fix | Delete

const posterElement = wrapper.querySelector('.plyr__poster');

[179] Fix | Delete

[180] Fix | Delete

if (posterElement) {

[181] Fix | Delete

const interval = setInterval(() => {

[182] Fix | Delete

if (posterElement && posterElement.style.backgroundImage) {

[183] Fix | Delete

wrapper.style.opacity = '1';

[184] Fix | Delete

clearInterval(interval);

[185] Fix | Delete

}

[186] Fix | Delete

}, 200);

[187] Fix | Delete

[188] Fix | Delete

}

[189] Fix | Delete

[190] Fix | Delete

}

[191] Fix | Delete

[192] Fix | Delete

// Check for the existence of the player's pip button at regular intervals

[193] Fix | Delete

const pipInterval = setInterval(() => {

[194] Fix | Delete

[195] Fix | Delete

let playerPip = document.querySelector(`[data-playerid="${playerId}"] [data-plyr="pip"]`);

[196] Fix | Delete

if (playerPip) {

[197] Fix | Delete

clearInterval(pipInterval);

[198] Fix | Delete

[199] Fix | Delete

let options = document.querySelector(`[data-playerid="${playerId}"]`).getAttribute('data-options');

[200] Fix | Delete

[201] Fix | Delete

options = JSON.parse(options);

[202] Fix | Delete

if (!options.self_hosted) {

[203] Fix | Delete

[204] Fix | Delete

const iframeSelector = document.querySelector(`[data-playerid="${playerId}"] .plyr__video-wrapper`);

[205] Fix | Delete

[206] Fix | Delete

// Add click event listener to toggle the pip mode

[207] Fix | Delete

playerPip.addEventListener('click', () => {

[208] Fix | Delete

iframeSelector.classList.toggle('pip-mode');

[209] Fix | Delete

[210] Fix | Delete

let parentElement = iframeSelector.parentElement;

[211] Fix | Delete

while (parentElement) {

[212] Fix | Delete

parentElement.style.zIndex = '9999';

[213] Fix | Delete

parentElement = parentElement.parentElement;

[214] Fix | Delete

}

[215] Fix | Delete

[216] Fix | Delete

});

[217] Fix | Delete

[218] Fix | Delete

[219] Fix | Delete

if (options.pip) {

[220] Fix | Delete

iframeSelector.appendChild(pipPlayIconElement);

[221] Fix | Delete

iframeSelector.appendChild(pipPauseIconElement);

[222] Fix | Delete

iframeSelector.appendChild(pipCloseElement);

[223] Fix | Delete

const pipPlay = document.querySelector(`[data-playerid="${playerId}"] .plyr__video-wrapper .pip-play`);

[224] Fix | Delete

const pipPause = document.querySelector(`[data-playerid="${playerId}"] .plyr__video-wrapper .pip-pause`);

[225] Fix | Delete

const pipClose = document.querySelector(`[data-playerid="${playerId}"] .plyr__video-wrapper .pip-close`);

[226] Fix | Delete

[227] Fix | Delete

pipClose.addEventListener('click', () => {

[228] Fix | Delete

iframeSelector.classList.remove('pip-mode');

[229] Fix | Delete

console.log(iframeSelector.classList);

[230] Fix | Delete

});

[231] Fix | Delete

[232] Fix | Delete

[233] Fix | Delete

iframeSelector.addEventListener('click', () => {

[234] Fix | Delete

const ariaPressedValue = document.querySelector(`[data-playerid="${playerId}"] .plyr__controls [data-plyr="play"]`).getAttribute('aria-pressed');

[235] Fix | Delete

[236] Fix | Delete

console.log(ariaPressedValue);

[237] Fix | Delete

if (ariaPressedValue === 'true') {

[238] Fix | Delete

pipPause.style.display = 'none';

[239] Fix | Delete

pipPlay.style.display = 'flex';

[240] Fix | Delete

} else {

[241] Fix | Delete

pipPlay.style.display = 'none';

[242] Fix | Delete

pipPause.style.display = 'flex';

[243] Fix | Delete

}

[244] Fix | Delete

});

[245] Fix | Delete

[246] Fix | Delete

}

[247] Fix | Delete

[248] Fix | Delete

[249] Fix | Delete

}

[250] Fix | Delete

}

[251] Fix | Delete

[252] Fix | Delete

}, 200);

[253] Fix | Delete

[254] Fix | Delete

}

[255] Fix | Delete

[256] Fix | Delete