diff --git a/data/navBarData.json b/data/navBar.json
similarity index 76%
rename from data/navBarData.json
rename to data/navBar.json
index c241268..95fb815 100644
--- a/data/navBarData.json
+++ b/data/navBar.json
@@ -15,12 +15,14 @@
"actionValue": "https://github.com/ByteDice"
},
{
- "icon": "powerplates_8x8.png"
+ "icon": "powerplates_8x8.png",
+ "action": "navigate",
+ "actionValue": "/powerplates"
},
{
"icon": "pauseAnimation_8x8.png",
"action": "function",
- "actionValue": "https://discord.com",
+ "actionValue": "pauseAnimBtn('auto')",
"iconId": "animationToggle"
}
]
\ No newline at end of file
diff --git a/global/globalScript.js b/global/globalScript.js
index fb5fc35..570200b 100644
--- a/global/globalScript.js
+++ b/global/globalScript.js
@@ -92,11 +92,11 @@ function pauseAnimBtn(state) {
if (state == "true") {
isAnimating = true
- pauseBtn.src = "./assets/icons/pauseAnimation_8x8.png"
+ pauseBtn.src = "/assets/icons/pauseAnimation_8x8.png"
}
else {
isAnimating = false
- pauseBtn.src = "./assets/icons/playAnimation_8x8.png"
+ pauseBtn.src = "/assets/icons/playAnimation_8x8.png"
}
localStorage["isAnimating"] = state
@@ -119,6 +119,10 @@ document.addEventListener("DOMContentLoaded", async function() {
if (densityWidth > densityHeight) { console.log("pxDensity Direction: Width, " + densityWidth) }
else { console.log("pxDensity Direction: Height, " + densityHeight) }
+ setLoadingProgress("adding navBar...")
+ await loadNavBarJson()
+ onLoadNavBar()
+
switch (CURRENT_PAGE) {
case (PAGES.SYNTHWAVE): loadingScreenSynthwave()
}
diff --git a/global/loadingScreen.js b/global/loadingScreen.js
index 38948f6..039bdf7 100644
--- a/global/loadingScreen.js
+++ b/global/loadingScreen.js
@@ -1,14 +1,27 @@
let isLoading = true
let stopLoading = false
-let loadingScreenProgress = document.getElementById("loadingText")
let loadingScreenEl = document.getElementById("loadingScreen")
+loadingScreenEl.className = "bgDiv"
+loadingScreenEl.innerHTML = `
+ 
+
+
+
+ Loading...
Loading files...
Tip: Tip loading...
+`
+
+
+let loadingScreenProgress = document.getElementById("loadingText")
+
let tipsJson
async function loadTips() {
- let tipsText = await fetch("./data/loadingScreenTips.json").then(response => response.text())
+ let tipsText = await fetch("/data/loadingScreenTips.json").then(response => response.text())
tipsJson = JSON.parse(tipsText)
}
diff --git a/global/navBar.js b/global/navBar.js
new file mode 100644
index 0000000..45d5728
--- /dev/null
+++ b/global/navBar.js
@@ -0,0 +1,51 @@
+let navBarJson
+
+function onLoadNavBar() {
+ const container = document.getElementById("navBarContainer")
+
+ if (!container) { return }
+
+ const navBarAligner = document.createElement("div")
+ navBarAligner.className = "navBarAligner"
+
+ const navBar = document.createElement("ul")
+ navBar.className = "navBar"
+
+
+ for (let btn of navBarJson) {
+ navBar.appendChild(createNavBarBtn(
+ btn["icon"] || "",
+ btn["action"] || "",
+ btn["actionValue"] || "",
+ btn["iconId"] || ""
+ ))
+ }
+
+ navBarAligner.appendChild(navBar)
+ container.appendChild(navBarAligner)
+}
+
+function createNavBarBtn(icon = "", action = "", actionValue = "", iconId = "") {
+ let onClick
+ switch (action) {
+ case "navigate": onClick = `slideTransition('${actionValue}')`; break
+ case "function": onClick = `${actionValue}`; break
+ default: ""
+ }
+
+ let btn = document.createElement("li")
+ btn.innerHTML = `
+
+ `
+
+ return btn
+}
+
+async function loadNavBarJson() {
+ let navBarText = await fetch("/data/navBar.json").then(response => response.text())
+ navBarJson = JSON.parse(navBarText)
+}
+
diff --git a/index.html b/index.html
index 0531fe9..dc55ff4 100644
--- a/index.html
+++ b/index.html
@@ -6,70 +6,26 @@
Byte Dice
-
-
-
+
+
+
-
+
-
-
-
-
-
-
Loading...
Loading files...
Tip: Tip loading...
-
+ 
- 
- 
+ 
+ 
-
-
-
-
+