ArrayList<Point> points = new ArrayList<Point>();
int margin = 250;
int imgSize = 190;
String message = "";
PImage img;
int maxCols = 9;
int maxRows = 5;
int hover = 0; //hover cell index
int fontSize = 35;

void setup()
{
    fullScreen();
    noStroke();
    background(#FCFCFC);
    img = loadImage("whiteDot.png");
    
    //load message
    String[] lines = loadStrings("breakup.txt"); 
    for (int i = 0 ; i < lines.length; i++) {
      message += "\n" + (lines[i]); // add line to message
    }
    
    // load grid
    int currCol = 0; int currRow = 0;
    for (int x = 0; x < maxCols * maxRows; x++) {
      points.add(new Point (margin + currCol * imgSize, margin + currRow * imgSize)); 
      currCol ++;
      if (currCol >= maxCols) {
        currCol = 0;
        currRow ++;
      }
    }
    
    textSize(fontSize);
    fill(50); //set black text
    text(message, margin, margin, width - margin*2, height - margin*2);
}
void draw()
{
    fill(#FCFCFC); //set white fill
    for (int x = 0; x < points.size(); x++) {
      points.get(x).drawCell(); //draw circles
    }
    points.get(hover).drawHover();

}

void keyPressed() {
  if (keyCode == ENTER){
    points.get(hover).selected = true;
  }
  else if (keyCode == LEFT && hover > 0) {
    hover -= 1;
  }
  else if (keyCode == RIGHT && hover < maxRows*maxCols - 1) {
    hover += 1;
  }
  else if (keyCode == UP && hover - maxCols >= 0) {
    hover -= maxCols;
  }
  else if (keyCode == DOWN && hover + maxCols < maxRows*maxCols){
    hover += maxCols;
  }
}

class Point {
  int xPos;
  int yPos;
  boolean selected = false;

  // constructor defined with arguments.
  Point(int x, int y) {
    xPos = x;
    yPos = y;
  }
  
  // draw cell
  void drawCell(){
    if (selected) //circle if selected
      image(img, xPos - imgSize*1.5/2 , yPos - imgSize*1.5/2 , 
      imgSize*1.5, imgSize*1.5);
    else
      noFill(); //grey cell
      stroke(153);
      rect(xPos - imgSize/2, yPos - imgSize/2, imgSize, imgSize);
  }
  
  //draw hovered cell
  void drawHover(){
      stroke(204, 102, 0); //orange
      strokeWeight(0.8);
      rect(xPos - imgSize/2, yPos - imgSize/2, imgSize, imgSize);
      strokeWeight(0.05);
  }
    
}