let slider;

​

function setup() {

  createCanvas(400, 200);

​

  // Create a slider to control brightness

  slider = createSlider(0, 255, 128);

​

}

​

function draw() {

​

// one value from Arduino controls the background's red color

  background(map(rVal, 0, 1023, 0, 255), 255, 255);

​

  // the other value controls the text's transparency value

  fill(255, 0, 255, map(alpha, 0, 1023, 0, 255));

​

  if (!serialActive) {

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

  } else {

    text("Connected", 20, 30);

​

    // Print the current values

    text('rVal = ' + str(rVal), 20, 50);

    text('alpha = ' + str(alpha), 20, 70);

  // Display the slider

  fill(0);

  textSize(16);

  textAlign(CENTER, CENTER);

  text("Slide to control LED brightness", width / 2, height / 4);

  text(slider.value(), width / 2, height / 2);

}

​

function mousePressed() {

  // Send the brightness value to Arduino when mouse is pressed

  let brightnessValue = slider.value();

  serial.write('B' + brightnessValue);

}

​

// Function to print the list of available serial ports

function printList(portList) {

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

    print(i + " " + portList[i]);

  }

}

​

// Function to handle incoming serial data

function serialEvent() {

  // You can handle incoming data from Arduino here if needed

}

​