Merge pull request #573 from nestabentum/fix_report_viewer

Fix Report Viewer

jplag/src/main/java/de/jplag/reporting/reportobject/mapper/ComparisonReportMapper.java

@@ -36,21 +36,25 @@ private List<Match> convertMatchesToReportMatches(JPlagResult result, JPlagCompa
                 .map(match -> convertMatchToReportMatch(comparison, match, result.getOptions().getLanguage().supportsColumns())).toList();
     }
 
-    private Match convertMatchToReportMatch(JPlagComparison comparison, de.jplag.Match match, boolean usesIndex) {
+    private Match convertMatchToReportMatch(JPlagComparison comparison, de.jplag.Match match, boolean languageSupportsColumnsAndLines) {
         TokenList tokensFirst = comparison.getFirstSubmission().getTokenList();
         TokenList tokensSecond = comparison.getSecondSubmission().getTokenList();
         Token startTokenFirst = tokensFirst.getToken(match.startOfFirst());
         Token endTokenFirst = tokensFirst.getToken(match.startOfFirst() + match.length() - 1);
         Token startTokenSecond = tokensSecond.getToken(match.startOfSecond());
         Token endTokenSecond = tokensSecond.getToken(match.startOfSecond() + match.length() - 1);
 
-        int startFirst = usesIndex ? startTokenFirst.getIndex() : startTokenFirst.getLine();
-        int endFirst = usesIndex ? endTokenFirst.getIndex() : endTokenFirst.getLine();
-        int startSecond = usesIndex ? startTokenSecond.getIndex() : startTokenSecond.getLine();
-        int endSecond = usesIndex ? endTokenSecond.getIndex() : endTokenSecond.getLine();
+        int startFirst = getPosition(languageSupportsColumnsAndLines, startTokenFirst);
+        int endFirst = getPosition(languageSupportsColumnsAndLines, endTokenFirst);
+        int startSecond = getPosition(languageSupportsColumnsAndLines, startTokenSecond);
+        int endSecond = getPosition(languageSupportsColumnsAndLines, endTokenSecond);
         int tokens = match.length();
 
         return new Match(startTokenFirst.getFile(), startTokenSecond.getFile(), startFirst, endFirst, startSecond, endSecond, tokens);
     }
 
+    private int getPosition(boolean languageSupportsColumnsAndLines, Token token) {
+        return languageSupportsColumnsAndLines ? token.getLine() : token.getIndex();
+    }
+
 }

report-viewer/src/components/CodePanel.vue

@@ -25,27 +25,32 @@
         />
       </button>
     </div>
-    <div :class="{ hidden: !collapse }" class="code-container">
-      <LineOfCode
-        v-for="(line, index) in lines"
-        :id="String(panelId).concat(title).concat(index)"
-        :key="index"
-        :color="coloringArray[index]"
-        :is-first="isFirst[index]"
-        :is-last="isLast[index]"
-        :line-number="index + 1"
-        :text="line"
-        :visible="collapse"
-        @click="
-          $emit(
-            'lineSelected',
-            $event,
-            linksArray[index].panel,
-            linksArray[index].file,
-            linksArray[index].line
-          )
-        "
-      />
+    <div :class="{ hidden: !collapse }">
+      <div v-if="!isEmpty(lines)" class="code-container">
+        <LineOfCode
+          v-for="(line, index) in lines"
+          :id="String(panelId).concat(title).concat(index)"
+          :key="index"
+          :color="coloringArray[index]"
+          :is-first="isFirst[index]"
+          :is-last="isLast[index]"
+          :line-number="index + 1"
+          :text="line"
+          :visible="collapse"
+          @click="
+            $emit(
+              'lineSelected',
+              $event,
+              linksArray[index].panel,
+              linksArray[index].file,
+              linksArray[index].line
+            )
+          "
+        />
+      </div>
+      <div v-else class="code-container">
+        <p>Empty File</p>
+      </div>
     </div>
   </div>
 </template>
