"use strict";
(self["webpackChunkweb_password_filler"] = self["webpackChunkweb_password_filler"] || []).push([[955],{

/***/ 955:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);

// EXPORTS
__webpack_require__.d(__webpack_exports__, {
  endRecording: () => (/* binding */ endRecording),
  setCallback: () => (/* binding */ setCallback),
  startRecording: () => (/* binding */ startRecording)
});

// EXTERNAL MODULE: ./src/scripts/core/ext.js
var ext = __webpack_require__(666);
var ext_default = /*#__PURE__*/__webpack_require__.n(ext);
// EXTERNAL MODULE: ./src/scripts/utils/constants.js
var constants = __webpack_require__(482);
// EXTERNAL MODULE: ./src/scripts/recording/blob-conversion.js
var blob_conversion = __webpack_require__(615);
;// CONCATENATED MODULE: ./src/scripts/recording/lib/OffscreenSession.js
/* eslint-disable import/prefer-default-export */
/* eslint-disable no-console */
/* eslint-disable class-methods-use-this */




class OffscreenSession {
  constructor(id, config = {}, callback) {
    this.config = {
      videoFps: 30,
      videoBitsPerSecond: 4500000,
      segmentSeconds: 1,
      ...config,
    };
    this.id = id;
    this.canvas = this.createCanvas();
    this.meadiaRecorder = this.createMediaRecorder();
    this.mousePointer = new Image();
    this.mousePointer.src = constants.ICONS.MOUSE_POINTER;
    this.oldX = 0;
    this.oldY = 0;
    this.sendVideoSegment = callback;
  }

  createCanvas() {
    const canvas = document.createElement("canvas");
    // eslint-disable-next-line no-restricted-globals
    canvas.width = Math.floor(screen.availWidth) * window.devicePixelRatio;
    // eslint-disable-next-line no-restricted-globals
    canvas.height = Math.floor(screen.availHeight) * window.devicePixelRatio;
    document.body.appendChild(canvas);
    return canvas;
  }

  createMediaRecorder() {
    const stream = this.canvas.captureStream(this.config.videoFps);
    if (!stream) {
      console.error("Failed to create stream");
      return null;
    }
    const mr = new MediaRecorder(stream, {
      mimeType: "video/webm",
      videoBitsPerSecond: this.config.videoBitsPerSecond,
    });

    mr.ondataavailable = (e) => {
      this.dataAvailable(e);
    };

    mr.onstop = () => {
      this.recordingStopped();
    };

    mr.start(1000 * this.config.segmentSeconds);
    return mr;
  } 

  drawToCanvas(imageData, clearCanvas, mousePositions) {
    const ctx = this.canvas.getContext("2d");

    const image = new Image();
    image.onload = async () => {
      if (!ctx) throw new Error("could not get context");
      if (!clearCanvas) {
        ctx.drawImage(image, 0, 0);
        return;
      }
     
      ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
      ctx.drawImage(image, 0, 0);
      if (mousePositions.length === 0) return;  
      let { clientX, clientY } = mousePositions.pop();
      ctx.drawImage(this.mousePointer, clientX, clientY);
    };

    image.src = imageData;
  }


  dataAvailable(e) {
    (0,blob_conversion/* blobToDataURL */.y)(e.data, (data) => {
      if(this.sendVideoSegment) {
        this.sendVideoSegment({
          type: "sendVideoSegment",
          sessionGuid: this.id,
          data,
        });
        return;
      }
      ext_default().runtime.sendMessage({
        type: "sendVideoSegment",
        sessionGuid: this.id,
        data,
      });    
    });
  }

  recordingStopped() {
    console.log("Recording stopped");
  }

  end() {
    this.meadiaRecorder.stop();
    document.body.removeChild(this.canvas);
  }
}

;// CONCATENATED MODULE: ./src/scripts/recording/lib/SessionRecorder.js
/* eslint-disable operator-linebreak */
/* eslint-disable no-console */
/* eslint-disable class-methods-use-this */

// import logger from "../../helpers/logger";


const CLEAR_PNG =
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII=";

// eslint-disable-next-line import/prefer-default-export
class SessionRecorder {
  constructor(config = {}) {
    this.config = {
      videoFps: 30,
      getImageInterval: 500,
      segmentSeconds: 1,
      videoBitsPerSecond: 4500000,
      ...config,
    };
    this.interval = null;
    this.recording = false;
    this.sessions = {};
    this.callbackGetActiveTabData = null;
  }

  setActiveTabData(callback) {
    this.callbackGetActiveTabData = callback;
  }

  startSession(sessionGuid, callback) {
    console.log("Starting session", sessionGuid);
   // logger.logInfo(`Starting session ${sessionGuid}`);
    this.recording = true;

    if (this.sessions[sessionGuid]) {
      console.error("Session already exists");
      return;
    }

    const config = {
      videoFps: this.config.videoFps,
      videoBitsPerSecond: this.config.videoBitsPerSecond,
      segmentSeconds: this.config.segmentSeconds
    };
    this.sessions[sessionGuid] = new OffscreenSession(sessionGuid, config, callback);
    this.ensureInterval();
  }

  endSession(sessionGuid) {
    console.log("Ending session", sessionGuid);
    if (!this.sessions[sessionGuid]) {
      console.error("Could not find session to end");
      return;
    }

    this.sessions[sessionGuid].end();
    delete this.sessions[sessionGuid];

    const ongoingSessions = Object.values(this.sessions).length;
    if (ongoingSessions === 0) {
      this.recording = false;
      clearInterval(this.interval);
      this.interval = null;
    }
  }

  ensureInterval() {
    console.log("Ensuring recording", this.interval);
    if (this.interval) return;

    this.interval = setInterval(
      () => this.updateSessions(),
      this.config.getImageInterval
    );
  }
  async getActiveTabData() {
    if(this.callbackGetActiveTabData) {
     return await this.callbackGetActiveTabData()
    }
    
    return await ext_default().runtime.sendMessage({
      from: "Background",
      type: "getActiveTabData",
    });
  }

  async updateSessions() {
    // console.log("Updating sessions:", this.recording);
    if (!this.recording) return;
  
    const { image, applicableSessionIds, mousePositions } = await this.getActiveTabData()

    Object.values(this.sessions).forEach((session) => {
      if (image && applicableSessionIds.includes(session.id)) {
        session.drawToCanvas(image, true, mousePositions );
        session.lastCapturedDate = Date.now();
        return;
      }  

      if(session.lastCapturedDate) {
        const lapsed = Date.now() - session.lastCapturedDate;
        if (lapsed < 105000) return; // every 105 seconds
      }
      // when there's no applicable image, write a clear png to the canvas
      // to keep the data stream consistent
      session.drawToCanvas(CLEAR_PNG, false, mousePositions);
      session.lastCapturedDate = Date.now();
    });
  }
}

;// CONCATENATED MODULE: ./src/scripts/offscreen.js



const VIDEO_FPS = 30;
// 500 is exceeding the 2 per second limit
const GET_IMAGE_INTERVAL = 550;
const SEGMENT_SECONDS = 1;
const VIDEO_BITS_PER_SECOND = 4500000;

const sessionRecorder = new SessionRecorder({
  videoFps: VIDEO_FPS,
  getImageInterval: GET_IMAGE_INTERVAL,
  segmentSeconds: SEGMENT_SECONDS,
  videoBitsPerSecond: VIDEO_BITS_PER_SECOND,
});

function setCallback(callback) {
  sessionRecorder.setActiveTabData(callback);
}

function startRecording(sessionGuid, callback) {
  sessionRecorder.startSession(sessionGuid, callback);
}

function endRecording(sessionGuid) {
  sessionRecorder.endSession(sessionGuid);
}

ext_default().runtime.onMessage.addListener((message, sender, sendResponse) => {  
  // console.log("Message received:", message); 
  if (message.type === "startRecording") {
    sessionRecorder.startSession(message.sessionGuid);
  }
  if (message.type === "endingSession") {
    sessionRecorder.endSession(message.sessionGuid);
  } 
});

 

/***/ })

}]);
//# sourceMappingURL=955.js.map