Average Pokemon Stats | KTBYTE Student Projects

The showcase player uses a modified version of Processing.js in combination with jsweet to let students program their apps in Java code while still allowing for browser support.

Content created by students is scaled to fit the showcase frame while maintaining aspect ratio and cursor position. This is why some projects may appear blurry in fullscreen, or why some small details may not be visible on a small screen

Embed HTML:

<iframe width='500px' height='400px' src='https://nest.ktbyte.com/nest#97531' allowfullscreen></iframe>

// Stats
int[] HP;
int[] Atk;
int[] Def;
int[] SpAtk;
int[] SpDef;
int[] Spd;


//int[] AvgHealth;

// Colors
color fire = color(240, 56, 56, 65);
color normal = color(201, 193, 144, 65);
color water = color(44, 102, 232, 65);
color grass = color(51, 188, 21, 65);
color electric = color(229, 220, 37, 65);
color flying = color(141, 191, 222, 65);
color poison = color(232, 54, 191, 65);
color bug = color(157, 232, 54, 65);
color ground = color(167, 95, 52, 65);
color rock = color(108, 104, 102, 65);
color psychic = color(140, 57, 193, 65);
color ghost = color(23, 22, 23, 65);
color dragon = color(17, 139, 109, 65);
color ice = color(99, 224, 245, 65);
color fighting = color(234, 192, 149, 65);
color dark = color(36, 34, 103, 65);
color steel = color(180, 180, 180, 65);
color fairy = color(255, 183, 235, 65);

// Booleans
boolean select = false; //type select




