Skip to content

Commit

Permalink
4.3.3.3 (MOBILE 4.3! 25/08/2024)
Browse files Browse the repository at this point in the history
  • Loading branch information
@GuayabR
GuayabR authored Aug 25, 2024
1 parent 85c6682 commit 05b46b8
Show file tree
Hide file tree
Showing 9 changed files with 696 additions and 303 deletions.
17 changes: 7 additions & 10 deletions BeatzGameTesting.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Beatz 4.2!</title>
<title>Beatz 4.3!</title>
<link rel="icon" type="image/x-icon" href="Resources/favicon.png" />
<link rel="stylesheet" id="stylesheet" type="text/css" href="styles.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" />
Expand Down Expand Up @@ -155,11 +155,8 @@ <h1>Miscellaneous Settings</h1>
<label for="circularImage">Circular Cover Images?</label>
<input type="checkbox" id="circularImage" name="circularImage" onchange="toggleVinylRotation()" /><br />

<div id="vinylRotationContainer" style="display: none">
<label for="vinylRotation">Enable Cover Image Rotation:</label>
<input type="checkbox" id="vinylRotation" name="vinylRotation" />
</div>
<br /><br />
<label for="vinylRotation" id="vinylRotationLabel" style="display: none">Enable Cover Image Rotation:</label>
<input type="checkbox" id="vinylRotation" name="vinylRotation" style="display: none" /><br id="marginRotation" />

<label for="fetchSongsSite">Fetch songs from guayabr.github.io? (Mainly for iOS)</label>
<input type="checkbox" id="fetchSongsSite" name="fetchSongsSite" onchange="toggleFetchingSongs()" /><br />
Expand All @@ -168,7 +165,7 @@ <h1>Miscellaneous Settings</h1>
<input type="checkbox" id="playSFXcheck" name="playSFXcheck" onchange="togglePlaySFX()" /><br />

<label for="pulseOnBPMcheck">Elements pulse on BPM?</label>
<input type="checkbox" id="pulseOnBPMcheck" name="pulseOnBPMcheck" onchange="togglePulseOnBPM()" /><br />
<input type="checkbox" id="pulseOnBPMcheck" name="pulseOnBPMcheck" onchange="togglePulseOnBPM()" /><br /><br />

<label for="defaultBackground">Background image:</label>
<select id="defaultBackground" name="backgroundForCanvas">
Expand All @@ -179,13 +176,13 @@ <h1>Miscellaneous Settings</h1>
<option value="htmlBG">Copy HTML</option>
<option value="transparentBG">Transparent</option>
<option value="customBG">Custom background!</option></select
><br /><br />
><br id="marginSelect" /><br id="marginSelect2" />

<label id="customBGLabel" for="customBGInput" style="display: none">Custom background image:</label>
<input type="file" id="customBGInput" accept="image/*" style="display: none" /><br /><br />
<input type="file" id="customBGInput" accept="image/*" style="display: none" /><br id="marginCustomBG" /><br id="marginCustomBG2" />

<label id="customTransparentBGblur" for="backdropBlurInput" style="display: none">Background blur:</label>
<input type="number" id="backdropBlurInput" style="display: none" /><br /><br />
<input type="number" id="backdropBlurInput" style="display: none" /><br id="marginBlurBG" /><br id="marginBlurBG2" />

<span id="settingsSaved" style="color: white; display: none" class="settingsSavedMsg">Settings saved!</span>
<button id="saveSettingsBtn" class="save-settings-btn" type="button">Save</button>
Expand Down
187 changes: 51 additions & 136 deletions JavaScript/BeatzGame.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,15 @@
* 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
**/

// CONSTANTS

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);

Expand All @@ -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 = {
Expand Down Expand Up @@ -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 },
Expand Down Expand Up @@ -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",
Expand All @@ -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");
Expand All @@ -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";
Expand Down Expand Up @@ -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
}
}
Expand Down Expand Up @@ -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}`);
};
Expand Down Expand Up @@ -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;

Expand Down Expand Up @@ -3932,7 +3847,7 @@ function generateRandomNotes(duration) {
return notes; // Return the generated notes array to startGame()
}

// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . /.... .- -.-. . .-.
// - . / .- -- --- / .- -. --. . /.--. . .-. --- / - ..- / -. --- / .-.. --- / ... .- -... . ... / -.-- / -. --- / ... . / --.- ..- . / .... .- -.-. . .-.

// Thanks for playing Beatz!
// - GuayabR.
Loading

0 comments on commit 05b46b8

Please sign in to comment.