broker ui improvements

This commit is contained in:
Bill Burke 2015-03-24 10:27:01 -04:00
parent e9aac561d3
commit 4a0f6eca11
2 changed files with 155 additions and 133 deletions

View file

@ -18,25 +18,37 @@
</div> </div>
<span tooltip-placement="right" tooltip="The alias unique identifies an identity provider and it is also used to build the redirect uri." class="fa fa-info-circle"></span> <span tooltip-placement="right" tooltip="The alias unique identifies an identity provider and it is also used to build the redirect uri." class="fa fa-info-circle"></span>
</div> </div>
<div class="form-group" data-ng-show="newIdentityProvider && !importFile"> <div class="form-group">
<label class="col-sm-2 control-label" for="fromUrl">Import From Url</label> <label class="col-sm-2 control-label" for="enabled">Enabled</label>
<div class="col-sm-4"> <div class="col-sm-4">
<input class="form-control" id="fromUrl" type="text" ng-model="fromUrl"> <input ng-model="identityProvider.enabled" id="enabled" onoffswitch />
</div> </div>
<span tooltip-placement="right" tooltip="Import metadata from a remote IDP SAML entity descriptor." class="fa fa-info-circle"></span> <span tooltip-placement="right" tooltip="Enable/disable this identity provider." class="fa fa-info-circle"></span>
</div> </div>
<div class="form-group" data-ng-show="newIdentityProvider && !importUrl"> <div class="form-group">
<label class="col-sm-2 control-label">Import From File</label> <label class="col-sm-2 control-label" for="authenticateByDefault">Authenticate By Default</label>
<div class="col-sm-4"> <div class="col-sm-4">
<div class="controls kc-button-input-file" data-ng-show="!files || files.length == 0"> <input ng-model="identityProvider.authenticateByDefault" name="identityProvider.authenticateByDefault" id="authenticateByDefault" onoffswitch />
<a href="#" class="btn btn-default"><span class="kc-icon-upload">Icon: Upload</span>Choose a File...</a>
<input id="import-file" type="file" class="transparent" ng-file-select="onFileSelect($files)">
</div>
<span class="kc-uploaded-file" data-ng-show="files.length > 0">
{{files[0].name}}
</span>
</div> </div>
<span tooltip-placement="right" tooltip="Indicates if this provider should be tried by default for authentication even before displaying login screen" class="fa fa-info-circle"></span>
</div> </div>
<div class="form-group">
<label class="col-sm-2 control-label" for="enabled">Store Tokens</label>
<div class="col-sm-4">
<input ng-model="identityProvider.storeToken" id="storeToken" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Enable/disable if tokens must be stored when authenticating users." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="updateProfileFirstLogin">Update Profile on First Login</label>
<div class="col-sm-4">
<input ng-model="identityProvider.updateProfileFirstLogin" name="identityProvider.updateProfileFirstLogin" id="updateProfileFirstLogin" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Indicates if user must update his profile right after the first login." class="fa fa-info-circle"></span>
</div>
</fieldset>
<fieldset>
<legend uncollapsed><span class="text">OpenID Connect Config</span> <span tooltip-placement="right" tooltip="OIDC SP and external IDP configuration." class="fa fa-info-circle"></span></legend>
<div class="form-group clearfix"> <div class="form-group clearfix">
<label class="col-sm-2 control-label" for="authorizationUrl">Authorization Url <span class="required">*</span></label> <label class="col-sm-2 control-label" for="authorizationUrl">Authorization Url <span class="required">*</span></label>
<div class="col-sm-4"> <div class="col-sm-4">
@ -111,41 +123,40 @@
</div> </div>
<span tooltip-placement="right" tooltip="Specifies whether the Authorization Server prompts the End-User for reauthentication and consent." class="fa fa-info-circle"></span> <span tooltip-placement="right" tooltip="Specifies whether the Authorization Server prompts the End-User for reauthentication and consent." class="fa fa-info-circle"></span>
</div> </div>
<div class="form-group"> </fieldset>
<label class="col-sm-2 control-label" for="enabled">Store Tokens</label> <fieldset>
<legend uncollapsed><span class="text">Import External IDP Config</span> <span tooltip-placement="right" tooltip="Allows you to load external IDP metadata from a config file or to download it from a URL." class="fa fa-info-circle"></span></legend>
<div class="form-group" data-ng-show="newIdentityProvider">
<label class="col-sm-2 control-label" for="fromUrl">Import From Url</label>
<div class="col-sm-4"> <div class="col-sm-4">
<input ng-model="identityProvider.storeToken" id="storeToken" onoffswitch /> <input class="form-control" id="fromUrl" type="text" ng-model="fromUrl">
</div>
<span tooltip-placement="right" tooltip="Import metadata from a remote IDP discovery descriptor." class="fa fa-info-circle"></span>
<div class="col-sm-4" data-ng-show="importUrl">
<button type="submit" data-ng-click="importFrom()" data-ng-show="importUrl" class="btn btn-primary">Import</button>
</div> </div>
<span tooltip-placement="right" tooltip="Enable/disable if tokens must be stored when authenticating users." class="fa fa-info-circle"></span>
</div> </div>
<div class="form-group"> <div class="form-group" data-ng-show="newIdentityProvider">
<label class="col-sm-2 control-label" for="enabled">Enabled</label> <label class="col-sm-2 control-label">Import From File</label>
<div class="col-sm-4"> <div class="col-sm-4">
<input ng-model="identityProvider.enabled" id="enabled" onoffswitch /> <div class="controls kc-button-input-file" data-ng-show="!files || files.length == 0">
<a href="#" class="btn btn-default"><span class="kc-icon-upload">Icon: Upload</span>Choose a File...</a>
<input id="import-file" type="file" class="transparent" ng-file-select="onFileSelect($files)">
</div>
<span class="kc-uploaded-file" data-ng-show="files.length > 0">
{{files[0].name}}
</span>
<span tooltip-placement="right" tooltip="Import metadata from a downloaded IDP discovery descriptor." class="fa fa-info-circle"></span>
</div> </div>
<span tooltip-placement="right" tooltip="Enable/disable this identity provider." class="fa fa-info-circle"></span> <div class="col-sm-4" data-ng-show="importFile">
</div> <button type="submit" data-ng-click="uploadFile()" data-ng-show="importFile" class="btn btn-primary">Import</button>
<div class="form-group">
<label class="col-sm-2 control-label" for="updateProfileFirstLogin">Update Profile on First Login</label>
<div class="col-sm-4">
<input ng-model="identityProvider.updateProfileFirstLogin" name="identityProvider.updateProfileFirstLogin" id="updateProfileFirstLogin" onoffswitch />
</div> </div>
<span tooltip-placement="right" tooltip="Indicates if user must update his profile right after the first login." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="authenticateByDefault">Authenticate By Default</label>
<div class="col-sm-4">
<input ng-model="identityProvider.authenticateByDefault" name="identityProvider.authenticateByDefault" id="authenticateByDefault" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Indicates if this provider should be tried by default for authentication even before displaying login screen" class="fa fa-info-circle"></span>
</div> </div>
</fieldset> </fieldset>
<div class="pull-right form-actions"> <div class="pull-right form-actions">
<button kc-save data-ng-show="changed">Save</button> <button kc-save data-ng-show="changed">Save</button>
<button type="submit" data-ng-click="cancel()" data-ng-show="changed" class="btn btn-lg btn-default">Cancel</button> <button type="submit" data-ng-click="cancel()" data-ng-show="changed" class="btn btn-lg btn-default">Cancel</button>
<button type="submit" data-ng-click="uploadFile()" data-ng-show="importFile" class="btn btn-lg btn-primary">Import</button>
<button type="submit" data-ng-click="importFrom()" data-ng-show="importUrl" class="btn btn-lg btn-primary">Import</button>
<button kc-delete data-ng-click="remove()" data-ng-show="!newIdentityProvider">Delete</button> <button kc-delete data-ng-click="remove()" data-ng-show="!newIdentityProvider">Delete</button>
</div> </div>
</form> </form>

