var buttons;

​

​

function setup() {

  createCanvas(600, 400);

  textSize(20)

  fill("yellow")

  textAlign(CENTER)

  //ellipseMode(CENTER, CENTER)

  buttons = []

  background(220);

  var border = 50

  for (var i in items){

    var item = items[i]

    xPos = map(item.year, 1966, 2019, border, width-border )

    myButton = new Clickable();     //Create button

    myButton.locate(xPos, width/2);        //Position Button

    myButton.text = item.name

    myButton.onPress = function(){  //When myButton is pressed

      this.color = "#AAAAFF";       //Change button color

      alert("Yay! its " + item.year); //Doesn't seem to work?¿

    }

    buttons.push(myButton)

  }

}

​

function draw() {

  for (b in buttons){

    var button = buttons[b]

    button.draw()

  }

    /*  OR JUST

    text(item.name, xPos, width/2)

    ellipse(xPos, width/2 + 50, 40, 40)

    */

}