/**
 * Words. 
 * 
 * The text() function is used for writing words to the screen.
 * The letters can be aligned left, center, or right with the 
 * textAlign() function. 
 */
  
var f;
  
function setup() {
  var canvas = createCanvas(640, 360);
  canvas.parent("p5container");
  
  // Create the font
  //printArray(PFont.list());
  //f = "Georgia";
  textFont("Source Code Pro", 24);
}

function draw() {
  background(102);
  noStroke();
  fill(255);
  textAlign(RIGHT);
  drawType(width * 0.25);
  textAlign(CENTER);
  drawType(width * 0.5);
  textAlign(LEFT);
  drawType(width * 0.75);
}

function drawType(x) {
  line(x, 0, x, 65);
  line(x, 220, x, height);
  fill(0);
  text("ichi", x, 95);
  fill(51);
  text("ni", x, 130);
  fill(204);
  text("san", x, 165);
  fill(255);
  text("shi", x, 210);
}
