DingusCorp/doofonline
Private
Public Access
1
0
Issues Pull Requests 1 Projects Releases 1 Activity

WIP: The MuSiCaL Update #1

Draft
unfunny wants to merge 27 commits from music into master
pull from: music
merge into: DingusCorp:master
Conversation 0 Commits 27 Files Changed 50 +129 -88
5 changed files with 129 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit d91ed74c49 - Show all commits

133
Music/bgm.js
View File

@@ -1,9 +1,20 @@
//Based off of the one found at not_found.html but randomizes the songs
let song = "/Music/noway.mid"
let autoplaySupported = false;
let retryCount = 0;
let audioLoadFailed = false;
let consecutivefails = 0;
let audioCheckDone = false;
function SongRNG() {
document.addEventListener('DOMContentLoaded', function() {
document.addEventListener('error', function(e) {
if (e.target && e.target.src && e.target.src.includes('/Music/bgm/')) {
audioLoadFailed = true;
console.error('BGM: Failed to load audio file:', e.target.src);
}
}, true);
});
function SongRNG(reason = 'initial') {
//this is actually code from minima and its absolutely NOT made for this BUT WHO CARES????
let lines = ["AnotherMedium-Updated.mid", "CORE_.mid", "Death_by_Glamour.mid", "maniaStudiopolisZoneAct1.mid", "maniaStudiopolisZoneAct2.mid", "mk7_select_menu.mid", "Mpntbgm1.mid", "MPntBgk2.mid", "portal.mid", "SmashMenu.mid", "funni.mid", "utruins.mid"]
let titles = ["Another Medium", "CORE", "Death by Glamour", "Studiopolis Act 1 (Lights, Camera, Action!)", "Studiopolis Act 2", "Select a kart", "Creative Exersise", "Monkeys", "Still Alive", "Main Menu", "24 Hour Cinderella", "The Ruins"]
@@ -13,73 +24,95 @@ function SongRNG() {
// Display song title on page
try {
contentEl.textContent = titles[randint] + " - " + games[randint]
let contentEl = document.getElementById('bgm-title-content');
let titleEl = document.getElementById('bgm-title');
if (contentEl) {
contentEl.textContent = titles[randint] + " - " + games[randint];
} else if (titleEl) {
titleEl.textContent = titles[randint] + " - " + games[randint];
}
if (titleEl) titleEl.classList.add('visible');
} catch(e) {
// title element doesn't exist on this page
console.warn("BGM title display unavailable (element may not exist on this page)");
}
song = "/Music/bgm/" + lines[randint]
console.log('BGM: Now playing:', titles[randint], '-', games[randint], '(' + reason + ')');
song = "/Music/bgm/" + lines[randint];
MIDIjs.play(song, true);
}
function checkAudioContext() {
try {
if (window.AudioContext) {
let ctx = new window.AudioContext();
if (ctx.state === 'suspended') {
ctx.resume();
}
ctx.close();
} else if (window.webkitAudioContext) {
let ctx = new window.webkitAudioContext();
if (ctx.state === 'suspended') {
ctx.resume();
}
ctx.close();
if (audioLoadFailed) {
return false;
}
// Use MIDIjs to check actual audio status
const status = MIDIjs.get_audio_status();
if (status && status.audioMethod) {
// If we have an audio method, check if it's actually playing
if (status.playing) {
return true;
}
// Audio method exists but not playing - autoplay blocked
console.warn('BGM: Audio available but not playing (autoplay blocked)');
return false;
}
return true;
} catch(e) {
return false;
} catch(e) {
console.error('BGM: AudioContext check failed:', e);
return false;
}
}
function checkAudio() {
if (audioCheckDone) return;
try {
let apbox = document.getElementById("autoplay");
if (!apbox) {
return;
}
if (!checkAudioContext()) {
consecutivefails++;
if (consecutivefails >= 2) {
audioCheckDone = true;
console.warn('BGM: Autoplay blocked - showing modal');
apbox.innerHTML = '<p>Music is playing, but your autoplay is turned off.</p><noscript>JS is off, MIDIjs won\'t be able to play audio anyways.</noscript> <button onclick="MIDIjs.play(song, true); this.parentElement.style.display=\'none\';">Play Music</button>';
} else {
console.warn('BGM: Retry checkAudio in 3 seconds');
setTimeout(function(){
checkAudio();
}, 3000);
}
} else {
audioCheckDone = true;
console.log('BGM: Music is playing successfully');
apbox.innerHTML = '<div style="color: green;">✅ Music is playing!</div>';
apbox.style.display = 'none';
}
} catch(e) {
console.error('BGM: Error in checkAudio:', e);
}
}
function handlePlayingEvent(event) {
if (event.status === 'playing' || event.time !== undefined) {
// Music is actively playing
try {
let apbox = document.getElementById("autoplay");
if (apbox) {
apbox.innerHTML = '<div style="color: green;">✅ Music is playing!</div>';
apbox.style.display = 'none';
}
} catch(e) {}
} else {
// Check if we can play
if (!checkAudioContext()) {
retryCount++;
if (retryCount >= 2) {
try {
let apbox = document.getElementById("autoplay");
if (apbox) {
apbox.innerHTML = '<div style="color: orange;">⚠️ Autoplay blocked by browser. Click to play.</div><button onclick="MIDIjs.play(song, true)">Play Music</button>';
}
} catch(e) {}
} else {
setTimeout(checkAudio, 5000);
}
}
// Music is actively playing - checkAudio will handle showing success
}
// Schedule next song change
setTimeout(function() {
SongRNG();
MIDIjs.play(song, true);
}, 30000);
}
SongRNG();
SongRNG('initial');
let isPlaying = false;
console.log('BGM: Initializing...');
autoplaySupported = checkAudioContext();
MIDIjs.play(song, true);
setTimeout(function(){
checkAudio();
}, 3000);
MIDIjs.player_callback = function(event) {
handlePlayingEvent(event);

1
compat.js
View File

@@ -1,3 +1,4 @@
// THIS SHOULD NOT BE LOADED - Legacy redirect script, remove from all pages
function isMyAppUA(testUA)
{
if(testUA == undefined) return false;

2
index.html
View File

@@ -47,7 +47,7 @@
<script>NekoType="black"</script>
<h1 id=nl><script src="https://webneko.net/n20171213.js"></script><a
href="https://webneko.net"></a></h1>
<a href="javascript("history.back();")"><img src=/WebTV.gif alt="WebTV City"></a>
<a href="javascript:history.back();"><img src=/WebTV.gif alt="WebTV City"></a>
</header>

9
test-bgm.html
View File

@@ -36,8 +36,15 @@
<!-- BGM.js loads after MIDI.js and will add .visible class when text is set -->
<script src="/Music/bgm.js"></script>
<!-- Change song every 30 seconds -->
<script>
setInterval(function() {
SongRNG('30 second interval');
}, 30000);
</script>
<footer>
<p><small>Auto-refreshes every 30 seconds to simulate new song</small></p>
<p><small>Auto-changes song every 30 seconds (inline script)</small></p>
<p><small>Click refresh to stop auto-refresh</small></p>
</footer>
</body>

72
test-debug.html
View File

@@ -40,42 +40,6 @@
<div id="css-check"></div>
</div>
<!-- Song title display element -->
<div id="bgm-title">Loading...</div>
<!-- Load MIDI.js first -->
<script>
debugOutput('Loading MIDI.js...');
</script>
<script type='text/javascript' src='//www.midijs.net/lib/midi.js'></script>
<!-- Show title visibility script -->
<script>
debugOutput('Running visibility script...');
var titleEl = document.getElementById('bgm-title');
if (titleEl) {
titleEl.classList.add('visible');
debugOutput('Added .visible class to #bgm-title');
} else {
debugOutput('ERROR: #bgm-title element not found!', 'error');
}
</script>
<!-- Load BGM.js after MIDI.js -->
<script>
debugOutput('Loading BGM.js...');
</script>
<script src="/Music/bgm.js"></script>
<!-- Final check -->
<script>
setTimeout(function() {
debugOutput('Final check after 2 seconds...');
checkDOM();
checkCSS();
}, 2000);
</script>
<script>
function debugOutput(msg, type) {
var output = document.getElementById('debug-output');
@@ -133,6 +97,42 @@
}
</script>
<!-- Song title display element -->
<div id="bgm-title">Loading...</div>
<!-- Load MIDI.js first -->
<script>
debugOutput('Loading MIDI.js...');
</script>
<script type='text/javascript' src='//www.midijs.net/lib/midi.js'></script>
<!-- Show title visibility script -->
<script>
debugOutput('Running visibility script...');
var titleEl = document.getElementById('bgm-title');
if (titleEl) {
titleEl.classList.add('visible');
debugOutput('Added .visible class to #bgm-title');
} else {
debugOutput('ERROR: #bgm-title element not found!', 'error');
}
</script>
<!-- Load BGM.js after MIDI.js -->
<script>
debugOutput('Loading BGM.js...');
</script>
<script src="/Music/bgm.js"></script>
<!-- Final check -->
<script>
setTimeout(function() {
debugOutput('Final check after 2 seconds...');
checkDOM();
checkCSS();
}, 2000);
</script>
<div class="debug">
<h2>Instructions</h2>
<p>1. Check the "Debug Console" above for loading messages</p>