Make the UI capability based

This commit is contained in:
Girish Ramakrishnan
2018-06-17 18:21:12 -07:00
parent cec1cc7086
commit 4db703aeb1
9 changed files with 32 additions and 30 deletions
+11 -11
View File
@@ -144,25 +144,25 @@
<li>
<a ng-class="{ active: isActive('/apps')}" href="#/apps"><i class="fa fa-cloud-download fa-fw"></i> My Apps</a>
</li>
<li ng-show="user.admin">
<li ng-show="user.caps.apps">
<a ng-class="{ active: isActive('/appstore')}" href="#/appstore"><i class="fa fa-th-large fa-fw"></i> App Store</a>
</li>
<li ng-show="user.admin">
<li ng-show="user.caps.users">
<a ng-class="{ active: isActive('/users')}" href="#/users"><i class="fa fa-users fa-fw"></i> Users</a>
</li>
<li class="dropdown">
<a href="" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><img ng-src="{{user.gravatar}}" style="margin-top: -4px;"/> {{user.username}} <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#/account"><i class="fa fa-user fa-fw"></i> Account</a></li>
<li ng-show="user.admin"><a href="#/activity"><i class="fa fa-list-alt fa-fw"></i> Activity</a></li>
<li ng-show="user.admin"><a href="#/tokens"><i class="fa fa-key fa-fw"></i> API Access</a></li>
<li ng-show="user.admin"><a href="#/backups"><i class="fa fa-archive fa-fw"></i> Backups</a></li>
<li ng-show="user.admin"><a href="#/domains"><i class="fa fa-globe fa-fw"></i> Domains</a></li>
<li ng-show="user.admin"><a href="#/email"><i class="fa fa-envelope fa-fw"></i> Email</a></li>
<li ng-show="user.admin"><a href="#/graphs"><i class="fa fa-bar-chart fa-fw"></i> Graphs</a></li>
<li ng-show="user.admin"><a href="#/settings"><i class="fa fa-wrench fa-fw"></i> Settings</a></li>
<li ng-show="user.admin" class="divider"></li>
<li ng-show="user.admin"><a href="#/support"><i class="fa fa-comment fa-fw"></i> Support</a></li>
<li ng-show="user.caps.cloudron"><a href="#/activity"><i class="fa fa-list-alt fa-fw"></i> Activity</a></li>
<li ng-show="user.caps.clients"><a href="#/tokens"><i class="fa fa-key fa-fw"></i> API Access</a></li>
<li ng-show="user.caps.settings"><a href="#/backups"><i class="fa fa-archive fa-fw"></i> Backups</a></li>
<li ng-show="user.caps.domains"><a href="#/domains"><i class="fa fa-globe fa-fw"></i> Domains</a></li>
<li ng-show="user.caps.mail"><a href="#/email"><i class="fa fa-envelope fa-fw"></i> Email</a></li>
<li ng-show="user.caps.cloudron"><a href="#/graphs"><i class="fa fa-bar-chart fa-fw"></i> Graphs</a></li>
<li ng-show="user.caps.settings"><a href="#/settings"><i class="fa fa-wrench fa-fw"></i> Settings</a></li>
<li ng-show="user.caps.cloudron" class="divider"></li>
<li ng-show="user.caps.cloudron"><a href="#/support"><i class="fa fa-comment fa-fw"></i> Support</a></li>
<li class="divider"></li>
<li><a href="" ng-click="logout($event)"><i class="fa fa-sign-out fa-fw"></i> Logout</a></li>
</ul>
+9 -3
View File
@@ -111,7 +111,7 @@ angular.module('Application').service('Client', ['$http', '$interval', 'md5', 'N
id: null,
username: null,
email: null,
admin: false,
caps: {},
twoFactorAuthenticationEnabled: false
};
this._config = {
@@ -224,11 +224,17 @@ angular.module('Application').service('Client', ['$http', '$interval', 'md5', 'N
this._userInfo.email = userInfo.email;
this._userInfo.fallbackEmail = userInfo.fallbackEmail;
this._userInfo.displayName = userInfo.displayName;
this._userInfo.admin = !!userInfo.admin;
this._userInfo.twoFactorAuthenticationEnabled = userInfo.twoFactorAuthenticationEnabled;
this._userInfo.scope = userInfo.scope;
this._userInfo.tokenScope = userInfo.tokenScope;
this._userInfo.gravatar = 'https://www.gravatar.com/avatar/' + md5.createHash(userInfo.email) + '.jpg?s=24&d=mm';
this._userInfo.gravatarHuge = 'https://www.gravatar.com/avatar/' + md5.createHash(userInfo.email) + '.jpg?s=128&d=mm';
// clear and then set properties to keep angular happy
var caps = this._userInfo.caps;
for (var p in caps) delete caps[p];
userInfo.tokenScope.split(',').forEach(function (scope) {
caps[scope] = true;
});
};
Client.prototype.setConfig = function (config) {
+1 -1
View File
@@ -142,7 +142,7 @@ app.filter('appIsInstalledAndHealthy', function () {
app.filter('activeOAuthClients', function () {
return function (clients, user) {
return clients.filter(function (c) { return user.admin || (c.activeTokens && c.activeTokens.length > 0); });
return clients.filter(function (c) { return user.caps.clients || (c.activeTokens && c.activeTokens.length > 0); });
};
});
+1 -1
View File
@@ -179,7 +179,7 @@ angular.module('Application').controller('MainController', ['$scope', '$route',
$scope.initialized = true;
if ($scope.user.admin) {
if ($scope.user.caps.cloudron) {
runConfigurationChecks();
$scope.fetchAppstoreProfileAndSubscription(function (error) {
+4 -4
View File
@@ -430,7 +430,7 @@
<!-- Workaround for select-all issue, see commit message -->
<div style="font-size: 1px;">&nbsp;</div>
<div class="animateMeOpacity ng-hide" ng-show="installedApps.length === 0 && user.admin">
<div class="animateMeOpacity ng-hide" ng-show="installedApps.length === 0 && user.caps.apps">
<div class="col-md-12" style="text-align: center;">
<br/><br/><br/><br/>
<h1><i class="fa fa-cloud-download fa-fw"></i> No apps installed yet!</h1>
@@ -439,7 +439,7 @@
</div>
</div>
<div class="animateMeOpacity ng-hide" ng-show="installedApps.length === 0 && !user.admin">
<div class="animateMeOpacity ng-hide" ng-show="installedApps.length === 0 && !user.caps.apps">
<div class="col-md-12" style="text-align: center;">
<br/><br/><br/><br/>
<h1>You don't have access to any apps on this Cloudron yet!</h1>
@@ -480,7 +480,7 @@
</div>
</div>
</div>
<div class="grid-item-bottom-mobile" ng-show="user.admin">
<div class="grid-item-bottom-mobile" ng-show="user.caps.apps">
<div class="row">
<div class="col-xs-4 text-left">
<a href="" ng-click="appRestore.show(app)" ng-show="backupConfig.provider !== 'noop'">
@@ -500,7 +500,7 @@
</div>
</div>
</div>
<div class="grid-item-bottom" ng-show="user.admin">
<div class="grid-item-bottom" ng-show="user.caps.apps">
<div>
<a href="" ng-click="showUninstall(app)" uib-tooltip="Uninstall" tooltip-placement="right" tooltip-class="app-tooltip"><i class="fa fa-remove scale"></i></a>
</div>
+1 -1
View File
@@ -586,7 +586,7 @@ angular.module('Application').controller('AppsController', ['$scope', '$location
Client.refreshInstalledApps(function (error) {
if (error) return console.error(error);
if ($scope.user.admin) {
if ($scope.user.caps.apps) {
fetchUsers();
fetchGroups();
getDomains();
+4 -4
View File
@@ -153,10 +153,10 @@
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default"data-dismiss="modal">Close</button>
<button type="button" class="btn btn-success" ng-show="config.provider === 'caas' && user.admin && appInstall.state === 'resourceConstraint'" ng-click="showView('/settings')">Upgrade Cloudron</button>
<button type="button" class="btn btn-danger" ng-show="config.provider !== 'caas' && user.admin && appInstall.state === 'resourceConstraint'" ng-click="appInstall.showForm(true)">Install anyway</button>
<button type="button" class="btn btn-success" ng-show="appInstall.state === 'appInfo' && user.admin" ng-click="appInstall.showForm()">Install</button>
<button type="button" class="btn btn-success" ng-show="appInstall.state === 'installForm' && user.admin" ng-click="appInstall.submit()" ng-disabled="appInstallForm.$invalid || appInstall.busy"><i class="fa fa-circle-o-notch fa-spin" ng-show="appInstall.busy"></i> Install</button>
<button type="button" class="btn btn-success" ng-show="config.provider === 'caas' && user.caps.appstore && appInstall.state === 'resourceConstraint'" ng-click="showView('/settings')">Upgrade Cloudron</button>
<button type="button" class="btn btn-danger" ng-show="config.provider !== 'caas' && user.caps.apps && appInstall.state === 'resourceConstraint'" ng-click="appInstall.showForm(true)">Install anyway</button>
<button type="button" class="btn btn-success" ng-show="appInstall.state === 'appInfo' && user.caps.apps" ng-click="appInstall.showForm()">Install</button>
<button type="button" class="btn btn-success" ng-show="appInstall.state === 'installForm' && user.caps.apps" ng-click="appInstall.submit()" ng-disabled="appInstallForm.$invalid || appInstall.busy"><i class="fa fa-circle-o-notch fa-spin" ng-show="appInstall.busy"></i> Install</button>
<a class="btn btn-success" ng-show="appInstall.state === 'appLimitReached'" ng-href="{{ config.webServerOrigin + '/console.html#/userprofile?view=subscriptions&email=' + appstoreConfig.profile.emailEncoded + '&cloudronId=' + appstoreConfig.cloudronId }}" target="_blank">Setup Subscription</a>
</div>
</div>
+1 -1
View File
@@ -258,7 +258,7 @@
<tbody>
<tr ng-repeat="user in users">
<td>
<i class="fa fa-briefcase arrow" ng-show="user.admin" uib-tooltip="This user is an admin and can manage apps, groups and other users"></i>
<i class="fa fa-briefcase arrow" ng-show="user.caps.users || user.caps.apps" uib-tooltip="This user can manage apps, groups and other users"></i>
</td>
<td class="hand elide-table-cell" ng-click="useredit.show(user)" ng-show="user.username">
{{ user.username }} &nbsp; <span class="text-muted">{{ user.email }}</span>
-4
View File
@@ -325,10 +325,6 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
return user.username === Client.getUserInfo().username;
};
$scope.isAdmin = function (user) {
return !!user.admin;
};
$scope.sendInvite = function (user) {
$scope.inviteSent.email = user.fallbackEmail;
$scope.inviteSent.setupLink = '';