MOBILE-2911 scorm: Move navigation to lateral
parent
c7529954e7
commit
0eda77d095
|
@ -20,12 +20,10 @@ import { CoreComponentsModule } from '@components/components.module';
|
|||
import { CoreDirectivesModule } from '@directives/directives.module';
|
||||
import { CoreCourseComponentsModule } from '@core/course/components/components.module';
|
||||
import { AddonModScormIndexComponent } from './index/index';
|
||||
import { AddonModScormTocPopoverComponent } from './toc-popover/toc-popover';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
AddonModScormIndexComponent,
|
||||
AddonModScormTocPopoverComponent
|
||||
AddonModScormIndexComponent
|
||||
],
|
||||
imports: [
|
||||
CommonModule,
|
||||
|
@ -38,12 +36,10 @@ import { AddonModScormTocPopoverComponent } from './toc-popover/toc-popover';
|
|||
providers: [
|
||||
],
|
||||
exports: [
|
||||
AddonModScormIndexComponent,
|
||||
AddonModScormTocPopoverComponent
|
||||
AddonModScormIndexComponent
|
||||
],
|
||||
entryComponents: [
|
||||
AddonModScormIndexComponent,
|
||||
AddonModScormTocPopoverComponent
|
||||
AddonModScormIndexComponent
|
||||
]
|
||||
})
|
||||
export class AddonModScormComponentsModule {}
|
||||
|
|
|
@ -1,19 +0,0 @@
|
|||
<ion-list>
|
||||
<ion-item text-wrap *ngIf="attemptToContinue">
|
||||
<p>{{ 'addon.mod_scorm.dataattemptshown' | translate:{number: attemptToContinue} }}</p>
|
||||
</ion-item>
|
||||
<ion-item text-center *ngIf="isBrowse">
|
||||
<p>{{ 'addon.mod_scorm.browsemode' | translate }}</p>
|
||||
</ion-item>
|
||||
<ion-item text-center *ngIf="isReview">
|
||||
<p>{{ 'addon.mod_scorm.reviewmode' | translate }}</p>
|
||||
</ion-item>
|
||||
|
||||
<!-- List of SCOs. -->
|
||||
<ng-container *ngFor="let sco of toc">
|
||||
<a *ngIf="sco.isvisible" ion-item text-wrap [ngClass]="['core-padding-' + sco.level]" (click)="loadSco(sco)" [attr.disabled]="!sco.prereq || !sco.launch ? true : null" detail-none>
|
||||
<img [src]="sco.image.url" [alt]="sco.image.description" />
|
||||
<span>{{ sco.title }}</span>
|
||||
</a>
|
||||
</ng-container>
|
||||
</ion-list>
|
|
@ -47,6 +47,7 @@
|
|||
"scormstatusnotdownloaded": "This SCORM package is not downloaded. It will be automatically downloaded when you open it.",
|
||||
"scormstatusoutdated": "This SCORM package has been modified since the last download. It will be automatically downloaded when you open it.",
|
||||
"suspended": "Suspended",
|
||||
"toc": "TOC",
|
||||
"warningofflinedatadeleted": "Some offline data from attempt {{number}} has been discarded because it couldn't be counted as a new attempt.",
|
||||
"warningsynconlineincomplete": "Some attempts couldn't be synchronised with the site because the last online attempt is not yet finished. Please finish the online attempt first."
|
||||
}
|
|
@ -3,7 +3,7 @@
|
|||
<ion-title><core-format-text [text]="title"></core-format-text></ion-title>
|
||||
|
||||
<ion-buttons end>
|
||||
<button *ngIf="showToc && !loadingToc && toc && toc.length" ion-button icon-only (click)="openToc($event)">
|
||||
<button *ngIf="showToc && !loadingToc && toc && toc.length" ion-button icon-only (click)="openToc($event)"[attr.aria-label]="'addon.mod_scorm.toc' | translate" aria-haspopup="true">
|
||||
<ion-icon name="bookmark"></ion-icon>
|
||||
</button>
|
||||
<ion-spinner *ngIf="showToc && loadingToc"></ion-spinner>
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
// limitations under the License.
|
||||
|
||||
import { Component, OnInit, OnDestroy } from '@angular/core';
|
||||
import { IonicPage, NavParams, PopoverController } from 'ionic-angular';
|
||||
import { IonicPage, NavParams, ModalController } from 'ionic-angular';
|
||||
import { CoreEventsProvider } from '@providers/events';
|
||||
import { CoreSitesProvider } from '@providers/sites';
|
||||
import { CoreSyncProvider } from '@providers/sync';
|
||||
|
@ -24,7 +24,6 @@ import { AddonModScormProvider, AddonModScormAttemptCountResult } from '../../pr
|
|||
import { AddonModScormHelperProvider } from '../../providers/helper';
|
||||
import { AddonModScormSyncProvider } from '../../providers/scorm-sync';
|
||||
import { AddonModScormDataModel12 } from '../../classes/data-model-12';
|
||||
import { AddonModScormTocPopoverComponent } from '../../components/toc-popover/toc-popover';
|
||||
|
||||
/**
|
||||
* Page that allows playing a SCORM.
|
||||
|
@ -65,7 +64,7 @@ export class AddonModScormPlayerPage implements OnInit, OnDestroy {
|
|||
protected launchPrevObserver: any;
|
||||
protected goOfflineObserver: any;
|
||||
|
||||
constructor(navParams: NavParams, protected popoverCtrl: PopoverController, protected eventsProvider: CoreEventsProvider,
|
||||
constructor(navParams: NavParams, protected modalCtrl: ModalController, protected eventsProvider: CoreEventsProvider,
|
||||
protected sitesProvider: CoreSitesProvider, protected syncProvider: CoreSyncProvider,
|
||||
protected domUtils: CoreDomUtilsProvider, protected timeUtils: CoreTimeUtilsProvider,
|
||||
protected scormProvider: AddonModScormProvider, protected scormHelper: AddonModScormHelperProvider,
|
||||
|
@ -382,20 +381,21 @@ export class AddonModScormPlayerPage implements OnInit, OnDestroy {
|
|||
* @param {MouseEvent} event Event.
|
||||
*/
|
||||
openToc(event: MouseEvent): void {
|
||||
const popover = this.popoverCtrl.create(AddonModScormTocPopoverComponent, {
|
||||
const modal = this.modalCtrl.create('AddonModScormTocPage', {
|
||||
toc: this.toc,
|
||||
attemptToContinue: this.attemptToContinue,
|
||||
mode: this.mode
|
||||
});
|
||||
mode: this.mode,
|
||||
selected: this.currentSco && this.currentSco.id
|
||||
}, { cssClass: 'core-modal-lateral' });
|
||||
|
||||
// If the popover sends back a SCO, load it.
|
||||
popover.onDidDismiss((sco) => {
|
||||
// If the modal sends back a SCO, load it.
|
||||
modal.onDidDismiss((sco) => {
|
||||
if (sco) {
|
||||
this.loadSco(sco);
|
||||
}
|
||||
});
|
||||
|
||||
popover.present({
|
||||
modal.present({
|
||||
ev: event
|
||||
});
|
||||
}
|
||||
|
|
|
@ -0,0 +1,33 @@
|
|||
<ion-header>
|
||||
<ion-navbar core-back-button>
|
||||
<ion-title>{{ 'addon.mod_scorm.toc' | translate }}</ion-title>
|
||||
<ion-buttons end>
|
||||
<button ion-button icon-only (click)="closeModal()" [attr.aria-label]="'core.close' | translate">
|
||||
<ion-icon name="close"></ion-icon>
|
||||
</button>
|
||||
</ion-buttons>
|
||||
</ion-navbar>
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
<nav>
|
||||
<ion-list>
|
||||
<ion-item text-wrap *ngIf="attemptToContinue">
|
||||
<p>{{ 'addon.mod_scorm.dataattemptshown' | translate:{number: attemptToContinue} }}</p>
|
||||
</ion-item>
|
||||
<ion-item text-center *ngIf="isBrowse">
|
||||
<p>{{ 'addon.mod_scorm.browsemode' | translate }}</p>
|
||||
</ion-item>
|
||||
<ion-item text-center *ngIf="isReview">
|
||||
<p>{{ 'addon.mod_scorm.reviewmode' | translate }}</p>
|
||||
</ion-item>
|
||||
|
||||
<!-- List of SCOs. -->
|
||||
<ng-container *ngFor="let sco of toc">
|
||||
<a *ngIf="sco.isvisible" ion-item text-wrap [ngClass]="'core-padding-' + sco.level" [class.core-nav-item-selected]="selected == sco.id" (click)="loadSco(sco)" [attr.disabled]="!sco.prereq || !sco.launch ? true : null" [attr.detail-none]="!sco.prereq || !sco.launch ? true : null">
|
||||
<img [src]="sco.image.url" [alt]="sco.image.description" />
|
||||
<span>{{ sco.title }}</span>
|
||||
</a>
|
||||
</ng-container>
|
||||
</ion-list>
|
||||
</nav>
|
||||
</ion-content>
|
|
@ -0,0 +1,31 @@
|
|||
// (C) Copyright 2015 Martin Dougiamas
|
||||
//
|
||||
// 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 { NgModule } from '@angular/core';
|
||||
import { IonicPageModule } from 'ionic-angular';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { CoreDirectivesModule } from '@directives/directives.module';
|
||||
import { AddonModScormTocPage } from './toc';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
AddonModScormTocPage,
|
||||
],
|
||||
imports: [
|
||||
CoreDirectivesModule,
|
||||
IonicPageModule.forChild(AddonModScormTocPage),
|
||||
TranslateModule.forChild()
|
||||
],
|
||||
})
|
||||
export class AddonModScormTocPageModule {}
|
|
@ -13,27 +13,30 @@
|
|||
// limitations under the License.
|
||||
|
||||
import { Component } from '@angular/core';
|
||||
import { NavParams, ViewController } from 'ionic-angular';
|
||||
import { IonicPage, NavParams, ViewController } from 'ionic-angular';
|
||||
import { AddonModScormProvider } from '../../providers/scorm';
|
||||
|
||||
/**
|
||||
* Component to display the TOC of a SCORM.
|
||||
* Modal to display the TOC of a SCORM.
|
||||
*/
|
||||
@IonicPage({ segment: 'addon-mod-scorm-toc-modal' })
|
||||
@Component({
|
||||
selector: 'addon-mod-scorm-toc-popover',
|
||||
templateUrl: 'addon-mod-scorm-toc-popover.html'
|
||||
selector: 'page-addon-mod-scorm-toc',
|
||||
templateUrl: 'toc.html'
|
||||
})
|
||||
export class AddonModScormTocPopoverComponent {
|
||||
export class AddonModScormTocPage {
|
||||
toc: any[];
|
||||
isBrowse: boolean;
|
||||
isReview: boolean;
|
||||
attemptToContinue: number;
|
||||
selected: number;
|
||||
|
||||
constructor(navParams: NavParams, private viewCtrl: ViewController) {
|
||||
this.toc = navParams.get('toc') || [];
|
||||
this.attemptToContinue = navParams.get('attemptToContinue');
|
||||
|
||||
const mode = navParams.get('mode');
|
||||
this.selected = navParams.get('selected');
|
||||
|
||||
this.isBrowse = mode === AddonModScormProvider.MODEBROWSE;
|
||||
this.isReview = mode === AddonModScormProvider.MODEREVIEW;
|
||||
|
@ -51,4 +54,11 @@ export class AddonModScormTocPopoverComponent {
|
|||
|
||||
this.viewCtrl.dismiss(sco);
|
||||
}
|
||||
|
||||
/**
|
||||
* Close modal.
|
||||
*/
|
||||
closeModal(): void {
|
||||
this.viewCtrl.dismiss();
|
||||
}
|
||||
}
|
|
@ -753,6 +753,7 @@
|
|||
"addon.mod_scorm.scormstatusnotdownloaded": "This SCORM package is not downloaded. It will be automatically downloaded when you open it.",
|
||||
"addon.mod_scorm.scormstatusoutdated": "This SCORM package has been modified since the last download. It will be automatically downloaded when you open it.",
|
||||
"addon.mod_scorm.suspended": "Suspended",
|
||||
"addon.mod_scorm.toc": "TOC",
|
||||
"addon.mod_scorm.warningofflinedatadeleted": "Some offline data from attempt {{number}} has been discarded because it couldn't be counted as a new attempt.",
|
||||
"addon.mod_scorm.warningsynconlineincomplete": "Some attempts couldn't be synchronised with the site because the last online attempt is not yet finished. Please finish the online attempt first.",
|
||||
"addon.mod_survey.cannotsubmitsurvey": "Sorry, there was a problem submitting your survey. Please try again.",
|
||||
|
|
Loading…
Reference in New Issue