PImage[] frames = new PImage[12];

int currentFrame = 0;       // displayed frame
int timer = 5;              // number of frames before the next

void setup()
{
  size(320, 220);
  smooth();
  background(0);
  frameRate(60);
  
  for(int i = 0; i < frames.length; i ++) {
    frames[i] = loadImage("horse-"+(i+1)+".png");
  }
}

void draw() 
{
  // draw the image
  image(frames[currentFrame],0,0);
  // scrubbing ala iMovie
  if(mousePressed) {
    currentFrame = constrain((frames.length*mouseX)/width,0,frames.length-1);
    timer = 10; 
  } else {
    // advance if the timer is done, or decrese the timer
    if(timer == 0)  {
      currentFrame = (currentFrame+1)%frames.length;
      timer = 5;
    }
    else timer--;
  }
  
  // draw the frame bar
  fill(0); noStroke(); rect(0,height-20,width,20);
  for(int i = 0; i < frames.length; i ++) {
    stroke(128); strokeWeight(3);
    point(width*(i+0.5)/(frames.length),height-10);
  }
  stroke(255);
  point(width*(currentFrame+0.5)/(frames.length),height-10);
}

// START NO NOTES
// code used to capture screenshots
void keyReleased() {
  if(key == '`' && !online) save("sketch.png");
}