Skip to content

Commit

Permalink
* use popup instead of footer in monitorer
Browse files Browse the repository at this point in the history
* add multipleface monitorer
* add noise monitorer
  • Loading branch information
vdvibhu20 committed May 4, 2024
1 parent c5e3727 commit b7c5d24
Show file tree
Hide file tree
Showing 7 changed files with 240 additions and 33 deletions.
18 changes: 12 additions & 6 deletions app/models/contest-attempt.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,21 +17,27 @@ export default Model.extend({
}),
monitorerData: DS.attr(),
tabSwitchCount: Ember.computed('monitorerData', function() {
return this.monitorerData && this.monitorerData['tab-switch-count']
return this.monitorerData && this.monitorerData['tab-switch-count'] || 0
}),
tabSwitchTimePenaltyMinutes: Ember.computed('monitorerData', function() {
return this.monitorerData && this.monitorerData['tab-switch-count'] * 10
return this.monitorerData && this.monitorerData['tab-switch-count'] > 3 ? (this.monitorerData['tab-switch-count'] - 3) * 10 : 0
}),
windowResizeCount: Ember.computed('monitorerData', function() {
return this.monitorerData && this.monitorerData['window-resize-count']
return this.monitorerData && this.monitorerData['window-resize-count'] || 0
}),
windowResizeTimePenaltyMinutes: Ember.computed('monitorerData', function() {
return this.monitorerData && this.monitorerData['window-resize-count'] * 10
return this.monitorerData && this.monitorerData['window-resize-count'] || 0
}),
noFaceCount: Ember.computed('monitorerData', function() {
return this.monitorerData && this.monitorerData['no-face-count']
return this.monitorerData && this.monitorerData['no-face-count'] || 0
}),
noFaceTimePenaltyMinutes: Ember.computed('monitorerData', function() {
return this.monitorerData && this.monitorerData['no-face-count'] * 10
return this.monitorerData && this.monitorerData['no-face-count'] > 3 ? (this.monitorerData['no-face-count'] - 3) * 10 : 0
}),
multipleFacesCount: Ember.computed('monitorerData', function() {
return this.monitorerData && this.monitorerData['multiple-faces-count'] || 0
}),
multipleFacesTimePenaltyMinutes: Ember.computed('monitorerData', function() {
return this.monitorerData && this.monitorerData['multiple-faces-count'] > 3 ? (this.monitorerData['multiple-faces-count'] - 3) * 10 : 0
}),
});
3 changes: 3 additions & 0 deletions app/models/contest.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,4 +64,7 @@ export default Model.extend({
disallowTabSwitch: DS.attr(),
disallowWindowResize: DS.attr(),
disallowNoFace: DS.attr(),
disallowMultipleFaces: DS.attr(),
disallowNoise: DS.attr(),
enforceFullscreen: DS.attr(),
});
23 changes: 23 additions & 0 deletions app/pods/components/full-screen-contest-view/component.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import Component from '@ember/component';
import ENV from 'hackerblocks/config/environment';
import { inject as service } from '@ember/service';
import { action } from '@ember/object';

