Need some help with cursor interaction with objects

Basically, I want to code something where when the cursor hovers over a circle shape, another shape (the heart) will rotate smoothly and change colours until the circle changes position. The aim of it is for you to keep chasing for the circle.

Here is my code:

def setup():
    size(800, 600)
    frameRate(0.4)
    global randomx, randomy
    
def draw():
    randomx = random(width)
    randomy = random(height)
    background(255)
       
    # heart drawing
    createShape()
    smooth()
    noStroke()
    fill(255, 196, 224)
    beginShape()
    vertex(width/2, height/7*3.2) 
    bezierVertex(width/2, height/5*1.4, width/10*8, height/7*3, width/2, height/7*5) 
    vertex(width/2, height/7*3.2)
    bezierVertex(width/2, height/5*1.4, width/10*2, height/7*3, width/2, height/7*5)
    endShape()
    
    # circle in random place
    fill(255, 145, 201);
    circle(randomx, randomy, 50);
    
    # if cursor is hovering over circle
    if (dist(randomx, randomy, mouseX, mouseY) <= 50):
        createShape()
        smooth()
        noStroke()
        fill(random(255), random(255), random(255))
        rotate(2)
        beginShape()
        vertex(width/2, height/7*3.2) 
        bezierVertex(width/2, height/5*1.4, width/10*8, height/7*3, width/2, height/7*5)
        vertex(width/2, height/7*3.2)
        bezierVertex(width/2, height/5*1.4, width/10*2, height/7*3, width/2, height/7*5)
        endShape()

So far when my mouse hovers over the pink circle, nothing happens, and I’m not too sure how I should change it. Any advice?

Also, since I want the heart to keep rotating and changing colours while the cursor is on the circle, I’m not that sure how this would work as the framerate is still 0.4. What can I do about that?

Thank you very much!

1 Like

I would place this in setup()

Then instead of frameRate(0.4) better use a timer with 4 seconds or so

like here (in Java)

int xPos = 0;
int timer1 ;

void setup() { 
  size(400, 400);
  noStroke();
} 

void draw() { 
  background(220);

  fill(255, 200, 40);
  rect(xPos, 30, 40, 40);

  if (millis() - timer1 > 1100) {
    xPos+=10; 
    timer1=millis();
  }
}
//
1 Like

Hello @adora,

Example:

x = 0
y = 0

def setup():
    size(300, 300)
    
def draw():
    background(255)
    if frameCount%180 == 0:
        global x 
        x = random(width)
        global y 
        y = random(height)
        println(int(x));
        println(int(y));
    
    # if cursor is hovering over circle
    if (dist(x, y, mouseX, mouseY) <= 25):
        fill(0, 255, 0);
    else:
        fill(255, 0, 0);    
    
    # circle in random place        
    circle(x, y, 50);     

:)

3 Likes