Production/v 1

WebApp/.env

@@ -1,4 +1,4 @@
-HOST_IP=localhost
+HOST_IP=26.210.51.174
 HOST_PROTOCOL=http
 # DATABASE CONNECTION STRINGS
 BACKEND_ACCOUNT_CONN_STR=Server=mssql;Database=QuizMasterAccount;Trusted_Connection=False;TrustServerCertificate=True;User Id=sa;Password=MsSql123
@@ -8,15 +8,15 @@ BACKEND_QUIZ_CONN_STR=Server=mssql;Database=QuizMasterQuiz;Trusted_Connection=Fa
 BACKEND_SESSION_CONN_STR=Server=mssql;Database=QuizMasterSession;Trusted_Connection=False;TrustServerCertificate=True;User Id=sa;Password=MsSql123
 
 # GATEWAY
-GATEWAY_CORS=http://localhost:3000;http://localhost:3001;http://localhost:5173;https://localhost:7081;
+GATEWAY_CORS=http://26.210.51.174:3000;http://26.210.51.174:3001;http://26.210.51.174:5173;https://26.210.51.174:7081;
 
 # SESSION SETTINGS
 SHOW_ANSWER_AFTER_QUESTION_DELAY=10
 FORCE_NEXT_ROUND_TIMEOUT=300
-OVERRIDE_QUESTION_TIMER_TYPEANSWER=25
+OVERRIDE_QUESTION_TIMER_TYPEANSWER=20
 OVERRIDE_QUESTION_TIMER_MULTIPLECHOICE=20
-OVERRIDE_QUESTION_TIMER_TRUEORFALSE=15
-BUFFER_TIME=3
+OVERRIDE_QUESTION_TIMER_TRUEORFALSE=20
+BUFFER_TIME=5
 OVERRIDE_POINT_EASY_ROUND=1
 OVERRIDE_POINT_AVERAGE_ROUND=3
 OVERRIDE_POINT_DIFFICULT_ROUND=5

WebApp/backend/QuizMaster.API.Gatewway/Services/QuizHandler.cs

@@ -145,7 +145,7 @@ public async Task StartQuiz(SessionHub hub, SessionHandler handler, QuizRoomServ
                         totalNumberOfQuestions = Setquestions.Count,
                         bufferTime = quizSettings.BufferTime,
                         points = quizSettings.OverridePointSystem,
-                        currentDifficulty = details.question.QDifficulty.QDifficultyDesc.ToLower(),
+                        currentDifficulty = details.question.QDifficulty.QDifficultyDesc,
                         participantsInRoom = handler.GetParticipantLinkedConnectionsInAGroup(roomPin).Count(),
                     });
 

WebApp/docker-compose-no-frontend.yml

@@ -90,6 +90,7 @@ services:
       - Kestrel:EndpointDefaults:Protocols=Http1AndHttp2
       - Kestrel:Endpoints:Https:Url=https://*:443
       - AppSettings:CORS_ORIGINS=${GATEWAY_CORS}
+      - QuizSettings:BufferTime=${BUFFER_TIME}
       - QuizSettings:ShowAnswerAfterQuestionDelay=${SHOW_ANSWER_AFTER_QUESTION_DELAY}
       - QuizSettings:ForceNextRoundTimeout=${FORCE_NEXT_ROUND_TIMEOUT}
       - QuizSettings:OverrideQuestionTimer:TypeAnswer=${OVERRIDE_QUESTION_TIMER_TYPEANSWER}

WebApp/frontend/quiz-master/.env

@@ -1,8 +1,8 @@
-NEXTAUTH_URL=http://localhost:3000
-BASE_URL=http://localhost:3000
-QUIZMASTER_GATEWAY=https://localhost:7081
-QUIZMASTER_SESSION_WEBSITE=http://localhost:3001
+NEXTAUTH_URL=http://26.210.51.174:3000
+BASE_URL=http://26.210.51.174:3000
+QUIZMASTER_GATEWAY=https://26.210.51.174:7081
+QUIZMASTER_SESSION_WEBSITE=http://26.210.51.174:3001
 NEXTAUTH_SECRET=owhV4+EXpUePaS3k9Z+WqZybnURhBpsAlqw5EaLbPeQ=
 QUIZMASTER_QUIZ=owhV4+EXpUePaS3k9Z+WqZybnURhBpsAlqw5EaLbPeQ=
 QUIZMASTER_MEDIA=owhV4+EXpUePaS3k9Z+WqZybnURhBpsAlqw5EaLbPeQ=
-QUIZMASTER_MONITORING=https://localhost:6004
+QUIZMASTER_MONITORING=https://26.210.51.174:6004

WebApp/frontend/quiz-master/app/reports/components/pdfReports/IndividualParticipantAnswersReport.tsx

