Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add update logo menu item for admins in Help menu of the navbar #681

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Add update logo menu item for admins in Help menu of the navbar #681

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
a30b6c2
Add update logo menu item for admins in Help menu
AlexFalessi Dec 11, 2024
4898eaa
Small improv error msg
AlexFalessi Dec 12, 2024
169a138
Update HTTP query to usge POST and form data following endpoint update
AlexFalessi Dec 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
169 changes: 138 additions & 31 deletions app/scripts/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -521,7 +521,7 @@ mainModule.controller('mainController', function ($window, $http, $scope, $rootS
});

// controller used in navigation.html :
mainModule.controller('navBarController', function ($scope, $rootScope, $http, $interval, $timeout) {
mainModule.controller('navBarController', function ($scope, $rootScope, $http, $interval, $timeout, $uibModal) {
this.$onInit = function () {

// set favicon icon of the current portal
Expand All @@ -537,6 +537,7 @@ mainModule.controller('navBarController', function ($scope, $rootScope, $http, $
});
$scope.nbNewNotifications = 0;
startRegularUpdateNotificationLabel();
fetchUserData();

$timeout(function () {
if (localStorage.getItem('collapsePreference') && localStorage.getItem('collapsePreference') === 'in') {
Expand Down Expand Up @@ -580,6 +581,32 @@ mainModule.controller('navBarController', function ($scope, $rootScope, $http, $
$('#side-menu .nav.nav-second-level.collapse').collapse('hide')
}

function fetchUserData() {
var requestGetAccountInfoUrl = JSON.parse(localStorage['restUrl']) + '/common/currentuserdata';
var config = {headers: {'sessionid': getSessionId()}};
$http.get(requestGetAccountInfoUrl, config).then(function (result) {
$scope.accountUsername = result.data.userName;
$scope.accountDomain = result.data.domain;
$scope.accountGroups = '';
for (var i = 0; i < result.data.groups.length; i++) {
$scope.accountGroups = $scope.accountGroups + result.data.groups[i];
if (i < result.data.groups.length - 1) {
$scope.accountGroups = $scope.accountGroups + ', ';
}
}
$scope.accountTenant = result.data.tenant;
$scope.accountAdminRolesArray = result.data.adminRoles;
$scope.accountAdminRoles = result.data.adminRoles.join(", ");
$scope.accountPortalAccessPermissionDisplay = '';
for (var i = 0; i < result.data.portalAccessPermissionDisplay.length; i++) {
$scope.accountPortalAccessPermissionDisplay = $scope.accountPortalAccessPermissionDisplay + result.data.portalAccessPermissionDisplay[i];
if (i < result.data.portalAccessPermissionDisplay.length - 1) {
$scope.accountPortalAccessPermissionDisplay = $scope.accountPortalAccessPermissionDisplay + ', ';
}
}
});
}

function setUpFavicon() {
$timeout(function () {
var portal = getCurrentPortalName();
Expand Down Expand Up @@ -633,37 +660,26 @@ mainModule.controller('navBarController', function ($scope, $rootScope, $http, $
$('#about-modal').modal('show');
};

$scope.showAccountInfo = function () {
var requestGetAccountInfoUrl = JSON.parse(localStorage['restUrl']) + '/common/currentuserdata';
var config = {headers: {'sessionid': getSessionId()}};
$http.get(requestGetAccountInfoUrl, config).then(function (result) {
$scope.accountUsername = result.data.userName;
$scope.accountDomain = result.data.domain;
$scope.accountGroups = '';
for (var i = 0; i < result.data.groups.length; i++) {
$scope.accountGroups = $scope.accountGroups + result.data.groups[i];
if (i < result.data.groups.length - 1) {
$scope.accountGroups = $scope.accountGroups + ', ';
}
}
$scope.accountTenant = result.data.tenant;
$scope.accountAdminRoles = '';
for (var i = 0; i < result.data.adminRoles.length; i++) {
$scope.accountAdminRoles = $scope.accountAdminRoles + result.data.adminRoles[i];
if (i < result.data.adminRoles.length - 1) {
$scope.accountAdminRoles = $scope.accountAdminRoles + ', ';
}
}
$scope.accountPortalAccessPermissionDisplay = '';
for (var i = 0; i < result.data.portalAccessPermissionDisplay.length; i++) {
$scope.accountPortalAccessPermissionDisplay = $scope.accountPortalAccessPermissionDisplay + result.data.portalAccessPermissionDisplay[i];
if (i < result.data.portalAccessPermissionDisplay.length - 1) {
$scope.accountPortalAccessPermissionDisplay = $scope.accountPortalAccessPermissionDisplay + ', ';
$scope.openChangeLogoModal = function () {
if ($scope.accountAdminRolesArray && $scope.accountAdminRolesArray.includes("Scheduler")) {
$uibModal.open({
templateUrl: 'views/modals/change_logo_modal.html',
controller: 'changeLogoController',
windowClass: 'fadeIn',
keyboard: true,
backdrop: 'static',
size: 'm',
resolve: {
accountAdminRolesArray: function () {
return $scope.accountAdminRolesArray;
}
}
}
$('#account-modal').modal('show');
return result.data;
});
});
}
};

$scope.showAccountInfo = function () {
$('#account-modal').modal('show');
};

// Close modals on escape key press
Expand Down Expand Up @@ -846,6 +862,97 @@ mainModule.controller('logoutController', function ($scope, $state) {
};
});

mainModule.controller('changeLogoController', function ($scope, $state, $uibModalInstance, $http, UtilsFactory, SweetAlert, accountAdminRolesArray) {

$scope.isFileSelected = false;

/*
The goal is to trigger a cache refresh every 10 minutes by changing a
query param of the PUT request sent to the server to update the Logo
*/
$scope.timeRoundedToTenth = getNextTenthMinute();
$scope.selectedFile = undefined;

$scope.openUploadWindow = function () {
$('#selected-image').click();
};

$scope.fileSelected = function () {
const fileInput = document.getElementById('selected-image');
$scope.selectedFile = fileInput.files[0];
if ($scope.selectedFile) {
// Check file type
const allowedTypes = ['image/png', 'image/jpeg'];
if (!allowedTypes.includes($scope.selectedFile.type)) {
alert("Invalid file type. Please upload a PNG or JPEG image.");
return;
}

// Save as data URL for image preview
const imagePreviewReader = new FileReader();
imagePreviewReader.onload = function (event) {
$scope.$apply(function () {
$scope.uploadedImageSrc = event.target.result;
$scope.isFileSelected = true;
});
};
imagePreviewReader.readAsDataURL($scope.selectedFile);
} else {
// No file is selected
$scope.uploadedImageSrc = null;
$scope.selectedFile = null;
$scope.isFileSelected = false;
}
};

$scope.applyNewLogo = function () {
var headers = {
'sessionid': localStorage['pa.session'],
};

var formData = new FormData();
formData.append('fileContent', $scope.selectedFile);

$http.post(JSON.parse(localStorage.schedulerRestUrl) + 'logo?timeTenth='+ $scope.timeRoundedToTenth, formData, { headers: headers, transformRequest: angular.identity })
.then(function (response) {
$scope.clearFile();
SweetAlert.swal(UtilsFactory.translate('Logo successfully updated'), "", "success");
})
.catch(function (error) {
SweetAlert.swal(UtilsFactory.translate('Logo update failed'), "Make sure that image format and size are correct", "error");
});
};

$scope.clearFile = function () {
const fileInput = document.getElementById('selected-image');
fileInput.value = '';
$scope.uploadedImageSrc = null;
$scope.selectedFile = null;
$scope.isFileSelected = false;

};

$scope.cancel = function () {
$uibModalInstance.dismiss('cancel');
};

function getNextTenthMinute() {
const now = new Date();
const minutes = now.getMinutes();
// Round up to the next 10th minute
const roundedMinutes = Math.ceil(minutes / 10) * 10;
now.setMinutes(roundedMinutes, 0, 0);
return now.getTime();
}

$(document).keydown(function (e) {
// Escape keypress
if (e.keyCode === 27) {
$uibModalInstance.dismiss('cancel');
}
});
});

mainModule.controller('footerController', function ($scope) {
$scope.year = new Date().getFullYear();
});
Expand Down
2 changes: 2 additions & 0 deletions app/views/common/topnavbar.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,8 @@
{{'About'|translate}}</a></li>
<li><a class="pointer" href="https://try.activeeon.com/tutorials.html" target="_blank"><i aria-hidden="true" class="fa fa-mortar-board" style="margin-left: -2px;"></i>
{{'Tutorials'|translate}}</a></li>
<li><a id="change-logo-button" class="pointer" ng-class="{'text-disabled disabled':!accountAdminRolesArray.includes('Scheduler')}" ng-click="openChangeLogoModal()" target="_blank"><i aria-hidden="true" class="fa fa-file-image-o" style="margin-left: -2px;"></i>
{{'Change Customer Logo'|translate}}</a></li>
</ul>
</div>
<ng-include src="'views/common/language-dropdown.html'"></ng-include>
Expand Down
37 changes: 37 additions & 0 deletions app/views/modals/change_logo_modal.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
<div class="inmodal">
<div class="modal-header">
<button class="btn btn-link text-muted p-w-xs pull-right" ng-click="cancel()"
uib-tooltip="{{'Close'|translate}}" tooltip-append-to-body="true">
<i class="fa fa-times" aria-hidden="true" style="font-size: 17px"></i>
</button>
<h4 class="modal-title">{{'Upload new image as customer logo' | translate}}</h4>
</div>
<div class="modal-body">
<div class="text-center" style="line-height: 1.5">
<span>Upload a new image that will replace the current logo in the top navbar.</span>
<span>The image must be of <strong>PNG or Baseline JPEG</strong> format, with a <strong>maximum size of 1500 x 1500</strong>.</span>
<br>
<br>
<span>The preview of the uploaded image below is about twice the actual size the Logo will be. Once uploaded, the logo is automatically resized.</strong>.</span>
</div>

<!-- Image preview -->
<div style="text-align: center; margin-top: 15px;">
<img ng-if="uploadedImageSrc" ng-src="{{uploadedImageSrc}}" alt="Image Preview" style="max-width: 230px; max-height: 80px;" />
</div>

<div style="display:flex; justify-content:center; margin-top: 15px">
<input type="file" accept="image/png, image/jpeg" id="selected-image" input-file-change="fileSelected()" class="hidden" />
<button id="upload-image-btn" class="m-r-xs btn btn-white" ng-click="openUploadWindow()" uib-tooltip="{{'Upload a file'|translate}}">
<i class="fa fa-upload"></i>
Upload image
</button>
<button uib-tooltip="{{'Save image as new logo'|translate}}" class="m-r-xs btn btn-primary" ng-click="applyNewLogo()" ng-disabled="!isFileSelected">
Save
</button>
<button uib-tooltip="{{'Upload a file'|translate}}" class="btn btn-danger" ng-click="clearFile()" ng-disabled="!isFileSelected">
Clear
</button>
</div>
</div>
</div>