Settings saved!
diff --git a/JavaScript/BeatzGame.js b/JavaScript/BeatzGame.js
index eb4a5c6..0f1f8ea 100644
--- a/JavaScript/BeatzGame.js
+++ b/JavaScript/BeatzGame.js
@@ -2,7 +2,7 @@
* Title: Beatz
* Author: Victor//GuayabR
* Date: 16/05/2024
- * Version: MOBILE 4.3.2 test (release.version.subversion.bugfix)
+ * Version: MOBILE 4.3.3.3 test (release.version.subversion.bugfix)
* GitHub Repository: https://github.com/GuayabR/Beatz
**/
@@ -10,7 +10,7 @@
const userDevice = detectDeviceType();
-const VERSION = "MOBILE 4.3.2 ";
+const VERSION = "MOBILE 4.3.3.3";
var PUBLICVERSION = `4.3! (${userDevice} Port)`;
console.log("Version: " + VERSION);
@@ -32,6 +32,12 @@ const MAX_HIT_SOUNDS = 5;
const baseURL = "https://guayabr.github.io/Beatz/";
+const testingVerHTML = "BeatzGameTesting.html";
+const publicVerHTML = "index.html";
+
+const testingVerJS = "BeatzGameTesting.js";
+const publicVerJS = "BeatzGame.js";
+
const title = document.getElementById("titleGame");
const noteXPositions = {
@@ -1211,7 +1217,7 @@ function getDynamicSpeed(songSrc) {
{ timestamp: 186.61, noteSpeed: 8 },
{ timestamp: 187.705, noteSpeed: 1 },
{ timestamp: 187.93, noteSpeed: 12 },
- { timestamp: 193.23, noteSpeed: 2 },
+ { timestamp: 193.18, noteSpeed: 2 },
{ timestamp: 194.895, noteSpeed: 12 },
{ timestamp: 208.87, noteSpeed: 10 },
{ timestamp: 215.78, noteSpeed: 8 },
@@ -1815,7 +1821,7 @@ closeSSongModal.onclick = closeSelectedSongModal;
closeSongListBTN.onclick = closeSongList;
// Define keyword descriptions
-const keywordDescriptions = {
+var keywordDescriptions = {
ye: "Only results from Kanye West",
kdot: "Only results from Kendrick Lamar",
em: "Only results from Eminem",
@@ -1830,6 +1836,22 @@ const keywordDescriptions = {
odecore: "Only results from Odetari"
};
+if (isMobile) {
+ keywordDescriptions = {
+ ye: "Only results from Kanye West",
+ kdot: "Only results from Kendrick Lamar",
+ em: "Only results from Eminem",
+ goat: "Only results from The Goats",
+ "got bit by a goat": "Only results from Eminem",
+ marshall: "Only results from Eminem",
+ trash: "Only results from Playboi Carti",
+ zesty: "Only results from Drake",
+ bili: "Only results from Billie Eilish",
+ last: "Refers to the last song in the list",
+ odecore: "Only results from Odetari"
+ };
+}
+
// Function to open the keyword list modal
document.getElementById("keywordListButton").onclick = function () {
const keywordListModal = document.getElementById("keywordListModal");
@@ -1840,9 +1862,15 @@ document.getElementById("keywordListButton").onclick = function () {
// Populate modal with keyword descriptions
for (const [keyword, description] of Object.entries(keywordDescriptions)) {
- const p = document.createElement("p");
- p.textContent = `${keyword}: ${description}`;
- keywordDescriptionsDiv.appendChild(p);
+ let element;
+ if (isMobile) {
+ element = document.createElement("span");
+ element.className = "keyword-description";
+ } else {
+ element = document.createElement("p");
+ }
+ element.textContent = `${keyword}: ${description}`;
+ keywordDescriptionsDiv.appendChild(element);
}
keywordListModal.style.display = "block";
@@ -2329,16 +2357,24 @@ function rotateImage(ctx, coverImage, centerX, centerY, radius, rotationAngle) {
ctx.restore();
}
-// Toggle vinyl rotation visibility
+// Toggle vinyl rotation visibility based on circular image checkbox
function toggleVinylRotation() {
const circularImageCheckbox = document.getElementById("circularImage");
- const vinylRotationContainer = document.getElementById("vinylRotationContainer");
+ const vinylRotationLabel = document.getElementById("vinylRotationLabel");
+ const vinylRotation = document.getElementById("vinylRotation");
+ const margin = document.getElementById("marginRotation");
+
if (circularImageCheckbox.checked) {
- vinylRotationContainer.style.display = "block";
+ vinylRotationLabel.style.display = "inline-block";
+ vinylRotation.style.display = "inline-block";
+ margin.style.display = "inline-block";
} else {
- vinylRotationContainer.style.display = "none";
- document.getElementById("vinylRotation").checked = false;
- vinylRotationEnabled = false;
+ vinylRotationLabel.style.display = "none";
+ vinylRotation.style.display = "none";
+ margin.style.display = "none";
+
+ // Additional state reset
+ vinylRotationEnabled = false; // Reset any other state variables
rotationAngle = 0; // Reset rotation angle when disabled
}
}
@@ -2765,7 +2801,7 @@ function startGame(index, versionPath, setIndex) {
// Update the page title
indexToDisplay = setIndex >= 0 ? setIndex : currentSongIndex;
- document.title = `Song ${indexToDisplay + 1}: ${getSongTitle(currentSongPath)} | Beatz 4.3!`;
+ document.title = `Song ${indexToDisplay + 1}: ${getSongTitle(currentSongPath)} | Beatz Testing 4.3!`;
console.log(`indexToDisplay converted in startGame: ${indexToDisplay}`);
};
@@ -3781,127 +3817,6 @@ function drawAutoHitText() {
ctx.fillText("Points are disabled for this playthrough.", 10, HEIGHT - 10);
}
-// Get the modal and buttons
-const customSongModal = document.getElementById("customSongModal");
-const openCustomSongModal = document.getElementById("openCustomSongModal");
-const closeCustomSong = document.getElementById("closeCustomSongModal");
-const createButton = document.getElementById("createCustomSong");
-
-// Open the modal
-openCustomSongModal.onclick = function () {
- customSongModal.style.display = "block";
- deactivateKeybinds();
-};
-
-// Close the modal
-closeCustomSong.onclick = function () {
- customSongModal.style.display = "none";
- activateKeybinds();
-};
-
-// Close the modal when clicking outside of it
-window.onclick = function (event) {
- if (event.target === customSongModal) {
- customSongModal.style.display = "none";
- }
-};
-
-// Handle file input and note generation
-createButton.onclick = function () {
- const fileInput = document.getElementById("songFile");
- const titleInput = document.getElementById("customSongTitle").value;
- const noteSpeed = parseInt(document.getElementById("noteSpeed").value);
- const bpm = parseInt(document.getElementById("bpm").value);
-
- if (fileInput.files.length === 0) {
- alert("Please upload an MP3 file.");
- return;
- }
-
- const file = fileInput.files[0];
- if (file.type !== "audio/mp3") {
- alert("Please upload a valid MP3 file.");
- return;
- }
-
- const audio = new Audio(URL.createObjectURL(file));
- audio.onloadedmetadata = function () {
- const duration = audio.duration * 1000; // Convert duration to milliseconds
-
- // Generate notes
- const notes = generateRandomNotes(duration);
-
- // Apply note speed and BPM
- applyNoteSpeedAndBPM(noteSpeed, bpm);
-
- // Start the game with the custom song
- startCustomGame(file, titleInput, notes);
- };
-};
-
-// Function to apply note speed and BPM
-function applyNoteSpeedAndBPM(noteSpeed, bpm) {
- // Implement your logic to apply note speed and BPM
- console.log("Note Speed:", noteSpeed, "BPM:", bpm);
-}
-
-// Function to start the game with the custom song
-function startCustomGame(file, title, notes) {
- // Implement your logic to start the game with the given song and notes
- console.log("Starting custom game with title:", title);
- console.log("Notes:", notes);
-}
-
-canvas.addEventListener("dblclick", () => {
- takeScreenshotWithBackground(canvas);
-});
-
-function takeScreenshotWithBackground(canvas, backgroundImagePath = "https://guayabr.github.io/Beatz/Resources/Background2.png") {
- const tempCanvas = document.createElement("canvas");
- const tempCtx = tempCanvas.getContext("2d");
- const backgroundImage = new Image();
-
- tempCanvas.width = canvas.width;
- tempCanvas.height = canvas.height;
-
- // Load the background image
- backgroundImage.src = backgroundImagePath;
- backgroundImage.crossOrigin = "anonymous";
-
- backgroundImage.onload = function () {
- // Draw the background image onto the temporary canvas
- tempCtx.drawImage(backgroundImage, 0, 0, tempCanvas.width, tempCanvas.height);
-
- // Draw the original canvas on top of the background
- tempCtx.drawImage(canvas, 0, 0);
-
- try {
- // Capture the screenshot
- const screenshotDataURL = tempCanvas.toDataURL("image/png");
-
- // Download the screenshot
- downloadScreenshot(screenshotDataURL, "screenshot.png");
- } catch (err) {
- console.error("Failed to export the canvas:", err);
- logError(`Failed to screenshot canvas. ${err}`);
- }
- };
-
- backgroundImage.onerror = function () {
- console.debug("Failed to load background image:", backgroundImagePath);
- };
-}
-
-// Helper function to download the screenshot
-function downloadScreenshot(dataURL, filename) {
- const a = document.createElement("a");
- a.href = dataURL;
- a.download = filename;
- document.body.appendChild(a);
- a.click();
- document.body.removeChild(a);
-}
-
// Global variable to track if notes are generated
let notesGenerated = false;
@@ -3932,7 +3847,7 @@ function generateRandomNotes(duration) {
return notes; // Return the generated notes array to startGame()
}
-// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . /.... .- -.-. . .-.
+// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . / .... .- -.-. . .-.
// Thanks for playing Beatz!
// - GuayabR.
diff --git a/JavaScript/BeatzGameTesting.js b/JavaScript/BeatzGameTesting.js
index f3cabd4..a13623e 100644
--- a/JavaScript/BeatzGameTesting.js
+++ b/JavaScript/BeatzGameTesting.js
@@ -2,7 +2,7 @@
* Title: Beatz
* Author: Victor//GuayabR
* Date: 16/05/2024
- * Version: MOBILE 4.3.2 test (release.version.subversion.bugfix)
+ * Version: MOBILE 4.3.3.3 test (release.version.subversion.bugfix)
* GitHub Repository: https://github.com/GuayabR/Beatz
**/
@@ -10,7 +10,7 @@
const userDevice = detectDeviceType();
-const VERSION = "MOBILE 4.3.2";
+const VERSION = "MOBILE 4.3.3.3";
var PUBLICVERSION = `4.3! (${userDevice} Port)`;
console.log("Version: " + VERSION);
@@ -32,6 +32,12 @@ const MAX_HIT_SOUNDS = 5;
const baseURL = "https://guayabr.github.io/Beatz/";
+const testingVerHTML = "BeatzGameTesting.html";
+const publicVerHTML = "index.html";
+
+const testingVerJS = "BeatzGameTesting.js";
+const publicVerJS = "BeatzGame.js";
+
const title = document.getElementById("titleGame");
const noteXPositions = {
@@ -1211,7 +1217,7 @@ function getDynamicSpeed(songSrc) {
{ timestamp: 186.61, noteSpeed: 8 },
{ timestamp: 187.705, noteSpeed: 1 },
{ timestamp: 187.93, noteSpeed: 12 },
- { timestamp: 193.23, noteSpeed: 2 },
+ { timestamp: 193.18, noteSpeed: 2 },
{ timestamp: 194.895, noteSpeed: 12 },
{ timestamp: 208.87, noteSpeed: 10 },
{ timestamp: 215.78, noteSpeed: 8 },
@@ -1815,7 +1821,7 @@ closeSSongModal.onclick = closeSelectedSongModal;
closeSongListBTN.onclick = closeSongList;
// Define keyword descriptions
-const keywordDescriptions = {
+var keywordDescriptions = {
ye: "Only results from Kanye West",
kdot: "Only results from Kendrick Lamar",
em: "Only results from Eminem",
@@ -1830,6 +1836,22 @@ const keywordDescriptions = {
odecore: "Only results from Odetari"
};
+if (isMobile) {
+ keywordDescriptions = {
+ ye: "Only results from Kanye West",
+ kdot: "Only results from Kendrick Lamar",
+ em: "Only results from Eminem",
+ goat: "Only results from The Goats",
+ "got bit by a goat": "Only results from Eminem",
+ marshall: "Only results from Eminem",
+ trash: "Only results from Playboi Carti",
+ zesty: "Only results from Drake",
+ bili: "Only results from Billie Eilish",
+ last: "Refers to the last song in the list",
+ odecore: "Only results from Odetari"
+ };
+}
+
// Function to open the keyword list modal
document.getElementById("keywordListButton").onclick = function () {
const keywordListModal = document.getElementById("keywordListModal");
@@ -1840,9 +1862,15 @@ document.getElementById("keywordListButton").onclick = function () {
// Populate modal with keyword descriptions
for (const [keyword, description] of Object.entries(keywordDescriptions)) {
- const p = document.createElement("p");
- p.textContent = `${keyword}: ${description}`;
- keywordDescriptionsDiv.appendChild(p);
+ let element;
+ if (isMobile) {
+ element = document.createElement("span");
+ element.className = "keyword-description";
+ } else {
+ element = document.createElement("p");
+ }
+ element.textContent = `${keyword}: ${description}`;
+ keywordDescriptionsDiv.appendChild(element);
}
keywordListModal.style.display = "block";
@@ -2329,16 +2357,24 @@ function rotateImage(ctx, coverImage, centerX, centerY, radius, rotationAngle) {
ctx.restore();
}
-// Toggle vinyl rotation visibility
+// Toggle vinyl rotation visibility based on circular image checkbox
function toggleVinylRotation() {
const circularImageCheckbox = document.getElementById("circularImage");
- const vinylRotationContainer = document.getElementById("vinylRotationContainer");
+ const vinylRotationLabel = document.getElementById("vinylRotationLabel");
+ const vinylRotation = document.getElementById("vinylRotation");
+ const margin = document.getElementById("marginRotation");
+
if (circularImageCheckbox.checked) {
- vinylRotationContainer.style.display = "block";
+ vinylRotationLabel.style.display = "inline-block";
+ vinylRotation.style.display = "inline-block";
+ margin.style.display = "inline-block";
} else {
- vinylRotationContainer.style.display = "none";
- document.getElementById("vinylRotation").checked = false;
- vinylRotationEnabled = false;
+ vinylRotationLabel.style.display = "none";
+ vinylRotation.style.display = "none";
+ margin.style.display = "none";
+
+ // Additional state reset
+ vinylRotationEnabled = false; // Reset any other state variables
rotationAngle = 0; // Reset rotation angle when disabled
}
}
@@ -2765,7 +2801,7 @@ function startGame(index, versionPath, setIndex) {
// Update the page title
indexToDisplay = setIndex >= 0 ? setIndex : currentSongIndex;
- document.title = `Song ${indexToDisplay + 1}: ${getSongTitle(currentSongPath)} | Beatz Testing 4.2!`;
+ document.title = `Song ${indexToDisplay + 1}: ${getSongTitle(currentSongPath)} | Beatz Testing 4.3!`;
console.log(`indexToDisplay converted in startGame: ${indexToDisplay}`);
};
@@ -3932,7 +3968,7 @@ function generateRandomNotes(duration) {
return notes; // Return the generated notes array to startGame()
}
-// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . /.... .- -.-. . .-.
+// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . / .... .- -.-. . .-.
// Thanks for playing Beatz!
// - GuayabR.
diff --git a/JavaScript/BeatzInit.js b/JavaScript/BeatzInit.js
index 2d3dcff..d0aa107 100644
--- a/JavaScript/BeatzInit.js
+++ b/JavaScript/BeatzInit.js
@@ -1,3 +1,15 @@
+/**
+ * Title: Beatz's Initialization
+ * Author: Victor//GuayabR
+ * Date: 25/08/2024
+ * Version: MOBILE 4.3.3 test (release.version.subversion.bugfix)
+ * GitHub Repository: https://github.com/GuayabR/Beatz
+ **/
+
+// RELEASE NOTES
+
+let popupDisplayed;
+
async function checkForNewRelease(currentVersion) {
const repoOwner = "GuayabR";
const repoName = "Beatz";
@@ -6,12 +18,12 @@ async function checkForNewRelease(currentVersion) {
try {
const response = await fetch(apiUrl);
const release = await response.json();
- const latestVersion = release.tag_name; // Assuming version is stored in tag_name
+ const latestVersion = release.tag_name;
const releaseNotes = release.body; // Release notes
if (latestVersion !== currentVersion) {
// A new release is detected
- displayNewReleasePopup(releaseNotes, latestVersion);
+ displayNewReleasePopup(releaseNotes, latestVersion, true);
}
} catch (error) {
logError("Error fetching release information:", error);
@@ -36,13 +48,15 @@ async function fetchVersionNotes(version) {
}
}
-function displayNewReleasePopup(releaseNotes, version) {
+function displayNewReleasePopup(releaseNotes, version, saveVer) {
+ console.log("Displaying release popup with version:", version, "Save to localStorage:", saveVer);
+
// Get values from localStorage
const newPlayer = localStorage.getItem("isNewPlayer");
const storedVersion = localStorage.getItem("popUpDisplayed");
// Check conditions to display popup
- if (!newPlayer && (storedVersion === null || storedVersion !== version)) {
+ if (!saveVer || (!newPlayer && (storedVersion === null || storedVersion !== version))) {
popupDisplayed = true;
// Create a popup container
@@ -59,13 +73,26 @@ function displayNewReleasePopup(releaseNotes, version) {
popup.style.border = "2px solid #fff";
popup.style.boxShadow = "0 4px 20px rgba(0, 0, 0, 0.5)";
popup.style.zIndex = "1000";
- popup.style.width = "50vh";
- popup.style.maxHeight = "80vh"; // Limit the height of the popup
+
+ if (!isMobile) {
+ popup.style.maxHeight = "80vh"; // Limit the height of the popup
+ popup.style.width = "50vh";
+ } else {
+ popup.style.maxHeight = "60vh"; // Limit the height of the popup
+ popup.style.width = "60%";
+ }
popup.style.overflow = "hidden"; // Hide overflow
popup.style.transition = "transform 0.3s cubic-bezier(0.17, 0.71, 0.51, 0.94)"; // Custom cubic-bezier for scaling in
+ var title;
+
// Create a title for the popup
- const title = document.createElement("h2");
+ if (!isMobile) {
+ title = document.createElement("h2");
+ } else {
+ title = document.createElement("h3");
+ }
+
title.innerHTML = `New Version Available! ${version}`;
popup.appendChild(title);
@@ -79,21 +106,50 @@ function displayNewReleasePopup(releaseNotes, version) {
const content = document.createElement("p");
content.style.whiteSpace = "pre-wrap"; // To maintain newlines in release notes
content.innerText = releaseNotes;
+
+ if (isMobile) {
+ content.style.fontSize = "13px";
+ }
+
contentContainer.appendChild(content);
popup.appendChild(contentContainer);
// Create a button to close the popup
const closeButton = document.createElement("button");
closeButton.innerText = "Close";
+
+ if (isMobile) {
+ closeButton.style.opacity = "0";
+ closeButton.style.transition = "opacity 0.4s ease-in";
+ closeButton.style.padding = "5px 10px";
+ }
+
closeButton.onclick = () => {
// Animate scale back to 0 for closing
popup.style.transition = "transform 0.2s ease-in-out"; // Ease-in-out for scaling out
popup.style.transform = "translate(-50%, -50%) scale(0)";
+ if (isMobile) {
+ // Fade out buttons after closing pop up, only on mobile devices
+ setTimeout(() => {
+ closeButton.style.opacity = "0";
+ changelogButton.style.opacity = "0";
+ }, 10);
+ }
+
// Remove the popup after the animation duration
setTimeout(() => {
document.body.removeChild(popup);
popupDisplayed = false;
+
+ if (isMobile) {
+ if (document.body.contains(closeButton)) {
+ document.body.removeChild(closeButton);
+ }
+ if (document.body.contains(changelogButton)) {
+ document.body.removeChild(changelogButton);
+ }
+ }
}, 500);
};
popup.appendChild(closeButton);
@@ -101,10 +157,44 @@ function displayNewReleasePopup(releaseNotes, version) {
// Create a button to show the full changelog
const changelogButton = document.createElement("button");
changelogButton.innerText = "View Full Changelog";
+
+ if (isMobile) {
+ changelogButton.style.opacity = "0";
+ changelogButton.style.transition = "opacity 0.4s ease-in";
+ changelogButton.style.padding = "5px 10px";
+
+ // Fade in buttons after adding them back
+ setTimeout(() => {
+ closeButton.style.opacity = "1";
+ changelogButton.style.opacity = "1";
+ }, 10);
+ }
+
changelogButton.onclick = () => {
+ // Change button text to "Loading..."
+ changelogButton.innerText = "Loading...";
+
fetch("https://guayabr.github.io/Beatz/versions.txt")
.then((response) => response.text())
.then((data) => {
+ // Fade out buttons if on mobile
+ if (isMobile) {
+ closeButton.style.transition = "opacity 0.5s ease-out";
+ changelogButton.style.transition = "opacity 0.5s ease-out";
+ closeButton.style.opacity = "0";
+ changelogButton.style.opacity = "0";
+
+ // Remove buttons after fade out
+ setTimeout(() => {
+ if (popup.contains(closeButton)) {
+ popup.removeChild(closeButton);
+ }
+ if (popup.contains(changelogButton)) {
+ popup.removeChild(changelogButton);
+ }
+ }, 500);
+ }
+
// Display the full changelog in a new popup
const changelogPopup = document.createElement("div");
changelogPopup.style.position = "fixed";
@@ -119,7 +209,14 @@ function displayNewReleasePopup(releaseNotes, version) {
changelogPopup.style.border = "2px solid #fff";
changelogPopup.style.boxShadow = "0 4px 20px rgba(0, 0, 0, 0.5)";
changelogPopup.style.zIndex = "1000";
- changelogPopup.style.width = "60vh";
+
+ if (isMobile) {
+ changelogPopup.style.width = "60%";
+ changelogPopup.style.fontSize = "13px";
+ } else {
+ changelogPopup.style.width = "60vh";
+ }
+
changelogPopup.style.height = "80vh";
changelogPopup.style.overflowY = "auto"; // Enable vertical scrolling
changelogPopup.style.transition = "transform 0.3s cubic-bezier(0.17, 0.71, 0.51, 0.94)"; // Custom cubic-bezier for scaling in
@@ -141,8 +238,18 @@ function displayNewReleasePopup(releaseNotes, version) {
changelogCloseButton.style.left = "50%";
changelogCloseButton.style.transform = "translateX(-50%)";
changelogCloseButton.style.zIndex = "1001"; // Ensure it is above other content
+ changelogCloseButton.style.opacity = "0";
changelogCloseButton.style.transition = "opacity 0.3s ease"; // Smooth transition for visibility
+ // Fade in buttons after adding them back
+ setTimeout(() => {
+ changelogCloseButton.style.opacity = "1";
+ }, 10);
+
+ if (isMobile) {
+ changelogCloseButton.style.padding = "5px 12px";
+ }
+
changelogCloseButton.onclick = () => {
// Animate scale back to 0 for closing
changelogPopup.style.transition = "transform 0.5s ease-in-out"; // Ease-in-out for scaling out
@@ -155,6 +262,22 @@ function displayNewReleasePopup(releaseNotes, version) {
setTimeout(() => {
document.body.removeChild(changelogPopup);
document.body.removeChild(changelogCloseButton);
+
+ // Fade in buttons and re-append after changelog popup is closed
+ if (isMobile) {
+ closeButton.style.opacity = "0";
+ changelogButton.style.opacity = "0";
+ document.body.appendChild(closeButton);
+ document.body.appendChild(changelogButton);
+
+ // Fade in buttons after adding them back
+ setTimeout(() => {
+ closeButton.style.transition = "opacity 0.5s ease-in";
+ changelogButton.style.transition = "opacity 0.5s ease-in";
+ closeButton.style.opacity = "1";
+ changelogButton.style.opacity = "1";
+ }, 10);
+ }
}, 500);
};
@@ -167,9 +290,19 @@ function displayNewReleasePopup(releaseNotes, version) {
setTimeout(() => {
changelogPopup.style.transform = "translate(-50%, -50%) scale(1)";
}, 10);
+ // Reset button text after loading
+ changelogButton.innerText = "View Full Changelog";
})
.catch((error) => {
- console.error("Error fetching changelog:", error);
+ logError("Error fetching changelog:", error.message);
+
+ // Set button text to indicate error
+ changelogButton.innerText = "Error: failed to fetch changelog";
+
+ // Optionally, reset the button text after a few seconds
+ setTimeout(() => {
+ changelogButton.innerText = "View Full Changelog";
+ }, 3000); // Reset after 3 seconds
});
};
popup.appendChild(changelogButton);
@@ -177,13 +310,73 @@ function displayNewReleasePopup(releaseNotes, version) {
// Append the popup to the body
document.body.appendChild(popup);
+ // Append buttons based on device type
+ if (isMobile) {
+ // Append buttons to the document body and style them as fixed below the popup
+ document.body.appendChild(closeButton);
+ document.body.appendChild(changelogButton);
+
+ // Style for the close button
+ closeButton.style.position = "fixed";
+ closeButton.style.bottom = "5px"; // Distance from the bottom of the viewport
+ closeButton.style.left = "50%"; // Center horizontally
+ closeButton.style.transform = "translateX(-50%)"; // Center the button horizontally
+ closeButton.style.zIndex = "1001"; // Ensure it's above the popup
+
+ // Style for the changelog button
+ changelogButton.style.position = "fixed";
+ changelogButton.style.bottom = "45px"; // Distance from the bottom of the viewport
+ changelogButton.style.left = "50%"; // Center horizontally
+ changelogButton.style.transform = "translateX(-50%)"; // Center the button horizontally
+ changelogButton.style.zIndex = "1001"; // Ensure it's above the popup
+ } else {
+ // Append buttons to the popup for non-mobile devices
+ popup.appendChild(closeButton);
+ popup.appendChild(changelogButton);
+ }
+
// Trigger the scaling in animation after appending to the body
setTimeout(() => {
popup.style.transform = "translate(-50%, -50%) scale(1)"; // Scale up to full size
}, 10); // Small timeout to allow the DOM to recognize the initial scale(0) state
- // Store the displayed version in localStorage
- localStorage.setItem("popUpDisplayed", version);
+ if (saveVer) {
+ localStorage.setItem("popUpDisplayed", version);
+ console.log("Version saved to localStorage.");
+ } else {
+ logNotice("Debug: Release notes pop-up displayed without saving version to localStorage.");
+ }
+ } else {
+ console.log("Conditions not met, popup not displayed.");
+ }
+}
+
+// Add the event listener for debug keybinds
+document.addEventListener("keydown", async (event) => {
+ if (event.ctrlKey && event.key === ",") {
+ if (popupDisplayed) {
+ return;
+ }
+ console.log("Debug mode activated: Ctrl + , key pressed.");
+ await debugCheckForNewRelease(VERSION);
+ }
+});
+
+async function debugCheckForNewRelease(currentVersion) {
+ const repoOwner = "GuayabR";
+ const repoName = "Beatz";
+ const apiUrl = `https://api.github.com/repos/${repoOwner}/${repoName}/releases/latest`;
+
+ try {
+ const response = await fetch(apiUrl);
+ const release = await response.json();
+ const latestVersion = release.tag_name;
+ const releaseNotes = release.body; // Release notes
+
+ // Force display the popup for debugging purposes
+ displayNewReleasePopup(releaseNotes, latestVersion, false); // 'false' to prevent saving to localStorage
+ } catch (error) {
+ logError("Error fetching release information:", error);
}
}
@@ -385,3 +578,8 @@ function setupMobileEventListeners() {
canvas.removeEventListener("mouseup", handleMouseUp, false);
canvas.removeEventListener("mouseleave", handleMouseUp, false);
}
+
+// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . / .... .- -.-. . .-.
+
+// Thanks for playing Beatz!
+// - GuayabR.
diff --git a/JavaScript/BeatzSettings.js b/JavaScript/BeatzSettings.js
index 11f4d0d..37ed072 100644
--- a/JavaScript/BeatzSettings.js
+++ b/JavaScript/BeatzSettings.js
@@ -2,7 +2,7 @@
* Title: Beatz's Settings
* Author: Victor//GuayabR
* Date: 2/06/2024
- * Version: MOBILE's Settings 4.3 test (release.version.subversion.bugfix)
+ * Version: MOBILE's Settings 4.3.3.3 test (release.version.subversion.bugfix)
* GitHub Repository: https://github.com/GuayabR/Beatz
**/
@@ -30,12 +30,6 @@ function email() {
window.open("mailto:antonviloriavictorgabriel@gmail.com");
}
-const testingVerHTML = "BeatzGameTesting.html";
-const publicVerHTML = "index.html";
-
-const testingVerJS = "BeatzGameTesting.js";
-const publicVerJS = "BeatzGame.js";
-
function toVersion() {
// Get the current document's URL
const currentURL = document.location.href;
@@ -588,6 +582,15 @@ const Presets = {
}
};
+const marginCustomBG = document.getElementById("marginCustomBG");
+const marginCustomBG2 = document.getElementById("marginCustomBG2");
+
+const marginBlur = document.getElementById("marginBlurBG");
+const marginBlur2 = document.getElementById("marginBlurBG2");
+
+const marginSelect = document.getElementById("marginSelect");
+const marginSelect2 = document.getElementById("marginSelect2");
+
// Function to apply the preset based on the one you chose
function applyPreset(presetName) {
const preset = Presets[presetName];
@@ -634,14 +637,30 @@ function applyPreset(presetName) {
document.getElementById("customBGInput").style.display = "inline";
document.getElementById("customTransparentBGblur").style.display = "inline";
document.getElementById("backdropBlurInput").style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "inline";
+ marginCustomBG2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else if (miscellaneous.backgroundForCanvas === "transparentBG") {
document.getElementById("customTransparentBGblur").style.display = "inline";
document.getElementById("backdropBlurInput").style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else {
document.getElementById("customBGLabel").style.display = "none";
document.getElementById("customBGInput").style.display = "none";
document.getElementById("customTransparentBGblur").style.display = "none";
document.getElementById("backdropBlurInput").style.display = "none";
+ marginSelect.style.display = "none";
+ marginSelect2.style.display = "none";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
}
saveSettings();
@@ -695,19 +714,44 @@ function applyPresetMisc(presetName) {
document.getElementById("fetchSongsSite").checked = miscellaneous.fetchSongs;
}
+ const marginCustomBG = document.getElementById("marginCustomBG");
+ const marginCustomBG2 = document.getElementById("marginCustomBG2");
+
+ const marginBlur = document.getElementById("marginBlurBG");
+ const marginBlur2 = document.getElementById("marginBlurBG2");
+
+ const marginSelect = document.getElementById("marginSelect");
+ const marginSelect2 = document.getElementById("marginSelect2");
+
if (miscellaneous.backgroundForCanvas === "customBG" && miscellaneous.customBackground) {
document.getElementById("customBGLabel").style.display = "inline";
document.getElementById("customBGInput").style.display = "inline";
document.getElementById("customTransparentBGblur").style.display = "inline";
document.getElementById("backdropBlurInput").style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "inline";
+ marginCustomBG2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else if (miscellaneous.backgroundForCanvas === "transparentBG") {
document.getElementById("customTransparentBGblur").style.display = "inline";
document.getElementById("backdropBlurInput").style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else {
document.getElementById("customBGLabel").style.display = "none";
document.getElementById("customBGInput").style.display = "none";
document.getElementById("customTransparentBGblur").style.display = "none";
document.getElementById("backdropBlurInput").style.display = "none";
+ marginSelect.style.display = "none";
+ marginSelect2.style.display = "none";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
}
saveSettings();
@@ -894,14 +938,31 @@ function loadSettings() {
customBGInput.style.display = "inline";
customTransparentBGblur.style.display = "inline";
backdropBlurInput.style.display = "inline";
+
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "inline";
+ marginCustomBG2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else if (selectedOption === "transparentBG") {
customTransparentBGblur.style.display = "inline";
backdropBlurInput.style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else {
customBGLabel.style.display = "none";
customBGInput.style.display = "none";
customTransparentBGblur.style.display = "none";
backdropBlurInput.style.display = "none";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
}
});
@@ -911,37 +972,85 @@ function loadSettings() {
case "defaultBG":
BGurl = `url("Resources/Background2.png")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "defaultBG2":
BGurl = `url("Resources/Background3.jpg")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "defaultBG3":
BGurl = `url("Resources/Background4.png")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "defaultBG4":
BGurl = `url("Resources/Background5.jpg")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "htmlBG":
BGurl = `url("Resources/BackgroundHtml2.png")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "transparentBG":
canvas.style.background = "transparent";
canvas.style.backdropFilter = `blur(${savedCustomBackgroundBlur}px)`;
backgroundIsDefault = false;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
break;
case "customBG":
if (savedCustomBackground) {
BGurl = `url("${savedCustomBackground}")`;
}
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "inline";
+ marginCustomBG2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
backgroundIsDefault = true;
break;
default:
BGurl = `url("Resources/Background2.png")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
}
initializeHitSounds(miscellaneous.hitSound);
@@ -1477,7 +1586,6 @@ function keyDownFunction(keyboardEvent) {
document.getElementById("startButton").click();
gameStarted = true;
}
- return;
}
if (gameStarted && keyDown === "ENTER") {
@@ -1534,46 +1642,48 @@ function keyDownFunction(keyboardEvent) {
return; // Prevent further actions
}
- // Handle directional keys and other game controls
- if (keybinds.up.includes(keyDown)) {
- upPressed = true;
- }
- if (keybinds.left.includes(keyDown)) {
- leftPressed = true;
- }
- if (keybinds.down.includes(keyDown)) {
- downPressed = true;
- }
- if (keybinds.right.includes(keyDown)) {
- rightPressed = true;
- }
- if (keybinds.pause.includes(keyDown)) {
- togglePause();
- }
- if (keybinds.autoHit.includes(keyDown)) {
- toggleAutoHit();
- }
- if (keybinds.fullscreen.includes(keyDown)) {
- toggleFullScreen();
- }
- if (keyboardEvent.shiftKey && keybinds.previous.includes(keyDown)) {
- skipToFirstSong();
- } else if (keybinds.previous.includes(keyDown)) {
- previousSong();
- }
- if (keybinds.restart.includes(keyDown)) {
- restartSong();
- }
- if (keyboardEvent.shiftKey && keybinds.next.includes(keyDown)) {
- skipToLastSong();
- } else if (keybinds.next.includes(keyDown)) {
- nextSong();
- }
- if (keybinds.randomize.includes(keyDown)) {
- randomizeSong();
- }
- if (keybinds.toggleNoteStyle.includes(keyDown)) {
- toggleNoteStyle();
+ if (gameStarted) {
+ // Handle directional keys and other game controls after game has started
+ if (keybinds.up.includes(keyDown)) {
+ upPressed = true;
+ }
+ if (keybinds.left.includes(keyDown)) {
+ leftPressed = true;
+ }
+ if (keybinds.down.includes(keyDown)) {
+ downPressed = true;
+ }
+ if (keybinds.right.includes(keyDown)) {
+ rightPressed = true;
+ }
+ if (keybinds.pause.includes(keyDown)) {
+ togglePause();
+ }
+ if (keybinds.autoHit.includes(keyDown)) {
+ toggleAutoHit();
+ }
+ if (keybinds.fullscreen.includes(keyDown)) {
+ toggleFullScreen();
+ }
+ if (keyboardEvent.shiftKey && keybinds.previous.includes(keyDown)) {
+ skipToFirstSong();
+ } else if (keybinds.previous.includes(keyDown)) {
+ previousSong();
+ }
+ if (keybinds.restart.includes(keyDown)) {
+ restartSong();
+ }
+ if (keyboardEvent.shiftKey && keybinds.next.includes(keyDown)) {
+ skipToLastSong();
+ } else if (keybinds.next.includes(keyDown)) {
+ nextSong();
+ }
+ if (keybinds.randomize.includes(keyDown)) {
+ randomizeSong();
+ }
+ if (keybinds.toggleNoteStyle.includes(keyDown)) {
+ toggleNoteStyle();
+ }
}
// Debug and developer shortcuts
@@ -1616,7 +1726,7 @@ function keyUpFunction(keyboardEvent) {
}
}
-// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . /.... .- -.-. . .-.
+// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . / .... .- -.-. . .-.
// Thanks for playing Beatz!
// - GuayabR.
diff --git a/JavaScript/BeatzSettingsTesting.js b/JavaScript/BeatzSettingsTesting.js
index 61992a6..37ed072 100644
--- a/JavaScript/BeatzSettingsTesting.js
+++ b/JavaScript/BeatzSettingsTesting.js
@@ -2,7 +2,7 @@
* Title: Beatz's Settings
* Author: Victor//GuayabR
* Date: 2/06/2024
- * Version: MOBILE's Settings 4.1 test (release.version.subversion.bugfix)
+ * Version: MOBILE's Settings 4.3.3.3 test (release.version.subversion.bugfix)
* GitHub Repository: https://github.com/GuayabR/Beatz
**/
@@ -30,12 +30,6 @@ function email() {
window.open("mailto:antonviloriavictorgabriel@gmail.com");
}
-const testingVerHTML = "BeatzGameTesting.html";
-const publicVerHTML = "index.html";
-
-const testingVerJS = "BeatzGameTesting.js";
-const publicVerJS = "BeatzGame.js";
-
function toVersion() {
// Get the current document's URL
const currentURL = document.location.href;
@@ -588,6 +582,15 @@ const Presets = {
}
};
+const marginCustomBG = document.getElementById("marginCustomBG");
+const marginCustomBG2 = document.getElementById("marginCustomBG2");
+
+const marginBlur = document.getElementById("marginBlurBG");
+const marginBlur2 = document.getElementById("marginBlurBG2");
+
+const marginSelect = document.getElementById("marginSelect");
+const marginSelect2 = document.getElementById("marginSelect2");
+
// Function to apply the preset based on the one you chose
function applyPreset(presetName) {
const preset = Presets[presetName];
@@ -634,14 +637,30 @@ function applyPreset(presetName) {
document.getElementById("customBGInput").style.display = "inline";
document.getElementById("customTransparentBGblur").style.display = "inline";
document.getElementById("backdropBlurInput").style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "inline";
+ marginCustomBG2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else if (miscellaneous.backgroundForCanvas === "transparentBG") {
document.getElementById("customTransparentBGblur").style.display = "inline";
document.getElementById("backdropBlurInput").style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else {
document.getElementById("customBGLabel").style.display = "none";
document.getElementById("customBGInput").style.display = "none";
document.getElementById("customTransparentBGblur").style.display = "none";
document.getElementById("backdropBlurInput").style.display = "none";
+ marginSelect.style.display = "none";
+ marginSelect2.style.display = "none";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
}
saveSettings();
@@ -695,19 +714,44 @@ function applyPresetMisc(presetName) {
document.getElementById("fetchSongsSite").checked = miscellaneous.fetchSongs;
}
+ const marginCustomBG = document.getElementById("marginCustomBG");
+ const marginCustomBG2 = document.getElementById("marginCustomBG2");
+
+ const marginBlur = document.getElementById("marginBlurBG");
+ const marginBlur2 = document.getElementById("marginBlurBG2");
+
+ const marginSelect = document.getElementById("marginSelect");
+ const marginSelect2 = document.getElementById("marginSelect2");
+
if (miscellaneous.backgroundForCanvas === "customBG" && miscellaneous.customBackground) {
document.getElementById("customBGLabel").style.display = "inline";
document.getElementById("customBGInput").style.display = "inline";
document.getElementById("customTransparentBGblur").style.display = "inline";
document.getElementById("backdropBlurInput").style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "inline";
+ marginCustomBG2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else if (miscellaneous.backgroundForCanvas === "transparentBG") {
document.getElementById("customTransparentBGblur").style.display = "inline";
document.getElementById("backdropBlurInput").style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else {
document.getElementById("customBGLabel").style.display = "none";
document.getElementById("customBGInput").style.display = "none";
document.getElementById("customTransparentBGblur").style.display = "none";
document.getElementById("backdropBlurInput").style.display = "none";
+ marginSelect.style.display = "none";
+ marginSelect2.style.display = "none";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
}
saveSettings();
@@ -894,14 +938,31 @@ function loadSettings() {
customBGInput.style.display = "inline";
customTransparentBGblur.style.display = "inline";
backdropBlurInput.style.display = "inline";
+
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "inline";
+ marginCustomBG2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else if (selectedOption === "transparentBG") {
customTransparentBGblur.style.display = "inline";
backdropBlurInput.style.display = "inline";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
} else {
customBGLabel.style.display = "none";
customBGInput.style.display = "none";
customTransparentBGblur.style.display = "none";
backdropBlurInput.style.display = "none";
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
}
});
@@ -911,37 +972,85 @@ function loadSettings() {
case "defaultBG":
BGurl = `url("Resources/Background2.png")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "defaultBG2":
BGurl = `url("Resources/Background3.jpg")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "defaultBG3":
BGurl = `url("Resources/Background4.png")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "defaultBG4":
BGurl = `url("Resources/Background5.jpg")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "htmlBG":
BGurl = `url("Resources/BackgroundHtml2.png")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
break;
case "transparentBG":
canvas.style.background = "transparent";
canvas.style.backdropFilter = `blur(${savedCustomBackgroundBlur}px)`;
backgroundIsDefault = false;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
break;
case "customBG":
if (savedCustomBackground) {
BGurl = `url("${savedCustomBackground}")`;
}
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "inline";
+ marginCustomBG2.style.display = "inline";
+ marginBlur.style.display = "inline";
+ marginBlur2.style.display = "inline";
backgroundIsDefault = true;
break;
default:
BGurl = `url("Resources/Background2.png")`;
backgroundIsDefault = true;
+ marginSelect.style.display = "inline";
+ marginSelect2.style.display = "inline";
+ marginCustomBG.style.display = "none";
+ marginCustomBG2.style.display = "none";
+ marginBlur.style.display = "none";
+ marginBlur2.style.display = "none";
}
initializeHitSounds(miscellaneous.hitSound);
@@ -1477,7 +1586,6 @@ function keyDownFunction(keyboardEvent) {
document.getElementById("startButton").click();
gameStarted = true;
}
- return;
}
if (gameStarted && keyDown === "ENTER") {
@@ -1534,46 +1642,48 @@ function keyDownFunction(keyboardEvent) {
return; // Prevent further actions
}
- // Handle directional keys and other game controls
- if (keybinds.up.includes(keyDown)) {
- upPressed = true;
- }
- if (keybinds.left.includes(keyDown)) {
- leftPressed = true;
- }
- if (keybinds.down.includes(keyDown)) {
- downPressed = true;
- }
- if (keybinds.right.includes(keyDown)) {
- rightPressed = true;
- }
- if (keybinds.pause.includes(keyDown)) {
- togglePause();
- }
- if (keybinds.autoHit.includes(keyDown)) {
- toggleAutoHit();
- }
- if (keybinds.fullscreen.includes(keyDown)) {
- toggleFullScreen();
- }
- if (keyboardEvent.shiftKey && keybinds.previous.includes(keyDown)) {
- skipToFirstSong();
- } else if (keybinds.previous.includes(keyDown)) {
- previousSong();
- }
- if (keybinds.restart.includes(keyDown)) {
- restartSong();
- }
- if (keyboardEvent.shiftKey && keybinds.next.includes(keyDown)) {
- skipToLastSong();
- } else if (keybinds.next.includes(keyDown)) {
- nextSong();
- }
- if (keybinds.randomize.includes(keyDown)) {
- randomizeSong();
- }
- if (keybinds.toggleNoteStyle.includes(keyDown)) {
- toggleNoteStyle();
+ if (gameStarted) {
+ // Handle directional keys and other game controls after game has started
+ if (keybinds.up.includes(keyDown)) {
+ upPressed = true;
+ }
+ if (keybinds.left.includes(keyDown)) {
+ leftPressed = true;
+ }
+ if (keybinds.down.includes(keyDown)) {
+ downPressed = true;
+ }
+ if (keybinds.right.includes(keyDown)) {
+ rightPressed = true;
+ }
+ if (keybinds.pause.includes(keyDown)) {
+ togglePause();
+ }
+ if (keybinds.autoHit.includes(keyDown)) {
+ toggleAutoHit();
+ }
+ if (keybinds.fullscreen.includes(keyDown)) {
+ toggleFullScreen();
+ }
+ if (keyboardEvent.shiftKey && keybinds.previous.includes(keyDown)) {
+ skipToFirstSong();
+ } else if (keybinds.previous.includes(keyDown)) {
+ previousSong();
+ }
+ if (keybinds.restart.includes(keyDown)) {
+ restartSong();
+ }
+ if (keyboardEvent.shiftKey && keybinds.next.includes(keyDown)) {
+ skipToLastSong();
+ } else if (keybinds.next.includes(keyDown)) {
+ nextSong();
+ }
+ if (keybinds.randomize.includes(keyDown)) {
+ randomizeSong();
+ }
+ if (keybinds.toggleNoteStyle.includes(keyDown)) {
+ toggleNoteStyle();
+ }
}
// Debug and developer shortcuts
@@ -1616,7 +1726,7 @@ function keyUpFunction(keyboardEvent) {
}
}
-// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . /.... .- -.-. . .-.
+// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . / .... .- -.-. . .-.
// Thanks for playing Beatz!
// - GuayabR.
diff --git a/index.html b/index.html
index cb76bae..c995650 100644
--- a/index.html
+++ b/index.html
@@ -155,11 +155,8 @@
Miscellaneous Settings
-
-
-
-
-
+
+
@@ -168,7 +165,7 @@
Miscellaneous Settings
-
+
+ >
-
+
-
+
Settings saved!
@@ -231,30 +228,6 @@
Preset has been s
-
-
-
-
-
-
-
-
Add Custom Song
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/mobileStyles.css b/mobileStyles.css
index e1e5337..e37524f 100644
--- a/mobileStyles.css
+++ b/mobileStyles.css
@@ -203,6 +203,26 @@ canvas {
background-color: rgba(0, 0, 0, 0);
}
+.pop-up-modal {
+ display: none;
+ position: fixed;
+ z-index: 1000;
+ left: 100px;
+ top: 5vh;
+ width: 40%;
+ max-height: 90vh;
+ overflow: auto;
+ font-size: 7px;
+ background-color: rgb(255, 255, 255);
+ background-color: rgba(0, 0, 0, 0);
+}
+
+/* Ensure spans appear on separate lines on mobile devices */
+.keyword-description {
+ display: block; /* Makes span behave like block element */
+ margin-bottom: 3px; /* Adds space between items */
+}
+
#openSongListBTN {
font-size: 16px;
width: 175px;
@@ -436,6 +456,31 @@ canvas {
transform 0.3s ease;
}
+#keywordListButton {
+ float: left;
+ color: #ffffff;
+ border: none;
+ padding: 0;
+ cursor: pointer;
+ font-size: 20px;
+ font-weight: bold;
+ background: none;
+ box-shadow: 0 0px #dfdfdf3a;
+ transition:
+ color 0.3s ease,
+ transform 0.3s ease;
+}
+
+#keywordListButton:hover {
+ color: rgb(86, 255, 123);
+ text-decoration: none;
+ cursor: pointer;
+ transform: scale(1.25);
+ transition:
+ color 0.2s ease,
+ transform 0.3s ease;
+}
+
#songSelector {
background-color: rgba(255, 255, 255, 0.1);
color: #fff;
diff --git a/versions.txt b/versions.txt
index 8ac4ce4..e44a4d9 100644
--- a/versions.txt
+++ b/versions.txt
@@ -524,4 +524,13 @@ Added a localStorage cleanup system where every time you start up a new song, it
- Game Title, song covers on selected song modal now pulse to the beat of the current song.
- Changed the main font family to "Poppins" (https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap)
+//
+
+4.3.3.3 (MOBILE 4.3! 25/08/2024)
+- Fixed release notes pop up overflowing.
+- Added a debug keybind to show a pop up.
+- Fixed release notes pop up being to large in mobile devices, same with full changelog pop up.
+- Separated the close button and changelog button in the new version pop up for mobile devices.
+- Removed random space in the middle of the checkboxes in miscellaneous settings.
+- Removed big space after background selection inside miscellaneous settings.