Merge pull request #1858 from albertgasset/MOBILE-2949

Mobile 2949
main
Juan Leyva 2019-04-29 18:03:27 +02:00 committed by GitHub
commit 9892a17849
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 72 additions and 22 deletions

View File

@ -4,10 +4,10 @@
</ion-navbar>
</ion-header>
<ion-content>
<ion-refresher [enabled]="entryLoaded" (ionRefresh)="refreshDatabase($event)">
<ion-refresher [enabled]="entryLoaded && (isPullingToRefresh || !renderingEntry && !loadingRating && !loadingComments)" (ionRefresh)="refreshDatabase($event)">
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
</ion-refresher>
<core-loading [hideUntil]="entryLoaded">
<core-loading [hideUntil]="entryLoaded && (isPullingToRefresh || !renderingEntry && !loadingRating && !loadingComments)">
<!-- Database entries found to be synchronized -->
<div class="core-warning-card" icon-start *ngIf="hasOffline">
<ion-icon name="warning"></ion-icon>
@ -25,14 +25,14 @@
<div class="addon-data-contents addon-data-entries-{{data.id}}" *ngIf="entry">
<core-style [css]="data.csstemplate" prefix=".addon-data-entries-{{data.id}}"></core-style>
<core-compile-html [text]="entryRendered" [jsData]="jsData" [extraImports]="extraImports"></core-compile-html>
<core-compile-html [text]="entryHtml" [jsData]="jsData" [extraImports]="extraImports" (compiling)="setRenderingEntry($event)"></core-compile-html>
</div>
<core-rating-rate *ngIf="data && entry && ratingInfo && (!data.approval || entry.approved)" [ratingInfo]="ratingInfo" contextLevel="module" [instanceId]="data.coursemodule" [itemId]="entry.id" [itemSetId]="0" [courseId]="courseId" [aggregateMethod]="data.assessed" [scaleId]="data.scale" [userId]="entry.userid" (onUpdate)="ratingUpdated()"></core-rating-rate>
<core-rating-rate *ngIf="data && entry && ratingInfo && (!data.approval || entry.approved)" [ratingInfo]="ratingInfo" contextLevel="module" [instanceId]="data.coursemodule" [itemId]="entry.id" [itemSetId]="0" [courseId]="courseId" [aggregateMethod]="data.assessed" [scaleId]="data.scale" [userId]="entry.userid" (onLoading)="setLoadingRating($event)" (onUpdate)="ratingUpdated()"></core-rating-rate>
<core-rating-aggregate *ngIf="data && entry && ratingInfo" [ratingInfo]="ratingInfo" contextLevel="module" [instanceId]="data.coursemodule" [itemId]="entry.id" [courseId]="courseId" [aggregateMethod]="data.assessed" [scaleId]="data.scale"></core-rating-aggregate>
<ion-item *ngIf="data && entry">
<core-comments contextLevel="module" [instanceId]="data.coursemodule" component="mod_data" [itemId]="entry.id" area="database_entry"></core-comments>
<core-comments contextLevel="module" [instanceId]="data.coursemodule" component="mod_data" [itemId]="entry.id" area="database_entry" [displaySpinner]="false" (onLoading)="setLoadingComments($event)"></core-comments>
</ion-item>
<ion-grid *ngIf="previousOffset != null || nextOffset != null">

View File

