Re-add loading screen

This commit is contained in:
Foxster
2023-12-26 13:22:48 -08:00
parent 8674b16277
commit ea71ed7606
6 changed files with 35 additions and 12 deletions

View File

@@ -42,6 +42,7 @@ export function main(callback, fallbackURL = "../../") {
setApps(json.apps); setApps(json.apps);
// main(json); // main(json);
callback(json); callback(json);
loaded();
waitForAllImagesToLoad(); waitForAllImagesToLoad();
}) })
.catch(error => { .catch(error => {
@@ -57,7 +58,7 @@ export function main(callback, fallbackURL = "../../") {
// New img element that won't be rendered to the DOM // New img element that won't be rendered to the DOM
var newImage = document.createElement("img"); var newImage = document.createElement("img");
// Attach load listener // Attach load listener
newImage.addEventListener("load", loaded); // newImage.addEventListener("load", imageLoaded);
// Set src // Set src
newImage.src = image.src; newImage.src = image.src;
@@ -66,15 +67,17 @@ export function main(callback, fallbackURL = "../../") {
if (event.target.id == "app-icon") { if (event.target.id == "app-icon") {
event.target.src = `${fallbackURL}common/assets/img/generic_app.jpeg`; event.target.src = `${fallbackURL}common/assets/img/generic_app.jpeg`;
} else event.target.remove() } else event.target.remove()
// loaded(); // imageLoaded();
}); });
}); });
function imageLoaded() {
if (++count == allImages.length) loaded();
}
}
function loaded() { function loaded() {
if (++count == allImages.length) {
document.querySelector("body").classList.remove("loading"); document.querySelector("body").classList.remove("loading");
document.getElementById("loading").remove(); document.getElementById("loading")?.remove();
}
}
} }
} }

View File

@@ -15,7 +15,11 @@
<link rel="stylesheet" href="../../common/style.css"> <link rel="stylesheet" href="../../common/style.css">
<link rel="stylesheet" href="all-apps.css"> <link rel="stylesheet" href="all-apps.css">
</head> </head>
<body> <body class="loading">
<div id="loading">
<img src="../../common/assets/img/loading.gif" alt="loading">
<p>Loading</p>
</div>
<!-- Add to AltStore banner & navigation bar --> <!-- Add to AltStore banner & navigation bar -->
<div id="top"></div> <div id="top"></div>
<div id="main"> <div id="main">

View File

@@ -15,7 +15,11 @@
<link rel="stylesheet" href="../../common/style.css"> <link rel="stylesheet" href="../../common/style.css">
<link rel="stylesheet" href="app.css"> <link rel="stylesheet" href="app.css">
</head> </head>
<body> <body class="loading">
<div id="loading">
<img src="../../common/assets/img/loading.gif" alt="loading">
<p>Loading</p>
</div>
<div id="top"> <div id="top">
<!-- Navigation bar --> <!-- Navigation bar -->
<div id="nav-bar"> <div id="nav-bar">

View File

@@ -15,7 +15,11 @@
<link rel="stylesheet" href="../../../common/style.css"> <link rel="stylesheet" href="../../../common/style.css">
<link rel="stylesheet" href="version-history.css"> <link rel="stylesheet" href="version-history.css">
</head> </head>
<body> <body class="loading">
<div id="loading">
<img src="../../../common/assets/img/loading.gif" alt="loading">
<p>Loading</p>
</div>
<!-- Add to AltStore banner & navigation bar --> <!-- Add to AltStore banner & navigation bar -->
<div id="top"></div> <div id="top"></div>
<div id="main"> <div id="main">

View File

@@ -14,7 +14,11 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../common/style.css"> <link rel="stylesheet" href="../common/style.css">
</head> </head>
<body> <body class="loading">
<div id="loading">
<img src="../common/assets/img/loading.gif" alt="loading">
<p>Loading</p>
</div>
<!-- Add to AltStore banner --> <!-- Add to AltStore banner -->
<div id="top"> <div id="top">
<div id="nav-bar" class="hide-border"> <div id="nav-bar" class="hide-border">

View File

@@ -15,7 +15,11 @@
<link rel="stylesheet" href="../../common/style.css"> <link rel="stylesheet" href="../../common/style.css">
<link rel="stylesheet" href="news.css"> <link rel="stylesheet" href="news.css">
</head> </head>
<body> <body class="loading">
<div id="loading">
<img src="../../common/assets/img/loading.gif" alt="loading">
<p>Loading</p>
</div>
<!-- Add to AltStore banner & navigation bar --> <!-- Add to AltStore banner & navigation bar -->
<div id="top"></div> <div id="top"></div>
<div id="main"> <div id="main">