Files
CloudSimWebApp/webapp/src/components/control/controls.jsx
2023-10-27 14:10:48 +02:00

112 lines
3.1 KiB
JavaScript

import React from 'react';
import './controls.css'
// import { sendMsg } from '../api';
import Tracklist from './Tracklist'
import EntityControl from './EntityControl';
import round from '../Utils';
// import {w3cwebsocket as W3CWebSocket} from "websocket"
// const config = {
// // apiUrl: process.env.REACT_APP_WEBAPP_WS_URL,
// apiUrl: "192.168.3.13",
// apiProt: 30747
// }
// const client = new W3CWebSocket("ws://"+config.apiUrl+":"+config.apiProt+"/");
// const round = (n, dp) => {
// const h = +('1'.padEnd(dp + 1, '0')) // 10 or 100 or 1000 or etc
// return Math.round(n * h) / h
// }
class Controls extends React.Component
{
state = {
EntityOnFocus: undefined,
}
componentDidMount()
{
// client.onopen = () => {
// console.log(" Control Websocket Client Connected");
// };
// client.onmessage = (message) => {
// const dataFromServer = JSON.parse(message.data);
// console.log('reply', dataFromServer);
// }
}
render() {
function getEntityFromID(Entities, SelectedEntity)
{
if(SelectedEntity !== undefined)
{
var tmp = {};
// tmp.NewPos= new Array(0,0);
// console.log(tmp);
Entities.map((val) => {
if(val.id === SelectedEntity.EntityID)
{
tmp = val
// tmp = JSON.parse(JSON.stringify(val));
// console.log(tmp);
val.dragged = SelectedEntity.dragged;
if(SelectedEntity.dragged === undefined)
{
val.dragged = false;
}
// console.log(SelectedEntity);
// if(SelectedEntity.NewPos !== undefined)
// {
// // Object.assign(tmp, {NewPos: [{},{}]});
// Object.assign(val, {NewPos: [{},{}]});
// // tmp.OldPos = val.Position;
// // Object.assign(tmp, {NewPos: [round(SelectedEntity.NewPos[0],3),0]});
// // val.NewPos = SelectedEntity.NewPos;
// val.NewPos[0] = round(SelectedEntity.NewPos[0],3);
// val.NewPos[1] = round(SelectedEntity.NewPos[1],3);
// // tmp.NewPos[0] = round(SelectedEntity.NewPos[0],3);
// // tmp.NewPos[1] = round(SelectedEntity.NewPos[1],3);
// }
// tmp.NewPos = SelectedEntity.NewPos;
}
return tmp;
})
// console.log(tmp);
return tmp;
}
}
// console.log(getEntityFromID(this.props.Entities,this.props.EntityOnFocus));
return (
<div className="controls">
<Tracklist entities= {this.props.Entities} />
<br />
<div>
{/* <button onClick={this.props.updateEntities}>update</button> */}
<EntityControl Functions = {this.props.Functions} Client = { this.props.Client } Entity = { getEntityFromID(this.props.Entities,this.props.EntityOnFocus)} EntityOnFocus= {this.props.EntityOnFocus} PositionCliecked = {this.props.PositionClicked}/>
</div>
</div>
);
}
}
export default Controls;