1 | 'use strict';
|
2 |
|
3 | const index = require('./index-a0a08b2a.js');
|
4 | const helpers = require('./helpers-d381ec4d.js');
|
5 |
|
6 | const LIFECYCLE_WILL_ENTER = 'ionViewWillEnter';
|
7 | const LIFECYCLE_DID_ENTER = 'ionViewDidEnter';
|
8 | const LIFECYCLE_WILL_LEAVE = 'ionViewWillLeave';
|
9 | const LIFECYCLE_DID_LEAVE = 'ionViewDidLeave';
|
10 | const LIFECYCLE_WILL_UNLOAD = 'ionViewWillUnload';
|
11 |
|
12 | const iosTransitionAnimation = () => Promise.resolve().then(function () { return require('./ios.transition-ce21ff9f.js'); });
|
13 | const mdTransitionAnimation = () => Promise.resolve().then(function () { return require('./md.transition-59017746.js'); });
|
14 | const transition = (opts) => {
|
15 | return new Promise((resolve, reject) => {
|
16 | index.writeTask(() => {
|
17 | beforeTransition(opts);
|
18 | runTransition(opts).then(result => {
|
19 | if (result.animation) {
|
20 | result.animation.destroy();
|
21 | }
|
22 | afterTransition(opts);
|
23 | resolve(result);
|
24 | }, error => {
|
25 | afterTransition(opts);
|
26 | reject(error);
|
27 | });
|
28 | });
|
29 | });
|
30 | };
|
31 | const beforeTransition = (opts) => {
|
32 | const enteringEl = opts.enteringEl;
|
33 | const leavingEl = opts.leavingEl;
|
34 | setZIndex(enteringEl, leavingEl, opts.direction);
|
35 | if (opts.showGoBack) {
|
36 | enteringEl.classList.add('can-go-back');
|
37 | }
|
38 | else {
|
39 | enteringEl.classList.remove('can-go-back');
|
40 | }
|
41 | setPageHidden(enteringEl, false);
|
42 | |
43 |
|
44 |
|
45 |
|
46 |
|
47 |
|
48 | enteringEl.style.setProperty('pointer-events', 'none');
|
49 | if (leavingEl) {
|
50 | setPageHidden(leavingEl, false);
|
51 | leavingEl.style.setProperty('pointer-events', 'none');
|
52 | }
|
53 | };
|
54 | const runTransition = async (opts) => {
|
55 | const animationBuilder = await getAnimationBuilder(opts);
|
56 | const ani = (animationBuilder && index.Build.isBrowser)
|
57 | ? animation(animationBuilder, opts)
|
58 | : noAnimation(opts);
|
59 | return ani;
|
60 | };
|
61 | const afterTransition = (opts) => {
|
62 | const enteringEl = opts.enteringEl;
|
63 | const leavingEl = opts.leavingEl;
|
64 | enteringEl.classList.remove('ion-page-invisible');
|
65 | enteringEl.style.removeProperty('pointer-events');
|
66 | if (leavingEl !== undefined) {
|
67 | leavingEl.classList.remove('ion-page-invisible');
|
68 | leavingEl.style.removeProperty('pointer-events');
|
69 | }
|
70 | };
|
71 | const getAnimationBuilder = async (opts) => {
|
72 | if (!opts.leavingEl || !opts.animated || opts.duration === 0) {
|
73 | return undefined;
|
74 | }
|
75 | if (opts.animationBuilder) {
|
76 | return opts.animationBuilder;
|
77 | }
|
78 | const getAnimation = (opts.mode === 'ios')
|
79 | ? (await iosTransitionAnimation()).iosTransitionAnimation
|
80 | : (await mdTransitionAnimation()).mdTransitionAnimation;
|
81 | return getAnimation;
|
82 | };
|
83 | const animation = async (animationBuilder, opts) => {
|
84 | await waitForReady(opts, true);
|
85 | const trans = animationBuilder(opts.baseEl, opts);
|
86 | fireWillEvents(opts.enteringEl, opts.leavingEl);
|
87 | const didComplete = await playTransition(trans, opts);
|
88 | if (opts.progressCallback) {
|
89 | opts.progressCallback(undefined);
|
90 | }
|
91 | if (didComplete) {
|
92 | fireDidEvents(opts.enteringEl, opts.leavingEl);
|
93 | }
|
94 | return {
|
95 | hasCompleted: didComplete,
|
96 | animation: trans
|
97 | };
|
98 | };
|
99 | const noAnimation = async (opts) => {
|
100 | const enteringEl = opts.enteringEl;
|
101 | const leavingEl = opts.leavingEl;
|
102 | await waitForReady(opts, false);
|
103 | fireWillEvents(enteringEl, leavingEl);
|
104 | fireDidEvents(enteringEl, leavingEl);
|
105 | return {
|
106 | hasCompleted: true
|
107 | };
|
108 | };
|
109 | const waitForReady = async (opts, defaultDeep) => {
|
110 | const deep = opts.deepWait !== undefined ? opts.deepWait : defaultDeep;
|
111 | const promises = deep ? [
|
112 | deepReady(opts.enteringEl),
|
113 | deepReady(opts.leavingEl),
|
114 | ] : [
|
115 | shallowReady(opts.enteringEl),
|
116 | shallowReady(opts.leavingEl),
|
117 | ];
|
118 | await Promise.all(promises);
|
119 | await notifyViewReady(opts.viewIsReady, opts.enteringEl);
|
120 | };
|
121 | const notifyViewReady = async (viewIsReady, enteringEl) => {
|
122 | if (viewIsReady) {
|
123 | await viewIsReady(enteringEl);
|
124 | }
|
125 | };
|
126 | const playTransition = (trans, opts) => {
|
127 | const progressCallback = opts.progressCallback;
|
128 | const promise = new Promise(resolve => {
|
129 | trans.onFinish((currentStep) => resolve(currentStep === 1));
|
130 | });
|
131 |
|
132 | if (progressCallback) {
|
133 |
|
134 |
|
135 | trans.progressStart(true);
|
136 | progressCallback(trans);
|
137 | }
|
138 | else {
|
139 |
|
140 |
|
141 |
|
142 | trans.play();
|
143 | }
|
144 |
|
145 | return promise;
|
146 | };
|
147 | const fireWillEvents = (enteringEl, leavingEl) => {
|
148 | lifecycle(leavingEl, LIFECYCLE_WILL_LEAVE);
|
149 | lifecycle(enteringEl, LIFECYCLE_WILL_ENTER);
|
150 | };
|
151 | const fireDidEvents = (enteringEl, leavingEl) => {
|
152 | lifecycle(enteringEl, LIFECYCLE_DID_ENTER);
|
153 | lifecycle(leavingEl, LIFECYCLE_DID_LEAVE);
|
154 | };
|
155 | const lifecycle = (el, eventName) => {
|
156 | if (el) {
|
157 | const ev = new CustomEvent(eventName, {
|
158 | bubbles: false,
|
159 | cancelable: false,
|
160 | });
|
161 | el.dispatchEvent(ev);
|
162 | }
|
163 | };
|
164 | const shallowReady = (el) => {
|
165 | if (el) {
|
166 | return new Promise(resolve => helpers.componentOnReady(el, resolve));
|
167 | }
|
168 | return Promise.resolve();
|
169 | };
|
170 | const deepReady = async (el) => {
|
171 | const element = el;
|
172 | if (element) {
|
173 | if (element.componentOnReady != null) {
|
174 | const stencilEl = await element.componentOnReady();
|
175 | if (stencilEl != null) {
|
176 | return;
|
177 | }
|
178 | }
|
179 | await Promise.all(Array.from(element.children).map(deepReady));
|
180 | }
|
181 | };
|
182 | const setPageHidden = (el, hidden) => {
|
183 | if (hidden) {
|
184 | el.setAttribute('aria-hidden', 'true');
|
185 | el.classList.add('ion-page-hidden');
|
186 | }
|
187 | else {
|
188 | el.hidden = false;
|
189 | el.removeAttribute('aria-hidden');
|
190 | el.classList.remove('ion-page-hidden');
|
191 | }
|
192 | };
|
193 | const setZIndex = (enteringEl, leavingEl, direction) => {
|
194 | if (enteringEl !== undefined) {
|
195 | enteringEl.style.zIndex = (direction === 'back')
|
196 | ? '99'
|
197 | : '101';
|
198 | }
|
199 | if (leavingEl !== undefined) {
|
200 | leavingEl.style.zIndex = '100';
|
201 | }
|
202 | };
|
203 | const getIonPageElement = (element) => {
|
204 | if (element.classList.contains('ion-page')) {
|
205 | return element;
|
206 | }
|
207 | const ionPage = element.querySelector(':scope > .ion-page, :scope > ion-nav, :scope > ion-tabs');
|
208 | if (ionPage) {
|
209 | return ionPage;
|
210 | }
|
211 |
|
212 | return element;
|
213 | };
|
214 |
|
215 | exports.LIFECYCLE_DID_ENTER = LIFECYCLE_DID_ENTER;
|
216 | exports.LIFECYCLE_DID_LEAVE = LIFECYCLE_DID_LEAVE;
|
217 | exports.LIFECYCLE_WILL_ENTER = LIFECYCLE_WILL_ENTER;
|
218 | exports.LIFECYCLE_WILL_LEAVE = LIFECYCLE_WILL_LEAVE;
|
219 | exports.LIFECYCLE_WILL_UNLOAD = LIFECYCLE_WILL_UNLOAD;
|
220 | exports.deepReady = deepReady;
|
221 | exports.getIonPageElement = getIonPageElement;
|
222 | exports.lifecycle = lifecycle;
|
223 | exports.setPageHidden = setPageHidden;
|
224 | exports.transition = transition;
|