@newtonschool/react_proctoring_library 0.0.41 → 0.0.43

package/dist/components/activity-tracker/index.js

@@ -0,0 +1,143 @@
+"use strict";
+
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactWebcam = _interopRequireDefault(require("react-webcam"));
+var _utils = require("../../utils");
+var _breachUtils = require("../../utils/breachUtils");
+var _browserUtils = require("../../utils/browserUtils");
+var _webcamMicrophoneUtils = require("../../utils/webcamMicrophoneUtils");
+require("./index.scss");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const ActivityTracker = _ref => {
+  let {
+    proctorParams,
+    webcamReference,
+    canvasReference,
+    screenshareReference,
+    setAudioPermission,
+    setVideoPermission
+  } = _ref;
+  const screenshareVideoReference = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
+    if (screenshareReference.current) {
+      screenshareVideoReference.current.srcObject = screenshareReference.current;
+      screenshareVideoReference.current.onloadedmetadata = e => {
+        screenshareVideoReference.current.play();
+      };
+    }
+    return () => {
+      screenshareVideoReference.current.srcObject = null;
+    };
+  }, [screenshareReference.current]);
+  (0, _react.useEffect)(() => {
+    if ((0, _browserUtils.isChrome)()) {
+      if ((0, _breachUtils.isWebcamRequired)(proctorParams)) {
+        (0, _webcamMicrophoneUtils.updateVideoPermissions)(setVideoPermission);
+        (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
+        (0, _webcamMicrophoneUtils.getVideoPermissionQuery)().then(status => {
+          status.onchange = evt => {
+            (0, _webcamMicrophoneUtils.updateVideoPermissions)(setVideoPermission);
+          };
+        }).catch(err => {});
+        (0, _webcamMicrophoneUtils.getAudioPermissionQuery)().then(status => {
+          status.onchange = evt => {
+            (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
+          };
+        }).catch(err => {
+          (0, _webcamMicrophoneUtils.updateAudioPermissions)("Audio Permission", err);
+        });
+      }
+    }
+  }, [setVideoPermission, setAudioPermission, proctorParams]);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _breachUtils.isWebcamRequired)(proctorParams) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactWebcam.default, {
+    audio: true,
+    muted: true,
+    screenshotFormat: "image/jpeg",
+    ref: webcamReference,
+    onUserMedia: stream => {
+      if (!(0, _browserUtils.isChrome)()) {
+        const {
+          audio,
+          video
+        } = (0, _utils.getAudioVideoPermission)(stream);
+        setAudioPermission(audio);
+        setVideoPermission(video);
+        stream.onaddtrack = p => {
+          const {
+            audio,
+            video
+          } = (0, _utils.getAudioVideoPermission)(stream);
+          setAudioPermission(audio);
+          setVideoPermission(video);
+        };
+        stream.onremovetrack = p => {
+          const {
+            audio,
+            video
+          } = (0, _utils.getAudioVideoPermission)(stream);
+          setAudioPermission(audio);
+          setVideoPermission(video);
+        };
+        stream.onactive = p => {
+          const {
+            audio,
+            video
+          } = (0, _utils.getAudioVideoPermission)(stream);
+          setAudioPermission(audio);
+          setVideoPermission(video);
+        };
+        stream.oninactive = e => {
+          setAudioPermission(false);
+          setVideoPermission(false);
+        };
+        const audioTracks = stream.getAudioTracks().filter(track => track.enabled && track.label);
+        audioTracks.forEach(track => {
+          track.onended = e => {
+            const audio = (0, _utils.getAudioPermission)(stream);
+            setAudioPermission(audio, e.currentTarget.id);
+          };
+          track.onmute = e => {
+            const audio = (0, _utils.getAudioPermission)(stream);
+            setAudioPermission(audio, e.currentTarget.id);
+          };
+          track.onunmute = e => {
+            const audio = (0, _utils.getAudioPermission)(stream);
+            setAudioPermission(audio);
+          };
+        });
+        const videoTracks = stream.getVideoTracks().filter(track => track.enabled && track.label);
+        videoTracks.forEach(track => {
+          track.onended = e => {
+            const video = (0, _utils.getVideoPermission)(stream, e.currentTarget.id);
+            setVideoPermission(video);
+          };
+        });
+      }
+    },
+    onUserMediaError: error => {
+      if (!(0, _browserUtils.isChrome)()) {
+        setVideoPermission(false);
+        setAudioPermission(false);
+      }
+    },
+    className: "hide"
+  }), /*#__PURE__*/_react.default.createElement("canvas", {
+    ref: canvasReference,
+    className: "captured-video-canvas hide",
+    id: "wc-ref"
+  })), /*#__PURE__*/_react.default.createElement("video", {
+    ref: screenshareVideoReference,
+    className: "captured-video-canvas hide",
+    id: "ss-ref"
+  }));
+};
+var _default = ActivityTracker;
+exports.default = _default;

