summaryrefslogtreecommitdiffstats
path: root/gui/app
diff options
context:
space:
mode:
authorJing Lu <lvjing5@huawei.com>2017-08-25 00:50:21 +0000
committerGerrit Code Review <gerrit@opnfv.org>2017-08-25 00:50:21 +0000
commitf5a96ffd959b11a122c4beea1fc99c89f755678c (patch)
tree1c0cad1b94f33a3275c816999653870e6955d6eb /gui/app
parentffecd5b84eecdb74d7534b801c1359251c34b34e (diff)
parentefb4f088f14aee394599bea21973f82f1867c4fe (diff)
Merge "Add function to upload image from local/url in GUI"
Diffstat (limited to 'gui/app')
-rw-r--r--gui/app/scripts/controllers/image.controller.js301
-rw-r--r--gui/app/scripts/controllers/main.js169
-rw-r--r--gui/app/scripts/controllers/projectDetail.controller.js2
-rw-r--r--gui/app/scripts/factory/main.factory.js39
-rw-r--r--gui/app/views/modal/environmentDialog.html15
-rw-r--r--gui/app/views/modal/imageDialog.html19
-rw-r--r--gui/app/views/podupload.html2
-rw-r--r--gui/app/views/uploadImage.html82
8 files changed, 393 insertions, 236 deletions
diff --git a/gui/app/scripts/controllers/image.controller.js b/gui/app/scripts/controllers/image.controller.js
index f6c91592f..d7a7edfa9 100644
--- a/gui/app/scripts/controllers/image.controller.js
+++ b/gui/app/scripts/controllers/image.controller.js
@@ -1,150 +1,235 @@
'use strict';
angular.module('yardStickGui2App')
- .controller('ImageController', ['$scope', '$state', '$stateParams', 'mainFactory', 'Upload', 'toaster', '$location', '$interval',
- function($scope, $state, $stateParams, mainFactory, Upload, toaster, $location, $interval) {
+ .controller('ImageController', ['$scope', '$state', '$stateParams', 'mainFactory', 'Upload', 'toaster', '$location', '$interval', 'ngDialog',
+ function($scope, $state, $stateParams, mainFactory, Upload, toaster, $location, $interval, ngDialog) {
init();
- $scope.showloading = false;
- $scope.ifshowStatus = 0;
function init() {
+ $scope.showloading = false;
+ $scope.ifshowStatus = 0;
+
+ $scope.yardstickImage = [
+ {
+ 'name': 'yardstick-image',
+ 'description': '',
+ 'size': 'N/A',
+ 'status': 'N/A',
+ 'time': 'N/A'
+ },
+ {
+ 'name': 'Ubuntu-16.04',
+ 'description': '',
+ 'size': 'N/A',
+ 'status': 'N/A',
+ 'time': 'N/A'
+ },
+ {
+ 'name': 'cirros-0.3.5',
+ 'description': '',
+ 'size': 'N/A',
+ 'status': 'N/A',
+ 'time': 'N/A'
+ }
+ ];
+ $scope.customImage = [];
$scope.uuid = $stateParams.uuid;
- $scope.uploadImage = uploadImage;
- getItemIdDetail();
- getImageListSimple();
+ $scope.showloading = false;
+ $scope.url = null;
+ $scope.environmentInfo = null;
+
+ getYardstickImageList();
+ getCustomImageList(function(image, image_id){});
}
- function getItemIdDetail() {
+ function getYardstickImageList(){
+ mainFactory.ImageList().get({}).$promise.then(function(response){
+ if(response.status == 1){
+ angular.forEach($scope.yardstickImage, function(ele, index){
+ if(typeof(response.result.images[ele.name]) != 'undefined'){
+ $scope.yardstickImage[index] = response.result.images[ele.name];
+ }
+ });
+ }else{
+ mainFactory.errorHandler1(response);
+ }
+ }, function(response){
+ mainFactory.errorHandler2(response);
+ });
+ }
+
+ function getCustomImageList(func){
mainFactory.ItemDetail().get({
'envId': $stateParams.uuid
}).$promise.then(function(response) {
- if (response.status == 1) {
- $scope.baseElementInfo = response.result.environment;
-
-
- } else {
- toaster.pop({
- type: 'error',
- title: 'fail',
- body: response.error_msg,
- timeout: 3000
+ if(response.status == 1){
+ $scope.environmentInfo = response.result.environment;
+ $scope.customImage = [];
+ angular.forEach(response.result.environment.image_id, function(ele){
+ mainFactory.getImage().get({'imageId': ele}).$promise.then(function(responseData){
+ if(responseData.status == 1){
+ $scope.customImage.push(responseData.result.image);
+ func(responseData.result.image, ele);
+ }else{
+ mainFactory.errorHandler1(responseData);
+ }
+ }, function(errorData){
+ mainFactory.errorHandler2(errorData);
+ });
});
+ }else{
+ mainFactory.errorHandler1(response);
}
- }, function(error) {
- toaster.pop({
- type: 'error',
- title: 'fail',
- body: 'unknow error',
- timeout: 3000
- });
- })
+ }, function(response){
+ mainFactory.errorHandler2(response);
+ });
}
- function getImageListSimple() {
-
- mainFactory.ImageList().get({}).$promise.then(function(response) {
- if (response.status == 1) {
- $scope.imageListData = response.result.images;
- // $scope.imageStatus = response.result.status;
-
- } else {
- toaster.pop({
- type: 'error',
- title: 'get data failed',
- body: 'please retry',
- timeout: 3000
- });
- }
- }, function(error) {
- toaster.pop({
- type: 'error',
- title: 'get data failed',
- body: 'please retry',
- timeout: 3000
+ $scope.loadYardstickImage = function(image_name){
+
+ var updateImageTask = $interval(updateYardstickImage, 10000);
+
+ function updateYardstickImage(){
+ mainFactory.ImageList().get({}).$promise.then(function(responseData){
+ if(responseData.status == 1){
+ if(typeof(responseData.result.images[image_name]) != 'undefined' && responseData.result.images[image_name].status == 'ACTIVE'){
+ angular.forEach($scope.yardstickImage, function(ele, index){
+ if(ele.name == image_name){
+ $scope.yardstickImage[index] = responseData.result.images[ele.name];
+ }
+ });
+ $interval.cancel(updateImageTask);
+ }
+ }else{
+ mainFactory.errorHandler1(responseData);
+ }
+ },function(errorData){
+ mainFactory.errorHandler2(errorData);
});
- })
- }
+ }
+ mainFactory.uploadImage().post({'action': 'load_image', 'args': {'name': image_name}}).$promise.then(function(response){
+ },function(response){
+ mainFactory.errorHandler2(response);
+ });
+ }
- function getImageList() {
- if ($scope.intervalImgae != undefined) {
- $interval.cancel($scope.intervalImgae);
- }
- mainFactory.ImageList().get({}).$promise.then(function(response) {
- if (response.status == 1) {
- $scope.imageListData = response.result.images;
- $scope.imageStatus = response.result.status;
-
- if ($scope.imageStatus == 0) {
- $scope.intervalImgae = $interval(function() {
- getImageList();
- }, 5000);
- } else if ($scope.intervalImgae != undefined) {
- $interval.cancel($scope.intervalImgae);
+ $scope.deleteYardstickImage = function(image_name){
+
+ var updateImageTask = $interval(updateYardstickImage, 10000);
+
+ function updateYardstickImage(){
+ mainFactory.ImageList().get({}).$promise.then(function(response){
+ if(response.status == 1){
+ if(typeof(response.result.images[image_name]) == 'undefined'){
+ angular.forEach($scope.yardstickImage, function(ele, index){
+ if(ele.name == image_name){
+ $scope.yardstickImage[index].size = 'N/A';
+ $scope.yardstickImage[index].status = 'N/A';
+ $scope.yardstickImage[index].time = 'N/A';
+ }
+ });
+ $interval.cancel(updateImageTask);
+ }
+ }else{
+ mainFactory.errorHandler1(response);
}
+ },function(response){
+ mainFactory.errorHandler2(response);
+ });
+ }
- } else {
- toaster.pop({
- type: 'error',
- title: 'get data failed',
- body: 'please retry',
- timeout: 3000
+ mainFactory.uploadImage().post({'action': 'delete_image', 'args': {'name': image_name}}).$promise.then(function(response){
+ },function(response){
+ mainFactory.errorHandler2(response);
+ });
+ }
+
+ $scope.uploadCustomImageByUrl = function(url){
+ mainFactory.uploadImageByUrl().post({
+ 'action': 'upload_image_by_url',
+ 'args': {
+ 'environment_id': $stateParams.uuid,
+ 'url': url
+ }
+ }).$promise.then(function(response){
+ if(response.status == 1){
+ var updateImageTask = $interval(getCustomImageList, 30000, 10, true, function(image, image_id){
+ if(image_id == response.result.uuid && image.status == 'ACTIVE'){
+ $interval.cancel(updateImageTask);
+ }
});
+ ngDialog.close();
+ }else{
+ mainFactory.errorHandler1(response);
}
- }, function(error) {
- toaster.pop({
- type: 'error',
- title: 'get data failed',
- body: 'please retry',
- timeout: 3000
- });
- })
+ }, function(response){
+ mainFactory.errorHandler2(response);
+ });
}
- function uploadImage() {
- $scope.imageStatus = 0;
- $interval.cancel($scope.intervalImgae);
- $scope.ifshowStatus = 1;
+ $scope.uploadCustomImage = function($file, $invalidFiles) {
$scope.showloading = true;
- mainFactory.uploadImage().post({
- 'action': 'load_image',
- 'args': {
- 'environment_id': $scope.uuid
- }
- }).$promise.then(function(response) {
+ $scope.displayImageFile = $file;
+ Upload.upload({
+ url: Base_URL + '/api/v2/yardstick/images',
+ data: { file: $file, 'environment_id': $scope.uuid, 'action': 'upload_image' }
+ }).then(function(response) {
+
$scope.showloading = false;
- if (response.status == 1) {
+ if (response.data.status == 1) {
+
toaster.pop({
type: 'success',
- title: 'create success',
+ title: 'upload success',
body: 'you can go next step',
timeout: 3000
});
- setTimeout(function() {
- getImageList();
- }, 10000);
- } else {
- toaster.pop({
- type: 'error',
- title: 'failed',
- body: 'something wrong',
- timeout: 3000
+ var updateImageTask = $interval(getCustomImageList, 10000, 10, true, function(image, image_id){
+ if(image_id == response.data.result.uuid && image.status == 'ACTIVE'){
+ $interval.cancel(updateImageTask);
+ }
});
+ }else{
+ mainFactory.errorHandler1(response);
+ }
+ }, function(response) {
+ $scope.uploadfile = null;
+ mainFactory.errorHandler2(response);
+ })
+ }
+
+ $scope.deleteCustomImage = function(image_id){
+ mainFactory.deleteImage().delete({'imageId': image_id}).$promise.then(function(response){
+ if(response.status == 1){
+ $interval(getCustomImageList, 10000, 5, true, function(image, image_id){
+ });
+ }else{
+ mainFactory.errorHandler2(response);
}
- }, function(error) {
- toaster.pop({
- type: 'error',
- title: 'failed',
- body: 'something wrong',
- timeout: 3000
- });
+ }, function(response){
+ mainFactory.errorHandler2(response);
+ });
+ }
+
+ $scope.openImageDialog = function(){
+ $scope.url = null;
+ ngDialog.open({
+ preCloseCallback: function(value) {
+ },
+ template: 'views/modal/imageDialog.html',
+ scope: $scope,
+ className: 'ngdialog-theme-default',
+ width: 950,
+ showClose: true,
+ closeByDocument: false
})
}
@@ -158,9 +243,5 @@ angular.module('yardStickGui2App')
$state.go('app.podUpload', { uuid: $scope.uuid });
}
-
-
-
-
}
]);
diff --git a/gui/app/scripts/controllers/main.js b/gui/app/scripts/controllers/main.js
index ab76bf0f2..ceec83fa9 100644
--- a/gui/app/scripts/controllers/main.js
+++ b/gui/app/scripts/controllers/main.js
@@ -15,7 +15,7 @@ angular.module('yardStickGui2App')
$scope.showImage = null;
$scope.showContainer = null;
$scope.showNextOpenRc = null;
- $scope.showNextPod = null;
+ $scope.showNextPod = 1;
$scope.displayContainerInfo = [];
$scope.containerList = [{ value: 'create_influxdb', name: "InfluxDB" }, { value: 'create_grafana', name: "Grafana" }]
@@ -51,7 +51,6 @@ angular.module('yardStickGui2App')
$scope.chooseResult = chooseResult;
getEnvironmentList();
- // getImageList();
}
@@ -85,7 +84,7 @@ angular.module('yardStickGui2App')
}
$scope.goToImage = function goToImage() {
- getImageListSimple();
+ getImageList();
$scope.showImage = 1;
}
$scope.goToPod = function goToPod() {
@@ -290,7 +289,7 @@ angular.module('yardStickGui2App')
$scope.showImage = null;
$scope.showContainer = null;
$scope.showNextOpenRc = null;
- $scope.showNextPod = null;
+ $scope.showNextPod = 1;
$scope.displayContainerInfo = [];
$scope.displayPodFile = null;
@@ -308,7 +307,6 @@ angular.module('yardStickGui2App')
ngDialog.open({
preCloseCallback: function(value) {
getEnvironmentList();
- // getImageList();
},
template: 'views/modal/environmentDialog.html',
scope: $scope,
@@ -479,106 +477,97 @@ angular.module('yardStickGui2App')
})
}
- $scope.uploadImage = function uploadImage() {
- $scope.imageStatus = 0;
- $scope.showImageStatus = 1;
- $scope.showloading = true;
- mainFactory.uploadImage().post({
- 'action': 'load_image',
- 'args': {
- 'environment_id': $scope.uuid
+ $scope.yardstickImage = {
+ 'yardstick-image': {
+ 'name': 'yardstick-image',
+ 'description': '',
+ 'status': 'N/A'
+ },
+ 'Ubuntu-16.04': {
+ 'name': 'Ubuntu-16.04',
+ 'description': '',
+ 'status': 'N/A'
+ },
+ 'cirros-0.3.5': {
+ 'name': 'cirros-0.3.5',
+ 'description': '',
+ 'status': 'N/A'
+ }
+ };
- }
- }).$promise.then(function(response) {
- $scope.showloading = false;
- if (response.status == 1) {
- toaster.pop({
- type: 'success',
- title: 'create success',
- body: 'you can go next step',
- timeout: 3000
- });
- setTimeout(function() {
- getImageList();
- }, 10000);
- $scope.showNextPod = 1;
+ $scope.selectImageList = [];
- } else {
- toaster.pop({
- type: 'error',
- title: 'failed',
- body: 'something wrong',
- timeout: 3000
- });
+ $scope.selectImage = function(name){
+ $scope.selectImageList.push(name);
+ }
- }
- }, function(error) {
- toaster.pop({
- type: 'error',
- title: 'failed',
- body: 'something wrong',
- timeout: 3000
- });
- })
+ $scope.unselectImage = function(name){
+ var index = $scope.selectImageList.indexOf(name);
+ $scope.selectImageList.splice(index, 1);
}
- function getImageList() {
- if ($scope.intervalImgae != undefined) {
- $interval.cancel($scope.intervalImgae);
- }
- mainFactory.ImageList().get({}).$promise.then(function(response) {
- if (response.status == 1) {
- $scope.imageListData = response.result.images;
- $scope.imageStatus = response.result.status;
+ $scope.uploadImage = function() {
+ $scope.imageStatus = 0;
+ $scope.showImageStatus = 1;
+ $scope.showloading = true;
- if ($scope.imageStatus == 0) {
- $scope.intervalImgae = $interval(function() {
- getImageList();
- }, 5000);
- } else if ($scope.intervalImgae != undefined) {
- $interval.cancel($scope.intervalImgae);
+ var updateImageTask = $interval(function(){
+ mainFactory.ImageList().get({}).$promise.then(function(response){
+ if(response.status == 1){
+ var isOk = true;
+ angular.forEach($scope.selectImageList, function(ele){
+ if(typeof(response.result.images[ele]) != 'undefined' && response.result.images[ele].status == 'ACTIVE'){
+ $scope.yardstickImage[ele] = response.result.images[ele];
+ }else{
+ isOk = false;
+ }
+ });
+ if(isOk){
+ $interval.cancel(updateImageTask);
+ $scope.imageStatus = 1;
+ }
+ }else{
+ mainFactory.errorHandler1(response);
}
-
- } else {
- toaster.pop({
- type: 'error',
- title: 'get data failed',
- body: 'please retry',
- timeout: 3000
- });
- }
- }, function(error) {
- toaster.pop({
- type: 'error',
- title: 'get data failed',
- body: 'please retry',
- timeout: 3000
+ }, function(response){
+ mainFactory.errorHandler2(response);
});
- })
+ }, 10000);
+
+ angular.forEach($scope.selectImageList, function(ele){
+ mainFactory.uploadImage().post({
+ 'action': 'load_image',
+ 'args': {
+ 'name': ele
+ }
+ }).$promise.then(function(response) {
+ if(response.status == 1){
+ $scope.showloading = false;
+ $scope.showNextPod = 1;
+ }else{
+ mainFactory.errorHandler1(response);
+ }
+ }, function(response) {
+ mainFactory.errorHandler2(response);
+ })
+ });
}
- function getImageListSimple() {
+ function getImageList() {
mainFactory.ImageList().get({}).$promise.then(function(response) {
if (response.status == 1) {
- $scope.imageListData = response.result.images;
- $scope.imageStatus = response.result.status;
-
- } else {
- toaster.pop({
- type: 'error',
- title: 'get data failed',
- body: 'please retry',
- timeout: 3000
+ angular.forEach($scope.yardstickImage, function(value, key){
+ if(typeof(response.result.images[key]) != 'undefined'){
+ $scope.yardstickImage[key] = response.result.images[key];
+ }
});
+ $scope.imageStatus = response.result.status;
+ }else{
+ mainFactory.errorHandler1(response);
}
- }, function(error) {
- toaster.pop({
- type: 'error',
- title: 'get data failed',
- body: 'please retry',
- timeout: 3000
- });
+ }, function(response) {
+ mainFactory.errorHandler2(response);
})
}
diff --git a/gui/app/scripts/controllers/projectDetail.controller.js b/gui/app/scripts/controllers/projectDetail.controller.js
index 843f66c57..e8468045d 100644
--- a/gui/app/scripts/controllers/projectDetail.controller.js
+++ b/gui/app/scripts/controllers/projectDetail.controller.js
@@ -672,7 +672,7 @@ angular.module('yardStickGui2App')
}
$scope.gotoLog = function gotoLog(task_id) {
- $state.go('app2.taskLog', { taskId: task_id });
+ $state.go('app.taskLog', { taskId: task_id });
}
}
]);
diff --git a/gui/app/scripts/factory/main.factory.js b/gui/app/scripts/factory/main.factory.js
index 44fbeb39f..7637a9ff3 100644
--- a/gui/app/scripts/factory/main.factory.js
+++ b/gui/app/scripts/factory/main.factory.js
@@ -9,7 +9,7 @@ var Base_URL;
var Grafana_URL;
angular.module('yardStickGui2App')
- .factory('mainFactory', ['$resource','$rootScope','$http', '$location',function($resource, $rootScope,$http,$location) {
+ .factory('mainFactory', ['$resource','$rootScope','$http', '$location', 'toaster',function($resource, $rootScope ,$http ,$location, toaster) {
Base_URL = 'http://' + $location.host() + ':' + $location.port();
Grafana_URL = 'http://' + $location.host();
@@ -86,6 +86,20 @@ angular.module('yardStickGui2App')
}
})
},
+ getImage: function(){
+ return $resource(Base_URL + '/api/v2/yardstick/images/:imageId', {imageId: "@imageId"}, {
+ 'get': {
+ method: 'GET'
+ }
+ })
+ },
+ deleteImage: function() {
+ return $resource(Base_URL + '/api/v2/yardstick/images/:imageId', { imageId: '@imageId' }, {
+ 'delete': {
+ method: 'DELETE'
+ }
+ })
+ },
uploadImage: function() {
return $resource(Base_URL + '/api/v2/yardstick/images', {}, {
'post': {
@@ -93,6 +107,13 @@ angular.module('yardStickGui2App')
}
})
},
+ uploadImageByUrl: function() {
+ return $resource(Base_URL + '/api/v2/yardstick/images', {}, {
+ 'post': {
+ method: 'POST'
+ }
+ })
+ },
getPodDetail: function() {
return $resource(Base_URL + '/api/v2/yardstick/pods/:podId', { podId: "@podId" }, {
'get': {
@@ -249,6 +270,22 @@ angular.module('yardStickGui2App')
method: 'DELETE'
}
})
+ },
+ errorHandler1: function(response){
+ toaster.pop({
+ 'type': 'error',
+ 'title': 'error',
+ 'body': response.result,
+ 'showCloseButton': true
+ });
+ },
+ errorHandler2: function(response){
+ toaster.pop({
+ 'type': 'error',
+ 'title': response.status,
+ 'body': response.statusText,
+ 'showCloseButton': true
+ });
}
};
diff --git a/gui/app/views/modal/environmentDialog.html b/gui/app/views/modal/environmentDialog.html
index 389de8340..4c539fc33 100644
--- a/gui/app/views/modal/environmentDialog.html
+++ b/gui/app/views/modal/environmentDialog.html
@@ -133,16 +133,17 @@
<table class="table table-striped">
<tr>
+ <th>choose</th>
<th>name</th>
- <th>size</th>
+ <th>description</th>
<th>status</th>
- <th>time</th>
</tr>
- <tr ng-repeat="image in imageListData">
- <td>{{image.name}}</td>
- <td>{{image.size/1024}} mb</td>
- <td>{{image.status}}</td>
- <td>{{image.time}}</td>
+ <tr ng-repeat="(name, value) in yardstickImage">
+ <td ng-if="selectImageList.indexOf(name) > -1"><img src="images/checkyes.png" style="height:12px;cursor:pointer" ng-click="unselectImage(name)" /></td>
+ <td ng-if="selectImageList.indexOf(name) == -1"><img src="images/checkno.png" style="height:12px;cursor:pointer" ng-click="selectImage(name)" /></td>
+ <td>{{name}}</td>
+ <td>{{value.description}}</td>
+ <td>{{value.status}}</td>
</tr>
diff --git a/gui/app/views/modal/imageDialog.html b/gui/app/views/modal/imageDialog.html
new file mode 100644
index 000000000..c568f2aba
--- /dev/null
+++ b/gui/app/views/modal/imageDialog.html
@@ -0,0 +1,19 @@
+<div>
+
+ <h4>Enter Remote Image Url</h4>
+ <input type="text" ng-model="url" />
+
+ <div style="text-align:center;margin-top:20px;">
+ <button class="btn btn-default" ng-disabled=" url==null || url==''" ng-click="uploadCustomImageByUrl(url)">Upload</button>
+ </div>
+
+</div>
+
+
+<style>
+ input {
+ border-radius: 10px;
+ border: 1px solid #eeeeee;
+ width: 100%;
+ }
+</style>
diff --git a/gui/app/views/podupload.html b/gui/app/views/podupload.html
index 99e83aca2..d6d7c0c6e 100644
--- a/gui/app/views/podupload.html
+++ b/gui/app/views/podupload.html
@@ -13,7 +13,7 @@
<hr/>
- <button class="btn btn-default" ngf-select="uploadFiles($file, $invalidFiles)" ngf-max-size="5MB">
+ <button class="btn btn-default" ngf-select="uploadFiles($file, $invalidFiles)" ngf-max-size="1024MB">
<div ng-show="!loadingOPENrc">Upload</div>
<img src="images/loading2.gif" width="25" height="25" ng-if="loadingOPENrc" />
</button>
diff --git a/gui/app/views/uploadImage.html b/gui/app/views/uploadImage.html
index 17ccfdb8b..0c337feeb 100644
--- a/gui/app/views/uploadImage.html
+++ b/gui/app/views/uploadImage.html
@@ -4,56 +4,86 @@
<div style="display:flex;flex-direction:row;">
<div style="width:750px;">
- <h3>{{baseElementInfo.name}} -- Image
+ <h3>{{environmentInfo.name}} -- Image
<button class="btn btn-default" style="float:right" ng-click="goNext()">Next</button>
</h3>
<!--<p>In this process, you can input your define openrc config or upload a openrc file</p>-->
- <hr/>
- <button class="btn btn-default" ng-click="uploadImage()">
- <div ng-if="!showloading">Load Image</div>
- <img src="images/loading2.gif" width="25" height="25" ng-if="showloading" />
- </button>
- <i class="fa fa-check" aria-hidden="true" style="margin-top:34px;margin-left:5px;color: #2ecc71;" ng-show="imageStatus==1&&ifshowStatus==1">done</i>
- <i class="fa fa-spinner" aria-hidden="true" style="margin-top:34px;margin-left:5px;color: #2ecc71;" ng-show="imageStatus==0&&ifshowStatus==1">loading</i>
- <i class="fa fa-exclamation-triangle" aria-hidden="true" style="margin-top:34px;margin-left:5px;color: red;" ng-show="imageStatus==2&&ifshowStatus==1">error</i>
-
<hr>
- <h4>Current Images</h4>
-
+ <h4>Alternative Images</h4>
<div>
<table class="table table-striped">
<tr>
<th>name</th>
+ <th>description</th>
<th>size</th>
<th>status</th>
<th>time</th>
+ <th>action</th>
</tr>
- <tr ng-repeat="image in imageListData">
+ <tr ng-repeat="image in yardstickImage">
<td>{{image.name}}</td>
- <td>{{image.size/1024}} MB</td>
+ <td>{{image.description}}</td>
+ <td>{{image.size | number:2}} MB</td>
<td>{{image.status}}</td>
<td>{{image.time}}</td>
-
+ <td>
+ <div class="btn-group" uib-dropdown>
+ <button id="single-button" type="button" class="btn btn-default btn-sm" uib-dropdown-toggle>
+ action<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button">
+ <li role="menuitem" ng-show="image.status == 'N/A'"><a ng-click="loadYardstickImage(image.name)">load</a></li>
+ <li role="menuitem" ng-show="image.status != 'N/A'"><a ng-click="deleteYardstickImage(image.name)">delete</a></li>
+ </ul>
+ </div>
+ </td>
</tr>
-
-
-
</table>
</div>
+ <hr>
+ <h4 style="display:inline">Custom Images</h4>
+ <div class="btn-group button-margin" style="float:right;margin-top:-10px;margin-bottom:5px">
+ <button class="btn btn-default" style="width:60px" ngf-select="uploadCustomImage($file, $invalidFiles)" ngf-max-size="2048MB">
+ <div ng-show="!showloading">Local</div>
+ <img src="images/loading2.gif" width="25" height="25" ng-if="showloading" />
+ </button>
+ <button class="btn btn-default" style="width:60px" ng-click="openImageDialog()">Url</button>
+ </div>
+ <div>
+ <table class="table table-striped">
-
-
-
-
-
-
+ <tr>
+ <th>name</th>
+ <th>description</th>
+ <th>size</th>
+ <th>status</th>
+ <th>time</th>
+ <th>action</th>
+ </tr>
+ <tr ng-repeat="image in customImage">
+ <td>{{image.name}}</td>
+ <td>{{image.description}}</td>
+ <td>{{image.size | number:2}} MB</td>
+ <td>{{image.status}}</td>
+ <td>{{image.time}}</td>
+ <td>
+ <div class="btn-group" uib-dropdown>
+ <button id="single-button" type="button" class="btn btn-default btn-sm" uib-dropdown-toggle>
+ action<span class="caret"></span>
+ </button>
+ <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button">
+ <li role="menuitem" ><a ng-click="deleteCustomImage(image.id)">delete</a></li>
+ </ul>
+ </div>
+ </td>
+ </tr>
+ </table>
+ </div>
</div>
-
-
</div>
</div>