​

var font;

var tracking = [];

const faceMe = true;

​

var sketch = function(p) {

  p.preload = function() {

    font = p.loadFont('CourierStd.otf');

  }

  p.setup = function() {

    p.createCanvas(600, 400, p.WEBGL);

    p.textFont(font);

    p.textSize(24);

  }

​

  p.draw = function() {

    p.background(220);

​

        tracking = [];

​

    p.translate(0, 0, -200);

    p.rotateX( -0.4);

    tracking.push( ['rot', 'X', -0.4]);

    let hour = p.frameCount*0.02;

    p.rotateY( hour / 5 );

    tracking.push(['rot', 'Y', hour / 5]);

    // Sun

    text3D(p, "Sun",  0, -60, 0)

    p.noFill();

    p.sphere(50, 8, 8);

    // ----------

    p.push();

​

    let h3 = hour * 1.7320508;

    p.rotateY( h3 );

    p.translate(150, 0, 0);

    tracking.push(['rot', 'Y', h3 ]);

        //p.box();

    p.sphere(30, 4, 4);

    text3D(p, 'Venus', 0, -40, 0);

    tracking.pop();

    p.pop();

    // ----------

    p.translate(300, 0, 0);

​

    let s = 0.4;

    p.scale(s, s, s);

    tracking.push(['scale', s, s, s]);

​

    p.rotateY( hour );

    tracking.push(['rot', 'Y', hour]);

    // Earth

    text3D(p, "Earth",  0, -40,0)

    p.noFill();

    p.box();

    // Moon

    text3D(p, "Moon",  120, -20,0)

    p.noFill();

    p.translate(120, 0, 0);

    p.scale(0.26, 0.26, 0.26);

    p.box();

​

  }

}

​

function text3D(p, str, x, y, z){

  p.fill(255,0,0);

  p.push();

​

  p.translate( x,y,z);

  if(faceMe){

    for(let idx=tracking.length-1; idx>=0; idx--){

      if(tracking[idx][0] === 'scale'){

        p.scale(1/tracking[idx][1], 1/tracking[idx][2], 1/tracking[idx][3]);

      }

      if(tracking[idx][0] === 'rot'){

        if(tracking[idx][1] === 'X'){

                    p.rotateX( -tracking[idx][2]);

        }

        if(tracking[idx][1] === 'Y'){

                  p.rotateY( -tracking[idx][2]);

        }

        if(tracking[idx][1] === 'Z'){

                  p.rotateZ( -tracking[idx][2]);

        }

      }

    }

  }  

  p.text(str,0,0);

  p.pop();

}

​

var myp5 = new p5(sketch);

​