How to use the jsqr function in jsqr

const tick = () => {
      this._onReadyStateChange(true);
      if (this._video && this._video.readyState === this._video.HAVE_ENOUGH_DATA) {
        this._onReadyStateChange(false);
        canvasElement.hidden = false;
        canvasElement.height = this._video.videoHeight;
        canvasElement.width = this._video.videoWidth;
        canvas.drawImage(this._video, 0, 0, canvasElement.width, canvasElement.height);
        let imageData = canvas.getImageData(0, 0, canvasElement.width, canvasElement.height);
        let code = jsQR(imageData.data, imageData.width, imageData.height, {
          inversionAttempts: 'dontInvert',
        });

        if (code) {
          let pincode = '';
          let data = code.data.match(/^https?:\/\/(.*?)\/(\d+)_([\da-f]+)$/i);
          if (data) {
            if (data[1].split(':')[0] === 'localhost') { // local debug
              pincode = data[2];
            } else {
              if (
                data[1].split(':')[0] === location.host &&
                crc32(data[2]).toString(16).toLowerCase() === data[3].toLowerCase()
              ) {
                pincode = data[2];
              }

tick() {
        let self = this;
        if (self.video.readyState === self.video.HAVE_ENOUGH_DATA) {
          self.canvasElement.height = self.video.videoHeight;
          self.canvasElement.width = self.video.videoWidth;

          self.canvas.drawImage(self.video, 0, 0, self.canvasElement.width, self.canvasElement.height);
          var imageData = self.canvas.getImageData(0, 0, self.canvasElement.width, self.canvasElement.height);
          var code = jsQR(imageData.data, imageData.width, imageData.height);

          if (code) {
            try {
              let wallet = JSON.parse(code.data)
              console.log('success detect QR, close camera!');

              if(wallet && wallet.data && wallet.data.name){
                  
                  this.stopScan();

                  $("#importWalletName").text(wallet.data.name);
                  self.qrcodeWallet = wallet;
                  $('#importQrcodeModal').modal('show');
              }else{
                console.log('Detect qr, but not NEM qr. continue ...')
              }

reader.onload = (e: ProgressEvent): void => {
        const canvas = document.createElement('canvas');
        canvas.width = width;
        canvas.height = height;
        const ctx = canvas.getContext('2d');
        ctx.drawImage(img, 0, 0, width * 4, height * 4, 0, 0, width, height);
        const {data} = ctx.getImageData(0, 0, width, height);
        const qr = jsQR(data, width, height);
        if (qr) {
          const url = new URLSearchParams(qr.data);
          const recipient = url.get('receiver').trim();
          this.applyRecipientType(recipient);
          this.validateRecipient(recipient);
          this.qrCodeUpload.emit({
            recipient: this.recipient,
            amountNQT: url.get('amountNQT'),
            feeNQT: url.get('feeNQT'),
            immutable: url.get('immutable') === 'true',
            feeSuggestionType: url.get('feeSuggestionType'),
            messageIsText: url.get('messageIsText') !== 'false'
          });
          this.notifierService.notify('success', 'QR parsed successfully');
        } else {
          this.notifierService.notify('error', 'Error parsing QR code');

private tick() {
            if (this.video.readyState === this.video.HAVE_ENOUGH_DATA) {
                const ctx = this.canvasElement.getContext('2d');
                if (ctx) {
                    this.canvasElement.height = this.video.videoHeight;
                    this.canvasElement.width = this.video.videoWidth;
                    ctx.drawImage(this.video, 0, 0, this.canvasElement.width, this.canvasElement.height);
                    const imageData = ctx.getImageData(0, 0, this.canvasElement.width, this.canvasElement.height);
                    const code = jsQR(imageData.data, imageData.width, imageData.height, {
                        inversionAttempts: 'dontInvert',
                    });
                    if (code) {
                        this.surveyCode = code.data
                            .replace(location.origin, '')
                            .replace('https://baloise.github.io', '')
                            .replace('/this-or-that', '')
                            .replace('/index.html', '')
                            .replace('#/', '')
                            .replace('/vote', '')
                            .replace(/\//g, '');
                        if (this.stream) {
                            this.stream.getTracks().forEach(value => value.stop());
                        }
                        this.isScanEnabled = false;
                    }

Jimp.read(imageBuffer, (err, image) => {
        if (err) {
          return reject(err)
        }

        const qrCodeImageArray = new Uint8ClampedArray(image.bitmap.data.buffer)

        const qrCodeResult = jsQR(
          qrCodeImageArray,
          image.bitmap.width,
          image.bitmap.height,
        )

        if (qrCodeResult) {
          return resolve(qrCodeResult.data)
        } else {
          return reject(new Error('WXGetQRCode() qrCode decode fail'))
        }
      })
    })

const p = new Promise(async (resolve) => {
                let code;
                if (videoElem.videoWidth && videoElem.videoHeight) {
                    const imageData = this._createImageData(
                        videoElem,
                        videoElem.videoWidth,
                        videoElem.videoHeight,
                    );

                    code = jsQR(
                        imageData.data,
                        imageData.width,
                        imageData.height,
                        options,
                    );

                    if (code) {
                        resolve(code);
                    } else {
                        this.timerCapture = setTimeout(async () => {
                            code = await this._captureToCanvas(
                                videoElem,
                                options,
                            );
                            resolve(code);
                        }, 500);

_decodeFromImageElm(imgObj, options = {}) {
        const opts = {
            ...this.defaultOption,
            ...options,
        };
        const imageData = this._createImageData(
            imgObj,
            imgObj.width,
            imgObj.height,
        );

        const code = jsQR(
            imageData.data,
            imageData.width,
            imageData.height,
            opts,
        );

        if (code) {
            return code;
        }

        return false;
    }

self.addEventListener("message", function(event) {
  const imageData = event.data;

  const result = jsQR(imageData.data, imageData.width, imageData.height, {
    inversionAttempts: "dontInvert"
  });

  let content = null;
  let location = null;

  if (result !== null) {
    content = result.data;
    location = result.location;
  }

  const message = { content, location, imageData };

  self.postMessage(message, [imageData.data.buffer]);
});

ctxSecond.stroke()
              ctxSecond.beginPath()
              ctxSecond.moveTo(x + w - cbl, y + h)
              ctxSecond.lineTo(x + w, y + h)
              ctxSecond.lineTo(x + w, y + h - cbl)
              ctxSecond.stroke()
              ctxSecond.beginPath()
              ctxSecond.moveTo(x + w - cbl, y)
              ctxSecond.lineTo(x + w, y)
              ctxSecond.lineTo(x + w, y + cbl)
              ctxSecond.stroke()

              if (t - lastCheck >= intervalCheck) {
                lastCheck = t
                const imageData = ctxMain.getImageData(0, 0, width, height)
                const code = jsQR(imageData.data, width, height)

                if (code && code.data) {
                  this.props.onPick(code.data)
                }
              }
            }
            raf = requestAnimationFrame(loop)