Update chat_application/templates/room.html

chat_application/templates/room.html

@@ -62,7 +62,8 @@
         <p>By clicking yes, you will exit the experiment <strong>without</strong> completing the final survey.</p>
         <p>We encourage you to message us about any concerns or to <a href="{{ feedback_form_url | default('https://umw.qualtrics.com/jfe/form/SV_08v26NssCOwZTP8') }}" target="_blank">provide feedback here</a>.</p>
         <div class="modal-buttons">
-          <button class="modal-btn" id="abortYesBtn">Yes</button>
+          <button class="modal-btn" id="abortYesBtn">End early with code "C9V2XFDU"</button>
+          <button class="modal-btn" id="abortYesBtn-SurveyAnyway">Flag my data and take the survey anyway.</button>
           <button class="modal-btn" id="abortNoBtn">Cancel</button>
         </div>
       </div>
@@ -117,6 +118,7 @@
     };
     // Creates the post-survey link (based on the bot names)
     const endpoint = "{{ url_for('post_survey') }}";
+    const endpointQuitEarly = "https://app.prolific.com/submissions/complete?cc=C9V2XFDU";
     socketio.on("message", function (message) { createChatItem(message.message, message.sender) });
     function createChatItem(message, sender) {
       //autoscroll capabilities
@@ -203,7 +205,9 @@
     document.getElementById("abortNoBtn-pre").onclick = function () {
       modal.style.display = "none";
     };
-    document.getElementById("abortYesBtn").onclick = function (e) {
+
+
+    document.getElementById("abortYesBtn-SurveyAnyway").onclick = function (e) {
       //block browser confirmation popup
       e.stopPropagation(); 
       // Mark that user aborted and redirect to ending survey
@@ -225,6 +229,29 @@
     document.getElementById("abortNoBtn").onclick = function () {
       abortModalConfirm.style.display = "none";
     };
+    
+    document.getElementById("abortYesBtn").onclick = function (e) {
+      //block browser confirmation popup
+      e.stopPropagation(); 
+      // Mark that user aborted and redirect to ending survey
+      fetch("/abort", { method: "POST" })
+        .then(() => {
+          window.open(endpointQuitEarly, "_blank");
+    	});
+      modal.style.display = "none";
+      textarea.disabled = true;
+      textarea.placeholder = "The chat has ended.";
+      document.getElementById("send-btn").disabled = true;
+      document.getElementById("end-exp-btn").disabled = true;
+      document.getElementById("abort-exp-btn").disabled = true;
+      if (socketio) {
+      	socketio.close();
+      }
+      abortModalConfirm.style.display = "none";
+    };
+    document.getElementById("abortNoBtn").onclick = function () {
+      abortModalConfirm.style.display = "none";
+    };
       
     // add auto scroll
     function isNearBottom(container, threshold = 120) {