@@ -88,6 +88,14 @@ export function IndividualParticipantAnswersReport({
                             >
                                 Correct Answer
                             </Text>
+                            <Text
+                                style={[
+                                    styles.correctAnswer,
+                                    styles.tableHeader,
+                                ]}
+                            >
+                                Score
+                            </Text>
                         </View>
                         {participantAnswers.map((answer, index) => {
                             return (
@@ -149,6 +157,9 @@ function ParticipantAnswersTableRow({
             )}
 
             <Text style={styles.correctAnswer}>{correctAnswer}</Text>
+            <Text style={styles.correctAnswer}>
+                {participantAnswer.score} {" point(s)"}
+            </Text>
         </View>
     );
 }

WebApp/frontend/quiz-master/app/reports/components/pdfReports/ParticipantAnswersTablePDF.tsx

@@ -60,9 +60,9 @@ function QuestionCorrectResponses({
             ?.qDetailDesc || "";
     return (
         <View style={styles.questionContainer}>
-            <Text
-                style={styles.qStatement}
-            >{`Question: ${qInfo.qStatement}`}</Text>
+            <Text style={styles.qStatement}>{`Question: ${qInfo.qStatement} (${
+                participantAnswers[0]?.points || 0
+            } points)`}</Text>
             <View
                 style={{
                     flexDirection: "row",

WebApp/frontend/quiz-master/app/reports/components/sessionsReport.tsx

@@ -28,6 +28,8 @@ export interface ParticipantAnswerReport {
     answer: string;
     questionId: number;
     screenshotLink: string;
+    score: number;
+    points: number;
 }
 
 export default function SessionReports() {

WebApp/frontend/quiz-master/components/Commons/modals/ViewParticipantAnswersModal.tsx

@@ -198,6 +198,8 @@ export interface ParticipantAnswer {
     answer: string;
     screenshotLink: string;
     questionId: number;
+    score: number;
+    points: number;
 }
 
 function ParticipantAnswerItem({
@@ -323,6 +325,10 @@ function ParticipantAnswerItem({
                     <p className="text-gray-400 text-xs">
                         {qCategory?.qCategoryDesc || loadingSkeleton("h-4")}
                     </p>
+                    <span className="text-gray-400 text-xs font-light">•</span>
+                    <p className="text-gray-400 text-xs">
+                        {` ${participantAnswer.score} point(s)`}
+                    </p>
                 </div>
             </div>
 

WebApp/frontend/quiz_session/.env

@@ -1,3 +1,3 @@
-NEXT_PUBLIC_QUIZMASTER_ADMIN=http://localhost:3000
-NEXT_PUBLIC_QUIZMASTER_GATEWAY=https://localhost:7081
+NEXT_PUBLIC_QUIZMASTER_ADMIN=http://26.210.51.174:3000
+NEXT_PUBLIC_QUIZMASTER_GATEWAY=https://26.210.51.174:7081
 NEXT_PUBLIC_QUIZMASTER_TRIGGER_SFX_SECONDS=5

WebApp/frontend/quiz_session/app/globals.css

@@ -1,4 +1,3 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
-

WebApp/frontend/quiz_session/app/room/components/chats.js

@@ -19,7 +19,6 @@ export default function Chats() {
     if (lastMessageRef.current) {
       lastMessageRef.current.scrollIntoView({ behavior: "smooth" });
     }
-    console.log("Conversations", conversation);
   }, [conversation]);
 
   return (

WebApp/frontend/quiz_session/app/room/contexts/SoundEffectsContext.jsx

@@ -0,0 +1,2 @@
+import { createContext } from "react";
+export const SoundEffectsContext = createContext();

WebApp/frontend/quiz_session/app/room/hooks/useAnswerSFX.js

@@ -0,0 +1,12 @@
+import useSound from "use-sound";
+
+export function useAnswerSFX(volume = 1) {
+  const [playCorrect] = useSound("/audio/correctAnswer-SFX.mp3", {
+    volume: volume < 1 ? volume : 1,
+  });
+  const [playIncorrect] = useSound("/audio/incorrectAnswer-SFX.mp3", {
+    volume: volume < 1 ? volume : 1,
+  });
+
+  return { playCorrect, playIncorrect };
+}

WebApp/frontend/quiz_session/app/room/quiz/components/header.js

@@ -9,6 +9,8 @@ import useSound from "use-sound";
 import { IconVolume, IconVolumeOff } from "@tabler/icons-react";
 import { Slider } from "@mantine/core";
 import ParticipantName from "./ParticipantName";
+import { useContext } from "react";
+import { SoundEffectsContext } from "../../contexts/SoundEffectsContext";
 
 const SFX_TRIGGER_SECONDS =
   process.env.QUIZMASTER_TRIGGER_SFX_SECONDS ??
@@ -18,9 +20,9 @@ export default function Header() {
   const { question } = useQuestion();
   const { metadata } = useMetaData();
   const [time, setTime] = useState();
-  const [isMute, setIsMute] = useState();
   const [collapsedVolume, setCollapsedVolumne] = useState(true);
-  const [volume, setVolume] = useState(100);
+  const { volume, setVolume, isMute } = useContext(SoundEffectsContext);
+
   /* Shows/hides question details during buffer time */
   const showDetails = question?.remainingTime <= question?.question?.qTime;
 
@@ -42,14 +44,6 @@ export default function Header() {
     }
   }, [time]);
 
-  useEffect(() => {
-    if (volume === 0) {
-      setIsMute(true);
-    } else {
-      setIsMute(false);
-    }
-  }, [volume]);
-
   return (
     <div className="px-5 pt-2 w-full bg-green-600 ">
       <div className="flex flex-row  w-full justify-between items-center">
@@ -65,13 +59,15 @@ export default function Header() {
               <div className="text-base font-bold">
                 Question {metadata?.currentQuestionIndex}{" "}
               </div>
-              <div>&nbsp; out of {metadata?.totalNumberOfQuestions}</div>
+              <div>&nbsp; out of {metadata?.totalNumberOfQuestions} </div>
             </div>
           </div>
         </div>
         <div className="flex flex-1 justify-end">
           <div
-            className={`flex flex-col rounded-md px-4 py-2 w-28 justify-center items-center ${
+            className={`${
+              showDetails ? `flex` : `hidden`
+            } flex-col rounded-md px-4 py-2 w-28 justify-center items-center ${
               time > SFX_TRIGGER_SECONDS ? " bg-green-700/50" : "bg-red-500"
             }`}
           >

WebApp/frontend/quiz_session/app/room/quiz/components/interval.js

@@ -35,30 +35,23 @@ export default function Interval({ leaderBoard, handleCloseLeaderboard }) {
   };
 
   const handleForceExit = () => {
-    const input = prompt(
-      "Are you sure you want to end game? Yes or No",
-      "No"
-    ).toLocaleLowerCase();
+    const roomInformationJson = localStorage.getItem("_rI");
+    const roomInformation = JSON.parse(roomInformationJson);
 
-    if (input === "yes" || input === "y") {
-      const roomInformationJson = localStorage.getItem("_rI");
-      const roomInformation = JSON.parse(roomInformationJson);
-
-      if (roomInformation && roomInformationJson) {
-        const token = localStorage.getItem("token");
-        fetch(
-          BASE_URL + `/gateway/api/room/forceExit/${roomInformation.id}`,
-          { headers: { Authorization: `Bearer ${token}` } },
-          { credentials: "include" }
-        ).catch((e) => {
-          alert("Error: ", e);
-        });
-        handleCloseLeaderboard();
-      }
-
-      // Always call
-      handleNextRound();
+    if (roomInformation && roomInformationJson) {
+      const token = localStorage.getItem("token");
+      fetch(
+        BASE_URL + `/gateway/api/room/forceExit/${roomInformation.id}`,
+        { headers: { Authorization: `Bearer ${token}` } },
+        { credentials: "include" }
+      ).catch((e) => {
+        alert("Error: ", e);
+      });
+      handleCloseLeaderboard();
     }
+
+    // Always call
+    handleNextRound();
   };
   useEffect(() => {
     // const timer = setInterval(() => {
@@ -100,7 +93,9 @@ export default function Interval({ leaderBoard, handleCloseLeaderboard }) {
       {isAdmin && (
         <div className="w-full bg-gradient-to-t from-green-800 to-green-600/50 h-32 flex gap-4 justify-center items-center ">
           <button
-            onClick={handleForceExit}
+            onClick={() => {
+              setEndGameModal(true);
+            }}
             className="border-2 border-white text-white px-4 py-2 rounded-md hover:bg-red-600 hover:border-red-600 hover:-translate-y-1 hover:scale-110 transition ease-in-out"
           >
             End Game

WebApp/frontend/quiz_session/app/room/quiz/components/leaderboard.js

@@ -8,7 +8,6 @@ export default function Leaderboard({ leaderBoard }) {
     ...new Set(leaderBoard.flatMap((participant) => participant.score)),
   ].slice(0, 3);
 
-  console.log(topScores);
 
   const firstScore = topScores[0];
   const secondScore = topScores[1];
@@ -37,7 +36,7 @@ export default function Leaderboard({ leaderBoard }) {
       <div
         className={` ${getRankColorClass(
           isFirst ? 1 : isSecond ? 2 : isThird ? 3 : 0
-        )} flex flex-row p-2 rounded-lg`}
+        )} flex flex-row p-2 rounded-md`}
       >
         <div className=" flex-grow font-bold">
           <span>{isFirst ? "🏆" : isSecond ? "🥈" : isThird ? "🥉" : ""}</span>