KEYCLOAK-148 rebulding interface for default roles

This commit is contained in:
vrockai 2013-11-14 14:13:22 +01:00
parent 34d458e9ac
commit eebd3a6be7
11 changed files with 278 additions and 62 deletions

View file

@ -12,9 +12,6 @@ module.config([ '$routeProvider', function($routeProvider) {
resolve : {
realm : function(RealmLoader) {
return {};
},
roles : function() {
return {};
}
},
controller : 'RealmDetailCtrl'
@ -24,9 +21,6 @@ module.config([ '$routeProvider', function($routeProvider) {
resolve : {
realm : function(RealmLoader) {
return RealmLoader();
},
roles : function(RoleListLoader) {
return RoleListLoader();
}
},
controller : 'RealmDetailCtrl'
@ -53,6 +47,21 @@ module.config([ '$routeProvider', function($routeProvider) {
},
controller : 'RealmSocialCtrl'
})
.when('/realms/:realm/registration-settings', {
templateUrl : 'partials/realm-registration.html',
resolve : {
realm : function(RealmLoader) {
return RealmLoader();
},
applications : function(ApplicationListLoader) {
return ApplicationListLoader();
},
roles : function(RoleListLoader) {
return RoleListLoader();
}
},
controller : 'RealmRegistrationCtrl'
})
.when('/realms/:realm/required-credentials', {
templateUrl : 'partials/realm-credentials.html',
resolve : {
@ -247,9 +256,6 @@ module.config([ '$routeProvider', function($routeProvider) {
},
application : function() {
return {};
},
roles : function() {
return {};
}
},
controller : 'ApplicationDetailCtrl'
@ -265,9 +271,6 @@ module.config([ '$routeProvider', function($routeProvider) {
},
application : function(ApplicationLoader) {
return ApplicationLoader();
},
roles : function(ApplicationRoleListLoader) {
return ApplicationRoleListLoader();
}
},
controller : 'ApplicationDetailCtrl'

View file

@ -19,18 +19,4 @@ function randomString(len) {
randomString += charSet.substring(randomPoz,randomPoz+1);
}
return randomString;
}
function getAvailableRoles(roles, systemRoles){
var complement = [];
for (var i = 0; i < roles.length; i++){
var roleName = roles[i].name;
if (systemRoles.indexOf(roleName) < 0){
complement.push(roleName);
}
}
return complement;
}
}

View file

@ -171,7 +171,7 @@ module.controller('ApplicationListCtrl', function($scope, realm, applications, A
});
});
module.controller('ApplicationDetailCtrl', function($scope, realm, application, roles, Application, $location, Dialog, Notifications) {
module.controller('ApplicationDetailCtrl', function($scope, realm, application, Application, $location, Dialog, Notifications) {
console.log('ApplicationDetailCtrl');
$scope.realm = realm;
@ -182,17 +182,6 @@ module.controller('ApplicationDetailCtrl', function($scope, realm, application,
$scope.application = {};
}
console.log(application);
var systemRoles = ["*", "KEYCLOAK_APPLICATION","KEYCLOAK_IDENTITY_REQUESTER"];
var availableRoles = getAvailableRoles(roles, systemRoles);
$scope.appDefaultRolesOptions = {
'multiple' : true,
'simple_tags' : true,
'tags' : availableRoles
};
$scope.$watch(function() {
return $location.path();
}, function() {

View file

@ -44,20 +44,11 @@ module.controller('RealmDropdownCtrl', function($scope, Realm, Current, Auth, $l
}
});
module.controller('RealmDetailCtrl', function($scope, Current, Realm, realm, roles, $http, $location, Dialog, Notifications) {
module.controller('RealmDetailCtrl', function($scope, Current, Realm, realm, $http, $location, Dialog, Notifications) {
$scope.createRealm = !realm.id;
console.log('RealmDetailCtrl');
var systemRoles = ["*", "KEYCLOAK_APPLICATION","KEYCLOAK_IDENTITY_REQUESTER"];
var availableRoles = getAvailableRoles(roles, systemRoles);
$scope.realmDefaultRolesOptions = {
'multiple' : true,
'simple_tags' : true,
'tags' : availableRoles
};
if ($scope.createRealm) {
$scope.realm = {
enabled: true,
@ -83,6 +74,7 @@ module.controller('RealmDetailCtrl', function($scope, Current, Realm, realm, rol
}
$scope.social = $scope.realm.social;
$scope.registrationAllowed = $scope.realm.registrationAllowed;
var oldCopy = angular.copy($scope.realm);
@ -116,6 +108,7 @@ module.controller('RealmDetailCtrl', function($scope, Current, Realm, realm, rol
$location.url("/realms/" + id);
Notifications.success("The realm has been created.");
$scope.social = $scope.realm.social;
$scope.registrationAllowed = $scope.realm.registrationAllowed;
});
});
} else {
@ -135,6 +128,7 @@ module.controller('RealmDetailCtrl', function($scope, Current, Realm, realm, rol
$location.url("/realms/" + id);
Notifications.success("Your changes have been saved to the realm.");
$scope.social = $scope.realm.social;
$scope.registrationAllowed = $scope.realm.registrationAllowed;
});
}
} else {
@ -171,7 +165,8 @@ module.controller('RealmRequiredCredentialsCtrl', function($scope, Realm, realm,
id : realm.id, realm : realm.realm, social : realm.social,
requiredCredentials : realm.requiredCredentials,
requiredApplicationCredentials : realm.requiredApplicationCredentials,
requiredOAuthClientCredentials : realm.requiredOAuthClientCredentials
requiredOAuthClientCredentials : realm.requiredOAuthClientCredentials,
registrationAllowed : realm.registrationAllowed
};
$scope.userCredentialOptions = {
@ -209,10 +204,157 @@ module.controller('RealmRequiredCredentialsCtrl', function($scope, Realm, realm,
};
});
module.controller('RealmRegistrationCtrl', function ($scope, Realm, realm, applications, roles, Notifications, ApplicationRole, Application) {
console.log('RealmRegistrationCtrl');
var systemRoles = ["*", "KEYCLOAK_APPLICATION", "KEYCLOAK_IDENTITY_REQUESTER"];
$scope.realm = realm;
$scope.availableRealmRoles = [];
$scope.selectedRealmRoles = [];
$scope.selectedRealmDefRoles = [];
$scope.applications = angular.copy(applications);
$scope.availableAppRoles = [];
$scope.selectedAppRoles = [];
$scope.selectedAppDefRoles = [];
if (!$scope.realm.hasOwnProperty('defaultRoles') || $scope.realm.defaultRoles === null) {
$scope.realm.defaultRoles = [];
}
// Populate available roles. Available roles are neither already assigned or system roles.
for (var i = 0; i < roles.length; i++) {
var item = roles[i].name;
if ((systemRoles.indexOf(item) < 0) && ($scope.realm.defaultRoles.indexOf(item) < 0)) {
$scope.availableRealmRoles.push(item);
}
}
$scope.addRealmDefaultRole = function () {
// Remove selected roles from the Available roles and add them to realm default roles (move from left to right).
for (var i = 0; i < $scope.selectedRealmRoles.length; i++) {
var selectedRole = $scope.selectedRealmRoles[i];
$scope.realm.defaultRoles.push(selectedRole);
var index = $scope.availableRealmRoles.indexOf(selectedRole);
if (index > -1) {
$scope.availableRealmRoles.splice(index, 1);
}
}
// Update/save the realm with new default roles.
Realm.update($scope.realm, function () {
Notifications.success("Realm default roles updated.");
});
};
$scope.deleteRealmDefaultRole = function () {
// Remove selected roles from the realm default roles and add them to available roles (move from right to left).
for (var i = 0; i < $scope.selectedRealmDefRoles.length; i++) {
$scope.availableRealmRoles.push($scope.selectedRealmDefRoles[i]);
var index = $scope.realm.defaultRoles.indexOf($scope.selectedRealmDefRoles[i]);
if (index > -1) {
$scope.realm.defaultRoles.splice(index, 1);
}
}
// Update/save the realm with new default roles.
//var realmCopy = angular.copy($scope.realm);
Realm.update($scope.realm, function () {
Notifications.success("Realm default roles updated.");
});
};
$scope.changeApplication = function () {
$scope.selectedAppRoles = [];
$scope.selectedAppDefRoles = [];
// Populate available roles for selected application
var appDefaultRoles = ApplicationRole.query({realm: $scope.realm.id, application: $scope.application.id}, function () {
if (!$scope.application.hasOwnProperty('defaultRoles') || $scope.application.defaultRoles === null) {
$scope.application.defaultRoles = [];
}
$scope.availableAppRoles = [];
for (var i = 0; i < appDefaultRoles.length; i++) {
var roleName = appDefaultRoles[i].name;
if (systemRoles.indexOf(roleName) < 0 && $scope.application.defaultRoles.indexOf(roleName) < 0) {
$scope.availableAppRoles.push(roleName);
}
}
});
};
$scope.addAppDefaultRole = function () {
// Remove selected roles from the app available roles and add them to app default roles (move from left to right).
for (var i = 0; i < $scope.selectedAppRoles.length; i++) {
var role = $scope.selectedAppRoles[i];
var idx = $scope.application.defaultRoles.indexOf(role);
if (idx < 0) {
$scope.application.defaultRoles.push(role);
}
idx = $scope.availableAppRoles.indexOf(role);
if (idx != -1) {
$scope.availableAppRoles.splice(idx, 1);
}
}
// Update/save the selected application with new default roles.
Application.update({
realm: $scope.realm.id,
id: $scope.application.id
}, $scope.application, function () {
Notifications.success("Your changes have been saved to the application.");
});
};
$scope.rmAppDefaultRole = function () {
// Remove selected roles from the app default roles and add them to app available roles (move from right to left).
for (var i = 0; i < $scope.selectedAppDefRoles.length; i++) {
var role = $scope.selectedAppDefRoles[i];
var idx = $scope.application.defaultRoles.indexOf(role);
if (idx != -1) {
$scope.application.defaultRoles.splice(idx, 1);
}
idx = $scope.availableAppRoles.indexOf(role);
if (idx < 0) {
$scope.availableAppRoles.push(role);
}
}
// Update/save the selected application with new default roles.
Application.update({
realm: $scope.realm.id,
id: $scope.application.id
}, $scope.application, function () {
Notifications.success("Your changes have been saved to the application.");
});
};
});
module.controller('RealmSocialCtrl', function($scope, realm, Realm, $location, Notifications) {
console.log('RealmSocialCtrl');
$scope.realm = { id : realm.id, realm : realm.realm, social : realm.social, tokenLifespan : realm.tokenLifespan, accessCodeLifespan : realm.accessCodeLifespan };
$scope.realm = { id : realm.id, realm : realm.realm, social : realm.social, registrationAllowed : realm.registrationAllowed,
tokenLifespan : realm.tokenLifespan, accessCodeLifespan : realm.accessCodeLifespan };
if (!realm["socialProviders"]){
$scope.realm["socialProviders"] = {};
@ -345,7 +487,10 @@ module.controller('RealmSocialCtrl', function($scope, realm, Realm, $location, N
module.controller('RealmTokenDetailCtrl', function($scope, Realm, realm, $http, $location, Dialog, Notifications) {
console.log('RealmTokenDetailCtrl');
$scope.realm = { id : realm.id, realm : realm.realm, social : realm.social, tokenLifespan : realm.tokenLifespan, accessCodeLifespan : realm.accessCodeLifespan , accessCodeLifespanUserAction : realm.accessCodeLifespanUserAction };
$scope.realm = { id : realm.id, realm : realm.realm, social : realm.social, registrationAllowed : realm.registrationAllowed,
tokenLifespan : realm.tokenLifespan, accessCodeLifespan : realm.accessCodeLifespan,
accessCodeLifespanUserAction : realm.accessCodeLifespanUserAction };
$scope.realm.tokenLifespanUnit = 'Seconds';
$scope.realm.accessCodeLifespanUnit = 'Seconds';
$scope.realm.accessCodeLifespanUserActionUnit = 'Seconds';
@ -404,6 +549,7 @@ module.controller('RealmTokenDetailCtrl', function($scope, Realm, realm, $http,
});
module.controller('RoleListCtrl', function($scope, $location, realm, roles) {
$scope.realm = realm;
$scope.roles = roles;
@ -484,7 +630,7 @@ module.controller('RoleDetailCtrl', function($scope, realm, role, Role, $locatio
module.controller('RealmSMTPSettingsCtrl', function($scope, Current, Realm, realm, $http, $location, Dialog, Notifications) {
$scope.realm = {
id : realm.id, realm : realm.realm, social : realm.social,
id : realm.id, realm : realm.realm, social : realm.social, registrationAllowed : realm.registrationAllowed,
smtpServer: realm.smtpServer
};

View file

@ -6,6 +6,7 @@
<ul class="rcue-tabs">
<li><a href="#/realms/{{realm.id}}">General</a></li>
<li data-ng-show="realm.social"><a href="#/realms/{{realm.id}}/social-settings">Social</a></li>
<li data-ng-show="realm.registrationAllowed"><a href="#/realms/{{realm.id}}/registration-settings">Registration</a></li>
<li><a href="#/realms/{{realm.id}}/roles">Roles</a></li>
<li class="active"><a href="#/realms/{{realm.id}}/required-credentials">Credentials</a></li>
<li><a href="#/realms/{{realm.id}}/token-settings">Token</a></li>

View file

@ -6,6 +6,7 @@
<ul class="rcue-tabs">
<li class="active"><a href="#/realms/{{realm.id}}">General</a></li>
<li data-ng-show="social"><a href="#/realms/{{realm.id}}/social-settings">Social</a></li>
<li data-ng-show="registrationAllowed"><a href="#/realms/{{realm.id}}/registration-settings">Registration</a></li>
<li><a href="#/realms/{{realm.id}}/roles">Roles</a></li>
<li><a href="#/realms/{{realm.id}}/required-credentials">Credentials</a></li>
<li><a href="#/realms/{{realm.id}}/token-settings">Token</a></li>
@ -68,16 +69,7 @@
<input ng-model="realm.cookieLoginAllowed" name="cookieLoginAllowed" id="cookieLoginAllowed" onoffswitch />
</div>
</fieldset>
<fieldset>
<legend uncollapsed><span class="text">Default Roles</span></legend>
<div class="form-group">
<label for="default-roles" class="control-label two-lines">Default Realm Roles</label>
<div class="controls">
<input id="default-roles" type="text" ui-select2="realmDefaultRolesOptions" ng-model="realm.defaultRoles" placeholder="Type a role and enter">
</div>
</div>
</fieldset>
<div class="form-actions" data-ng-show="createRealm">
<button type="submit" data-ng-click="save()" class="primary" data-ng-show="changed">Save
</button>

View file

@ -0,0 +1,95 @@
<div id="wrapper" class="container">
<div class="row">
<div class="bs-sidebar col-md-3 clearfix" data-ng-include data-src="'partials/realm-menu.html'"></div>
<div id="content-area" class="col-md-9" role="main">
<div class="top-nav" data-ng-hide="createRealm">
<ul class="rcue-tabs">
<li><a href="#/realms/{{realm.id}}">General</a></li>
<li data-ng-show="realm.social"><a href="#/realms/{{realm.id}}/social-settings">Social</a></li>
<li class="active"><a href="#/realms/{{realm.id}}/registration-settings">Registration</a></li>
<li><a href="#/realms/{{realm.id}}/roles">Roles</a></li>
<li><a href="#/realms/{{realm.id}}/required-credentials">Credentials</a></li>
<li><a href="#/realms/{{realm.id}}/token-settings">Token</a></li>
<li><a href="#/realms/{{realm.id}}/smtp-settings">SMTP</a></li>
</ul>
</div>
<div id="content">
<ol class="breadcrumb">
<li><a href="#/realms/{{realm.id}}">{{realm.realm}}</a></li>
<li><a href="#/realms/{{realm.id}}">Settings</a></li>
<li class="active">Registration</li>
</ol>
<h2><span>{{realm.realm}}</span> Registration Settings</h2>
<form name="realmForm" novalidate>
<fieldset>
<legend uncollapsed><span class="text">Realm Default Roles</span> </legend>
<div class="form-group">
<div class="controls changing-selectors">
<div class="select-title">
<label for="available">Available Roles</label>
<select id="available" class="form-control" multiple size="5"
ng-multiple="true"
ng-model="selectedRealmRoles"
ng-options="r for r in availableRealmRoles">
</select>
</div>
<div class="middle-buttons">
<button type="submit" ng-click="addRealmDefaultRole()" tooltip="Move right" tooltip-placement="right"><span class="icon-arrow-right">Move right</span></button>
<button type="submit" ng-click="rmRealmDefaultRole()" tooltip="Move left" tooltip-placement="right"><span class="icon-arrow-left">Move left</span></button>
</div>
<div class="select-title">
<label for="assigned">Realm Default Roles</label>
<select id="assigned" class="form-control" multiple size=5
ng-multiple="true"
ng-model="selectedRealmDefRoles"
ng-options="r for r in realm.defaultRoles">
</select>
</div>
</div>
</div>
</fieldset>
<fieldset ng-show="applications.length > 0">
<legend uncollapsed><span class="text">Application Default Roles</span> </legend>
<div class="form-group input-select">
<label for="applications">Application</label>
<div class="input-group">
<div class="select-rcue">
<select id="applications" name="applications" ng-change="changeApplication()" ng-model="application" ng-options="a.name for a in applications">
<option value="" selected> Select an Application...</option>
</select>
</div>
</div>
</div>
<div class="form-group" ng-show="application">
<div class="controls changing-selectors application">
<div class="select-title">
<label for="available-app">Available Roles</label>
<select id="available-app" class="form-control" multiple size="5"
ng-multiple="true"
ng-model="selectedAppRoles"
ng-options="r for r in availableAppRoles">
</select>
</div>
<div class="middle-buttons">
<button type="submit" ng-click="addAppDefaultRole()" tooltip="Move right" tooltip-placement="right"><span class="icon-arrow-right">Move right</span></button>
<button type="submit" ng-click="rmAppDefaultRole()" tooltip="Move left" tooltip-placement="right"><span class="icon-arrow-left">Move left</span></button>
</div>
<div class="select-title">
<label for="assigned-app">Assigned Default Roles</label>
<select id="assigned-app" class="form-control" multiple size=5
ng-multiple="true"
ng-model="selectedAppDefRoles"
ng-options="r for r in application.defaultRoles">
</select>
</div>
</div>
</div>
</fieldset>
</form>
</div>
</div>
<div id="container-right-bg"></div>
</div>
</div>

View file

@ -6,6 +6,7 @@
<ul class="rcue-tabs">
<li><a href="#/realms/{{realm.id}}">General</a></li>
<li data-ng-show="realm.social"><a href="#/realms/{{realm.id}}/social-settings">Social</a></li>
<li data-ng-show="realm.registrationAllowed"><a href="#/realms/{{realm.id}}/registration-settings">Registration</a></li>
<li><a href="#/realms/{{realm.id}}/roles">Roles</a></li>
<li><a href="#/realms/{{realm.id}}/required-credentials">Credentials</a></li>
<li><a href="#/realms/{{realm.id}}/token-settings">Token</a></li>

View file

@ -6,6 +6,7 @@
<ul class="rcue-tabs">
<li><a href="#/realms/{{realm.id}}">General</a></li>
<li class="active" data-ng-show="realm.social"><a href="#/realms/{{realm.id}}/social-settings">Social</a></li>
<li data-ng-show="realm.registrationAllowed"><a href="#/realms/{{realm.id}}/registration-settings">Registration</a></li>
<li><a href="#/realms/{{realm.id}}/roles">Roles</a></li>
<li><a href="#/realms/{{realm.id}}/required-credentials">Credentials</a></li>
<li><a href="#/realms/{{realm.id}}/token-settings">Token</a></li>

View file

@ -6,6 +6,7 @@
<ul class="rcue-tabs">
<li><a href="#/realms/{{realm.id}}">General</a></li>
<li data-ng-show="realm.social"><a href="#/realms/{{realm.id}}/social-settings">Social</a></li>
<li data-ng-show="realm.registrationAllowed"><a href="#/realms/{{realm.id}}/registration-settings">Registration</a></li>
<li><a href="#/realms/{{realm.id}}/roles">Roles</a></li>
<li><a href="#/realms/{{realm.id}}/required-credentials">Credentials</a></li>
<li class="active"><a href="#/realms/{{realm.id}}/token-settings">Token</a></li>

View file

@ -6,6 +6,7 @@
<ul class="rcue-tabs">
<li><a href="#/realms/{{realm.id}}">General</a></li>
<li data-ng-show="realm.social"><a href="#/realms/{{realm.id}}/social-settings">Social</a></li>
<li data-ng-show="realm.registrationAllowed"><a href="#/realms/{{realm.id}}/registration-settings">Registration</a></li>
<li class="active"><a href="#/realms/{{realm.id}}/roles">Roles</a></li>
<li><a href="#/realms/{{realm.id}}/required-credentials">Credentials</a></li>
<li><a href="#/realms/{{realm.id}}/token-settings">Token</a></li>