diff options
Diffstat (limited to 'testapi/opnfv_testapi/ui/components/pods')
| -rw-r--r-- | testapi/opnfv_testapi/ui/components/pods/pods.html | 76 | ||||
| -rw-r--r-- | testapi/opnfv_testapi/ui/components/pods/podsController.js | 122 |
2 files changed, 198 insertions, 0 deletions
diff --git a/testapi/opnfv_testapi/ui/components/pods/pods.html b/testapi/opnfv_testapi/ui/components/pods/pods.html new file mode 100644 index 0000000..22f2934 --- /dev/null +++ b/testapi/opnfv_testapi/ui/components/pods/pods.html @@ -0,0 +1,76 @@ +<h3>Pods</h3> +<p>This page is used to create or query pods.<br> + Querying pods is open to everybody.<br> + But only login users are granted the privilege to create the new pod. +</p> + +<div class="row" style="margin-bottom:24px;"></div> + +<div class="pod-create" ng-class="{ 'hidden': ! auth.isAuthenticated }"> + <h4>Create</h4> + <div class="row"> + <div ng-repeat="require in ctrl.createRequirements"> + <div class="create-pod" style="margin-left:24px;"> + <p class="input-group"> + <label for="cpid">{{require.label|capitalize}}: </label> + <a ng-if="require.type == 'select'"> + <select dynamic-model="'ctrl.' + require.label" ng-options="option for option in require.selects"></select> + </a> + <a ng-if="require.type == 'text'"> + <input type="text" dynamic-model="'ctrl.' + require.label"/> + </a> + <a ng-if="require.type == 'textarea'"> + <textarea rows="2" cols="50" dynamic-model="'ctrl.' + require.label"> + </textarea> + </a> + </p> + </div> + </div> + + <div class="col-md-3" style="margin-top:12px; margin-left:8px;"> + <button type="submit" class="btn btn-primary" ng-click="ctrl.create()">Create</button> + </div> + </div> +</div> + +<div class="pods-filters" style="margin-top:36px;"> + <h4>Filters</h4> + <div class="row"> + <div class="col-md-3" style="margin-top:12px; margin-left:8px;"> + <button type="submit" class="btn btn-primary" ng-click="ctrl.update()">Filter</button> + <button type="submit" class="btn btn-primary btn-danger" ng-click="ctrl.clearFilters()">Clear</button> + </div> + </div> +</div> + +<div cg-busy="{promise:ctrl.authRequest,message:'Loading'}"></div> +<div cg-busy="{promise:ctrl.podsRequest,message:'Loading'}"></div> + +<div ng-show="ctrl.data" class="pods-table" style="margin-top:24px; margin-left:8px;"> + <table ng-data="ctrl.data.pods" ng-show="ctrl.data" class="table table-striped table-hover"> + <tbody> + <tr ng-repeat-start="(index, pod) in ctrl.data.pods"> + <td> + <a href="#" ng-click="showPod = !showPod">{{pod.name}}</a> + <div class="show-pod" ng-class="{ 'hidden': ! showPod }" style="margin-left:24px;"> + <p> + owner: {{pod.owner}}<br> + role: {{pod.role}}<br> + mode: {{pod.mode}}<br> + create_date: {{pod.creation_date}}<br> + details: {{pod.details}} + </p> + </div> + </td> + </tr> + <tr ng-repeat-end=> + </tr> + </tbody> + </table> +</div> +<br> +<div ng-show="ctrl.showError" class="alert alert-danger" role="alert"> + <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span> + <span class="sr-only">Error:</span> + {{ctrl.error}} +</div> diff --git a/testapi/opnfv_testapi/ui/components/pods/podsController.js b/testapi/opnfv_testapi/ui/components/pods/podsController.js new file mode 100644 index 0000000..489fa8a --- /dev/null +++ b/testapi/opnfv_testapi/ui/components/pods/podsController.js @@ -0,0 +1,122 @@ +/* + * 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('PodsController', PodsController); + + PodsController.$inject = [ + '$scope', '$http', '$filter', '$state', 'testapiApiUrl','raiseAlert' + ]; + + /** + * TestAPI Pods Controller + * This controller is for the '/pods' page where a user can browse + * through pods declared in TestAPI. + */ + function PodsController($scope, $http, $filter, $state, testapiApiUrl, + raiseAlert) { + var ctrl = this; + ctrl.url = testapiApiUrl + '/pods'; + + ctrl.create = create; + ctrl.update = update; + ctrl.open = open; + ctrl.clearFilters = clearFilters; + + ctrl.roles = ['community-ci', 'production-ci']; + ctrl.modes = ['metal', 'virtual']; + ctrl.createRequirements = [ + {label: 'name', type: 'text', required: true}, + {label: 'mode', type: 'select', selects: ctrl.modes}, + {label: 'role', type: 'select', selects: ctrl.roles}, + {label: 'details', type: 'textarea', required: false} + ]; + + ctrl.name = ''; + ctrl.role = 'community-ci'; + ctrl.mode = 'metal'; + ctrl.details = ''; + + /** + * This is called when the date filter calendar is opened. It + * does some event handling, and sets a scope variable so the UI + * knows which calendar was opened. + * @param {Object} $event - The Event object + * @param {String} openVar - Tells which calendar was opened + */ + function open($event, openVar) { + $event.preventDefault(); + $event.stopPropagation(); + ctrl[openVar] = true; + } + + /** + * This function will clear all filters and update the results + * listing. + */ + function clearFilters() { + ctrl.update(); + } + + /** + * This will contact the TestAPI to create a new pod. + */ + function create() { + ctrl.showError = false; + + if(ctrl.name != ""){ + var pods_url = ctrl.url; + var body = { + name: ctrl.name, + mode: ctrl.mode, + role: ctrl.role, + details: ctrl.details + }; + ctrl.podsRequest = + $http.post(pods_url, body).error(function (data, status) { + ctrl.showError = true; + if(status == 403){ + ctrl.error = + 'Error creating the new pod from server: Pod\'s name already exists' + } + }); + } + else{ + ctrl.showError = true; + ctrl.error = 'Name is missing.' + } + } + + /** + * This will contact the TestAPI to get a listing of declared pods. + */ + function update() { + ctrl.showError = false; + ctrl.podsRequest = + $http.get(ctrl.url).success(function (data) { + ctrl.data = data; + }).error(function (error) { + ctrl.data = null; + ctrl.showError = true; + ctrl.error = + 'Error retrieving pods from server: ' + + angular.toJson(error); + }); + } + } +})(); |