Move your paddle

A paddle you can’t move isn’t much fun. The engine calls a function named update() every frame — sixty times a second — so that’s where we read the keyboard and change paddleY.

Add this update() function, just above draw():

function update() {
  if (key('ArrowUp')) {
    paddleY -= 2;
  }
  if (key('ArrowDown')) {
    paddleY += 2;
  }
  paddleY = mid(0, paddleY, 128 - PH);
}

key('ArrowUp') is true while that key is held, so the paddle keeps moving as long as you hold it. mid(0, paddleY, 128 - PH) clamps the value between 0 and the bottom, so the paddle can’t slide off screen — the same trick as Move with the keyboard.

Here’s your whole program now — save it, click the canvas so it hears the keyboard, and hold up/down:

let paddleY = 54;
const PH = 20;

function update() {
  if (key('ArrowUp')) {
    paddleY -= 2;
  }
  if (key('ArrowDown')) {
    paddleY += 2;
  }
  paddleY = mid(0, paddleY, 128 - PH);
}

function draw() {
  cls(0);
  rectfill(124, 0, 127, 127, 6);
  rectfill(6, paddleY, 8, paddleY + PH, 7);
}