Commit 7cff401c authored by Vladimir Kiryakov's avatar Vladimir Kiryakov
Browse files

clickable chart overlay

parent b7f6ae92
......@@ -59,7 +59,7 @@ class Chart extends PureComponent {
};
return (
<TextOverlay showLoader={!isConnected} text="MQTT is not connected" >
<TextOverlay showLoader={!isConnected} text="MQTT is not connected" forwardMouseEvent >
<div className={classNames('text-muted', className)}>
<label>Accelerometer</label>
<C3Chart key={Math.random()} data={data} size={{
......
import React from 'react';
import styled from 'styled-components';
import PropTypes from "prop-types";
const Overlay = styled.div`
......@@ -10,7 +11,16 @@ const Overlay = styled.div`
background-color: rgba(255, 255, 255, 0.5);
z-index: 2;
cursor: not-allowed;
pointer-events: ${props => props.forwardMouseEvent ? 'none' : 'all'};
`;
Overlay.propTypes = {
forwardMouseEvent: PropTypes.bool,
};
Overlay.defaultProps = {
forwardMouseEvent: false
};
export default Overlay;
\ No newline at end of file
......@@ -16,7 +16,7 @@ const CenteredText = styled.div`
const TextOverlay = ({className, showLoader, children, text}) => (
<div className={className}>
{showLoader ? <Overlay><CenteredText className="text-muted">{text}</CenteredText></Overlay> : null}
{showLoader ? <Overlay forwardMouseEvent><CenteredText className="text-muted">{text}</CenteredText></Overlay> : null}
{children}
</div>
);
......@@ -25,6 +25,7 @@ TextOverlay.propTypes = {
showLoader: PropTypes.bool,
className: PropTypes.string,
text: PropTypes.string,
forwardMouseEvent: PropTypes.bool,
children: PropTypes.oneOfType([
PropTypes.arrayOf(PropTypes.node),
PropTypes.node
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment