wip: widgets are now viewable, to get the needed testdata switch to the example-dashboard branch in the backend

src/dashboard/dashboard.js

@@ -57,6 +57,7 @@ class Dashboard extends React.Component {
       prevState = {};
     }
     const sessionToken = LoginStore.getState().token;
+
     let dashboard = Map();
     console.log("dashboard calculate state was called: " + props.match.params.dashboard);
     let dashboards = DashboardStore.getState()
@@ -82,7 +83,7 @@ class Dashboard extends React.Component {
         });
       }
 
-      let files = FileStore.getState();
+      /*let files = FileStore.getState();
 
       if(files.length === 0){
         AppDispatcher.dispatch({
@@ -90,7 +91,7 @@ class Dashboard extends React.Component {
           token: sessionToken,
           param: '?objectID=1&objectType=widget'
         });
-      }
+      }*/
 
 
       console.log("here are the widgets: ");
@@ -141,7 +142,7 @@ class Dashboard extends React.Component {
 */
     }
     let widgets = {};
-
+    
       for (let widget of dashboard.get('widgets')) {
         widgets[Dashboard.lastWidgetKey] = widget;
         console.log(" the last widgetKey: " + Dashboard.lastWidgetKey);
@@ -170,10 +171,10 @@ class Dashboard extends React.Component {
       sessionToken: sessionToken,
       projects: null, //ProjectStore.getState(),
       simulations: null, //SimulationStore.getState(),
-      files: FileStore.getState(),
+      files: null,
 
-      project: prevState.project || null,
-      simulation: prevState.simulation || null,
+      project:  null,
+      simulation:  null,
       simulationModels,
       editing: prevState.editing || false,
       paused: prevState.paused || false,
@@ -196,19 +197,20 @@ class Dashboard extends React.Component {
   }
 
 //!!!won't work anymore
- /* componentDidMount() {
+  componentWillMount() {
     //document.addEventListener('keydown', this.handleKeydown.bind(this));
     console.log("problem in componentdidmount");
     if (this.state.dashboard.has('id') === false) {
       AppDispatcher.dispatch({
         type: 'dashboards/start-load',
-        data: this.props.match.params.dashboard,
-        token: this.state.sessionToken
+        token: this.state.sessionToken,
+        param: '?scenarioID=1',
       });
+  
     }
 
   }
-
+/*
 
   componentWillUnmount() {
       //document.removeEventListener('keydown', this.handleKeydown.bind(this));

src/widget/widget.js

@@ -84,12 +84,14 @@ class Widget extends React.Component {
 
     AppDispatcher.dispatch({
       type: 'files/start-load',
-      token: this.state.sessionToken
+      token: this.state.sessionToken,
+      param: '?objectID=1&objectType=widget'
     });
 
     AppDispatcher.dispatch({
       type: 'simulationModels/start-load',
-      token: this.state.sessionToken
+      token: this.state.sessionToken,
+      param: '?scenarioID=1'
     });
 
   }
@@ -116,6 +118,8 @@ class Widget extends React.Component {
   createWidget(widget) {
     let simulationModel = null;
 
+    console.log("createwidget was called");
+    console.log(" the widget type is: " + widget.type);
     for (let model of this.state.simulationModels) {
       if (model._id !== widget.simulationModel) {
         continue;
@@ -123,7 +127,7 @@ class Widget extends React.Component {
 
       simulationModel = model;
     }
-
+    //all types are lowercase!!! at least slider is
     if (widget.type === 'CustomAction') {
       return <WidgetCustomAction widget={widget} data={this.state.simulatorData} dummy={this.state.sequence} simulationModel={simulationModel} />
     } else if (widget.type === 'Action') {
@@ -147,6 +151,7 @@ class Widget extends React.Component {
     } else if (widget.type === 'NumberInput') {
       return <WidgetInput widget={widget} editing={this.props.editing} simulationModel={simulationModel} onInputChanged={(value) => this.inputDataChanged(widget, value)} />
     } else if (widget.type === 'Slider') {
+      console.log("inside slider: simulationModel: " + simulationModel);
       return <WidgetSlider widget={widget} editing={this.props.editing} simulationModel={simulationModel} onWidgetChange={(w) => this.props.onWidgetStatusChange(w, this.props.index) } onInputChanged={value => this.inputDataChanged(widget, value)} />
     } else if (widget.type === 'Gauge') {
       return <WidgetGauge widget={widget} data={this.state.simulatorData} editing={this.props.editing} simulationModel={simulationModel} />
@@ -160,9 +165,10 @@ class Widget extends React.Component {
 
     return null;
   }
-
+  rn 
 
   render() {
+    console.log("!!!render Widget was called");
     const element = this.createWidget(this.props.data);
 
     if (this.props.editing) {

src/widget/widgets/gauge.js

@@ -33,7 +33,7 @@ class WidgetGauge extends Component {
     this.state = {
       value: 0,
       minValue: null,
-      maxValue: null
+      maxValue: null 
     };
   }
 

src/widget/widgets/label.js

@@ -26,8 +26,8 @@ import EditWidgetColorControl from '../edit-widget-color-control';
 class WidgetLabel extends Component {
   render() {
     const style = {
-      fontSize: this.props.widget.textSize + 'px',
-      color: EditWidgetColorControl.ColorPalette[this.props.widget.fontColor]
+      fontSize: this.props.widget.customProperties.textSize + 'px',
+      color: EditWidgetColorControl.ColorPalette[this.props.widget.customProperties.fontColor]
     };
 
     return (

src/widget/widgets/slider.js

@@ -39,19 +39,22 @@ class WidgetSlider extends Component {
     super(props);
 
     this.state = {
-        unit: ''
+        unit: 'bla',
+        
     };
   }
 
   componentWillReceiveProps(nextProps) {
+    console.log("componentwillreceiveprops calle, next props: ");
+    console.log(nextProps);
     if (nextProps.simulationModel == null) {
       return;
     }
 
     // Update value
-    if (nextProps.widget.default_value && this.state.value === undefined) {
+    if (nextProps.widget.customProperties.default_value && this.state.value === undefined) {
       this.setState({
-        value: nextProps.widget.default_value,
+        value: nextProps.widget.customProperties.default_value,
       });
     }
 
@@ -63,7 +66,7 @@ class WidgetSlider extends Component {
     }
 
     // Check if the orientation changed, update the size if it did
-    if (this.props.widget.orientation !== nextProps.widget.orientation) {
+    if (this.props.widget.customProperties.orientation !== nextProps.widget.customProperties.orientation) {
       let baseWidget = nextProps.widget;
 
       // Exchange dimensions and constraints
@@ -94,11 +97,15 @@ class WidgetSlider extends Component {
   }
 
   render() {
-    let isVertical = this.props.widget.orientation === WidgetSlider.OrientationTypes.VERTICAL.value;
+    console.log("render of slider was called");
+    console.log(this.props.widget);
+    console.log("the maxRange is : " + this.props.widget.customProperties.rangeMax);
+    let isVertical = this.props.widget.customProperties.orientation === WidgetSlider.OrientationTypes.VERTICAL.value;
+    console.log("this state has the value: " + this.state.value);
 
     let fields = {
       name: this.props.widget.name,
-      control: <Slider min={ this.props.widget.rangeMin } max={ this.props.widget.rangeMax } step={ this.props.widget.step } value={ this.state.value } disabled={ this.props.editing } vertical={ isVertical } onChange={ (v) => this.valueIsChanging(v) } onAfterChange={ (v) => this.valueChanged(v) }/>,
+      control: <Slider min={ this.props.widget.customProperties.rangeMin } max={ this.props.widget.customProperties.rangeMax } step={ this.props.widget.customProperties.step } value={ this.state.value } disabled={ this.props.editing } vertical={ isVertical } onChange={ (v) => this.valueIsChanging(v) } onAfterChange={ (v) => this.valueChanged(v) }/>,
       value: <span>{ format('.3s')(Number.parseFloat(this.state.value)) }</span>,
       unit: <span className="signal-unit">{ this.state.unit }</span>
     }
@@ -111,7 +118,7 @@ class WidgetSlider extends Component {
                   });
 
     return (
-      this.props.widget.orientation === WidgetSlider.OrientationTypes.HORIZONTAL.value? (
+       !isVertical? (
         <div className={widgetClasses}>
           <label>{ fields.name }</label>
           <div className='slider'>{ fields.control }</div>