diff --git a/src/components/widget-plot-table.js b/src/components/widget-plot-table.js
index ddca1c0..5305ff8 100644
--- a/src/components/widget-plot-table.js
+++ b/src/components/widget-plot-table.js
@@ -9,16 +9,15 @@
import React, { Component } from 'react';
import { LineChart } from 'rd3';
-import { Col } from 'react-bootstrap';
-import Table from './table';
-import TableColumn from './table-column';
+import { ButtonGroup, Button } from 'react-bootstrap';
class WidgetPlotTable extends Component {
constructor(props) {
super(props);
this.state = {
+ size: { w: 0, h: 0 },
signal: 0,
firstTimestamp: 0,
latestTimestamp: 0,
@@ -32,6 +31,9 @@ class WidgetPlotTable extends Component {
// check data
const simulator = nextProps.widget.simulator;
+ // plot size
+ this.setState({ size: { w: this.props.widget.width - 100, h: this.props.widget.height - 20 }});
+
if (nextProps.simulation == null || nextProps.data == null || nextProps.data[simulator] == null || nextProps.data[simulator].length === 0 || nextProps.data[simulator].values[0].length === 0) {
// clear values
this.setState({ values: [], sequence: null, rows: [] });
@@ -78,32 +80,38 @@ class WidgetPlotTable extends Component {
this.setState({ values: values, firstTimestamp: firstTimestamp, latestTimestamp: latestTimestamp, sequence: nextProps.data[simulator].sequence, rows: rows });
}
-
+
render() {
+ console.log("Signal: " + this.state.signal);
return (
-
+
{this.props.widget.name}
-
-
- this.setState({ signal: index }) } />
-
-
+
+
+
+ { this.state.rows.map( (row, index) => (
+
+ ))
+ }
+
+
-
- {this.state.sequence &&
-
{ if (d != null) { return new Date(d.x); } }}
- hoverAnimation={false}
- circleRadius={0}
- domain={{ x: [this.state.firstTimestamp, this.state.latestTimestamp] }}
- />
- }
-
+
+ {this.state.sequence &&
+ { if (d != null) { return new Date(d.x); } }}
+ hoverAnimation={false}
+ circleRadius={0}
+ domain={{ x: [this.state.firstTimestamp, this.state.latestTimestamp] }}
+ />
+ }
+
+
);
}
diff --git a/src/containers/visualization.js b/src/containers/visualization.js
index cd3bc67..fbc1589 100644
--- a/src/containers/visualization.js
+++ b/src/containers/visualization.js
@@ -140,24 +140,35 @@ class Visualization extends Component {
if (item.name === 'Value') {
widget.simulator = this.state.simulation.models[0].simulator;
widget.signal = 0;
+ widget.minWidth = 70;
+ widget.minHeight = 20;
} else if (item.name === 'Plot') {
widget.simulator = this.state.simulation.models[0].simulator;
widget.signals = [ 0 ];
widget.time = 60;
+ widget.minWidth = 400;
+ widget.minHeight = 200;
widget.width = 400;
widget.height = 200;
} else if (item.name === 'Table') {
widget.simulator = this.state.simulation.models[0].simulator;
+ widget.minWidth = 300;
+ widget.minHeight = 200;
widget.width = 400;
widget.height = 200;
} else if (item.name === 'Label') {
-
+ widget.minWidth = 70;
+ widget.minHeight = 20;
} else if (item.name === 'PlotTable') {
widget.simulator = this.state.simulation.models[0].simulator;
+ widget.minWidth = 400;
+ widget.minHeight = 200;
widget.width = 500;
widget.height = 400;
widget.time = 60
} else if (item.name === 'Image') {
+ widget.minWidth = 100;
+ widget.minHeight = 100;
widget.width = 200;
widget.height = 200;
}
diff --git a/src/containers/widget.js b/src/containers/widget.js
index f145d28..8cde808 100644
--- a/src/containers/widget.js
+++ b/src/containers/widget.js
@@ -105,16 +105,18 @@ class Widget extends Component {
} else if (widget.type === 'Label') {
element =
} else if (widget.type === 'PlotTable') {
- element =
+ element =
} else if (widget.type === 'Image') {
element =
}
-
+
if (this.props.editing) {
return (
{ this.rnd = c; }}
initial={{ x: Number(widget.x), y: Number(widget.y), width: widget.width, height: widget.height }}
+ minWidth={ widget.minWidth }
+ minHeight={ widget.minHeight }
bounds={'parent'}
className="widget"
onResizeStop={(direction, styleSize, clientSize, delta) => this.resizeStop(direction, styleSize, clientSize, delta)}
diff --git a/src/styles/widgets.css b/src/styles/widgets.css
index 3ef8ecd..dd1521c 100644
--- a/src/styles/widgets.css
+++ b/src/styles/widgets.css
@@ -85,3 +85,36 @@
position: absolute;
right: 7px;
}
+
+.plot-table-widget .content {
+ display: -webkit-flex;
+ display: flex;
+}
+
+.plot-table-widget .widget-table {
+ min-width: 100px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+}
+
+/* Reset Bootstrap styles to "disable" while editing */
+.plot-table-widget .widget-table .btn[disabled] {
+ cursor: inherit;
+}
+
+.btn-default[disabled]:hover {
+ background-color: #fff;
+ border-color: #ccc;
+}
+
+.btn-default.active[disabled]:hover {
+ background-color: #e6e6e6;
+ border-color: #adadad;
+}
+ /* End reset */
+
+.plot-table-widget .widget-plot {
+ -webkit-flex: 1 0 auto;
+ flex: 1 0 auto;
+}
\ No newline at end of file