Merge pull request #348 from iteratec/feature/timeSeriesChartDataRestriction

Time series chart data restriction

Author: DanielSteger

frontend/package-lock.json

@@ -0,0 +1,52 @@
+<div class="card">
+  <div class="time-series-chart">
+    <osm-spinner [spinnerId]="'time-series-line-chart-spinner'"></osm-spinner>
+    <div class="settings-row">
+      <div *ngFor="let measurandGroup of dataTrimLabels | keyvalue">
+        <span class="input-group dimension-group">
+          <label
+            class="input-group-addon settings-element dimension-label">{{'frontend.de.iteratec.isr.measurand.group.axisLabel.' + measurandGroup.key | translate}}</label>
+          <input (focusout)="adjustInputRangeAndInputValues('min', 'max', measurandGroup.key)"
+                 (input)="adjustInputByEvent($event, 'min', 'max', measurandGroup.key)"
+                 [(ngModel)]="selectedTrimValues.min[measurandGroup.key]"
+                 [max]="dataTrimInputRange.max[measurandGroup.key]"
+                 [min]="dataTrimInputRange.min[measurandGroup.key]"
+                 [step]="dataTrimInputStep[measurandGroup.key]"
+                 class="form-control settings-element trim-value-input-field min-input"
+                 placeholder="{{'frontend.de.iteratec.osm.timeSeries.chart.settings.minimum' | translate}}"
+                 type="number">
+          <input (focusout)="adjustInputRangeAndInputValues('max', 'min', measurandGroup.key)"
+                 (input)="adjustInputByEvent($event, 'max', 'min', measurandGroup.key)"
+                 [(ngModel)]="selectedTrimValues.max[measurandGroup.key]"
+                 [max]="dataTrimInputRange.max[measurandGroup.key]"
+                 [min]="dataTrimInputRange.min[measurandGroup.key]"
+                 [step]="dataTrimInputStep[measurandGroup.key]"
+                 class="form-control settings-element trim-value-input-field"
+                 placeholder="{{'frontend.de.iteratec.osm.timeSeries.chart.settings.maximum' | translate}}"
+                 type="number">
+          <label *ngIf="measurandGroup.value !== '#'"
+                 class="input-group-addon settings-element dimension-label">{{measurandGroup.value}}</label>
+        </span>
+      </div>
+    </div>
+
+    <div id="time-series-line-chart-container">
+      <svg #svg/>
+    </div>
+
+  </div>
+</div>
+
+<ngx-smart-modal id="pointSelectionErrorModal" identifier="pointSelectionErrorModal">
+  <header>
+    <h2>{{ "frontend.de.iteratec.chart.errorHeader" | translate }}</h2>
+  </header>
+  <main>
+    <div>{{ "frontend.de.iteratec.chart.datapointSelection.error.multipleServer" | translate }}</div>
+  </main>
+  <footer>
+    <button (click)="this.ngxSmartModalService.close('pointSelectionErrorModal')" class="btn btn-default">
+      {{ "frontend.default.button.cancel.label" | translate }}
+    </button>
+  </footer>
+</ngx-smart-modal>