Front end of the Slack clone application.

app-root.js 6.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. import { Component, ComponentFactoryResolver, ElementRef, Inject, InjectionToken, Renderer, ViewChild, ViewContainerRef } from '@angular/core';
  2. import { App } from './app';
  3. import { Config } from '../../config/config';
  4. import { Ion } from '../ion';
  5. import { OverlayPortal } from './overlay-portal';
  6. import { Platform } from '../../platform/platform';
  7. import * as Constants from './app-constants';
  8. export const AppRootToken = new InjectionToken('USERROOT');
  9. /**
  10. * @hidden
  11. */
  12. export class IonicApp extends Ion {
  13. constructor(_userCmp, _cfr, elementRef, renderer, config, _plt, app) {
  14. super(config, elementRef, renderer, 'app-root');
  15. this._userCmp = _userCmp;
  16. this._cfr = _cfr;
  17. this._plt = _plt;
  18. // register with App that this is Ionic's appRoot component. tada!
  19. app._appRoot = this;
  20. this._stopScrollPlugin = window['IonicStopScroll'];
  21. }
  22. ngOnInit() {
  23. // load the user root component
  24. // into Ionic's root component
  25. const factory = this._cfr.resolveComponentFactory(this._userCmp);
  26. const componentRef = this._viewport.createComponent(factory);
  27. this._renderer.setElementClass(componentRef.location.nativeElement, 'app-root', true);
  28. componentRef.changeDetectorRef.detectChanges();
  29. // set the mode class name
  30. // ios/md/wp
  31. this.setElementClass(this._config.get('mode'), true);
  32. const versions = this._plt.versions();
  33. this._plt.platforms().forEach(platformName => {
  34. // platform-ios
  35. let platformClass = 'platform-' + platformName;
  36. this.setElementClass(platformClass, true);
  37. let platformVersion = versions[platformName];
  38. if (platformVersion) {
  39. // platform-ios9
  40. platformClass += platformVersion.major;
  41. this.setElementClass(platformClass, true);
  42. // platform-ios9_3
  43. this.setElementClass(platformClass + '_' + platformVersion.minor, true);
  44. }
  45. });
  46. // touch devices should not use :hover CSS pseudo
  47. // enable :hover CSS when the "hoverCSS" setting is not false
  48. if (this._config.getBoolean('hoverCSS', true)) {
  49. this.setElementClass('enable-hover', true);
  50. }
  51. // sweet, the app root has loaded!
  52. // which means angular and ionic has fully loaded!
  53. // fire off the platform prepare ready, which could
  54. // have been switched out by any of the platform engines
  55. this._plt.prepareReady();
  56. }
  57. /**
  58. * @hidden
  59. */
  60. _getPortal(portal) {
  61. if (portal === Constants.PORTAL_LOADING) {
  62. return this._loadingPortal;
  63. }
  64. if (portal === Constants.PORTAL_TOAST) {
  65. return this._toastPortal;
  66. }
  67. // Modals need their own overlay becuase we don't want an ActionSheet
  68. // or Alert to trigger lifecycle events inside a modal
  69. if (portal === Constants.PORTAL_MODAL) {
  70. return this._modalPortal;
  71. }
  72. return this._overlayPortal;
  73. }
  74. _getActivePortal() {
  75. const defaultPortal = this._overlayPortal;
  76. const modalPortal = this._modalPortal;
  77. const hasModal = modalPortal.length() > 0;
  78. const hasDefault = defaultPortal.length() > 0;
  79. if (!hasModal && !hasDefault) {
  80. return null;
  81. }
  82. else if (hasModal && hasDefault) {
  83. var defaultIndex = defaultPortal.getActive().getZIndex();
  84. var modalIndex = modalPortal.getActive().getZIndex();
  85. if (defaultIndex > modalIndex) {
  86. return defaultPortal;
  87. }
  88. else {
  89. (void 0) /* assert */;
  90. return modalPortal;
  91. }
  92. }
  93. if (hasModal) {
  94. return modalPortal;
  95. }
  96. else if (hasDefault) {
  97. return defaultPortal;
  98. }
  99. }
  100. _disableScroll(shouldDisableScroll) {
  101. if (shouldDisableScroll) {
  102. this.stopScroll().then(() => {
  103. this._tmr = this._plt.timeout(() => {
  104. (void 0) /* console.debug */;
  105. this.setElementClass('disable-scroll', true);
  106. }, 32);
  107. });
  108. }
  109. else {
  110. let plugin = this._stopScrollPlugin;
  111. if (plugin && plugin.cancel) {
  112. plugin.cancel();
  113. }
  114. clearTimeout(this._tmr);
  115. (void 0) /* console.debug */;
  116. this.setElementClass('disable-scroll', false);
  117. }
  118. }
  119. stopScroll() {
  120. if (this._stopScrollPlugin) {
  121. return new Promise((resolve) => {
  122. this._stopScrollPlugin.stop(() => resolve(true));
  123. });
  124. }
  125. else {
  126. return Promise.resolve(false);
  127. }
  128. }
  129. }
  130. IonicApp.decorators = [
  131. { type: Component, args: [{
  132. selector: 'ion-app',
  133. template: '<div #viewport app-viewport></div>' +
  134. '<div #modalPortal overlay-portal></div>' +
  135. '<div #overlayPortal overlay-portal></div>' +
  136. '<div #loadingPortal class="loading-portal" overlay-portal></div>' +
  137. '<div #toastPortal class="toast-portal" [overlay-portal]="10000"></div>' +
  138. '<div class="click-block"></div>'
  139. },] },
  140. ];
  141. /** @nocollapse */
  142. IonicApp.ctorParameters = () => [
  143. { type: undefined, decorators: [{ type: Inject, args: [AppRootToken,] },] },
  144. { type: ComponentFactoryResolver, },
  145. { type: ElementRef, },
  146. { type: Renderer, },
  147. { type: Config, },
  148. { type: Platform, },
  149. { type: App, },
  150. ];
  151. IonicApp.propDecorators = {
  152. '_viewport': [{ type: ViewChild, args: ['viewport', { read: ViewContainerRef },] },],
  153. '_modalPortal': [{ type: ViewChild, args: ['modalPortal', { read: OverlayPortal },] },],
  154. '_overlayPortal': [{ type: ViewChild, args: ['overlayPortal', { read: OverlayPortal },] },],
  155. '_loadingPortal': [{ type: ViewChild, args: ['loadingPortal', { read: OverlayPortal },] },],
  156. '_toastPortal': [{ type: ViewChild, args: ['toastPortal', { read: OverlayPortal },] },],
  157. };
  158. //# sourceMappingURL=app-root.js.map