-
-
-
-
-
+
+
+
+
+
diff --git a/src/components/EnterExam.js b/src/components/EnterExam.js
index 436134a..7861310 100644
--- a/src/components/EnterExam.js
+++ b/src/components/EnterExam.js
@@ -8,8 +8,8 @@ const EnterExam = () => {
const router = useRouter();
const [examCode, setExamCode] = useState("");
const handleClick = async () => {
- const data = await fetch(urlLocal + `/api/db/getExam/` + 1).then((res) =>
- res.json()
+ const data = await fetch(urlLocal + `/api/db/getExam/` + examCode).then(
+ (res) => res.json()
);
if (!data) {
alert("No exam found with for code " + examCode);
diff --git a/src/components/ObjectDetect.js b/src/components/ObjectDetect.js
new file mode 100644
index 0000000..df2e22b
--- /dev/null
+++ b/src/components/ObjectDetect.js
@@ -0,0 +1,147 @@
+"use client";
+import React, { useRef, useEffect, useState } from "react";
+import Webcam from "react-webcam";
+import "@tensorflow/tfjs";
+import * as cocoSsd from "@tensorflow-models/coco-ssd";
+
+function ObjectDetect() {
+ const webcamRef = useRef(null);
+ const canvasRef = useRef(null);
+ const [videoStarted, setVideoStarted] = useState(false);
+
+ useEffect(() => {
+ const enableMediaDevices = async () => {
+ try {
+ const stream = await navigator.mediaDevices.getUserMedia({
+ video: true,
+ audio: true,
+ });
+ setVideoStarted(true);
+
+ if (stream) {
+ alert("Your video and audio are being recorded.");
+ }
+ } catch (error) {
+ console.error("Error accessing media devices", error);
+ }
+ };
+
+ enableMediaDevices();
+ }, []);
+
+ useEffect(() => {
+ if (videoStarted) {
+ const runObjectDetection = async () => {
+ const net = await cocoSsd.load();
+ const interval = setInterval(() => {
+ detect(net);
+ }, 10);
+
+ const showRoomAlert = () => {
+ alert("Please show your room in 360 degrees of rotation.");
+ const randomTime =
+ Math.floor(Math.random() * (600000 - 300000 + 1)) + 300000; // Random time lega between 5 to 10 min
+ setTimeout(showRoomAlert, randomTime);
+ };
+
+ const initialRandomTime =
+ Math.floor(Math.random() * (600000 - 300000 + 1)) + 300000; // Initial random time
+ setTimeout(showRoomAlert, initialRandomTime);
+
+ return () => {
+ clearInterval(interval);
+ };
+ };
+
+ runObjectDetection();
+ }
+ }, [videoStarted]);
+
+ const detect = async (net) => {
+ if (
+ typeof webcamRef.current !== "undefined" &&
+ webcamRef.current !== null &&
+ webcamRef.current.video.readyState === 4
+ ) {
+ const video = webcamRef.current.video;
+ const videoWidth = webcamRef.current.video.videoWidth;
+ const videoHeight = webcamRef.current.video.videoHeight;
+
+ webcamRef.current.video.width = videoWidth;
+ webcamRef.current.video.height = videoHeight;
+
+ canvasRef.current.width = videoWidth;
+ canvasRef.current.height = videoHeight;
+
+ const obj = await net.detect(video);
+ const ctx = canvasRef.current.getContext("2d");
+
+ let personDetected = false;
+
+ obj.forEach((prediction) => {
+ const [x, y, width, height] = prediction.bbox;
+ ctx.beginPath();
+ ctx.lineWidth = "2";
+
+ if (prediction.class === "person") {
+ ctx.strokeStyle = "blue";
+ personDetected = true;
+ } else {
+ ctx.strokeStyle = "green";
+ ctx.font = "18px Arial";
+ ctx.fillStyle = "green";
+ ctx.fillText(prediction.class, x, y);
+ }
+
+ ctx.rect(x, y, width, height);
+ ctx.stroke();
+ });
+
+ if (!personDetected) {
+ // alert("Object detected");
+ }
+ }
+ };
+
+ return (
+ <>
+
+ {videoStarted ? (
+ <>
+
+
+
+ ) : (
+
Requesting video and audio access...
+ )}
+
+
+ );
+}
+
+export default ObjectDetect;
diff --git a/src/components/Questions.js b/src/components/Questions.js
index 37b7efb..852bfb3 100644
--- a/src/components/Questions.js
+++ b/src/components/Questions.js
@@ -9,10 +9,19 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
new Array(questions.length).fill(null)
);
const [fullscreen, setFullscreen] = useState(false);
+ const [showImage, setShowImage] = useState(false);
const [currentQuestion, setCurrentQuestion] = useState(0);
const n = questions.length;
const question = questions[currentQuestion];
let divElements = [];
+ const img = (
+
+ );
const handleFinish = async () => {
try {
const data = questions;
@@ -33,16 +42,12 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
}
};
const sendToResult = () => handleFinish();
- // START MONITOR CHECK
+
useEffect(() => {
async function checkScreenConfiguration() {
const details = await window.getScreenDetails();
- // console.log(
- // "checkScreenConfiguration",
- // details,
- // window.screen.extended ||
- // (details ? details.screens?.length > 1 : false)
- // );
+
+ console.log( "These are details: " + JSON.stringify(details));
if (
window.screen.extended ||
(details ? details.screens?.length > 1 : false)
@@ -64,6 +69,11 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
const [count, setCount] = useState(0);
const leftAtRef = useRef(null);
const [leftAt, setLeftAt] = useState(null); // [leftAt, setLeftAt
+
+ const playScarySound= ()=>{
+ var sound = new Audio('/scream.mp3');
+ sound.play();
+ }
const displayScaryImage = () => {
const overlay = document.createElement("div");
overlay.style = `
@@ -72,28 +82,27 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
left: 0;
width: 100%;
height: 100%;
- background-color: rgba(0, 0, 0, 0.8);
+
z-index: 9999;
display: flex;
justify-content: center;
align-items: center;
`;
-
- const image = document.createElement("img");
- image.src = "/scary-image.jpg"; // Replace with your scary image URL
- image.style = `
- max-width: 80%;
- max-height: 80%;
- `;
- image.id = "scary-image";
-
- overlay.appendChild(image);
+ setShowImage(true);
document.body.appendChild(overlay);
+ setTimeout(()=>{
+ playScarySound();
+ },1000)
+
setTimeout(() => {
- // router.push("/");
+
+ setShowImage(false);
overlay.remove();
- }, 5000);
+ sendToResult();
+ }, 8000);
+
};
+
const formatTime = (time) => {
const minutes = Math.floor(time / 60);
const seconds = time % 60;
@@ -109,6 +118,7 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
sendToResult();
}
}, [timer]);
+
useEffect(() => {
const interval = setInterval(() => {
setTimer((prevTimer) => prevTimer - 1);
@@ -116,6 +126,7 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
return () => clearInterval(interval);
}, []);
+
useEffect(() => {
const handleVisibilityChange = () => {
if (document.visibilityState === "visible") {
@@ -129,7 +140,7 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
leftAtRef.current &&
leftAtRef.current + 10000 < new Date().getTime()
) {
- alert("You have staryed out for too long. Your exam has ended.");
+ alert("You have stayed out for too long. Your exam has ended.");
// send to result screen
sendToResult();
}
@@ -140,17 +151,17 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
leftAtRef.current = new Date().getTime();
countRef.current = countRef.current + 1;
setCount((p) => p + 1);
- if (countRef.current == 1) {
+ if (countRef.current == 2) {
displayScaryImage();
}
- if (countRef.current > 3) {
+ if (countRef.current > 2) {
alert("You have exceeded tab switch chances. Your exam has ended.");
// send to result screen
sendToResult();
} else {
alert(
`You left the tab. You have ${Number(
- 3 - countRef.current
+ 2 - countRef.current
)} chance remaining.`
);
}
@@ -194,6 +205,7 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
document.removeEventListener("fullscreenchange", handleFullScreenChange);
};
}, []);
+
const toggleFullScreen = () => {
if (!document.fullscreenElement) {
const element = document.documentElement; // Replace with the element you
@@ -218,10 +230,11 @@ const Questions = ({ questions = [], examId, time = 300 }) => {
}
};
- if (!fullscreen) {
+ if (!fullscreen || showImage) {
return (
{timerEle}
+ {showImage && img}
);
diff --git a/src/middleware.js b/src/middleware.js
index 2cbc9e8..f76f7ea 100644
--- a/src/middleware.js
+++ b/src/middleware.js
@@ -27,9 +27,18 @@ export default withAuth(
// );
const a = req.nextUrl.pathname.split("/dashboard")?.[1];
const nextSession = req.cookies.get("next-auth.session-token");
+ const nextSessionSecure = req.cookies.get(
+ "__Secure-next-auth.session-token"
+ );
+ console.log(
+ "path in middleware",
+ a,
+ "is wrong login? ",
+ !(nextSession || nextSessionSecure)
+ );
if (
(a?.length > 0 && token?.user?.username != "admin") ||
- !nextSession
+ !(nextSession || nextSessionSecure)
) {
console.log("redirecting to /");
return false;