​

const DRAW_W = 1250;

const DRAW_H = 192;

​

const msgs = [

  "\"The Royal College of Art will shortchange you\" was the title of a poster recently displayed within its walls at the Battersea campus",

  "The Royal family is complicit in the crimes commited by the British Empire no matter how many centuries have passed",

  "Xinjiang province in Mainland China is currently the site of a massive cultural genocide against the Uyghurs",

  "We are witnessing the collapse of the surveillance capital state - everyday we are. It is only a matter of time",

  "it is easier to imagine an end to the world than an end to capitalism",

  "Think about the strangeness of today's situation. Thirty, forty years ago, we were still debating about what the future will be: communist, fascist, capitalist, whatever. Today, nobody even debates these issues. We all silently accept global capitalism is here to stay. On the other hand, we are obsessed with cosmic catastrophes: the whole life on earth disintegrating, because of some virus, because of an asteroid hitting the earth, and so on.",

  "The United States is poised to reach a previously unthinkable milestone: one million deaths from the coronavirus. The magnitude of loss is nearly impossible to grasp. More Americans have died from Covid-19 than in two decades of car crashes or on battlefields in all of the country’s wars combined. The U.S. toll is higher than that of any other country in the world.",

];

​

const msgsBin = msgs.map((msg) => [...msg].map(c => c.charCodeAt(0).toString(2)).join(''))

​

function setup() {

  createCanvas(DRAW_W, DRAW_H);

}

​

function drawBinaryStrings() {

  background('white');

  const curMsgBin = msgsBin[Math.floor(frameCount / 2) % msgs.length];

  const nextMsgBin = msgsBin[(Math.floor(frameCount / 2) + 2) % msgs.length];

  let rectw = DRAW_W / curMsgBin.length;

  const recth = DRAW_H / 2;

  fill('black');

  [...curMsgBin].forEach((b, i) => {

    if (b == 1) {

      rect(i * rectw, 0, rectw, recth);

    }

  });

  rectw = DRAW_W / nextMsgBin.length;

  [...nextMsgBin].forEach((b, i) => {

    if (b == 1) {

      rect(i * rectw, recth, rectw, recth);

    }

  });

}

​

function drawMarchingRects() {

  background('white');

  const rectw = DRAW_W / 100;

  const recth = DRAW_H / 2;

  const scale = 10;

  fill('black');

  for (let i = -scale; i < 100; i++) {

    if (i % scale == 0) {

      rect(i * rectw + (frameCount % (rectw * scale)), 0, rectw*scale/2, recth);

    }

  }

  for (let i = 0; i < 100 + scale; i++) {

    if (i % scale == 0) {

      rect(i * rectw - (frameCount % (rectw * scale)), recth, rectw*scale/2, recth);

    }

  }

}

​

function draw() {

  if (Math.floor(frameCount / (60*5)) % 2 == 0) {

    drawBinaryStrings();

  } else {

    drawMarchingRects();

  }

}