Add view option in pods page

Created the view function for the pods page.
It will redirect to pods/:name page where user
can see the more details about the pod.

Change-Id: I0d6c06098fd78ecca523a49e2bb532001adaeaa8
Signed-off-by: thuva4 <tharma.thuva@gmail.com>

2 files changed, 103 insertions, 0 deletions

diff --git a/testapi/opnfv_testapi/ui/components/pods/pod/pod.html b/testapi/opnfv_testapi/ui/components/pods/pod/pod.html
new file mode 100644
index 0000000..b78eb2d
--- /dev/null
+++ b/testapi/opnfv_testapi/ui/components/pods/pod/pod.html
@@ -0,0 +1,47 @@
+<legend>Pod</legend>
+<div style="padding-right:0px">
+    <div class="table-responsive">
+        <table class="table"  ng-data="ctrl.data.pods">
+            <tbody>
+                <tr style="padding:9px">
+                    <td class="podsTableTd">Id&nbsp;:</td>
+                    <td class="podsTableLeftTd">{{ctrl.data._id}}</td>
+                </tr>
+                <tr style="padding:9px">
+                    <td class="podsTableTd">Name&nbsp;:</td>
+                    <td width="90%" class="podsTableLeftTd">{{ctrl.data.name}}</td>
+                </tr>
+                <tr style="padding:9px">
+                    <td class="podsTableTd">Owner&nbsp;:</td>
+                    <td width="90%" class="podsTableLeftTd">{{ctrl.data.owner}}</td>
+                </tr>
+                <tr style="padding:9px">
+                    <td class="podsTableTd">Role&nbsp;:</td>
+                    <td width="90%"  class="podsTableLeftTd">{{ctrl.data.role}}</td>
+                </tr>
+                <tr style="padding:9px">
+                    <td class="podsTableTd">Mode&nbsp;:</td>
+                    <td width="90%" class="podsTableLeftTd">{{ctrl.data.mode}}</td>
+                </tr>
+                <tr style="padding:9px">
+                    <td class="podsTableTd">Created&nbsp;at&nbsp;:</td>
+                    <td width="90%" class="podsTableLeftTd">{{ctrl.data['creation_date']}}</td>
+                </tr>
+                <tr style="padding:9px">
+                    <td class="podsTableTd">Details&nbsp;:</td>
+                    <td  width="90%" class="podsTableLeftTd">{{ctrl.data.details}}</td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+</div>
+<div class="col-md-12">
+        <div ng-show="ctrl.showError" class="col-md-12 alert alert-danger" role="alert">
+            <span class="pull-right">&nbsp;{{ctrl.error}}</span>
+            <span class="glyphicon glyphicon-exclamation-sign pull-right" aria-hidden="true" >Error:</span>
+        </div>
+        <div ng-show="ctrl.showSuccess" class="col-md-12 alert alert-success" role="alert">
+            <span class="pull-right">&nbsp;{{ctrl.success}}</span>
+            <span class="glyphicon glyphicon-ok pull-right" aria-hidden="true"></span>
+        </div>
+    </div>
\ No newline at end of file
diff --git a/testapi/opnfv_testapi/ui/components/pods/pod/podController.js b/testapi/opnfv_testapi/ui/components/pods/pod/podController.js
new file mode 100644
index 0000000..a2e18e8
--- /dev/null
+++ b/testapi/opnfv_testapi/ui/components/pods/pod/podController.js
@@ -0,0 +1,56 @@
+/*
+ * 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.
+ */
+
+(function () {
+    'use strict';
+
+    angular
+        .module('testapiApp')
+        .controller('PodController', PodController);
+
+    PodController.$inject = [
+        '$scope', '$http', '$filter', '$state', '$window', '$uibModal', 'testapiApiUrl','raiseAlert',
+        'confirmModal'
+    ];
+
+    /**
+     * TestAPI Pod Controller
+     * This controller is for the '/pod' page where a user can browse
+     * through pod declared in TestAPI.
+     */
+    function PodController($scope, $http, $filter, $state, $window, $uibModal, testapiApiUrl,
+        raiseAlert, confirmModal) {
+        var ctrl = this;
+        ctrl.url = testapiApiUrl + '/pods';
+        ctrl.name = $state.params['name'];
+        ctrl.loadDetails = loadDetails
+
+        /**
+         *Contact the testapi and retrevie the pod details
+         */
+        function loadDetails(){
+            var podUrl = ctrl.url + '/' + ctrl.name;
+            ctrl.showError = false;
+            ctrl.podsRequest =
+                $http.get(podUrl).success(function (data) {
+                    ctrl.data = data;
+                }).catch(function (error) {
+                    ctrl.data = null;
+                    ctrl.showError = true;
+                    ctrl.error = error.statusText;
+                });
+        }
+        ctrl.loadDetails();
+    }
+})();
\ No newline at end of file