add a placeholder if loader doesnt load and hide player until needed

This commit is contained in:
TheWiiArchivist wmt 2025-08-14 21:58:09 -05:00
parent 6b10a19557
commit 463deb0779
13 changed files with 17 additions and 18 deletions

View File

@ -11,7 +11,7 @@
<script src="meta/loader.js"></script>
</head>
<body>
<div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div>
<div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div>
<img src="/media/branding-bag-no-bg.png" loading="lazy" width="150px">
<h1 style="color:#ff3d3d;">404 Page Not Found</h1>

View File

@ -19,7 +19,7 @@
<style>mark {color:white} img.wm {width: 100%;vertical-align: middle;} div.wm {padding:20px;border-radius:5px;margin-top:10px;}</style>
</head>
<body >
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();" style="display:none;"><div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<h1><a href="/">WiiMart</a></h1>

View File

@ -27,7 +27,7 @@
</style>
</head>
<body>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();" style="display:none;"><div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<h1><a href="/">WiiMart</a></h1>

View File

@ -20,7 +20,7 @@
<style>input {margin-bottom: 15px;} #results {display:none;border-color:red;text-align:left} #results h2 {color:#FF0000;} #results p {color:#FF0000}</style>
</head>
<body>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();" style="display:none;"><div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<h1><a href="/">WiiMart</a></h1>

View File

@ -35,7 +35,7 @@
</head>
<body onload="FishieMartWednesday();">
<!-- bug: position:fixed/absolute not relative dont work for some reason.. -->
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable aqua fishplay in your browser for it to continue playing throughout the ocean."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable aqua fishplay in your browser for it to continue playing throughout the ocean."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<a id="fishietitle" href="javascript:easter1();" onclick="spinner = false;" title="Click to return to the frontpage.">FishieMart</a>
<script>var fishtitle = document.getElementById("fishietitle"); var fishscr1 = new Audio("/media/sound-fishie-scream1.wav"); var fishscr2 = new Audio("/media/sound-fishie-scream2.wav"); var fishscr3 = new Audio("/media/sound-fishie-scream3.wav"); function easter1(){fishscr1.play(); fishtitle.href="javascript:easter2();"; fishtitle.style.color="#ff9d1e";} function easter2(){fishscr2.play(); fishtitle.href="javascript:easter3();"; fishtitle.style.color="#e66f00";} function easter3(){setTimeout(function(){location.href= "../"; document.body.style.filter="blur(0px)";},480); fishscr3.play(); fishtitle.style.color="#db7012"; document.body.style.transition=".5s ease-in-out"; document.body.style.filter="blur(3px)"; } </script>

View File

@ -21,9 +21,9 @@
</head>
<body onload="WiiMartWednesday(); loadafterwednesdaycheck();">
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();" style="display:none;"><div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<h1>WiiMart</h1>
<h1>WiiMart</h1><a href="#">test</a>
<nav><a href="install" class="btn">Install</a> <a href="support" class="btn">Support</a> <a href="errors" class="btn">Errors</a> <a href="branding" class="btn">Branding</a> <a href="specials" class="btn">Specials</a> <a href="credits" class="btn">Credits</a></nav>
<script>function WiiMartWednesday() {const today = new Date(); const dayOfWeek = today.getDay();if (dayOfWeek === 3) {const wednesdayDiv = document.getElementById('wednesdaytitles'); if (wednesdayDiv) {wednesdayDiv.style.display = 'block';} }}; function whatiswmw() {const wswbox = document.getElementById("whatiswsw"); const bg = document.getElementById("backgroundd"); wswbox.style.display="block"; bg.style.display="block"; bg.style.backgroundImage=('url("/meta/fadebg-wmw.png")'); } function whatiswmwclose() { const wswbox = document.getElementById("whatiswsw"); const bg = document.getElementById("backgroundd"); wswbox.style.display="none"; bg.style.display="none";}</script>

View File

@ -18,7 +18,7 @@
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();" style="display:none;"><div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<nav style="margin-bottom:0"><a href="/" class="btn">Back to WiiMart.org</a></nav>

View File

@ -31,7 +31,7 @@
</style>
</head>
<body>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div></div>
<h1><a href="/">WiiMart</a></h1>

View File

