Merge pull request #3335 from alfonso-salces/MOBILE-4027

MOBILE-4027 h5pactivity: Don't show modal if user finish activity 10 secs ago

src/addons/mod/h5pactivity/components/index/index.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import { Component, Optional, OnInit, OnDestroy } from '@angular/core';
+import { Component, Optional, OnInit, OnDestroy, Output, EventEmitter } from '@angular/core';
 import { IonContent } from '@ionic/angular';
 
 import { CoreConstants } from '@/core/constants';
@@ -55,6 +55,8 @@ import { AddonModH5PActivityModuleHandlerService } from '../../services/handlers
 })
 export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActivityComponent implements OnInit, OnDestroy {
 
+    @Output() onActivityFinish = new EventEmitter<boolean>();
+
     component = AddonModH5PActivityProvider.COMPONENT;
     moduleName = 'h5pactivity';
 
@@ -464,6 +466,7 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
                 // Check if the H5P has ended. Final statements don't include a subContentId.
                 const hasEnded = data.statements.some(statement => !statement.object.id.includes('subContentId='));
                 if (hasEnded) {
+                    this.onActivityFinish.emit(hasEnded);
                     this.checkCompletion();
                 }
             }

src/addons/mod/h5pactivity/pages/index/index.html

@@ -20,6 +20,7 @@
         <ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
     </ion-refresher>
 
-    <addon-mod-h5pactivity-index [module]="module" [courseId]="courseId" (dataRetrieved)="updateData($event)">
+    <addon-mod-h5pactivity-index [module]="module" [courseId]="courseId" (dataRetrieved)="updateData($event)"
+        (onActivityFinish)="setCanleaveSafely($event)">
     </addon-mod-h5pactivity-index>
 </ion-content>

src/addons/mod/h5pactivity/pages/index/index.ts

@@ -12,7 +12,7 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import { Component, ViewChild } from '@angular/core';
+import { Component, OnDestroy, ViewChild } from '@angular/core';
 
 import { CoreCourseModuleMainActivityPage } from '@features/course/classes/main-activity-page';
 import { CanLeave } from '@guards/can-leave';
@@ -28,7 +28,10 @@ import { AddonModH5PActivityIndexComponent } from '../../components/index';
     templateUrl: 'index.html',
 })
 export class AddonModH5PActivityIndexPage extends CoreCourseModuleMainActivityPage<AddonModH5PActivityIndexComponent>
-    implements CanLeave {
+    implements CanLeave, OnDestroy {
+
+    canLeaveSafely = false;
+    remainingTimeout?: ReturnType<typeof setTimeout>;
 
     @ViewChild(AddonModH5PActivityIndexComponent) activityComponent?: AddonModH5PActivityIndexComponent;
 
@@ -40,12 +43,42 @@ export class AddonModH5PActivityIndexPage extends CoreCourseModuleMainActivityPa
             return true;
         }
 
-        try {
-            await CoreDomUtils.showConfirm(Translate.instant('core.confirmleaveunknownchanges'));
+        if (!this.canLeaveSafely) {
+            try {
+                await CoreDomUtils.showConfirm(Translate.instant('core.confirmleaveunknownchanges'));
 
-            return true;
-        } catch {
-            return false;
+                return true;
+            } catch {
+                return false;
+            }
+        }
+
+        return true;
+    }
+
+    /**
+     * Set if this activity can be leaved safely (withow showing warning modal) if activity is finished
+     * 10 seconds before.
+     *
+     * @param isDone the H5P activity is done.
+     */
+    setCanleaveSafely(isDone: boolean): void {
+        this.canLeaveSafely = isDone;
+        if (this.remainingTimeout) {
+            clearTimeout(this.remainingTimeout);
+        }
+        // When user finish an activity, he have 10 seconds to leave safely (without show alert).
+        this.remainingTimeout = setTimeout(() => {
+            this.canLeaveSafely = false;
+        }, 10000);
+    }
+
+    /**
+     * @inheritdoc
+     */
+    ngOnDestroy(): void {
+        if (this.remainingTimeout) {
+            clearTimeout(this.remainingTimeout);
         }
     }