void collisionDetection(){
  for(int i = Walls.size()-1; i>=0 ; i--){
    Wall current = Walls.get(i);

    for(int b1 = tank1Bullet.size()-1; b1>=0; b1--){
      tank1Bullet currentBullet = tank1Bullet.get(b1);
      //this is problem the problem
      if(dist(currentBullet.x,currentBullet.y,current.X,current.Y)<(current.Width)){
      tank1Bullet.remove(b1);
      //Walls.remove(i);
      }
    }

class Wall{

  float Width;
  float Height;
  float X;
  float Y;
  Wall(float x,float y,float w, float h){
    Width = w;
    Height = h;
    X = x;
    Y = y;

  }
  void display(){
   fill(0);
   rect(X,Y,Width,Height);
  }

}

  class tank1Bullet extends PVector{
    PVector location;
    float rotation, bullet_Speed;

    tank1Bullet(){
        location = new PVector(tank1Location.x, tank1Location.y);
        rotation = tank1Rotate;
        bullet_Speed = 20;
    }
    void update(){

    location.x = location.x  + sin(rotation)*bullet_Speed;
    location.y = location.y  - cos(rotation)*bullet_Speed;

    //condition to removes the bullet from the arrayList if it is off the screen
    if (location.x > 0 && location.x < width+500 && location.y > 0 && location.x < height+500) {

    }
    else {
      tank1Bullet.remove(b1);
    }

  }
    void draw_Bullet(){
      ellipse(location.x,location.y , 10, 10);
    }
  }

int x = 250;
int y = 475;

int xPos=225;
int xDir=3;
int xPos2=200;
int xDir2=2;
int xPos3=25;
int xDir3=1;
int xPos4=25;
int xDir4=2;
void setup()
{
  size(500,500);

}
  void car(){
    fill(255,0,0);
    rect(xPos, 150, 25, 25);
  xPos=xPos+xDir;
  if (xPos>width || xPos<20)
  {
    xDir=-xDir;
  }
  rect(xPos2,275,25,25);
  xPos2=xPos2+xDir2;
  if (xPos2>width || xPos2<20)
  {
    xDir2=-xDir2;
  }
  }
  void log() {


   fill(128,64,0);
   rect(xPos3, 80, 125, 35);

  xPos3=xPos3+xDir3;
  if (xPos3>width || xPos3<20)
  {
    xDir3=-xDir3;
  }
  fill(128,64,0);
   rect(xPos4, 42, 125, 37);

  xPos4=xPos4+xDir4;
  if (xPos4>width || xPos4<20)
  {
    xDir4=-xDir4;
  }
  }
void draw()
{
    fill(0);
  rect(0,115,500,325);

  fill(0,128,0);
  rect(0,350,500,375);
  fill(0,0,255);
  rect(0,0,500,125);
  fill(1,50,32);
  rect(0,0,500,25);
  for(int a=25; a < width; a=a+100)
{
  fill(255,255,0);
  rect(a,215,45,10);}

  log();

  fill(0,255,0);
  rect(x,y,25,24);
  car();

}

void keyPressed() {
  if (key == CODED) {
    if (keyCode == UP) {
      y -= 41;
    } else if (keyCode == DOWN) {
      y += 41;
    } else if (keyCode == LEFT) {
      x -= 41;
    } else if (keyCode == RIGHT) {
      x += 41;
    }  
  } 
}

it would also be nice if you could tell me how to make the game better.

Thanks for help from now. ^^

I am doing one visualization task, where I am drawing graph inside canvas through connecting edges as line function. Now I want to check whether my mouse is over the line or not. If it is then I would like to show the distance between this two vertices. Can anyone tell me here how can I do it with P5.js ?

I am using translate to focus the view on the player. The problem is, I'm not sure how I would then calculate the distance between the player and the objects in the world if the point of origin is always the player's x and y.

Without translating I would just use "dist()" to see if there's any overlap, but I'm not sure how to apply this when using translate().

I tried in vain to draw the objects and then calculate their position in separate variables relative to the player but it was a complete headache; I'm convinced there is an easier way.

I understand there are libraries for games and collisions but that wouldn't be any fun! :)

I've stripped my code to the relative parts and put it here: http://codepen.io/swhizzle/full/OpKyJQ/

Any advice will be really appreciated!

Steve

    for(int b = 0; b < bullets.size(); b++)
    {
      Bullet currentBullet = bullets.get(b);
        if(dist()){
        bullets.remove(b);
        aesteroidBelt.remove(i);

Cant figure out the values to use for keeps telling me that booleans are not accept and only floats are.

These are the variables i have

int n=12;

PVector ship;

//Initilaizes Variables used
float bulletSpeed = 5;
float angle = 0;
float targetAngle = 0;
float rotation = 0.05;
float xSpeed = random(0.6, 2.5);
float ySpeed = random(0.6, 2.5);
float x = random(1, 590);
float y = random(1, 390);

My Aesteroids are also a random PVector every time you run this code(part which i am stuck on)

In other words, does any one know why I can't put this intersect in the var bubble area like this:

intersect: function() {
  var d = dist(this.x, this.y, ellip.x, ellip.y);
  if (d < this.r + ellip.rad) {
    return true;
  } else {
    return false;
  }
}

this code should work below but I'm trying to interact with all four bubble objects one at a time... but to start with I think I need the intersect function in the var bubble area, then I can write another function where I change the colors (or change the size) of the four bubbles one at a time as the ellip goes through the bubbles... I already wrote all that but it didn't work so I deleted it and may start over.

var ellip = {
    x: 0,
    y: 200,
    rad: 10,
    show: function() {
      ellipse(this.x, this.y, this.rad); 
    }
 } 
var bubble = {
    x: 150,
    y: 200,
    r: 50,
    display: function() {
       noStroke();
       fill(col);
       ellipse(this.x, this.y, this.r, this.r);
       ellipse(this.x*2, this.y, this.r, this.r);
       ellipse(this.x*3, this.y, this.r, this.r);
       ellipse(this.x*4, this.y, this.r, this.r);
   }  
}

function intersect(){
    var d = dist(bubble.x, bubble.y, ellip.x, ellip.y);
        if (d < bubble.r + ellip.rad) {
           bubble.r += .3;
             // return true;
      //} else {
             // return false;
     //}
   }
}
function setup() {
     createCanvas(800, 400);
     col = color(214, 42, 29);
}

function draw() {
      background(200);
      bubble.display();
      intersect();
      noStroke();  
      fill(0);  
      ellip.show(); 
      ellip.x += 2;
}

class Tile
{
  Platform[]platforms = new Platform[3];
  ArrayList<Carrots>karotten;

  float posX=0;
  float posY=0; 
  float Width=0;
  float Height=0;
  float speedX = 1;

  Tile (float x, float y, float w, float h)
  {
    posX = x;
    posY = y;
    Width = w;
    Height = h;

    for (int i=0; i<platforms.length; i++) {
      platforms[i] = new Platform(100+random(100)+i*150, height-70, 30, 40);
    }

    karotten=new ArrayList<Carrots>();
    for (int i=0; i<karotten.size(); i++) {
    karotten.add(new Carrots(random(150), random(height-200, height-150), 10, 20));
    karotten.add(new Carrots(random(150,250), random(height-200, height-150), 10, 20));
    karotten.add(new Carrots(random(250,350), random(height-200, height-150), 10, 20));
    karotten.add(new Carrots(random(350,450), random(height-200, height-150), 10, 20));
    karotten.add(new Carrots(random(450,550), random(height-200, height-150), 10, 20));
    }
  void display()
  {
    for (int i=0; i<platforms.length; i++) {
      platforms[i].drawPlatform(posX);
    }

    for(int i=0; i<karotten.size(); i++) {
      Carrots carrots = (Carrots) karotten.get(i);
      carrots.displayCarrots(posX);
    }
}

float x = 230;
float y = 200;
float w = 150;
float h = 80;
int state = 0; 
PImage doctor;


void setup() {
  size(1280, 836);
  background(255);
  stroke(0);
  noFill();

  doctor = loadImage("doctor office.jpg");
}


void draw() {

   //draw button 
  rect(x, y, w, h);
  fill(255);



  //hover over button to change color
  if (mouseX>x && mouseX <x+w && mouseY>y && mouseY <y+h) {
    fill(0);
  }



  // state machine 
  if (mousePressed && mouseX>x && mouseX <x+w && mouseY>y && mouseY <y+h) {
    state = 1; 
  } else {
    state = 0;
  }


  if (state == 1) {
   background(200);
   image(doctor,0,0, width, height);

  }


}

Right now I want to get my circle, which is controlled by arrow keys to move and bump into static squares but it is just going through them. Did I set it up incorrectly? I have been coding for three months, so I might be quite slow sorry!

var Engine = Matter.Engine,
    World = Matter.World,
    Bodies = Matter.Bodies;

var engine = Engine.create();
var world = engine.world;

var player;
var rocks = [];
var cols = 7;
var rows = 7;

function setup() {
    createCanvas(750, 750);
    Engine.run(engine);

    player = new Player(300, 300, 25);

    var spacing = width / cols;
    for (var j = 0; j < rows; j++) {
        for (var i = 0; i < cols; i++) {
            var r = new Rocks(i * spacing, j * spacing);
            rocks.push(r);
        }
    }
}

function draw() {
    background(51);
    Engine.update(engine);
    for (var i = 0; i < rocks.length; i++) {
        rocks[i].show();
    }
    player.show();
    player.move();
}

function Player(x, y, r) {
    this.body = Bodies.circle(x, y, r);
    this.r = r;
    World.add(world, this.body);

    this.show = function () {
        ellipse(x, y, this.r * 2);
    }

    this.move = function () {
        if (keyIsDown(RIGHT_ARROW))
            x += 10;
        if (keyIsDown(LEFT_ARROW))
            x -= 10;
        if (keyIsDown(UP_ARROW))
            y -= 10;
        if (keyIsDown(DOWN_ARROW))
            y += 10;
        x = constrain(x, this.r, height - this.r);
        y = constrain(y, this.r, width - this.r);
    }
}

function Rocks(x, y, w, h, options) {
    var options = {
        isStatic: true
    }
    this.body = Bodies.rectangle(x, y, h, w, options);
    this.w = w;
    this.h = h;
    this.size = player.r * 2;
    World.add(world, this.body);

    this.show = function () {
        rect(x, y, this.size, this.size);
    }
}

var bunkers = [];
var b1;

function setup() {
      createCanvas(window.innerWidth, window.innerHeight);
      b1 = new Bubble(250, 200);
        for (var i = 0; i < 4; i++){
           bunkers[i] = new Bunker(i*294 + 247, height-140);
   }
}

function draw() {
      background(0);

      for (var i = 0; i < 4; i++){
            bunkers[i].show();
  }
      b1.update();
      b1.display();

      if (b1.intersects(bunkers[i])){
            bunkers[i].changeColor();
    }
}
function Bubble(x, y) {
      this.x = x;
      this.y = y;
      this.r = 48;
      this.col = color(255);
      this.changeColor = function() {
            this.col = color(random(255), random(255), random(255))

    }
      this.display = function() {
            stroke(255);
            fill(this.col);
            ellipse(this.x, this.y, this.r * 2, this.r * 2);

    }

       this.intersects = function(bunker) {
             var d = dist(this.x, this.y, bunker.x, bunker.y);
       if (d < this.r + bunker.r) {
                  return true;
        } else {
                  return false;

        }
 }

       this.update = function() {
            this.x = this.x + random(-5, 5);
            this.y = this.y + random(-5, 5);

    }

}

function Bunker(x, y) {
       this.x = x;
      this.y = y;
      this.r = 60;
       this.show = function(){
          push();
          translate(this.x-257, this.y-68);
          noStroke();
          fill(0, 100, 0);
          beginShape();
          vertex(200, 50);
          vertex(208, 50);
          vertex(208, 42);
          vertex(216, 42);
          vertex(216, 34);
          vertex(224, 34);
          vertex(224, 26);
          vertex(290, 26);
          vertex(290, 34);
          vertex(298, 34);
          vertex(298, 42);
          vertex(306, 42);
          vertex(306, 50);
          vertex(314, 50);
          vertex(314, 110);
          vertex(290, 110);
          vertex(290, 102);
          vertex(282, 102);
          vertex(282, 94);
          vertex(274, 94);
          vertex(274, 86);
          vertex(240, 86);
          vertex(240, 94);
          vertex(232, 94);
          vertex(232, 102);
          vertex(224, 102);
          vertex(224, 110);
          vertex(200, 110);
          endShape(CLOSE);
          pop();
   } 
}

ArrayList <Bullet> bullets;
float numOfStars = 500;
PImage spaceShip;


float [] x = new float[int(numOfStars)];
float [] y = new float[int(numOfStars)];
float [] speed = new float[int(numOfStars)];
float [] bullet;
//Bullet = new Bullet();
float bulletSpeed;
boolean Bullet;










void setup() {
   bullets = new ArrayList();
  fullScreen();
  //size(500, 400);
  background(0);
  stroke(255);
  spaceShip = loadImage("Spaceship2.png");

  noCursor();



  int i = 0;
  while (i < numOfStars) {
    x[i]= random(0, width);
    y[i] = random(0, height);
    speed[i] = random(1, 5);
    i = i +1;
  }
}


void draw() {
  background(0);
  removeToLimit(100);
  moveAll();
  displayAll();
  //bulletSpeed = bulletSpeed +5;







  //draw triangle
  //triangle(mouseX,mouseY-6,mouseX +20, mouseY,mouseX, mouseY +6);

  //rotate(radians(180));{
  image(spaceShip, mouseX-10, mouseY);
  //}

  int i = 0;
  while (i < numOfStars) {
    float co = map(speed[i], 1, 5, 100, 255);
    stroke(co);
    strokeWeight(speed[i]);
    point(x[i], y[i]);



    x[i] = x[i] -speed[i]/ 2;

    if (x[i] < 0) {
      x[i] = width;
    }
    i = i+5;
  }






  //if (mousePressed == true) {
  // Bullet = true;
  //}





  //  if (Bullet == true) {
  //    rect(mouseX -10 +bulletSpeed, mouseY, 40,10);
  //    fill(#03FC3E);


  //  }







}



class Bullet//bullet class
{
  float x;
  float y;
  float speed;
  Bullet(float tx, float ty)
  {
    x = tx;
    y = ty;
  }
  void display()
  {
     rect(x,y+20, 40,10);
     rect(x,y+80,40,10);
  fill(#03FC3E);
    //stroke(255);
    //point(x,y);
  }
  void move()
  {
    x+= 20;
  }
}

void removeToLimit(int maxLength)
{
  while(bullets.size() > maxLength)
  {
    bullets.remove(0);
  }
}
void moveAll()
{
  for(Bullet temp : bullets)
  {
    temp.move();
  }
}
void displayAll()
{
  for(Bullet temp : bullets)
  {
    temp.display();
  }
}
void mousePressed()//add a new bullet if mouse is clicked
{
  Bullet temp = new Bullet(mouseX,mouseY);
  bullets.add(temp);
}

//detect forward movement.
if (key == 'w' || key == 'W' || keyCode == UP) {
  if (currentScreen == 4) {
    directiony1 = 1;
  } else {
    menu -= 1;
  }
}

//detect backward movement.
if (key == 's' || key == 'S' || keyCode == DOWN) {
  if (currentScreen == 4) {
    directiony2 = 1;
  } else {
    menu += 1;
  }
}

/detect left movement.
  if (key == 'a' || key == 'A' || keyCode == DOWN) directionx1 = 1;

//detect right movement.
if (key == 'd' || key == 'D' || keyCode == UP) directionx2 = 1;

//detect if player wants to sprint.
if (keyCode == SHIFT) run = 1;

void keyReleased() {
  //check player movement input
  if (key == 'a' || key == 'A' || keyCode == DOWN) directionx1 = 0;
  if (key == 'd' || key == 'D' || keyCode == UP) directionx2 = 0;
  if (key == 'w' || key == 'W' || keyCode == DOWN) directiony1 = 0;
  if (key == 's' || key == 'S' || keyCode == UP) directiony2 = 0;
  if (keyCode == SHIFT) run = 0;
}
}

//calculate and place enemy
enemiescount = 0;
if (width/2 - playerx - enemies[enemiescount] > -enemies[enemiescount+9] && width/2 - playerx - enemies[enemiescount] < enemies[enemiescount+9] && height/2 - playery - enemies[enemiescount+1] > -enemies[enemiescount+9] && height/2 - playery - enemies[enemiescount+1] < enemies[enemiescount+9] ) {
  if (width/2 - playerx - enemies[enemiescount] > -5 && width/2 - playerx - enemies[enemiescount] < 5 && height/2 - playery - enemies[enemiescount+1] > -5 && height/2 - playery - enemies[enemiescount+1] < 5 ) {
    if (enemies[enemiescount+10] == 0) {
      enemies[enemiescount+11] = millis();
      enemies[enemiescount+10] = 1;
    }
    if (millis() - enemies[enemiescount+11] > 10) {
      health = enemydamagetime * health - 0.5 * enemies[enemiescount+12] * damagemultiplyer;
      enemies[enemiescount+10] = 0;
    }
  } else {
    enemies[enemiescount] = enemymovementtime * int(cos(atan2(height/2-playery-enemies[enemiescount+1], width/2-playerx-enemies[enemiescount])) * enemies[enemiescount+8]*2 + enemies[enemiescount]);
    enemies[enemiescount+1] = enemymovementtime * int(sin(atan2(height/2-playery-enemies[enemiescount+1], width/2-playerx-enemies[enemiescount])) * enemies[enemiescount+8]*2 + enemies[enemiescount+1]);
  }
} else {
  if (enemies[enemiescount+4] == 0) {
    enemies[enemiescount+6] = int(random(-300, 300) + enemies[enemiescount]);
    enemies[enemiescount+7] = int(random(-300, 300) + enemies[enemiescount+1]);
    enemies[enemiescount+2] = int(random(1000, 2000));
    enemies[enemiescount+3] = millis();
    enemies[enemiescount+4] = 1;
  }
  if (enemies[enemiescount+5] == 0) {
    enemies[enemiescount] = enemymovementtime * int(cos(atan2(enemies[enemiescount+7]-enemies[enemiescount+1], enemies[enemiescount+6]-enemies[enemiescount])) * enemies[enemiescount+8] + enemies[enemiescount]);
    enemies[enemiescount+1] = enemymovementtime * int(sin(atan2(enemies[enemiescount+7]-enemies[enemiescount+1], enemies[enemiescount+6]-enemies[enemiescount])) * enemies[enemiescount+8] + enemies[enemiescount+1]);
  }
  if ( millis() - enemies[3] > enemies[2] ) {
    enemies[4] = 0;
    enemies[5] = 0;
  }
  if (enemies[enemiescount+6] - enemies[enemiescount] > -10 && enemies[enemiescount+6] - enemies[enemiescount] < 10 ) {
    if (enemies[enemiescount+7] - enemies[enemiescount+1] > -10 && enemies[enemiescount+7] - enemies[enemiescount+1] < 10 ) {
      enemies[enemiescount+5] = 1;
    }
  }
}

//move player
if (run == 0) playerspeed = 0;
if (directionx1 == 1 && directionx2 == 0 && directiony1 == 0 && directiony2 == 0) {
  playerx += (10 * (1 + playerspeed)) * playermovementtime;
}
if (directionx2 == 1 && directionx1 == 0 && directiony1 == 0 && directiony2 == 0) playerx -= (10 * (1 + playerspeed)) * playermovementtime;
if (directiony1 == 1 && directiony2 == 0 && directionx1 == 0 && directionx2 == 0) playery += (10 * (1 + playerspeed)) * playermovementtime;
if (directiony2 == 1 && directiony1 == 0 && directionx1 == 0 && directionx2 == 0) playery -= (10 * (1 + playerspeed)) * playermovementtime;

if (directionx1 == 1 && directionx2 == 0 && directiony1 == 1 && directiony2 == 0) {
  playerx += (5 * (1 + playerspeed)) * playermovementtime;
  playery += (5 * (1 + playerspeed)) * playermovementtime;
}
if (directionx2 == 1 && directionx1 == 0 && directiony1 == 0 && directiony2 == 1) {
  playerx -= (5 * (1 + playerspeed)) * playermovementtime;  
  playery -= (5 * (1 + playerspeed)) * playermovementtime;
}
if (directiony1 == 1 && directiony2 == 0 && directionx1 == 0 && directionx2 == 1) {
  playery += (5 * (1 + playerspeed)) * playermovementtime;
  playerx -= (5 * (1 + playerspeed)) * playermovementtime;
}
if (directiony2 == 1 && directiony1 == 0 && directionx1 == 1 && directionx2 == 0) {
  playery -= (5 * (1 + playerspeed)) * playermovementtime;
  playerx += (5 * (1 + playerspeed)) * playermovementtime;
}

//draw player
pushMatrix();
rectMode(CENTER);
noFill();
translate(width/2, height/2);
rect(0, 0, 20, 20);
popMatrix();
translate(width/2, height/2);

basically i'm trying to achieve a simple rectangle collision, using an array and a class. it almost works, but sometimes, rectangles don't collide/rebound, but pass through one another.. i have no clue why this is.

i'd be gracious for any help!

Bouncer[] bouncers = new Bouncer[0];
float resize = 30;
float minsize = 2;
float maxsize = 50;
float freq = 440;
float amp = 0;
float globspeed = 3.;
float boxes = 5;
float margin = 5;

void setup() {
  //frameRate(10);
  size(700, 400);
  resize = minsize;
  pmouseY = mouseY;
}

void draw() {

  background(255);
  if (mousePressed) {
    resize += 2;
    noStroke();
    rectMode(CENTER);
    fill(50);
    resize = constrain(resize, minsize, maxsize);
    rect (mouseX, mouseY, resize, resize);
  }



  for (int i = 0; i < bouncers.length; i++ ) {
    bouncers[i].move(); 
    bouncers[i].create();
    bouncers[i].collide();
  }


  float onebox = ((width - ((boxes+1)*margin)) / boxes );


  for (float i = 1; i <= boxes; i++ ) {
    rectMode(CORNER);
    noStroke();
    fill(50);
    rect((i-1.)*(onebox+margin)+margin, height-20, onebox, 20-margin);
  }
}

void mouseReleased() {
  Bouncer anotherone = new Bouncer(mouseX-resize/2, mouseY-resize/2, resize, resize-resize/2*(globspeed*-1), bouncers.length, 50);
  bouncers = (Bouncer[]) append(bouncers, anotherone);
  resize = minsize;
}

here's my class declaration:

class Bouncer {
  float posX;
  float posY;
  float size;
  float speed;
  //SinOsc sine;
  float freq = 440;
  float gravity = 1;
  int iam;
  float col;


  Bouncer(float posX_, float posY_, float size_, float speed_, int iam_, float col_) {
    posX = posX_;
    posY = posY_;
    size = size_;
    speed = speed_/10;
    iam = iam_;
    col = col_;
  }

  void create() {
    rectMode(CORNER);
    noStroke();
    fill(col);
    rect(posX, posY, size, size);
    //println(iam);
  }


  void collide() {
    for (int io = 0; io < bouncers.length; io++) {
      float x1 = bouncers[iam].posX;
      float y1 = bouncers[iam].posY;
      float s1 = bouncers[iam].size;
      float x2 = bouncers[io].posX;
      float y2 = bouncers[io].posY;
      float s2 = bouncers[io].size;
      if (x1+s1/2 >= x2-s2/2 && x1-s1/2 <= x2+s2/2) 
      { 
        if (y1+s1 >= y2 && y1 <= y2+s2) {
          bouncers[iam].speed *= -1;
          bouncers[io].speed *= -1;
          bouncers[io].col = 150;
        }
      }
    }
  }

  void move() {
    posY = posY + speed; 
    if (posY > height-size-20) {
      speed *= -1; 
      posY = height-size-20;
    } else  if (posY <= 0) {
      posY = 1;
      speed *= -1 ; 
    }
  }
}

int x=width/2;
int y=height/2;
int xSpeed=int(random(10));
int ySpeed=int(random(10));
void setup() {
  size(300, 300);
}

void draw() {
  background(0);
  x+=xSpeed;
  y+=ySpeed;
  if (x+15>=width || x-15<=0) {
    xSpeed *=-1;
  }

  if (y+15>=height || y-15<=0) {
    ySpeed *=-1;
  }
  ellipse(x, y, 30, 30);
}

However, when I try to bounce it inside of an equilateral triangle I can't figure out how I should affect the velocities on the edges that are tilted in relation to the x and y axis...

I'm trying to detect a point-triangle collision using this tutorial: http://www.jeffreythompson.org/collision-detection/tri-point.php . But my sketch is 3d, so I translating a 3d coorinates in 2d using screenX() and screenY(). The problem is that when my mouse is inside of triangle, sometimes the resulting "hit" color is blinking and I have "no hit" message. Can't understand why the collision is not working properly, it must be "hit" all the time my mouse is inside of thiangle. Any suggestions? Thanks.

import peasy.*;
PeasyCam jcam;

ArrayList <Point> points = new ArrayList <Point>();
ArrayList <Triangle> triangles = new ArrayList <Triangle>();

void setup()
{
  size(800, 800, P3D);
  smooth();
  jcam = new PeasyCam(this, 200);

  color tempColore=color(255, 255, 255);

  PVector v1= new PVector(0, 0, 0);
  Point pt1 = new Point(v1, tempColore);
  points.add(pt1);

  PVector v2= new PVector(100, 0, 0);
  Point pt2 = new Point(v2, tempColore);
  points.add(pt2);

  PVector v3= new PVector(0, 100, 0);
  Point pt3 = new Point(v3, tempColore);
  points.add(pt3);

  PVector v4= new PVector(100, 0, 0);
  Point pt4 = new Point(v4, tempColore);
  points.add(pt4);  

  PVector v5= new PVector(100, 100, 0);
  Point pt5 = new Point(v5, tempColore);
  points.add(pt5);

  PVector v6= new PVector(0, 100, 0);
  Point pt6 = new Point(v6, tempColore);
  points.add(pt6);


  //triangles initialize
  for (int i=0; i<points.size(); i=i+3)
  {
    Triangle tr = new Triangle(points.get(i).pos, points.get(i+1).pos, points.get(i+2).pos);
    triangles.add(tr);
  }

}

boolean triPoint(float x1, float y1, float x2, float y2, float x3, float y3,float mx, float my) 
  {
    // get the area of the triangle
    float areaOrig = abs( (x2-x1)*(y3-y1) - (x3-x1)*(y2-y1) );

    // get the area of 3 triangles made between the point
    // and the corners of the triangle
    float area1 =    abs( (x1-mx)*(y2-my) - (x2-mx)*(y1-my) );
    float area2 =    abs( (x2-mx)*(y3-my) - (x3-mx)*(y2-my) );
    float area3 =    abs( (x3-mx)*(y1-my) - (x1-mx)*(y3-my) );

    // if the sum of the three areas equals the original,
    // we're inside the triangle!
    if (area1 + area2 + area3 == areaOrig) 
    {
      return true;
    }
    return false;
  }


void draw()
{
  background(150);

  for (int i = triangles.size ()-1; i >= 0; i--)
  { 
    color tempColore=0;

    float ax = screenX(triangles.get(i).A.x,triangles.get(i).A.y);
    float ay = screenY(triangles.get(i).A.x,triangles.get(i).A.y);
    float bx = screenX(triangles.get(i).B.x,triangles.get(i).B.y);
    float by = screenY(triangles.get(i).B.x,triangles.get(i).B.y);
    float cx = screenX(triangles.get(i).C.x,triangles.get(i).C.y);
    float cy = screenY(triangles.get(i).C.x,triangles.get(i).C.y);
    float mx = mouseX;
    float my = mouseY;

    boolean hit = triPoint(ax,ay,bx,by,cx,cy,mx,my);

    if(hit==true)
    {
      tempColore = #A57066;
      println("hit");
    }
    else
    {
      tempColore = #CEBE9A;
      println("no hit");
    }
    triangles.get(i).display(tempColore);
  }


  for (int i = points.size ()-1; i >= 0; i--)
  { 
    points.get(i).display();
  }

}


class Point
{
  PVector pos;
  color colore;


  Point(PVector posIn, color coloreIn)
  {
    pos = posIn;
    colore=coloreIn;
  }

  void display()
  {
    colorMode(RGB);
    noStroke();
    fill(colore);
    pushMatrix();
    translate(pos.x,pos.y,pos.z);
    box(1);
    popMatrix(); 
  }
}


class Triangle
{
  PVector A, B, C;
  color colore;

  Triangle (PVector Ain, PVector Bin, PVector Cin)
  {
    A=Ain;
    B=Bin;
    C=Cin;
  }

  void display(color coloreIn)
  {
    colore = coloreIn;
    fill(colore);
    beginShape(TRIANGLE);
    stroke(255,20);
    strokeWeight(2);
    vertex(A.x,A.y,A.z);
    vertex(B.x,B.y,B.z);
    vertex(C.x,C.y,C.z);
    endShape();
  }
}

I'm a starter (I really mean starter, I have little or no clue about programming at all), and our teacher assigned us this homework in which we basically have to make 2 snakes (more like 2 independent squares) to go move around using wasd and the arrow keys and eat coins that are generated randomly. I have pretty much all I want except the part where the coins disappear.

So the question is: How do I make the coins disappear when one of the snakes collide with them?

Additional info: -I know the snakes don't move fluidly and since we are beginners the teacher told us it was okay. -There are some things in Spanish because it's my native language but I hope you won't have issues with it.

Here's my code until now:

Snake1 serpiente1;
Snake2 serpiente2;

Bol uno;
Bol dos;
Bol tres;
Bol cuatro;
Bol cinco;
Bol seis;
Bol siete;
Bol ocho;
Bol nueve;
Bol diez;


void setup(){
  size(600,600);
  serpiente1=new Snake1();
  serpiente2=new Snake2();

  uno= new Bol ();
  dos= new Bol ();
  tres= new Bol ();
  cuatro= new Bol ();
  cinco= new Bol ();
  seis= new Bol ();
  siete= new Bol ();
  ocho= new Bol ();
  nueve= new Bol ();
  diez= new Bol ();

}

  void draw (){
    background(255);``
    serpiente1.moverSerpiente();
    serpiente1.dibujaSerpiente(); 
    serpiente2.moverSerpiente();
    serpiente2.dibujaSerpiente();
    uno.dibujaMoneda();
    dos.dibujaMoneda();
    tres.dibujaMoneda();
    cuatro.dibujaMoneda();
    cinco.dibujaMoneda();
    seis.dibujaMoneda();
    siete.dibujaMoneda();
    ocho.dibujaMoneda();
    nueve.dibujaMoneda();
    diez.dibujaMoneda();


}

class Snake1{
float posx;
float posy;
float ancho;
float alto;
color c;
//constructor
Snake1 (){
  posx=30;
  posy=30;
  ancho=25;
  alto=25;
  c=color(random(255),random(255),random(255));
}

void moverSerpiente(){
  if (keyCode == UP){
    posy=posy-3;
    if(posy<0)
    posy=600;
  }
  else if (keyCode == DOWN){
    posy=posy+3;
    if(posy>600)
    posy=0;
  }
  else if (keyCode == RIGHT){
    posx=posx+3;
    if(posx>600)
    posx=0;
  }
  else if (keyCode == LEFT){
    posx=posx-3;
    if(posx<0)
    posx=600;
  }
}

  void dibujaSerpiente(){
    fill(c);
    rect(posx, posy, ancho, alto);
  }
}
class Snake2{
float posx;
float posy;
float ancho;
float alto;
color c;

//constructor
Snake2 (){
  posx=550;
  posy=550;
  ancho=25;
  alto=25;
  c=color(random(255),random(255),random(255));
}

void moverSerpiente(){
  if (key == 'w'){
    posy=posy-3;
    if(posy<0)
    posy=600;
  }
  else if (key == 's'){
    posy=posy+3;
     if(posy>600)
    posy=0;
  }
  else if (key == 'd'){
    posx=posx+3;
    if(posx>600)
    posx=0;
  }
  else if (key == 'a'){
    posx=posx-3;
     if(posx<0)
    posx=600;
  }
}

  void dibujaSerpiente(){
    fill(c);
    rect(posx, posy, ancho, alto);
  }
}

class Bol{
  float posx;
  float posy;
  float ancho;
  float alto;

  Bol(){
    posx=random(570);
    posy=random(570);
    ancho=15;
    alto=15;
  }

  void dibujaMoneda(){
    fill(250,250,0);
    ellipse(posx,posy,ancho,alto);
  }
}

I hope you guys can help me out! Thanks.

I'm trying to make Pong using Object Orientated Programming as an exercise.

Right now I've gotten to the point of trying to get the ball to bounce off the paddle if they intersect.

I'm pretty sure my logic is correct? If the current distance of the middle of rectangle and the middle of circle is less then middle of circle + middle of rectangle, then it is colliding. I separate these into x and y because the rectangle has 2 different length sides for x and y. If either x OR y is true, true.

Note I've kept in some commented stuff to show some other attempts... dunno if I should be using "this.other" type stuff or should I have an update function?

I've tried writing that out as an if statement but my current distance number seems stagnant, when it should be constantly changing. I'm very new just started learning this year, so I might need very basic laymen's terms! :P

Here's my code so far, I have seperated it into sketch.js and objects.js

var p1;
var xspeed = 3;
var yspeed = 3;

function setup() {
    createCanvas(400, 400);
    p1 = new player1();
    b = new ball();
}

function draw() {
    background(51);
    p1.show();
    p1.move();
    b.show();
    b.move();
    b.edges();
    console.log(b.currentX, b.currentY);
    if (b.hit(p1)) {
        console.log("hit");
        // xspeed = xspeed * -1;
        // yspeed = yspeed * -1;
    }
}

function keyPressed() {
    if (keyCode === 87) {
        p1.setDir(-1);
    } else if (keyCode === 83) {
        p1.setDir(1);
    }
}

function keyReleased() {
    p1.setDir(0);
}

function player1() {
    this.x = 20;
    this.y = height / 2;
    this.w = 12;
    this.h = 64;

    this.ydir = 0;

    this.show = function () {
        fill(255);
        rect(this.x, this.y, this.w, this.h);
    }

    this.setDir = function (dir) {
        this.ydir = dir;
    }

    this.move = function (dir) {
        this.y += this.ydir * 5;
    }
}

function ball() {
    this.x = 100; //Start location of ball
    this.y = 25;
    this.r = 5;
    this.currentX = p1.w / 2 + this.r; //Less than this x number = colliding
    this.currentY = p1.h / 2 + this.r; //Less than this y number = colliding
    this.distX = p1.w / 2 + this.x; //Current x dist of mid of ball and rect
    this.distY = p1.h / 2 + this.y; //Current y dist of mid of ball and rect

    this.show = function () {
        fill(255);
        ellipse(this.x, this.y, this.r * 2);
    }

    this.move = function () {
        this.x = this.x + xspeed;
        this.y = this.y + yspeed;
    }

    this.edges = function () {
        if (this.y > height || this.y < 0) {
            yspeed = yspeed * -1;
        }
        if (this.x > height || this.x < 0) {
            xspeed = xspeed * -1;
        }
    }
    // this.hit = function () {
    //  var dx = dist(this.x.pos, p1.x.pos);
    //  var dy = dist(this.y.pos, p1.y.pos);
    //  if (dx < this.r + p1.x / 2 || dy < this.r + p1.y / 2) {
    //      return true;
    //  } else {
    //      return false;
    //  }
    // }
    this.hit = function (other) {
        if (this.distX > this.currentX || this.distY > this.currentY) {
            //distX, distY is current distance of middle of circle and rect
            //If dist x is more then rect.w/2 + r = true
            //If dist y is more then rect.h/2 + r = true
            return true;
        } else {
            return false;
        }
    }
}

I'm a Processing amateur, I don't know much yet about Processing, but the thing is, I have spent the last two days trying to figure out HOW TO Make a Ball Collide a Diagonal line.

I used something like this to make the ball collide a straight line (x or y):

if (position of the ball is bigger than 'this X'){ make the ball change direction; }

BUT i haven't been able to apply this to a diagonal.

PLEASE Help me.... I am very obsessed with this.

Thank you very much!!

Here is the code:

    boolean isIntersectingWith(Circle other) {
        int thisVertexCount =shp.getVertexCount();
        int otherVertexCount = other.shp.getVertexCount();

        float distanceBetweenObjets = dist(x,y, other.x,other.y);
        if(distanceBetweenObjets < r + other.r){  //if the distance between centers is large don't check segment by segment collision
        for (int i = 0; i < thisVertexCount; i++) {
          int iPlusOne = i+1;
          if (iPlusOne>= thisVertexCount) { //wraps around to make the segment of the last element and the first.
            iPlusOne -=thisVertexCount;
          }
          for (int j = 0; j < otherVertexCount; j++) {
            int jPlusOne = j+1;
            if (jPlusOne>= otherVertexCount) {
              jPlusOne -=otherVertexCount;
            }

            PVector thisP1, thisP2, otherP1, otherP2;
            thisP1 = new PVector(x, y);
            thisP1.add(shp.getVertex(i).mult(shapeScale));

            thisP2 = new PVector(x, y);
            thisP2.add(shp.getVertex(iPlusOne).mult(shapeScale));

            otherP1 = new PVector(other.x, other.y);
            otherP1.add(other.shp.getVertex(j).mult(other.shapeScale));

            otherP2 = new PVector(other.x, other.y);
            otherP2.add(other.shp.getVertex(jPlusOne).mult(other.shapeScale));


            if (lineIntersect(thisP1, thisP2, otherP1, otherP2) != null) {
              return true;
            }
          }
        }
        }
        return false;
      }

      PVector lineIntersect(float x1, float y1, float x2, float y2, float x3, float y3, float x4, float y4) {
        double denom = (y4 - y3) * (x2 - x1) - (x4 - x3) * (y2 - y1);
        if (denom == 0.0) { // Lines are parallel.
          return null;
        }
        double ua = ((x4 - x3) * (y1 - y3) - (y4 - y3) * (x1 - x3))/denom;
        double ub = ((x2 - x1) * (y1 - y3) - (y2 - y1) * (x1 - x3))/denom;
        if (ua >= 0.0f && ua <= 1.0f && ub >= 0.0f && ub <= 1.0f) {
          // Get the intersection point.
          return new PVector((int) (x1 + ua*(x2 - x1)), (int) (y1 + ua*(y2 - y1)));
        }

        return null;
      }
      PVector lineIntersect(PVector p1, PVector p2, PVector p3, PVector p4) {
        return lineIntersect(p1.x, p1.y, p2.x, p2.y, p3.x, p3.y, p4.x, p4.y );
      }

Any suggestions are appreciated

Thanks

PS: sorry for my English its my second language

//Draggable draggable;
PFont p;
NullDraggableObject nullDraggableObject;
ArrayList draggables;
PImage font;

void setup(){
    size(420,500);
    smooth();
    nullDraggableObject = new NullDraggableObject();
    draggables = new ArrayList();
    for (int i=0; i < 10   ;i++){
      draggables.add(new Circle(random(width), random(height/2)));
    }
    font = loadImage("universe.jpeg");
    p = createFont("Arial",18);
    textFont(p);
}

void draw(){
   image(font,0,0);
   stroke(255);
   fill(0,255,0);
   text("Objects",10,height-40);
   noFill();
   strokeWeight(3);
   draggable = nullDraggableObject;
   for(int i=0; i < draggables.size() ;i++){
       Draggable d = (Draggable)draggables.get(i);
       d.draw();
       if( d.isMouseOverFigure() )
          draggable = d;
   }
}

void mousePressed(){
   draggable.mousePressed();
}

void mouseDragged(){
   draggable.mouseDragged();
}

void mouseReleased(){
   draggable.mouseReleased();
}

// public class Circle  implements Draggable {
     float x;
     float y;
     float radio;
     boolean drag;
     float dragX;
     float dragY;
         Circle(float a, float b){
         this.x = a;
         this.y = b;
         this.radio = random(20,50);
         drag = false;
         dragX = 0;
         dragY = 0;
     }
     
     boolean isMouseOverFigure(){
         return in(mouseX, mouseY);
     }
     
     boolean in(float ix, float iy){
         return ( dist(this.x, this.y, ix, iy) < this.radio );
     }
     
     void draw(){
        ellipseMode(CENTER);
        ellipse(x,y,2*radio,2*radio);
        
     }
     
     void mousePressed(){
         drag = in(mouseX, mouseY);
         if(drag){
             dragX = mouseX - x;
             dragY = mouseY - y;
         }
     }
     void mouseDragged(){
        if(drag){
           x = mouseX -dragX;
           y = mouseY - dragY;
        }
     }
     
     void mouseReleased(){
        drag = false;
     }
     
     
}     

interface Draggable{
     boolean isMouseOverFigure();
     boolean in(float ix, float iy);
     void draw();
     void mousePressed();
     void mouseReleased();
     void mouseDragged();
}

class NullDraggableObject implements Draggable{
     boolean isMouseOverFigure(){
         return false;
     }
     boolean in(float ix, float iy){
         return false;
     }
     void draw(){}
     void mousePressed(){}
     void mouseReleased(){}
     void mouseDragged(){}
   
}

I want to make a function where the different elements (images and shapes) does not overlap each other. The positions of the different elements are random. So in every circumstances (positions) the elements does not reach each other. I have to do this with a if / else statement. Can somebody help me with this issue? Thanks

Asteroid drawAsteroid; void setup() { drawAsteroid = new Asteroid(); }

lets say i wanted two asteroids that had different x values (lets say the different x values were already coded, just focus on the two asteroids)i would do something like this right?

Asteroid drawAsteroid1; Asteroid drawAsteroid2; void setup(){ drawAsteroid1 = new Asteroid(); drawAsteroid2 = new Asteroid(); }

Well i could just make a new asteroid every time i wanted 1 more, is there a simpler way to create more (like if i had to make 1000000000 asteroids and was on a time schedule meaning i couldnt code 1 million asteroids manually) how would i do that?

Thanks - cloudi

var gravity = 0.1;
var balls = [];
var n = 0;


function setup() {
  createCanvas(400, 400);
  Paddle = new Paddle(180, height / 4 * 3);
  for (n = 0; n < 7; n++) {
    append(balls, new Ball(random(width), random(height)));
  }
}

function draw() {
  background(51);
  Paddle.display();
  Paddle.borders();

  for (n = 0; n < balls.length; n++) {
    balls[n].display();
    balls[n].move();
  }

for (i = 0; i < balls.length; i++){
 if (balls[i].intersects(Paddle)) {
   balls[n].bounce();
 } 
}

}

function mouseClicked() {
  if (n < 9 && mouseY < height - 50) {
    append(balls, new Ball(mouseX, mouseY));
  }
}

function keyPressed() {
  if (keyCode === RIGHT_ARROW) {
    Paddle.move(1);
  } else if (keyCode === LEFT_ARROW) {
    Paddle.move(-1);
  }
}

function Paddle(x, y) {
  this.x = x;
  this.y = y;
  this.r = 25;

  this.move = function(dir) {
    this.x += dir * 15;
  }
  this.borders = function() {
    if (this.x > width)
      this.x = 0;
    if (this.x < 0)
      this.x = width;
  }
  this.display = function() {
    stroke(0, 255, 0);
    fill(0, 255, 0);
    rectMode(CENTER);
    rect(this.x, this.y, this.r * 4, this.r * 2)
  }
}

function Ball(x, y) {
  this.x = x;
  this.y = y;
  this.r = 25;
  this.yspeed = 0.1;
  //  this.toBounce = false;

  this.move = function() {
    this.y += this.yspeed;
    this.yspeed += gravity;

    if (this.y > height) {
      this.y = height;
      this.yspeed *= -1
    }
    if (this.y < 0) {
      this.y = 0;
      this.yspeed *= -1
    }
  }
    this.intersects = function(Paddle) {
    var d = dist(Ball.x, Ball.y, Paddle.x, Paddle.y);
    if (d < Ball.r + Paddle.y) {
      return true;
    } else {
      return false;
    }
  }
  this.bounce = function() {
    this.y = this.y *= -1
    this.yspeed *= -1;
  }

  this.display = function() {
    stroke(255)
    fill(255, 0, 0);
    ellipse(this.x, this.y, this.r * 2, this.r * 2);
  }
}

void setup () { size(700, 700); cars = new ArrayList(); for (int count=0; count < 20; count=count+1) { cars.add(new Car()); } f=createFont("Arial", 24, true); x1= width-690; y1=height-10; x2=true; lives1=10; }

void draw () { background(255); fill(#0EFF03); rect(mouseX, mouseY, 30, 50) ; lives() ; for (int count=0; count < 20; count=count+1) { cars.get(count).display(); cars.get(count).move(); } }

void lives() { textFont(f); fill(245, 200, 0); text("lives:" + lives1, x1, y1); }

tab 2: class Car { float x, y; float speed;

Car() { x = random(10, width-10); y = 0; speed = random(1, 5); }

void display () { fill(255, 0, 0); noStroke(); rect(x, y, 30, 50); }

void move() { y = y + speed; if(y > height) { y = 0; x = random(10, width-10); } }

void losinglives1(){ if (dist(x, y, mouseX, mouseY)<15) { lives1=lives1-1; } } }

The rectangles should not have collision with others, and the balls with rectangles too.

I have created the rectangles, they come down, and when they reached the end of the page, they start over, and the Ball object will be created every time the user click the mouse, till the number of balls reach 15.

I know the code doesn't look good, still new and learning.

Thanks a lot.

There is the code I have written so far:

import java.util.Arrays;
import java.util.Collections;
import java.util.Vector;

float e = 1.0;
ArrayList<Particle> particles;
float radious = random(10, 50);
PVector loc = new PVector(random(radious, width - radious), random(radious, height - radious));
PVector currentPos;
Brick brick_1 = new Brick(random(650), random(650), 2);
ArrayList<Brick> bricks = new ArrayList<Brick>();

void setup() {
size(800, 800);
frameRate(60);
particles = new ArrayList<Particle>();
while (bricks.size() < 7) {
bricks.add(new Brick(random(650), random(650), 2));
}
}

void draw() {
background(0);

// Ball Object START
for (Particle p : particles) {
p.display();
}
for (Particle p : particles) {
p.collide();
}
for (Particle p : particles) {
p.update();
}
for (int i = 0; i < 7; i++) {
Brick one = bricks.get(i);
one.display();
}
ArrayList<Float> list = new ArrayList<Float>();
Brick first_brick = bricks.get(0);
Brick second_brick = bricks.get(1);
Brick third_b = bricks.get(2);
Brick forth_b = bricks.get(3);
Brick fifth_b = bricks.get(4);
Brick sixth_b = bricks.get(5);
Brick seventh_b = bricks.get(6);
list.add(first_brick.getPosition());
list.add(second_brick.getPosition());
list.add(third_b.getPosition());
list.add(forth_b.getPosition());
list.add(fifth_b.getPosition());
list.add(sixth_b.getPosition());
list.add(seventh_b.getPosition());
float this_is_the_min = Collections.min(list);
if (this_is_the_min > height + 20) {
bricks.clear();
for (int i = 0; i <7; i++) {
bricks.add(new Brick(random(650), random(650), 2));
}
}
}
void mousePressed() {
if (particles.size() < 15) {
float radious = random(10, 50);
PVector loc = new PVector(random(radious, width - radious), random(radious, height - radious));
particles.add( new Particle(loc, radious));
}
}


Brick Class

class Brick {
float x;
float y;
float bx;
float by;
float vbx = -1;
float vby = -1; //vbx is fixed;
color c;
Brick (float bx, float by, float vby) {
this.bx=bx;
this.by=by;
this.vby=vby;
c=color(random(255), random(255), random(255));
}

void display() {
fill(c);
noStroke();
rect(bx, by, 100, 30);
by = by + vby;
}

float getPosition () {
PVector v1 = new PVector(0, 0, 0);
PVector buffer = new PVector (bx, by);
float d = buffer.dist(v1);
return d;
}
}

Ball Class (taken from open processing)

class Particle {

PVector loc, vel, nvel;
float radious;
float mass;
color c;
Particle(PVector _loc, float _radious) {
loc = _loc;
float velSize = random(0.5, 3);
float velAngle = random(TWO_PI);
vel = new PVector(velSize * cos(velAngle), velSize * sin(velAngle));
radious = _radious;
mass = sq(radious) * PI;
c=color(random(255), random(255), random(255));
}

void display() {
fill(c);
noStroke();
ellipse(loc.x, loc.y, radious * 2, radious * 2);
}

void collide() {
nvel = new PVector(vel.x, vel.y);
for (Particle p : particles) {
if (p != this && PVector.dist(loc, p.loc) < radious + p.radious) {
nvel = PVector.sub(loc, p.loc);
nvel.normalize();
nvel.mult(PVector.dot(PVector.sub(p.vel, vel), nvel));
nvel.mult(1 + e);
nvel.mult(p.mass / (mass + p.mass));
nvel.add(vel);
break;
}
}
}

void update() {
vel = nvel;
loc.add(vel);
if (loc.x < radious) {
vel.x *= -1;
loc.x += vel.x;
}
if (loc.x > width - radious) {
vel.x *= -1;
loc.x += vel.x;
}
if (loc.y < radious) {
vel.y *= -1;
loc.y += vel.y;
}
if (loc.y > height - radious) {
vel.y *= -1;
loc.y += vel.y;
}
}
}