easyproctor 1.0.3 → 1.0.4

package/README.md

@@ -219,13 +219,9 @@ const {
 });
 ```
 
-## Release Note V 1.0.2
-
-- Correção na função checkDevices
-- Adicionado callback onNoiseDetected
-- Correção de erro relacionado ao link do blob no download e na extensão
-- Correção send percentage on finish with extension
+## Release Note V 1.0.4
 
+- Atualização do modal do checkDevices
 
 ## License
 

package/esm/index.js

@@ -18,6 +18,13 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
 
+// node_modules/form-data/lib/browser.js
+var require_browser = __commonJS({
+  "node_modules/form-data/lib/browser.js"(exports, module) {
+    module.exports = typeof self == "object" ? self.FormData : window.FormData;
+  }
+});
+
 // src/plugins/mp3.js
 var require_mp3 = __commonJS({
   "src/plugins/mp3.js"(exports, module) {
@@ -14301,13 +14308,6 @@ var require_mp3 = __commonJS({
   }
 });
 
-// node_modules/form-data/lib/browser.js
-var require_browser = __commonJS({
-  "node_modules/form-data/lib/browser.js"(exports, module) {
-    module.exports = typeof self == "object" ? self.FormData : window.FormData;
-  }
-});
-
 // src/modules/checkPermissions.ts
 async function checkPermissions() {
   try {
@@ -14356,12 +14356,6 @@ async function enumarateDevices() {
   return devices;
 }
 
-// src/plugins/MicRecorder2.ts
-var MicRecorder = require_mp3();
-function createMicRecorder(config) {
-  return new MicRecorder(config);
-}
-
 // src/new-flow/proctoring/ProctoringSession.ts
 var ProctoringSession = class {
   constructor(id) {
@@ -14411,47 +14405,6 @@ var ProctoringSession = class {
   }
 };
 
-// src/new-flow/recorders/AudioRecorder.ts
-var AudioRecorder = class {
-  constructor() {
-    this.blobs = [];
-  }
-  async startRecording() {
-    this.recorder = createMicRecorder({
-      bitRate: 128
-    });
-    this.recorder.start().catch((e) => {
-      throw new Error("Error on Audio to Start Recording");
-    });
-  }
-  async pauseRecording() {
-  }
-  async resumeRecording() {
-  }
-  async stopRecording() {
-    if (!this.recorder)
-      return;
-    const response = await this.recorder.stop().getMp3().then(async ([buffer, blob]) => {
-      return { buffer, blob };
-    }).catch((e) => {
-      alert("We could not retrieve your message");
-      return void 0;
-    });
-    if (response) {
-      this.blobs.push(response.blob);
-    }
-  }
-  async saveOnSession(session) {
-    session.addRecording({
-      device: "",
-      file: new File(this.blobs, `EP_${session.id}_audio_0.mp3`, {
-        type: "audio/mp3"
-      }),
-      origin: "Mic" /* Mic */
-    });
-  }
-};
-
 // src/plugins/recorder.ts
 function recorder(stream, buffer, audio = false) {
   let resolvePromise;
@@ -14577,67 +14530,47 @@ var CameraRecorder = class {
   }
 };
 
-// src/errors/errors.ts
-var NOT_SHARED_FIRST_SCREEN = "not_shared_first_screen";
-var MULTIPLE_MONITORS_DETECTED = "multiple_monitors_detected";
-var PROCTORING_ALREADY_STARTED = "proctoring_already_started";
-var PROCTORING_NOT_STARTED = "proctoring_not_started";
-
-// src/new-flow/recorders/ScreenRecorder.ts
-var ScreenRecorder = class {
-  constructor(options) {
-    this.blobs = [];
-    this.blobsFinal = [];
-    this.options = options;
+// src/new-flow/recorders/VolumeMeter.ts
+var VolumeMeter = class {
+  constructor(stream) {
+    this.stream = stream;
   }
-  async startRecording() {
-    this.startTime = new Date(Date.now());
-    const { allowOnlyFirstMonitor, onStopSharingScreenCallback } = this.options;
-    const displayMediaStreamConstraints = {
-      video: {
-        cursor: "always"
-      },
-      audio: false
-    };
-    this.screenStream = await navigator.mediaDevices.getDisplayMedia(displayMediaStreamConstraints);
-    const tracks = this.screenStream.getVideoTracks();
-    tracks[0].onended = onStopSharingScreenCallback;
-    const isFirefox = navigator.userAgent.indexOf("Firefox") > -1;
-    if (isFirefox) {
-      const hasMultipleMonitors = !tracks.find((el) => el.label == "Primary Monitor");
-      if (hasMultipleMonitors && allowOnlyFirstMonitor) {
-        throw MULTIPLE_MONITORS_DETECTED;
+  start(options = {}) {
+    return new Promise((resolve, reject) => {
+      try {
+        const audioContext = new AudioContext();
+        const analyser = audioContext.createAnalyser();
+        const microphone = audioContext.createMediaStreamSource(this.stream);
+        this.scriptProcessor = audioContext.createScriptProcessor(2048, 1, 1);
+        analyser.smoothingTimeConstant = 0.8;
+        analyser.fftSize = 1024;
+        microphone.connect(analyser);
+        analyser.connect(this.scriptProcessor);
+        this.scriptProcessor.connect(audioContext.destination);
+        const that = this;
+        this.scriptProcessor.onaudioprocess = function() {
+          const array = new Uint8Array(analyser.frequencyBinCount);
+          analyser.getByteFrequencyData(array);
+          const arraySum = array.reduce((a, value) => a + value, 0);
+          const average = arraySum / array.length;
+          that.setVolume(average);
+          options.setVolume && options.setVolume(average);
+        };
+        resolve(true);
+      } catch (error) {
+        this.stop();
+        reject(`Error: ${error}`);
       }
-    }
-    const sharedFirstScreen = tracks.find((el) => {
-      return ["screen:0:0", "Primary Monitor"].includes(el.label);
-    }) != null;
-    if (!sharedFirstScreen && allowOnlyFirstMonitor) {
-      tracks.forEach((el) => {
-        el.stop();
-      });
-      throw NOT_SHARED_FIRST_SCREEN;
-    }
-    const { startRecording, stopRecording } = recorder(this.screenStream, this.blobs);
-    this.recordingStart = startRecording;
-    this.recordingStop = stopRecording;
-    this.recordingStart();
-  }
-  async pauseRecording() {
+    });
   }
-  async resumeRecording() {
+  stop() {
+    this.scriptProcessor && this.scriptProcessor.disconnect();
   }
-  async stopRecording() {
-    await this.recordingStop();
+  getVolume() {
+    return this.volume;
   }
-  async saveOnSession(session) {
-    session.addRecording({
-      device: "",
-      file: new File(this.blobs, `EP_${session.id}_screen_0.webm`, {
-        type: "video/webm"
-      }),
-      origin: "Screen" /* Screen */
-    });
+  setVolume(value) {
+    this.volume = value;
   }
 };
 
@@ -14697,55 +14630,118 @@ var DeviceChecker = class {
       const modal = document.createElement("div");
       modal.style.backgroundColor = "#fff";
       modal.style.zIndex = "1001";
-      modal.style.width = "400px";
+      modal.style.width = "600px";
       modal.style.borderRadius = "10px";
-      modal.style.padding = "20px 10px";
       modal.style.display = "flex";
       modal.style.flexDirection = "column";
       modal.style.alignItems = "center";
       const h3 = document.createElement("h3");
-      h3.innerText = "Verificar dispositivos";
-      h3.style.color = "rgb(22, 163, 74)";
+      h3.innerText = "Para iniciar configure a c\xE2mera e o microfone";
+      h3.style.color = "rgba(0, 0, 0, .7)";
       h3.style.fontWeight = "bold";
-      h3.style.fontSize = "26px";
+      h3.style.fontSize = "20px";
       h3.style.marginBottom = "15px";
+      h3.style.padding = "20px 0px";
+      h3.style.borderBottom = "2px solid rgba(0, 0, 0, .1)";
+      h3.style.width = "100%";
+      h3.style.textAlign = "center";
       modal.appendChild(h3);
+      const divCameraHeader = document.createElement("div");
+      const h3Camera = document.createElement("h3");
+      const selectCamera = document.createElement("select");
+      selectCamera.setAttribute("id", "cameraSelect");
+      divCameraHeader.style.padding = "0 20px";
+      divCameraHeader.style.width = "100%";
+      divCameraHeader.style.display = "flex";
+      divCameraHeader.style.justifyContent = "space-between";
+      divCameraHeader.style.marginBottom = "15px";
+      h3Camera.innerText = "C\xE2mera";
+      h3Camera.style.color = "rgba(0, 0, 0, .75)";
+      h3Camera.style.fontWeight = "bold";
+      h3Camera.style.fontSize = "16px";
+      selectCamera.style.maxWidth = "400px";
+      divCameraHeader.appendChild(h3Camera);
+      divCameraHeader.appendChild(selectCamera);
+      modal.appendChild(divCameraHeader);
+      const divCamera = document.createElement("div");
       const video = document.createElement("video");
       video.setAttribute("id", "cameraStream");
+      video.muted = true;
+      divCamera.style.width = "calc(100% - 40px)";
+      divCamera.style.display = "flex";
+      divCamera.style.justifyContent = "space-between";
+      divCamera.style.borderBottom = "2px solid rgba(0, 0, 0, .1)";
+      divCamera.style.paddingBottom = "15px";
       video.style.width = "20rem";
       video.style.backgroundColor = "#000";
       video.style.borderRadius = "10px";
       video.style.marginBottom = "15px";
-      modal.appendChild(video);
-      const meter = document.createElement("meter");
-      meter.setAttribute("id", "audioStream");
-      meter.setAttribute("high", "0.25");
-      meter.setAttribute("max", "1");
-      meter.style.width = "20rem";
-      meter.style.borderRadius = "10px";
-      meter.style.marginBottom = "15px";
-      modal.appendChild(meter);
+      divCamera.appendChild(video);
+      modal.appendChild(divCamera);
+      const divMicHeader = document.createElement("div");
+      const h3Mic = document.createElement("h3");
+      const selectMic = document.createElement("select");
+      selectMic.setAttribute("id", "micSelect");
+      divMicHeader.style.padding = "0 20px";
+      divMicHeader.style.width = "100%";
+      divMicHeader.style.display = "flex";
+      divMicHeader.style.justifyContent = "space-between";
+      divMicHeader.style.margin = "15px 0";
+      h3Mic.innerText = "C\xE2mera";
+      h3Mic.style.color = "rgba(0, 0, 0, .7)";
+      h3Mic.style.fontWeight = "bold";
+      h3Mic.style.fontSize = "16px";
+      selectMic.style.maxWidth = "400px";
+      divMicHeader.appendChild(h3Mic);
+      divMicHeader.appendChild(selectMic);
+      modal.appendChild(divMicHeader);
+      const divMic = document.createElement("div");
+      divMic.style.width = "calc(100% - 40px)";
+      divMic.style.display = "flex";
+      divMic.style.justifyContent = "space-between";
+      divMic.style.paddingBottom = "15px";
+      const divMeter = document.createElement("div");
+      divMeter.setAttribute("id", "audioStream");
+      divMeter.style.display = "flex";
+      divMeter.style.marginBottom = "15px";
+      for (let i = 0; i < 25; i++) {
+        const pill = document.createElement("div");
+        pill.style.height = "16px";
+        pill.style.width = "5px";
+        pill.style.marginRight = "5px";
+        pill.style.borderRadius = "10px";
+        pill.style.backgroundColor = "rgba(0, 0, 0, .3)";
+        divMeter.appendChild(pill);
+      }
+      divMic.appendChild(divMeter);
+      modal.appendChild(divMic);
       const button = document.createElement("button");
+      const divBtn = document.createElement("div");
       button.setAttribute("id", "confirmBtn");
-      button.innerText = "Confirmar";
-      button.style.width = "200px";
-      button.style.height = "50px";
-      button.style.backgroundColor = "rgb(22, 163, 74)";
-      button.style.color = "#fff";
+      divBtn.style.width = "100%";
+      divBtn.style.display = "flex";
+      divBtn.style.alignItems = "center";
+      divBtn.style.justifyContent = "center";
+      divBtn.style.borderTop = "2px solid rgba(0, 0, 0, .1)";
+      button.innerText = "Continuar";
+      button.style.width = "100%";
+      button.style.height = "70px";
+      button.style.color = "rgba(0, 0, 0, .7)";
+      button.style.fontWeight = "bold";
       button.style.borderRadius = "10px";
+      button.style.paddingTop = "5px";
+      button.style.paddingBottom = "5px";
       button.addEventListener("click", () => {
         this.closeCheckDevices();
         resolve("Complete");
       });
-      modal.appendChild(button);
+      divBtn.appendChild(button);
+      modal.appendChild(divBtn);
       fullBg.appendChild(modal);
       document.body.appendChild(fullBg);
       this.startCheckDevices(this.options, this.videoOptions);
     });
   }
-  async startDevice() {
-    const { cameraStream, _screenStream } = await this.startCheckDevices(this.options, this.videoOptions);
-  }
   videoDeviceInterface(stream) {
     const cameraStream = document.querySelector("#cameraStream");
     if (cameraStream) {
@@ -14755,24 +14751,78 @@ var DeviceChecker = class {
   }
   audioDeviceInterface(stream) {
     const audioStream = document.querySelector("#audioStream");
-    const audioContext = new AudioContext();
-    const mediaStreamAudioSourceNode = audioContext.createMediaStreamSource(stream);
-    const analyserNode = audioContext.createAnalyser();
-    mediaStreamAudioSourceNode.connect(analyserNode);
-    const pcmData = new Float32Array(analyserNode.fftSize);
-    const onFrame = () => {
-      analyserNode.getFloatTimeDomainData(pcmData);
-      let sumSquares = 0;
-      for (const amplitude of pcmData) {
-        sumSquares += amplitude * amplitude;
-      }
-      audioStream.value = Math.sqrt(sumSquares / pcmData.length);
-      window.requestAnimationFrame(onFrame);
+    const pillList = audioStream == null ? void 0 : audioStream.querySelectorAll("div");
+    this.volumeMeter = new VolumeMeter(this.cameraRecorder.cameraStream);
+    this.volumeMeter.start({
+      setVolume: (value) => {
+        const pillValue = value / 4;
+        pillList == null ? void 0 : pillList.forEach((item, index) => {
+          index < Math.ceil(pillValue) ? item.style.backgroundColor = "rgb(22, 163, 74)" : item.style.backgroundColor = "rgba(0, 0, 0, .3)";
+        });
+      }
+    }).catch((e) => {
+      console.log(e);
+      this.volumeMeter = void 0;
+    });
+  }
+  async setSelectOption(options) {
+    const cameras = document.querySelector("#cameraSelect");
+    const microphones = document.querySelector("#micSelect");
+    const devices = await enumarateDevices();
+    cameras && (cameras.value = options.cameraId || "default");
+    microphones && (microphones.value = options.microphoneId || "default");
+    const generateOption = (text, value) => {
+      const el = document.createElement("option");
+      el.setAttribute("value", value);
+      el.innerHTML = text;
+      return el;
     };
-    window.requestAnimationFrame(onFrame);
+    devices.cameras.forEach((camera) => {
+      const option = generateOption(camera.label, camera.id);
+      cameras == null ? void 0 : cameras.appendChild(option);
+    });
+    devices.microphones.forEach((microphone) => {
+      const option = generateOption(microphone.label, microphone.id);
+      microphones == null ? void 0 : microphones.appendChild(option);
+    });
+    this.onSelectOptionChange();
+  }
+  async onSelectOptionChange() {
+    const cameras = document.querySelector("#cameraSelect");
+    const microphones = document.querySelector("#micSelect");
+    cameras == null ? void 0 : cameras.addEventListener("change", async () => {
+      var _a2;
+      await this.cameraRecorder.stopRecording();
+      (_a2 = this.volumeMeter) == null ? void 0 : _a2.stop();
+      this.cameraRecorder = new CameraRecorder({
+        cameraId: cameras == null ? void 0 : cameras.value,
+        microphoneId: microphones == null ? void 0 : microphones.value
+      }, {
+        width: this.videoOptions.width,
+        height: this.videoOptions.height
+      });
+      await this.cameraRecorder.startRecording();
+      this.videoDeviceInterface(this.cameraRecorder.cameraStream);
+      this.audioDeviceInterface(this.cameraRecorder.cameraStream);
+    });
+    microphones == null ? void 0 : microphones.addEventListener("change", async () => {
+      var _a2;
+      await this.cameraRecorder.stopRecording();
+      (_a2 = this.volumeMeter) == null ? void 0 : _a2.stop();
+      this.cameraRecorder = new CameraRecorder({
+        cameraId: cameras == null ? void 0 : cameras.value,
+        microphoneId: microphones == null ? void 0 : microphones.value
+      }, {
+        width: this.videoOptions.width,
+        height: this.videoOptions.height
+      });
+      await this.cameraRecorder.startRecording();
+      this.videoDeviceInterface(this.cameraRecorder.cameraStream);
+      this.audioDeviceInterface(this.cameraRecorder.cameraStream);
+    });
   }
   async startCheckDevices(options = getDefaultProctoringOptions, _videoOptions) {
-    var _a2;
+    this.setSelectOption(options);
     this.videoOptions = validatePartialVideoOptions(_videoOptions);
     await checkPermissions();
     this.cameraRecorder = new CameraRecorder({
@@ -14782,35 +14832,26 @@ var DeviceChecker = class {
       width: this.videoOptions.width,
       height: this.videoOptions.height
     });
-    this.audioRecorder = new AudioRecorder();
-    this.screenRecorder = options.captureScreen ? new ScreenRecorder({
-      allowOnlyFirstMonitor: options.allowOnlyFirstMonitor || options.allowOnlyFirstMonitor == void 0 ? true : false,
-      onStopSharingScreenCallback: () => {
-      }
-    }) : void 0;
     await this.cameraRecorder.startRecording();
-    await this.audioRecorder.startRecording();
-    if (this.screenRecorder) {
-      await this.screenRecorder.startRecording();
-    }
     this.videoDeviceInterface(this.cameraRecorder.cameraStream);
     this.audioDeviceInterface(this.cameraRecorder.cameraStream);
     return {
-      cameraStream: this.cameraRecorder.cameraStream,
-      _screenStream: (_a2 = this.screenRecorder) == null ? void 0 : _a2.screenStream
+      cameraStream: this.cameraRecorder.cameraStream
     };
   }
   async closeCheckDevices() {
     const checkDevices = document.querySelector("#checkDevices");
     checkDevices == null ? void 0 : checkDevices.remove();
     await this.cameraRecorder.stopRecording();
-    await this.audioRecorder.stopRecording();
-    if (this.screenRecorder) {
-      await this.screenRecorder.stopRecording();
-    }
   }
 };
 
+// src/errors/errors.ts
+var NOT_SHARED_FIRST_SCREEN = "not_shared_first_screen";
+var MULTIPLE_MONITORS_DETECTED = "multiple_monitors_detected";
+var PROCTORING_ALREADY_STARTED = "proctoring_already_started";
+var PROCTORING_NOT_STARTED = "proctoring_not_started";
+
 // src/extension/extension.ts
 var Extension = class {
   constructor() {
@@ -25056,49 +25097,6 @@ var ProctoringUploader = class {
   }
 };
 
-// src/new-flow/recorders/VolumeMeter.ts
-var VolumeMeter = class {
-  constructor(stream) {
-    this.stream = stream;
-  }
-  start() {
-    return new Promise((resolve, reject) => {
-      try {
-        const audioContext = new AudioContext();
-        const analyser = audioContext.createAnalyser();
-        const microphone = audioContext.createMediaStreamSource(this.stream);
-        this.scriptProcessor = audioContext.createScriptProcessor(2048, 1, 1);
-        analyser.smoothingTimeConstant = 0.8;
-        analyser.fftSize = 1024;
-        microphone.connect(analyser);
-        analyser.connect(this.scriptProcessor);
-        this.scriptProcessor.connect(audioContext.destination);
-        const that = this;
-        this.scriptProcessor.onaudioprocess = function() {
-          const array = new Uint8Array(analyser.frequencyBinCount);
-          analyser.getByteFrequencyData(array);
-          const arraySum = array.reduce((a, value) => a + value, 0);
-          const average = arraySum / array.length;
-          that.setVolume(average);
-        };
-        resolve(true);
-      } catch (error) {
-        this.stop();
-        reject(`Error: ${error}`);
-      }
-    });
-  }
-  stop() {
-    this.scriptProcessor && this.scriptProcessor.disconnect();
-  }
-  getVolume() {
-    return this.volume;
-  }
-  setVolume(value) {
-    this.volume = value;
-  }
-};
-
 // src/new-flow/recorders/AlertRecorder.ts
 var AlertRecorder = class {
   constructor(options, optionsProctoring, cameraRecorder) {
@@ -25178,6 +25176,111 @@ var AlertRecorder = class {
   }
 };
 
+// src/plugins/MicRecorder2.ts
+var MicRecorder = require_mp3();
+function createMicRecorder(config) {
+  return new MicRecorder(config);
+}
+
+// src/new-flow/recorders/AudioRecorder.ts
+var AudioRecorder = class {
+  constructor() {
+    this.blobs = [];
+  }
+  async startRecording() {
+    this.recorder = createMicRecorder({
+      bitRate: 128
+    });
+    this.recorder.start().catch((e) => {
+      throw new Error("Error on Audio to Start Recording");
+    });
+  }
+  async pauseRecording() {
+  }
+  async resumeRecording() {
+  }
+  async stopRecording() {
+    if (!this.recorder)
+      return;
+    const response = await this.recorder.stop().getMp3().then(async ([buffer, blob]) => {
+      return { buffer, blob };
+    }).catch((e) => {
+      alert("We could not retrieve your message");
+      return void 0;
+    });
+    if (response) {
+      this.blobs.push(response.blob);
+    }
+  }
+  async saveOnSession(session) {
+    session.addRecording({
+      device: "",
+      file: new File(this.blobs, `EP_${session.id}_audio_0.mp3`, {
+        type: "audio/mp3"
+      }),
+      origin: "Mic" /* Mic */
+    });
+  }
+};
+
+// src/new-flow/recorders/ScreenRecorder.ts
+var ScreenRecorder = class {
+  constructor(options) {
+    this.blobs = [];
+    this.blobsFinal = [];
+    this.options = options;
+  }
+  async startRecording() {
+    this.startTime = new Date(Date.now());
+    const { allowOnlyFirstMonitor, onStopSharingScreenCallback } = this.options;
+    const displayMediaStreamConstraints = {
+      video: {
+        cursor: "always"
+      },
+      audio: false
+    };
+    this.screenStream = await navigator.mediaDevices.getDisplayMedia(displayMediaStreamConstraints);
+    const tracks = this.screenStream.getVideoTracks();
+    tracks[0].onended = onStopSharingScreenCallback;
+    const isFirefox = navigator.userAgent.indexOf("Firefox") > -1;
+    if (isFirefox) {
+      const hasMultipleMonitors = !tracks.find((el) => el.label == "Primary Monitor");
+      if (hasMultipleMonitors && allowOnlyFirstMonitor) {
+        throw MULTIPLE_MONITORS_DETECTED;
+      }
+    }
+    const sharedFirstScreen = tracks.find((el) => {
+      return ["screen:0:0", "Primary Monitor"].includes(el.label);
+    }) != null;
+    if (!sharedFirstScreen && allowOnlyFirstMonitor) {
+      tracks.forEach((el) => {
+        el.stop();
+      });
+      throw NOT_SHARED_FIRST_SCREEN;
+    }
+    const { startRecording, stopRecording } = recorder(this.screenStream, this.blobs);
+    this.recordingStart = startRecording;
+    this.recordingStop = stopRecording;
+    this.recordingStart();
+  }
+  async pauseRecording() {
+  }
+  async resumeRecording() {
+  }
+  async stopRecording() {
+    await this.recordingStop();
+  }
+  async saveOnSession(session) {
+    session.addRecording({
+      device: "",
+      file: new File(this.blobs, `EP_${session.id}_screen_0.webm`, {
+        type: "video/webm"
+      }),
+      origin: "Screen" /* Screen */
+    });
+  }
+};
+
 // src/new-flow/repository/IndexDbSessionRepository.ts
 var IndexDbSessionRepository = class {
   constructor(dbName, storeName) {