From 8bcd10783411ac6d38b665233da4750941d1e6ad Mon Sep 17 00:00:00 2001
From: Michael Gau <61722401+mengyewgau@users.noreply.github.com>
Date: Mon, 15 Jan 2024 22:31:16 +0800
Subject: [PATCH] Feature/obfuscation (#304)

* Introduced Obfuscation function for reports

* Removed debugging comments

* Added edge cases for obfuscation

* Selection by a dedicated class instead of elements and removed unused logs

* Remove redundant logging

---------

Co-authored-by: Hu Yuxin <e0564960@u.nus.edu>
---
 .../javascripts/submission_obfuscation.js     | 50 +++++++++++++++++++
 app/views/layouts/pdf_report.html.erb         | 10 ++++
 .../_pair_report_student_pair.html.erb        |  4 +-
 .../_side_by_side_view.html.erb               |  8 +--
 .../submission_similarities/index.html.erb    | 10 +++-
 5 files changed, 75 insertions(+), 7 deletions(-)
 create mode 100644 app/assets/javascripts/submission_obfuscation.js

diff --git a/app/assets/javascripts/submission_obfuscation.js b/app/assets/javascripts/submission_obfuscation.js
new file mode 100644
index 00000000..591da87f
--- /dev/null
+++ b/app/assets/javascripts/submission_obfuscation.js
@@ -0,0 +1,50 @@
+(function () {
+    let SubmissionObfuscation = {};
+
+    // Retrieve the "obfuscate" parameter from the URL
+    let urlParams = new URLSearchParams(window.location.search);
+    window.shouldNotObfuscate = (urlParams.get('obfuscate') === 'false');
+
+    SubmissionObfuscation.maskStudentName = function () {
+
+        // Check if the global flag for obfuscation is false; if so, return without obfuscating
+        if (window.shouldNotObfuscate) {
+            return;
+        }
+
+        // Masking inside all h4 elements with id "submission_similarities_for_students" to get the student pairings
+        let h4Element = document.querySelector('h4[class="submission_similarities_for_students"]');
+        if (h4Element) {
+            let match = h4Element.innerHTML.match(/for Students .*? and (.*?) \(\d+\.\d+%\)/);
+            if (match && match[1] && match[1] !== '******') {
+                let student2Name = match[1];
+                h4Element.innerHTML = h4Element.innerHTML.replace(new RegExp("and\\s" + student2Name, "g"), "and ******");
+            }
+        }
+
+        // Masking h5 elements with the class 'submission2_by_student2'
+        let h5Elements = document.querySelectorAll('h5.submission2_by_student2');
+
+        h5Elements.forEach(h5Element => {
+            // Adjusted regex to capture student names like Student-02 or x-v6551_q1
+            h5Element.innerHTML = h5Element.innerHTML.replace(/Submission by [\w-]+[_\w]*/, 'Submission by ******');
+        });
+
+        // Masking inside table header with class "student2_submission" in every table
+        let tables = document.querySelectorAll('table');
+        tables.forEach(table => {
+            let thirdColumnHeader = table.querySelector('th.student2_submission');
+            if (thirdColumnHeader) {
+                // Adjusted regex to capture student names like Student-02 or x-v6551_q1
+                let match = thirdColumnHeader.innerHTML.match(/Submission by ([\w-]+[_\w]*)/);
+                if (match && match[1] && match[1] !== '******') {
+                    thirdColumnHeader.innerHTML = thirdColumnHeader.innerHTML.replace(match[1], '******');
+                }
+            }
+        });
+    };
+
+    // Expose SubmissionObfuscation to the global context
+    window.SubmissionObfuscation = SubmissionObfuscation;
+
+}).call(this);
diff --git a/app/views/layouts/pdf_report.html.erb b/app/views/layouts/pdf_report.html.erb
index dac93929..ff9c3f8f 100644
--- a/app/views/layouts/pdf_report.html.erb
+++ b/app/views/layouts/pdf_report.html.erb
@@ -38,5 +38,15 @@ along with SSID.  If not, see <http://www.gnu.org/licenses/>.
       <%= yield %>
     </div>
   </main>
+
+  <script type="text/javascript">
+    window.onload = function() {
+      var shouldNotObfuscate = localStorage.getItem('shouldNotObfuscate') === 'true';
+      window.shouldNotObfuscate = shouldNotObfuscate
+      if (window.SubmissionObfuscation && typeof window.SubmissionObfuscation.maskStudentName === 'function') {
+        window.SubmissionObfuscation.maskStudentName();
+      }
+    };
+  </script>
 </body>
 </html>
diff --git a/app/views/submission_similarities/_pair_report_student_pair.html.erb b/app/views/submission_similarities/_pair_report_student_pair.html.erb
index 0c5a905b..26f7b1ca 100644
--- a/app/views/submission_similarities/_pair_report_student_pair.html.erb
+++ b/app/views/submission_similarities/_pair_report_student_pair.html.erb
@@ -15,5 +15,5 @@
   }
 </style>
 
