Project 3- Dynamic Drawing

// GRAHAM MURTHA
// Section A

let opacity = 100;

var dir = 1
var fill = 50
var angle = 0


function setup() {
    createCanvas(600, 450);
    background(0);
    text("p5.js vers 0.9.0 test.", 10, 15);

}



function draw() {
let x = mouseX;
let y = mouseY;
let ix = width - mouseX;  // Inverted X
let iy = height - mouseY; // Inverted Y
background(0,0,50) // dark blue

//ellipse SET 1
    fill(255,0,255, opacity); //purple
    ellipse(x, height/2, y/2, y/2);

    fill(255,255,0, opacity); //yellow
    ellipse(ix, height/2, iy/2, iy/2);
    
    
    translate(width/2,height/2) //moving origin of rotating orbs to center
    push() ;


//ellipse SET 2
    rotate(radians(angle)+45)
    fill(255,0,255, opacity); //purple
    ellipse(x, height/2, y/2, y/2);
    fill(255,255,0, opacity); //yellow
    ellipse(ix, height/2, iy/2, iy/2);
    pop();
    angle -=.2
    

//ellipse SET 3
    rotate(radians(angle)+90)
    fill(255,0,255, -opacity); //purple
   ellipse(x/2, height/4, y/4, y/4);
    fill(255,255,0, opacity); //yellow
    ellipse(ix/2, height/4, iy/4, iy/4);
    pop();
    angle +=.2


//ellipse SET 4
    rotate(radians(angle)+135)
    fill(255,0,255, opacity); //purple
    ellipse(x/2, height/4, y/2, y/2);
    fill(255,255,0, opacity); //yellow
    ellipse(ix/2, height/4, iy/2, iy/2);
    pop();
    angle -=.2

    
//ellipse SET 5
    rotate(radians(angle)+180)
    fill(255,0,255, opacity); //purple
    ellipse(x/2, height/4, y/4, y/4);
    fill(255,255,0, opacity); //yellow
    ellipse(ix/2, height/4, iy/4, iy/4);
    pop();
    angle +=.2

//ellipse SET 6
    rotate(radians(angle)+225)

    fill(255,0,255, opacity); //purple
    ellipse(x/2, height/4, y/2, y/2);

    fill(255,255,0, opacity); //yellow
    ellipse(ix/2, height/4, iy/2, iy/2);

    pop();
    angle -=.2


//ellipse SET 6
    rotate(radians(angle)+225)
    fill(255,0,255, opacity); //purple
    ellipse(x/2, height/4, y/4, y/4);
    fill(255,255,0, opacity); //yellow
    ellipse(ix/2, height/4, iy/4, iy/4);
    pop();
    angle +=.2


    //ellipse SET 7
    rotate(radians(angle)+360)
    fill(255,0,255, opacity); //purple
    ellipse(x/2, height/4, y/2, y/2);
    fill(255,255,0, opacity); //yellow
    ellipse(ix/2, height/4, iy/2, iy/2);
    pop();
    angle -=.2
}



    
//change in the opacity of the circles
function mouseMoved() {
    opacity = map(mouseX, 0, 300, 600, 50, 255, 50) 
    opacity = map(mouseY, 0, 225, 450, 50, 255, 50) 
}

//As the mouse moves further right and further downwards, the opacity of ALL of the spheres will change