Personal Site
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Remove random console logs and make it so the popup updates at the same time as the album art. Like A Sane Person Would Do

+23 -21
+23 -21
src/components/home/playing/NowPlaying.astro
··· 92 92 // flatmap flattens the returned array into the new map 93 93 .flatMap((x, i) => (i === 0 ? x : [", ", x])) 94 94 ) : ( 95 - // artist defined by default because 95 + // artist defined by default because 96 96 // i cant be bothered to do client error handling 97 97 // and this is easier 98 98 <a href="#">Artist Name</a> ··· 513 513 ); 514 514 const addArtists = playing.artists.slice(artistLen); 515 515 516 - console.log(replaceArtists, addArtists); 517 - 518 516 let lastValidArtist = elIs( 519 517 this.elements.artists.children[0], 520 518 HTMLElement, ··· 633 631 const ev = new EventSource("/now-playing-sse"); 634 632 635 633 // close event source safely 636 - window.addEventListener("beforeunload", () => ev.close()) 634 + window.addEventListener("beforeunload", () => ev.close()); 637 635 638 636 let i = -1; 639 637 ev.addEventListener("playing", (event) => { ··· 648 646 if (!isNowPlaying(data)) 649 647 return console.warn("Unexpected package from server:", data, event.data); 650 648 649 + // data is valid nowPlayingData 651 650 try { 652 - // data is valid nowPlayingData 653 - // first call so assume prev is in an invalid state (which it is) 654 - if (i === 0) console.log("SKIP: i = 0"); 655 - // if both are null, quit since re-rendering is pointless 656 - else if (data == prev) console.log("MATCH: null = null"); 657 - // now if both are valid play items, so check the ID for equality 658 - else if (data !== null && prev !== null && data.id === prev.id) 659 - console.log("MATCH: nowPlaying = nowPlaying"); 660 - else { 661 - console.log("DIFFERENT"); 651 + if ( 652 + !( 653 + // first call so assume prev is in an invalid state (which it is) 654 + ( 655 + i === 0 || 656 + // if both are null, quit since re-rendering is pointless 657 + data == prev || 658 + // now if both are valid play items, so check the ID for equality 659 + (data !== null && prev !== null && data.id === prev.id) 660 + ) 661 + ) 662 + ) { 662 663 // there is now a difference between the previous setting and the new setting 663 664 // so it is worth updating the UI 664 - 665 - if (data) elements.nowPlaying.updateMetadata(data); 666 - else elements.nowPlaying.nothingPlaying(); 667 665 668 666 // spinner head animation: 669 667 // 1. pause current animation. ··· 682 680 ? data?.album.images[0].url 683 681 : "https://undefined"; 684 682 685 - // 5. reset the position of the infinite animation 683 + // 5. update popup 684 + if (data) elements.nowPlaying.updateMetadata(data); 685 + else elements.nowPlaying.nothingPlaying(); 686 + 687 + // 6. reset the position of the infinite animation 686 688 animations.forEach((anim) => (anim.currentTime = 0)); 687 689 688 - // 6. if new track is not null then, after 2s 690 + // 7. if new track is not null then, after 2s 689 691 if (data) 690 692 setTimeout(() => { 691 - // 7. resume the infinite animation 693 + // 8. resume the infinite animation 692 694 animations.forEach((anim) => anim.play()); 693 695 }, 2000); 694 696 695 - // 8. make sure the record is in the right state (playing or paused) 697 + // 9. make sure the record is in the right state (playing or paused) 696 698 elements.player.dataset.playing = data ? "true" : "false"; 697 699 }), 698 700 );