-<h4>Submission Similarities for Students <%= @submission_similarity.student1.name %> and <%= @submission_similarity.student2.name %> (<%= @submission_similarity.similarity %>%)</h4>
-<%= render partial: "submission_similarities/side_by_side_view", locals: { submission_similarity: @submission_similarity }%>
+<h4 class="submission_similarities_for_students">Submission Similarities for Students <%= @submission_similarity.student1.name %> and <%= @submission_similarity.student2.name %> (<%= @submission_similarity.similarity %>%)</h4>
+<%= render partial: "submission_similarities/side_by_side_view", locals: { submission_similarity: @submission_similarity }%>
\ No newline at end of file
diff --git a/app/views/submission_similarities/_side_by_side_view.html.erb b/app/views/submission_similarities/_side_by_side_view.html.erb
index 736e9375..23071f51 100644
--- a/app/views/submission_similarities/_side_by_side_view.html.erb
+++ b/app/views/submission_similarities/_side_by_side_view.html.erb
@@ -21,8 +21,8 @@
       <thead>
         <tr>
           <th>Key</th>
-          <th class="lines_col">Submission by <%= @student1.name %></th>
-          <th class="lines_col">Submission by <%= @student2.name %></th>
+          <th class="lines_col student1_submission">Submission by <%= @student1.name %></th>
+          <th class="lines_col student2_submission">Submission by <%= @student2.name %></th>
           <th>Num of Matching Statements</th>
         </tr>
       </thead>
@@ -64,8 +64,8 @@
 <% current_line_num = 1 %>
 <% current_mapping = sorted_mappings.shift %>
 
-<h5 style="float:left; width: 50%;">Submission by <%= @student1.name %></h5>
-<h5 style="float:right; width: 50%;">Submission by <%= @student2.name %></h5>
+<h5 class="submission1_by_student1" style="float:left; width: 50%;">Submission by <%= @student1.name %></h5>
+<h5 class="submission2_by_student2" style="float:right; width: 50%;">Submission by <%= @student2.name %></h5>
 
 <% while current_line_num <= @submission1.lines.size %>
 <div class="submissions">
diff --git a/app/views/submission_similarities/index.html.erb b/app/views/submission_similarities/index.html.erb
index 5bbeb0e5..1f59b1bd 100644
--- a/app/views/submission_similarities/index.html.erb
+++ b/app/views/submission_similarities/index.html.erb
@@ -55,6 +55,9 @@
   function viewMultipairsReport() {
     var idsToPrint = [...document.querySelectorAll('.checkbox:checked')].map(e => e.value);
 
+    var shouldNotObfuscate = document.getElementById('obfuscationToggle').checked;
+    localStorage.setItem('shouldNotObfuscate', shouldNotObfuscate);
+
     var baseUrl = "view_printable_multiple?submission_similarity_ids="
     
     window.open(baseUrl + idsToPrint.join(","), '_blank').focus();
@@ -84,7 +87,12 @@
   <li>To allow non-SSID users to view and analyse the results, <%= link_to "create", guest_user_create_path(:id => @assignment) %> a sharable link </li> 
 </ul>
 
-<button type="button" class="btn btn-primary" onclick="viewMultipairsReport()">Print Report for Selected</button>
+<button type="button" class="btn btn-primary" onclick="viewMultipairsReport()")>Print Report for Selected</button>
+
+<label>
+  <input type="checkbox" id="obfuscationToggle"> Reveal Student Names
+</label>
+
 <p></p>
 <%= form_with url: request.path, method: :get do |form| %>
   <%= form.label :query, "Page size:" %>