View file

@ -18,14 +18,118 @@
</div> </div>
<span tooltip-placement="right" tooltip="The alias unique identifies an identity provider and it is also used to build the redirect uri." class="fa fa-info-circle"></span> <span tooltip-placement="right" tooltip="The alias unique identifies an identity provider and it is also used to build the redirect uri." class="fa fa-info-circle"></span>
</div> </div>
<div class="form-group" data-ng-show="newIdentityProvider && !importFile"> <div class="form-group">
<label class="col-sm-2 control-label" for="enabled">Enabled</label>
<div class="col-sm-4">
<input ng-model="identityProvider.enabled" id="enabled" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Enable/disable this identity provider." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="authenticateByDefault">Authenticate By Default</label>
<div class="col-sm-4">
<input ng-model="identityProvider.authenticateByDefault" name="identityProvider.authenticateByDefault" id="authenticateByDefault" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Indicates if this provider should be tried by default for authentication even before displaying login screen" class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="enabled">Store Tokens</label>
<div class="col-sm-4">
<input ng-model="identityProvider.storeToken" id="storeToken" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Enable/disable if tokens must be stored when authenticating users." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="updateProfileFirstLogin">Update Profile on First Login</label>
<div class="col-sm-4">
<input ng-model="identityProvider.updateProfileFirstLogin" name="identityProvider.updateProfileFirstLogin" id="updateProfileFirstLogin" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Indicates if user must update his profile right after the first login." class="fa fa-info-circle"></span>
</div>
</fieldset>
<fieldset>
<legend uncollapsed><span class="text">SAML Config</span> <span tooltip-placement="right" tooltip="SAML SP and external IDP configuration." class="fa fa-info-circle"></span></legend>
<div class="form-group clearfix">
<label class="col-sm-2 control-label" for="singleSignOnServiceUrl">Single Sign-On Service Url<span class="required">*</span></label>
<div class="col-sm-4">
<input class="form-control" id="singleSignOnServiceUrl" type="text" ng-model="identityProvider.config.singleSignOnServiceUrl" required>
</div>
<span tooltip-placement="right" tooltip="The Url that must be used to send authentication requests(SAML AuthnRequest)." class="fa fa-info-circle"></span>
</div>
<div class="form-group clearfix">
<label class="col-sm-2 control-label" for="singleSignOnServiceUrl">Single Logout Service Url</label>
<div class="col-sm-4">
<input class="form-control" id="singleLogoutServiceUrl" type="text" ng-model="identityProvider.config.singleLogoutServiceUrl">
</div>
<span tooltip-placement="right" tooltip="The Url that must be used to send logout requests." class="fa fa-info-circle"></span>
</div>
<div class="form-group clearfix">
<label class="col-sm-2 control-label" for="nameIDPolicyFormat">NameID Policy Format</label>
<div class="col-sm-4">
<select id="nameIDPolicyFormat" ng-model="identityProvider.config.nameIDPolicyFormat"
ng-options="nameFormat.format as nameFormat.name for nameFormat in nameIdFormats">
</select>
<!-- <input class="form-control" id="nameIDPolicyFormat" type="text" ng-model="identityProvider.config.nameIDPolicyFormat"> -->
</div>
<span tooltip-placement="right" tooltip="Specifies the URI reference corresponding to a name identifier format. Defaults to urn:oasis:names:tc:SAML:2.0:nameid-format:persistent." class="fa fa-info-circle"></span>
</div>
<div class="form-group clearfix">
<label class="col-sm-2 control-label" for="signingCertificate">Validating X509 Certificate</label>
<div class="col-sm-4">
<textarea class="form-control" id="signingCertificate" ng-model="identityProvider.config.signingCertificate"/>
</div>
<span tooltip-placement="right" tooltip="The certificate in PEM format that must be used to check for signatures." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="wantAuthnRequestsSigned">Want AuthnRequests Signed</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.wantAuthnRequestsSigned" id="wantAuthnRequestsSigned" name="wantAuthnRequestsSigned" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip=" Indicates whether the identity provider expects signed a AuthnRequest." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="forceAuthn">Force Authentication</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.forceAuthn" id="forceAuthn" name="forceAuthn" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip=" Indicates whether the identity provider must authenticate the presenter directly rather than rely on a previous security context." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="validateSignature">Validate Signature</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.validateSignature" id="validateSignature" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip="Enable/disable signature validation of SAML responses." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="postBindingResponse">HTTP-POST Binding Response</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.postBindingResponse" id="postBindingResponse" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip="Indicates whether the identity provider must respond to the AuthnRequest using HTTP-POST binding. If false, HTTP-REDIRECT binding will be used." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="postBindingAuthnRequest">HTTP-POST Binding for AuthnRequest</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.postBindingAuthnRequest" id="postBindingAuthnRequest" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip="Indicates whether the AuthnRequest must be sent using HTTP-POST binding. If false, HTTP-REDIRECT binding will be used." class="fa fa-info-circle"></span>
</div>
</fieldset>
<fieldset>
<legend uncollapsed><span class="text">Import External IDP Config</span> <span tooltip-placement="right" tooltip="Allows you to load external IDP metadata from a config file or to download it from a URL." class="fa fa-info-circle"></span></legend>
<div class="form-group" data-ng-show="newIdentityProvider">
<label class="col-sm-2 control-label" for="fromUrl">Import From Url</label> <label class="col-sm-2 control-label" for="fromUrl">Import From Url</label>
<div class="col-sm-4"> <div class="col-sm-4">
<input class="form-control" id="fromUrl" type="text" ng-model="fromUrl"> <input class="form-control" id="fromUrl" type="text" ng-model="fromUrl">
</div> </div>
<span tooltip-placement="right" tooltip="Import metadata from a remote IDP SAML entity descriptor." class="fa fa-info-circle"></span> <span tooltip-placement="right" tooltip="Import metadata from a remote IDP SAML entity descriptor." class="fa fa-info-circle"></span>
<div class="col-sm-4" data-ng-show="importUrl">
<button type="submit" data-ng-click="importFrom()" data-ng-show="importUrl" class="btn btn-primary">Import</button>
</div>
</div> </div>
<div class="form-group" data-ng-show="newIdentityProvider && !importUrl"> <div class="form-group" data-ng-show="newIdentityProvider">
<label class="col-sm-2 control-label">Import From File</label> <label class="col-sm-2 control-label">Import From File</label>
<div class="col-sm-4"> <div class="col-sm-4">
<div class="controls kc-button-input-file" data-ng-show="!files || files.length == 0"> <div class="controls kc-button-input-file" data-ng-show="!files || files.length == 0">
@ -36,100 +140,9 @@
{{files[0].name}} {{files[0].name}}
</span> </span>
</div> </div>
</div> <div class="col-sm-4" data-ng-show="importFile">
<div class="form-group clearfix" data-ng-show="!importFile && !importUrl"> <button type="submit" data-ng-click="uploadFile()" data-ng-show="importFile" class="btn btn-primary">Import</button>
<label class="col-sm-2 control-label" for="singleSignOnServiceUrl">Single Sign-On Service Url<span class="required">*</span></label>
<div class="col-sm-4">
<input class="form-control" id="singleSignOnServiceUrl" type="text" ng-model="identityProvider.config.singleSignOnServiceUrl" required>
</div> </div>
<span tooltip-placement="right" tooltip="The Url that must be used to send authentication requests(SAML AuthnRequest)." class="fa fa-info-circle"></span>
</div>
<div class="form-group clearfix" data-ng-show="!importFile && !importUrl">
<label class="col-sm-2 control-label" for="singleSignOnServiceUrl">Single Logout Service Url</label>
<div class="col-sm-4">
<input class="form-control" id="singleLogoutServiceUrl" type="text" ng-model="identityProvider.config.singleLogoutServiceUrl">
</div>
<span tooltip-placement="right" tooltip="The Url that must be used to send logout requests." class="fa fa-info-circle"></span>
</div>
<div class="form-group clearfix" data-ng-show="!importFile && !importUrl">
<label class="col-sm-2 control-label" for="nameIDPolicyFormat">NameID Policy Format</label>
<div class="col-sm-4">
<select id="nameIDPolicyFormat" ng-model="identityProvider.config.nameIDPolicyFormat"
ng-options="nameFormat.format as nameFormat.name for nameFormat in nameIdFormats">
</select>
<!-- <input class="form-control" id="nameIDPolicyFormat" type="text" ng-model="identityProvider.config.nameIDPolicyFormat"> -->
</div>
<span tooltip-placement="right" tooltip="Specifies the URI reference corresponding to a name identifier format. Defaults to urn:oasis:names:tc:SAML:2.0:nameid-format:persistent." class="fa fa-info-circle"></span>
</div>
<div class="form-group clearfix" data-ng-show="!importFile && !importUrl">
<label class="col-sm-2 control-label" for="signingCertificate">Validating X509 Certificate</label>
<div class="col-sm-4">
<textarea class="form-control" id="signingCertificate" ng-model="identityProvider.config.signingCertificate"/>
</div>
<span tooltip-placement="right" tooltip="The certificate in PEM format that must be used to check for signatures." class="fa fa-info-circle"></span>
</div>
<div class="form-group" data-ng-show="!importFile && !importUrl">
<label class="col-sm-2 control-label" for="wantAuthnRequestsSigned">Want AuthnRequests Signed</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.wantAuthnRequestsSigned" id="wantAuthnRequestsSigned" name="wantAuthnRequestsSigned" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip=" Indicates whether the identity provider expects signed a AuthnRequest." class="fa fa-info-circle"></span>
</div>
<div class="form-group" data-ng-show="!importFile && !importUrl">
<label class="col-sm-2 control-label" for="forceAuthn">Force Authentication</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.forceAuthn" id="forceAuthn" name="forceAuthn" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip=" Indicates whether the identity provider must authenticate the presenter directly rather than rely on a previous security context." class="fa fa-info-circle"></span>
</div>
<div class="form-group" data-ng-show="!importFile && !importUrl">
<label class="col-sm-2 control-label" for="validateSignature">Validate Signature</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.validateSignature" id="validateSignature" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip="Enable/disable signature validation of SAML responses." class="fa fa-info-circle"></span>
</div>
<div class="form-group" data-ng-show="!importFile && !importUrl">
<label class="col-sm-2 control-label" for="postBindingResponse">HTTP-POST Binding Response</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.postBindingResponse" id="postBindingResponse" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip="Indicates whether the identity provider must respond to the AuthnRequest using HTTP-POST binding. If false, HTTP-REDIRECT binding will be used." class="fa fa-info-circle"></span>
</div>
<div class="form-group" data-ng-show="!importFile && !importUrl">
<label class="col-sm-2 control-label" for="postBindingAuthnRequest">HTTP-POST Binding for AuthnRequest</label>
<div class="col-sm-4">
<input ng-model="identityProvider.config.postBindingAuthnRequest" id="postBindingAuthnRequest" value="'true'" onoffswitchvalue />
</div>
<span tooltip-placement="right" tooltip="Indicates whether the AuthnRequest must be sent using HTTP-POST binding. If false, HTTP-REDIRECT binding will be used." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="enabled">Store Tokens</label>
<div class="col-sm-4">
<input ng-model="identityProvider.storeToken" id="storeToken" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Enable/disable if tokens must be stored when authenticating users." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="enabled">Enabled</label>
<div class="col-sm-4">
<input ng-model="identityProvider.enabled" id="enabled" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Enable/disable this identity provider." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="updateProfileFirstLogin">Update Profile on First Login</label>
<div class="col-sm-4">
<input ng-model="identityProvider.updateProfileFirstLogin" name="identityProvider.updateProfileFirstLogin" id="updateProfileFirstLogin" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Indicates if user must update his profile right after the first login." class="fa fa-info-circle"></span>
</div>
<div class="form-group">
<label class="col-sm-2 control-label" for="authenticateByDefault">Authenticate By Default</label>
<div class="col-sm-4">
<input ng-model="identityProvider.authenticateByDefault" name="identityProvider.authenticateByDefault" id="authenticateByDefault" onoffswitch />
</div>
<span tooltip-placement="right" tooltip="Indicates if this provider should be tried by default for authentication even before displaying login screen" class="fa fa-info-circle"></span>
</div> </div>
</fieldset> </fieldset>
@ -137,8 +150,6 @@
<a class="btn btn-lg btn-primary" href="#/realms/{{realm.realm}}/identity-provider-settings/provider/{{identityProvider.providerId}}/{{identityProvider.alias}}/export" data-ng-show="!importFile && !newIdentityProvider">Export</a> <a class="btn btn-lg btn-primary" href="#/realms/{{realm.realm}}/identity-provider-settings/provider/{{identityProvider.providerId}}/{{identityProvider.alias}}/export" data-ng-show="!importFile && !newIdentityProvider">Export</a>
<button kc-save data-ng-show="changed">Save</button> <button kc-save data-ng-show="changed">Save</button>
<button type="submit" data-ng-click="cancel()" data-ng-show="changed" class="btn btn-lg btn-default">Cancel</button> <button type="submit" data-ng-click="cancel()" data-ng-show="changed" class="btn btn-lg btn-default">Cancel</button>
<button type="submit" data-ng-click="uploadFile()" data-ng-show="importFile" class="btn btn-lg btn-primary">Import</button>
<button type="submit" data-ng-click="importFrom()" data-ng-show="importUrl" class="btn btn-lg btn-primary">Import</button>
<button kc-delete data-ng-click="remove()" data-ng-show="!newIdentityProvider">Delete</button> <button kc-delete data-ng-click="remove()" data-ng-show="!newIdentityProvider">Delete</button>
</div> </div>
</form> </form>