UNPKG

17.5 kBJavaScriptView Raw
1/**
2 * @license Angular v10.0.0
3 * (c) 2010-2020 Google LLC. https://angular.io/
4 * License: MIT
5 */
6
7import { ViewEncapsulation, Injectable, RendererFactory2, Inject, NgZone, InjectionToken, NgModule } from '@angular/core';
8import { ɵDomRendererFactory2, BrowserModule } from '@angular/platform-browser';
9import { AnimationBuilder, sequence, AnimationFactory } from '@angular/animations';
10import { ɵAnimationEngine, AnimationDriver, ɵAnimationStyleNormalizer, ɵsupportsWebAnimations, ɵWebAnimationsDriver, ɵCssKeyframesDriver, ɵWebAnimationsStyleNormalizer, ɵNoopAnimationDriver } from '@angular/animations/browser';
11import { DOCUMENT } from '@angular/common';
12
13/**
14 * @license
15 * Copyright Google LLC All Rights Reserved.
16 *
17 * Use of this source code is governed by an MIT-style license that can be
18 * found in the LICENSE file at https://angular.io/license
19 */
20class BrowserAnimationBuilder extends AnimationBuilder {
21 constructor(rootRenderer, doc) {
22 super();
23 this._nextAnimationId = 0;
24 const typeData = { id: '0', encapsulation: ViewEncapsulation.None, styles: [], data: { animation: [] } };
25 this._renderer = rootRenderer.createRenderer(doc.body, typeData);
26 }
27 build(animation) {
28 const id = this._nextAnimationId.toString();
29 this._nextAnimationId++;
30 const entry = Array.isArray(animation) ? sequence(animation) : animation;
31 issueAnimationCommand(this._renderer, null, id, 'register', [entry]);
32 return new BrowserAnimationFactory(id, this._renderer);
33 }
34}
35BrowserAnimationBuilder.decorators = [
36 { type: Injectable }
37];
38BrowserAnimationBuilder.ctorParameters = () => [
39 { type: RendererFactory2 },
40 { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] }
41];
42class BrowserAnimationFactory extends AnimationFactory {
43 constructor(_id, _renderer) {
44 super();
45 this._id = _id;
46 this._renderer = _renderer;
47 }
48 create(element, options) {
49 return new RendererAnimationPlayer(this._id, element, options || {}, this._renderer);
50 }
51}
52class RendererAnimationPlayer {
53 constructor(id, element, options, _renderer) {
54 this.id = id;
55 this.element = element;
56 this._renderer = _renderer;
57 this.parentPlayer = null;
58 this._started = false;
59 this.totalTime = 0;
60 this._command('create', options);
61 }
62 _listen(eventName, callback) {
63 return this._renderer.listen(this.element, `@@${this.id}:${eventName}`, callback);
64 }
65 _command(command, ...args) {
66 return issueAnimationCommand(this._renderer, this.element, this.id, command, args);
67 }
68 onDone(fn) {
69 this._listen('done', fn);
70 }
71 onStart(fn) {
72 this._listen('start', fn);
73 }
74 onDestroy(fn) {
75 this._listen('destroy', fn);
76 }
77 init() {
78 this._command('init');
79 }
80 hasStarted() {
81 return this._started;
82 }
83 play() {
84 this._command('play');
85 this._started = true;
86 }
87 pause() {
88 this._command('pause');
89 }
90 restart() {
91 this._command('restart');
92 }
93 finish() {
94 this._command('finish');
95 }
96 destroy() {
97 this._command('destroy');
98 }
99 reset() {
100 this._command('reset');
101 }
102 setPosition(p) {
103 this._command('setPosition', p);
104 }
105 getPosition() {
106 return 0;
107 }
108}
109function issueAnimationCommand(renderer, element, id, command, args) {
110 return renderer.setProperty(element, `@@${id}:${command}`, args);
111}
112
113const ANIMATION_PREFIX = '@';
114const DISABLE_ANIMATIONS_FLAG = '@.disabled';
115class AnimationRendererFactory {
116 constructor(delegate, engine, _zone) {
117 this.delegate = delegate;
118 this.engine = engine;
119 this._zone = _zone;
120 this._currentId = 0;
121 this._microtaskId = 1;
122 this._animationCallbacksBuffer = [];
123 this._rendererCache = new Map();
124 this._cdRecurDepth = 0;
125 this.promise = Promise.resolve(0);
126 engine.onRemovalComplete = (element, delegate) => {
127 // Note: if an component element has a leave animation, and the component
128 // a host leave animation, the view engine will call `removeChild` for the parent
129 // component renderer as well as for the child component renderer.
130 // Therefore, we need to check if we already removed the element.
131 if (delegate && delegate.parentNode(element)) {
132 delegate.removeChild(element.parentNode, element);
133 }
134 };
135 }
136 createRenderer(hostElement, type) {
137 const EMPTY_NAMESPACE_ID = '';
138 // cache the delegates to find out which cached delegate can
139 // be used by which cached renderer
140 const delegate = this.delegate.createRenderer(hostElement, type);
141 if (!hostElement || !type || !type.data || !type.data['animation']) {
142 let renderer = this._rendererCache.get(delegate);
143 if (!renderer) {
144 renderer = new BaseAnimationRenderer(EMPTY_NAMESPACE_ID, delegate, this.engine);
145 // only cache this result when the base renderer is used
146 this._rendererCache.set(delegate, renderer);
147 }
148 return renderer;
149 }
150 const componentId = type.id;
151 const namespaceId = type.id + '-' + this._currentId;
152 this._currentId++;
153 this.engine.register(namespaceId, hostElement);
154 const registerTrigger = (trigger) => {
155 if (Array.isArray(trigger)) {
156 trigger.forEach(registerTrigger);
157 }
158 else {
159 this.engine.registerTrigger(componentId, namespaceId, hostElement, trigger.name, trigger);
160 }
161 };
162 const animationTriggers = type.data['animation'];
163 animationTriggers.forEach(registerTrigger);
164 return new AnimationRenderer(this, namespaceId, delegate, this.engine);
165 }
166 begin() {
167 this._cdRecurDepth++;
168 if (this.delegate.begin) {
169 this.delegate.begin();
170 }
171 }
172 _scheduleCountTask() {
173 // always use promise to schedule microtask instead of use Zone
174 this.promise.then(() => {
175 this._microtaskId++;
176 });
177 }
178 /** @internal */
179 scheduleListenerCallback(count, fn, data) {
180 if (count >= 0 && count < this._microtaskId) {
181 this._zone.run(() => fn(data));
182 return;
183 }
184 if (this._animationCallbacksBuffer.length == 0) {
185 Promise.resolve(null).then(() => {
186 this._zone.run(() => {
187 this._animationCallbacksBuffer.forEach(tuple => {
188 const [fn, data] = tuple;
189 fn(data);
190 });
191 this._animationCallbacksBuffer = [];
192 });
193 });
194 }
195 this._animationCallbacksBuffer.push([fn, data]);
196 }
197 end() {
198 this._cdRecurDepth--;
199 // this is to prevent animations from running twice when an inner
200 // component does CD when a parent component instead has inserted it
201 if (this._cdRecurDepth == 0) {
202 this._zone.runOutsideAngular(() => {
203 this._scheduleCountTask();
204 this.engine.flush(this._microtaskId);
205 });
206 }
207 if (this.delegate.end) {
208 this.delegate.end();
209 }
210 }
211 whenRenderingDone() {
212 return this.engine.whenRenderingDone();
213 }
214}
215AnimationRendererFactory.decorators = [
216 { type: Injectable }
217];
218AnimationRendererFactory.ctorParameters = () => [
219 { type: RendererFactory2 },
220 { type: ɵAnimationEngine },
221 { type: NgZone }
222];
223class BaseAnimationRenderer {
224 constructor(namespaceId, delegate, engine) {
225 this.namespaceId = namespaceId;
226 this.delegate = delegate;
227 this.engine = engine;
228 this.destroyNode = this.delegate.destroyNode ? (n) => delegate.destroyNode(n) : null;
229 }
230 get data() {
231 return this.delegate.data;
232 }
233 destroy() {
234 this.engine.destroy(this.namespaceId, this.delegate);
235 this.delegate.destroy();
236 }
237 createElement(name, namespace) {
238 return this.delegate.createElement(name, namespace);
239 }
240 createComment(value) {
241 return this.delegate.createComment(value);
242 }
243 createText(value) {
244 return this.delegate.createText(value);
245 }
246 appendChild(parent, newChild) {
247 this.delegate.appendChild(parent, newChild);
248 this.engine.onInsert(this.namespaceId, newChild, parent, false);
249 }
250 insertBefore(parent, newChild, refChild) {
251 this.delegate.insertBefore(parent, newChild, refChild);
252 this.engine.onInsert(this.namespaceId, newChild, parent, true);
253 }
254 removeChild(parent, oldChild, isHostElement) {
255 this.engine.onRemove(this.namespaceId, oldChild, this.delegate, isHostElement);
256 }
257 selectRootElement(selectorOrNode, preserveContent) {
258 return this.delegate.selectRootElement(selectorOrNode, preserveContent);
259 }
260 parentNode(node) {
261 return this.delegate.parentNode(node);
262 }
263 nextSibling(node) {
264 return this.delegate.nextSibling(node);
265 }
266 setAttribute(el, name, value, namespace) {
267 this.delegate.setAttribute(el, name, value, namespace);
268 }
269 removeAttribute(el, name, namespace) {
270 this.delegate.removeAttribute(el, name, namespace);
271 }
272 addClass(el, name) {
273 this.delegate.addClass(el, name);
274 }
275 removeClass(el, name) {
276 this.delegate.removeClass(el, name);
277 }
278 setStyle(el, style, value, flags) {
279 this.delegate.setStyle(el, style, value, flags);
280 }
281 removeStyle(el, style, flags) {
282 this.delegate.removeStyle(el, style, flags);
283 }
284 setProperty(el, name, value) {
285 if (name.charAt(0) == ANIMATION_PREFIX && name == DISABLE_ANIMATIONS_FLAG) {
286 this.disableAnimations(el, !!value);
287 }
288 else {
289 this.delegate.setProperty(el, name, value);
290 }
291 }
292 setValue(node, value) {
293 this.delegate.setValue(node, value);
294 }
295 listen(target, eventName, callback) {
296 return this.delegate.listen(target, eventName, callback);
297 }
298 disableAnimations(element, value) {
299 this.engine.disableAnimations(element, value);
300 }
301}
302class AnimationRenderer extends BaseAnimationRenderer {
303 constructor(factory, namespaceId, delegate, engine) {
304 super(namespaceId, delegate, engine);
305 this.factory = factory;
306 this.namespaceId = namespaceId;
307 }
308 setProperty(el, name, value) {
309 if (name.charAt(0) == ANIMATION_PREFIX) {
310 if (name.charAt(1) == '.' && name == DISABLE_ANIMATIONS_FLAG) {
311 value = value === undefined ? true : !!value;
312 this.disableAnimations(el, value);
313 }
314 else {
315 this.engine.process(this.namespaceId, el, name.substr(1), value);
316 }
317 }
318 else {
319 this.delegate.setProperty(el, name, value);
320 }
321 }
322 listen(target, eventName, callback) {
323 if (eventName.charAt(0) == ANIMATION_PREFIX) {
324 const element = resolveElementFromTarget(target);
325 let name = eventName.substr(1);
326 let phase = '';
327 // @listener.phase is for trigger animation callbacks
328 // @@listener is for animation builder callbacks
329 if (name.charAt(0) != ANIMATION_PREFIX) {
330 [name, phase] = parseTriggerCallbackName(name);
331 }
332 return this.engine.listen(this.namespaceId, element, name, phase, event => {
333 const countId = event['_data'] || -1;
334 this.factory.scheduleListenerCallback(countId, callback, event);
335 });
336 }
337 return this.delegate.listen(target, eventName, callback);
338 }
339}
340function resolveElementFromTarget(target) {
341 switch (target) {
342 case 'body':
343 return document.body;
344 case 'document':
345 return document;
346 case 'window':
347 return window;
348 default:
349 return target;
350 }
351}
352function parseTriggerCallbackName(triggerName) {
353 const dotIndex = triggerName.indexOf('.');
354 const trigger = triggerName.substring(0, dotIndex);
355 const phase = triggerName.substr(dotIndex + 1);
356 return [trigger, phase];
357}
358
359/**
360 * @license
361 * Copyright Google LLC All Rights Reserved.
362 *
363 * Use of this source code is governed by an MIT-style license that can be
364 * found in the LICENSE file at https://angular.io/license
365 */
366class InjectableAnimationEngine extends ɵAnimationEngine {
367 constructor(doc, driver, normalizer) {
368 super(doc.body, driver, normalizer);
369 }
370}
371InjectableAnimationEngine.decorators = [
372 { type: Injectable }
373];
374InjectableAnimationEngine.ctorParameters = () => [
375 { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] }] },
376 { type: AnimationDriver },
377 { type: ɵAnimationStyleNormalizer }
378];
379function instantiateSupportedAnimationDriver() {
380 return ɵsupportsWebAnimations() ? new ɵWebAnimationsDriver() : new ɵCssKeyframesDriver();
381}
382function instantiateDefaultStyleNormalizer() {
383 return new ɵWebAnimationsStyleNormalizer();
384}
385function instantiateRendererFactory(renderer, engine, zone) {
386 return new AnimationRendererFactory(renderer, engine, zone);
387}
388/**
389 * @publicApi
390 */
391const ANIMATION_MODULE_TYPE = new InjectionToken('AnimationModuleType');
392const SHARED_ANIMATION_PROVIDERS = [
393 { provide: AnimationBuilder, useClass: BrowserAnimationBuilder },
394 { provide: ɵAnimationStyleNormalizer, useFactory: instantiateDefaultStyleNormalizer },
395 { provide: ɵAnimationEngine, useClass: InjectableAnimationEngine }, {
396 provide: RendererFactory2,
397 useFactory: instantiateRendererFactory,
398 deps: [ɵDomRendererFactory2, ɵAnimationEngine, NgZone]
399 }
400];
401/**
402 * Separate providers from the actual module so that we can do a local modification in Google3 to
403 * include them in the BrowserModule.
404 */
405const BROWSER_ANIMATIONS_PROVIDERS = [
406 { provide: AnimationDriver, useFactory: instantiateSupportedAnimationDriver },
407 { provide: ANIMATION_MODULE_TYPE, useValue: 'BrowserAnimations' }, ...SHARED_ANIMATION_PROVIDERS
408];
409/**
410 * Separate providers from the actual module so that we can do a local modification in Google3 to
411 * include them in the BrowserTestingModule.
412 */
413const BROWSER_NOOP_ANIMATIONS_PROVIDERS = [
414 { provide: AnimationDriver, useClass: ɵNoopAnimationDriver },
415 { provide: ANIMATION_MODULE_TYPE, useValue: 'NoopAnimations' }, ...SHARED_ANIMATION_PROVIDERS
416];
417
418/**
419 * @license
420 * Copyright Google LLC All Rights Reserved.
421 *
422 * Use of this source code is governed by an MIT-style license that can be
423 * found in the LICENSE file at https://angular.io/license
424 */
425/**
426 * Exports `BrowserModule` with additional [dependency-injection providers](guide/glossary#provider)
427 * for use with animations. See [Animations](guide/animations).
428 * @publicApi
429 */
430class BrowserAnimationsModule {
431}
432BrowserAnimationsModule.decorators = [
433 { type: NgModule, args: [{
434 exports: [BrowserModule],
435 providers: BROWSER_ANIMATIONS_PROVIDERS,
436 },] }
437];
438/**
439 * A null player that must be imported to allow disabling of animations.
440 * @publicApi
441 */
442class NoopAnimationsModule {
443}
444NoopAnimationsModule.decorators = [
445 { type: NgModule, args: [{
446 exports: [BrowserModule],
447 providers: BROWSER_NOOP_ANIMATIONS_PROVIDERS,
448 },] }
449];
450
451/**
452 * @license
453 * Copyright Google LLC All Rights Reserved.
454 *
455 * Use of this source code is governed by an MIT-style license that can be
456 * found in the LICENSE file at https://angular.io/license
457 */
458
459/**
460 * @license
461 * Copyright Google LLC All Rights Reserved.
462 *
463 * Use of this source code is governed by an MIT-style license that can be
464 * found in the LICENSE file at https://angular.io/license
465 */
466
467/**
468 * @license
469 * Copyright Google LLC All Rights Reserved.
470 *
471 * Use of this source code is governed by an MIT-style license that can be
472 * found in the LICENSE file at https://angular.io/license
473 */
474
475/**
476 * @license
477 * Copyright Google LLC All Rights Reserved.
478 *
479 * Use of this source code is governed by an MIT-style license that can be
480 * found in the LICENSE file at https://angular.io/license
481 */
482
483/**
484 * Generated bundle index. Do not edit.
485 */
486
487export { ANIMATION_MODULE_TYPE, BrowserAnimationsModule, NoopAnimationsModule, AnimationRenderer as ɵAnimationRenderer, AnimationRendererFactory as ɵAnimationRendererFactory, BrowserAnimationBuilder as ɵBrowserAnimationBuilder, BrowserAnimationFactory as ɵBrowserAnimationFactory, InjectableAnimationEngine as ɵInjectableAnimationEngine, instantiateSupportedAnimationDriver as ɵangular_packages_platform_browser_animations_animations_a, instantiateDefaultStyleNormalizer as ɵangular_packages_platform_browser_animations_animations_b, instantiateRendererFactory as ɵangular_packages_platform_browser_animations_animations_c, BROWSER_ANIMATIONS_PROVIDERS as ɵangular_packages_platform_browser_animations_animations_d, BROWSER_NOOP_ANIMATIONS_PROVIDERS as ɵangular_packages_platform_browser_animations_animations_e, BaseAnimationRenderer as ɵangular_packages_platform_browser_animations_animations_f };
488//# sourceMappingURL=animations.js.map