You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

App.web.js 4.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. import { AtlasKitThemeProvider } from '@atlaskit/theme';
  2. import React from 'react';
  3. import '../../base/responsive-ui';
  4. import { getLocationContextRoot } from '../../base/util';
  5. import '../../chat';
  6. import '../../room-lock';
  7. import { AbstractApp } from './AbstractApp';
  8. /**
  9. * Root application component.
  10. *
  11. * @extends AbstractApp
  12. */
  13. export class App extends AbstractApp {
  14. /**
  15. * App component's property types.
  16. *
  17. * @static
  18. */
  19. static propTypes = AbstractApp.propTypes;
  20. /**
  21. * Initializes a new App instance.
  22. *
  23. * @param {Object} props - The read-only React Component props with which
  24. * the new instance is to be initialized.
  25. */
  26. constructor(props) {
  27. super(props);
  28. this.state = {
  29. ...this.state,
  30. /**
  31. * The context root of window.location i.e. this Web App.
  32. *
  33. * @type {string}
  34. */
  35. windowLocationContextRoot: this._getWindowLocationContextRoot()
  36. };
  37. }
  38. /**
  39. * Overrides the parent method to inject {@link AtlasKitThemeProvider} as
  40. * the top most component.
  41. *
  42. * @override
  43. */
  44. _createElement(component, props) {
  45. return (
  46. <AtlasKitThemeProvider mode = 'dark'>
  47. { super._createElement(component, props) }
  48. </AtlasKitThemeProvider>
  49. );
  50. }
  51. /**
  52. * Gets a Location object from the window with information about the current
  53. * location of the document.
  54. *
  55. * @inheritdoc
  56. */
  57. getWindowLocation() {
  58. return window.location;
  59. }
  60. /**
  61. * Gets the context root of this Web App from window.location.
  62. *
  63. * @private
  64. * @returns {string} The context root of window.location i.e. this Web App.
  65. */
  66. _getWindowLocationContextRoot() {
  67. return getLocationContextRoot(this.getWindowLocation());
  68. }
  69. /**
  70. * Navigates to a specific Route (via platform-specific means).
  71. *
  72. * @param {Route} route - The Route to which to navigate.
  73. * @protected
  74. * @returns {void}
  75. */
  76. _navigate(route) {
  77. let path;
  78. if (route) {
  79. path = route.path;
  80. const store = this._getStore();
  81. // The syntax :room bellow is defined by react-router. It "matches a
  82. // URL segment up to the next /, ?, or #. The matched string is
  83. // called a param."
  84. path
  85. = path.replace(
  86. /:room/g,
  87. store.getState()['features/base/conference'].room);
  88. path = this._routePath2WindowLocationPathname(path);
  89. }
  90. // Navigate to the specified Route.
  91. const windowLocation = this.getWindowLocation();
  92. let promise;
  93. if (!route || windowLocation.pathname === path) {
  94. // The browser is at the specified path already and what remains is
  95. // to make this App instance aware of the route to be rendered at
  96. // the current location.
  97. // XXX Refer to the super's _navigate for an explanation why a
  98. // Promise is returned.
  99. promise = super._navigate(route);
  100. } else {
  101. // The browser must go to the specified location. Once the specified
  102. // location becomes current, the App will be made aware of the route
  103. // to be rendered at it.
  104. windowLocation.pathname = path;
  105. }
  106. return promise || Promise.resolve();
  107. }
  108. /**
  109. * Converts a specific Route path to a window.location.pathname.
  110. *
  111. * @param {string} path - A Route path to be converted to/represeted as a
  112. * window.location.pathname.
  113. * @private
  114. * @returns {string} A window.location.pathname-compatible representation of
  115. * the specified Route path.
  116. */
  117. _routePath2WindowLocationPathname(path) {
  118. let pathname = this.state.windowLocationContextRoot;
  119. pathname.endsWith('/') || (pathname += '/');
  120. pathname += path.startsWith('/') ? path.substring(1) : path;
  121. return pathname;
  122. }
  123. }