@ -1,7 +1,6 @@
var loading = new Audio(""); var loadvolume; var browserageworkswithloader = false; var spinner = true; var shouldaloadedalr = null; var playsound = null;
function showspinner() {
if (spinner === true) {
loading = new Audio("/media/load.wav");
document.getElementById("wscspinnerbg").style.display="block";
if (shouldaloadedalr) {clearTimeout(shouldaloadedalr);}
@ -11,6 +10,7 @@ if (spinner === true) {
if (playsound) {clearTimeout(playsound);}
/* moved down for compatability */
loading = new Audio("/media/load.wav");
loading.loop = true;
loading.play(); loading.currentTime=0; loadvolume = 0.01; loading.volume = loadvolume;
loadup();
@ -24,6 +24,7 @@ loading.pause();
}
}
function loadrimg() {document.getElementById("wscspinner").style.outline="none"; document.getElementById("wscspinner").alt="spinr";}
function loadup() {
if (loadvolume > 0) {

View File

@ -84,8 +84,8 @@ img.right {right: 10px; animation: rightHoverAnimation 0.5s infinite alternate;}
/* loading spinner */
/* add onclick="spinner = false;" if you would like to skip the loader on a <a> element. (good for downloads) */
#wscspinnerbg {position:fixed; z-index:1005; top:0px; left:0px; width:100%; height:100%;}
#wscspinner {z-index:1004;position:absolute;top:0px;left:0px; width:95px; height:95px; animation: spinner 1s linear infinite;}
#wscspinnerbg {position:fixed; z-index:1005; top:0px; left:0px; width:100%; height:100%; }
#wscspinner {z-index:1004;position:absolute;top:0px;left:0px; width:95px; height:95px; animation: spinner 1s linear infinite; /* fallback if loaderimg takes a minute to load */ filter:drop-shadow(1px 1px 3px #b9b9b950); outline:2px dotted #c9c9c9ec; border-radius:90px;}
#wscspinnershadow {z-index:1004;position:absolute;top:7px;left:9px; width:95px; height:95px; opacity:30%; animation: spinner 1s linear infinite;}
@keyframes spinner {from {transform: rotate(0deg)}to {transform: rotate(343deg)};}

View File

@ -16,7 +16,6 @@ var initialvolume = 0 || 0.0;
function bgmaudioloader() { if (!shoploop) {shoploop = new Audio("/meta/shop.wav"); shoploop.loop = true; shoploop.volume = initialvolume;} return shoploop;}
/* what idk, only for index.html */
function loadafterwednesdaycheck() {
@ -24,7 +23,7 @@ setTimeout(wednesdayyeeeee,100);
}
function wednesdayyeeeee() {
hideConsoleControls();
document.getElementById('bgmplayer').style.display="block";
if (savedTime) {
shoploop = bgmaudioloader();
shoploop.currentTime = parseFloat(savedTime);
@ -66,7 +65,7 @@ shoploop = bgmaudioloader(); localStorage.setItem("bgmlooppoint", shoploop.curr
function allpagesonload() {
if (bgmplayercompatable === true) {
document.getElementById('bgmplayer').style.display="block";
var wmtwebsiteBGMwasplaying = localStorage.getItem("wmtwebsiteBGM");
if (wmtwebsiteBGMwasplaying === 'playing') {
@ -86,7 +85,6 @@ if (wmtwebsiteBGMwasplaying === 'paused') {
}
/* bgm check for all pages */
function activatebgmplayerfocus() {
bgmplayerfocus();
document.getElementById('bgmplayer').classList.add('bgmplayeropenanim');

View File

@ -20,7 +20,7 @@
<style>input {margin-bottom: 15px;max-width:50px} ul {text-align:left} li a {text-decoration:none} </style>
</head>
<body>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();" style="display:none;"><div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<h1><a href="/">WiiMart</a></h1>

View File

@ -26,7 +26,7 @@
</style>
</head>
<body >
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="spin"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s"></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();"> <div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<div id="backgroundd" style="display:none;"></div><div id="wscspinnerbg" style="display:none;"><div id="wscspinnerbg" style="display:none;"><img id="wscspinner" src="/meta/grey-loader.png" alt="loadin" loading="lazy" onload="loadrimg();"><img id="wscspinnershadow" src="/meta/grey-loader.png" alt="s" loading="lazy"></div></div><div class="box" id="bgmplayer" onclick="activatebgmplayer();" style="display:none;"><div id="bgmplayerBG"></div> <div id="mainplayer"><p id="bgmplrtitle">bgm plr..</p><a href="javascript:playBGM();" onclick="spinner = false;" id="shopbgmselector" title="Enable audio autoplay in your browser for it to continue playing throughout the website."><button id="shopbgm">....</button></a><a href="javascript:deactivatebgmplayer();" onclick="spinner = false;"><button>Close</button></a></div> </div>
<h1><a href="/">WiiMart</a></h1>