MOBILE-3412: Support offline and sync

Author: dpalou

scripts/langindex.json

@@ -1408,6 +1408,7 @@
   "core.confirmdeletefile": "repository",
   "core.confirmgotabroot": "local_moodlemobileapp",
   "core.confirmgotabrootdefault": "local_moodlemobileapp",
+  "core.confirmleaveunknownchanges": "local_moodlemobileapp",
   "core.confirmloss": "local_moodlemobileapp",
   "core.confirmopeninbrowser": "local_moodlemobileapp",
   "core.considereddigitalminor": "moodle",
@@ -1861,6 +1862,7 @@
   "core.mod_folder": "folder/pluginname",
   "core.mod_forum": "forum/pluginname",
   "core.mod_glossary": "glossary/pluginname",
+  "core.mod_h5pactivity": "h5pactivity/pluginname",
   "core.mod_ims": "imscp/pluginname",
   "core.mod_imscp": "imscp/pluginname",
   "core.mod_label": "label/pluginname",

src/addon/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html

@@ -5,7 +5,8 @@
         <core-context-menu-item *ngIf="externalUrl" [priority]="900" [content]="'core.openinbrowser' | translate" [href]="externalUrl" [iconAction]="'open'"></core-context-menu-item>
         <core-context-menu-item *ngIf="description" [priority]="800" [content]="'core.moduleintro' | translate" (action)="expandDescription()" [iconAction]="'arrow-forward'"></core-context-menu-item>
         <core-context-menu-item *ngIf="blog" [priority]="750" content="{{'addon.blog.blog' | translate}}" [iconAction]="'fa-newspaper-o'" (action)="gotoBlog($event)"></core-context-menu-item>
