Rework the Open CL window

Rework the Open CL window of the Clamp UI.

Issue-ID: CLAMP-420
Change-Id: Ic7e1e6add4067bc2ee94bd758d76e15397d941df
Signed-off-by: xuegao <xg353y@intl.att.com>

2 files changed, 82 insertions, 6 deletions

diff --git a/ui-react/src/api/LoopCache.js b/ui-react/src/api/LoopCache.js
index 80f02f027..d44b5cfd8 100644
--- a/ui-react/src/api/LoopCache.js
+++ b/ui-react/src/api/LoopCache.js
@@ -18,7 +18,7 @@
  * limitations under the License.
  * ============LICENSE_END============================================
  * ===================================================================
- * 
+ *
  */
 
 class LoopCache {
@@ -30,9 +30,9 @@ class LoopCache {
 	}
 
 	updateMsProperties(type, newMsProperties) {
-		if (newMsProperties["name"] == type) {
+		if (newMsProperties["name"] === type) {
 			for (var policy in this.loopJsonCache["microServicePolicies"]) {
-				if (this.loopJsonCache["microServicePolicies"][policy]["name"] == type) {
+				if (this.loopJsonCache["microServicePolicies"][policy]["name"] === type) {
 					this.loopJsonCache["microServicePolicies"][policy] = newMsProperties;
 				}
 			}
@@ -70,7 +70,7 @@ class LoopCache {
 	getMsJson(type) {
 		var msProperties = this.loopJsonCache["microServicePolicies"];
 		for (var policy in msProperties) {
-			if (msProperties[policy]["name"] == type) {
+			if (msProperties[policy]["name"] === type) {
 				return JSON.parse(JSON.stringify(msProperties[policy]));
 			}
 		}
@@ -80,7 +80,7 @@ class LoopCache {
 	getMsProperty(type) {
 		var msProperties = this.loopJsonCache["microServicePolicies"];
 		for (var policy in msProperties) {
-			if (msProperties[policy]["name"] == type) {
+			if (msProperties[policy]["name"] === type) {
 				if (msProperties[policy]["properties"] !== null && msProperties[policy]["properties"] !== undefined) {
 					return JSON.parse(JSON.stringify(msProperties[policy]["properties"]));
 				}
@@ -92,7 +92,7 @@ class LoopCache {
 	getMsUI(type) {
 		var msProperties = this.loopJsonCache["microServicePolicies"];
 		for (var policy in msProperties) {
-			if (msProperties[policy]["name"] == type) {
+			if (msProperties[policy]["name"] === type) {
 				return JSON.parse(JSON.stringify(msProperties[policy]["jsonRepresentation"]));
 			}
 		}
diff --git a/ui-react/src/api/LoopService.js b/ui-react/src/api/LoopService.js
new file mode 100644
index 000000000..f59f45763
--- /dev/null
+++ b/ui-react/src/api/LoopService.js
@@ -0,0 +1,76 @@
+/*-
+ * ============LICENSE_START=======================================================
+ * ONAP CLAMP
+ * ================================================================================
+ * Copyright (C) 2019 AT&T Intellectual Property. All rights reserved.
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ============LICENSE_END============================================
+ * ===================================================================
+ *
+ */
+
+export default class LoopService {
+	static getLoopNames() {
+		const url = '/restservices/clds/v2/loop/getAllNames';
+		const options = {
+			method: 'GET'
+		};
+		return fetch(url,options)
+		.then(function (response) {
+			if (response.ok) {
+				console.log("GetLoopNames response received: ", response.status);
+				return response.json();
+			} else {
+				let errorMsg = "GetLoopNames failed with status code: " + response.status;
+				console.error(errorMsg);
+				return Promise.reject(errorMsg);
+			}
+		})
+		.then(function (data) {
+			return data;
+		})
+		.catch(function(error) {
+			console.error("GetLoopNames error received",error);
+			return Promise.reject(error);
+		});
+	}
+
+	static getLoop(loopName) {
+		const url = '/restservices/clds/v2/loop/' + loopName;
+		const options = {
+			method: 'GET',
+			headers: {
+				"Content-Type": "application/json"
+			}
+		};
+		return fetch(url,options)
+		.then(function (response) {
+			if (response.ok) {
+				console.log("GetLoop response received: ", response.status);
+				return response.json();
+			} else {
+				let errorMsg = "GetLoop failed with status code: " + response.status;
+				console.error(errorMsg);
+				return Promise.reject(errorMsg);
+			}
+		})
+		.then(function (data) {
+			return data;
+		})
+		.catch(function(error) {
+			console.error("GetLoop error received",error);
+			return Promise.reject(error);
+		});
+	}
+}