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