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.

PageReloadOverlay.js 1.6KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. import React from 'react';
  2. import { translate } from '../../base/i18n';
  3. import AbstractPageReloadOverlay from './AbstractPageReloadOverlay';
  4. import OverlayFrame from './OverlayFrame';
  5. /**
  6. * Implements a React Component for page reload overlay. Shown before the
  7. * conference is reloaded. Shows a warning message and counts down towards the
  8. * reload.
  9. */
  10. class PageReloadOverlay extends AbstractPageReloadOverlay {
  11. /**
  12. * PageReloadOverlay component's property types.
  13. *
  14. * @static
  15. */
  16. static propTypes = {
  17. ...AbstractPageReloadOverlay.propTypes,
  18. /**
  19. * The function to translate human-readable text.
  20. *
  21. * @public
  22. * @type {Function}
  23. */
  24. t: React.PropTypes.func
  25. };
  26. /**
  27. * Implements React's {@link Component#render()}.
  28. *
  29. * @inheritdoc
  30. * @returns {ReactElement|null}
  31. */
  32. render() {
  33. const { isNetworkFailure, t } = this.props;
  34. const { message, timeLeft, title } = this.state;
  35. return (
  36. <OverlayFrame isLightOverlay = { isNetworkFailure }>
  37. <div className = 'inlay'>
  38. <span
  39. className = 'reload_overlay_title'>
  40. { t(title) }
  41. </span>
  42. <span className = 'reload_overlay_text'>
  43. { t(message, { seconds: timeLeft }) }
  44. </span>
  45. { this._renderProgressBar() }
  46. { this._renderButton() }
  47. </div>
  48. </OverlayFrame>
  49. );
  50. }
  51. }
  52. export default translate(PageReloadOverlay);