mouse pressed - OpenProcessing

mySketch
xxxxxxxxxx
 
//declare array
let imgSunsetA = [];
let formatOurPNG = [];
let animations = [];
let seq;
​
​
​
function preload(){
//initialise array with 52 spots in it, one for each png
// CHANGE 52 TO BE THE NUMBER OF FRAMES YOU HAVE
  for(let i = 0; i < 37; i++){
    //makes our [i] into a 3 digit number - 0 becomes 000
    formatOurPNG[i] = (nf(i,3));
    // use formatOurPNG to get the correct name of the files and then load one PNG per spot in the array
    imgSunsetA[i] = loadImage('./'+formatOurPNG[i]+'.png');
  }//end for loop
}//end preload
​
​
​
function setup() {
  createCanvas(windowWidth, windowHeight);
  // Set the sequence array...
   seq = [imgSunsetA.length];
​
}
​
​
​
function draw() {
  background(255,100,50);
  
  // Display, cycle, and move all the animation objects
  for (let i = 0; i < animations.length; i ++ ) {
    animations[i].display();
    animations[i].next();
    animations[i].move();
  }
  console.log("Message from Louise: Number of animations in the array is currently:" + animations.length);
}
​
function mousePressed() {
  let myW = random(200,500);
  let myH = myW/1.5;  
  animations.push(new Animation(seq,mouseX,mouseY,myW,myH));
}
​
​
// ****************** And in Another Universe **********************
​
​
​
// The animation object
​
class Animation {
  
  constructor(sequence,x_,y_,w_,h_){
    this.x=x_; // location for Animation
    this.y=y_; // location for Animation
    this.w=w_;
    this.h=h_;
    
    // The index into the array is a float!
    // This allows us to vary the speed of the animation
    // It will have to be converted to an int before the actual image is displayed    
    this.index = 0;
    
    // Speed, this will control both the animations movement
    // as well as how fast it cycles through the images
    this.speed = 1;
    this.direction = random(-1,1);
    
  }
​
​
  display() {
    // We must convert the float index to an int first!
    this.imageIndex = int(this.index);
    image(imgSunsetA[this.imageIndex], this.x, this.y,this.w,this.h);
  }
​
  move() {
    // Drifts on two axes
    this.x += this.direction;
    this.y += this.direction;
    if (this.x > width) {
      this.x = 0;
    }
    if (this.y > width) {
      this.y = 0;
    }   
  }
​
  next() {
    // Move the index forward in the animation sequence
    this.index += this.speed;
    // If we are at the end, go back to the beginning
    if (this.index >= imgSunsetA.length) {
      this.index = 0;
    } 
  }
}