1const iframe = document.getElementById("content-iframe");
  2const music = document.getElementById("music");
  3const source = document.getElementById("music-source");
  4const music_base = document.getElementById("music-player-base");
  5const music_song = document.getElementById("music-player-song");
  6const music_song_text = document.getElementById("song-text");
  7const clickAudio1 = new Audio(url="res/sfx/os/click2.ogg");
  8const clickAudio2 = new Audio(url="res/sfx/os/click1.ogg");
  9
 10const tracks = {
 11    "awesome": {
 12        file_name: "AwesomeRapBeat.opus",
 13        track_name: "Awesome Rap Beat",
 14        track_author: "Jay Tholen",
 15        track_from: "Hypnospace Outlaw Original Soundtrack, Vol. 2"
 16    },
 17    "dream": {
 18        file_name: "WeFellIntoaDream.opus",
 19        track_name: "We Fell Into a Dream",
 20        track_author: "Jay Tholen",
 21        track_from: "Hypnospace Outlaw Original Soundtrack, Vol. 2"
 22    },
 23    "earmint": {
 24        file_name: "Earmint.opus",
 25        track_name: "Earmint",
 26        track_author: "Jay Tholen",
 27        track_from: "Hypnospace Outlaw Original Soundtrack, Vol. 2"
 28    },
 29    "forest": {
 30        file_name: "ForestFeast.opus",
 31        track_name: "Forest Feast",
 32        track_author: "Jay Tholen",
 33        track_from: "Hypnospace Outlaw Original Soundtrack, Vol. 2"
 34    },
 35    "gtrock": {
 36        file_name: "GoodtimeRock.opus",
 37        track_name: "Goodtime Rock",
 38        track_author: "Jay Tholen",
 39        track_from: "Hypnospace Outlaw Original Soundtrack, Vol. 2"
 40    },
 41    "katie": {
 42        file_name: "KatiesKuddlyKatKorner.opus",
 43        track_name: "Katie's Kuddly Kat Korner",
 44        track_author: "Jay Tholen",
 45        track_from: "Hypnospace Outlaw Original Soundtrack, Vol. 2"
 46    },
 47}
 48
 49const page_tracks = {
 50    "about": "awesome",
 51    "anime": "dream",
 52    "dragonquest": "forest",
 53    "earthbound": "gtrock",
 54    "gf": "katie",
 55    "indies": "earmint",
 56    "zelda": "forest",
 57}
 58
 59let first = false;
 60let play = false;
 61let currentPage = "about";
 62let currentTrack = "";
 63let showTimeout, hideTimeout;
 64
 65function playAudio(audio){
 66    audio.volume = 0.1;
 67    audio.currentTime = 0;
 68    audio.play();
 69}
 70
 71function firstClickPlay(element) {
 72    click1 = clickAudio1 || parent.clickAudio1;
 73    click2 = clickAudio2 || parent.clickAudio2;
 74
 75    playAudio(click1)
 76    element.onmousedown = () => playAudio(click1);
 77    element.onmouseup = () => playAudio(click2);
 78
 79    if(first) return;
 80    document.getElementById("music-player").style.bottom = "0";
 81    music.volume = 0.1;
 82    playPause(false, page_tracks[currentPage]);
 83    first = true;
 84}
 85
 86function goToPage(page) {
 87    if(currentPage == page)
 88        return
 89    iframe.src = "pages/" + page + ".html";
 90    playPause(!play, page_tracks[page])
 91    currentPage = page;
 92}
 93
 94function formatTrack(track) {
 95    return `${track.track_author} - ${track.track_name} (${track.track_from})`;
 96}
 97
 98function showTitle(){
 99    if (!currentTrack) return;
100    hideTitle();
101    clearTimeout(showTimeout);
102    clearTimeout(hideTimeout);
103    
104    showTimeout = setTimeout(() => { 
105        music_song_text.textContent = formatTrack(tracks[currentTrack]);
106        music_song.style.top = "0";
107    }, 400);
108
109    hideTimeout = setTimeout(() => hideTitle(), 3_400);
110}
111
112function hideTitle(){
113    music_song.style.top = "100%";
114}
115
116function playPause(toggle=play, track=currentTrack) {
117
118    if (toggle){
119        music_base.classList.remove("player-play");
120        music.pause();
121        play = false
122        hideTitle();
123    }
124    else {
125        music_base.classList.add("player-play");
126        if (track != currentTrack) {
127            currentTrack = track;
128            source.src = "res/mus/" + tracks[currentTrack].file_name;
129            music.load();
130        }
131        music.play().catch(() => {});
132        showTitle();
133        play = true
134    }
135}