xxxxxxxxxx
183
let circleX = 200;
let obstacles = [];
let xPositions = [];
let obstacleSpeed = 1; // Initial speed of obstacles
let speedIncrement = 0.4;
// A sketch that resizes itself to fill the window
// Mangtronix - 2020-09-30
// MIT License
let help = "Press f (possibly twice) to toggle fullscreen";
function setup() {
createCanvas(windowWidth, windowHeight);
print(help);
xPositions = [windowWidth * (3 / 12), windowWidth * (5 / 12), windowWidth * (7 / 12), windowWidth * (9 / 12)];
}
function draw() {
background('#FFFFFF');
fill('#bae1ff');
rect(windowWidth*(2/12), 0, windowWidth*(2/12), windowHeight);
fill('#ffb3ba');
rect(windowWidth*(4/12), 0, windowWidth*(2/12), windowHeight);
fill('#ffffba');
rect(windowWidth*(6/12), 0, windowWidth*(2/12), windowHeight);
fill('#baffc9');
rect(windowWidth*(8/12), 0, windowWidth*(2/12), windowHeight);
// let border = 30;
// background('#009bb4');
// // A rectangle
// fill('#f39100');
// noStroke();
// rect(border, border, windowWidth - 2 * border, windowHeight - 2 * border);
fill(0);
ellipse(circleX, windowHeight*(2/3), 50, 50);
// Use the received distance value to control the size of the ellipse
// let ellipseSize = map(distance, 0, 100, 10, 200); // Map the distance to ellipse size
// Create obstacles randomly
if (frameCount % 40 === 0) {
let randomIndex = floor(random(xPositions.length));
let randomX = xPositions[randomIndex];
let obstacle = new Obstacle(randomX);
obstacles.push(obstacle);
}
if (frameCount % 300 === 0) {
obstacleSpeed += speedIncrement; // Increase the speed
}
// Update and display obstacles
for (let i = obstacles.length - 1; i >= 0; i--) {
obstacles[i].speed = obstacleSpeed; // Update obstacle speed
obstacles[i].update();
obstacles[i].display();
// Update and display obstacles
for (let i = obstacles.length - 1; i >= 0; i--) {
obstacles[i].update();
obstacles[i].display();
// Remove obstacles when they reach the bottom of the screen
if (obstacles[i].offScreen()) {
obstacles.splice(i, 1);
}
}
for (let i = 0; i < obstacles.length; i++) {
let obstacle = obstacles[i];
if (circleX + 25 > obstacle.x && circleX - 25 < obstacle.x + obstacle.width && windowHeight * (2 / 3) + 25 > obstacle.y && windowHeight * (2 / 3) - 25 < obstacle.y + obstacle.height) {
gameOver();
return; // End the draw loop
}
}
}
if (!serialActive) {
text("Press Space Bar to select Serial Port", 20, 30);
} else {
text("Connected", 20, 30);
}
}
function keyPressed() {
if (key == " ") {
// important to have in order to start the serial connection!!
setUpSerial();
}
}
// This function will be called by the web-serial library
// with each new *line* of data. The serial library reads
// the data until the newline and then gives it to us through
// this callback function
function readSerial(data) {
////////////////////////////////////
//READ FROM ARDUINO HERE
////////////////////////////////////
if (data != null) {
// make sure there is actually a message
// split the message
let fromArduino = split(trim(data), ",");
// if the right length, then proceed
if (fromArduino.length == 1) {
// only store values here
// do everything with those values in the main draw loop
if (data === '1') {
circleX = windowWidth*(3/12); // Change circle position if '1' is received
} else if (data === '2') {
circleX = windowWidth*(5/12); // Change circle position if '2' is received
} else if (data === '3') {
circleX = windowWidth*(7/12); // Change circle position if '3' is received
} else if (data === '4') {
circleX = windowWidth*(9/12); // Change circle position if '4' is received
}
}
//////////////////////////////////
//SEND TO ARDUINO HERE (handshake)
//////////////////////////////////
let sendToArduino = circleX + "\n";
writeSerial(sendToArduino);
}
}
class Obstacle {
constructor(x) {
this.x = x;
this.y = 0;
this.speed = obstacleSpeed; // Adjust speed as needed
this.width = 40;
this.height = 20;
}
update() {
this.y += this.speed;
}
display() {
fill(255, 0, 0);
rect(this.x, this.y, this.width, this.height);
}
offScreen() {
return this.y > windowHeight;
}
}
function gameOver() {
noLoop(); // Stop the draw loop
textSize(32);
textAlign(CENTER, CENTER);
fill(255, 0, 0);
text("Game Over", windowWidth / 2, windowHeight / 2); // Display Game Over message
}
function windowResized() {
resizeCanvas(windowWidth, windowHeight);
xPositions = [windowWidth * (3 / 12), windowWidth * (5 / 12), windowWidth * (7 / 12), windowWidth * (9 / 12)];
}
function keyTyped() {
// $$$ For some reason on Chrome/Mac you may have to press f twice to toggle. Works correctly on Firefox/Mac
if (key === 'f') {
toggleFullscreen();
}
// uncomment to prevent any default behavior
// return false;
}
// Toggle fullscreen state. Must be called in response
// to a user event (i.e. keyboard, mouse click)
function toggleFullscreen() {
let fs = fullscreen(); // Get the current state
fullscreen(!fs); // Flip it!
}