fast.js

  mouseDown = () => {
    let tryFunc = (x, y) => {
      try{
        let newWASM = this.state.wasm.handle_mouse_down(
          this.state.sprayImg.width, 
          this.state.sprayImg.height, 
          this.canvasRefWASM.current.width, 
          this.canvasRefWASM.current.height,
          x,
          y,
          this.state.sprayImg.data);
        console.log('value of newWasm: ', newWASM);
      }
      catch(e){
        console.log('there was an error: ', e);
      }
    }

    const asyncFunc = async () => {
      let x = await this.dragArray[this.dragArray.length - 1].x;
      let y = await this.dragArray[this.dragArray.length - 1].y;
      tryFunc(x, y);
    }
    asyncFunc();
  }



mouseMove = (event) => {
    this.mouseListener(event);
    if(this.state.mouseDown && this.state.sprayImg!=''){
      this.dragArray.push({
        x: event.clientX - this.rectWASM.left,
        y: event.clientY - this.rectWASM.top
      })
      this.mouseDown()
    }
  }



handleCurrentFrame = () => {
    let pointerBool = this.state.canvasArray[this.state.currentFrameNum].pointer;
    if(pointerBool){
      this.canvasRefInteract.current.removeEventListener('mousemove', this.mouseMove);
      this.canvasRefInteract.current.addEventListener('mousemove', this.mouseMove);
    }
  }