package/dist/components/activity-tracker/index.scss

@@ -0,0 +1,7 @@
+.captured-video-canvas {
+  position: absolute;
+  bottom: 0px;
+}
+.hide {
+  visibility: hidden;
+}

package/dist/components/proctor-app/index.js

@@ -1,14 +1,14 @@
 "use strict";
 
+require("core-js/modules/es.symbol.description.js");
 require("core-js/modules/es.object.assign.js");
 require("core-js/modules/es.weak-map.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.ProctorApp = void 0;
-require("core-js/modules/es.promise.js");
 require("core-js/modules/web.dom-collections.iterator.js");
-require("core-js/modules/es.symbol.description.js");
+require("core-js/modules/es.promise.js");
 var _react = _interopRequireWildcard(require("react"));
 require("./index.scss");
 var _utils = require("../../utils");
@@ -18,10 +18,8 @@ var _useWebcamData = _interopRequireDefault(require("../../hooks/useWebcamData")
 var _breachUtils = require("../../utils/breachUtils");
 var _webcamMicrophoneUtils = require("../../utils/webcamMicrophoneUtils");
 var _defaults = require("../../constants/defaults");
-var _webcamActivityTracker = _interopRequireDefault(require("../webcam-activity-tracker"));
+var _activityTracker = _interopRequireDefault(require("../activity-tracker"));
 var _browserUtils = require("../../utils/browserUtils");
-var _screenshareActivityTracker = require("../screenshare-activity-tracker");
-var _dom = require("../../constants/dom");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -36,6 +34,7 @@ const ProctorApp = _ref => {
   let {
     proctoringIdentifier,
     customPermissionView = null,
+    shouldRenderChildren = false,
     permissionPassedProps = {},
     children,
     proctoredContext,
@@ -44,14 +43,27 @@ const ProctorApp = _ref => {
     getWebcamSnapshot = () => {},
     getScreengrab = () => {}
   } = _ref;
+  const [renderChildren, setRenderChildren] = (0, _react.useState)();
   const context = (0, _react.useContext)(proctoredContext);
   const {
     actions,
     permissions,
     references,
-    permissionSetter
+    permissionSetter,
+    customProps,
+    customSetter
   } = context;
+  (0, _react.useEffect)(() => {
+    if (customProps.childrenRenderer === undefined) {
+      setRenderChildren(!shouldRenderChildren);
+    } else {
+      setRenderChildren(customProps.childrenRenderer);
+    }
+  }, [customProps]);
   const CustomPermissionView = customPermissionView;
+  const browserDetails = {
+    isChrome: (0, _browserUtils.isChrome)()
+  };
   const proctorParams = (0, _react.useMemo)(() => _objectSpread(_objectSpread({}, _defaults.defaultConfig), config.proctorParams), [config.proctorParams]);
   const statistics = (0, _react.useRef)((0, _breachUtils.getInitialStats)(proctorParams));
   const {
@@ -63,18 +75,20 @@ const ProctorApp = _ref => {
     let isBreach = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
     let breachedParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
     if (proctorParams.screenshareSnapshots && permissions.screenshare) {
-      const screenshot = await (0, _webcamMicrophoneUtils.captureScreenshot)("#".concat(_dom.SCREENSHARE_REFERENCE_ID));
+      const screenshot = await (0, _webcamMicrophoneUtils.captureScreenshot)();
       getScreengrab(proctoringIdentifier, screenshot, isBreach, breachedParam);
     }
   }, [getScreengrab, proctoringIdentifier, proctorParams.screenshareSnapshots, permissions.screenshare]);
-  const sendWebcamSnapshot = (0, _react.useCallback)(async function () {
+  const sendWebcamSnapshot = (0, _react.useCallback)(function () {
     let isBreach = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
     let breachedParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
     if (proctorParams.webcamSnapshots && permissions.video) {
-      const webcamSnapshot = await (0, _webcamMicrophoneUtils.captureScreenshot)("#".concat(_dom.WEBCAM_REFERENCE_ID));
-      getWebcamSnapshot(proctoringIdentifier, webcamSnapshot, isBreach, breachedParam);
+      const webcamSnapshot = (0, _utils.captureWebcamSnapshot)(references.webcamReference);
+      if (references.webcamReference) {
+        getWebcamSnapshot(proctoringIdentifier, webcamSnapshot, isBreach, breachedParam);
+      }
     }
-  }, [proctoringIdentifier, getWebcamSnapshot, proctorParams.webcamSnapshots, permissions.video]);
+  }, [proctoringIdentifier, getWebcamSnapshot, proctorParams.webcamSnapshots, permissions.video, references.webcamReference]);
   const sendProctoredParamValues = (0, _react.useCallback)(function () {
     let isBreach = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
     let breachParam = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
@@ -110,29 +124,31 @@ const ProctorApp = _ref => {
       sendScreengrab(true, breachData.breachedParam);
     }
   }, [userCount, isTabSwitched, permissions.fullscreen, lookedAwayCount, sendProctoredParamValues, sendWebcamSnapshot, sendScreengrab, proctorParams]);
-  const shouldShowProctoredComponent = (0, _breachUtils.showProctoredComponent)(proctorParams, actions.hasAllPermission);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(proctorParams.copyPasteProctoring ? "disable-copy-paste fullwidth fullheight" : "fullwidth fullheight")
-  }, shouldShowProctoredComponent && children, !shouldShowProctoredComponent && customPermissionView && /*#__PURE__*/_react.default.createElement(CustomPermissionView, _extends({
+  }, (0, _breachUtils.showProctoredComponent)(proctorParams, actions.hasAllPermission) && renderChildren && children, !((0, _breachUtils.showProctoredComponent)(proctorParams, actions.hasAllPermission) && renderChildren) && customPermissionView && /*#__PURE__*/_react.default.createElement(CustomPermissionView, _extends({
     permissions: permissions,
     hasAllPermission: actions.hasAllPermission,
     askPermission: actions.askPermission,
     references: references,
     actions: actions,
-    browserDetails: (0, _browserUtils.getBrowserDetails)()
-  }, permissionPassedProps)), !shouldShowProctoredComponent && !customPermissionView && /*#__PURE__*/_react.default.createElement(_permissions.Permission, {
+    browserDetails: browserDetails,
+    renderChildren: () => {
+      setRenderChildren(true);
+      customSetter.childrenRenderer(true);
+    }
+  }, permissionPassedProps)), !((0, _breachUtils.showProctoredComponent)(proctorParams, actions.hasAllPermission) && renderChildren) && !customPermissionView && /*#__PURE__*/_react.default.createElement(_permissions.Permission, {
     proctorParams: proctorParams,
     permissions: permissions,
     askPermission: actions.askPermission,
     hasAllPermission: actions.hasAllPermission
-  }), /*#__PURE__*/_react.default.createElement(_webcamActivityTracker.default, {
+  }), /*#__PURE__*/_react.default.createElement(_activityTracker.default, {
     proctorParams: proctorParams,
     setAudioPermission: permissionSetter.audio,
     setVideoPermission: permissionSetter.video,
     webcamReference: references.webcamReference,
-    canvasReference: references.canvasReference
-  }), /*#__PURE__*/_react.default.createElement(_screenshareActivityTracker.ScreenshareActivityTracker, {
-    ref: references.screenshareReference
+    canvasReference: references.canvasReference,
+    screenshareReference: references.screenshareReference
   }));
 };
 exports.ProctorApp = ProctorApp;

package/dist/components/proctor-app/index.scss

@@ -10,10 +10,3 @@
     height: 100%;
     overflow-y: scroll;
 }
-.captured-video-canvas {
-    position: absolute;
-    bottom: 0px;
-  }
-.hide {
-    visibility: hidden;
-}

package/dist/components/proctor-context-app/index.js

@@ -35,6 +35,7 @@ const ProctoredContextApp = _ref => {
   const [audioPermisison, setAudioPermission] = (0, _react.useState)();
   const [videoPermission, setVideoPermission] = (0, _react.useState)();
   const [screensharePermission, setScreensharePermission] = (0, _react.useState)();
+  const [customRenderer, setCustomRenderer] = (0, _react.useState)();
   const webcamReference = (0, _react.useRef)(null);
   const canvasReference = (0, _react.useRef)(null);
   const screenshareReference = (0, _react.useRef)(null);
@@ -77,15 +78,21 @@ const ProctoredContextApp = _ref => {
         video: setVideoPermission,
         screenshare: setScreensharePermission
       },
+      customProps: {
+        childrenRenderer: customRenderer
+      },
+      customSetter: {
+        childrenRenderer: setCustomRenderer
+      },
       proctorParams,
       actions: {
         askPermission: askPermission,
         hasAllPermission: hasAllPermission
       },
       references: {
-        webcamReference,
-        canvasReference,
-        screenshareReference
+        webcamReference: webcamReference,
+        canvasReference: canvasReference,
+        screenshareReference: screenshareReference
       }
     })
   }, children);

