Add time length option to plot widget

Increase simulation-data storage to 1200 entries

app/components/widget-plot.js

@@ -26,8 +26,6 @@ export default WidgetAbstract.extend({
     xaxis: {
       mode: 'time',
       timeformat: '%M:%S',
-      /*min: firstTimestamp,
-      max: lastTimestamp,*/
       axisLabel: 'time [min]',
       axisLabelUseCanvas: true
     }/*,
@@ -39,12 +37,11 @@ export default WidgetAbstract.extend({
   },
 
   signals: Ember.A([]),
-
   checkedSignals: {},
-
   plotType: "multiple",
-
+  time: null,
   observeQuery: null,
+  selectedSignal: null,
 
   _updateDataObserver: Ember.on('init', Ember.observer('widget.widgetData.simulator', 'widget.widgetData.type', 'widget.widgetData.signals', function() {
     // get query for observer
@@ -73,6 +70,10 @@ export default WidgetAbstract.extend({
                   if (simulator.get('simulatorid') === simulatorid) {
                     // set simulation model
                     self.set('simulationModel', simulationModel);
+
+                    if (self.get('selectedSignal') === null) {
+                      self.set('selectedSignal', simulationModel.get('mapping')[0]);
+                    }
                   }
                 });
               });
@@ -100,6 +101,26 @@ export default WidgetAbstract.extend({
     let values = this.get('data.' + simulatorId + '.flotValues');
     var updatedValues = Ember.A([]);
 
+    // update plot options
+    var plotOptions = this.get('plotOptions');
+
+    // calculate diff for first and last timestamp
+    var firstTimestamp = values[0][0][0];
+    var lastTimestamp = values[0][values[0].length - 1][0];
+
+    var diff = lastTimestamp - firstTimestamp;
+    var diffValue = this.get('widget.widgetData.time') * 1000;  // javascript timestamps are in milliseconds
+
+    if (diff > diffValue) {
+      firstTimestamp = lastTimestamp - diffValue;
+    } else {
+      lastTimestamp = +firstTimestamp + +diffValue;
+    }
+
+    plotOptions.xaxis.min = firstTimestamp;
+    plotOptions.xaxis.max = lastTimestamp;
+    this.set('plotOptions', plotOptions);
+
     // update values
     var index = 0;
 
@@ -116,6 +137,7 @@ export default WidgetAbstract.extend({
       // prepare modal
       this.set('name', this.get('widget.name'));
       this.set('plotType', this.get('widget.widgetData.type'));
+      this.set('time', this.get('widget.widgetData.time'));
       this.set('errorMessage', null);
 
       // get signal mapping for simulation model
@@ -189,6 +211,7 @@ export default WidgetAbstract.extend({
                     };
 
                     widgetData.simulator = simulator.get('simulatorid');
+                    widgetData.time = self.get('time');
 
                     // set signals
                     let mapping = simulationModel.get('mapping');
@@ -267,6 +290,8 @@ export default WidgetAbstract.extend({
           this.set('widget.widgetData.signals', [ i ]);
         }
       }
+
+      this.set('selectedSignal', signal);
     }
   }
 });

app/controllers/visualization/edit.js

@@ -63,7 +63,7 @@ export default Ember.Controller.extend(FetchLiveDataMixin, {
                 properties.name = 'Plot';
                 properties.width = 500;
                 properties.height = 400;
-                properties.widgetData = { signals: [0], simulator: defaultSimulatorid, type: 'multiple' };
+                properties.widgetData = { signals: [0], simulator: defaultSimulatorid, type: 'multiple', time: 300 };
               } else if (name === 'image') {
                 properties.type = 'widget-image';
                 properties.name = 'Image';

app/models/simulation-data.js

@@ -37,7 +37,7 @@ export default Model.extend({
       this._flotValues[i].push([this.get('timestamp'), values[i]]);
 
       // discard old values
-      while (this._flotValues[i].length > 100) {
+      while (this._flotValues[i].length > 1200) {
         this._flotValues[i].shift();
       }
     }

app/templates/components/widget-plot.hbs

@@ -10,7 +10,13 @@
     {{#each simulationModel.mapping as |signal|}}
       <tr>
         <td>
-          <a href="" {{action "selectTableSignal" signal}}>{{signal}}</a>
+          {{#if (eq signal selectedSignal)}}
+            <b>
+              <a href="" {{action "selectTableSignal" signal}}>{{signal}}</a>
+            </b>
+          {{else}}
+            <a href="" {{action "selectTableSignal" signal}}>{{signal}}</a>
+          {{/if}}
         </td>
       </tr>
     {{/each}}
@@ -51,6 +57,14 @@
             </select>
           </td>
         </tr>
+        <tr>
+          <td>
+            <label for="time">Time in sec</label>
+          </td>
+          <td>
+            {{input type='number' id='time' placeholder='Enter time length' value=time}}
+          </td>
+        </tr>
         <tr>
           <td>
             <label for="type">Type</label>