1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-07-23 15:29:42 +02:00

refactor(swarm-visualizer): move task border logic to a filter (#1686)

This commit is contained in:
Anthony Lapenna 2018-03-02 09:00:34 +10:00 committed by GitHub
parent 1b8d5e89d1
commit 73e6498d2f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 24 deletions

View file

@ -4,6 +4,22 @@ function includeString(text, values) {
}); });
} }
function strToHash(str) {
var hash = 0;
for (var i = 0; i < str.length; i++) {
hash = str.charCodeAt(i) + ((hash << 5) - hash);
}
return hash;
}
function hashToHexColor(hash) {
var color = '#';
for (var i = 0; i < 3;) {
color += ('00' + ((hash >> i++ * 8) & 0xFF).toString(16)).slice(-2);
}
return color;
}
angular.module('portainer.docker') angular.module('portainer.docker')
.filter('visualizerTask', function () { .filter('visualizerTask', function () {
'use strict'; 'use strict';
@ -19,6 +35,14 @@ angular.module('portainer.docker')
return 'running'; return 'running';
}; };
}) })
.filter('visualizerTaskBorderColor', function () {
'use strict';
return function (str) {
var hash = strToHash(str);
var color = hashToHexColor(hash);
return color;
};
})
.filter('taskstatusbadge', function () { .filter('taskstatusbadge', function () {
'use strict'; 'use strict';
return function (text) { return function (text) {

View file

@ -19,28 +19,6 @@ function ($q, $scope, $document, $interval, NodeService, ServiceService, TaskSer
$('#refreshRateChange').fadeOut(1500); $('#refreshRateChange').fadeOut(1500);
}; };
function strToHash(str) {
var hash = 0;
for (var i = 0; i < str.length; i++) {
hash = str.charCodeAt(i) + ((hash << 5) - hash);
}
return hash;
}
function hashToHexColor(hash) {
var color = '#';
for (var i = 0; i < 3;) {
color += ('00' + ((hash >> i++ * 8) & 0xFF).toString(16)).slice(-2);
}
return color;
}
function stringToColor(str) {
var hash = strToHash(str);
var color = hashToHexColor(hash);
return color;
}
function stopRepeater() { function stopRepeater() {
var repeater = $scope.repeater; var repeater = $scope.repeater;
if (angular.isDefined(repeater)) { if (angular.isDefined(repeater)) {
@ -83,7 +61,6 @@ function ($q, $scope, $document, $interval, NodeService, ServiceService, TaskSer
if (task.ServiceId === service.Id) { if (task.ServiceId === service.Id) {
task.ServiceName = service.Name; task.ServiceName = service.Name;
task.ServiceColor = stringToColor(task.ServiceId);
} }
} }
} }

View file

@ -97,7 +97,7 @@
<div><span class="label label-{{ node.Status | nodestatusbadge }}">{{ node.Status }}</span></div> <div><span class="label label-{{ node.Status | nodestatusbadge }}">{{ node.Status }}</span></div>
</div> </div>
<div class="tasks"> <div class="tasks">
<div class="task task_{{ task.Status.State | visualizerTask }}" style="border: 2px solid {{task.ServiceColor}}" ng-repeat="task in node.Tasks | filter: (state.DisplayOnlyRunningTasks || '') && { Status: { State: 'running' } }"> <div class="task task_{{ task.Status.State | visualizerTask }}" style="border: 2px solid {{ task.ServiceId | visualizerTaskBorderColor }}" ng-repeat="task in node.Tasks | filter: (state.DisplayOnlyRunningTasks || '') && { Status: { State: 'running' } }">
<div class="service_name">{{ task.ServiceName }}</div> <div class="service_name">{{ task.ServiceName }}</div>
<div>Image: {{ task.Spec.ContainerSpec.Image | hideshasum }}</div> <div>Image: {{ task.Spec.ContainerSpec.Image | hideshasum }}</div>
<div>Status: {{ task.Status.State }}</div> <div>Status: {{ task.Status.State }}</div>