PFont font;
int clickX,clickY;
float rotX, rotY;
GlyphSwarm[] digits;
int timer;
//-------------
void setup(){
  size(300,300,P3D);
  framerate(30);
  font = loadFont("trebuchet.vlw");
  textFont(font,20);
  textMode(MODEL);
  fill(128);
  stroke(128,40);
  digits = new GlyphSwarm[8];
  for(int i=0;i<digits.length;i++)
    digits[i] = new GlyphSwarm( min(i,1) );
  digits[2] = new Colon();
  digits[5] = new Colon();
  timer = millis();
}
//-------------
void draw(){
  background(255);
  translate(width/2,height/2);
  if(mousePressed){
    rotX += -(mouseY-clickY)*0.0003;
    rotY += (mouseX-clickX)*0.0003;
  }
  rotateX( rotX );
  rotateY( rotY );

  rotateY(0.4);
  for(int i=0;i<digits.length;i++){
    rotateY(-0.11);
    digits[i].visualize();
  }
  
  if(timer < millis()-1000) updateTime();
}
//-------------
void updateTime(){
  timer = millis();
  digits[0].setDigit( second() % 10 );
  digits[1].setDigit( second() / 10 );
  digits[3].setDigit( minute() % 10 );
  digits[4].setDigit( minute() / 10 );
  digits[6].setDigit( hour() % 10 );
  digits[7].setDigit( hour() / 10 );
}
//-------------
void mousePressed(){
  clickX = mouseX;
  clickY = mouseY;
}
//--------------------------------------------------------------
//--------------------------------------------------------------
//--------------------------------------------------------------
class GlyphSwarm{
  float animationTimer;
  float rotX, rotY, rotZ;
  float previousRotX, previousRotY, previousRotZ;
  float desiredRotX, desiredRotY, desiredRotZ;
  Glyph[] glyphs;
  boolean slow;
  //-------------
  GlyphSwarm( int index ){
    slow = index==1;
    glyphs = new Glyph[10];
    for(int i=0;i<glyphs.length;i++)
      glyphs[i] = new Glyph( str(i) );
    for(int i=0;i<glyphs.length;i++)
      glyphs[i].setAngle(random(TWO_PI),random(TWO_PI),random(TWO_PI));
  }
  //-------------
  void setDigit(int i){
    previousRotX = rotX;
    previousRotY = rotY;
    previousRotZ = rotZ;
    desiredRotX = glyphs[i].rotX;
    desiredRotY = glyphs[i].rotY;
    desiredRotZ = glyphs[i].rotZ;
    animationTimer = 0f;
    for(int j=0;j<glyphs.length;j++)
      glyphs[j].active = false;
    glyphs[i].active = true;
  }
  //-------------
  void visualize(){
    if(animationTimer < 1f) animateRotation();
    for(int i=0;i<glyphs.length;i++)
      glyphs[i].visualize(-rotX,-rotY,-rotZ);
  }
  //-------------
  void animateRotation(){
    rotX = lerp( previousRotX, desiredRotX, 1-sq(1-animationTimer) );
    rotY = lerp( previousRotY, desiredRotY, 1-sq(1-animationTimer) );
    rotZ = lerp( previousRotZ, desiredRotZ, 1-sq(1-animationTimer) );
    if(slow)
      animationTimer += 1f/50;
    else
      animationTimer += 1f/16;
    if(animationTimer >= 1f){
      rotX = desiredRotX;
      rotY = desiredRotY;
      rotZ = desiredRotZ;
    }
  }
}
//--------------------------------------------------------------
//--------------------------------------------------------------
//--------------------------------------------------------------
class Colon extends GlyphSwarm{
  Colon(){
    super(0);
  }
  //-------------
  void visualize(){
    pushMatrix();
    fill(0,192);
    text(":",-2,10,100);
    popMatrix();
  }
}
//--------------------------------------------------------------
//--------------------------------------------------------------
//--------------------------------------------------------------
class Glyph{
  float rotX, rotY, rotZ;
  String glyph;
  boolean active;
  //-------------
  Glyph( String s ){
    glyph = s;
    active = false;
  }
  //-------------
  void setAngle(float rotX, float rotY, float rotZ){
    this.rotX = rotX;
    this.rotY = rotY;
    this.rotZ = rotZ;
  }
  //-------------
  void visualize(float rX, float rY, float rZ){
    fill(0,64);
    if(active) fill(0,192);
    pushMatrix();
    rotateZ( rotZ+rZ );
    rotateY( rotY+rY );
    rotateX( rotX+rX );
    line(0,0,60,0,0,90);
    text(glyph,-5,10,100);
    popMatrix();
  }
}