let lastUpdateId = 0;

let messages = [];

let arrowSpeed, arrows;

let img, arr, back;

let ww = 1950;

let hh = 940;

let tt = 500;

let tt_shift = 200;

​

function preload() {

  img = loadImage('target.png');

  arr = loadImage('arrow.png');

  back = loadImage('back.png');

}

​

function setup() {

  createCanvas(ww, hh);

  setInterval(fetchTelegramMessages, 1000);

​

  // Arrows

  arrowSpeed = 60;

  arrows = [];

}

​

function draw() {

  background(255);

  textSize(16);

  fill(0);

​

  // Add arrows

  for (let i = 0; i < messages.length; i++) {

    let message = messages[i];

​

    if (!isNaN(message.text)) {

      input = Number(message.text);

      if (input > 20 || input < 1) {

        continue;

      }

      arrows.push(new Arrow(input, arrows.length % 2 == 0));

    }

  }

  messages = [];

​

  // Draw back

  image(back, 0, 0, ww, hh);

  // Draw target

  image(img, tt_shift, hh - tt, tt, tt);

  // Update and draw arrows

  for (let i = 0; i < arrows.length; i++) {

    let arrow = arrows[i];

    arrow.update();

    arrow.display();

  }

}

​

function fetchTelegramMessages() {

  let url = `https://api.telegram.org/bot${botToken}/getUpdates?offset=${

    lastUpdateId + 1

  }`;

​

  httpGet(url, "json", function (response) {

    let newMessages = response.result;

​

    // Filter out any messages that we have already received

    newMessages = newMessages.filter(function (message) {

      return message.update_id > lastUpdateId;

    });

​

    // Add the new messages to the messages array

    messages = messages.concat(

      newMessages.map(function (message) {

        return message.message;

      })

    );

​

    // Update the lastUpdateId to the ID of the last received message

    if (newMessages.length > 0) {

      lastUpdateId = newMessages[newMessages.length - 1].update_id;

    }

  });

}

​

function keyPressed() {

  if (key === ' ') {

    arrows = [];

  }

}

​