@@ -112,6 +117,9 @@ export default defineComponent({
      * @type {Ref<UnwrapRef<{}>>}
      */
     const coloringArray = ref({});
+    const isEmpty = (lines) => {
+      return lines.length === 0 || lines.every((line) => !(line.trim()));
+    };
     /**
      * An object containing an object from which an id is to of the line to which this is linked is constructed.
      * Id object contains panel, file name, first line number of linked matched.
@@ -170,6 +178,7 @@ export default defineComponent({
       linksArray,
       isFirst,
       isLast,
+      isEmpty,
     };
   },
 });

report-viewer/src/components/MatchTable.vue

@@ -13,20 +13,24 @@
         <th>File 2</th>
         <th>Tokens</th>
       </tr>
-      <tr v-for="( match, index ) in matches"
-          :key="String(index).concat(match.startInFirst).concat(match.startInSecond)"
-          :style="{ background : match.color }"
-          @click="$emit('matchSelected', $event, match)">
+      <tr
+        v-for="(match, index) in matches"
+        :key="
+          String(index).concat(match.startInFirst).concat(match.startInSecond)
+        "
+        :style="{ background: match.color }"
+        @click="$emit('matchSelected', $event, match)"
+      >
         <td>
           <div class="td-content">
             <p>{{ match.firstFile }}</p>
-            <p>({{ match.startInFirst }} - {{ match.endInFirst }})</p>
+            <p>({{ match.startInFirst + 1 }} - {{ match.endInFirst + 1 }})</p>
           </div>
         </td>
         <td>
           <div class="td-content">
             <p>{{ match.secondFile }}</p>
-            <p>({{ match.startInSecond }} - {{ match.endInSecond }})</p>
+            <p>({{ match.startInSecond + 1 }} - {{ match.endInSecond + 1 }})</p>
           </div>
         </td>
         <td>{{ match.tokens }}</td>
@@ -36,7 +40,7 @@
 </template>
 
 <script>
-import {defineComponent} from "vue";
+import { defineComponent } from "vue";
 
 export default defineComponent({
   name: "MatchTable",
@@ -46,25 +50,25 @@ export default defineComponent({
      * type: Array<Match>
      */
     matches: {
-      type: Array
+      type: Array,
     },
     /**
      * ID of first submission
      */
     id1: {
-      type: String
+      type: String,
     },
     /**
      * ID of second submission
      */
     id2: {
-      type: String
-    }
+      type: String,
+    },
   },
   setup() {
-    return {}
-  }
-})
+    return {};
+  },
+});
 </script>
 
 <style scoped>
@@ -97,13 +101,11 @@ table {
 th {
   color: var(--on-primary-color);
   text-align: center;
-
 }
 
 td {
   font-size: small;
   text-align: center;
   padding: 2%;
-
 }
-</style>
+</style>

report-viewer/src/views/FileUploadView.vue

@@ -53,19 +53,29 @@ export default defineComponent({
         },
       });
     };
+    const extractSubmissionFileName = (filePath: path.ParsedPath) => {
+      const folders = filePath.dir.split("/");
+      const submissionFolderIndex = folders.findIndex(
+        (folder) => folder === "submissions"
+      );
+      return folders[submissionFolderIndex + 1];
+    };
     /**
      * Handles zip file on drop. It extracts the zip and saves each file in the store.
      * @param file
      */
     const handleZipFile = (file: File) => {
       jszip.loadAsync(file).then(async (zip) => {
         for (const fileName of Object.keys(zip.files)) {
-          if (fileName.match(/submissions\/(.+)\/(.+)/)) {
+          if (
+            /((.+\/)*)submissions\/(.+)\/(.+)/.test(fileName) &&
+            !/^__MACOSX\//.test(fileName)
+          ) {
             const filePath = path.parse(fileName);
-            const submissionName = filePath.dir.split("/")[2];
+            const submissionFileName = extractSubmissionFileName(filePath);
             await zip.files[fileName].async("string").then((data) => {
               store.commit("saveSubmissionFile", {
-                name: submissionName,
+                name: submissionFileName,
                 file: { fileName: filePath.base, data: data },
               });
             });
@@ -105,10 +115,7 @@ export default defineComponent({
           single: true,
           fileString: str,
         });
-        navigateToComparisonView(
-          json["id1"],
-          json["id2"]
-        );
+        navigateToComparisonView(json["id1"], json["id2"]);
       }
     };
     /**