ionic-angular
Version:
A powerful framework for building mobile and progressive web apps with JavaScript and Angular 2
252 lines • 9.88 kB
JavaScript
var __extends = (this && this.__extends) || function (d, b) {
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
(function (factory) {
if (typeof module === 'object' && typeof module.exports === 'object') {
var v = factory(require, exports); if (v !== undefined) module.exports = v;
}
else if (typeof define === 'function' && define.amd) {
define(["require", "exports", '@angular/core', '../app/app', '../../util/util', './loading-component', '../../navigation/view-controller'], factory);
}
})(function (require, exports) {
"use strict";
var core_1 = require('@angular/core');
var app_1 = require('../app/app');
var util_1 = require('../../util/util');
var loading_component_1 = require('./loading-component');
var view_controller_1 = require('../../navigation/view-controller');
var Loading = (function (_super) {
__extends(Loading, _super);
/**
* @param {?} app
* @param {?=} opts
*/
function Loading(app, opts) {
if (opts === void 0) { opts = {}; }
opts.showBackdrop = util_1.isPresent(opts.showBackdrop) ? !!opts.showBackdrop : true;
opts.dismissOnPageChange = util_1.isPresent(opts.dismissOnPageChange) ? !!opts.dismissOnPageChange : false;
_super.call(this, loading_component_1.LoadingCmp, opts, null);
this._app = app;
this.isOverlay = true;
}
/**
* @param {?} direction
* @return {?}
*/
Loading.prototype.getTransitionName = function (direction) {
var /** @type {?} */ key = (direction === 'back' ? 'loadingLeave' : 'loadingEnter');
return this._nav && this._nav.config.get(key);
};
/**
* @param {?} content
* @return {?}
*/
Loading.prototype.setContent = function (content) {
this.data.content = content;
return this;
};
/**
* @param {?} spinner
* @return {?}
*/
Loading.prototype.setSpinner = function (spinner) {
this.data.spinner = spinner;
return this;
};
/**
* @param {?} cssClass
* @return {?}
*/
Loading.prototype.setCssClass = function (cssClass) {
this.data.cssClass = cssClass;
return this;
};
/**
* @param {?} showBackdrop
* @return {?}
*/
Loading.prototype.setShowBackdrop = function (showBackdrop) {
this.data.showBackdrop = showBackdrop;
return this;
};
/**
* @param {?} dur
* @return {?}
*/
Loading.prototype.setDuration = function (dur) {
this.data.duration = dur;
return this;
};
/**
* Present the loading instance.
*
* @param {?=} navOptions
* @return {?}
*/
Loading.prototype.present = function (navOptions) {
if (navOptions === void 0) { navOptions = {}; }
return this._app.present(this, navOptions, 2 /* LOADING */);
};
/**
* Dismiss all loading components which have been presented.
* @return {?}
*/
Loading.prototype.dismissAll = function () {
this._nav && this._nav.popAll();
};
return Loading;
}(view_controller_1.ViewController));
exports.Loading = Loading;
function Loading_tsickle_Closure_declarations() {
/** @type {?} */
Loading.prototype._app;
}
/**
* \@name LoadingController
* \@description
* An overlay that can be used to indicate activity while blocking user
* interaction. The loading indicator appears on top of the app's content,
* and can be dismissed by the app to resume user interaction with
* the app. It includes an optional backdrop, which can be disabled
* by setting `showBackdrop: false` upon creation.
*
* ### Creating
* You can pass all of the loading options in the first argument of
* the create method: `create(opts)`. The spinner name should be
* passed in the `spinner` property, and any optional HTML can be passed
* in the `content` property. If you do not pass a value to `spinner`
* the loading indicator will use the spinner specified by the mode. To
* set the spinner name across the app, set the value of `loadingSpinner`
* in your app's config. To hide the spinner, set `loadingSpinner: 'hide'`
* in the app's config or pass `spinner: 'hide'` in the loading
* options. See the [create](#create) method below for all available options.
*
* ### Dismissing
* The loading indicator can be dismissed automatically after a specific
* amount of time by passing the number of milliseconds to display it in
* the `duration` of the loading options. By default the loading indicator
* will show even during page changes, but this can be disabled by setting
* `dismissOnPageChange` to `true`. To dismiss the loading indicator after
* creation, call the `dismiss()` method on the Loading instance. The
* `onDidDismiss` function can be called to perform an action after the loading
* indicator is dismissed.
*
* >Note that after the component is dismissed, it will not be usable anymore
* and another one must be created. This can be avoided by wrapping the
* creation and presentation of the component in a reusable function as shown
* in the `usage` section below.
*
* ### Limitations
* The element is styled to appear on top of other content by setting its
* `z-index` property. You must ensure no element has a stacking context with
* a higher `z-index` than this element.
*
* \@usage
* ```ts
* constructor(public loadingCtrl: LoadingController) {
*
* }
*
* presentLoadingDefault() {
* let loading = this.loadingCtrl.create({
* content: 'Please wait...'
* });
*
* loading.present();
*
* setTimeout(() => {
* loading.dismiss();
* }, 5000);
* }
*
* presentLoadingCustom() {
* let loading = this.loadingCtrl.create({
* spinner: 'hide',
* content: `
* <div class="custom-spinner-container">
* <div class="custom-spinner-box"></div>
* </div>`,
* duration: 5000
* });
*
* loading.onDidDismiss(() => {
* console.log('Dismissed loading');
* });
*
* loading.present();
* }
*
* presentLoadingText() {
* let loading = this.loadingCtrl.create({
* spinner: 'hide',
* content: 'Loading Please Wait...'
* });
*
* loading.present();
*
* setTimeout(() => {
* this.nav.push(Page2);
* }, 1000);
*
* setTimeout(() => {
* loading.dismiss();
* }, 5000);
* }
* ```
* \@advanced
*
* Loading options
*
* | Option | Type | Description |
* |-----------------------|------------|------------------------------------------------------------------------------------------------------------------|
* | spinner |`string` | The name of the SVG spinner for the loading indicator. |
* | content |`string` | The html content for the loading indicator. |
* | cssClass |`string` | Additional classes for custom styles, separated by spaces. |
* | showBackdrop |`boolean` | Whether to show the backdrop. Default true. |
* | dismissOnPageChange |`boolean` | Whether to dismiss the indicator when navigating to a new page. Default false. |
* | duration |`number` | How many milliseconds to wait before hiding the indicator. By default, it will show until `dismiss()` is called. |
*
* \@demo /docs/v2/demos/src/loading/
* @see {\@link /docs/v2/api/components/spinner/Spinner Spinner API Docs}
*/
var LoadingController = (function () {
/**
* @param {?} _app
*/
function LoadingController(_app) {
this._app = _app;
}
/**
* Create a loading indicator. See below for options.
* @param {?=} opts
* @return {?}
*/
LoadingController.prototype.create = function (opts) {
if (opts === void 0) { opts = {}; }
return new Loading(this._app, opts);
};
LoadingController.decorators = [
{ type: core_1.Injectable },
];
/** @nocollapse */
LoadingController.ctorParameters = function () { return [
{ type: app_1.App, },
]; };
return LoadingController;
}());
exports.LoadingController = LoadingController;
function LoadingController_tsickle_Closure_declarations() {
/** @type {?} */
LoadingController.decorators;
/**
* @nocollapse
* @type {?}
*/
LoadingController.ctorParameters;
/** @type {?} */
LoadingController.prototype._app;
}
});
//# sourceMappingURL=loading.js.map