diff --git a/src/components/dialog.js b/src/components/dialog/dialog.js similarity index 100% rename from src/components/dialog.js rename to src/components/dialog/dialog.js diff --git a/src/components/dialog/edit-simulation.js b/src/components/dialog/edit-simulation.js new file mode 100644 index 0000000..af9dfa4 --- /dev/null +++ b/src/components/dialog/edit-simulation.js @@ -0,0 +1,83 @@ +/** + * File: new-simulation.js + * Author: Markus Grigull + * Date: 04.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + +import React, { Component, PropTypes } from 'react'; +import { FormGroup, FormControl, ControlLabel } from 'react-bootstrap'; + +import Dialog from './dialog'; + +class EditSimulationDialog extends Component { + static propTypes = { + show: PropTypes.bool.isRequired, + onClose: PropTypes.func.isRequired, + simulation: PropTypes.object.isRequired + }; + + valid: false; + + constructor(props) { + super(props); + + this.state = { + name: '', + _id: '' + } + } + + onClose(canceled) { + if (canceled === false) { + this.props.onClose(this.state); + } else { + this.props.onClose(); + } + } + + handleChange(e) { + this.setState({ [e.target.id]: e.target.value }); + } + + resetState() { + this.setState({ + name: this.props.simulation.name, + _id: this.props.simulation._id + }); + } + + validateForm(target) { + // check all controls + var name = true; + + if (this.state.name === '') { + name = false; + } + + this.valid = name; + + // return state to control + if (target === 'name') return name ? "success" : "error"; + + return "success"; + } + + render() { + return ( + this.onClose(c)} onReset={() => this.resetState()} valid={this.valid}> +
+ + Name + this.handleChange(e)} /> + + +
+ + ); + } +} + +export default EditSimulationDialog; diff --git a/src/components/dialog-edit-simulator.js b/src/components/dialog/edit-simulator.js similarity index 95% rename from src/components/dialog-edit-simulator.js rename to src/components/dialog/edit-simulator.js index bddec15..ad6fa39 100644 --- a/src/components/dialog-edit-simulator.js +++ b/src/components/dialog/edit-simulator.js @@ -1,5 +1,5 @@ /** - * File: dialog-new-simulator.js + * File: new-simulator.js * Author: Markus Grigull * Date: 02.03.2017 * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC @@ -87,14 +87,17 @@ class EditSimulatorDialog extends Component { Name this.handleChange(e)} /> + Simulator ID this.handleChange(e)} /> + Endpoint this.handleChange(e)} /> + diff --git a/src/components/dialog-edit-visualization.js b/src/components/dialog/edit-visualization.js similarity index 96% rename from src/components/dialog-edit-visualization.js rename to src/components/dialog/edit-visualization.js index 5284c7a..e31f96a 100644 --- a/src/components/dialog-edit-visualization.js +++ b/src/components/dialog/edit-visualization.js @@ -1,5 +1,5 @@ /** - * File: dialog-new-visualization.js + * File: new-visualization.js * Author: Markus Grigull * Date: 03.03.2017 * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC @@ -72,6 +72,7 @@ class EditVisualizationDialog extends Component { Name this.handleChange(e)} /> + diff --git a/src/components/dialog/new-simulation.js b/src/components/dialog/new-simulation.js new file mode 100644 index 0000000..617f00b --- /dev/null +++ b/src/components/dialog/new-simulation.js @@ -0,0 +1,76 @@ +/** + * File: new-simulation.js + * Author: Markus Grigull + * Date: 04.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + +import React, { Component, PropTypes } from 'react'; +import { FormGroup, FormControl, ControlLabel } from 'react-bootstrap'; + +import Dialog from './dialog'; + +class NewSimulationDialog extends Component { + static propTypes = { + show: PropTypes.bool.isRequired, + onClose: PropTypes.func.isRequired + }; + + valid: false; + + constructor(props) { + super(props); + + this.state = { + name: '' + }; + } + + onClose(canceled) { + if (canceled === false) { + this.props.onClose(this.state); + } else { + this.props.onClose(); + } + } + + handleChange(e) { + this.setState({ [e.target.id]: e.target.value }); + } + + resetState() { + this.setState({ name: '' }); + } + + validateForm(target) { + // check all controls + var name = true; + + if (this.state.name === '') { + name = false; + } + + this.valid = name; + + // return state to control + if (target === 'name') return name ? "success" : "error"; + } + + render() { + return ( + this.onClose(c)} onReset={() => this.resetState()} valid={this.valid}> +
+ + Name + this.handleChange(e)} /> + + +
+ + ); + } +} + +export default NewSimulationDialog; diff --git a/src/components/dialog-new-simulator.js b/src/components/dialog/new-simulator.js similarity index 95% rename from src/components/dialog-new-simulator.js rename to src/components/dialog/new-simulator.js index 93a074e..87eb407 100644 --- a/src/components/dialog-new-simulator.js +++ b/src/components/dialog/new-simulator.js @@ -1,5 +1,5 @@ /** - * File: dialog-new-simulator.js + * File: new-simulator.js * Author: Markus Grigull * Date: 02.03.2017 * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC @@ -80,14 +80,17 @@ class NewSimulatorDialog extends Component { Name this.handleChange(e)} /> + Simulator ID this.handleChange(e)} /> + Endpoint this.handleChange(e)} /> + diff --git a/src/components/dialog-new-visualization.js b/src/components/dialog/new-visualization.js similarity index 96% rename from src/components/dialog-new-visualization.js rename to src/components/dialog/new-visualization.js index d24aa6e..06b3c73 100644 --- a/src/components/dialog-new-visualization.js +++ b/src/components/dialog/new-visualization.js @@ -1,5 +1,5 @@ /** - * File: dialog-new-visualization.js + * File: new-visualization.js * Author: Markus Grigull * Date: 03.03.2017 * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC @@ -67,6 +67,7 @@ class NewVisualzationDialog extends Component { Name this.handleChange(e)} /> + diff --git a/src/components/menu-sidebar.js b/src/components/menu-sidebar.js index b396169..509f33d 100644 --- a/src/components/menu-sidebar.js +++ b/src/components/menu-sidebar.js @@ -19,7 +19,7 @@ class SidebarMenu extends Component {
  • Home
  • Projects
    • -
  • Simulations
    • +
  • Simulations
  • Simulators
  • Visualizations
diff --git a/src/components/table-column.js b/src/components/table-column.js new file mode 100644 index 0000000..d657859 --- /dev/null +++ b/src/components/table-column.js @@ -0,0 +1,32 @@ +/** + * File: table-column.js + * Author: Markus Grigull + * Date: 06.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + +import React, { Component } from 'react'; + +class TableColumn extends Component { + static defaultProps = { + title: '', + modifier: null, + width: null, + editButton: false, + deleteButton: false, + link: '/', + linkKey: '' + }; + + render() { + return ( + + {this.props.title} + + ); + } +} + +export default TableColumn; diff --git a/src/components/table-control-link.js b/src/components/table-control-link.js deleted file mode 100644 index 4e9c87a..0000000 --- a/src/components/table-control-link.js +++ /dev/null @@ -1,75 +0,0 @@ -/** - * File: table-control-link.js - * Author: Markus Grigull - * Date: 03.03.2017 - * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC - * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. - * Unauthorized copying of this file, via any medium is strictly prohibited. - **********************************************************************************/ - -import React, { Component, PropTypes } from 'react'; -import { Button, Glyphicon } from 'react-bootstrap'; -import { Link } from 'react-router'; - -class ControlLinkTable extends Component { - static propTypes = { - columns: PropTypes.array.isRequired, - onEdit: PropTypes.func.isRequired, - onDelete: PropTypes.func.isRequired, - linkRoot: PropTypes.string.isRequired - }; - - render() { - // create sorted rows - var rows = this.props.data.map(row => { - // add cells by column keys - var rowArray = [ row._id ]; - - for (var i = 0; i < this.props.columns.length; i++) { - if (row[this.props.columns[i].key] != null) { - rowArray.push(row[this.props.columns[i].key].toString()); - } else { - rowArray.push(""); - } - } - - return rowArray; - }); - - return ( - - - - {this.props.columns.map(column => ( - - ))} - - - - - {rows.map((row) => ( - - {row.filter((element, index) => { - return index !== 0; - }).map((cell, index) => ( - - ))} - - - ))} - -
{column.title}
- {index === 0 ? ( - {cell} - ) : ( - {cell} - )} - - - -
- ); - } -} - -export default ControlLinkTable; diff --git a/src/components/table-control.js b/src/components/table-control.js deleted file mode 100644 index ea12ca8..0000000 --- a/src/components/table-control.js +++ /dev/null @@ -1,61 +0,0 @@ -/** - * File: table-control.js - * Author: Markus Grigull - * Date: 02.03.2017 - * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC - * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. - * Unauthorized copying of this file, via any medium is strictly prohibited. - **********************************************************************************/ - -import React, { Component } from 'react'; -import { Button, Glyphicon } from 'react-bootstrap'; - -class ControlTable extends Component { - render() { - // create sorted rows - var rows = this.props.data.map(row => { - // add cells by column keys - var rowArray = [ row._id ]; - - for (var i = 0; i < this.props.columns.length; i++) { - if (row[this.props.columns[i].key] != null) { - rowArray.push(row[this.props.columns[i].key].toString()); - } else { - rowArray.push(""); - } - } - - return rowArray; - }); - - return ( - - - - {this.props.columns.map(column => ( - - ))} - - - - - {rows.map((row) => ( - - {row.filter((element, index) => { - return index !== 0; - }).map((cell, index) => ( - - ))} - - - ))} - -
{column.title}
{cell} - - -
- ); - } -} - -export default ControlTable; diff --git a/src/components/table.js b/src/components/table.js index fab3bfe..898e65f 100644 --- a/src/components/table.js +++ b/src/components/table.js @@ -8,46 +8,93 @@ **********************************************************************************/ import React, { Component } from 'react'; +import { Table, Button, Glyphicon } from 'react-bootstrap'; +import { Link } from 'react-router'; + +import TableColumn from './table-column'; + +class CustomTable extends Component { + static defaultProps = { + width: null + }; -class Table extends Component { render() { - // create sorted rows - var rows = this.props.data.map(row => { - // add cells by column keys - var rowArray = []; + // create sorted data for rows + var rows = []; + if (this.props.data) { + rows = this.props.data.map((row, index) => { + var array = []; - for (var i = 0; i < this.props.columns.length; i++) { - if (row[this.props.columns[i].key] != null) { - rowArray.push(row[this.props.columns[i].key].toString()); - } else { - rowArray.push(""); + for (var i = 0; i < this.props.children.length; i++) { + // only handle table-column children + if (this.props.children[i].type === TableColumn) { + // add content to cell + var cell = []; + + // add data to cell + const dataKey = this.props.children[i].props.dataKey; + if (dataKey && row[dataKey] != null) { + // get content + var content; + const modifier = this.props.children[i].props.modifier; + + if (modifier) { + content = modifier(row[dataKey]); + } else { + content = row[dataKey].toString(); + } + + // check if cell should be a link + const linkKey = this.props.children[i].props.linkKey; + if (linkKey && row[linkKey] != null) { + cell.push({content}); + } else { + cell.push(content); + } + } + + // add buttons + if (this.props.children[i].props.editButton) { + const onEdit = this.props.children[i].props.onEdit; + cell.push(); + } + + if (this.props.children[i].props.deleteButton) { + const onDelete = this.props.children[i].props.onDelete; + cell.push(); + } + + array.push(cell); + } } - } - return rowArray; - }); + return array; + }); + } return ( - +
- {this.props.columns.map(column => ( - - ))} + {this.props.children} {rows.map((row, index) => ( {row.map((cell, index) => ( - + ))} ))} -
{column.title}
{cell} + {cell.map((element, index) => ( + {element} + ))} +
+ ); } } -export default Table; +export default CustomTable; diff --git a/src/containers/simulation.js b/src/containers/simulation.js new file mode 100644 index 0000000..a4b59b7 --- /dev/null +++ b/src/containers/simulation.js @@ -0,0 +1,150 @@ +/** + * File: simulation.js + * Author: Markus Grigull + * Date: 04.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + +import React, { Component } from 'react'; +import { Container } from 'flux/utils'; +import { Button, Modal, Glyphicon } from 'react-bootstrap'; + +import SimulationStore from '../stores/simulation-store'; +import SimulatorStore from '../stores/simulator-store'; +import AppDispatcher from '../app-dispatcher'; + +import Table from '../components/table'; +import TableColumn from '../components/table-column'; +import NewSimulationModelDialog from '../components/dialog/new-simulation-model'; +import EditSimulationModelDialog from '../components/dialog/edit-simulation-model'; + +class Simulation extends Component { + static getStores() { + return [ SimulationStore, SimulatorStore ]; + } + + static calculateState() { + return { + simulations: SimulationStore.getState(), + simulators: SimulatorStore.getState(), + + newModal: false, + deleteModal: false, + editModal: false, + modalData: {}, + + simulation: {} + } + } + + componentWillMount() { + AppDispatcher.dispatch({ + type: 'simulations/start-load' + }); + + AppDispatcher.dispatch({ + type: 'simulators/start-load' + }); + } + + componentDidUpdate() { + if (this.state.simulation._id !== this.props.params.simulation) { + this.reloadSimulation(); + } + } + + reloadSimulation() { + // select simulation by param id + this.state.simulations.forEach((simulation) => { + if (simulation._id === this.props.params.simulation) { + // JSON.parse(JSON.stringify(obj)) = deep clone to make also copy of widget objects inside + this.setState({ simulation: JSON.parse(JSON.stringify(simulation)) }); + } + }); + } + + closeNewModal(data) { + this.setState({ newModal : false }); + + if (data) { + this.state.simulation.models.push(data); + + AppDispatcher.dispatch({ + type: 'simulations/start-edit', + data: this.state.simulation + }); + } + } + + confirmDeleteModal() { + this.setState({ deleteModal: false }); + + + + /*AppDispatcher.dispatch({ + type: 'visualizations/start-remove', + data: this.state.modalVisualization + });*/ + } + + closeEditModal(data) { + this.setState({ editModal : false }); + + if (data) { + /*AppDispatcher.dispatch({ + type: 'visualizations/start-edit', + data: data + });*/ + } + } + + getSimulatorName(id) { + for (var i = 0; i < this.state.simulators.length; i++) { + if (this.state.simulators[i]._id === id) { + return this.state.simulators[i].name; + } + } + + return id; + } + + render() { + return ( +
+

{this.state.simulation.name}

+ + + + this.getSimulatorName(id)} /> + + this.setState({ editModal: true, modalData: this.state.simulation.models[index] })} onDelete={(index) => this.setState({ deleteModal: true, modalData: this.state.simulation.models[index] })} /> +
+ + + + this.closeNewModal(data)} simulators={this.state.simulators} /> + + this.closeEditModal(data)} data={this.state.modalData} /> + + + + Delete Simulation Model + + + + Are you sure you want to delete the simulation model '{this.state.modalData.name}'? + + + + + + + +
+ ); + } +} + +export default Container.create(Simulation); diff --git a/src/containers/simulations.js b/src/containers/simulations.js new file mode 100644 index 0000000..dd80a71 --- /dev/null +++ b/src/containers/simulations.js @@ -0,0 +1,136 @@ +/** + * File: simulations.js + * Author: Markus Grigull + * Date: 04.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + +import React, { Component } from 'react'; +import { Container } from 'flux/utils'; +import { Button, Modal, Glyphicon } from 'react-bootstrap'; + +import AppDispatcher from '../app-dispatcher'; +import SimulationStore from '../stores/simulation-store'; + +import Table from '../components/table'; +import TableColumn from '../components/table-column'; +import NewSimulationDialog from '../components/dialog/new-simulation'; +import EditSimulationDialog from '../components/dialog/edit-simulation'; + +class Simulations extends Component { + static getStores() { + return [ SimulationStore ]; + } + + static calculateState() { + return { + simulations: SimulationStore.getState(), + + newModal: false, + deleteModal: false, + editModal: false, + modalSimulation: {} + }; + } + + componentWillMount() { + AppDispatcher.dispatch({ + type: 'simulations/start-load' + }); + } + + closeNewModal(data) { + this.setState({ newModal : false }); + + if (data) { + AppDispatcher.dispatch({ + type: 'simulations/start-add', + data: data + }); + } + } + + showDeleteModal(id) { + // get simulation by id + var deleteSimulation; + + this.state.simulations.forEach((simulation) => { + if (simulation._id === id) { + deleteSimulation = simulation; + } + }); + + this.setState({ deleteModal: true, modalSimulation: deleteSimulation }); + } + + confirmDeleteModal() { + this.setState({ deleteModal: false }); + + AppDispatcher.dispatch({ + type: 'simulations/start-remove', + data: this.state.modalSimulation + }); + } + + showEditModal(id) { + // get simulation by id + var editSimulation; + + this.state.simulations.forEach((simulation) => { + if (simulation._id === id) { + editSimulation = simulation; + } + }); + + this.setState({ editModal: true, modalSimulation: editSimulation }); + } + + closeEditModal(data) { + this.setState({ editModal : false }); + + if (data) { + AppDispatcher.dispatch({ + type: 'simulations/start-edit', + data: data + }); + } + } + + render() { + return ( +
+

Simulations

+ + + + this.setState({ editModal: true, modalSimulation: this.state.simulations[index] })} onDelete={index => this.setState({ deleteModal: true, modalSimulation: this.state.simulations[index] })} /> +
+ + + + this.closeNewModal(data)} /> + + this.closeEditModal(data)} simulation={this.state.modalSimulation} /> + + + + Delete Simulation + + + + Are you sure you want to delete the simulation '{this.state.modalSimulation.name}'? + + + + + + + +
+ ); + } +} + +export default Container.create(Simulations); diff --git a/src/containers/simulators.js b/src/containers/simulators.js index e3be874..00ab175 100644 --- a/src/containers/simulators.js +++ b/src/containers/simulators.js @@ -9,14 +9,15 @@ import React, { Component } from 'react'; import { Container } from 'flux/utils'; -import { Button, Modal } from 'react-bootstrap'; +import { Button, Modal, Glyphicon } from 'react-bootstrap'; import AppDispatcher from '../app-dispatcher'; import SimulatorStore from '../stores/simulator-store'; -import ControlTable from '../components/table-control'; -import NewSimulatorDialog from '../components/dialog-new-simulator'; -import EditSimulatorDialog from '../components/dialog-edit-simulator'; +import Table from '../components/table'; +import TableColumn from '../components/table-column'; +import NewSimulatorDialog from '../components/dialog/new-simulator'; +import EditSimulatorDialog from '../components/dialog/edit-simulator'; class Simulators extends Component { static getStores() { @@ -51,19 +52,6 @@ class Simulators extends Component { } } - showDeleteModal(id) { - // get simulator by id - var deleteSimulator; - - this.state.simulators.forEach((simulator) => { - if (simulator._id === id) { - deleteSimulator = simulator; - } - }); - - this.setState({ deleteModal: true, modalSimulator: deleteSimulator }); - } - confirmDeleteModal() { this.setState({ deleteModal: false }); @@ -73,19 +61,6 @@ class Simulators extends Component { }); } - showEditModal(id) { - // get simulator by id - var editSimulator; - - this.state.simulators.forEach((simulator) => { - if (simulator._id === id) { - editSimulator = simulator; - } - }); - - this.setState({ editModal: true, modalSimulator: editSimulator }); - } - closeEditModal(data) { this.setState({ editModal : false }); @@ -98,20 +73,19 @@ class Simulators extends Component { } render() { - var columns = [ - { title: 'Name', key: 'name' }, - { title: 'ID', key: 'simulatorid', width: 80 }, - { title: 'Running', key: 'running', width: 80 }, - { title: 'Endpoint', key: 'endpoint', width: 120 } - ]; - return (

Simulators

- this.showEditModal(id)} onDelete={(id) => this.showDeleteModal(id)} /> + + + + + + this.setState({ editModal: true, modalSimulator: this.state.simulators[index] })} onDelete={(index) => this.setState({ deleteModal: true, modalSimulator: this.state.simulators[index] })} /> +
- + this.closeNewModal(data)} /> diff --git a/src/containers/visualizations.js b/src/containers/visualizations.js index 1de8d9b..782fdd1 100644 --- a/src/containers/visualizations.js +++ b/src/containers/visualizations.js @@ -9,14 +9,15 @@ import React, { Component } from 'react'; import { Container } from 'flux/utils'; -import { Button, Modal } from 'react-bootstrap'; +import { Button, Modal, Glyphicon } from 'react-bootstrap'; import AppDispatcher from '../app-dispatcher'; import VisualizationStore from '../stores/visualization-store'; -import ControlLinkTable from '../components/table-control-link'; -import NewVisualzationDialog from '../components/dialog-new-visualization'; -import EditVisualizationDialog from '../components/dialog-edit-visualization'; +import Table from '../components/table'; +import TableColumn from '../components/table-column'; +import NewVisualzationDialog from '../components/dialog/new-visualization'; +import EditVisualizationDialog from '../components/dialog/edit-visualization'; class Visualizations extends Component { static getStores() { @@ -30,7 +31,7 @@ class Visualizations extends Component { newModal: false, deleteModal: false, editModal: false, - modalVisualization: {} + modalData: {} }; } @@ -51,19 +52,6 @@ class Visualizations extends Component { } } - showDeleteModal(id) { - // get visualization by id - var deleteVisualization; - - this.state.visualizations.forEach((visualization) => { - if (visualization._id === id) { - deleteVisualization = visualization; - } - }); - - this.setState({ deleteModal: true, modalVisualization: deleteVisualization }); - } - confirmDeleteModal() { this.setState({ deleteModal: false }); @@ -73,19 +61,6 @@ class Visualizations extends Component { }); } - showEditModal(id) { - // get visualization by id - var editVisualization; - - this.state.visualizations.forEach((visualization) => { - if (visualization._id === id) { - editVisualization = visualization; - } - }); - - this.setState({ editModal: true, modalVisualization: editVisualization }); - } - closeEditModal(data) { this.setState({ editModal : false }); @@ -98,21 +73,20 @@ class Visualizations extends Component { } render() { - var columns = [ - { title: 'Name', key: 'name' } - ]; - return (

Visualizations

- this.showEditModal(id)} onDelete={(id) => this.showDeleteModal(id)} linkRoot="/visualizations"/> + + + this.setState({ editModal: true, modalData: this.state.visualizations[index] })} onDelete={index => this.setState({ deleteModal: true, modalData: this.state.visualizations[index] })} /> +
- + this.closeNewModal(data)} /> - this.closeEditModal(data)} visualization={this.state.modalVisualization} /> + this.closeEditModal(data)} visualization={this.state.modalData} /> @@ -120,7 +94,7 @@ class Visualizations extends Component { - Are you sure you want to delete the visualization '{this.state.modalVisualization.name}'? + Are you sure you want to delete the visualization '{this.state.modalData.name}'? diff --git a/src/containers/widget.js b/src/containers/widget.js index 949cb4a..b436075 100644 --- a/src/containers/widget.js +++ b/src/containers/widget.js @@ -13,6 +13,7 @@ import { ContextMenuTrigger } from 'react-contextmenu'; import Rnd from 'react-rnd'; import SimulatorDataStore from '../stores/simulator-data-store'; +import WidgetValue from '../components/widget-value'; import '../styles/widgets.css'; @@ -21,12 +22,20 @@ class Widget extends Component { return [ SimulatorDataStore ]; } - static calculateState() { - return { - simulatorData: SimulatorDataStore.getState(), + static calculateState(prevState) { + if (prevState) { + return { + simulatorData: SimulatorDataStore.getState(), - widget: {} - }; + sequence: prevState.sequence + 1 + } + } else { + return { + simulatorData: SimulatorDataStore.getState(), + + sequence: 0 + }; + } } dragStop(event, ui) { @@ -50,11 +59,9 @@ class Widget extends Component { render() { const widget = this.props.data; - var value = ''; - - if (this.state.simulatorData.RTDS && this.state.simulatorData.RTDS.values) { - const arr = this.state.simulatorData.RTDS.values[this.props.index]; - value = arr[arr.length - 1].y; + var grid = this.props.grid; + if (!grid) { + grid = [ 1, 1 ]; } if (this.props.editing) { @@ -66,16 +73,18 @@ class Widget extends Component { className="widget" onResizeStop={(direction, styleSize, clientSize, delta) => this.resizeStop(direction, styleSize, clientSize, delta)} onDragStop={(event, ui) => this.dragStop(event, ui)} + moveGrid={grid} + resizeGrid={grid} > -
{value}
+ ); } else { return (
- {value} +
); } diff --git a/src/data-managers/rest-data-manager.js b/src/data-managers/rest-data-manager.js index cf5a47b..db92935 100644 --- a/src/data-managers/rest-data-manager.js +++ b/src/data-managers/rest-data-manager.js @@ -51,7 +51,8 @@ class RestDataManager { RestAPI.delete(this.url + '/' + object._id).then(response => { AppDispatcher.dispatch({ type: this.type + 's/removed', - data: response[this.type] + data: response[this.type], + original: object }); }).catch(error => { AppDispatcher.dispatch({ diff --git a/src/data-managers/simulations-data-manager.js b/src/data-managers/simulations-data-manager.js new file mode 100644 index 0000000..4a9d0bf --- /dev/null +++ b/src/data-managers/simulations-data-manager.js @@ -0,0 +1,12 @@ +/** + * File: simulation-data-manager.js + * Author: Markus Grigull + * Date: 04.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + + import RestDataManager from './rest-data-manager'; + + export default new RestDataManager('simulation', '/simulations'); diff --git a/src/router.js b/src/router.js index 83230d4..5689e6e 100644 --- a/src/router.js +++ b/src/router.js @@ -16,6 +16,8 @@ import Projects from './containers/projects'; import Simulators from './containers/simulators'; import Visualization from './containers/visualization'; import Visualizations from './containers/visualizations'; +import Simulations from './containers/simulations'; +import Simulation from './containers/simulation'; class Root extends Component { render() { @@ -28,6 +30,9 @@ class Root extends Component { + + + ); diff --git a/src/stores/simulation-store.js b/src/stores/simulation-store.js new file mode 100644 index 0000000..89854f5 --- /dev/null +++ b/src/stores/simulation-store.js @@ -0,0 +1,13 @@ +/** + * File: simulation-store.js + * Author: Markus Grigull + * Date: 04.03.2017 + * Copyright: 2017, Institute for Automation of Complex Power Systems, EONERC + * This file is part of VILLASweb. All Rights Reserved. Proprietary and confidential. + * Unauthorized copying of this file, via any medium is strictly prohibited. + **********************************************************************************/ + +import ArrayStore from './array-store'; +import SimulationsDataManager from '../data-managers/simulations-data-manager'; + +export default new ArrayStore('simulations', SimulationsDataManager);