Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Include Dynalene System and MTAirCompressor devices to Facility Map #474

Merged
merged 3 commits into from
Jun 27, 2023
Merged

Include Dynalene System and MTAirCompressor devices to Facility Map #474

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f6724c1
Include Dynalene System and MTAirCompressor
MiaRoseElbo Jun 16, 2023
1eb2875
Update CHANGELOG
MiaRoseElbo Jun 19, 2023
ad34263
Apply changes requested by sebastian-aranda
MiaRoseElbo Jun 20, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 28 additions & 3 deletions love/src/components/Facility/FacilityMap.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import Map from './Map/Map.jsx';
import Device from './Map/Device.jsx';
import EyeIcon from '../icons/EyeIcon/EyeIcon';
import SimpleArrowIcon from '../icons/SimpleArrowIcon/SimpleArrowIcon';
import { thresholdScott } from 'd3';

export default class FacilityMap extends Component {
constructor(props) {
Expand Down Expand Up @@ -176,8 +177,23 @@ export default class FacilityMap extends Component {

render() {
const { showHVAC, showPower } = this.state;

const HVACDataLevel1 = {
compressorInfo1: this.props.compressorInfo1,
connectionStatus1: this.props.connectionStatus1,
errors1: this.props.errors1,
status1: this.props.status1,
timerInfo1: this.props.timerInfo1,
warnings1: this.props.warnings1,
analogData1: this.props.analogData1,

compressorInfo2: this.props.compressorInfo2,
connectionStatus2: this.props.connectionStatus2,
errors2: this.props.errors2,
status2: this.props.status2,
timerInfo2: this.props.timerInfo2,
warnings2: this.props.warnings2,
analogData2: this.props.analogData2,

bombaAguaFriaP01: this.props.bombaAguaFriaP01,
chiller01P01: this.props.chiller01P01,
chiller02P01: this.props.chiller02P01,
Expand Down Expand Up @@ -214,6 +230,15 @@ export default class FacilityMap extends Component {
};

const HVACDataLevel5 = {
dynaleneP05Events: {
dynMainGridAlarm: this.props.dynMainGridAlarm,
dynMainGridFailureFlag: this.props.dynMainGridFailureFlag,
dynSafetyResetFlag: this.props.dynSafetyResetFlag,
dynTAalarm: this.props.dynTAalarm,
dynTMAalarm: this.props.dynTMAalarm,
dynaleneState: this.props.dynaleneState,
dynaleneTankLevel: this.props.dynaleneTankLevel,
},
dynaleneP05: this.props.dynaleneP05,
manejadoraLower01P05: this.props.manejadoraLower01P05,
manejadoraLower02P05: this.props.manejadoraLower02P05,
Expand All @@ -238,10 +263,10 @@ export default class FacilityMap extends Component {
<div className={this.state.showMenu ? styles.leftMenu : [styles.leftMenu, styles.hideLeftMenu].join(' ')}>
{/** CSC Section **/}
<div className={styles.cscMenu}>
<div className={styles.title}>CSC</div>
<div className={styles.title}>Devices</div>

<div className={styles.section}>
<div>HVAC</div>
<div>SHOW</div>
<div className={styles.iconWrapper} onClick={() => this.hideHVAC()}>
{this.getEyeIcon(showHVAC)}
</div>
Expand Down
115 changes: 106 additions & 9 deletions love/src/components/Facility/Map/Device.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,32 @@ export default class Device extends Component {
return `${styles.bgStatusOk}`;
case 'false':
return `${styles.bgStatusAlert}`;
case 'null':
return `${styles.bgStatusNull}`;
case 'Initialized':
return `${styles.bgStatusOk}`;
case 'Shutting Down':
return `${styles.bgStatusWarning}`;
case 'Powering On':
return `${styles.bgStatusWarning}`;
case 'Powered On':
return `${styles.bgStatusOk}`;
case 'Powering Off':
return `${styles.bgStatusWarning}`;
case 'Powered Off':
return `${styles.bgStatusAlert}`;
case 'Warning':
return `${styles.bgStatusWarning}`;
case 'Alarm':
return `${styles.bgStatusAlert}`;
case 'Shut Off':
return `${styles.bgStatusDisabled}`;
case 'Max Speed':
return `${styles.bgStatusWarning}`;
case 'Min Speed':
return `${styles.bgStatusWarning}`;
case 'Nominal':
return `${styles.bgStatusOk}`;
default:
return `${styles.bgStatusNull}`;
}
Expand All @@ -98,8 +124,32 @@ export default class Device extends Component {
return `${styles.statusOk}`;
case 'false':
return `${styles.statusAlert}`;
default:
case 'Initialized':
return `${styles.statusOk}`;
case 'Shutting Down':
return `${styles.statusWarning}`;
case 'Powering On':
return `${styles.statusWarning}`;
case 'Powered On':
return `${styles.statusOk}`;
case 'Powering Off':
return `${styles.statusWarning}`;
case 'Powered Off':
return `${styles.statusAlert}`;
case 'Warning':
return `${styles.statusWarning}`;
case 'Alarm':
return `${styles.statusAlert}`;
case 'Shut Off':
return `${styles.statusDisabled}`;
case 'Max Speed':
return `${styles.statusWarning}`;
case 'Min Speed':
return `${styles.statusWarning}`;
case 'Nominal':
return `${styles.statusOk}`;
default:
return `${styles.statusNull}`;
}
}

Expand Down Expand Up @@ -130,15 +180,17 @@ export default class Device extends Component {
const alarmsKeys = Object.keys(alarms);
const rowLength = Math.round(width / 42 - 1);

let transX, transY, currentRow, currentCol;
let transX, transY, currentRow, currentCol, currentAlarm;
transX = 0;
transY = 0;
currentAlarm = 0;

return alarmsKeys.map((x, k) => {
if (alarms[x].state) {
transX = 0;
transY = 0;
currentRow = Math.ceil((k + 1) / rowLength);
currentCol = (k + 1) % currentRow;
transX = 42 * (k + 1 - rowLength * (currentRow - 1)) - 42;
currentAlarm++;
currentRow = Math.ceil(currentAlarm / rowLength);
currentCol = currentAlarm % currentRow;
transX = 42 * (currentAlarm - rowLength * (currentRow - 1)) - 42;

if (hidden) {
transY = 12 * (currentRow - 1);
Expand Down Expand Up @@ -172,9 +224,39 @@ export default class Device extends Component {
let i = 0;
let j = 38;

//////////////////////////////////////////////////////////////////////////////
//
// *** Devices Parameter Types ***
//
// title = Displays a row text with no data
// status = Styles as Summary States
// single = Displayed as a single row.
// They have a name and a value which may have a unit.
// Value must be a number!
// test = Like single but its text and has no unit.
// group = if it's none of the above, and has parameters it's a group.
// Parameters inside a group are listed horizontally, not vertically
// badge = styled inside a badge
// box = styled inside a box that might have a status color
// noBox = styles like box, but without the box
//
//////////////////////////////////////////////////////////////////////////////

return parametersKeys.map((x) => {
//Title Parameters just serve as a title for following single or status parameters
if (parameters[x].type === 'title') {
i = j;
j = j + rowHeight;
return (
<g transform={'translate(0 ' + i + ')'}>
<text className={styles.paramGroup} transform={'translate(' + gutter + ' 0)'} textAnchor="start">
<tspan>{parameters[x].name}</tspan>
</text>
</g>
);
}
//Status Parameters are styled as Summary States.
if (parameters[x].type === 'status') {
else if (parameters[x].type === 'status') {
i = j;
j = j + rowHeight;
return (
Expand All @@ -190,6 +272,7 @@ export default class Device extends Component {
ry={5}
transform={'translate(' + (width - (30 + gutter)) + ' ' + -5 + ')'}
/>

<text
className={this.statusTextToStyle(String(parameters[x].value))}
transform={'translate(' + (width - 19) + ' 0)'}
Expand All @@ -215,9 +298,23 @@ export default class Device extends Component {
</text>
</g>
);
} else if (parameters[x].type === 'text') {
i = j;
j = j + rowHeight;
return (
<g transform={'translate(0 ' + i + ')'}>
<text className={styles.param} transform={'translate(4 0)'} textAnchor="start">
<tspan>{parameters[x].name}</tspan>
</text>
<text className={styles.paramVal} transform={'translate(' + (width - 19) + ' 0)'} textAnchor="middle">
<tspan>{parameters[x].value}</tspan>
</text>
</g>
);
}

//Group Parameters are those that are grouped under a specific Title. This title might have a value and units as well.
//Group Parameters are those that are grouped under a specific Title.
//This title might have a value and units as well.
else {
i = j;
j = j + rowHeight * 3;
Expand Down
6 changes: 3 additions & 3 deletions love/src/components/Facility/Map/Device.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@
font-size: 4px;
}
.statusDisabled {
fill: var(--status-disabled-color);
fill: var(--secondary-font-color);
font-size: 4px;
}
.statusNull {
Expand All @@ -88,11 +88,11 @@
font-size: 4px;
}
.bgStatusDisabled {
fill: var(--status-disabled-dimmed-color-3);
fill: var(--second-tertiary-background-color);
font-size: 4px;
}
.bgStatusNull {
fill: var(--status-disabled-dimmed-color-3);
fill: var(--second-tertiary-background-color);
font-size: 4px;
}

Expand Down
Loading