I was creating a mouse-based painter app. This is a code of a brush whose color is chosen by a color picker in p5js. all I want is = when i press [T] key, it should be changed into THRESHOLD filter i put this code on here:

if (key === 'T') filter(THRESHOLD);

but it's not working im curious why it isn't:) Is there anybody who can help me thanx https://editor.p5js.org/kiskl/sketches/cFGX_xUWE

const sketch = function(p) {

  let colorPicker;
  let brushSize = 20;
  
  p.setup = function() {
    p.createCanvas(800, 800);
    colorPicker = p.createColorPicker('red');
    colorPicker.position(0, 0);
  };



  p.keyPressed = function(e) {

    let key = e.key;
    if (key === '=') brushSize += brushSize * 0.1;
    else if (key === '-') brushSize -= brushSize * 0.1;
    else if (key === 'c') p.clear();
    
    else if (key === 'T') filter(THRESHOLD); //Here, why isn't it working?
    else if (key === 'I') filter(INVERT);
    else if (key === 'P') filter(POSTERIZE);
  }

  p.mouseDragged = function(e) {
    color = colorPicker.color()
    p.fill(color);
    p.stroke(color);
    p.ellipse(e.clientX, e.clientY, brushSize, brushSize)
  } };

let myp5 = new p5(sketch);