Merge pull request #51 from SafeExamBrowser/SEBSP-160

SEBSP-160 add metadata constants & switch url metatadata with window …
SafeExamBrowser · Aug 20, 2024 · 90c9d88 · 90c9d88
2 parents 6605ffa + e22d5b2
commit 90c9d88
Show file tree

Hide file tree

Showing 7 changed files with 47 additions and 38 deletions.
diff --git a/client/src/components/views/search/SearchForm.vue b/client/src/components/views/search/SearchForm.vue
@@ -118,10 +118,10 @@
                         :title="$t('searchForm.metadataTitle')">
                             <v-expansion-panel-text>
 
-                                <!------------Metatdata: Application / Website------------->
+                                <!------------Metatdata: Focused Application------------->
                                 <v-row align="center">
                                     <v-col cols="4">
-                                        {{ $t('searchForm.applicationWebsite') }}:
+                                        {{ constants.APPLICATION_METADATA }}:
                                     </v-col>
                                     <v-col cols="8">
                                         <v-text-field
@@ -130,16 +130,16 @@
                                             density="compact"
                                             variant="outlined"
                                             v-model="metadataApplicationField"
-                                            :aria-label="$t('searchForm.applicationWebsite')">
+                                            :aria-label="constants.APPLICATION_METADATA">
                                         </v-text-field>
                                     </v-col>
                                 </v-row>
                                 <!----------------------------------->
 
-                                <!------------Metatdata: Broswer Title------------->
+                                <!------------Metatdata: SEB-Broswer Title------------->
                                 <v-row align="center">
                                     <v-col cols="4">
-                                        Browser Title:
+                                        {{constants.SEB_BROWSER_TITLE_METADATA}}:
                                     </v-col>
                                     <v-col cols="8">
                                         <v-text-field
@@ -148,16 +148,16 @@
                                             density="compact"
                                             variant="outlined"
                                             v-model="metadataBrowserTitleField"
-                                            aria-label="Browser Title">
+                                            :aria-label="constants.SEB_BROWSER_TITLE_METADATA">
                                         </v-text-field>
                                     </v-col>
                                 </v-row>
                                 <!----------------------------------->
 
-                                <!------------Metatdata: User Action------------->
+                                <!------------Metatdata: Activity Details------------->
                                 <v-row align="center">
                                     <v-col cols="4">
-                                        {{ $t('searchForm.activityDetails') }}:
+                                        {{ constants.ACTIVITY_DETAILS_METADATA }}:
                                     </v-col>
                                     <v-col cols="8">
                                         <v-text-field
@@ -166,26 +166,26 @@
                                             density="compact"
                                             variant="outlined"
                                             v-model="metadataActivityDetailsField"
-                                            :aria-label="$t('searchForm.activityDetails')">
+                                            :aria-label="constants.ACTIVITY_DETAILS_METADATA">
                                         </v-text-field>
                                     </v-col>
                                 </v-row>
                                 <!----------------------------------->
 
-                                <!------------Metatdata: Url------------->
+                                <!------------Metatdata: Focused Window------------->
                                 <v-row align="center">
                                     <v-col cols="4">
-                                        {{ $t('searchForm.url') }}:
+                                        {{ constants.WINDOW_TITLE_METADATA }}:
                                     </v-col>
                                     <v-col cols="8">
                                         <v-text-field
                                             single-line
                                             hide-details
                                             density="compact"
                                             variant="outlined"
-                                            v-model="metadataUrlField"
-                                            :aria-label="$t('searchForm.url')"
-                                        ></v-text-field>
+                                            v-model="metadataWindowTitleField"
+                                            :aria-label="constants.WINDOW_TITLE_METADATA">
+                                        </v-text-field>
                                     </v-col>
                                 </v-row>
                                 <!----------------------------------->
@@ -294,6 +294,7 @@
 
 <script setup lang="ts">
     import { ref, onBeforeMount } from "vue";
+    import * as constants from "@/utils/constants";
     import VueDatePicker from '@vuepic/vue-datepicker';
     import '@vuepic/vue-datepicker/dist/main.css'
     import * as timePeriodUtils from "@/utils/timePeriodUtils";
@@ -310,7 +311,7 @@
             metadataApplication: string,
             metadataBrowserTitle: string,
             metadataActivityDetails: string,
-            metadataUrl: string,
+            metadataWindowTitle: string,
 
             fromTime: string,
             toTime: string,
@@ -330,7 +331,7 @@
     const metadataApplicationField = ref<string>("");
     const metadataBrowserTitleField = ref<string>("");
     const metadataActivityDetailsField = ref<string>("");
-    const metadataUrlField = ref<string>("");
+    const metadataWindowTitleField = ref<string>("");
 
     const timePeriodField = ref<number>(1);
     const timePeriodRadio = ref<boolean>(true);
