import { Component , ElementRef , HostListener , Renderer , ViewEncapsulation } from '@angular/core' ; import { Config } from '../../config/config' ; import { BLOCK_ALL , BlockerDelegate , GestureController } from '../../gestures/gesture-controller' ; import { assert , isDefined , isUndefined } from '../../util/util' ; import { KEY_ESCAPE } from '../../platform/key' ; import { LoadingOptions } from './loading-options' ; import { NavParams } from '../../navigation/nav-params' ; import { ViewController } from '../../navigation/view-controller' ; hidden @ Component ( { selector : 'ion-loading' , template : '<ion-backdrop [hidden]="!d.showBackdrop" (click)="bdClick()" [class.backdrop-no-tappable]="!d.enableBackdropDismiss"></ion-backdrop>' + '<div class="loading-wrapper">' + '<div *ngIf="showSpinner" class="loading-spinner">' + '<ion-spinner [name]="d.spinner"></ion-spinner>' + '</div>' + '<div *ngIf="d.content" [innerHTML]="d.content" class="loading-content"></div>' + '</div>' , host : { 'role' : 'dialog' } , encapsulation : ViewEncapsulation . None , } ) export class LoadingCmp { d : LoadingOptions ; id : number ; showSpinner : boolean ; durationTimeout : any ; gestureBlocker : BlockerDelegate ; constructor ( private _viewCtrl , private _config , _elementRef , gestureCtrl , params , renderer ) { assert ( params . data , 'params data must be valid' ) ; this . gestureBlocker = gestureCtrl . createBlocker ( BLOCK_ALL ) ; this . d = params . data ; renderer . setElementClass ( _elementRef . nativeElement , `loading-${ _config . get ( 'mode' ) }` , true ) ; if ( this . d . cssClass ) { this . d . cssClass . split ( ' ' ) . forEach ( cssClass => { if ( cssClass . trim ( ) !== '' ) renderer . setElementClass ( _elementRef . nativeElement , cssClass , true ) ; } ) ; } this . id = ( ++ loadingIds ) ; } ngOnInit ( ) { if ( isUndefined ( this . d . spinner ) ) { this . d . spinner = this . _config . get ( 'loadingSpinner' , this . _config . get ( 'spinner' , 'ios' ) ) ; } this . showSpinner = isDefined ( this . d . spinner ) && this . d . spinner !== 'hide' ; } ionViewWillEnter ( ) { this . gestureBlocker . block ( ) ; } ionViewDidLeave ( ) { this . gestureBlocker . unblock ( ) ; } ionViewDidEnter ( ) { if ( this . d && this . d . duration ) { this . durationTimeout = setTimeout ( ( ) => this . dismiss ( 'backdrop' ) , this . d . duration ) ; } } @ HostListener ( 'body:keyup' , [ '$event' ] ) keyUp ( ev ) { if ( this . _viewCtrl . isLast ( ) && ev . keyCode === KEY_ESCAPE ) { this . bdClick ( ) ; } } bdClick ( ) { if ( this . d . enableBackdropDismiss ) { this . dismiss ( 'backdrop' ) ; } } dismiss ( role ) { if ( this . durationTimeout ) { clearTimeout ( this . durationTimeout ) ; } return this . _viewCtrl . dismiss ( null , role ) ; } ngOnDestroy ( ) { assert ( this . gestureBlocker . blocked === false , 'gesture blocker must be already unblocked' ) ; this . gestureBlocker . destroy ( ) ; } } let loadingIds = - 1 ;