@@ -14,9 +14,7 @@ class YTEmbed extends HTMLElement {
1414 this . initFromV ( ) ;
1515 }
1616 attributeChangedCallback ( name , oldValue , newValue ) {
17- if ( name === 'v' && oldValue !== newValue ) {
18- this . initFromV ( ) ;
19- }
17+ if ( name === 'v' && oldValue !== newValue ) { this . initFromV ( ) ; }
2018 }
2119 isPlaylistID ( id ) {
2220 return id . length > 11 && ( id . startsWith ( 'PL' ) || id . startsWith ( 'TL' ) || id . startsWith ( 'OL' ) || id . startsWith ( 'FL' ) || id . startsWith ( 'UU' ) ) ;
@@ -110,12 +108,8 @@ class YTEmbed extends HTMLElement {
110108 const article = this . closest ( 'article' ) ;
111109 const section = this . closest ( 'section' ) ;
112110 let path = '/' ;
113- if ( article ) {
114- path += article . id ;
115- if ( section ) {
116- path += `/${ section . id } ` ;
117- }
118- }
111+ if ( article ) { path += article . id ;
112+ if ( section ) { path += `/${ section . id } ` ; } }
119113 this . setAttribute ( 'data-video-path' , path ) ;
120114 this . createRemoteControl ( ) ;
121115 this . setupViewportCheck ( ) ;
@@ -130,25 +124,8 @@ class YTEmbed extends HTMLElement {
130124 }
131125 }
132126 closeOtherVideos ( ) {
133- const playingVideos = document . querySelectorAll ( 'y-t[data-now-playing]' ) ;
134- playingVideos . forEach ( video => {
135- if ( video !== this ) {
136- const button = video . querySelector ( 'button.showHideButton' ) ;
137- if ( button && button . textContent === '⏹️ Stop' ) {
138- video . removeAttribute ( 'data-now-playing' ) ;
139- video . removeAttribute ( 'data-video-path' ) ;
140- const wrapper = video . querySelector ( '.yt-wrapper' ) ;
141- if ( wrapper ) {
142- const iframe = wrapper . querySelector ( 'iframe' ) ;
143- if ( iframe ) {
144- wrapper . removeChild ( iframe ) ;
145- }
146- wrapper . style . display = 'none' ;
147- }
148- button . textContent = '▶️ Play' ;
149- button . title = 'Play Video' ;
150- }
151- }
127+ document . querySelectorAll ( 'y-t[data-now-playing]' ) . forEach ( video => {
128+ if ( video !== this ) video . button . click ( ) ;
152129 } ) ;
153130 }
154131 createRemoteControl ( ) {
@@ -191,10 +168,7 @@ class YTEmbed extends HTMLElement {
191168 const linkToVideo = document . createElement ( 'a' ) ;
192169 linkToVideo . textContent = 'Go to video' ;
193170 linkToVideo . style . display = 'block' ;
194- linkToVideo . onclick = ( e ) => {
195- e . preventDefault ( ) ;
196- this . navigateToNowPlaying ( ) ;
197- } ;
171+ linkToVideo . onclick = ( e ) => { e . preventDefault ( ) ; this . navigateToNowPlaying ( ) ; } ;
198172 this . updateNowPlayingLink ( linkToVideo ) ;
199173 remoteControl . appendChild ( stopButton ) ;
200174 remoteControl . appendChild ( linkToVideo ) ;
@@ -205,25 +179,13 @@ class YTEmbed extends HTMLElement {
205179 const expandIcon = document . getElementById ( 'expand-icon' ) ;
206180 const nowPlayingText = document . getElementById ( 'now-playing-text' ) ;
207181 if ( this . isOutOfViewport ( ) ) {
208- if ( remoteControl ) {
209- remoteControl . style . display = 'none' ;
210- }
211- if ( expandIcon ) {
212- expandIcon . style . display = 'block' ;
213- }
214- if ( nowPlayingText ) {
215- nowPlayingText . style . display = 'block' ;
216- }
182+ if ( remoteControl ) { remoteControl . style . display = 'none' ; }
183+ if ( expandIcon ) { expandIcon . style . display = 'block' ; }
184+ if ( nowPlayingText ) { nowPlayingText . style . display = 'block' ; }
217185 } else {
218- if ( remoteControl ) {
219- remoteControl . style . display = 'none' ;
220- }
221- if ( expandIcon ) {
222- expandIcon . style . display = 'none' ;
223- }
224- if ( nowPlayingText ) {
225- nowPlayingText . style . display = 'none' ;
226- }
186+ if ( remoteControl ) { remoteControl . style . display = 'none' ; }
187+ if ( expandIcon ) { expandIcon . style . display = 'none' ; }
188+ if ( nowPlayingText ) { nowPlayingText . style . display = 'none' ; }
227189 }
228190 }
229191 setupViewportCheck ( ) {
@@ -232,18 +194,11 @@ class YTEmbed extends HTMLElement {
232194 }
233195 isOutOfViewport ( ) {
234196 const rect = this . getBoundingClientRect ( ) ;
235- return (
236- rect . bottom <= 0 ||
237- rect . right <= 0 ||
238- rect . left >= window . innerWidth ||
239- rect . top >= window . innerHeight
240- ) ;
197+ return ( rect . bottom <= 0 || rect . right <= 0 || rect . left >= window . innerWidth || rect . top >= window . innerHeight ) ;
241198 }
242199 updateNowPlayingLink ( linkElement ) {
243200 const path = this . getAttribute ( 'data-video-path' ) ;
244- if ( path ) {
245- linkElement . href = `${ path } #now-playing` ;
246- }
201+ if ( path ) { linkElement . href = `${ path } #now-playing` ; }
247202 }
248203 navigateToNowPlaying ( ) {
249204 const nowPlaying = document . querySelector ( 'y-t[data-now-playing]' ) ;
@@ -263,23 +218,18 @@ class YTEmbed extends HTMLElement {
263218 }
264219 removeRemoteControl ( ) {
265220 const remoteControl = document . getElementById ( 'remote-control' ) ;
266- if ( remoteControl ) {
267- document . body . removeChild ( remoteControl ) ;
268- }
221+ if ( remoteControl ) { document . body . removeChild ( remoteControl ) ; }
269222 const expandIcon = document . getElementById ( 'expand-icon' ) ;
270- if ( expandIcon ) {
271- document . body . removeChild ( expandIcon ) ;
272- }
223+ if ( expandIcon ) { document . body . removeChild ( expandIcon ) ; }
273224 const nowPlayingText = document . getElementById ( 'now-playing-text' ) ;
274- if ( nowPlayingText ) {
275- document . body . removeChild ( nowPlayingText ) ;
276- }
225+ if ( nowPlayingText ) { document . body . removeChild ( nowPlayingText ) ; }
277226 this . removeEventListeners ( )
278227 }
279228}
280229customElements . define ( 'y-t' , YTEmbed ) ;
230+
281231const shuffleDiv = document . getElementById ( 'shuffle' ) ;
282- const elements = [ ...shuffleDiv . querySelectorAll ( 'y-t' ) ] ;
232+ const shuffleDivElements = [ ...shuffleDiv . querySelectorAll ( 'y-t' ) ] ;
283233let combinedElements = [ ] ;
284234let elementIdsMap = new Map ( ) ;
285235function processAndCombine ( element , index ) {
@@ -292,8 +242,8 @@ function processAndCombine(element, index) {
292242 const shuffledArray = shuffle ( elementIds , 150 ) ;
293243 element . setAttribute ( 'v' , shuffledArray . join ( ',' ) ) ;
294244 processedElements . add ( index ) ;
295- if ( index < elements . length - 1 ) {
296- processAndCombine ( elements [ index + 1 ] , index + 1 ) ;
245+ if ( index < shuffleDivElements . length - 1 ) {
246+ processAndCombine ( shuffleDivElements [ index + 1 ] , index + 1 ) ;
297247 }
298248 else {
299249 const combo = document . getElementById ( 'combined-list' ) ;
@@ -302,21 +252,21 @@ function processAndCombine(element, index) {
302252 }
303253}
304254let processedElements = new Set ( ) ;
305- processAndCombine ( elements [ 0 ] , 0 ) ;
255+ processAndCombine ( shuffleDivElements [ 0 ] , 0 ) ;
306256function shuffleAndDraw ( ) {
307- shuffle ( elements ) ;
257+ shuffle ( shuffleDivElements ) ;
308258 let currentIndex = 0 ;
309- let draw = document . getElementById ( 'draw ' ) ;
310- const clonedElement = elements [ currentIndex ] . cloneNode ( false ) ;
259+ let deck = document . getElementById ( 'deck ' ) ;
260+ const clonedElement = shuffleDivElements [ currentIndex ] . cloneNode ( false ) ;
311261 processAndCombine ( clonedElement , currentIndex ) ;
312- draw . appendChild ( clonedElement ) ;
262+ deck . appendChild ( clonedElement ) ;
313263 let next = document . querySelector ( "#next" ) ;
314264 next . addEventListener ( 'click' , function ( ) {
315- currentIndex = ( currentIndex + 1 ) % elements . length ;
316- draw . innerHTML = '' ;
317- const clonedElement = elements [ currentIndex ] . cloneNode ( false ) ;
265+ currentIndex = ( currentIndex + 1 ) % shuffleDivElements . length ;
266+ deck . innerHTML = '' ;
267+ const clonedElement = shuffleDivElements [ currentIndex ] . cloneNode ( false ) ;
318268 processAndCombine ( clonedElement , currentIndex ) ;
319- draw . appendChild ( clonedElement ) ;
269+ deck . appendChild ( clonedElement ) ;
320270 } ) ;
321271}
322- shuffleAndDraw ( ) ;
272+ shuffleAndDraw ( ) ;
0 commit comments