javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 12:29:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

style(loading): update the style of the code and docs

Browse Source
This commit is contained in:
Brandy Carney
2018-06-15 17:09:50 -04:00
parent ad55459e3c
commit 0f5601b3ae
3 changed files with 55 additions and 600 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
core/src/components/loading/loading.tsx
View File

@ -1,27 +1,6 @@
import {
Component,
Element,
Event,
EventEmitter,
Listen,
Method,
Prop
} from '@stencil/core';
import {
Animation,
AnimationBuilder,
Color,
Config,
Mode
} from '../../interface';
import {
BACKDROP,
OverlayEventDetail,
OverlayInterface,
dismiss,
eventMethod,
present
} from '../../utils/overlays';
import { Component, Element, Event, EventEmitter, Listen, Method, Prop } from '@stencil/core';
import { Animation, AnimationBuilder, Color, Config, Mode } from '../../interface';
import { BACKDROP, OverlayEventDetail, OverlayInterface, dismiss, eventMethod, present } from '../../utils/overlays';
import { createThemedClasses, getClassMap } from '../../utils/theme';
import { iosEnterAnimation } from './animations/ios.enter';
@ -50,10 +29,8 @@ export class Loading implements OverlayInterface {
@Element() el!: HTMLElement;
@Prop({ connect: 'ion-animation-controller' })
animationCtrl!: HTMLIonAnimationControllerElement;
@Prop({ context: 'config' })
config!: Config;
@Prop({ connect: 'ion-animation-controller' }) animationCtrl!: HTMLIonAnimationControllerElement;
@Prop({ context: 'config' }) config!: Config;
@Prop() overlayId!: number;
@Prop() keyboardClose = true;
@ -127,33 +104,26 @@ export class Loading implements OverlayInterface {
/**
* Emitted after the loading has presented.
*/
@Event({ eventName: 'ionLoadingDidPresent' })
didPresent!: EventEmitter<void>;
@Event({ eventName: 'ionLoadingDidPresent' }) didPresent!: EventEmitter<void>;
/**
* Emitted before the loading has presented.
*/
@Event({ eventName: 'ionLoadingWillPresent' })
willPresent!: EventEmitter<void>;
@Event({ eventName: 'ionLoadingWillPresent' }) willPresent!: EventEmitter<void>;
/**
* Emitted before the loading has dismissed.
*/
@Event({ eventName: 'ionLoadingWillDismiss' })
willDismiss!: EventEmitter<OverlayEventDetail>;
@Event({ eventName: 'ionLoadingWillDismiss' }) willDismiss!: EventEmitter<OverlayEventDetail>;
/**
* Emitted after the loading has dismissed.
*/
@Event({ eventName: 'ionLoadingDidDismiss' })
didDismiss!: EventEmitter<OverlayEventDetail>;
@Event({ eventName: 'ionLoadingDidDismiss' }) didDismiss!: EventEmitter<OverlayEventDetail>;
componentWillLoad() {
if (!this.spinner) {
this.spinner = this.config.get(
'loadingSpinner',
this.mode === 'ios' ? 'lines' : 'crescent'
);
this.spinner = this.config.get('loadingSpinner', this.mode === 'ios' ? 'lines' : 'crescent');
}
}
@ -175,13 +145,7 @@ export class Loading implements OverlayInterface {
*/
@Method()
async present(): Promise<void> {
await present(
this,
'loadingEnter',
iosEnterAnimation,
mdEnterAnimation,
undefined
);
await present( this, 'loadingEnter', iosEnterAnimation, mdEnterAnimation, undefined);
if (this.duration) {
this.durationTimeout = setTimeout(
@ -199,40 +163,24 @@ export class Loading implements OverlayInterface {
if (this.durationTimeout) {
clearTimeout(this.durationTimeout);
}
return dismiss(
this,
data,
role,
'loadingLeave',
iosLeaveAnimation,
mdLeaveAnimation
);
return dismiss(this, data, role, 'loadingLeave', iosLeaveAnimation, mdLeaveAnimation);
}
/**
* Returns a promise that resolves when the loading did dismiss. It also accepts a callback
* that is called in the same circustances.
*
* that is called in the same circumstances.
*/
@Method()
onDidDismiss(
callback?: (detail: OverlayEventDetail) => void
): Promise<OverlayEventDetail> {
onDidDismiss(callback?: (detail: OverlayEventDetail) => void): Promise<OverlayEventDetail> {
return eventMethod(this.el, 'ionLoadingDidDismiss', callback);
}
/**
* Returns a promise that resolves when the loading will dismiss. It also accepts a callback
* that is called in the same circustances.
*
* ```
* const {data, role} = await loading.onWillDismiss();
* ```
* that is called in the same circumstances.
*/
@Method()
onWillDismiss(
callback?: (detail: OverlayEventDetail) => void
): Promise<OverlayEventDetail> {
onWillDismiss(callback?: (detail: OverlayEventDetail) => void): Promise<OverlayEventDetail> {
return eventMethod(this.el, 'ionLoadingWillDismiss', callback);
}