Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
init(app) {
// We don't need to init this service twice, or the media events will be duplicated.
if (this.initialized) {
return;
}
this.app = app;
this.player = plyr.setup({
controls: [],
})[0];
this.audio = $('audio');
this.$volumeInput = $('#volumeRange');
/**
* Listen to 'error' event on the audio player and play the next song if any.
*/
document.querySelector('.plyr').addEventListener('error', e => {
this.playNext();
}, true);
/**
* Listen to 'ended' event on the audio player and play the next song in the queue.
init () {
// We don't need to init this service twice, or the media events will be duplicated.
if (this.initialized) {
return
}
this.player = plyr.setup({
controls: []
})[0]
this.audio = document.querySelector('audio')
this.volumeInput = document.getElementById('volumeRange')
const player = document.querySelector('.plyr')
/**
* Listen to 'error' event on the audio player and play the next song if any.
*/
player.addEventListener('error', () => this.playNext(), true)
/**
* Listen to 'ended' event on the audio player and play the next song in the queue.
*/
componentDidMount() {
// Adding keydown event listener to window element
window.addEventListener('keydown', (e) => this.handleKeyboardEvents(e));
// Audio player configuration
plyr.setup({
html: [
"<div class="plyr__controls">",
"<span class="plyr__progress">",
"<label class="plyr__sr-only" for="seek{id}">Seek</label>",
"<input data-plyr="seek" value="0" step="0.1" max="100" min="0" type="range" class="plyr__progress--seek" id="seek{id}">",
"<progress role="presentation" value="0" max="100" class="plyr__progress--played"></progress>",
"<progress value="0" max="100" class="plyr__progress--buffer">",
"<span>0</span>% buffered",
"</progress>",
"<span class="plyr__tooltip">00:00</span>",
"</span>",
"<button data-plyr="play" type="button">",
`<img alt="/" src="${playIcon}">`,
"<span class="plyr__sr-only">Play</span>",
"</button>",
"<button data-plyr="pause" type="button">",</button></div>
mounted () {
if (this.$slots.default) {
this.player = plyr.setup(document.getElementById(`plyr-video-container-${this.idNumber}`).childNodes[0],
this.options)[0]
} else {
this.player = plyr.setup(document.getElementById(`js-player-video-${this.idNumber}`), this.options)[0]
}
},
beforeDestroy () {
else if (this.properties.player == 'video') {
var captions = '';
for (var i = 0; i < this.properties.html5captions.length; i++) {
var caption = this.properties.html5captions[i];
captions += '<track srclang="' + caption['SrcLen'] + '" src="' + caption['Url'] + '" label="' + caption['Title'] + '" kind="captions">';
}
html += `
<video controls="" poster="${this.properties.html5cover}">
<source type="video/mp4" src="${this.properties.html5video}">
${captions}
</video>
`;
}
this.domElement.innerHTML = html;
plyr.setup();
}
mounted () {
if (this.$slots.default) {
this.player = plyr.setup(document.getElementById(`plyr-audio-container-${this.idNumber}`).childNodes[0],
this.options)[0]
} else {
this.player = plyr.setup(document.getElementById(`js-player-audio-${this.idNumber}`), this.options)[0]
}
},
beforeDestroy () {
mounted () {
if (this.$slots.default) {
this.player = plyr.setup(document.getElementById(`plyr-video-container-${this.idNumber}`).childNodes[0],
this.options)[0]
} else {
this.player = plyr.setup(document.getElementById(`js-player-video-${this.idNumber}`), this.options)[0]
}
},
beforeDestroy () {
mounted () {
if (this.$slots.default) {
this.player = plyr.setup(document.getElementById(`plyr-audio-container-${this.idNumber}`).childNodes[0],
this.options)[0]
} else {
this.player = plyr.setup(document.getElementById(`js-player-audio-${this.idNumber}`), this.options)[0]
}
},
beforeDestroy () {
mounted () {
if (this.$slots.default) {
this.player = plyr.setup(document.getElementById(`plyr-youtube-container-${this.idNumber}`).childNodes[0],
this.options)[0]
} else {
this.player = plyr.setup(document.getElementById(`js-player-youtube-${this.idNumber}`), this.options)[0]
}
},
beforeDestroy () {
didMount() {
let pl = plyr.setup()
this.player = pl[0]
this.player.on('ready', () => {
this._onPlayerLoad()
})
}