Update Quay Sec UI as per feedback from design team

Fixes #1281
This commit is contained in:
Joseph Schorr 2016-03-09 15:28:21 -05:00
parent c75fcfbd5e
commit 821b09daaf
20 changed files with 656 additions and 564 deletions

View file

@ -13,99 +13,53 @@ angular.module('quay').directive('imageVulnerabilityView', function () {
'image': '=image',
'isEnabled': '=isEnabled'
},
controller: function($scope, $element, Config, ApiService, VulnerabilityService, AngularViewArray, ImageMetadataService) {
var imageMap = null;
$scope.securityVulnerabilities = [];
controller: function($scope, $element, Config, ApiService, VulnerabilityService, AngularViewArray, ImageMetadataService, TableService) {
$scope.options = {
'vulnFilter': null,
'filter': null,
'fixableVulns': false,
'predicate': 'score',
'reverse': false,
};
$scope.tablePredicateClass = function(name, predicate, reverse) {
if (name != predicate) {
return '';
}
return 'current ' + (reverse ? 'reversed' : '');
};
$scope.orderBy = function(predicate) {
if (predicate == $scope.options.predicate) {
$scope.options.reverse = !$scope.options.reverse;
return;
}
$scope.options.reverse = false;
$scope.options.predicate = predicate;
};
$scope.getCVSSColor = function(score) {
return VulnerabilityService.getCVSSColor(score);
};
$scope.TableService = TableService;
$scope.toggleDetails = function(vuln) {
vuln.expanded = !vuln.expanded;
};
var buildOrderedVulnerabilities = function() {
var vulnerabilities = $scope.securityVulnerabilities.slice(0);
$scope.getDistro = function(vuln) {
return vuln['namespace'].split(':', 1);
};
$scope.orderedVulnerabilities = AngularViewArray.create();
vulnerabilities.forEach(function(v) {
var vulnFilter = $scope.options.vulnFilter;
if (vulnFilter) {
if ((v['name'].indexOf(vulnFilter) < 0) &&
(v['featureName'].indexOf(vulnFilter) < 0) &&
(v['imageCommand'].indexOf(vulnFilter) < 0)) {
return;
}
}
$scope.getSeverityTooltip = function(vuln) {
var distro = vuln['namespace'].split(':', 1);
if ($scope.options.fixableVulns && !v['fixedInVersion']) {
return;
}
$scope.orderedVulnerabilities.push(v);
});
$scope.orderedVulnerabilities.entries.sort(function(a, b) {
var left = a[$scope.options['predicate']];
var right = b[$scope.options['predicate']];
if ($scope.options['predicate'] == 'score') {
left = left * 1;
right = right * 1;
}
if (left == null) {
left = '0.00';
}
if (right == null) {
right = '0.00';
}
if (left == right) {
return 0;
}
return left > right ? -1 : 1;
});
if ($scope.options['reverse']) {
$scope.orderedVulnerabilities.entries.reverse();
if (vuln.scoreDivergence != 'adjusted-lower') {
return 'Marked with a ' + vuln['severity'] + ' severity by ' + distro;
}
$scope.orderedVulnerabilities.setVisible(true);
return 'Note: This vulnerability was originally given a CVSSv2 score ' +
'of ' + vuln['cvssScore'] + ' by NVD, but was subsequently reclassifed as a ' +
vuln['severity'] + ' issue by ' + distro;
};
var buildOrderedVulnerabilities = function() {
if (!$scope.vulnerabilitiesInfo) {
return;
}
var vulnerabilities = $scope.vulnerabilitiesInfo.vulnerabilities;
$scope.orderedVulnerabilities = TableService.buildOrderedItems(vulnerabilities, $scope.options,
['name', 'featureName', 'imageCommand'],
['score'],
function(item) {
return !$scope.options.fixableVulns || item['fixedInVersion'];
})
};
var buildChart = function() {
var chartData = $scope.priorityBreakdown;
if ($scope.priorityBreakdown.length == 0) {
var chartData = $scope.vulnerabilitiesInfo.severityBreakdown;
if (chartData.length == 0) {
chartData = [{
'label': 'None',
'value': 1,
@ -141,98 +95,16 @@ angular.module('quay').directive('imageVulnerabilityView', function () {
});
};
var buildFeaturesAndVulns = function(data) {
$scope.securityFeatures = [];
$scope.securityVulnerabilities = [];
$scope.priorityBreakdown = [];
var severityMap = {};
if (data && data.Layer && data.Layer.Features) {
data.Layer.Features.forEach(function(feature) {
feature_obj = {
'name': feature.Name,
'namespace': feature.Namespace,
'version': feature.Version,
'addedBy': feature.AddedBy
}
feature_vulnerabilities = [];
if (feature.Vulnerabilities) {
feature.Vulnerabilities.forEach(function(vuln) {
var severity = VulnerabilityService.LEVELS[vuln['Severity']];
var score = severity.score;
if (vuln.Metadata && vuln.Metadata.NVD && vuln.Metadata.NVD.CVSSv2 && vuln.Metadata.NVD.CVSSv2.Score) {
score = vuln.Metadata.NVD.CVSSv2.Score;
severity = VulnerabilityService.getSeverityForCVSS(score);
}
var imageId = feature.AddedBy.split('.')[0];
vuln_obj = {
'name': vuln.Name,
'namespace': vuln.Namespace,
'description': vuln.Description,
'link': vuln.Link,
'severity': vuln.Severity,
'metadata': vuln.Metadata,
'feature': jQuery.extend({}, feature_obj),
'featureName': feature.Name,
'fixedInVersion': vuln.FixedBy,
'introducedInVersion': feature.Version,
'imageId': imageId,
'imageCommand': ImageMetadataService.getImageCommand($scope.image, imageId),
'score': score,
'expanded': false,
}
feature_vulnerabilities.push(vuln_obj)
$scope.securityVulnerabilities.push(vuln_obj);
if (severityMap[severity['index']] == undefined) {
severityMap[severity['index']] = 0;
}
severityMap[severity['index']]++;
});
}
feature_obj['vulnerabilities'] = feature_vulnerabilities;
$scope.securityFeatures.push(feature_obj);
});
var levels = VulnerabilityService.getLevels();
for (var i = 0; i < levels.length; ++i) {
if (severityMap[levels[i]['index']]) {
$scope.priorityBreakdown.push({
'label': levels[i].title,
'value': severityMap[levels[i]['index']],
'color': levels[i].color
})
}
}
}
buildOrderedVulnerabilities();
};
var loadImageVulnerabilities = function() {
if ($scope.securityResource) {
return;
}
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'imageid': $scope.image.id,
'vulnerabilities': true,
};
$scope.securityResource = ApiService.getRepoImageSecurityAsResource(params).get(function(resp) {
$scope.securityResource = VulnerabilityService.loadImageVulnerabilitiesAsResource($scope.repository, $scope.image.id, function(resp) {
$scope.securityStatus = resp.status;
buildFeaturesAndVulns(resp.data);
$scope.vulnerabilitiesInfo = VulnerabilityService.buildVulnerabilitiesInfo($scope.image, resp);
buildOrderedVulnerabilities();
buildChart();
return resp;
});
@ -240,7 +112,7 @@ angular.module('quay').directive('imageVulnerabilityView', function () {
$scope.$watch('options.predicate', buildOrderedVulnerabilities);
$scope.$watch('options.reverse', buildOrderedVulnerabilities);
$scope.$watch('options.vulnFilter', buildOrderedVulnerabilities);
$scope.$watch('options.filter', buildOrderedVulnerabilities);
$scope.$watch('options.fixableVulns', buildOrderedVulnerabilities);
$scope.$watch('isEnabled', function(isEnabled) {