feat: show evaluation modal in last 5% of video

docchula · Mar 3, 2025 · 6e35cdf · 6e35cdf
1 parent d20e906
commit 6e35cdf
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/src/app/home/course/course.page.ts b/src/app/home/course/course.page.ts
@@ -90,6 +90,7 @@ export class CoursePage implements OnInit, AfterViewInit, OnDestroy {
     progressNetworkError: boolean | null;
     sessionUid: string; // Unique ID for session x video (new id for each video)
     stopPolling$ = new Subject<boolean>();
+    isEvaluated = false;
 
     constructor(private route: ActivatedRoute, private router: Router,
         private manService: ManService, private alertController: AlertController,
@@ -145,8 +146,9 @@ export class CoursePage implements OnInit, AfterViewInit, OnDestroy {
             });
             this.videoPlayer.on('ended', () => {
                 this.updatePlayRecord();
-                if (!this.currentVideo.is_evaluated) {
+                if (!this.currentVideo.is_evaluated && !this.isEvaluated) {
                     this.openEvaluationModal();
+                    this.isEvaluated = true;
                 }
             });
             this.videoPlayer.on('loadedmetadata', () => {
@@ -184,6 +186,11 @@ export class CoursePage implements OnInit, AfterViewInit, OnDestroy {
                         lastLog.updatedAt = currentTimestamp;
                         this.playLog[lastLogKey] = lastLog;
                     }
+                    // Show evaluation modal when video is paused in the last 5% of the video
+                    if (!current.isSeeking && !this.currentVideo.is_evaluated && !this.isEvaluated && this.currentVideo.duration && (current.currentTime > this.currentVideo.duration * 0.95)) {
+                        this.openEvaluationModal();
+                        this.isEvaluated = true;
+                    }
                 } else {
                     if (!lastLog // New
                         || lastLog.playbackRate !== current.playbackRate // Playback rate changed
@@ -271,6 +278,7 @@ export class CoursePage implements OnInit, AfterViewInit, OnDestroy {
         this.videoPlayer.src(video.sources);
         this.currentVideo = video;
         this.videoPlayerElement.nativeElement.focus();
+        this.isEvaluated = false;
         this.sessionUid = ulid();
         this.playLog = [];
     }

diff --git a/src/app/home/course/modal-evaluation.component.html b/src/app/home/course/modal-evaluation.component.html
@@ -2,7 +2,13 @@
     <ion-toolbar>
         <ion-title>Evaluation</ion-title>
         <ion-buttons slot="end">
-            <ion-button (click)="confirm()" [strong]="true">Continue</ion-button>
+            <ion-button (click)="confirm()" [strong]="true">
+                @if (result.delivery || result.material || result.video) {
+                    Submit
+                } @else {
+                    Continue/Skip
+                }
+            </ion-button>
         </ion-buttons>
     </ion-toolbar>
 </ion-header>