package/dist/hooks/usePageVisibility.js

@@ -15,9 +15,9 @@ function usePageVisibility(isProctorParam) {
   };
   (0, _react.useEffect)(() => {
     updateVisibility();
-    window.addEventListener(visibilityChangeEvent, updateVisibility, false);
+    document.addEventListener(visibilityChangeEvent, updateVisibility, false);
     return () => {
-      window.removeEventListener(visibilityChangeEvent, updateVisibility);
+      document.removeEventListener(visibilityChangeEvent, updateVisibility);
     };
   }, []);
   return isVisible && isProctorParam;

package/dist/hooks/useWebcamData.js

@@ -31,7 +31,7 @@ function useWebcamData(webcamReference, canvasReference, proctorParams) {
   const isWatching = (0, _react.useState)(_defaults.initialValues.isWatching);
   const [lookedAwayCount, setLookedAwayCount] = (0, _react.useState)(_defaults.initialValues.lookedAwayCount);
   (0, _react.useEffect)(() => {
-    if ((0, _utils.isGPUAvailable)() && proctorParams.people && proctorParams.lookedAwayCount) {
+    if (proctorParams.people && proctorParams.lookedAwayCount && (0, _utils.isGPUAvailable)()) {
       const loadCocoSSDModel = async () => {
         try {
           const model = await cocoSsd.load();

package/dist/utils/browserUtils.js

@@ -3,14 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isChrome = exports.getVisibilityChangeEventName = exports.getIsDocumentVisible = exports.getFocusEventName = exports.getBrowserFullscreenElementProp = exports.getBrowserDetails = exports.getBlurEventName = void 0;
+exports.isChrome = exports.getVisibilityChangeEventName = exports.getIsDocumentVisible = exports.getBrowserFullscreenElementProp = void 0;
 require("core-js/modules/es.regexp.exec.js");
 require("core-js/modules/es.string.match.js");
 const PROPERTY_TYPES = {
   HIDDEN: "hidden",
-  VISIBILITY_CHANGE: "visibilitychange",
-  FOCUS: "focus",
-  BLUR: "blur"
+  VISIBILITY_CHANGE: "visibilitychange"
 };
 const getBrowserPropPrefix = () => {
   if (typeof document.msHidden !== "undefined") {
@@ -32,10 +30,6 @@ const getBrowserDocumentProp = type => {
       return getBrowserPropForHidden();
     case PROPERTY_TYPES.VISIBILITY_CHANGE:
       return "".concat(getBrowserPropPrefix(), "visibilitychange");
-    case PROPERTY_TYPES.FOCUS:
-      return "focus";
-    case PROPERTY_TYPES.BLUR:
-      return "blur";
     default:
       return "";
   }
@@ -44,10 +38,6 @@ const getIsDocumentVisible = () => !document[getBrowserDocumentProp(PROPERTY_TYP
 exports.getIsDocumentVisible = getIsDocumentVisible;
 const getVisibilityChangeEventName = () => getBrowserDocumentProp(PROPERTY_TYPES.VISIBILITY_CHANGE);
 exports.getVisibilityChangeEventName = getVisibilityChangeEventName;
-const getFocusEventName = () => getBrowserDocumentProp(PROPERTY_TYPES.FOCUS);
-exports.getFocusEventName = getFocusEventName;
-const getBlurEventName = () => getBrowserDocumentProp(PROPERTY_TYPES.BLUR);
-exports.getBlurEventName = getBlurEventName;
 const getBrowserFullscreenElementProp = () => {
   if (typeof document.fullscreenElement !== "undefined") {
     return "fullscreenElement";
@@ -61,8 +51,4 @@ const getBrowserFullscreenElementProp = () => {
 };
 exports.getBrowserFullscreenElementProp = getBrowserFullscreenElementProp;
 const isChrome = () => !!navigator.userAgent.match(/chrome|chromium/i);
-exports.isChrome = isChrome;
-const getBrowserDetails = () => ({
-  isChrome: isChrome()
-});
-exports.getBrowserDetails = getBrowserDetails;
+exports.isChrome = isChrome;

package/dist/utils/gpuUtils.js

@@ -11,10 +11,13 @@ var _defaults = require("../constants/defaults");
 const isGPUAvailable = () => {
   const canvas = document.createElement("canvas");
   const webgl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
-  const debugInfo = webgl.getExtension("webgl_debug_renderer_info");
-  const gpu = webgl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL).toLowerCase();
+  const debugInfo = webgl === null || webgl === void 0 ? void 0 : webgl.getExtension("webgl_debug_renderer_info");
+  if (!debugInfo) {
+    return false;
+  }
+  const gpu = webgl.getParameter(debugInfo === null || debugInfo === void 0 ? void 0 : debugInfo.UNMASKED_RENDERER_WEBGL).toLowerCase();
   for (const gpuType of _defaults.gpuTypes) {
-    if (gpu.includes(gpuType)) return true;
+    if (gpu !== null && gpu !== void 0 && gpu.includes(gpuType)) return true;
   }
   return false;
 };

package/dist/utils/index.js

@@ -21,24 +21,12 @@ Object.defineProperty(exports, "getAudioVideoPermission", {
     return _webcamMicrophoneUtils.getAudioVideoPermission;
   }
 });
-Object.defineProperty(exports, "getBlurEventName", {
-  enumerable: true,
-  get: function get() {
-    return _browserUtils.getBlurEventName;
-  }
-});
 Object.defineProperty(exports, "getBrowserFullscreenElementProp", {
   enumerable: true,
   get: function get() {
     return _browserUtils.getBrowserFullscreenElementProp;
   }
 });
-Object.defineProperty(exports, "getFocusEventName", {
-  enumerable: true,
-  get: function get() {
-    return _browserUtils.getFocusEventName;
-  }
-});
 Object.defineProperty(exports, "getIsDocumentVisible", {
   enumerable: true,
   get: function get() {

package/dist/utils/webcamMicrophoneUtils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.updateVideoPermissions = exports.updateStatistics = exports.updateAudioPermissions = exports.setupScreensharePermission = exports.resetWebcamReference = exports.resetScreenshotReference = exports.isWebcamVideoValid = exports.getVideoPermissionQuery = exports.getVideoPermission = exports.getGlancePercentage = exports.getAudioVideoPermission = exports.getAudioPermissionQuery = exports.getAudioPermission = exports.collectScreenshare = exports.captureWebcamSnapshot = exports.captureScreenshot = void 0;
+exports.updateVideoPermissions = exports.updateStatistics = exports.updateAudioPermissions = exports.setupScreensharePermission = exports.isWebcamVideoValid = exports.getVideoPermissionQuery = exports.getVideoPermission = exports.getGlancePercentage = exports.getAudioVideoPermission = exports.getAudioPermissionQuery = exports.getAudioPermission = exports.captureWebcamSnapshot = exports.captureScreenshot = void 0;
 require("core-js/modules/es.array-buffer.slice.js");
 require("core-js/modules/es.typed-array.uint8-array.js");
 require("core-js/modules/es.typed-array.fill.js");
@@ -115,11 +115,10 @@ const setupScreensharePermission = (setScreensharePermission, screenshareReferen
   const track = stream.getTracks()[0];
   if (track.getSettings().displaySurface === "monitor") {
     setScreensharePermission(true);
-    screenshareReference.stream = stream;
-    collectScreenshare(screenshareReference);
+    screenshareReference.current = stream;
     track.onended = e => {
       setScreensharePermission(false);
-      screenshareReference.current.srcObject = null;
+      screenshareReference.current = null;
     };
   } else {
     track.stop();
@@ -127,25 +126,10 @@ const setupScreensharePermission = (setScreensharePermission, screenshareReferen
     setScreensharePermission(false);
   }
 }).catch(e => {
-  resetScreenshotReference(screenshareReference);
+  screenshareReference.current = null;
   setScreensharePermission(false);
 });
 exports.setupScreensharePermission = setupScreensharePermission;
-const collectScreenshare = screenshareReference => {
-  screenshareReference.current.srcObject = screenshareReference.stream;
-  screenshareReference.current.onloadedmetadata = e => {
-    screenshareReference.current.play();
-  };
-};
-exports.collectScreenshare = collectScreenshare;
-const resetScreenshotReference = screenshareReference => {
-  screenshareReference.current = null;
-};
-exports.resetScreenshotReference = resetScreenshotReference;
-const resetWebcamReference = webcamReference => {
-  webcamReference.current = null;
-};
-exports.resetWebcamReference = resetWebcamReference;
 const getVideoPermissionQuery = () => navigator.permissions.query({
   name: "camera"
 });
@@ -174,9 +158,9 @@ const captureWebcamSnapshot = webcamReference => {
   }
 };
 exports.captureWebcamSnapshot = captureWebcamSnapshot;
-const captureScreenshot = async elementIdSelector => {
+const captureScreenshot = async () => {
   try {
-    const canvas = await (0, _html2canvas.default)(document.querySelector(elementIdSelector));
+    const canvas = await (0, _html2canvas.default)(document.querySelector("#ss-ref"));
     const b64Snapshot = canvas.toDataURL("image/jpeg");
     return b64DataURItoBlob(b64Snapshot);
   } catch (e) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newtonschool/react_proctoring_library",
-  "version": "0.0.41",
+  "version": "0.0.43",
   "description": "Used to proctor online tests",
   "author": "ayushkagrawal,shreyachandra,weastel",
   "main": "dist/index.js",

package/dist/components/screenshare-activity-tracker/index.js

@@ -1,26 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.weak-map.js");
-require("core-js/modules/web.dom-collections.iterator.js");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ScreenshareActivityTracker = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _dom = require("../../constants/dom");
-var _webcamMicrophoneUtils = require("../../utils/webcamMicrophoneUtils");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const ScreenshareActivityTracker = /*#__PURE__*/(0, _react.forwardRef)((props, screenshareReference) => {
-  (0, _react.useEffect)(() => {
-    if (screenshareReference.stream) {
-      (0, _webcamMicrophoneUtils.collectScreenshare)(screenshareReference);
-    }
-  }, []);
-  return /*#__PURE__*/_react.default.createElement("video", {
-    ref: screenshareReference,
-    className: "captured-video-canvas hide",
-    id: _dom.SCREENSHARE_REFERENCE_ID
-  });
-});
-exports.ScreenshareActivityTracker = ScreenshareActivityTracker;

package/dist/components/webcam-activity-tracker/index.js

@@ -1,55 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.weak-map.js");
-require("core-js/modules/web.dom-collections.iterator.js");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactWebcam = _interopRequireDefault(require("react-webcam"));
-var _dom = require("../../constants/dom");
-var _breachUtils = require("../../utils/breachUtils");
-var _browserUtils = require("../../utils/browserUtils");
-var _webcamMicrophoneUtils = require("../../utils/webcamMicrophoneUtils");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const WebcamActivityTracker = _ref => {
-  let {
-    proctorParams,
-    setAudioPermission,
-    setVideoPermission,
-    webcamReference
-  } = _ref;
-  (0, _react.useEffect)(() => {
-    if ((0, _browserUtils.isChrome)()) {
-      if ((0, _breachUtils.isWebcamRequired)(proctorParams)) {
-        (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
-        (0, _webcamMicrophoneUtils.getAudioPermissionQuery)().then(status => {
-          status.onchange = evt => {
-            (0, _webcamMicrophoneUtils.updateAudioPermissions)(setAudioPermission);
-          };
-        }).catch(err => {
-          (0, _webcamMicrophoneUtils.updateAudioPermissions)("Audio Permission", err);
-        });
-      }
-    }
-  }, [setVideoPermission, setAudioPermission, proctorParams]);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (0, _breachUtils.isWebcamRequired)(proctorParams) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactWebcam.default, {
-    audio: true,
-    muted: true,
-    screenshotFormat: "image/jpeg",
-    ref: webcamReference,
-    onUserMedia: () => {
-      setVideoPermission(true);
-    },
-    onUserMediaError: () => {
-      setVideoPermission(false);
-    },
-    className: "captured-video-canvas hide",
-    id: _dom.WEBCAM_REFERENCE_ID
-  })));
-};
-var _default = WebcamActivityTracker;
-exports.default = _default;

package/dist/constants/dom.js

@@ -1,10 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.WEBCAM_REFERENCE_ID = exports.SCREENSHARE_REFERENCE_ID = void 0;
-const WEBCAM_REFERENCE_ID = "wc-ref";
-exports.WEBCAM_REFERENCE_ID = WEBCAM_REFERENCE_ID;
-const SCREENSHARE_REFERENCE_ID = "ss-ref";
-exports.SCREENSHARE_REFERENCE_ID = SCREENSHARE_REFERENCE_ID;

package/dist/hooks/useIsPageFocussed.js

@@ -1,29 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = useIsPageFocussed;
-require("core-js/modules/web.dom-collections.iterator.js");
-var _react = require("react");
-var _utils = require("../utils");
-const focusEvent = (0, _utils.getFocusEventName)();
-const blurEvent = (0, _utils.getBlurEventName)();
-function useIsPageFocussed(isProctorParam) {
-  const [isFocussed, setIsFocussed] = (0, _react.useState)(true);
-  const updateVisibilityOnFocus = () => {
-    setIsFocussed(true);
-  };
-  const updateVisibilityOnBlur = () => {
-    setIsFocussed(false);
-  };
-  (0, _react.useEffect)(() => {
-    window.addEventListener(focusEvent, updateVisibilityOnFocus, false);
-    window.addEventListener(blurEvent, updateVisibilityOnBlur, false);
-    return () => {
-      window.removeEventListener(focusEvent, updateVisibilityOnFocus);
-      window.removeEventListener(blurEvent, updateVisibilityOnBlur);
-    };
-  }, []);
-  return isFocussed && isProctorParam;
-}