merge from ecomp a88f0072 - Modern UI

Issue-ID: VID-378
Change-Id: Ibcb23dd27f550cf32ce2fe0239f0f496ae014ff6
Signed-off-by: Ittay Stern <ittay.stern@att.com>

3 files changed, 320 insertions, 0 deletions

diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.model.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.model.ts
new file mode 100644
index 000000000..a8e9b435a
--- /dev/null
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.model.ts
@@ -0,0 +1,15 @@
+/******************************************
+ type - node type
+ isFirstLevel : node is first level
+ ******************************************/
+
+export class DragAndDropModel {
+  type : string;
+  isFirstLevel : boolean;
+
+  constructor(type : string, isFirstLevel : boolean){
+    this.type = type;
+    this.isFirstLevel = isFirstLevel;
+  }
+
+}
diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.service.spec.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.service.spec.ts
new file mode 100644
index 000000000..1221cef5f
--- /dev/null
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.service.spec.ts
@@ -0,0 +1,227 @@
+import {TestBed, getTestBed} from '@angular/core/testing';
+import {
+  HttpClientTestingModule,
+  HttpTestingController
+} from '@angular/common/http/testing';
+import {NgRedux} from "@angular-redux/store";
+import {DragAndDropService} from "./dragAndDrop.service";
+import {AppState} from "../../../../shared/store/reducers";
+
+class MockAppStore<T> {
+  dispatch(){
+
+  }
+  getState() {
+    return {
+      global: {
+        flags: {
+          "DRAG_AND_DROP_OPERATION" : true
+        }
+      },
+      service: {
+        serviceInstance: {
+          "serviceInstanceId": {
+            vnfs: {
+              "vnfStoreKey": {
+                isMissingData: true,
+                vfModules: {
+                  "vfModulesName": {
+                    "vfModulesName": {
+                      isMissingData: true
+                    }
+                  }
+                }
+              },
+
+              "vnfStoreKey1": {
+                isMissingData: false,
+                vfModules: {
+                  "vfModulesName": {
+                    "vfModulesName": {
+                      isMissingData: false
+                    }
+                  }
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+describe('Drag and drop service', () => {
+  let injector;
+  let service: DragAndDropService;
+  let httpMock: HttpTestingController;
+  let store: NgRedux<AppState>;
+
+  beforeAll(done => (async () => {
+    TestBed.configureTestingModule({
+      imports: [HttpClientTestingModule],
+      providers: [
+        DragAndDropService,
+        {provide: NgRedux, useClass: MockAppStore}]
+    });
+    await TestBed.compileComponents();
+
+    injector = getTestBed();
+    service = injector.get(DragAndDropService);
+    httpMock = injector.get(HttpTestingController);
+    store = injector.get(NgRedux);
+  })().then(done).catch(done.fail));
+
+
+  test('drag should move element position', () => {
+    let nodes = [{
+      "modelCustomizationId": "91415b44-753d-494c-926a-456a9172bbb9",
+      "modelId": "d6557200-ecf2-4641-8094-5393ae3aae60",
+      "modelUniqueId": "91415b44-753d-494c-926a-456a9172bbb9",
+      "missingData": false,
+      "id": "tjjongy92jn",
+      "action": "Create",
+      "inMaint": false,
+      "name": "yoav2_001",
+      "modelName": "VF_vMee 0",
+      "type": "VF",
+      "isEcompGeneratedNaming": true,
+      "networkStoreKey": "VF_vMee 0:0001",
+      "vnfStoreKey": "VF_vMee 0:0001",
+      "typeName": "VNF",
+      "menuActions": {"edit": {}, "showAuditInfo": {}, "duplicate": {}, "remove": {}, "delete": {}, "undoDelete": {}},
+      "isFailed": false,
+      "statusProperties": [{"key": "Prov Status:", "testId": "provStatus"}, {
+        "key": "Orch Status:",
+        "testId": "orchStatus"
+      }],
+      "trackById": "di9khuolht",
+      "parentType": "",
+      "position": 0,
+      "children": [{
+        "modelCustomizationId": "f8c040f1-7e51-4a11-aca8-acf256cfd861",
+        "modelId": "a27f5cfc-7f12-4f99-af08-0af9c3885c87",
+        "modelUniqueId": "f8c040f1-7e51-4a11-aca8-acf256cfd861",
+        "missingData": false,
+        "id": 6654971919519,
+        "action": "Create",
+        "name": "VFModule1",
+        "modelName": "vf_vmee0..VfVmee..base_vmme..module-0",
+        "type": "VFmodule",
+        "isEcompGeneratedNaming": true,
+        "dynamicInputs": [],
+        "dynamicModelName": "vf_vmee0..VfVmee..base_vmme..module-0bykqx",
+        "typeName": "M",
+        "menuActions": {"edit": {}, "showAuditInfo": {}, "remove": {}, "delete": {}, "undoDelete": {}},
+        "isFailed": false,
+        "statusProperties": [{"key": "Prov Status:", "testId": "provStatus"}, {
+          "key": "Orch Status:",
+          "testId": "orchStatus"
+        }],
+        "trackById": "5pfyfah820h",
+        "parentType": "VNF",
+        "position": 0,
+        "errors": {}
+      }, {
+        "modelCustomizationId": "6add59e0-7fe1-4bc4-af48-f8812422ae7c",
+        "modelId": "41708296-e443-4c71-953f-d9a010f059e1",
+        "modelUniqueId": "6add59e0-7fe1-4bc4-af48-f8812422ae7c",
+        "missingData": false,
+        "id": 987761655742,
+        "action": "Create",
+        "name": "VNFModule3",
+        "modelName": "vf_vmee0..VfVmee..vmme_gpb..module-2",
+        "type": "VFmodule",
+        "isEcompGeneratedNaming": true,
+        "dynamicInputs": [],
+        "dynamicModelName": "vf_vmee0..VfVmee..vmme_gpb..module-2fjrrc",
+        "typeName": "M",
+        "menuActions": {"edit": {}, "showAuditInfo": {}, "remove": {}, "delete": {}, "undoDelete": {}},
+        "isFailed": false,
+        "statusProperties": [{"key": "Prov Status:", "testId": "provStatus"}, {
+          "key": "Orch Status:",
+          "testId": "orchStatus"
+        }],
+        "trackById": "i3dllio31bb",
+        "parentType": "VNF",
+        "position": 1,
+        "errors": {}
+      }, {
+        "modelCustomizationId": "55b1be94-671a-403e-a26c-667e9c47d091",
+        "modelId": "522159d5-d6e0-4c2a-aa44-5a542a12a830",
+        "modelUniqueId": "55b1be94-671a-403e-a26c-667e9c47d091",
+        "missingData": false,
+        "id": 873798901625,
+        "action": "Create",
+        "name": "VFModule2",
+        "modelName": "vf_vmee0..VfVmee..vmme_vlc..module-1",
+        "type": "VFmodule",
+        "isEcompGeneratedNaming": true,
+        "dynamicInputs": [],
+        "dynamicModelName": "vf_vmee0..VfVmee..vmme_vlc..module-1djjni",
+        "typeName": "M",
+        "menuActions": {"edit": {}, "showAuditInfo": {}, "remove": {}, "delete": {}, "undoDelete": {}},
+        "isFailed": false,
+        "statusProperties": [{"key": "Prov Status:", "testId": "provStatus"}, {
+          "key": "Orch Status:",
+          "testId": "orchStatus"
+        }],
+        "trackById": "w7bvw1nh47s",
+        "parentType": "VNF",
+        "position": 2,
+        "errors": {}
+      }],
+      "errors": {}
+    }, {
+      "modelCustomizationId": "91415b44-753d-494c-926a-456a9172bbb9",
+      "modelId": "d6557200-ecf2-4641-8094-5393ae3aae60",
+      "modelUniqueId": "91415b44-753d-494c-926a-456a9172bbb9",
+      "missingData": false,
+      "id": "dywch8hkomi",
+      "action": "Create",
+      "inMaint": false,
+      "name": "yoav2",
+      "modelName": "VF_vMee 0",
+      "type": "VF",
+      "isEcompGeneratedNaming": true,
+      "networkStoreKey": "VF_vMee 0",
+      "vnfStoreKey": "VF_vMee 0",
+      "typeName": "VNF",
+      "menuActions": {"edit": {}, "showAuditInfo": {}, "duplicate": {}, "remove": {}, "delete": {}, "undoDelete": {}},
+      "isFailed": false,
+      "statusProperties": [{"key": "Prov Status:", "testId": "provStatus"}, {
+        "key": "Orch Status:",
+        "testId": "orchStatus"
+      }],
+      "trackById": "fjczf1urdqo",
+      "parentType": "",
+      "position": 1,
+      "children": [],
+      "errors": {}
+    }];
+    let from = {
+      data: {
+        type: 'VF',
+        index: 1
+      }
+    };
+
+    let to = {
+      parent: {
+        data: {
+          type: 'VF',
+          index: 0
+        }
+      }
+    };
+    jest.spyOn(service, 'array_move');
+
+    service.drag(store, "serviceInstanceId", nodes, {from, to});
+
+
+    expect(service.array_move).toHaveBeenCalled();
+
+  });
+
+
+});
diff --git a/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.service.ts b/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.service.ts
new file mode 100644
index 000000000..01763c685
--- /dev/null
+++ b/vid-webpack-master/src/app/drawingBoard/service-planning/drawing-board-tree/dragAndDrop/dragAndDrop.service.ts
@@ -0,0 +1,78 @@
+import {Injectable} from "@angular/core";
+import {NgRedux} from "@angular-redux/store";
+import {AppState} from "../../../../shared/store/reducers";
+import {DragAndDropModel} from "./dragAndDrop.model";
+import {FeatureFlagsService, Features} from "../../../../shared/services/featureFlag/feature-flags.service";
+import * as _ from 'lodash';
+
+@Injectable()
+export class DragAndDropService {
+
+  constructor(private store: NgRedux<AppState>){}
+
+  isAllow(): boolean {
+    return FeatureFlagsService.getFlagState(Features.DRAG_AND_DROP_OPERATION, this.store);
+  }
+  /********************************************************************
+   * manage drawing-board drag and drop operation
+   * @param nodes - array with elements data.
+   * @param tree - tree instance
+   * @param node - element information
+   * @param from - element from information
+   * @param to - element to information
+   ************************************************************/
+
+  drag(store, instanceId : string , nodes, {from, to}) :void{
+    if (!store.getState().global.flags["DRAG_AND_DROP_OPERATION"]) return;
+
+    let firstLevelNames : DragAndDropModel[] = [
+        new DragAndDropModel('VF',true),
+        new DragAndDropModel('VL',true),
+        new DragAndDropModel('VFmodule',false)
+    ];
+
+    const fromObject = _.find(firstLevelNames, ['type', from.data.type]);
+    const toObject = _.find(firstLevelNames, ['type', to.parent.data.type]);
+
+    /***********************************************************************************************
+     if the type are the same and there in same level + same parent -> then change element position
+     ***********************************************************************************************/
+    if(fromObject.isFirstLevel === toObject.isFirstLevel){ // moving element in the same level and in the first level
+      if(fromObject.isFirstLevel){
+        this.array_move(nodes, from.index , to.parent.index, instanceId);
+      } else if(fromObject.isFirstLevel === toObject.isFirstLevel){
+        /* check if they have the same parent */
+        if(from.parent.data.trackById === to.parent.parent.data.trackById){
+          let vfModules = nodes.find((parents)=> {
+            return parents.trackById === to.parent.parent.data.trackById;
+          }).children;
+          this.array_move(vfModules, from.index , to.parent.index, instanceId, to.parent.parent.data.vnfStoreKey);
+        }
+      }
+    }
+  }
+
+
+   /********************************************************************
+   * move element inside array with elements position
+   * @param arr - array with elements data.
+   * @param originalPosition - element original position
+   * @param destPosition - element dest position
+   * @param destPinstanceIdosition - instance id
+   ******************************************************************/
+  array_move(arr, originalPosition, destPosition, instanceId : string, parentStoreKey?) {
+    if (destPosition >= arr.length) {
+      let k = destPosition - arr.length + 1;
+      while (k--) {
+        arr.push(undefined);
+      }
+    }
+    arr.splice(destPosition, 0, arr.splice(originalPosition, 1)[0]);
+    arr.forEach((item, index) => {
+      if(item.position !== index){
+        item.position = index;
+        item.updatePoistionFunction(this, item, instanceId, parentStoreKey);
+      }
+    });
+  };
+}