diff --git a/src/components/gui/gui.jsx b/src/components/gui/gui.jsx index b1f6cc44ed595b0b0b365dd88bc556b3870a63c5..a203310b1b0ad15e7ec4c04fa1256685009188eb 100644 --- a/src/components/gui/gui.jsx +++ b/src/components/gui/gui.jsx @@ -141,6 +141,7 @@ const GUIComponent = props => { <StageWrapper isRendererSupported={isRendererSupported} isRtl={isRtl} + loading={loading} stageSize={STAGE_SIZE_MODES.large} vm={vm} > diff --git a/src/components/loader/loader.css b/src/components/loader/loader.css index 1b6ab40ce6598e93ea56a9dd65755002a39cf324..a1f0003c332b3b3811800112e2a2862970cdf3a8 100644 --- a/src/components/loader/loader.css +++ b/src/components/loader/loader.css @@ -2,7 +2,7 @@ @import "../../css/z-index.css"; .background { - position: fixed; + position: absolute; top: 0; left: 0; width: 100%; diff --git a/src/components/stage-wrapper/stage-wrapper.jsx b/src/components/stage-wrapper/stage-wrapper.jsx index 021f6742ba6c799c2f3d122df872c200bc29ea34..821e2c001cc89ab0e9b314bc533123728a08e18a 100644 --- a/src/components/stage-wrapper/stage-wrapper.jsx +++ b/src/components/stage-wrapper/stage-wrapper.jsx @@ -6,6 +6,7 @@ import Box from '../box/box.jsx'; import {STAGE_DISPLAY_SIZES} from '../../lib/layout-constants.js'; import StageHeader from '../../containers/stage-header.jsx'; import Stage from '../../containers/stage.jsx'; +import Loader from '../loader/loader.jsx'; import styles from './stage-wrapper.css'; @@ -13,6 +14,7 @@ const StageWrapperComponent = function (props) { const { isRtl, isRendererSupported, + loading, stageSize, vm } = props; @@ -38,6 +40,9 @@ const StageWrapperComponent = function (props) { null } </Box> + {loading ? ( + <Loader /> + ) : null} </Box> ); }; @@ -45,6 +50,7 @@ const StageWrapperComponent = function (props) { StageWrapperComponent.propTypes = { isRendererSupported: PropTypes.bool.isRequired, isRtl: PropTypes.bool, + loading: PropTypes.bool, stageSize: PropTypes.oneOf(Object.keys(STAGE_DISPLAY_SIZES)).isRequired, vm: PropTypes.instanceOf(VM).isRequired };