Allow to change applinks icon

This commit is contained in:
Johannes Zellner
2022-07-08 17:44:20 +02:00
parent 67ea08e638
commit 03d5d01aed
2 changed files with 53 additions and 0 deletions

View File

@@ -155,12 +155,33 @@ angular.module('Application').controller('AppsController', ['$scope', '$translat
error: {},
busyEdit: false,
busyRemove: false,
applink: {},
id: '',
upstreamUri: '',
label: '',
tags: '',
accessRestrictionOption: '',
accessRestriction: { users: [], groups: [] },
icon: { data: null },
iconUrl: function () {
if ($scope.applinksEdit.icon.data === '__original__') { // user clicked reset
// https://png-pixel.com/ white pixel placeholder
return 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/x8AAwMCAO+ip1sAAAAASUVORK5CYII=';
} else if ($scope.applinksEdit.icon.data) { // user uploaded icon
return $scope.applinksEdit.icon.data;
} else { // current icon
return $scope.applinksEdit.applink.iconUrl;
}
},
resetCustomIcon: function () {
$scope.applinksEdit.icon.data = '__original__';
},
showCustomIconSelector: function () {
$('#applinksEditIconFileInput').click();
},
isAccessRestrictionValid: function () {
return !!($scope.applinksEdit.accessRestriction.users.length || $scope.applinksEdit.accessRestriction.groups.length);
@@ -170,6 +191,7 @@ angular.module('Application').controller('AppsController', ['$scope', '$translat
$scope.applinksEdit.error = {};
$scope.applinksEdit.busyEdit = false;
$scope.applinksEdit.busyRemove = false;
$scope.applinksEdit.applink = applink;
$scope.applinksEdit.id = applink.id;
$scope.applinksEdit.upstreamUri = applink.upstreamUri;
$scope.applinksEdit.label = applink.label;
@@ -208,10 +230,18 @@ angular.module('Application').controller('AppsController', ['$scope', '$translat
accessRestriction.groups = $scope.applinksEdit.accessRestriction.groups.map(function (g) { return g.id; });
}
var icon;
if ($scope.applinksEdit.icon.data === '__original__') { // user reset the icon
icon = '';
} else if ($scope.applinksEdit.icon.data) { // user loaded custom icon
icon = $scope.applinksEdit.icon.data.replace(/^data:image\/[a-z]+;base64,/, '');
}
var data = {
upstreamUri: $scope.applinksEdit.upstreamUri,
label: $scope.applinksEdit.label,
accessRestriction: accessRestriction,
icon: icon,
tags: $scope.applinksEdit.tags.split(' ').map(function (t) { return t.trim(); }).filter(function (t) { return !!t; })
};
@@ -295,6 +325,17 @@ angular.module('Application').controller('AppsController', ['$scope', '$translat
});
});
$('#applinksEditIconFileInput').get(0).onchange = function (event) {
var fr = new FileReader();
fr.onload = function () {
$scope.$apply(function () {
// var file = event.target.files[0];
$scope.applinksEdit.icon.data = fr.result;
});
};
fr.readAsDataURL(event.target.files[0]);
};
// setup all the dialog focus handling
['applinksAddModal', 'applinksEditModal'].forEach(function (id) {
$('#' + id).on('shown.bs.modal', function () {