您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

App.web.js 4.0KB

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