let frequency = 0.09;  // Speed of the bobbing

​

let redUP_arrowPressed = false; 

let redDOWN_arrowPressed = false;

let redRIGHT_arrowPressed = false;

let redLEFT_arrowPressed = false; 

​

let blueUP_arrowPressed = false; 

let blueDOWN_arrowPressed = false;

let blueRIGHT_arrowPressed = false;

let blueLEFT_arrowPressed = false; 

​

​

function setup() {

  createCanvas(400, 400);

}

​

class playerCharacters {

  // x1Body, y1Body, x2Body, y2Body, x3Body, y3Body,

  constructor(color, xHead, yHead){

    this.amp = amplitude; 

    this.freq = frequency;

    this.playerColor = color; 

    this.xHead = xHead + width / 2;

    this.yHead = yHead + height / 2 + sin(frameCount * this.freq) * this.amp;

    this.x1Body = this.xHead - 20;

    this.y1Body = this.yHead + 150;

    this.x2Body = this.xHead - 20;

    this.y2Body = this.yHead + 2; 

    this.x3Body = this.xHead + 20;

    this.y3Body = this.yHead + 2;   

    this.x4Body = this.xHead + 20;

    this.y4Body = this.yHead + 150;

    this.showBody = true; 

  }

​

  player1Moves() {

    fill(this.playerColor);

    if (redUP_arrowPressed == 0) {

      ellipse(this.xHead, this.yHead - 8, 50, 50);  

​

      let y1temp = this.y1Body - 50; 

      let y4temp = this.y4Body - 50; 

      bezier(this.x1Body, y1temp, this.x2Body, this.y2Body, this.x3Body, this.y3Body, this.x4Body, y4temp);

    } 

    else if (redDOWN_arrowPressed == 0){

      ellipse(this.xHead, this.yHead + 50, 50, 50);  

      let y2temp = this.y2Body + 50; 

      let y3temp = this.y3Body + 50; 

      bezier(this.x1Body, this.y1Body, this.x2Body, y2temp, this.x3Body, y3temp, this.x4Body, this.y4Body);

    }

    else if (redRIGHT_arrowPressed == 0){

      ellipse(this.xHead + 37, this.yHead + 18, 50, 50); 

      let x1temp = this.x1Body + 10;

      let x4temp = this.x4Body + 20;

      let x2temp = this.x2Body + 35;

      let y2temp = this.y2Body + 18;

      let x3temp = this.x3Body + 50;

      let y3temp = this.y3Body + 18;

      bezier(x1temp, this.y1Body, x2temp, y2temp, x3temp, y3temp, x4temp, this.y4Body);     

    }

    else if (redLEFT_arrowPressed == 0){

      ellipse(this.xHead - 37, this.yHead + 18, 50, 50); 

      let x1temp = this.x1Body - 20;

      let x4temp = this.x4Body - 10;

      let x2temp = this.x2Body - 50;

      let y2temp = this.y2Body + 18;

      let x3temp = this.x3Body - 35;

      let y3temp = this.y3Body + 18;

      bezier(x1temp, this.y1Body, x2temp, y2temp, x3temp, y3temp, x4temp, this.y4Body);  

    }

​

    else {

      ellipse(this.xHead, this.yHead, 50, 50);  

      bezier(this.x1Body, this.y1Body, this.x2Body, this.y2Body, this.x3Body, this.y3Body, this.x4Body, this.y4Body);

    }

  }

  player2Moves() {

    fill(this.playerColor);

    if (blueUP_arrowPressed == 0) {

      ellipse(this.xHead, this.yHead - 8, 50, 50);  

​

      let y1temp = this.y1Body - 50; 

      let y4temp = this.y4Body - 50; 

      bezier(this.x1Body, y1temp, this.x2Body, this.y2Body, this.x3Body, this.y3Body, this.x4Body, y4temp);

    } 

    else if (blueDOWN_arrowPressed == 0){

      ellipse(this.xHead, this.yHead + 50, 50, 50);  

      let y2temp = this.y2Body + 50; 

      let y3temp = this.y3Body + 50; 

      bezier(this.x1Body, this.y1Body, this.x2Body, y2temp, this.x3Body, y3temp, this.x4Body, this.y4Body);

    }

    else if (blueRIGHT_arrowPressed == 0){

      ellipse(this.xHead + 37, this.yHead + 18, 50, 50); 

      let x1temp = this.x1Body + 10;

      let x4temp = this.x4Body + 20;

      let x2temp = this.x2Body + 35;

      let y2temp = this.y2Body + 18;

      let x3temp = this.x3Body + 50;

      let y3temp = this.y3Body + 18;

      bezier(x1temp, this.y1Body, x2temp, y2temp, x3temp, y3temp, x4temp, this.y4Body);   

    }

    else if (blueLEFT_arrowPressed == 0){

      ellipse(this.xHead - 37, this.yHead + 18, 50, 50); 

      let x1temp = this.x1Body - 20;

      let x4temp = this.x4Body - 10;

      let x2temp = this.x2Body - 50;

      let y2temp = this.y2Body + 18;

      let x3temp = this.x3Body - 35;

      let y3temp = this.y3Body + 18;

      bezier(x1temp, this.y1Body, x2temp, y2temp, x3temp, y3temp, x4temp, this.y4Body);  

    }

    else {

      ellipse(this.xHead, this.yHead, 50, 50);  

      bezier(this.x1Body, this.y1Body, this.x2Body, this.y2Body, this.x3Body, this.y3Body, this.x4Body, this.y4Body);

    }

  }

}

​

function draw() {

  background(220);

  if (isCheckSerial()){

    noStroke();

    player1 = new playerCharacters('red', -65, 0);

    player2 = new playerCharacters('blue', 65, 0);

​

    player1.player1Moves();

    player2.player2Moves();

  }

}

​

function isCheckSerial(){

  if (!serialActive) {

    fill('black');

    text("Press Space Bar to select Serial Port", 20, 30);

    return false;

  } else {

    fill('black');

    text("Connected", 20, 30);

    return true;

  }

}

​

function keyPressed() {

  if (key === " ") {

    setUpSerial();  // Initiate serial connection when spacebar is pressed

  }

}

​

function readSerial(data) {

  // Send control values (left, right) to Arduino

  if (data){

    let fromArduino = split(trim(data), ",");

    redUP_arrowPressed = int(fromArduino[0]);

    redDOWN_arrowPressed = int(fromArduino[1]);

    redRIGHT_arrowPressed = int(fromArduino[2]);

    redLEFT_arrowPressed = int(fromArduino[3]); 

    blueUP_arrowPressed = int(fromArduino[4]);

    blueDOWN_arrowPressed = int(fromArduino[5]);

    blueRIGHT_arrowPressed = int(fromArduino[6]);

    blueLEFT_arrowPressed = int(fromArduino[7]); 

    // console.log(fromArduino)

    // let sendToArduino = `${blue_LED},${red_LED}\n`;

    // console.log(data, sendToArduino);  // Log incoming data and what is being sent

    // writeSerial(sendToArduino);  // Send control data to Arduino

  }

}

​

​

​