@ -12,7 +12,7 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import { Component, ViewChild, OnDestroy } from '@angular/core';
import { ChangeDetectorRef, Component, ViewChild, OnDestroy } from '@angular/core';
import { Content, IonicPage, NavParams, NavController } from 'ionic-angular';
import { CoreUtilsProvider } from '@providers/utils/utils';
import { CoreDomUtilsProvider } from '@providers/utils/dom';
@ -51,6 +51,9 @@ export class AddonModDataEntryPage implements OnDestroy {
moduleName = 'data';
component = AddonModDataProvider.COMPONENT;
entryLoaded = false;
renderingEntry = false;
loadingComments = false;
loadingRating = false;
selectedGroup = 0;
entry: any;
offlineActions = [];
@ -61,18 +64,19 @@ export class AddonModDataEntryPage implements OnDestroy {
data: any;
groupInfo: any;
showComments: any;
entryRendered = '';
entryHtml = '';
siteId: string;
extraImports = [AddonModDataComponentsModule];
jsData;
ratingInfo: CoreRatingInfo;
isPullingToRefresh = false; // Whether the last fetching of data was started by a pull-to-refresh action
constructor(params: NavParams, protected utils: CoreUtilsProvider, protected groupsProvider: CoreGroupsProvider,
protected domUtils: CoreDomUtilsProvider, protected fieldsDelegate: AddonModDataFieldsDelegate,
protected courseProvider: CoreCourseProvider, protected dataProvider: AddonModDataProvider,
protected dataOffline: AddonModDataOfflineProvider, protected dataHelper: AddonModDataHelperProvider,
sitesProvider: CoreSitesProvider, protected navCtrl: NavController,
protected eventsProvider: CoreEventsProvider) {
sitesProvider: CoreSitesProvider, protected navCtrl: NavController, protected eventsProvider: CoreEventsProvider,
private cdr: ChangeDetectorRef) {
this.module = params.get('module') || {};
this.entryId = params.get('entryId') || null;
this.courseId = params.get('courseId');
@ -122,12 +126,15 @@ export class AddonModDataEntryPage implements OnDestroy {
/**
* Fetch the entry data.
*
* @param {boolean} refresh If refresh the current data or not.
* @return {Promise<any>} Resolved when done.
* @param {boolean} [refresh] Whether to refresh the current data or not.
* @param {boolean} [isPtr] Whether is a pull to refresh action.
* @return {Promise<any>} Resolved when done.
*/
protected fetchEntryData(refresh?: boolean): Promise<any> {
protected fetchEntryData(refresh?: boolean, isPtr?: boolean): Promise<any> {
let fieldsArray;
this.isPullingToRefresh = isPtr;
return this.dataProvider.getDatabase(this.courseId, this.module.id).then((data) => {
this.title = data.name || this.title;
this.data = data;
@ -176,7 +183,7 @@ export class AddonModDataEntryPage implements OnDestroy {
const actions = this.dataHelper.getActions(this.data, this.access, this.entry);
const templte = this.data.singletemplate || this.dataHelper.getDefaultTemplate('single', fieldsArray);
this.entryRendered = this.dataHelper.displayShowFields(templte, fieldsArray, this.entry, this.offset, 'show', actions);
this.entryHtml = this.dataHelper.displayShowFields(templte, fieldsArray, this.entry, this.offset, 'show', actions);
this.showComments = actions.comments;
const entries = {};
@ -191,7 +198,7 @@ export class AddonModDataEntryPage implements OnDestroy {
}).catch((message) => {
if (!refresh) {
// Some call failed, retry without using cache since it might be a new activity.
return this.refreshAllData();
return this.refreshAllData(isPtr);
}
this.domUtils.showErrorModalDefault(message, 'core.course.errorgetmodule', true);
@ -219,9 +226,10 @@ export class AddonModDataEntryPage implements OnDestroy {
/**
* Refresh all the data.
*
* @param {boolean} [isPtr] Whether is a pull to refresh action.
* @return {Promise<any>} Promise resolved when done.
*/
protected refreshAllData(): Promise<any> {
protected refreshAllData(isPtr?: boolean): Promise<any> {
const promises = [];
promises.push(this.dataProvider.invalidateDatabaseData(this.courseId));
@ -232,7 +240,7 @@ export class AddonModDataEntryPage implements OnDestroy {
}
return Promise.all(promises).finally(() => {
return this.fetchEntryData(true);
return this.fetchEntryData(true, isPtr);
});
}
@ -244,7 +252,7 @@ export class AddonModDataEntryPage implements OnDestroy {
*/
refreshDatabase(refresher?: any): Promise<any> {
if (this.entryLoaded) {
return this.refreshAllData().finally(() => {
return this.refreshAllData(true).finally(() => {
refresher && refresher.complete();
});
}
@ -310,6 +318,30 @@ export class AddonModDataEntryPage implements OnDestroy {
});
}
/**
* Function called when entry is being rendered.
*/
setRenderingEntry(rendering: boolean): void {
this.renderingEntry = rendering;
this.cdr.detectChanges();
}
/**
* Function called when comments component is loading data.
*/
setLoadingComments(loading: boolean): void {
this.loadingComments = loading;
this.cdr.detectChanges();
}
/**
* Function called when rate component is loading data.
*/
setLoadingRating(loading: boolean): void {
this.loadingRating = loading;
this.cdr.detectChanges();
}
/**
* Function called when rating is updated online.
*/

View File

@ -12,8 +12,8 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import { Component, Input, OnChanges, SimpleChange } from '@angular/core';
import { NavParams, NavController } from 'ionic-angular';
import { Component, EventEmitter, Input, OnChanges, Output, SimpleChange } from '@angular/core';
import { NavController } from 'ionic-angular';
import { CoreCommentsProvider } from '../../providers/comments';
/**
@ -31,11 +31,15 @@ export class CoreCommentsCommentsComponent implements OnChanges {
@Input() area = '';
@Input() page = 0;
@Input() title?: string;
@Input() displaySpinner = true; // Whether to display the loading spinner.
@Output() onLoading: EventEmitter<boolean>; // Eevent that indicates whether the component is loading data.
commentsLoaded = false;
commentsCount: number;
constructor(navParams: NavParams, private navCtrl: NavController, private commentsProvider: CoreCommentsProvider) {}
constructor(private navCtrl: NavController, private commentsProvider: CoreCommentsProvider) {
this.onLoading = new EventEmitter<boolean>();
}
/**
* View loaded.
@ -56,6 +60,7 @@ export class CoreCommentsCommentsComponent implements OnChanges {
protected fetchData(): void {
this.commentsLoaded = false;
this.onLoading.emit(true);
this.commentsProvider.getComments(this.contextLevel, this.instanceId, this.component, this.itemId, this.area, this.page)
.then((comments) => {
@ -64,6 +69,7 @@ export class CoreCommentsCommentsComponent implements OnChanges {
this.commentsCount = -1;
}).finally(() => {
this.commentsLoaded = true;
this.onLoading.emit(false);
});
}

View File

@ -1,4 +1,4 @@
<core-loading [hideUntil]="commentsLoaded">
<core-loading [hideUntil]="commentsLoaded || !displaySpinner">
<div (click)="openComments()" *ngIf="commentsCount >= 0">
{{ 'core.commentscount' | translate : {'$a': commentsCount} }}
</div>

View File

@ -48,6 +48,7 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
@Input() extraProviders: any[] = []; // Extra providers.
@Input() forceCompile: string | boolean; // Set it to true to force compile even if the text/javascript hasn't changed.
@Output() created: EventEmitter<any> = new EventEmitter(); // Will emit an event when the component is instantiated.
@Output() compiling: EventEmitter<boolean> = new EventEmitter(); // Event that indicates whether the template is being compiled.
// Get the container where to put the content.
@ViewChild('dynamicComponent', { read: ViewContainerRef }) container: ViewContainerRef;
@ -58,6 +59,7 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
protected componentRef: ComponentRef<any>;
protected element;
protected differ: any; // To detect changes in the jsData input.
protected creatingComponent = false;
constructor(protected compileProvider: CoreCompileProvider, protected cdr: ChangeDetectorRef, element: ElementRef,
@Optional() protected navCtrl: NavController, differs: KeyValueDiffers, protected domUtils: CoreDomUtilsProvider,
@ -70,7 +72,7 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
* Detect and act upon changes that Angular cant or wont detect on its own (objects and arrays).
*/
ngDoCheck(): void {
if (this.componentInstance) {
if (this.componentInstance && !this.creatingComponent) {
// Check if there's any change in the jsData object.
const changes = this.differ.diff(this.jsData);
if (changes) {
@ -91,6 +93,8 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
this.text) {
// Create a new component and a new module.
this.creatingComponent = true;
this.compiling.emit(true);
this.compileProvider.createAndCompileComponent(this.text, this.getComponentClass(), this.extraImports)
.then((factory) => {
// Destroy previous components.
@ -107,6 +111,9 @@ export class CoreCompileHtmlComponent implements OnChanges, OnDestroy, DoCheck {
this.domUtils.showErrorModal(error);
this.loaded = true;
}).finally(() => {
this.creatingComponent = false;
this.compiling.emit(false);
});
}
}

View File

@ -35,6 +35,7 @@ export class CoreRatingRateComponent implements OnChanges {
@Input() aggregateMethod: number;
@Input() scaleId: number;
@Input() userId: number;
@Output() onLoading: EventEmitter<boolean>; // Eevent that indicates whether the component is loading data.
@Output() onUpdate: EventEmitter<void>; // Event emitted when the rating is updated online.
item: CoreRatingInfoItem;
@ -43,6 +44,7 @@ export class CoreRatingRateComponent implements OnChanges {
constructor(private domUtils: CoreDomUtilsProvider, private translate: TranslateService,
private ratingProvider: CoreRatingProvider, private ratingOffline: CoreRatingOfflineProvider) {
this.onLoading = new EventEmitter<boolean>();
this.onUpdate = new EventEmitter<void>();
}
@ -77,6 +79,7 @@ export class CoreRatingRateComponent implements OnChanges {
});
}
this.onLoading.emit(true);
this.ratingOffline.getRating(this.contextLevel, this.instanceId, this.ratingInfo.component, this.ratingInfo.ratingarea,
this.itemId).then((rating) => {
this.rating = rating.rating;
@ -86,6 +89,8 @@ export class CoreRatingRateComponent implements OnChanges {
} else {
this.rating = CoreRatingProvider.UNSET_RATING;
}
}).finally(() => {
this.onLoading.emit(false);
});
}