Deleting any analytic unit only deletes the first one #33 (#36)

* change all AnalyticUnit key occurences to ids

* Fix map id index (use id instead of name)

* aid -> id

src/controllers/analytic_controller.ts

@@ -28,7 +28,7 @@ export const REGION_DELETE_COLOR_DARK = 'white';
 export class AnalyticController {
 
   private _analyticUnitsSet: AnalyticUnitsSet;
-  private _selectedAnalyticUnitKey: AnalyticUnitId = null;
+  private _selectedAnalyticUnitId: AnalyticUnitId = null;
 
   private _labelingDataAddedSegments: SegmentsSet<AnalyticSegment>;
   private _labelingDataDeletedSegments: SegmentsSet<AnalyticSegment>;
@@ -97,27 +97,27 @@ export class AnalyticController {
   set graphLocked(value) { this._graphLocked = value; }
 
   get labelingAnomaly(): AnalyticUnit {
-    if(this._selectedAnalyticUnitKey === null) {
+    if(this._selectedAnalyticUnitId === null) {
       return null;
     }
-    return this._analyticUnitsSet.byId(this._selectedAnalyticUnitKey);
+    return this._analyticUnitsSet.byId(this._selectedAnalyticUnitId);
   }
 
-  async toggleAnomalyTypeLabelingMode(key: AnalyticUnitId) {
+  async toggleAnomalyTypeLabelingMode(id: AnalyticUnitId) {
     if(this.labelingAnomaly && this.labelingAnomaly.saving) {
       throw new Error('Can`t toggel during saving');
     }
-    if(this._selectedAnalyticUnitKey === key) {
+    if(this._selectedAnalyticUnitId === id) {
       return this.disableLabeling();
     }
     await this.disableLabeling();
-    this._selectedAnalyticUnitKey = key;
+    this._selectedAnalyticUnitId = id;
     this.labelingAnomaly.selected = true;
-    this.toggleVisibility(key, true);
+    this.toggleVisibility(id, true);
   }
 
   async disableLabeling() {
-    if(this._selectedAnalyticUnitKey === null) {
+    if(this._selectedAnalyticUnitId === null) {
       return;
     }
     this.labelingAnomaly.saving = true;
@@ -146,12 +146,12 @@ export class AnalyticController {
     this._labelingDataAddedSegments.clear();
     this._labelingDataDeletedSegments.clear();
     this.labelingAnomaly.selected = false;
-    this._selectedAnalyticUnitKey = null;
+    this._selectedAnalyticUnitId = null;
     this._tempIdCounted = -1;
   }
 
   get labelingMode(): boolean {
-    return this._selectedAnalyticUnitKey !== null;
+    return this._selectedAnalyticUnitId !== null;
   }
 
   get labelingDeleteMode(): boolean {
@@ -170,8 +170,8 @@ export class AnalyticController {
     return this._analyticUnitsSet.items;
   }
 
-  onAnomalyColorChange(key: AnalyticUnitId, value) {
-    this._analyticUnitsSet.byId(key).color = value;
+  onAnomalyColorChange(id: AnalyticUnitId, value) {
+    this._analyticUnitsSet.byId(id).color = value;
   }
 
   fetchAnomalyTypesStatuses() {
@@ -283,11 +283,11 @@ export class AnalyticController {
     this.labelingAnomaly.deleteMode = !this.labelingAnomaly.deleteMode;
   }
 
-  removeAnomalyType(key) {
-    if(key === this._selectedAnalyticUnitKey) {
+  removeAnalyticUnit(id: AnalyticUnitId) {
+    if(id === this._selectedAnalyticUnitId) {
       this.dropLabeling();
     }
-    this._analyticUnitsSet.removeItem(key);
+    this._analyticUnitsSet.removeItem(id);
   }
 
   private async _runStatusWaiter(anomalyType: AnalyticUnit) {
@@ -348,8 +348,8 @@ export class AnalyticController {
     return this._tempIdCounted;
   }
 
-  public toggleVisibility(key: AnalyticUnitId, value?: boolean) {
-    var anomaly = this._analyticUnitsSet.byId(key);
+  public toggleVisibility(id: AnalyticUnitId, value?: boolean) {
+    var anomaly = this._analyticUnitsSet.byId(id);
     if(value !== undefined) {
       anomaly.visible = value;
     } else {

src/models/analytic_unit.ts

@@ -14,8 +14,8 @@ export type AnalyticSegmentsSearcher = (point: number, rangeDist: number) => Ana
 export type AnalyticUnitId = string;
 
 export class AnalyticSegment extends Segment {
-  constructor(public labeled: boolean, key: SegmentId, from: number, to: number) {
-    super(key, from, to);
+  constructor(public labeled: boolean, id: SegmentId, from: number, to: number) {
+    super(id, from, to);
     if(!_.isBoolean(labeled)) {
       throw new Error('labeled value is not boolean');
     }
@@ -138,7 +138,7 @@ export class AnalyticUnitsSet {
 
   addItem(item: AnalyticUnit) {
     this._panelObject.push(item.panelObject);
-    this._mapIdIndex[item.name] = this._items.length;
+    this._mapIdIndex[item.id] = this._items.length;
     this._items.push(item);
   }
 

src/module.ts

@@ -530,13 +530,19 @@ class GraphCtrl extends MetricsPanelCtrl {
     this.render(this.seriesList);
   }
 
-  onColorChange(key: AnalyticUnitId, value) {
-    this.analyticsController.onAnomalyColorChange(key, value);
+  onColorChange(id: AnalyticUnitId, value) {
+    if(id === undefined) {
+      throw new Error('id is undefined');
+    }
+    this.analyticsController.onAnomalyColorChange(id, value);
     this.render();
   }
 
-  onRemove(key) {
-    this.analyticsController.removeAnomalyType(key as string);
+  onRemove(id: AnalyticUnitId) {
+    if(id === undefined) {
+      throw new Error('id is undefined');
+    }
+    this.analyticsController.removeAnalyticUnit(id);
     this.render();
   }
 
@@ -574,8 +580,8 @@ class GraphCtrl extends MetricsPanelCtrl {
     this.analyticsController.toggleAlertEnabled(anomalyType);
   }
 
-  onToggleVisibility(key: AnalyticUnitId) {
-    this.analyticsController.toggleVisibility(key);
+  onToggleVisibility(id: AnalyticUnitId) {
+    this.analyticsController.toggleVisibility(id);
     this.render();
   }
 

src/partials/tab_analytics.html

@@ -31,13 +31,13 @@
     <span class="gf-form-label">
       <color-picker
         color="analyticUnit.color"
-        onChange="ctrl.onAnomalyColorChange.bind(ctrl, analyticUnit.key)"
+        onChange="ctrl.onAnomalyColorChange.bind(ctrl, analyticUnit.id)"
       />
     </span>
 
     <label class="gf-form-label" ng-style="analyticUnit.status === 'learning' && { 'cursor': 'not-allowed' }">
       <a class="pointer" tabindex="1"
-        ng-click="ctrl.onToggleLabelingMode(analyticUnit.key)"
+        ng-click="ctrl.onToggleLabelingMode(analyticUnit.id)"
         ng-disabled="analyticUnit.status === 'learning'"
       >
         <i class="fa fa-bar-chart" ng-if="!analyticUnit.saving"></i>
@@ -71,7 +71,7 @@
         ng-if="analyticUnit.visible"
         ng-disabled="analyticUnit.selected"
         bs-tooltip="'Hide. It`s visible now.'"
-        ng-click="ctrl.onToggleVisibility(analyticUnit.key)"
+        ng-click="ctrl.onToggleVisibility(analyticUnit.id)"
         class="pointer"
       >
         <i class="fa fa-eye"></i>
@@ -81,7 +81,7 @@
         ng-if="!analyticUnit.visible"
         ng-disabled="analyticUnit.selected"
         bs-tooltip="'Show. It`s hidden now.'"
-        ng-click="ctrl.onToggleVisibility(analyticUnit.key)"
+        ng-click="ctrl.onToggleVisibility(analyticUnit.id)"
         class="pointer"
       >
         <i class="fa fa-eye-slash"></i>
@@ -91,7 +91,7 @@
     <label class="gf-form-label">
       <a
         ng-if="!analyticUnit.selected"
-        ng-click="ctrl.onRemove(analyticUnit.key)"
+        ng-click="ctrl.onRemove(analyticUnit.id)"
         class="pointer"
       >
         <i class="fa fa-trash"></i>
@@ -99,7 +99,7 @@
 
       <a
         ng-if="analyticUnit.selected"
-        ng-click="ctrl.onCancelLabeling(analyticUnit.key)"
+        ng-click="ctrl.onCancelLabeling(analyticUnit.id)"
         class="pointer"
       >
         <i class="fa fa-ban"></i>