@@ -360,7 +361,7 @@
             metadataApplicationField.value,
             metadataBrowserTitleField.value, 
             metadataActivityDetailsField.value, 
-            metadataUrlField.value, 
+            metadataWindowTitleField.value, 
 
             fromTime, 
             toTime,
@@ -378,7 +379,7 @@
         metadataApplicationField.value = ""; 
         metadataBrowserTitleField.value = "";  
         metadataActivityDetailsField.value = ""; 
-        metadataUrlField.value = ""; 
+        metadataWindowTitleField.value = ""; 
         
         timePeriodField.value = 1;
         timePeriodRadio.value = true;

diff --git a/client/src/components/views/search/SearchPage.vue b/client/src/components/views/search/SearchPage.vue
@@ -145,7 +145,7 @@
     let metadataSearchApplication: string | null;
     let metadataSearchBrowserTitle: string | null;
     let metadataSearchActivityDetails: string | null;
-    let metadataSearchUrl: string | null;
+    let metadataSearchWindowTitle: string | null;
 
     let loginNameSearch: string | null;
     let ipAddressSearch: string | null;
@@ -175,7 +175,7 @@
         metadataApplication: string,
         metadataBrowserTitle: string,
         metadataActivityDetails: string,
-        metadataUrl: string,
+        metadataWindowTitle: string,
 
         fromTime: string, 
         toTime: string,
@@ -190,7 +190,7 @@
         metadataSearchApplication = metadataApplication == "" ? null : metadataApplication;
         metadataSearchBrowserTitle = metadataBrowserTitle == "" ? null : metadataBrowserTitle;
         metadataSearchActivityDetails = metadataActivityDetails == "" ? null : metadataActivityDetails;
-        metadataSearchUrl = metadataUrl == "" ? null : metadataUrl;
+        metadataSearchWindowTitle = metadataWindowTitle == "" ? null : metadataWindowTitle;
 
         loginNameSearch = loginName == "" ? null : loginName;
         ipAddressSearch = ipAddress == "" ? null : ipAddress;
@@ -206,7 +206,7 @@
             screenProctoringMetadataApplication: metadataSearchApplication,
             screenProctoringMetadataBrowser: metadataSearchBrowserTitle,
             screenProctoringMetadataUserAction: metadataSearchActivityDetails,
-            screenProctoringMetadataURL: metadataSearchUrl,
+            screenProctoringMetadataWindowTitle: metadataSearchWindowTitle,
 
             fromTime: fromTime, 
             toTime: toTime,

diff --git a/client/src/components/views/search/SearchScreenshotsTable.vue b/client/src/components/views/search/SearchScreenshotsTable.vue
@@ -85,7 +85,7 @@
                     </td>
 
                     <td>
-                        {{ screenshot.timelineScreenshotDataList[0].metaData.screenProctoringMetadataURL }}
+                        {{ screenshot.timelineScreenshotDataList[0].metaData.screenProctoringMetadataWindowTitle }}
                     </td>
 
                     <td>
@@ -116,6 +116,7 @@
     import * as searchViewService from "@/services/component-services/searchViewService";
     import * as groupingUtils from "@/utils/groupingUtils";
     import CustomTableHeader from "@/utils/table/CustomTableHeader.vue";