-        <core-context-menu-item *ngIf="loaded && isOnline" [priority]="700" [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false"></core-context-menu-item>
+        <core-context-menu-item *ngIf="loaded && !hasOffline && isOnline" [priority]="700" [content]="'core.refresh' | translate" (action)="doRefresh(null, $event)" [iconAction]="refreshIcon" [closeOnClick]="false"></core-context-menu-item>
+        <core-context-menu-item *ngIf="loaded && hasOffline && isOnline"  [priority]="600" [content]="'core.settings.synchronizenow' | translate" (action)="doRefresh(null, $event, true)" [iconAction]="syncIcon" [closeOnClick]="false"></core-context-menu-item>
         <core-context-menu-item *ngIf="prefetchStatusIcon" [priority]="500" [content]="prefetchText" (action)="prefetch($event)" [iconAction]="prefetchStatusIcon" [closeOnClick]="false"></core-context-menu-item>
         <core-context-menu-item *ngIf="size" [priority]="400" [content]="'core.removefiles' | translate:{$a: size}" [iconDescription]="'cube'" (action)="removeFiles($event)" [iconAction]="'trash'" [closeOnClick]="false"></core-context-menu-item>
     </core-context-menu>
@@ -16,6 +17,11 @@
 
     <core-course-module-description [description]="description" [component]="component" [componentId]="componentId" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId"></core-course-module-description>
 
+    <!-- Offline data stored. -->
+    <ion-card class="core-warning-card" icon-start *ngIf="hasOffline">
+        <ion-icon name="warning"></ion-icon> {{ 'core.hasdatatosync' | translate:{$a: moduleName} }}
+    </ion-card>
+
     <!-- Offline disabled. -->
     <ion-card class="core-warning-card" icon-start *ngIf="!siteCanDownload && playing">
         <ion-icon name="warning"></ion-icon> {{ 'core.h5p.offlinedisabled' | translate }} {{ 'addon.mod_h5pactivity.offlinedisabledwarning' | translate }}

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

@@ -25,12 +25,14 @@ import { CoreH5P } from '@core/h5p/providers/h5p';
 import { CoreH5PDisplayOptions } from '@core/h5p/classes/core';
 import { CoreH5PHelper } from '@core/h5p/classes/helper';
 import { CoreXAPI } from '@core/xapi/providers/xapi';
+import { CoreXAPIOffline } from '@core/xapi/providers/offline';
 import { CoreConstants } from '@core/constants';
 import { CoreSite } from '@classes/site';
 
 import {
     AddonModH5PActivity, AddonModH5PActivityProvider, AddonModH5PActivityData, AddonModH5PActivityAccessInfo
 } from '../../providers/h5pactivity';
+import { AddonModH5PActivitySyncProvider, AddonModH5PActivitySync } from '../../providers/sync';
 
 /**
  * Component that displays an H5P activity entry page.
@@ -59,8 +61,11 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
     state: string; // State of the file.
     siteCanDownload: boolean;
     trackComponent: string; // Component for tracking.
+    hasOffline: boolean;
+    isOpeningPage: boolean;
 
     protected fetchContentDefaultError = 'addon.mod_h5pactivity.errorgetactivity';
+    protected syncEventName = AddonModH5PActivitySyncProvider.AUTO_SYNCED;
     protected site: CoreSite;
     protected observer;
     protected messageListenerFunction: (event: MessageEvent) => Promise<void>;
@@ -103,13 +108,18 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
      */
     protected async fetchContent(refresh: boolean = false, sync: boolean = false, showErrors: boolean = false): Promise<void> {
         try {
-            this.h5pActivity = await AddonModH5PActivity.instance.getH5PActivity(this.courseId, this.module.id);
+            this.h5pActivity = await AddonModH5PActivity.instance.getH5PActivity(this.courseId, this.module.id, false, this.siteId);
 
             this.dataRetrieved.emit(this.h5pActivity);
             this.description = this.h5pActivity.intro;
             this.displayOptions = CoreH5PHelper.decodeDisplayOptions(this.h5pActivity.displayoptions);
 
+            if (sync) {
+                await this.syncActivity(showErrors);
+            }
+
             await Promise.all([
+                this.checkHasOffline(),
                 this.fetchAccessInfo(),
                 this.fetchDeployedFileData(),
             ]);
@@ -136,13 +146,22 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
         }
     }
 
+    /**
+     * Fetch the access info and store it in the right variables.
+     *
+     * @return Promise resolved when done.
+     */
+    protected async checkHasOffline(): Promise<void> {
+        this.hasOffline = await CoreXAPIOffline.instance.contextHasStatements(this.h5pActivity.context, this.siteId);
+    }
+
     /**
      * Fetch the access info and store it in the right variables.
      *
      * @return Promise resolved when done.
      */
     protected async fetchAccessInfo(): Promise<void> {
-        this.accessInfo = await AddonModH5PActivity.instance.getAccessInformation(this.h5pActivity.id);
+        this.accessInfo = await AddonModH5PActivity.instance.getAccessInformation(this.h5pActivity.id, false, this.siteId);
     }
 
     /**
@@ -331,8 +350,17 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
     /**
      * Go to view user events.
      */
-    viewMyAttempts(): void {
-        this.navCtrl.push('AddonModH5PActivityUserAttemptsPage', {courseId: this.courseId, h5pActivityId: this.h5pActivity.id});
+    async viewMyAttempts(): Promise<void> {
+        this.isOpeningPage = true;
+
+        try {
+            await this.navCtrl.push('AddonModH5PActivityUserAttemptsPage', {
+                courseId: this.courseId,
+                h5pActivityId: this.h5pActivity.id,
+            });
+        } finally {
+            this.isOpeningPage = false;
+        }
     }
 
     /**
@@ -342,12 +370,31 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
      * @return Promise resolved when done.
      */
     protected async onIframeMessage(event: MessageEvent): Promise<void> {
-        if (!event.data || !CoreXAPI.instance.canPostStatementInSite(this.site) || !this.isCurrentXAPIPost(event.data)) {
+        if (!event.data || !CoreXAPI.instance.canPostStatementsInSite(this.site) || !this.isCurrentXAPIPost(event.data)) {
             return;
         }
 
         try {
-            await CoreXAPI.instance.postStatement(event.data.component, JSON.stringify(event.data.statements));
+            const options = {
+                offline: this.hasOffline,
+                courseId: this.courseId,
+                extra: this.h5pActivity.name,
+                siteId: this.site.getId(),
+            };
+
+            const sent = await CoreXAPI.instance.postStatements(this.h5pActivity.context, event.data.component,
+                    JSON.stringify(event.data.statements), options);
+
+            this.hasOffline = !sent;
+
+            if (sent) {
+                try {
+                    // Invalidate attempts.
+                    await AddonModH5PActivity.instance.invalidateUserAttempts(this.h5pActivity.id, undefined, this.siteId);
+                } catch (error) {
+                    // Ignore errors.
+                }
+            }
         } catch (error) {
             CoreDomUtils.instance.showErrorModalDefault(error, 'Error sending tracking data.');
         }
@@ -380,6 +427,39 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
         return match && match[1] == this.h5pActivity.context;
     }
 
+    /**
+     * Performs the sync of the activity.
+     *
+     * @return Promise resolved when done.
+     */
+    protected sync(): Promise<any> {
+        return AddonModH5PActivitySync.instance.syncActivity(this.h5pActivity.context, this.site.getId());
+    }
+
+    /**
+     * An autosync event has been received.
+     *
+     * @param syncEventData Data receiven on sync observer.
+     */
+    protected autoSyncEventReceived(syncEventData: any): void {
+        this.checkHasOffline();
+    }
+
+    /**
+     * Go to blog posts.
+     *
+     * @param event Event.
+     */
+    async gotoBlog(event: any): Promise<void> {
+        this.isOpeningPage = true;
+
+        try {
+            await super.gotoBlog(event);
+        } finally {
+            this.isOpeningPage = false;
+        }
+    }
+
     /**
      * Component destroyed.
      */

src/addon/mod/h5pactivity/h5pactivity.module.ts

@@ -14,20 +14,24 @@
 
 import { NgModule } from '@angular/core';
 
+import { CoreCronDelegate } from '@providers/cron';
 import { CoreContentLinksDelegate } from '@core/contentlinks/providers/delegate';
 import { CoreCourseModuleDelegate } from '@core/course/providers/module-delegate';
 import { CoreCourseModulePrefetchDelegate } from '@core/course/providers/module-prefetch-delegate';
 
 import { AddonModH5PActivityComponentsModule } from './components/components.module';
 import { AddonModH5PActivityModuleHandler } from './providers/module-handler';
 import { AddonModH5PActivityProvider } from './providers/h5pactivity';
+import { AddonModH5PActivitySyncProvider } from './providers/sync';
 import { AddonModH5PActivityPrefetchHandler } from './providers/prefetch-handler';
 import { AddonModH5PActivityIndexLinkHandler } from './providers/index-link-handler';
 import { AddonModH5PActivityReportLinkHandler } from './providers/report-link-handler';
+import { AddonModH5PActivitySyncCronHandler } from './providers/sync-cron-handler';
 
 // List of providers (without handlers).
 export const ADDON_MOD_H5P_ACTIVITY_PROVIDERS: any[] = [
     AddonModH5PActivityProvider,
+    AddonModH5PActivitySyncProvider,
 ];
 
 @NgModule({
@@ -38,10 +42,12 @@ export const ADDON_MOD_H5P_ACTIVITY_PROVIDERS: any[] = [
     ],
     providers: [
         AddonModH5PActivityProvider,
+        AddonModH5PActivitySyncProvider,
         AddonModH5PActivityModuleHandler,
         AddonModH5PActivityPrefetchHandler,
         AddonModH5PActivityIndexLinkHandler,
         AddonModH5PActivityReportLinkHandler,
+        AddonModH5PActivitySyncCronHandler,
     ]
 })
 export class AddonModH5PActivityModule {
@@ -51,11 +57,14 @@ export class AddonModH5PActivityModule {
             prefetchHandler: AddonModH5PActivityPrefetchHandler,
             linksDelegate: CoreContentLinksDelegate,
             indexHandler: AddonModH5PActivityIndexLinkHandler,
-            reportLinkHandler: AddonModH5PActivityReportLinkHandler) {
+            reportLinkHandler: AddonModH5PActivityReportLinkHandler,
+            cronDelegate: CoreCronDelegate,
+            syncHandler: AddonModH5PActivitySyncCronHandler) {
 
         moduleDelegate.registerHandler(moduleHandler);
         prefetchDelegate.registerHandler(prefetchHandler);
         linksDelegate.registerHandler(indexHandler);
         linksDelegate.registerHandler(reportLinkHandler);
+        cronDelegate.register(syncHandler);
     }
 }

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

@@ -56,7 +56,7 @@ export class AddonModH5PActivityIndexPage {
      * @return Resolved if we can leave it, rejected if not.
      */
     ionViewCanLeave(): Promise<void> {
-        if (!this.h5pComponent.playing) {
+        if (!this.h5pComponent.playing || this.h5pComponent.isOpeningPage) {
             return;
         }
 

src/addon/mod/h5pactivity/providers/h5pactivity.ts

@@ -385,6 +385,20 @@ export class AddonModH5PActivityProvider {
         return this.getH5PActivityByField(courseId, 'coursemodule', cmId, forceCache, siteId);
     }
 
+    /**
+     * Get an H5P activity by context ID.
+     *
+     * @param courseId Course ID.
+     * @param contextId Context ID.
+     * @param forceCache Whether it should always return cached data.
+     * @param siteId Site ID. If not defined, current site.
+     * @return Promise resolved with the activity data.
+     */
+    getH5PActivityByContextId(courseId: number, contextId: number, forceCache?: boolean, siteId?: string)
+            : Promise<AddonModH5PActivityData> {
+        return this.getH5PActivityByField(courseId, 'context', contextId, forceCache, siteId);
+    }
+
     /**
      * Get an H5P activity by instance ID.
      *

src/addon/mod/h5pactivity/providers/sync-cron-handler.ts

@@ -0,0 +1,46 @@
+// (C) Copyright 2015 Moodle Pty Ltd.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import { Injectable } from '@angular/core';
+import { CoreCronHandler } from '@providers/cron';
+import { AddonModH5PActivitySync } from './sync';
+
+/**
+ * Synchronization cron handler.
+ */
+@Injectable()
+export class AddonModH5PActivitySyncCronHandler implements CoreCronHandler {
+    name = 'AddonModH5PActivitySyncCronHandler';
+
+    /**
+     * Execute the process.
+     * Receives the ID of the site affected, undefined for all sites.
+     *
+     * @param siteId ID of the site affected, undefined for all sites.
+     * @param force Wether the execution is forced (manual sync).
+     * @return Promise resolved when done, rejected if failure.
+     */
+    execute(siteId?: string, force?: boolean): Promise<any> {
+        return AddonModH5PActivitySync.instance.syncAllActivities(siteId, force);
+    }
+
+    /**
+     * Get the time between consecutive executions.
+     *
+     * @return Time between consecutive executions (in ms).
+     */
+    getInterval(): number {
+        return AddonModH5PActivitySync.instance.syncInterval;
+    }
+}