EVOgeek
/
Vmeda.Online
1
0
Fork 1
Code Issues Pull Requests Packages Projects Releases Wiki Activity

MOBILE-3411 h5pactivity: Play package in activity

main
Dani Palou 2020-05-27 11:08:26 +02:00
parent 0196a738d7
commit a8e336fd41
14 changed files with 311 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/addon/mod/h5pactivity/components/components.module.ts
View File

@ -19,6 +19,7 @@ import { TranslateModule } from '@ngx-translate/core';
import { CoreComponentsModule } from '@components/components.module';
import { CoreDirectivesModule } from '@directives/directives.module';
import { CoreCourseComponentsModule } from '@core/course/components/components.module';
import { CoreH5PComponentsModule } from '@core/h5p/components/components.module';
import { AddonModH5PActivityIndexComponent } from './index/index';
@NgModule({
@ -31,7 +32,8 @@ import { AddonModH5PActivityIndexComponent } from './index/index';
TranslateModule.forChild(),
CoreComponentsModule,
CoreDirectivesModule,
CoreCourseComponentsModule
CoreCourseComponentsModule,
CoreH5PComponentsModule,
],
providers: [
],

7
src/addon/mod/h5pactivity/components/index/addon-mod-h5pactivity-index.html
View File

@ -13,6 +13,11 @@
<core-course-module-description [description]="description" [component]="component" [componentId]="componentId" contextLevel="module" [contextInstanceId]="module.id" [courseId]="courseId"></core-course-module-description>
<!-- 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 }}
</ion-card>
<ion-list *ngIf="deployedFile && !playing">
<ion-item text-wrap *ngIf="stateMessage">
<p >{{ stateMessage | translate }}</p>
@ -30,4 +35,6 @@
<p *ngIf="percentage <= 100">{{ 'core.percentagenumber' | translate:{$a: percentage} }}</p>
</ion-item>
</ion-list>
<core-h5p-iframe *ngIf="playing" [fileUrl]="fileUrl" [displayOptions]="displayOptions" [onlinePlayerUrl]="onlinePlayerUrl"></core-h5p-iframe>
</core-loading>

69
src/addon/mod/h5pactivity/components/index/index.ts
View File

