From 64624fb7ee28ccca56a02c786f6bc1d2cac7b886 Mon Sep 17 00:00:00 2001
From: Vibhu Dujari <vdvibhu20@gmail.com>
Date: Sat, 9 Mar 2024 18:17:45 +0530
Subject: [PATCH] Show explicit tab switch prompt

---
 app/pods/components/full-screen-contest-view/component.js | 2 ++
 app/pods/components/full-screen-contest-view/template.hbs | 6 +++++-
 app/services/monitorer.js                                 | 3 ++-
 app/styles/app.scss                                       | 7 +++++++
 4 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/app/pods/components/full-screen-contest-view/component.js b/app/pods/components/full-screen-contest-view/component.js
index ba658ddc..e468c094 100644
--- a/app/pods/components/full-screen-contest-view/component.js
+++ b/app/pods/components/full-screen-contest-view/component.js
@@ -1,5 +1,7 @@
 import Component from '@ember/component';
+import { inject as service } from '@ember/service';
 
 export default class FullScreenContestView extends Component {
+  @service monitorer
   showSubmitDialog = false
 }
diff --git a/app/pods/components/full-screen-contest-view/template.hbs b/app/pods/components/full-screen-contest-view/template.hbs
index c02e9299..57362fce 100644
--- a/app/pods/components/full-screen-contest-view/template.hbs
+++ b/app/pods/components/full-screen-contest-view/template.hbs
@@ -99,4 +99,8 @@
     </div>
   </div>
 </ModalDialog>
-{{/if}}
\ No newline at end of file
+{{/if}}
+
+<WPulse @class="display-inline" @triggered={{monitorer.tabSwitchTrigger}}>
+  <div class="bottom-bar t-align-c bg-gradient-pink font-md">You Switched the tab. 10 minutes deducted.</div>
+</WPulse>
\ No newline at end of file
diff --git a/app/services/monitorer.js b/app/services/monitorer.js
index b7fb9286..d2512063 100644
--- a/app/services/monitorer.js
+++ b/app/services/monitorer.js
@@ -7,6 +7,7 @@ export default Service.extend({
   api: service(),
   store: service(),
   isEventListenerAdded: false,
+  tabSwitchTrigger: false,
   monitoredRoutes: [
     'contests.contest.attempt.content.problem',
     'contests.contest.attempt.content.quiz',
@@ -44,7 +45,7 @@ export default Service.extend({
         fault_type: 'tab_switch'
       }
     })
-
+    this.setProperties('tabSwitchTrigger', true)
     await this.store.findRecord('contest-attempt', currentAttempt.id)
   },
 
diff --git a/app/styles/app.scss b/app/styles/app.scss
index cfaf7dcf..19956e4e 100644
--- a/app/styles/app.scss
+++ b/app/styles/app.scss
@@ -228,6 +228,13 @@ body{
   animation: pulse-animation-red 2s infinite;
 }
 
+.bottom-bar {
+  position: fixed;
+  bottom: 0;
+  padding: 2rem 4rem;
+  width: 100vw;
+}
+
 // Animations
 
 @keyframes dots {