Files
J1B2-Game-controller/web/game.js
2023-11-24 13:30:10 +01:00

59 lines
1.5 KiB
JavaScript

const size = 10;
radius = size/2;
cirX = 500
cirY = 300;
const width = 1000;
const height = 600;
speed = 3;
squareX = 100;
squareY = 100;
const squareSize = 100;
// the function setup() is called once when the page is loaded
function setup() {
// create a canvas element and append it to the body
createCanvas(width, height);
frameRate(120);
// disable the outline of shapes
noStroke();
}
function keyPressed() {
if (keyIsDown(LEFT_ARROW) && cirX > 0+radius) {
cirX -= speed;
}
if (keyIsDown(RIGHT_ARROW) && cirX < width-radius) {
cirX += speed;
}
if (keyIsDown(UP_ARROW) && cirY > 0+radius) {
cirY -= speed;
}
if (keyIsDown(DOWN_ARROW) && cirY < height-radius) {
cirY += speed;
}
}
function object_collision() {
var squareCenterX = squareX + squareSize / 2;
var squareCenterY = squareY + squareSize / 2;
var distance = dist(cirX, cirY, squareCenterX, squareCenterY);
if (distance < squareSize / 2 + radius) {
squareX = random(0, width - squareSize);
squareY = random(0, height - squareSize);
}
}
// the function draw() is called every frame
function draw() {
keyPressed();
// clear the background with a transparent black color
background(0, 0, 0, 100);
// draw a circle at the mouse position
circle(constrain(cirX,0+radius,width-radius), constrain(cirY,0+radius,height-radius), size);
square(squareX,squareY,squareSize);
object_collision();
}