@ -16,6 +16,7 @@ import { Component, Optional, Injector } from '@angular/core';
import { Content } from 'ionic-angular';
import { CoreApp } from '@providers/app';
import { CoreEvents } from '@providers/events';
import { CoreFilepool } from '@providers/filepool';
import { CoreWSExternalFile } from '@providers/ws';
import { CoreDomUtils } from '@providers/utils/dom';
@ -24,6 +25,7 @@ import { CoreH5P } from '@core/h5p/providers/h5p';
import { CoreH5PDisplayOptions } from '@core/h5p/classes/core';
import { CoreH5PHelper } from '@core/h5p/classes/helper';
import { CoreConstants } from '@core/constants';
import { CoreSite } from '@classes/site';
import {
AddonModH5PActivity, AddonModH5PActivityProvider, AddonModH5PActivityData, AddonModH5PActivityAccessInfo
@ -50,13 +52,22 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
percentage: string; // Download/unzip percentage.
progressMessage: string; // Message about download/unzip.
playing: boolean; // Whether the package is being played.
displayOptions: CoreH5PDisplayOptions; // Display options for the package.
onlinePlayerUrl: string; // URL to play the package in online.
fileUrl: string; // The fileUrl to use to play the package.
state: string; // State of the file.
siteCanDownload: boolean;
protected fetchContentDefaultError = 'addon.mod_h5pactivity.errorgetactivity';
protected displayOptions: CoreH5PDisplayOptions;
protected site: CoreSite;
protected observer;
constructor(injector: Injector,
@Optional() protected content: Content) {
super(injector, content);
this.site = this.sitesProvider.getCurrentSite();
this.siteCanDownload = this.site.canDownloadFiles() && !CoreH5P.instance.isOfflineDisabledInSite();
}
/**
@ -87,14 +98,25 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
try {
this.h5pActivity = await AddonModH5PActivity.instance.getH5PActivity(this.courseId, this.module.id);
this.dataRetrieved.emit(this.h5pActivity);
this.description = this.h5pActivity.intro;
this.displayOptions = CoreH5PHelper.decodeDisplayOptions(this.h5pActivity.displayoptions);
this.dataRetrieved.emit(this.h5pActivity);
if (this.h5pActivity.package && this.h5pActivity.package[0]) {
// The online player should use the original file, not the trusted one.
this.onlinePlayerUrl = CoreH5P.instance.h5pPlayer.calculateOnlinePlayerUrl(
this.site.getURL(), this.h5pActivity.package[0].fileurl, this.displayOptions);
}
await Promise.all([
this.fetchAccessInfo(),
this.fetchDeployedFileData(),
]);
if (!this.siteCanDownload || this.state == CoreConstants.DOWNLOADED) {
// Cannot download the file or already downloaded, play the package directly.
this.play();
}
} finally {
this.fillContextMenu(refresh);
}
@ -115,6 +137,11 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
* @return Promise resolved when done.
*/
protected async fetchDeployedFileData(): Promise<void> {
if (!this.siteCanDownload) {
// Cannot download the file, no need to fetch the file data.
return;
}
if (this.h5pActivity.deployedfile) {
// File already deployed and still valid, use this one.
this.deployedFile = this.h5pActivity.deployedfile;
@ -128,19 +155,30 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
this.deployedFile = await CoreH5P.instance.getTrustedH5PFile(this.h5pActivity.package[0].fileurl, this.displayOptions);
}
await this.calculateFileStatus();
this.fileUrl = this.deployedFile.fileurl;
// Listen for changes in the state.
const eventName = await CoreFilepool.instance.getFileEventNameByUrl(this.siteId, this.deployedFile.fileurl);
if (!this.observer) {
this.observer = CoreEvents.instance.on(eventName, () => {
this.calculateFileState();
});
}
await this.calculateFileState();
}
/**
* Calculate the status of the deployed file.
* Calculate the state of the deployed file.
*
* @return Promise resolved when done.
*/
protected async calculateFileStatus(): Promise<void> {
const state = await CoreFilepool.instance.getFileStateByUrl(this.siteId, this.deployedFile.fileurl,
protected async calculateFileState(): Promise<void> {
this.state = await CoreFilepool.instance.getFileStateByUrl(this.siteId, this.deployedFile.fileurl,
this.deployedFile.timemodified);
this.showFileState(state);
this.showFileState();
}
/**
@ -154,18 +192,16 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
/**
* Displays some data based on the state of the main file.
*
* @param state The state of the file.
*/
protected showFileState(state: string): void {
protected showFileState(): void {
if (state == CoreConstants.OUTDATED) {
if (this.state == CoreConstants.OUTDATED) {
this.stateMessage = 'addon.mod_h5pactivity.filestateoutdated';
this.needsDownload = true;
} else if (state == CoreConstants.NOT_DOWNLOADED) {
} else if (this.state == CoreConstants.NOT_DOWNLOADED) {
this.stateMessage = 'addon.mod_h5pactivity.filestatenotdownloaded';
this.needsDownload = true;
} else if (state == CoreConstants.DOWNLOADING) {
} else if (this.state == CoreConstants.DOWNLOADING) {
this.stateMessage = '';
if (!this.downloading) {
@ -264,7 +300,12 @@ export class AddonModH5PActivityIndexComponent extends CoreCourseModuleMainActiv
*/
play(): void {
this.playing = true;
}
// @TODO
/**
* Component destroyed.
*/
ngOnDestroy(): void {
this.observer && this.observer.off();
}
}

1
src/addon/mod/h5pactivity/lang/en.json
View File

@ -3,5 +3,6 @@
"filestatenotdownloaded": "The H5P package is not downloaded. You need to download it to be able to use it.",
"filestateoutdated": "The H5P package has been modified since the last download. You need to download it again to be able to use it.",
"modulenameplural": "H5P",
"offlinedisabledwarning": "You will need to be online to view the H5P package.",
"storingfiles": "Storing files"
}

1
src/assets/lang/en.json
View File

@ -663,6 +663,7 @@
"addon.mod_h5pactivity.filestatenotdownloaded": "The H5P package is not downloaded. You need to download it to be able to use it.",
"addon.mod_h5pactivity.filestateoutdated": "The H5P package has been modified since the last download. You need to download it again to be able to use it.",
"addon.mod_h5pactivity.modulenameplural": "H5P",
"addon.mod_h5pactivity.offlinedisabledwarning": "You will need to be online to view the H5P package.",
"addon.mod_h5pactivity.storingfiles": "Storing files",
"addon.mod_imscp.deploymenterror": "Content package error!",
"addon.mod_imscp.modulenameplural": "IMS content packages",

2
src/core/h5p/classes/file-storage.ts
View File

@ -222,7 +222,7 @@ export class CoreH5PFileStorage {
await Array.from(result.rows).map(async (entry: {foldername: string}) => {
try {
// Delete the index.html.
await CoreFile.instance.removeFile(this.getContentIndexPath(entry.foldername, site.getId()));
await this.deleteContentIndex(entry.foldername, site.getId());
} catch (error) {
// Ignore errors.
}

6
src/core/h5p/classes/helper.ts
View File

@ -36,11 +36,11 @@ export class CoreH5PHelper {
const config: any = {};
const displayOptionsObject = CoreH5P.instance.h5pCore.getDisplayOptionsAsObject(displayOptions);
config.export = 0; // Don't allow downloading in the app.
config.export = false; // Don't allow downloading in the app.
config.embed = CoreUtils.instance.notNullOrUndefined(displayOptionsObject[CoreH5PCore.DISPLAY_OPTION_EMBED]) ?
displayOptionsObject[CoreH5PCore.DISPLAY_OPTION_EMBED] : 0;
displayOptionsObject[CoreH5PCore.DISPLAY_OPTION_EMBED] : false;
config.copyright = CoreUtils.instance.notNullOrUndefined(displayOptionsObject[CoreH5PCore.DISPLAY_OPTION_COPYRIGHT]) ?
displayOptionsObject[CoreH5PCore.DISPLAY_OPTION_COPYRIGHT] : 0;
displayOptionsObject[CoreH5PCore.DISPLAY_OPTION_COPYRIGHT] : false;
return config;
}

40
src/core/h5p/classes/player.ts
View File

@ -30,6 +30,25 @@ export class CoreH5PPlayer {
constructor(protected h5pCore: CoreH5PCore,
protected h5pStorage: CoreH5PStorage) { }
/**
* Calculate the URL to the site H5P player.
*
* @param siteUrl Site URL.
* @param fileUrl File URL.
* @param displayOptions Display options.
* @param component Component to send xAPI events to.
* @return URL.
*/
calculateOnlinePlayerUrl(siteUrl: string, fileUrl: string, displayOptions?: CoreH5PDisplayOptions, component?: string): string {
const params = this.getUrlParamsFromDisplayOptions(displayOptions);
params.url = fileUrl;
if (component) {
params.component = component;
}
return CoreUrlUtils.instance.addParamsToUrl(CoreTextUtils.instance.concatenatePaths(siteUrl, '/h5p/embed.php'), params);
}
/**
* Create the index.html to render an H5P package.
* Part of the code of this function is equivalent to Moodle's add_assets_to_page function.
@ -323,4 +342,25 @@ export class CoreH5PPlayer {
getResizerScriptUrl(): string {
return CoreTextUtils.instance.concatenatePaths(this.h5pCore.h5pFS.getCoreH5PPath(), 'js/h5p-resizer.js');
}
/**
* Get online player URL params from display options.
*
* @param options Display options.
* @return Object with URL params.
*/
getUrlParamsFromDisplayOptions(options: CoreH5PDisplayOptions): {[name: string]: string} {
const params: {[name: string]: string} = {};
if (!options) {
return params;
}
params[CoreH5PCore.DISPLAY_OPTION_FRAME] = options[CoreH5PCore.DISPLAY_OPTION_FRAME] ? '1' : '0';
params[CoreH5PCore.DISPLAY_OPTION_DOWNLOAD] = options[CoreH5PCore.DISPLAY_OPTION_DOWNLOAD] ? '1' : '0';
params[CoreH5PCore.DISPLAY_OPTION_EMBED] = options[CoreH5PCore.DISPLAY_OPTION_EMBED] ? '1' : '0';
params[CoreH5PCore.DISPLAY_OPTION_COPYRIGHT] = options[CoreH5PCore.DISPLAY_OPTION_COPYRIGHT] ? '1' : '0';
return params;
}
}

4
src/core/h5p/classes/storage.ts
View File

@ -62,7 +62,9 @@ export class CoreH5PStorage {
// Library already installed.
libraryData.libraryId = dbData.id;
if (!this.h5pFramework.isPatchedLibrary(libraryData, dbData)) {
const isNewPatch = await this.h5pFramework.isPatchedLibrary(libraryData, dbData);
if (!isNewPatch) {
// Same or older version, no need to save.
libraryData.saveDependencies = false;

12
src/core/h5p/components/components.module.ts
View File

@ -17,12 +17,14 @@ import { CommonModule } from '@angular/common';
import { IonicModule } from 'ionic-angular';
import { TranslateModule } from '@ngx-translate/core';
import { CoreDirectivesModule } from '@directives/directives.module';
import { CoreH5PPlayerComponent } from './h5p-player/h5p-player';
import { CoreComponentsModule } from '@components/components.module';
import { CoreH5PPlayerComponent } from './h5p-player/h5p-player';
import { CoreH5PIframeComponent } from './h5p-iframe/h5p-iframe';
@NgModule({
declarations: [
CoreH5PPlayerComponent
CoreH5PPlayerComponent,
CoreH5PIframeComponent,
],
imports: [
CommonModule,
@ -34,10 +36,12 @@ import { CoreComponentsModule } from '@components/components.module';
providers: [
],
exports: [
CoreH5PPlayerComponent
CoreH5PPlayerComponent,
CoreH5PIframeComponent,
],
entryComponents: [
CoreH5PPlayerComponent
CoreH5PPlayerComponent,
CoreH5PIframeComponent,
]
})
export class CoreH5PComponentsModule {}

4
src/core/h5p/components/h5p-iframe/core-h5p-iframe.html 100644
View File

@ -0,0 +1,4 @@
<core-loading [hideUntil]="iframeSrc" class="core-loading-center safe-area-page">
<core-iframe *ngIf="iframeSrc" [src]="iframeSrc" iframeHeight="auto" [allowFullscreen]="true" (loaded)="iframeLoaded()"></core-iframe>
<script *ngIf="resizeScript && iframeSrc" type="text/javascript" [src]="resizeScript"></script>
</core-loading>

173
src/core/h5p/components/h5p-iframe/h5p-iframe.ts 100644
View File

@ -0,0 +1,173 @@
// (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 { Component, Input, Output, ElementRef, OnChanges, SimpleChange, EventEmitter } from '@angular/core';
import { CoreFile } from '@providers/file';
import { CoreFilepool } from '@providers/filepool';
import { CoreLogger } from '@providers/logger';
import { CoreSites } from '@providers/sites';
import { CoreDomUtils } from '@providers/utils/dom';
import { CoreUrlUtils } from '@providers/utils/url';
import { CoreH5P } from '@core/h5p/providers/h5p';
import { CorePluginFileDelegate } from '@providers/plugin-file-delegate';
import { CoreFileHelper } from '@providers/file-helper';
import { CoreConstants } from '@core/constants';
import { CoreSite } from '@classes/site';
import { CoreH5PCore, CoreH5PDisplayOptions } from '../../classes/core';
import { CoreH5PHelper } from '../../classes/helper';
/**
* Component to render an iframe with an H5P package.
*/
@Component({
selector: 'core-h5p-iframe',
templateUrl: 'core-h5p-iframe.html',
})
export class CoreH5PIframeComponent implements OnChanges {
@Input() fileUrl?: string; // The URL of the H5P file. If not supplied, onlinePlayerUrl is required.
@Input() displayOptions?: CoreH5PDisplayOptions; // Display options.
@Input() onlinePlayerUrl?: string; // The URL of the online player to display the H5P package.
@Output() onIframeUrlSet = new EventEmitter<{src: string, online: boolean}>();
@Output() onIframeLoaded = new EventEmitter<void>();
iframeSrc: string;
protected site: CoreSite;
protected siteId: string;
protected siteCanDownload: boolean;
protected logger;
constructor(public elementRef: ElementRef,
protected pluginFileDelegate: CorePluginFileDelegate) {
this.logger = CoreLogger.instance.getInstance('CoreH5PIframeComponent');
this.site = CoreSites.instance.getCurrentSite();
this.siteId = this.site.getId();
this.siteCanDownload = this.site.canDownloadFiles() && !CoreH5P.instance.isOfflineDisabledInSite();
}
/**
* Detect changes on input properties.
*/
ngOnChanges(changes: {[name: string]: SimpleChange}): void {
// If it's already playing don't change it.
if ((changes.fileUrl || changes.onlinePlayerUrl) && !this.iframeSrc) {
this.play();
}
}
/**
* Play the H5P.
*
* @return Promise resolved when done.
*/
protected async play(): Promise<void> {
let localUrl: string;
let state: string;
if (this.fileUrl) {
state = await CoreFilepool.instance.getFileStateByUrl(this.siteId, this.fileUrl);
} else {
state = CoreConstants.NOT_DOWNLOADABLE;
}
if (this.siteCanDownload && CoreFileHelper.instance.isStateDownloaded(state)) {
// Package is downloaded, use the local URL.
localUrl = await this.getLocalUrl();
}
try {
if (localUrl) {
// Local package.
this.iframeSrc = localUrl;
} else {
this.onlinePlayerUrl = this.onlinePlayerUrl || CoreH5P.instance.h5pPlayer.calculateOnlinePlayerUrl(
this.site.getURL(), this.fileUrl, this.displayOptions);
// Never allow downloading in the app. This will only work if the user is allowed to change the params.
const src = this.onlinePlayerUrl.replace(CoreH5PCore.DISPLAY_OPTION_DOWNLOAD + '=1',
CoreH5PCore.DISPLAY_OPTION_DOWNLOAD + '=0');
// Get auto-login URL so the user is automatically authenticated.
const url = await CoreSites.instance.getCurrentSite().getAutoLoginUrl(src, false);
// Add the preventredirect param so the user can authenticate.
this.iframeSrc = CoreUrlUtils.instance.addParamsToUrl(url, {preventredirect: false});
}
} catch (error) {
CoreDomUtils.instance.showErrorModalDefault(error, 'Error loading H5P package.', true);
} finally {
this.addResizerScript();
this.onIframeUrlSet.emit({src: this.iframeSrc, online: !!localUrl});
}
}
/**
* Get the local URL of the package.
*
* @return Promise resolved with the local URL.
*/
protected async getLocalUrl(): Promise<string> {
try {
const url = await CoreH5P.instance.h5pPlayer.getContentIndexFileUrl(this.fileUrl, this.displayOptions, this.siteId);
return url;
} catch (error) {
// Index file doesn't exist, probably deleted because a lib was updated. Try to create it again.
try {
const path = await CoreFilepool.instance.getInternalUrlByUrl(this.siteId, this.fileUrl);
const file = await CoreFile.instance.getFile(path);
await CoreH5PHelper.saveH5P(this.fileUrl, file, this.siteId);
// File treated. Try to get the index file URL again.
const url = await CoreH5P.instance.h5pPlayer.getContentIndexFileUrl(this.fileUrl, this.displayOptions,
this.siteId);
return url;
} catch (error) {
// Still failing. Delete the H5P package?
this.logger.error('Error loading downloaded index:', error, this.fileUrl);
}
}
}
/**
* Add the resizer script if it hasn't been added already.
*/
protected addResizerScript(): void {
if (document.head.querySelector('#core-h5p-resizer-script') != null) {
// Script already added, don't add it again.
return;
}
const script = document.createElement('script');
script.id = 'core-h5p-resizer-script';
script.type = 'text/javascript';
script.src = CoreH5P.instance.h5pPlayer.getResizerScriptUrl();
document.head.appendChild(script);
}
/**
* H5P iframe has been loaded.
*/
iframeLoaded(): void {
this.onIframeLoaded.emit();
// Send a resize event to the window so H5P package recalculates the size.
window.dispatchEvent(new Event('resize'));
}
}

8
src/core/h5p/components/h5p-player/core-h5p-player.html
View File

@ -1,13 +1,11 @@
<div *ngIf="!showPackage" class="core-h5p-placeholder">
<button *ngIf="!loading" class="core-h5p-placeholder-play-button" ion-button icon-only clear (click)="play($event)">
<button class="core-h5p-placeholder-play-button" ion-button icon-only clear (click)="play($event)">
<core-icon name="fa-play-circle"></core-icon>
</button>
<ion-spinner *ngIf="loading" class="core-h5p-placeholder-spinner"></ion-spinner>
<div class="core-h5p-placeholder-download-container">
<core-download-refresh [status]="state" [enabled]="canDownload" [loading]="calculating" [canTrustDownload]="true" (action)="download()"></core-download-refresh>
</div>
</div>
<core-iframe *ngIf="showPackage" [src]="playerSrc" iframeHeight="auto" [allowFullscreen]="true" (loaded)="iframeLoaded()"></core-iframe>
<script *ngIf="resizeScript && showPackage" type="text/javascript" [src]="resizeScript"></script>
<core-h5p-iframe *ngIf="showPackage" [fileUrl]="urlParams.url" [displayOptions]="displayOptions" [onlinePlayerUrl]="src"></core-h5p-iframe>

93
src/core/h5p/components/h5p-player/h5p-player.ts
View File

@ -15,7 +15,6 @@
import { Component, Input, ElementRef, OnInit, OnDestroy, OnChanges, SimpleChange } from '@angular/core';
import { CoreApp } from '@providers/app';
import { CoreEvents } from '@providers/events';
import { CoreFile } from '@providers/file';
import { CoreFilepool } from '@providers/filepool';
import { CoreLogger } from '@providers/logger';
import { CoreSites } from '@providers/sites';
@ -23,11 +22,9 @@ import { CoreDomUtils } from '@providers/utils/dom';
import { CoreUrlUtils } from '@providers/utils/url';
import { CoreH5P } from '@core/h5p/providers/h5p';
import { CorePluginFileDelegate } from '@providers/plugin-file-delegate';
import { CoreFileHelper } from '@providers/file-helper';
import { CoreConstants } from '@core/constants';
import { CoreSite } from '@classes/site';
import { CoreH5PCore } from '../../classes/core';
import { CoreH5PHelper } from '../../classes/helper';
import { CoreH5PDisplayOptions } from '../../classes/core';
/**
* Component to render an H5P package.
@ -41,18 +38,17 @@ export class CoreH5PPlayerComponent implements OnInit, OnChanges, OnDestroy {
@Input() component?: string; // Component.
@Input() componentId?: string | number; // Component ID to use in conjunction with the component.
playerSrc: string;
showPackage = false;
loading = false;
state: string;
canDownload: boolean;
calculating = true;
displayOptions: CoreH5PDisplayOptions;
urlParams: {[name: string]: string};
protected site: CoreSite;
protected siteId: string;
protected siteCanDownload: boolean;
protected observer;
protected urlParams;
protected logger;
constructor(public elementRef: ElementRef,
@ -90,62 +86,15 @@ export class CoreH5PPlayerComponent implements OnInit, OnChanges, OnDestroy {
e.preventDefault();
e.stopPropagation();
this.loading = true;
this.displayOptions = CoreH5P.instance.h5pPlayer.getDisplayOptionsFromUrlParams(this.urlParams);
this.showPackage = true;
let localUrl: string;
const displayOptions = CoreH5P.instance.h5pPlayer.getDisplayOptionsFromUrlParams(this.urlParams);
if (this.canDownload && CoreFileHelper.instance.isStateDownloaded(this.state)) {
// Package is downloaded, use the local URL.
if (this.canDownload && (this.state == CoreConstants.OUTDATED || this.state == CoreConstants.NOT_DOWNLOADED)) {
// Download the package in background if the size is low.
try {
localUrl = await CoreH5P.instance.h5pPlayer.getContentIndexFileUrl(this.urlParams.url, displayOptions, this.siteId);
this.attemptDownloadInBg();
} catch (error) {
// Index file doesn't exist, probably deleted because a lib was updated. Try to create it again.
try {
const path = await CoreFilepool.instance.getInternalUrlByUrl(this.siteId, this.urlParams.url);
const file = await CoreFile.instance.getFile(path);
await CoreH5PHelper.saveH5P(this.urlParams.url, file, this.siteId);
// File treated. Try to get the index file URL again.
localUrl = await CoreH5P.instance.h5pPlayer.getContentIndexFileUrl(this.urlParams.url, displayOptions,
this.siteId);
} catch (error) {
// Still failing. Delete the H5P package?
this.logger.error('Error loading downloaded index:', error, this.src);
}
}
}
try {
if (localUrl) {
// Local package.
this.playerSrc = localUrl;
} else {
// Never allow downloading in the app. This will only work if the user is allowed to change the params.
const src = this.src && this.src.replace(CoreH5PCore.DISPLAY_OPTION_DOWNLOAD + '=1',
CoreH5PCore.DISPLAY_OPTION_DOWNLOAD + '=0');
// Get auto-login URL so the user is automatically authenticated.
const url = await CoreSites.instance.getCurrentSite().getAutoLoginUrl(src, false);
// Add the preventredirect param so the user can authenticate.
this.playerSrc = CoreUrlUtils.instance.addParamsToUrl(url, {preventredirect: false});
}
} finally {
this.addResizerScript();
this.loading = false;
this.showPackage = true;
if (this.canDownload && (this.state == CoreConstants.OUTDATED || this.state == CoreConstants.NOT_DOWNLOADED)) {
// Download the package in background if the size is low.
try {
this.attemptDownloadInBg();
} catch (error) {
this.logger.error('Error downloading H5P in background', error);
}
this.logger.error('Error downloading H5P in background', error);
}
}
}
@ -204,22 +153,6 @@ export class CoreH5PPlayerComponent implements OnInit, OnChanges, OnDestroy {
}
}
/**
* Add the resizer script if it hasn't been added already.
*/
protected addResizerScript(): void {
if (document.head.querySelector('#core-h5p-resizer-script') != null) {
// Script already added, don't add it again.
return;
}
const script = document.createElement('script');
script.id = 'core-h5p-resizer-script';
script.type = 'text/javascript';
script.src = CoreH5P.instance.h5pPlayer.getResizerScriptUrl();
document.head.appendChild(script);
}
/**
* Check if the package can be downloaded.
*
@ -273,14 +206,6 @@ export class CoreH5PPlayerComponent implements OnInit, OnChanges, OnDestroy {
}
}
/**
* H5P iframe has been loaded.
*/
iframeLoaded(): void {
// Send a resize event to the window so H5P package recalculates the size.
window.dispatchEvent(new Event('resize'));
}
/**
* Component destroyed.
*/