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.4KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. import React from 'react';
  2. import { connect } from 'react-redux';
  3. import { translate } from '../../base/i18n';
  4. import AbstractPageReloadOverlay, { abstractMapStateToProps }
  5. from './AbstractPageReloadOverlay';
  6. import OverlayFrame from './OverlayFrame';
  7. /**
  8. * Implements a React Component for page reload overlay. Shown before the
  9. * conference is reloaded. Shows a warning message and counts down towards the
  10. * reload.
  11. */
  12. class PageReloadOverlay extends AbstractPageReloadOverlay {
  13. /**
  14. * Implements React's {@link Component#render()}.
  15. *
  16. * @inheritdoc
  17. * @returns {ReactElement}
  18. */
  19. render() {
  20. const { isNetworkFailure, t } = this.props;
  21. const { message, timeLeft, title } = this.state;
  22. return (
  23. <OverlayFrame isLightOverlay = { isNetworkFailure }>
  24. <div className = 'inlay'>
  25. <span
  26. className = 'reload_overlay_title'>
  27. { t(title) }
  28. </span>
  29. <span className = 'reload_overlay_text'>
  30. { t(message, { seconds: timeLeft }) }
  31. </span>
  32. { this._renderProgressBar() }
  33. { this._renderButton() }
  34. </div>
  35. </OverlayFrame>
  36. );
  37. }
  38. }
  39. export default translate(connect(abstractMapStateToProps)(PageReloadOverlay));