export default class FullScreenContestView extends Component {
@service monitorer
Expand All @@ -9,4 +11,25 @@ export default class FullScreenContestView extends Component {
this._super(...arguments)
this.setupMonitorer()
}

async didInsertElement() {
// await this.ajax.request(ENV.apiHost + '/time')
// if(this.contest.enforceFullscreen) {
// const fullScreenContestViewElement = document.getElementById('fullsceen-contest-view')
// if (fullScreenContestViewElement.requestFullscreen) {
// fullScreenContestViewElement.requestFullscreen.call(fullScreenContestViewElement)
// } else if (fullScreenContestViewElement.webkitRequestFullscreen) { /* Safari */
// fullScreenContestViewElement.webkitRequestFullscreen();
// } else if (fullScreenContestViewElement.msRequestFullscreen) { /* IE11 */
// fullScreenContestViewElement.msRequestFullscreen();
// }
// }
}

re

@action
resetFaultMessages() {
this.monitorer.resetFaultMessages()
}
}
107 changes: 92 additions & 15 deletions app/pods/components/full-screen-contest-view/template.hbs
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="code-window flex-col">
<div id="fullsceen-contest-view" class="code-window flex-col" allow="fullscreen">
<div
class="row mx-0 white bg-dark-grey align-items-center justify-content-between py-4 w-100 code-window__top-bar tl">
<div class="col-xl-6 col-lg-6 col-md-5 col-sm-7 col-12 offset-md-1">
Expand All @@ -20,7 +20,7 @@
</li>
{{#if contest.disallowTabSwitch}}
<li>
Tab Switching Prohibited <span class="red">You will get a penalty of 10 mins in case you switch tab.</span>
Tab Switching Prohibited <span class="red">You will get a penalty of 10 mins in case you switch tab after 3 faults.</span>
</li>
{{/if}}
{{#if contest.disallowWindowResize}}
Expand All @@ -30,7 +30,12 @@
{{/if}}
{{#if contest.disallowNoFace}}
<li>
Face Detection Enabled <span class="red">You will get a penalty of 10 mins every 5 secs if your face is not visible in camera.</span>
Face Detection Enabled <span class="red">You will get a penalty of 10 mins every 5 secs if your face is not visible in camera after 3 faults.</span>
</li>
{{/if}}
{{#if contest.disallowMultipleFaces}}
<li>
Multiple Face Detection Enabled <span class="red">You will get a penalty of 10 mins every 5 secs if multiple faces are visible in camera after 3 faults.</span>
</li>
{{/if}}
</ul>
Expand All @@ -45,7 +50,7 @@
<div class="d-flex justify-content-end align-items-center">
{{#if contest.disallowNoFace}}
<div class="col-3 br-15">
<video id="monitorer_live_feed" class="w-100 br-15 {{if monitorer.noFaceDetected 'border-dark-pink' 'border-green'}}"></video>
<video id="monitorer_live_feed" class="w-100 br-15 {{if monitorer.oneFaceDetected 'border-green' 'border-dark-pink'}}"></video>
</div>
{{/if}}
<div class="mr-4 flex-col align-items-center">
Expand All @@ -69,27 +74,24 @@
</li>
</ul>
</Timer>
{{#if (or attempt.tabSwitchCount attempt.windowResizeCount)}}
{{#if (or attempt.tabSwitchCount attempt.windowResizeCount attempt.noFaceCount attempt.multipleFacesCount)}}
<div class="hoverable pill-sm bg-gradient-pink pulse-red mt-3 py-1 px-2">
<span class="font-xxs">Penalties</span>
<div class="border-card border-dark-pink pop-up w-250x pt-2 px-3">
<div class="font-xxs mt-2 red">
{{#if contest.disallowTabSwitch}}
Total Tab Switches: {{or attempt.tabSwitchCount 0}}
<br>
Total Time Penalty: {{or attempt.tabSwitchTimePenaltyMinutes 0}} mins
Total Tab Switches: {{or attempt.tabSwitchCount 0}} | {{or attempt.tabSwitchTimePenaltyMinutes 0}} mins deducted
{{/if}}
<br>
{{#if contest.disallowWindowResize}}
Total Window Resizes: {{or attempt.windowResizeCount 0}}
<br>
Total Time Penalty: {{or attempt.windowResizeTimePenaltyMinutes 0}} mins
Total Window Resizes: {{or attempt.windowResizeCount 0}} | {{or attempt.windowResizeTimePenaltyMinutes 0}} mins deducted
{{/if}}
<br>
{{#if contest.disallowNoFace}}
Total Face Undetected: {{or attempt.noFaceCount 0}}
<br>
Total Time Penalty: {{or attempt.noFaceTimePenaltyMinutes 0}} mins
Total Face Undetected: {{or attempt.noFaceCount 0}} | {{or attempt.noFaceTimePenaltyMinutes 0}} mins deducted
{{/if}}
{{#if contest.disallowMultipleFaces}}
Total Multiple Faces Detected: {{attempt.multipleFacesCount}} | {{attempt.multipleFacesTimePenaltyMinutes}} mins deducted
{{/if}}
</div>
</div>
Expand All @@ -107,7 +109,6 @@
@route={{route}} @contest={{contest}} />
{{yield}}
</div>
</div>

{{#if showSubmitDialog}}
<ModalDialog @onClose={{action (mut showSubmitDialog) false}} @translucentOverlay={{true}}>
Expand Down Expand Up @@ -135,6 +136,77 @@
</ModalDialog>
{{/if}}

{{#if monitorer.faultTrigger}}
<ModalDialog
@onClose={{action 'resetFaultMessages'}}
@translucentOverlay={{true}}
>
<div class="border-card br-20 p-2">
<div class="border-card bg-gradient-pink white br-20 p-4">
<h3>Faults</h3>
<ul>
<li>
{{#if monitorer.faultMessages.tabSwitch}}
<span><i class="fas fa-info-circle font-sm"></i> You switched tab {{attempt.tabSwitchCount}} {{if (eq attempt.tabSwitchCount 1) 'time' 'times'}}.</span>
{{#if (gt attempt.tabSwitchCount 3)}}
<span>10 minutes deducted.</span>
{{/if }}
{{/if}}
</li>
<li>
{{#if monitorer.faultMessages.noFace}}
<span><i class="fas fa-info-circle font-sm"></i> No Face detected {{attempt.noFaceCount}} {{if (eq attempt.noFaceCount 1) 'time' 'times'}}.</span>
{{#if (gt attempt.noFaceCount 3)}}
<span>10 minutes deducted.</span>
{{/if }}
{{/if}}
</li>
<li>
{{#if monitorer.faultMessages.multipleFaces}}
<span><i class="fas fa-info-circle font-sm"></i> Multiple faces detected {{attempt.multipleFacesCount}} {{if (eq attempt.multipleFacesCount 1) 'time' 'times'}}.</span>
{{#if (gt attempt.multipleFacesCount 3)}}
<span>10 minutes deducted.</span>
{{/if }}
{{/if}}
</li>
<li>
{{#if monitorer.faultMessages.windowResize}}
<span><i class="fas fa-info-circle font-sm"></i> You resized window {{attempt.windowResizeCount}} {{if (eq attempt.windowResizeCount 1) 'time' 'times'}}.</span>
{{#if (gt attempt.multipleFacesCount 3)}}
<span>10 minutes deducted.</span>
{{/if }}
{{/if}}
</li>
<li>
{{#if monitorer.faultMessages.noise}}
<span><i class="fas fa-info-circle font-sm"></i> Noise detected.</span>
{{/if}}
</li>
</ul>
</div>
<div class="border-card p-4 my-3 bg-grey">
{{#if contest.disallowTabSwitch}}
Total Tab Switches: <span class="red">{{attempt.tabSwitchCount}} | {{attempt.tabSwitchTimePenaltyMinutes}} mins deducted</span>
{{/if}}
<br>
{{#if contest.disallowWindowResize}}
Total Window Resizes: <span class="red">{{attempt.windowResizeCount}} | {{attempt.windowResizeTimePenaltyMinutes}} mins deducted</span>
{{/if}}
<br>
{{#if contest.disallowNoFace}}
Total Face Undetected: <span class="red">{{attempt.noFaceCount}} | {{attempt.noFaceTimePenaltyMinutes}} mins deducted</span>
{{/if}}
<br>
{{#if contest.disallowMultipleFaces}}
Total Multiple Faces detected: <span class="red">{{attempt.multipleFacesCount}} | {{attempt.multipleFacesTimePenaltyMinutes}} mins deducted</span>
{{/if}}
</div>
</div>
</ModalDialog>
{{/if}}
</div>


<div class="bottom-bar">
<WPulse @class="display-inline" @triggered={{monitorer.tabSwitchTrigger }}>
<div class="white t-align-c bg-gradient-pink font-md w-100 h-100 py-4">
Expand All @@ -151,4 +223,9 @@
No face detected in camera. 10 minutes deducted.
</div>
</WPulse>
<WPulse @class="display-inline" @triggered={{monitorer.multipleFacesTrigger}}>
<div class="white t-align-c bg-gradient-pink font-md w-100 h-100 py-4">
Multiple faces detected in camera. 10 minutes deducted.
</div>
</WPulse>
</div>
2 changes: 1 addition & 1 deletion app/pods/components/full-screen-problem-view/template.hbs
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class="col-md-6 col-12 px-xl-5 px-4 position-relative h-100 overflow-y-auto">
<div class="col-md-6 col-12 px-xl-5 px-4 position-relative h-100 overflow-y-auto bg-white">
<div class="row no-gutters pt-4">
<div class="col-6 word-wrap">
<div class="font-mds">Problem</div>
Expand Down
10 changes: 8 additions & 2 deletions app/pods/components/intermediate-contest-view/template.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -89,7 +89,7 @@
{{#if (or contest.disallowTabSwitch contest.disallowWindowResize contest.disallowNoFace)}}
<div class="border-card bg-gradient-pink border-none text-white p-4 mt-4">
{{#if contest.disallowTabSwitch}}
<i class="fas fa-info-circle font-sm"></i> Tab Switching is prohibited on this contest. You will face a penalty of 10 mins in case you :-
<i class="fas fa-info-circle font-sm"></i> Tab Switching is prohibited on this contest. You will face a penalty of 10 mins after 3 faults in case you :-
<ul>
<li>&#8226; Switch the current tab</li>
<li>&#8226; Minimize the browser or switch to any other application</li>
Expand All @@ -104,11 +104,17 @@
</ul>
{{/if}}
{{#if contest.disallowNoFace}}
<i class="fas fa-info-circle font-sm"></i> Face detection is enabled on this contest. You will face a penalty of 10 mins every 5 secs in case :-
<i class="fas fa-info-circle font-sm"></i> Face detection is enabled on this contest. You will face a penalty of 10 mins every 5 secs after 3 faults in case :-
<ul>
<li>&#8226; Your face is not visible in camera.</li>
</ul>
{{/if}}
{{#if contest.disallowMultipleFaces}}
<i class="fas fa-info-circle font-sm"></i> Multiple face detection is enabled on this contest. You will face a penalty of 10 mins every 5 secs after 3 faults in case :-
<ul>
<li>&#8226; More than 1 face is visible in camera.</li>
</ul>
{{/if}}
</div>
{{/if}}
</div>
Expand Down
Loading

0 comments on commit b7c5d24

Please sign in to comment.