var cnv = {

  w: 500,

  h: 500

};

var pivot = {

  x: cnv.w / 2,

  y: cnv.h / 2

};

var fr = 90;

var tracer;

​

// The parameters of the problem

const dt = 1.0 / fr;

const g = 9.8;

​

// The variables of the problem

var sp;

var vp;

​

// setup capture

// let framerate = 90;

// var capturer = new CCapture( {format: 'webm',  framerate,  name: 'double_pendulum',  quality: 95, verbose: true} );

// let canvas;

​

function setup() {

  // put setup code here

  var cnvs = createCanvas(cnv.w, cnv.h);

  frameRate(fr);

  tracer = createGraphics(cnv.w, cnv.h);

​

  // Create stretchy-pendulum instances

  sp = new StretchyPendulum(1, 100, 1);

​

  sp.initialize(dt, 1.01*sp.length, 2.5, 0, 0);

  sp.setColor(120, 0, 0);

​

  sp.pivot = createVector(pivot.x, pivot.y);

​

  vp = sp.loc;

  // Start the capturer

  // canvas = cnvs.canvas;

  // capturer.start();

  // draw();

  // noLoop();

}

​

function draw() {

  // Black background, white pendulum

  background(220);

​

  // tracer

  let w = 1.9*exp(-(sp.angvel**2)/10) + 0.7

  tracer.strokeCap(SQUARE);

  tracer.stroke(150, 0, 0, 100);

  tracer.strokeWeight(w);

  tracer.line(vp.x, vp.y, sp.loc.x, sp.loc.y);

  if(frameCount%8 == 0) tracer.background(220, 5);

  image(tracer, 0, 0);

  vp = sp.loc;

​

  sp.paint();

  sp.step();

  sp.integrate();

  // if(frameCount >= 60) {

  //   noLoop();

  // }

  // if(frameCount >= 3600) {

  //   capturer.stop();

  //   capturer.save();

  //   noLoop();

  // }

  // else capturer.capture(canvas);

}