void setup() {
  size(600, 400);
  background(250, 249, 237);
  fill(0);
  smooth();
  textSize(16);
  noStroke();
  fill(255);

  //Type Menu BG
  rect(0, 0, 75, height);

  //Hex fill
  quad(230, 260, 230, 120, 350, 50, 470, 120);
  quad(230, 260, 470, 120, 470, 260, 350, 330);
  fill(0);

  //Hex lines
  stroke(#D1D0CA);
  line(350, 50, 350, 330); // center y
  line(230, 260, 470, 120); // /
  line(230, 120, 470, 260); // \
  stroke(88, 87, 80);
  strokeWeight(3.5);
  //Hexagon
  line(230, 260, 230, 120); // left edge
  line(230, 120, 350, 50);  // up left edge
  line(350, 50, 470, 120);  // up right edge
  line(470, 120, 470, 260); // right edge
  line(470, 260, 350, 330); // low right edge
  line(350, 330, 230, 260); // low left edge



  //Title
  fill(88, 87, 80);
  text("Average Pokemon Stats by Type", 226, 380);

  //STATS on hexagon
  textSize(12);
  text("HP", 344, 40);         //HP
  text("Attack", 478, 120);    //Attack
  text("Defense", 480, 270);   //Defense
  text("Special Attack", 310, 350);    //Special Attack
  text("Special Defense", 132, 270);    //Special Defense
  text("Speed", 188, 120);     //Speed

  //TYPE List
  textSize(14);
  text("Fire", 10, 35);
  text("Normal", 10, 55);
  text("Water", 10, 75);
  text("Grass", 10, 95);
  text("Electric", 10, 115);
  text("Flying", 10, 135);
  text("Poison", 10, 155);
  text("Bug", 10, 175);
  text("Ground", 10, 195);
  text("Rock", 10, 215);
  text("Psychic", 10, 235);
  text("Ghost", 10, 255);
  text("Dragon", 10, 275);
  text("Ice", 10, 295);
  text("Fighting", 10, 315);
  text("Dark", 10, 335);
  text("Steel", 10, 355);
  text("Fairy", 10, 375);

  //Clear "button"
  text("Clear", 558, 392);
  //Axes "button"
  text("Axes", 560, 18);



  //Load the data

  String[] stats = ("70,82,67,91,73,76\n"+
"77,72,58,56,63,71\n"+
"70,72,73,73,69,65\n"+
"66,73,73,72,71,60\n"+
"63,70,67,89,74,83\n"+
"71,79,67,74,71,85\n"+
"63,70,64,69,67,64\n"+
"57,71,72,54,65,61\n"+
"75,89,84,58,63,60\n"+
"67,89,106,58,72,50\n"+
"70,68,72,92,84,76\n"+
"63,76,81,76,75,62\n"+
"83,103,84,91,84,78\n"+
"79,81,77,82,79,67\n"+
"75,103,73,67,72,75\n"+
"71,95,70,75,68,76\n"+
"64,91,114,72,82,57\n"+
"68,57,64,73,79,54").split("\n");
  println("Lines Array " + stats.length);

  //Individual Stats
  HP = new int[stats.length];
  Atk = new int[stats.length];
  Def = new int[stats.length];
  SpAtk = new int[stats.length];
  SpDef = new int[stats.length];
  Spd = new int[stats.length];


  //Parse Data
  for (int i=0; i<stats.length; i++) {
    String[] pieces = split(stats[i], ",");

    //Assign pieces to each stat. STATS are vertical columns. Rows [0], [1], [2] etc are TYPES.
    HP[i] = Integer.parseInt(pieces[0]);
    Atk[i] = Integer.parseInt(pieces[1]);
    Def[i] = Integer.parseInt(pieces[2]);
    SpAtk[i] = Integer.parseInt(pieces[3]);
    SpDef[i] = Integer.parseInt(pieces[4]);
    Spd[i] = Integer.parseInt(pieces[5]);
  }

  //Tests
  println("Data Loaded: "+HP.length+" entries.");
  println(HP); //prints the HP column
  println(stats[0] + "," + stats[1]); //prints the fire row + the normal row. I did the thing!!!
  println(Def[10]);
}
//A custom function that redraws the background

void clearHex() {
  background(250, 249, 237);
  fill(0);
  smooth();
  textSize(16);
  noStroke();
  fill(255);

  //Type Menu BG
  rect(0, 0, 75, height);

  //Hex fill
  quad(230, 260, 230, 120, 350, 50, 470, 120);
  quad(230, 260, 470, 120, 470, 260, 350, 330);
  fill(0);

  //Hex lines
  stroke(#D1D0CA);
  line(350, 50, 350, 330); // center y
  line(230, 260, 470, 120); // /
  line(230, 120, 470, 260); // \
  stroke(88, 87, 80);
  strokeWeight(3.5);
  //Hexagon
  line(230, 260, 230, 120); // left edge
  line(230, 120, 350, 50);  // up left edge
  line(350, 50, 470, 120);  // up right edge
  line(470, 120, 470, 260); // right edge
  line(470, 260, 350, 330); // low right edge
  line(350, 330, 230, 260); // low left edge



  //Title
  fill(88, 87, 80);
  text("Average Pokemon Stats by Type", 226, 380);

  //STATS on hexagon
  textSize(12);
  text("HP", 344, 40);         //HP
  text("Attack", 478, 120);    //Attack
  text("Defense", 480, 270);   //Defense
  text("Special Attack", 310, 350);    //Special Attack
  text("Special Defense", 132, 270);    //Special Defense
  text("Speed", 188, 120);     //Speed

  //TYPE List
  textSize(14);
  text("Fire", 10, 35);
  text("Normal", 10, 55);
  text("Water", 10, 75);
  text("Grass", 10, 95);
  text("Electric", 10, 115);
  text("Flying", 10, 135);
  text("Poison", 10, 155);
  text("Bug", 10, 175);
  text("Ground", 10, 195);
  text("Rock", 10, 215);
  text("Psychic", 10, 235);
  text("Ghost", 10, 255);
  text("Dragon", 10, 275);
  text("Ice", 10, 295);
  text("Fighting", 10, 315);
  text("Dark", 10, 335);
  text("Steel", 10, 355);
  text("Fairy", 10, 375);

  //Clear "button"
  text("Clear", 558, 392);
  //Axes "button"
  text("Axes", 560, 18);
  strokeWeight(1);
}

//Custom Function: a function that draws a shape when you pass in data from the array.
// Maybe use a for loop that adds 1 to the [0] every time? I need to draw these shapes when you click. 
void drawFire() {

  //Mapping the tris

  float value = HP[0];
  float HPmap = map(HP[0], 0, 130, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[0];
  float Atkmapy = map(Atk[0], 0, 130, 180, 120);

  float value21 = Atk[0];
  float Atkmapx = map(Atk[0], 0, 130, 350, 470);

  float value3 = Def[0];
  float Defmapy = map(Def[0], 0, 130, 180, 260);

  float value4 = Def[0];
  float Defmapx = map(Def[0], 0, 130, 350, 470);

  float value5 = SpAtk[0];
  float SpAtkmap = map(SpAtk[0], 0, 130, 180, 330);

  float value6 = SpDef[0];
  float SpDefmapy = map(SpDef[0], 0, 130, 180, 260);

  float value7 = SpDef[0];
  float SpDefmapx = map(SpDef[0], 0, 130, 350, 230);

  float value8 = Spd[0];
  float Spdmapy = map(Spd[0], 0, 130, 180, 120);

  float value9 = SpDef[0];
  float Spdmapx = map(Spd[0], 0, 130, 350, 230);


  noStroke();
  fill(fire);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);

  text("Fire", 10, 35);
}

void drawNormal() {

  //Mapping the tris
  float value = HP[1];
  float HPmap = map(HP[1], 0, 130, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[1];
  float Atkmapy = map(Atk[1], 0, 130, 180, 120);

  float value21 = Atk[1];
  float Atkmapx = map(Atk[1], 0, 130, 350, 470);

  float value3 = Def[1];
  float Defmapy = map(Def[1], 0, 130, 180, 260);

  float value4 = Def[1];
  float Defmapx = map(Def[1], 0, 130, 350, 470);

  float value5 = SpAtk[1];
  float SpAtkmap = map(SpAtk[1], 0, 130, 180, 330);

  float value6 = SpDef[1];
  float SpDefmapy = map(SpDef[1], 0, 130, 180, 260);

  float value7 = SpDef[1];
  float SpDefmapx = map(SpDef[1], 0, 130, 350, 230);

  float value8 = Spd[1];
  float Spdmapy = map(Spd[1], 0, 130, 180, 120);

  float value9 = SpDef[1];
  float Spdmapx = map(Spd[1], 0, 130, 350, 230);


  noStroke();
  fill(normal);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Normal", 10, 55);
}

void drawWater() {

  //Mapping the tris
  float value = HP[2];
  float HPmap = map(HP[2], 0, 130, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[2];
  float Atkmapy = map(Atk[2], 0, 130, 180, 120);

  float value21 = Atk[2];
  float Atkmapx = map(Atk[2], 0, 130, 350, 470);

  float value3 = Def[2];
  float Defmapy = map(Def[2], 0, 130, 180, 260);

  float value4 = Def[2];
  float Defmapx = map(Def[2], 0, 130, 350, 470);

  float value5 = SpAtk[2];
  float SpAtkmap = map(SpAtk[2], 0, 130, 180, 330);

  float value6 = SpDef[2];
  float SpDefmapy = map(SpDef[2], 0, 130, 180, 260);

  float value7 = SpDef[2];
  float SpDefmapx = map(SpDef[2], 0, 130, 350, 230);

  float value8 = Spd[2];
  float Spdmapy = map(Spd[2], 0, 130, 180, 120);

  float value9 = SpDef[2];
  float Spdmapx = map(Spd[2], 0, 130, 350, 230);


  noStroke();
  fill(water);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Water", 10, 75);
}

void drawGrass() {

  //Mapping the tris
  float value = HP[3];
  float HPmap = map(HP[3], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[3];
  float Atkmapy = map(Atk[3], 0, 115, 180, 120);

  float value21 = Atk[3];
  float Atkmapx = map(Atk[3], 0, 115, 350, 470);

  float value3 = Def[3];
  float Defmapy = map(Def[3], 0, 115, 180, 260);

  float value4 = Def[3];
  float Defmapx = map(Def[3], 0, 115, 350, 470);

  float value5 = SpAtk[3];
  float SpAtkmap = map(SpAtk[3], 0, 115, 180, 330);

  float value6 = SpDef[3];
  float SpDefmapy = map(SpDef[3], 0, 115, 180, 260);

  float value7 = SpDef[3];
  float SpDefmapx = map(SpDef[3], 0, 115, 350, 230);

  float value8 = Spd[3];
  float Spdmapy = map(Spd[3], 0, 115, 180, 120);

  float value9 = SpDef[3];
  float Spdmapx = map(Spd[3], 0, 115, 350, 230);


  noStroke();
  fill(grass);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Grass", 10, 95);
}

void drawElectric() {

  //Mapping the tris
  float value = HP[4];
  float HPmap = map(HP[4], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[4];
  float Atkmapy = map(Atk[4], 0, 115, 180, 120);

  float value21 = Atk[4];
  float Atkmapx = map(Atk[4], 0, 115, 350, 470);

  float value3 = Def[4];
  float Defmapy = map(Def[4], 0, 115, 180, 260);

  float value4 = Def[4];
  float Defmapx = map(Def[4], 0, 115, 350, 470);

  float value5 = SpAtk[4];
  float SpAtkmap = map(SpAtk[4], 0, 115, 180, 330);

  float value6 = SpDef[4];
  float SpDefmapy = map(SpDef[4], 0, 115, 180, 260);

  float value7 = SpDef[4];
  float SpDefmapx = map(SpDef[4], 0, 115, 350, 230);

  float value8 = Spd[4];
  float Spdmapy = map(Spd[4], 0, 115, 180, 120);

  float value9 = SpDef[4];
  float Spdmapx = map(Spd[4], 0, 115, 350, 230);


  noStroke();
  fill(electric);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Electric", 10, 115);
}

void drawFlying() {

  //Mapping the tris
  float value = HP[5];
  float HPmap = map(HP[5], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[5];
  float Atkmapy = map(Atk[5], 0, 115, 180, 120);

  float value21 = Atk[5];
  float Atkmapx = map(Atk[5], 0, 115, 350, 470);

  float value3 = Def[5];
  float Defmapy = map(Def[5], 0, 115, 180, 260);

  float value4 = Def[5];
  float Defmapx = map(Def[5], 0, 115, 350, 470);

  float value5 = SpAtk[5];
  float SpAtkmap = map(SpAtk[5], 0, 115, 180, 330);

  float value6 = SpDef[5];
  float SpDefmapy = map(SpDef[5], 0, 115, 180, 260);

  float value7 = SpDef[5];
  float SpDefmapx = map(SpDef[5], 0, 115, 350, 230);

  float value8 = Spd[5];
  float Spdmapy = map(Spd[5], 0, 115, 180, 120);

  float value9 = SpDef[5];
  float Spdmapx = map(Spd[5], 0, 115, 350, 230);


  noStroke();
  fill(flying);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Flying", 10, 135);
}

void drawPoison() {

  //Mapping the tris
  float value = HP[6];
  float HPmap = map(HP[6], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[6];
  float Atkmapy = map(Atk[6], 0, 115, 180, 120);

  float value21 = Atk[6];
  float Atkmapx = map(Atk[6], 0, 115, 350, 470);

  float value3 = Def[6];
  float Defmapy = map(Def[6], 0, 115, 180, 260);

  float value4 = Def[6];
  float Defmapx = map(Def[6], 0, 115, 350, 470);

  float value5 = SpAtk[6];
  float SpAtkmap = map(SpAtk[6], 0, 115, 180, 330);

  float value6 = SpDef[6];
  float SpDefmapy = map(SpDef[6], 0, 115, 180, 260);

  float value7 = SpDef[6];
  float SpDefmapx = map(SpDef[6], 0, 115, 350, 230);

  float value8 = Spd[6];
  float Spdmapy = map(Spd[6], 0, 115, 180, 120);

  float value9 = SpDef[6];
  float Spdmapx = map(Spd[6], 0, 115, 350, 230);


  noStroke();
  fill(poison);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Poison", 10, 155);
}

void drawBug() {

  //Mapping the tris
  float value = HP[7];
  float HPmap = map(HP[7], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[7];
  float Atkmapy = map(Atk[7], 0, 115, 180, 120);

  float value21 = Atk[7];
  float Atkmapx = map(Atk[7], 0, 115, 350, 470);

  float value3 = Def[7];
  float Defmapy = map(Def[7], 0, 115, 180, 260);

  float value4 = Def[7];
  float Defmapx = map(Def[7], 0, 115, 350, 470);

  float value5 = SpAtk[7];
  float SpAtkmap = map(SpAtk[7], 0, 115, 180, 330);

  float value6 = SpDef[7];
  float SpDefmapy = map(SpDef[7], 0, 115, 180, 260);

  float value7 = SpDef[7];
  float SpDefmapx = map(SpDef[7], 0, 115, 350, 230);

  float value8 = Spd[7];
  float Spdmapy = map(Spd[7], 0, 115, 180, 120);

  float value9 = SpDef[7];
  float Spdmapx = map(Spd[7], 0, 115, 350, 230);


  noStroke();
  fill(bug);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Bug", 10, 175);
}

void drawGround() {

  //Mapping the tris
  float value = HP[8];
  float HPmap = map(HP[8], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[8];
  float Atkmapy = map(Atk[8], 0, 115, 180, 120);

  float value21 = Atk[8];
  float Atkmapx = map(Atk[8], 0, 115, 350, 470);

  float value3 = Def[8];
  float Defmapy = map(Def[8], 0, 115, 180, 260);

  float value4 = Def[8];
  float Defmapx = map(Def[8], 0, 115, 350, 470);

  float value5 = SpAtk[8];
  float SpAtkmap = map(SpAtk[8], 0, 115, 180, 330);

  float value6 = SpDef[8];
  float SpDefmapy = map(SpDef[8], 0, 115, 180, 260);

  float value7 = SpDef[8];
  float SpDefmapx = map(SpDef[8], 0, 115, 350, 230);

  float value8 = Spd[8];
  float Spdmapy = map(Spd[8], 0, 115, 180, 120);

  float value9 = SpDef[8];
  float Spdmapx = map(Spd[8], 0, 115, 350, 230);


  noStroke();
  fill(ground);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Ground", 10, 195);
}

void drawRock() {

  //Mapping the tris
  float value = HP[9];
  float HPmap = map(HP[9], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[9];
  float Atkmapy = map(Atk[9], 0, 115, 180, 120);

  float value21 = Atk[9];
  float Atkmapx = map(Atk[9], 0, 115, 350, 470);

  float value3 = Def[9];
  float Defmapy = map(Def[9], 0, 115, 180, 260);

  float value4 = Def[9];
  float Defmapx = map(Def[9], 0, 115, 350, 470);

  float value5 = SpAtk[9];
  float SpAtkmap = map(SpAtk[9], 0, 115, 180, 330);

  float value6 = SpDef[9];
  float SpDefmapy = map(SpDef[9], 0, 115, 180, 260);

  float value7 = SpDef[9];
  float SpDefmapx = map(SpDef[9], 0, 115, 350, 230);

  float value8 = Spd[9];
  float Spdmapy = map(Spd[9], 0, 115, 180, 120);

  float value9 = SpDef[9];
  float Spdmapx = map(Spd[9], 0, 115, 350, 230);


  noStroke();
  fill(rock);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Rock", 10, 215);
}

void drawPsychic() {

  //Mapping the tris
  float value = HP[10];
  float HPmap = map(HP[10], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[10];
  float Atkmapy = map(Atk[10], 0, 115, 180, 120);

  float value21 = Atk[10];
  float Atkmapx = map(Atk[10], 0, 115, 350, 470);

  float value3 = Def[10];
  float Defmapy = map(Def[10], 0, 115, 180, 260);

  float value4 = Def[10];
  float Defmapx = map(Def[10], 0, 115, 350, 470);

  float value5 = SpAtk[10];
  float SpAtkmap = map(SpAtk[10], 0, 115, 180, 330);

  float value6 = SpDef[10];
  float SpDefmapy = map(SpDef[10], 0, 115, 180, 260);

  float value7 = SpDef[10];
  float SpDefmapx = map(SpDef[10], 0, 115, 350, 230);

  float value8 = Spd[10];
  float Spdmapy = map(Spd[10], 0, 115, 180, 120);

  float value9 = SpDef[10];
  float Spdmapx = map(Spd[10], 0, 115, 350, 230);


  noStroke();
  fill(psychic);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Psychic", 10, 235);
}

void drawGhost() {

  //Mapping the tris
  float value = HP[11];
  float HPmap = map(HP[11], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[11];
  float Atkmapy = map(Atk[11], 0, 115, 180, 120);

  float value21 = Atk[11];
  float Atkmapx = map(Atk[11], 0, 115, 350, 470);

  float value3 = Def[11];
  float Defmapy = map(Def[11], 0, 115, 180, 260);

  float value4 = Def[11];
  float Defmapx = map(Def[11], 0, 115, 350, 470);

  float value5 = SpAtk[11];
  float SpAtkmap = map(SpAtk[11], 0, 115, 180, 330);

  float value6 = SpDef[11];
  float SpDefmapy = map(SpDef[11], 0, 115, 180, 260);

  float value7 = SpDef[11];
  float SpDefmapx = map(SpDef[11], 0, 115, 350, 230);

  float value8 = Spd[11];
  float Spdmapy = map(Spd[11], 0, 115, 180, 120);

  float value9 = SpDef[11];
  float Spdmapx = map(Spd[11], 0, 115, 350, 230);


  noStroke();
  fill(ghost);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Ghost", 10, 255);
}

void drawDragon() {

  //Mapping the tris
  float value = HP[12];
  float HPmap = map(HP[12], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[12];
  float Atkmapy = map(Atk[12], 0, 115, 180, 120);

  float value21 = Atk[12];
  float Atkmapx = map(Atk[12], 0, 115, 350, 470);

  float value3 = Def[12];
  float Defmapy = map(Def[12], 0, 115, 180, 260);

  float value4 = Def[12];
  float Defmapx = map(Def[12], 0, 115, 350, 470);

  float value5 = SpAtk[12];
  float SpAtkmap = map(SpAtk[12], 0, 115, 180, 330);

  float value6 = SpDef[12];
  float SpDefmapy = map(SpDef[12], 0, 115, 180, 260);

  float value7 = SpDef[12];
  float SpDefmapx = map(SpDef[12], 0, 115, 350, 230);

  float value8 = Spd[12];
  float Spdmapy = map(Spd[12], 0, 115, 180, 120);

  float value9 = SpDef[12];
  float Spdmapx = map(Spd[12], 0, 115, 350, 230);


  noStroke();
  fill(dragon);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Dragon", 10, 275);
}

void drawIce() {

  //Mapping the tris
  float value = HP[13];
  float HPmap = map(HP[13], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[13];
  float Atkmapy = map(Atk[13], 0, 115, 180, 120);

  float value21 = Atk[13];
  float Atkmapx = map(Atk[13], 0, 115, 350, 470);

  float value3 = Def[13];
  float Defmapy = map(Def[13], 0, 115, 180, 260);

  float value4 = Def[0];
  float Defmapx = map(Def[13], 0, 115, 350, 470);

  float value5 = SpAtk[13];
  float SpAtkmap = map(SpAtk[13], 0, 115, 180, 330);

  float value6 = SpDef[13];
  float SpDefmapy = map(SpDef[13], 0, 115, 180, 260);

  float value7 = SpDef[13];
  float SpDefmapx = map(SpDef[13], 0, 115, 350, 230);

  float value8 = Spd[13];
  float Spdmapy = map(Spd[13], 0, 115, 180, 120);

  float value9 = SpDef[13];
  float Spdmapx = map(Spd[13], 0, 115, 350, 230);


  noStroke();
  fill(ice);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Ice", 10, 295);
}

void drawFighting() {

  //Mapping the tris
  float value = HP[14];
  float HPmap = map(HP[14], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[14];
  float Atkmapy = map(Atk[14], 0, 115, 180, 120);

  float value21 = Atk[14];
  float Atkmapx = map(Atk[14], 0, 115, 350, 470);

  float value3 = Def[14];
  float Defmapy = map(Def[14], 0, 115, 180, 260);

  float value4 = Def[14];
  float Defmapx = map(Def[14], 0, 115, 350, 470);

  float value5 = SpAtk[14];
  float SpAtkmap = map(SpAtk[14], 0, 115, 180, 330);

  float value6 = SpDef[14];
  float SpDefmapy = map(SpDef[14], 0, 115, 180, 260);

  float value7 = SpDef[14];
  float SpDefmapx = map(SpDef[14], 0, 115, 350, 230);

  float value8 = Spd[14];
  float Spdmapy = map(Spd[14], 0, 115, 180, 120);

  float value9 = SpDef[14];
  float Spdmapx = map(Spd[14], 0, 115, 350, 230);


  noStroke();
  fill(fighting);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Fighting", 10, 315);
}

void drawDark() {

  //Mapping the tris
  float value = HP[15];
  float HPmap = map(HP[15], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[15];
  float Atkmapy = map(Atk[15], 0, 115, 180, 120);

  float value21 = Atk[15];
  float Atkmapx = map(Atk[15], 0, 115, 350, 470);

  float value3 = Def[15];
  float Defmapy = map(Def[15], 0, 115, 180, 260);

  float value4 = Def[15];
  float Defmapx = map(Def[15], 0, 115, 350, 470);

  float value5 = SpAtk[15];
  float SpAtkmap = map(SpAtk[15], 0, 115, 180, 330);

  float value6 = SpDef[15];
  float SpDefmapy = map(SpDef[15], 0, 115, 180, 260);

  float value7 = SpDef[15];
  float SpDefmapx = map(SpDef[15], 0, 115, 350, 230);

  float value8 = Spd[15];
  float Spdmapy = map(Spd[15], 0, 115, 180, 120);

  float value9 = SpDef[15];
  float Spdmapx = map(Spd[15], 0, 115, 350, 230);


  noStroke();
  fill(dark);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Dark", 10, 335);
}

void drawSteel() {

  //Mapping the tris
  float value = HP[16];
  float HPmap = map(HP[16], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[16];
  float Atkmapy = map(Atk[16], 0, 115, 180, 120);

  float value21 = Atk[16];
  float Atkmapx = map(Atk[16], 0, 115, 350, 470);

  float value3 = Def[16];
  float Defmapy = map(Def[16], 0, 115, 180, 260);

  float value4 = Def[16];
  float Defmapx = map(Def[16], 0, 115, 350, 470);

  float value5 = SpAtk[16];
  float SpAtkmap = map(SpAtk[16], 0, 115, 180, 330);

  float value6 = SpDef[16];
  float SpDefmapy = map(SpDef[16], 0, 115, 180, 260);

  float value7 = SpDef[16];
  float SpDefmapx = map(SpDef[16], 0, 115, 350, 230);

  float value8 = Spd[16];
  float Spdmapy = map(Spd[16], 0, 115, 180, 120);

  float value9 = SpDef[16];
  float Spdmapx = map(Spd[16], 0, 115, 350, 230);


  noStroke();
  fill(steel);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Steel", 10, 355);
}

void drawFairy() {

  //Mapping the tris
  float value = HP[17];
  float HPmap = map(HP[17], 0, 115, 180, 50);

  // All Stats except HP and SpAtk need to be mapped on the X and Y axis.

  float value2 = Atk[17];
  float Atkmapy = map(Atk[17], 0, 115, 180, 120);

  float value21 = Atk[17];
  float Atkmapx = map(Atk[17], 0, 115, 350, 470);

  float value3 = Def[17];
  float Defmapy = map(Def[17], 0, 115, 180, 260);

  float value4 = Def[17];
  float Defmapx = map(Def[17], 0, 115, 350, 470);

  float value5 = SpAtk[17];
  float SpAtkmap = map(SpAtk[17], 0, 115, 180, 330);

  float value6 = SpDef[17];
  float SpDefmapy = map(SpDef[17], 0, 115, 180, 260);

  float value7 = SpDef[17];
  float SpDefmapx = map(SpDef[17], 0, 115, 350, 230);

  float value8 = Spd[17];
  float Spdmapy = map(Spd[17], 0, 115, 180, 120);

  float value9 = SpDef[17];
  float Spdmapx = map(Spd[17], 0, 115, 350, 230);


  noStroke();
  fill(fairy);

  triangle(350, 190, 350, HPmap, Atkmapx, Atkmapy);
  triangle(350, 190, Atkmapx, Atkmapy, Defmapx, Defmapy);
  triangle(350, 190, Defmapx, Defmapy, 350, SpAtkmap);
  triangle(350, 190, 350, SpAtkmap, SpDefmapx, SpDefmapy);
  triangle(350, 190, SpDefmapx, SpDefmapy, Spdmapx, Spdmapy);
  triangle(350, 190, Spdmapx, Spdmapy, 350, HPmap);
  text("Fairy", 10, 375);
}



void draw() {

  //If mouse is pressed within the text box, draw the hex for that shape.
  {
    if (mousePressed)
    {
      //fire
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=25 && mouseY <= 40)
      {
        drawFire();
      }
      //normal
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=45 && mouseY <= 60)
      {
        drawNormal();
      }
      //water
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=65 && mouseY <= 80)
      {
        drawWater();
      }
      //grass
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=85 && mouseY <= 100)
      {
        drawGrass();
      }
      //Electric
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=105 && mouseY <= 120)
      {
        drawElectric();
      }
      //flying
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=125 && mouseY <= 140)
      {
        drawFlying();
      }
      //poison
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=145 && mouseY <= 160)
      {
        drawPoison();
      }
      //Bug
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=165 && mouseY <= 180)
      {
        drawBug();
      }
      //Ground
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=185 && mouseY <= 200)
      {
        drawGround();
      }
      //Rock
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=205 && mouseY <= 220)
      {
        drawRock();
      }
      //Psychic
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=225 && mouseY <= 240)
      {
        drawPsychic();
      }
      //ghost
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=245 && mouseY <= 260)
      {
        drawGhost();
      }
      //Dragon
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=265 && mouseY <= 280)
      {
        drawDragon();
      }
      //Ice
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=285 && mouseY <= 300)
      {
        drawIce();
      }
      //fighting
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=305 && mouseY <= 320)
      {
        drawFighting();
      }
      //Dark
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=325 && mouseY <= 340)
      {
        drawDark();
      }
      //Steel
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=345 && mouseY <= 360)
      {
        drawSteel();
      }
      //Fairy
      if (mouseX >= 10 && mouseX <= 55 && mouseY >=365 && mouseY <= 380)
      {
        drawFairy();
      }

      //CLEAR function
      if (mouseX >= 550 && mouseX <= 600 && mouseY >= 380 && mouseY <= 400)
      {
        clearHex();
      }
      if (mouseX > 550 && mouseX < 600 && mouseY > 0 && mouseY < 25)
        //Axes
      {
        strokeWeight(0);
        fill(255, 255, 255, 80);
        //top rect
        rect(338, 40, 25, 14);
        //atk rect
        rect(477, 123, 25, 15);
        //def rect
        rect(477, 241, 25, 15);
        //bottom rect
        rect(338, 328, 25, 14);
        //spedf rect
        rect(197, 241, 25, 15);
        //spd rect
        rect(197, 123, 25, 15);
        //origin rect
        rect(344, 182, 12, 15);
        textSize(11);
        fill(207, 75, 75, 200);
        text("0", 347, 194);
        text("115", 340, 53);
        text("115", 480, 135);
        text("115", 479, 253);
        text("115", 340, 340);
        text("115", 199, 253);
        text("115", 199, 135);
        textSize(14);
      }
    }
  }
}

DESCRIPTION