+    import * as constants from "@/utils/constants";
 
     const props = defineProps<{
         timelineSearchResult: SearchTimeline
@@ -128,11 +129,11 @@
     const screenshotTableHeadersRef = ref<any[]>();
     const screenshotTableHeaders = ref([
         {title: "Capture-Time", key: "timestamp", value: "timelineScreenshotDataList[0].timestamp", width: "10%"},
-        {title: "Application / Website", key: "groupName", width: "20%"},
+        {title: constants.APPLICATION_METADATA, key: "groupName", width: "15%"},
 
-        {title: "Browser Title", key: "browserTitle", value: "timelineScreenshotDataList[0].metaData.screenProctoringMetadataBrowser"},
-        {title: "Activity Details", key: "activityDetails", value: "timelineScreenshotDataList[0].metaData.screenProctoringMetadataUserAction"},
-        {title: "URL", key: "url", value: "timelineScreenshotDataList[0].metaData.screenProctoringMetadataURL"},
+        {title: constants.SEB_BROWSER_TITLE_METADATA, key: "browserTitle", value: "timelineScreenshotDataList[0].metaData.screenProctoringMetadataBrowser"},
+        {title: constants.ACTIVITY_DETAILS_METADATA, key: "activityDetails", value: "timelineScreenshotDataList[0].metaData.screenProctoringMetadataUserAction"},
+        {title: constants.WINDOW_TITLE_METADATA, key: "windowTitle", value: "timelineScreenshotDataList[0].metaData.screenProctoringMetadataWindowTitle"},
 
         {title: "Video", key: "proctoringViewLink", width: "1%"},
         {title: "", key: "data-table-expand"}

diff --git a/client/src/components/views/search/SearchSessionTable.vue b/client/src/components/views/search/SearchSessionTable.vue
@@ -147,7 +147,7 @@
                 screenProctoringMetadataApplication: props.searchParameters.screenProctoringMetadataApplication,
                 screenProctoringMetadataBrowser: props.searchParameters.screenProctoringMetadataBrowser,
                 screenProctoringMetadataUserAction: props.searchParameters.screenProctoringMetadataUserAction,
-                screenProctoringMetadataURL: props.searchParameters.screenProctoringMetadataURL
+                screenProctoringMetadataWindowTitle: props.searchParameters.screenProctoringMetadataWindowTitle
             });
 
         if(timelineSearchResponse == null){

diff --git a/client/src/services/component-services/galleryViewService.ts b/client/src/services/component-services/galleryViewService.ts
@@ -59,10 +59,10 @@ export function navigateToProctoringView(screenshot: ScreenshotData | undefined,
 //=============metadata=========
 export function getScreenshotMetadata(currentScreenshotMetadata: MetaData | null | undefined): object{
     return {
-        "Application": currentScreenshotMetadata?.screenProctoringMetadataApplication,
-        "Browser Title": currentScreenshotMetadata?.screenProctoringMetadataBrowser,
-        "Activity Details:": currentScreenshotMetadata?.screenProctoringMetadataUserAction,
-        "Url:": currentScreenshotMetadata?.screenProctoringMetadataURL,
-        "Window Title:": currentScreenshotMetadata?.screenProctoringMetadataWindowTitle,
+        [constants.APPLICATION_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataApplication,
+        [constants.SEB_BROWSER_TITLE_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataBrowser,
+        [constants.ACTIVITY_DETAILS_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataUserAction,
+        [constants.SEB_BROWSER_URL_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataURL,
+        [constants.WINDOW_TITLE_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataWindowTitle
     };
 }
diff --git a/client/src/services/component-services/proctoringViewService.ts b/client/src/services/component-services/proctoringViewService.ts
@@ -2,6 +2,7 @@ import * as screenshotDataService from "@/services/api-services/screenshotDataSe
 import * as timeUtils from "@/utils/timeUtils";
 import { SortOrder } from "@/models/sortOrderEnum";
 import * as metadataUtils from "@/utils/metadataUtils";
+import * as constants from "@/utils/constants";
 
 //=============api==================
 export async function getScreenshotDataBySessionId(sessionId: string): Promise<ScreenshotData | null>{
@@ -39,11 +40,11 @@ export function getScreenshotMetadata(sliderTime: number, currentScreenshotMetad
         "Date:": timeUtils.formatTimestampToDate(sliderTime),
         "Time:": timeUtils.formatTimestampToTime(sliderTime),
 
-        "Application:": currentScreenshotMetadata?.screenProctoringMetadataApplication,
-        "Browser Title:": currentScreenshotMetadata?.screenProctoringMetadataBrowser,
-        "Activity Details:": currentScreenshotMetadata?.screenProctoringMetadataUserAction + " " + additionalMetadataInfo,
-        "Url:": currentScreenshotMetadata?.screenProctoringMetadataURL,
-        "Window Title:": currentScreenshotMetadata?.screenProctoringMetadataWindowTitle,
+        [constants.APPLICATION_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataApplication,
+        [constants.SEB_BROWSER_TITLE_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataBrowser,
+        [constants.ACTIVITY_DETAILS_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataUserAction + " " + additionalMetadataInfo,
+        [constants.SEB_BROWSER_URL_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataURL,
+        [constants.WINDOW_TITLE_METADATA + ":"]: currentScreenshotMetadata?.screenProctoringMetadataWindowTitle,
     };
 }
 

diff --git a/client/src/utils/constants.ts b/client/src/utils/constants.ts
@@ -9,3 +9,9 @@ export const GALLERY_VIEW_ROUTE = "/gallery-view";
 export const PROCTORING_VIEW_ROUTE = "/recording";
 export const ACCOUNT_VIEW_ROUTE = "/account";
 
+//metadata
+export const APPLICATION_METADATA = "Focused Application";
+export const SEB_BROWSER_TITLE_METADATA = "SEB-Browser Title";
+export const SEB_BROWSER_URL_METADATA = "SEB-Browser URL";
+export const ACTIVITY_DETAILS_METADATA = "Activity Details";
+export const WINDOW_TITLE_METADATA = "Focused Window Title";