Skip to content

Commit 65214d8

Browse files
joedolsonjoedolson
committed
Don't execute code if ableplayer is undefined.
Happens with Complianz if cookies aren't accepted.
1 parent e790348 commit 65214d8

File tree

1 file changed

+121
-119
lines changed

1 file changed

+121
-119
lines changed

‎src/assets/js/media.js‎

Lines changed: 121 additions & 119 deletions
Original file line numberDiff line numberDiff line change
@@ -1,137 +1,139 @@
11
let ableplayer_selectors = [];
2-
if ( ableplayer.settings.replace_video === 'true' ) {
3-
ableplayer_selectors.push( 'video' );
4-
}
5-
if ( ableplayer.settings.replace_audio === 'true' ) {
6-
ableplayer_selectors.push( 'audio' );
7-
}
8-
if ( 0 !== ableplayer_selectors.length ) {
9-
const mediaEls = document.querySelectorAll( ableplayer_selectors );
10-
let childTracks;
11-
if ( mediaEls ) {
12-
mediaEls.forEach((el,index,listObj) => {
13-
let excludeClass = ableplayer.settings.exclude_class;
14-
let parentEl = el.closest( 'figure' );
15-
let parentDiv = el.closest( 'div' );
16-
let parentHasClass = ( parentEl ) ? parentEl.classList.contains( excludeClass ) : false;
17-
let parentDivHasClass = ( parentDiv ) ? parentDiv.classList.contains( excludeClass ) : false;
18-
if ( excludeClass !== '' && el.classList.contains( excludeClass ) || parentHasClass || parentDivHasClass ) {
19-
el.classList.add( 'ableplayer-skipped' );
20-
} else {
21-
el.removeAttribute( 'controls' );
22-
if ( ! el.hasAttribute( 'data-able-player' ) ) {
23-
el.setAttribute( 'data-able-player', 'true' );
24-
}
25-
if ( ! el.hasAttribute( 'id' ) ) {
26-
el.setAttribute( 'id', 'able-player-id-' + index );
27-
}
28-
if ( ! el.hasAttribute( 'data-skin' ) ) {
29-
el.setAttribute( 'data-skin', '2020' );
30-
}
31-
}
32-
childTracks = el.querySelectorAll( 'track' );
33-
childTracks.forEach((track,index,listObj) => {
34-
if ( ! track.hasAttribute( 'kind' ) ) {
35-
track.setAttribute( 'kind', 'subtitles' );
2+
if ( ableplayer !== 'undefined' ) {
3+
if ( ableplayer.settings.replace_video === 'true' ) {
4+
ableplayer_selectors.push( 'video' );
5+
}
6+
if ( ableplayer.settings.replace_audio === 'true' ) {
7+
ableplayer_selectors.push( 'audio' );
8+
}
9+
if ( 0 !== ableplayer_selectors.length ) {
10+
const mediaEls = document.querySelectorAll( ableplayer_selectors );
11+
let childTracks;
12+
if ( mediaEls ) {
13+
mediaEls.forEach((el,index,listObj) => {
14+
let excludeClass = ableplayer.settings.exclude_class;
15+
let parentEl = el.closest( 'figure' );
16+
let parentDiv = el.closest( 'div' );
17+
let parentHasClass = ( parentEl ) ? parentEl.classList.contains( excludeClass ) : false;
18+
let parentDivHasClass = ( parentDiv ) ? parentDiv.classList.contains( excludeClass ) : false;
19+
if ( excludeClass !== '' && el.classList.contains( excludeClass ) || parentHasClass || parentDivHasClass ) {
20+
el.classList.add( 'ableplayer-skipped' );
21+
} else {
22+
el.removeAttribute( 'controls' );
23+
if ( ! el.hasAttribute( 'data-able-player' ) ) {
24+
el.setAttribute( 'data-able-player', 'true' );
25+
}
26+
if ( ! el.hasAttribute( 'id' ) ) {
27+
el.setAttribute( 'id', 'able-player-id-' + index );
28+
}
29+
if ( ! el.hasAttribute( 'data-skin' ) ) {
30+
el.setAttribute( 'data-skin', '2020' );
31+
}
3632
}
33+
childTracks = el.querySelectorAll( 'track' );
34+
childTracks.forEach((track,index,listObj) => {
35+
if ( ! track.hasAttribute( 'kind' ) ) {
36+
track.setAttribute( 'kind', 'subtitles' );
37+
}
38+
});
3739
});
38-
});
40+
}
3941
}
40-
}
4142

42-
if ( 'true' === ableplayer.settings.replace_playlists) {
43-
const playlists = document.querySelectorAll( '.wp-playlist' );
44-
if ( playlists.length > 0 ) {
45-
playlists.forEach((playlist,index,listObj) => {
46-
renderPlaylist( playlist );
47-
});
43+
if ( 'true' === ableplayer.settings.replace_playlists) {
44+
const playlists = document.querySelectorAll( '.wp-playlist' );
45+
if ( playlists.length > 0 ) {
46+
playlists.forEach((playlist,index,listObj) => {
47+
renderPlaylist( playlist );
48+
});
49+
}
4850
}
49-
}
5051

51-
/**
52-
* Render the AblePlayer playlist over WP Playlist data sources.
53-
*
54-
* @param Element el Playlist wrapper element.
55-
*/
56-
function renderPlaylist( el ) {
57-
el.classList.add( 'has-ableplayer' );
58-
let contents = JSON.parse( el.querySelector( '.wp-playlist-script' ).textContent );
59-
let player = ( el.classList.contains( 'wp-audio-playlist' ) ) ? el.querySelector( 'audio' ) : el.querySelector( 'video' );
60-
let tracks = contents.tracks;
61-
let list = document.createElement( 'ul' );
62-
list.classList.add( 'able-playlist' );
63-
list.setAttribute( 'data-player', player.getAttribute( 'id' ) );
64-
list.setAttribute( 'data-embedded', true );
65-
let listItem, source, button;
66-
tracks.forEach((track,index,listObj) => {
67-
listItem = document.createElement( 'li' );
68-
listItem.setAttribute( 'data-poster', track.image.src );
69-
source = document.createElement( 'span' );
70-
source.classList.add( 'able-source' );
71-
source.setAttribute( 'data-type', track.type );
72-
source.setAttribute( 'data-src', track.src );
73-
button = document.createElement( 'button' );
74-
button.setAttribute( 'type', 'button' );
75-
button.innerText = track.title;
76-
if ( track.image.src ) {
77-
img = document.createElement( 'img' );
78-
img.setAttribute( 'src', track.image.src );
79-
img.setAttribute( 'alt', '' );
80-
img.setAttribute( 'height', track.image.height );
81-
img.setAttribute( 'width', track.image.width );
82-
button.insertAdjacentElement( 'afterbegin', img );
83-
}
84-
listItem.insertAdjacentElement( 'afterbegin', source );
85-
listItem.insertAdjacentElement( 'beforeend', button );
86-
list.insertAdjacentElement( 'beforeend', listItem );
87-
});
88-
el.insertAdjacentElement( 'beforeend', list );
52+
/**
53+
* Render the AblePlayer playlist over WP Playlist data sources.
54+
*
55+
* @param Element el Playlist wrapper element.
56+
*/
57+
function renderPlaylist( el ) {
58+
el.classList.add( 'has-ableplayer' );
59+
let contents = JSON.parse( el.querySelector( '.wp-playlist-script' ).textContent );
60+
let player = ( el.classList.contains( 'wp-audio-playlist' ) ) ? el.querySelector( 'audio' ) : el.querySelector( 'video' );
61+
let tracks = contents.tracks;
62+
let list = document.createElement( 'ul' );
63+
list.classList.add( 'able-playlist' );
64+
list.setAttribute( 'data-player', player.getAttribute( 'id' ) );
65+
list.setAttribute( 'data-embedded', true );
66+
let listItem, source, button;
67+
tracks.forEach((track,index,listObj) => {
68+
listItem = document.createElement( 'li' );
69+
listItem.setAttribute( 'data-poster', track.image.src );
70+
source = document.createElement( 'span' );
71+
source.classList.add( 'able-source' );
72+
source.setAttribute( 'data-type', track.type );
73+
source.setAttribute( 'data-src', track.src );
74+
button = document.createElement( 'button' );
75+
button.setAttribute( 'type', 'button' );
76+
button.innerText = track.title;
77+
if ( track.image.src ) {
78+
img = document.createElement( 'img' );
79+
img.setAttribute( 'src', track.image.src );
80+
img.setAttribute( 'alt', '' );
81+
img.setAttribute( 'height', track.image.height );
82+
img.setAttribute( 'width', track.image.width );
83+
button.insertAdjacentElement( 'afterbegin', img );
84+
}
85+
listItem.insertAdjacentElement( 'afterbegin', source );
86+
listItem.insertAdjacentElement( 'beforeend', button );
87+
list.insertAdjacentElement( 'beforeend', listItem );
88+
});
89+
el.insertAdjacentElement( 'beforeend', list );
8990

90-
let wpCurrent = el.querySelector( '.wp-playlist-current-item' );
91-
if ( wpCurrent ) {
92-
wpCurrent.remove();
91+
let wpCurrent = el.querySelector( '.wp-playlist-current-item' );
92+
if ( wpCurrent ) {
93+
wpCurrent.remove();
94+
}
9395
}
94-
}
9596

96-
const ablePlayers = document.querySelectorAll( '[data-able-player]' );
97-
if ( ablePlayers ) {
98-
ablePlayers.forEach((el,index,listObj) => {
99-
if ( 'true' === ableplayer.settings.youtube_nocookie ) {
100-
if ( ! el.hasAttribute( 'data-youtube-nocookie' ) ) {
101-
el.setAttribute( 'data-youtube-nocookie', 'true' );
97+
const ablePlayers = document.querySelectorAll( '[data-able-player]' );
98+
if ( ablePlayers ) {
99+
ablePlayers.forEach((el,index,listObj) => {
100+
if ( 'true' === ableplayer.settings.youtube_nocookie ) {
101+
if ( ! el.hasAttribute( 'data-youtube-nocookie' ) ) {
102+
el.setAttribute( 'data-youtube-nocookie', 'true' );
103+
}
102104
}
103-
}
104-
if ( 'auto' !== ableplayer.settings.default_heading ) {
105-
if ( ! el.hasAttribute( 'data-heading-level' ) ) {
106-
el.setAttribute( 'data-heading-level', ableplayer.settings.default_heading );
105+
if ( 'auto' !== ableplayer.settings.default_heading ) {
106+
if ( ! el.hasAttribute( 'data-heading-level' ) ) {
107+
el.setAttribute( 'data-heading-level', ableplayer.settings.default_heading );
108+
}
107109
}
108-
}
109-
if ( 'animals' !== ableplayer.settings.default_heading ) {
110-
if ( ! el.hasAttribute( 'data-speed-icons' ) ) {
111-
el.setAttribute( 'data-speed-icons', 'arrows' );
110+
if ( 'animals' !== ableplayer.settings.default_heading ) {
111+
if ( ! el.hasAttribute( 'data-speed-icons' ) ) {
112+
el.setAttribute( 'data-speed-icons', 'arrows' );
113+
}
112114
}
113-
}
114-
if ( 'true' === ableplayer.settings.hide_controls ) {
115-
if ( ! el.hasAttribute( 'data-hide-controls' ) ) {
116-
el.setAttribute( 'data-hide-controls', 'true' );
115+
if ( 'true' === ableplayer.settings.hide_controls ) {
116+
if ( ! el.hasAttribute( 'data-hide-controls' ) ) {
117+
el.setAttribute( 'data-hide-controls', 'true' );
118+
}
117119
}
118-
}
119-
if ( ableplayer.settings.seek_interval ) {
120-
if ( ! el.hasAttribute( 'data-seek-interval' ) ) {
121-
el.setAttribute( 'data-seek-interval', ableplayer.settings.seek_interval );
120+
if ( ableplayer.settings.seek_interval ) {
121+
if ( ! el.hasAttribute( 'data-seek-interval' ) ) {
122+
el.setAttribute( 'data-seek-interval', ableplayer.settings.seek_interval );
123+
}
122124
}
123-
}
124-
if ( 'true' === ableplayer.settings.render_transcript ) {
125-
if ( ! el.hasAttribute( 'data-transcript-div' ) ) {
126-
let tracks = el.querySelectorAll( 'track' );
127-
if ( tracks.length > 0 ) {
128-
el.setAttribute( 'data-transcript-div', 'ableplayer-transcript-' + el.getAttribute( 'id' ) );
129-
let transcriptContainer = document.createElement( 'div' );
130-
transcriptContainer.setAttribute( 'id', 'ableplayer-transcript-' + el.getAttribute( 'id' ) );
131-
transcriptContainer.classList.add( 'ableplayer-transcript' );
132-
el.insertAdjacentElement( 'afterend', transcriptContainer );
125+
if ( 'true' === ableplayer.settings.render_transcript ) {
126+
if ( ! el.hasAttribute( 'data-transcript-div' ) ) {
127+
let tracks = el.querySelectorAll( 'track' );
128+
if ( tracks.length > 0 ) {
129+
el.setAttribute( 'data-transcript-div', 'ableplayer-transcript-' + el.getAttribute( 'id' ) );
130+
let transcriptContainer = document.createElement( 'div' );
131+
transcriptContainer.setAttribute( 'id', 'ableplayer-transcript-' + el.getAttribute( 'id' ) );
132+
transcriptContainer.classList.add( 'ableplayer-transcript' );
133+
el.insertAdjacentElement( 'afterend', transcriptContainer );
134+
}
133135
}
134136
}
135-
}
136-
});
137+
});
138+
}
137139
}

0 commit comments

Comments
 (0)