Back to Parent

Photo bigImage; //full display image
int days = 0; // days passed
int headerY = 0;
int headerW = 200;
int margin = 40;
int imgSize = 280;
int bigImgSize = 700;
int maxCol = 3;
int scrollSpeed = 20;

int totalPhotos = 18; //how many photos to start
String mode = "gallery";
ArrayList<Photo> photos = new ArrayList<Photo>();

void setup() {
  size(1000, 900);
  int currCol = 0;
  int currRow = 0;
  //load gallery and store photo locations
  for (int x = 0; x < totalPhotos; x++) {
    photos.add(new Photo(loadImage("IMG_"+(x+1)+".png"), 
    margin + currCol * (margin + imgSize), 
    margin + currRow * (margin +imgSize) + headerW));
    currCol ++;
    if (currCol > maxCol - 1) {
      currCol = 0;
      currRow ++;
    }
  }
}

void draw() {
  background(250);
  if (mode == "gallery") {
    drawHeader();
    galleryUpdate();
    // draw gallery
    int currCol = 0;
    int currRow = 0;
    for (int x = 0; x < photos.size(); x++) {
      photos.get(x).display(); }
  }
  else if (mode == "display") {
    // draw full display mode
    bigImage.fullDisplay();
  }
}

void drawHeader() {
  fill(#101317);
  rect(0, headerY, width, headerW);
  textSize(50);
  fill(#F5F5F5);
  text("Fading Photo Album", width/2, headerY + headerW-20);
  textAlign(CENTER);
  
  textSize(30);
  text("Days passed: " + days, width/2, headerY + headerW/3);
  fill(#F5F5F5);
}

void galleryUpdate() {
  // check if each image is hovered or clicked
  for(int i=0; i<photos.size(); i++) {
    Photo photo = photos.get(i);
    if (photo.overImage(mouseX, mouseY)){
      photo.selected = true;
      if (mousePressed){
        photo.recalls++; //increment num recalls
        bigImage = photo;
        mode = "display";
      }
    }
    else {photo.selected = false;}
  }
}

//handle key presses
void keyPressed() {
  if (mode == "gallery"){
    if (keyCode == DOWN){
      movePhotos(-scrollSpeed);
      headerY -= scrollSpeed;
    }
    if (keyCode == UP){
      movePhotos(scrollSpeed);
      headerY += scrollSpeed;
    }
    if (keyCode == CONTROL) {days++;} //increment days passed
    if (key == 114) {resetPhotos();} //reset days and photo recalls
  }
  else if (mode == "display" && keyCode == ENTER) {
    mode = "gallery";
  }
}

//scroll photos up and down
void movePhotos(int dir) {
    for(int i=0; i<photos.size(); i++) {
    Photo photo = photos.get(i);
    photo.yPos += dir;
  }
}

//resets photo recalls
void resetPhotos(){
  days = 0;
  for(int i=0; i<photos.size(); i++) {
    photos.get(i).recalls = 0;
  }
}

boolean overRect(int x, int y, int w, int h) {
  if ( mouseX >= x && mouseX <= x + w && 
      mouseY >= y && mouseY <= y + h) {
    return true; } 
  return false;
}

//Photo objects
class Photo {
  PImage pic;
  int xPos;
  int yPos;
  int recalls; //how often photo is viewed
  int age; // how old photo is
  boolean selected = false;

  // Constructor defined with arguments.
  Photo(PImage selectedImage, int x, int y) { 
    pic = selectedImage;
    xPos = x;
    yPos = y;
  }
  
  boolean overImage(int x, int y)  {
    return overRect(xPos, yPos, imgSize, imgSize);
  }

  // draw gallery display
  void display() {
    if (selected) {
      tint(255, 126);
      drawText();
    }
    else applyFade();
    image(pic, xPos, yPos, imgSize, imgSize);
    noTint();
    if (selected) {
      drawText();
    }
  }
  
  //draw hover text
  void drawText(){
    textSize(50);
    text(recalls, xPos + imgSize/2 - 10, yPos + imgSize/2);
    fill(#101317);
  }
  
  // draw full display
  void fullDisplay(){
    applyFade();
    image(pic, width/2 - bigImgSize/2, height/2 - bigImgSize/2 + 50, bigImgSize, bigImgSize);
    fill(#101317);
    rect(0, 0, width, headerW/2);
    textSize(40);
    
    fill(#F5F5F5);
    text("Recalls: " + recalls, width/2, height/10);
    textAlign(CENTER);
    fill(#0B2146);
  }
  
  //set the fade value for each photo
  void applyFade(){
    tint(255, 280 - days*10 + recalls*50);
  }
}
Click to Expand

Content Rating

Is this a good/useful/informative piece of content to include in the project? Have your say!

0