PFont f;
XMLElement xml;
PImage[] images = new PImage[20];
String[] lis;
String[] lis2;
int[] c = {0, 125, 200};

int h = 450;
void setup()
{
  size(740,h+30);
  smooth();
  f = loadFont("SansSerif.bold-16.vlw");
  textFont(f,20);
  textAlign(LEFT);
  frameRate(30);
  noStroke();
  background(255);
  noLoop();
  xml = new XMLElement(this, "topsporecasts.xml");
  XMLElement thing = xml;
  XMLElement[] creators = thing.getChildren("sporecast");
  System.out.println(creators.length);
  String[] name = new String[creators.length];
  String[] values = new String[creators.length];
  for(int k = 0; k< creators.length; k++)
  {
    name[k] = creators[k].getChild("name").getContent();
    values[k] = creators[k].getChild("subscriptions").getContent(); 
    String id = creators[k].getChild("sample").getContent();
    images[k] = loadImage("http://www.spore.com/static/image/" + id.substring(0,3) + "/" + id.substring(3,6) + "/" + id.substring(6,9) + "/" + id + "_lrg.png");
   //images[k] = loadImage(creators[k].getChild("sample").getContent() + ".png");
  }
  lis=name; 
  lis2 = values;
}

void draw(){
  fill(0.85*c[0], 0.85*c[1], 0.85*c[2]);
  rect(5, 2, width-10, 26);
  for(int j = 1; j<=10; j++)
  {
  float cF = colorFactor(j, 10);
  //fill(cF*c[0], cF*c[1], cF*c[2]);
  fill(c[0], c[1], c[2], cF*255);
  drawSquare(lis[10-j], lis2[10-j],  10-j, 10);
  }
  fill(255);
  rect(55, 0, 2, height);
  rect(610, 0, 2, height);
  
  textFont(f,16);
  textAlign(CENTER);
  text("Rank", 30, 20);
  textAlign(LEFT);
  text("Sporecast", 133, 20);
  textAlign(LEFT);
  text("Subscribers", 636 ,20);
  takeImage();
}

void drawSquare(String txt1, String txt2, int pos, int n){
  float a = h*pos/n;
  int b = round(a);
  rect(0+5, b+30, width-10,  h/n-2);
  fill(0);
  textFont(f,16);
  textAlign(RIGHT);
  text(Integer.toString(pos+1) + ".", 40, b+h/(n)+10);
  textAlign(LEFT);
  text(txt1, 135, b+h/(n)+10);
  textAlign(RIGHT);
  text(txt2, 30*width/32, b+h/(n)+10);
  image(images[pos], 75 , b+h/(n)-10, 37,37);
  
}

float colorFactor(int i, int n)
{
 float ff =  1.1/(1-1/n)*(i)/n ;
 return ff;
}

void takeImage(){
 save("topsporecasts.png"); 
}