2019-11-25 16:12:43 +01:00
<!-- Modal change avatar -->
< div class = "modal fade" id = "avatarChangeModal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h4 class = "modal-title" > Change your Avatar< / h4 >
< / div >
< div class = "modal-body settings-avatar-selector" >
2019-12-12 15:34:26 +01:00
< div class = "radio" >
< label >
< input type = "radio" name = "useGravatar" ng-model = "avatarChange.useGravatar" value = "true_string" >
2019-12-17 15:05:01 -08:00
Use < a target = "_blank" href = "https://gravatar.com/" > Gravatar< / a >
2019-12-12 15:34:26 +01:00
< / label >
< / div >
< div class = "radio" >
< label >
< input type = "radio" name = "useGravatar" ng-model = "avatarChange.useGravatar" value = "" >
Use Custom Picture
< / label >
< / div >
< div ng-hide = "avatarChange.useGravatar" class = "preview-avatar" >
2020-01-20 19:01:41 +01:00
< img id = "previewAvatar" width = "128" height = "128" class = "copy" ng-click = "avatarChange.showCustomAvatarSelector()" / >
2019-12-12 15:34:26 +01:00
< input type = "file" id = "avatarFileInput" style = "display: none" accept = "image/png" / >
< / div >
2019-11-25 16:12:43 +01:00
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-default" data-dismiss = "modal" > Cancel< / button >
2020-01-20 19:01:41 +01:00
< button type = "button" class = "btn btn-success" ng-click = "avatarChange.doChangeAvatar()" ng-disabled = "avatarChange.busy || (avatarChange.useGravatarOrig === avatarChange.useGravatar && avatarChange.useGravatar) || (!avatarChange.useGravatar && !avatarChange.pictureChanged)" > < i class = "fa fa-circle-notch fa-spin" ng-show = "avatarChange.busy" > < / i > Save< / button >
2019-11-25 16:12:43 +01:00
< / div >
< / div >
< / div >
< / div >
2018-01-22 13:01:38 -08:00
<!-- Modal change password -->
< div class = "modal fade" id = "passwordChangeModal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h4 class = "modal-title" > Change your password< / h4 >
< / div >
< div class = "modal-body" >
< form name = "passwordChangeForm" role = "form" novalidate ng-submit = "passwordchange.submit()" autocomplete = "off" >
< input type = "password" style = "display: none;" >
< div class = "form-group" ng-class = "{ 'has-error': (!passwordChangeForm.password.$dirty && passwordchange.error.password) || (passwordChangeForm.password.$dirty && passwordChangeForm.password.$invalid) }" >
< label class = "control-label" for = "inputPasswordChangePassword" > Current password< / label >
< div class = "control-label" ng-show = "(!passwordChangeForm.password.$dirty && passwordchange.error.password) || (passwordChangeForm.password.$dirty && passwordChangeForm.password.$invalid)" >
< small ng-show = "!passwordChangeForm.password.$dirty && passwordchange.error.password" > Wrong password< / small >
< small ng-show = "passwordChangeForm.password.$dirty && passwordChangeForm.password.$error.required" > A password is required< / small >
< / div >
< input type = "password" class = "form-control" ng-model = "passwordchange.password" id = "inputPasswordChangePassword" name = "password" required autofocus >
< / div >
< div class = "form-group" ng-class = "{ 'has-error': (!passwordChangeForm.newPassword.$dirty && passwordchange.error.newPassword) || (passwordChangeForm.newPassword.$dirty && passwordChangeForm.newPassword.$invalid) }" >
< label class = "control-label" for = "inputPasswordChangeNewPassword" > New password< / label >
< div class = "control-label" ng-show = "(!passwordChangeForm.newPassword.$dirty && passwordchange.error.newPassword) || (passwordChangeForm.newPassword.$dirty && passwordChangeForm.newPassword.$invalid)" >
< small ng-show = "!passwordChangeForm.newPassword.$dirty && passwordchange.error.newPassword" > {{ passwordchange.error.newPassword }}< br / > < br / > < / small >
2018-06-11 13:48:12 -07:00
< small ng-show = " passwordChangeForm.newPassword.$dirty && passwordChangeForm.newPassword.$invalid" > Password must be atleast 8 characters< / small >
2018-01-22 13:01:38 -08:00
< / div >
2019-02-08 09:50:39 -08:00
< input type = "password" class = "form-control" ng-model = "passwordchange.newPassword" id = "inputPasswordChangeNewPassword" name = "newPassword" ng-pattern = "/^.{8,}$/" required autofocus >
2018-01-22 13:01:38 -08:00
< / div >
< div class = "form-group" ng-class = "{ 'has-error': (!passwordChangeForm.newPassword.$dirty && passwordchange.error.newPassword) || (passwordChangeForm.newPasswordRepeat.$dirty && passwordChangeForm.newPasswordRepeat.$error.required) || (passwordChangeForm.newPasswordRepeat.$dirty && passwordchange.newPassword !== passwordchange.newPasswordRepeat) }" >
< label class = "control-label" for = "inputPasswordChangeNewPasswordRepeat" > Repeat new password< / label >
< div class = "control-label" ng-show = "(!passwordChangeForm.newPassword.$dirty && passwordchange.error.newPassword) || (passwordChangeForm.newPasswordRepeat.$dirty && passwordChangeForm.newPasswordRepeat.$error.required) || (passwordChangeForm.newPasswordRepeat.$dirty && passwordchange.newPassword !== passwordchange.newPasswordRepeat)" >
< small ng-show = "passwordChangeForm.newPasswordRepeat.$dirty && passwordChangeForm.newPasswordRepeat.$error.required" > A password is required< / small >
< small ng-show = "passwordChangeForm.newPasswordRepeat.$dirty && passwordchange.newPassword !== passwordchange.newPasswordRepeat && passwordchange.newPasswordRepeat" > Passwords don't match< / small >
< / div >
< input type = "password" class = "form-control" ng-model = "passwordchange.newPasswordRepeat" id = "inputPasswordChangeNewPasswordRepeat" name = "newPasswordRepeat" required autofocus >
< / div >
< input class = "ng-hide" type = "submit" ng-disabled = "passwordChangeForm.$invalid" / >
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-default" data-dismiss = "modal" > Cancel< / button >
2019-11-07 09:24:22 -08:00
< button type = "button" class = "btn btn-success" ng-click = "passwordchange.submit()" ng-disabled = "passwordChangeForm.$invalid || passwordchange.busy" > < i class = "fa fa-circle-notch fa-spin" ng-show = "passwordchange.busy" > < / i > Change< / button >
2018-01-22 13:01:38 -08:00
< / div >
< / div >
< / div >
< / div >
<!-- Modal change email -->
< div class = "modal fade" id = "emailChangeModal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
2018-02-23 10:29:04 -08:00
< h4 class = "modal-title" > Change primary email address< / h4 >
2018-01-22 13:01:38 -08:00
< / div >
< div class = "modal-body" >
< form name = "emailChangeForm" role = "form" novalidate ng-submit = "emailchange.submit()" autocomplete = "off" >
< div class = "form-group" ng-class = "{ 'has-error': (emailChangeForm.email.$dirty && emailChangeForm.email.$invalid) || (!emailChangeForm.email.$dirty && emailchange.error.email)}" >
< div class = "control-label" ng-show = "(!emailChangeForm.email.$dirty && emailchange.error.email) || (emailChangeForm.email.$dirty && emailChangeForm.email.$invalid)" >
< small ng-show = "emailChangeForm.email.$error.required" > A valid email address is required< / small >
< small ng-show = "(emailChangeForm.email.$dirty && emailChangeForm.email.$invalid) && !emailChangeForm.email.$error.required" > The Email address is not valid< / small >
< small ng-show = "!emailChangeForm.email.$dirty && emailchange.error.email" > {{ emailchange.error.email }}< / small >
< / div >
< input type = "email" class = "form-control" ng-model = "emailchange.email" id = "inputEmailChangeEmail" name = "email" required autofocus >
< / div >
< input class = "ng-hide" type = "submit" ng-disabled = "emailChangeForm.$invalid" / >
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-default" data-dismiss = "modal" > Cancel< / button >
2018-11-16 17:03:21 +01:00
< button type = "button" class = "btn btn-success" ng-click = "emailchange.submit()" ng-disabled = "emailChangeForm.$invalid || emailchange.busy" > < i class = "fa fa-circle-notch fa-spin" ng-show = "emailchange.busy" > < / i > Change< / button >
2018-01-22 13:01:38 -08:00
< / div >
< / div >
< / div >
< / div >
<!-- Modal change fallback email -->
< div class = "modal fade" id = "fallbackEmailChangeModal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h4 class = "modal-title" > Change password recovery email address< / h4 >
< / div >
< div class = "modal-body" >
< form name = "fallbackEmailChangeForm" role = "form" novalidate ng-submit = "fallbackEmailChange.submit()" autocomplete = "off" >
< div class = "form-group" ng-class = "{ 'has-error': (fallbackEmailChangeForm.email.$dirty && fallbackEmailChangeForm.email.$invalid) || (!fallbackEmailChangeForm.email.$dirty && fallbackEmailChange.error.email)}" >
< div class = "control-label" ng-show = "(!fallbackEmailChangeForm.email.$dirty && fallbackEmailChange.error.email) || (fallbackEmailChangeForm.email.$dirty && fallbackEmailChangeForm.email.$invalid)" >
< small ng-show = "fallbackEmailChangeForm.email.$error.required" > A valid email address is required< / small >
< small ng-show = "(fallbackEmailChangeForm.email.$dirty && fallbackEmailChangeForm.email.$invalid) && !fallbackEmailChangeForm.email.$error.required" > The Email address is not valid< / small >
< small ng-show = "!fallbackEmailChangeForm.email.$dirty && fallbackEmailChange.error.email" > {{ fallbackEmailChange.error.email }}< / small >
< / div >
< input type = "email" class = "form-control" ng-model = "fallbackEmailChange.email" id = "inputfallbackEmailChangeEmail" name = "email" required autofocus >
< / div >
< input class = "ng-hide" type = "submit" ng-disabled = "fallbackEmailChangeForm.$invalid" / >
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-default" data-dismiss = "modal" > Cancel< / button >
2018-11-16 17:03:21 +01:00
< button type = "button" class = "btn btn-success" ng-click = "fallbackEmailChange.submit()" ng-disabled = "fallbackEmailChangeForm.$invalid || fallbackEmailChange.busy" > < i class = "fa fa-circle-notch fa-spin" ng-show = "fallbackEmailChange.busy" > < / i > Change< / button >
2018-01-22 13:01:38 -08:00
< / div >
< / div >
< / div >
< / div >
<!-- Modal change displayName -->
< div class = "modal fade" id = "displayNameChangeModal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h4 class = "modal-title" > Change your display name< / h4 >
< / div >
< div class = "modal-body" >
< form name = "displayNameChangeForm" role = "form" novalidate ng-submit = "displayNameChange.submit()" autocomplete = "off" >
< div class = "form-group" ng-class = "{ 'has-error': (displayNameChangeForm.displayName.$dirty && displayNameChangeForm.displayName.$invalid) || (!displayNameChangeForm.displayName.$dirty && displayNameChange.error.displayName)}" >
< label class = "control-label" > Display name< / label >
< div class = "control-label" ng-show = "(!displayNameChangeForm.displayName.$dirty && displayNameChange.error.displayName) || (displayNameChangeForm.displayName.$dirty && displayNameChangeForm.displayName.$invalid)" >
< small ng-show = "displayNameChangeForm.displayName.$error.required" > A valid display name is required< / small >
< small ng-show = "(displayNameChangeForm.displayName.$dirty && displayNameChangeForm.displayName.$invalid) && !displayNameChangeForm.displayName.$error.required" > This display name is not valid< / small >
< small ng-show = "!displayNameChangeForm.email.$dirty && displayNameChange.error.displayName" > {{ displayNameChange.error.displayName }}< / small >
< / div >
< input type = "text" class = "form-control" ng-model = "displayNameChange.displayName" id = "inputDisplayNameChangeDisplayName" name = "displayName" required autofocus >
< / div >
< input class = "ng-hide" type = "submit" ng-disabled = "displayNameChangeForm.$invalid" / >
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-default" data-dismiss = "modal" > Cancel< / button >
2018-11-16 17:03:21 +01:00
< button type = "button" class = "btn btn-success" ng-click = "displayNameChange.submit()" ng-disabled = "displayNameChangeForm.$invalid || displayNameChange.busy" > < i class = "fa fa-circle-notch fa-spin" ng-show = "displayNameChange.busy" > < / i > Change< / button >
2018-01-22 13:01:38 -08:00
< / div >
< / div >
< / div >
< / div >
2018-04-26 15:12:29 +02:00
<!-- Modal enable twofactor authentication -->
< div class = "modal fade" id = "twoFactorAuthenticationEnableModal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h4 class = "modal-title" > Enable Two-Factor Authentication< / h4 >
< / div >
< div class = "modal-body text-center" ng-hide = "twoFactorAuthentication.secret" >
2018-11-16 17:03:21 +01:00
< h2 > < i class = "fa fa-circle-notch fa-spin" > < / i > < / h2 >
2018-04-26 15:12:29 +02:00
< / div >
< div class = "modal-body" ng-show = "twoFactorAuthentication.secret" >
2018-04-26 09:32:56 -07:00
< p >
Use Google Authenticator (< a href = "https://play.google.com/store/apps/details?id=com.google.android.apps.authenticator2" target = "_blank" > Android< / a > , < a href = "https://itunes.apple.com/us/app/google-authenticator/id388497605" target = "_blank" > iOS< / a > ), FreeOTP authenticator (< a href = "https://play.google.com/store/apps/details?id=org.fedorahosted.freeotp" target = "_blank" > Android< / a > , < a href = "https://itunes.apple.com/us/app/freeotp-authenticator/id872559395" target = "_blank" > iOS< / a > ) or a similar TOTP app to scan the secret.
< / p >
2018-04-26 15:12:29 +02:00
< center >
< img ng-src = "{{ twoFactorAuthentication.qrcode }}" / >
< p > {{ twoFactorAuthentication.secret }}< / p >
< / center >
< br / >
< form name = "twoFactorAuthenticationEnableForm" role = "form" novalidate ng-submit = "twoFactorAuthentication.enable()" autocomplete = "off" >
< div class = "form-group" ng-class = "{ 'has-error': (!twoFactorAuthenticationEnableForm.totpToken.$dirty && twoFactorAuthentication.error) || (twoFactorAuthenticationEnableForm.totpToken.$dirty && twoFactorAuthenticationEnableForm.totpToken.$invalid) }" >
< label class = "control-label" > Token< / label >
< div class = "control-label" ng-show = "(!twoFactorAuthenticationEnableForm.totpToken.$dirty && twoFactorAuthentication.error) || (twoFactorAuthenticationEnableForm.totpToken.$dirty && twoFactorAuthenticationEnableForm.totpToken.$invalid)" >
< small > {{ twoFactorAuthentication.error }}< / small >
< / div >
< input type = "text" class = "form-control" ng-model = "twoFactorAuthentication.totpToken" id = "twoFactorAuthenticationTotpTokenInput" name = "totpToken" required autofocus >
< / div >
< input class = "ng-hide" type = "submit" ng-disabled = "twoFactorAuthenticationEnableForm.$invalid" / >
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-default" data-dismiss = "modal" > Cancel< / button >
2018-11-16 17:03:21 +01:00
< button type = "button" class = "btn btn-success" ng-click = "twoFactorAuthentication.enable()" ng-disabled = "twoFactorAuthenticationEnableForm.$invalid || twoFactorAuthentication.busy" > < i class = "fa fa-circle-notch fa-spin" ng-show = "twoFactorAuthentication.busy" > < / i > Enable< / button >
2018-04-26 15:12:29 +02:00
< / div >
< / div >
< / div >
< / div >
2018-04-26 16:38:26 +02:00
<!-- Modal disable twofactor authentication -->
< div class = "modal fade" id = "twoFactorAuthenticationDisableModal" tabindex = "-1" role = "dialog" >
< div class = "modal-dialog" >
< div class = "modal-content" >
< div class = "modal-header" >
< h4 class = "modal-title" > Disable Two-Factor Authentication< / h4 >
< / div >
< div class = "modal-body" >
< form name = "twoFactorAuthenticationDisableForm" role = "form" novalidate ng-submit = "twoFactorAuthentication.disable()" autocomplete = "off" >
< div class = "form-group" ng-class = "{ 'has-error': (!twoFactorAuthenticationDisableForm.password.$dirty && twoFactorAuthentication.error) || (twoFactorAuthenticationDisableForm.password.$dirty && twoFactorAuthenticationDisableForm.password.$invalid) }" >
< label class = "control-label" > Password< / label >
< div class = "control-label" ng-show = "(!twoFactorAuthenticationDisableForm.password.$dirty && twoFactorAuthentication.error) || (twoFactorAuthenticationDisableForm.password.$dirty && twoFactorAuthenticationDisableForm.password.$invalid)" >
< small > {{ twoFactorAuthentication.error }}< / small >
< / div >
< input type = "password" class = "form-control" ng-model = "twoFactorAuthentication.password" id = "twoFactorAuthenticationPasswordInput" name = "password" required autofocus >
< / div >
< input class = "ng-hide" type = "submit" ng-disabled = "twoFactorAuthenticationDisableForm.$invalid" / >
< / form >
< / div >
< div class = "modal-footer" >
< button type = "button" class = "btn btn-default" data-dismiss = "modal" > Cancel< / button >
2018-11-16 17:03:21 +01:00
< button type = "button" class = "btn btn-success" ng-click = "twoFactorAuthentication.disable()" ng-disabled = "twoFactorAuthenticationDisableForm.$invalid || twoFactorAuthentication.busy" > < i class = "fa fa-circle-notch fa-spin" ng-show = "twoFactorAuthentication.busy" > < / i > Disable< / button >
2018-04-26 16:38:26 +02:00
< / div >
< / div >
< / div >
2018-08-27 15:26:52 -07:00
< / div >
2018-01-22 13:01:38 -08:00
< div class = "content" >
< div class = "text-left" >
2019-11-07 11:07:57 +01:00
< h1 > Profile< / h1 >
2018-01-22 13:01:38 -08:00
< / div >
< div class = "card" >
< div class = "grid-item-top" >
< div class = "row" >
< div class = "col-xs-4" style = "min-width: 150px;" >
2019-11-25 16:12:43 +01:00
< div class = "settings-avatar" ng-click = "avatarChange.showChangeAvatar()" style = "background-image: url('{{ user.avatarUrl }}');" >
< div class = "overlay" > < / div >
< / div >
2018-01-22 13:01:38 -08:00
< / div >
< div class = "col-xs-8" >
< table width = "100%" >
< tr >
< td class = "text-muted" style = "vertical-align: top;" > Username< / td >
2018-04-26 16:32:43 +02:00
< td class = "text-right" style = "vertical-align: top;" >
{{ user.username }}
< / td >
2018-01-22 13:01:38 -08:00
< / tr >
< tr >
< td class = "text-muted" style = "vertical-align: top;" > Display name< / td >
2018-04-26 16:32:43 +02:00
< td class = "text-right" style = "vertical-align: top; white-space: nowrap;" >
2019-08-30 13:36:52 +02:00
{{ user.displayName }} < a href = "" ng-click = "displayNameChange.show()" ng-hide = "user.source" > < i class = "fa fa-edit text-small" > < / i > < / a >
2018-04-26 16:32:43 +02:00
< / td >
2018-01-22 13:01:38 -08:00
< / tr >
< tr >
2018-02-23 10:29:04 -08:00
< td class = "text-muted" style = "vertical-align: top;" > Primary email< / td >
2018-04-26 16:32:43 +02:00
< td class = "text-right" style = "vertical-align: top; white-space: nowrap;" >
2019-08-30 13:36:52 +02:00
{{ user.email }} < a href = "" ng-click = "emailchange.show()" ng-hide = "user.source" > < i class = "fa fa-edit text-small" > < / i > < / a >
2018-04-26 16:32:43 +02:00
< / td >
2018-01-22 13:01:38 -08:00
< / tr >
< tr >
< td class = "text-muted" style = "vertical-align: top;" > Password recovery email< / td >
2018-04-26 16:32:43 +02:00
< td class = "text-right" style = "vertical-align: top; white-space: nowrap;" >
2019-08-30 13:36:52 +02:00
{{ user.fallbackEmail }} < a href = "" ng-click = "fallbackEmailChange.show()" ng-hide = "user.source" > < i class = "fa fa-edit text-small" > < / i > < / a >
2018-04-26 16:32:43 +02:00
< / td >
2018-01-22 13:01:38 -08:00
< / tr >
< tr >
< td class = "text-right" colspan = "2" style = "vertical-align: top;" >
< br / >
2019-11-07 09:24:22 -08:00
< button class = "btn btn-primary" ng-click = "twoFactorAuthentication.show()" > {{ user.twoFactorAuthenticationEnabled ? 'Disable 2FA' : 'Enable 2FA' }}< / button >
< button class = "btn btn-primary" ng-click = "passwordchange.show()" ng-hide = "user.source" > Change Password< / button >
2018-01-22 13:01:38 -08:00
< / td >
< / tr >
< / table >
< / div >
< / div >
< / div >
< / div >
2019-05-14 16:55:29 +02:00
< div class = "text-left" ng-show = "user.admin" >
2019-11-08 17:24:52 +01:00
< h3 > Sessions and API Tokens< / h3 >
2018-08-27 15:26:52 -07:00
< / div >
2019-05-14 16:55:29 +02:00
< div class = "card" ng-show = "user.admin" >
2019-11-07 12:08:51 +01:00
< div class = "grid-item-top" >
< div class = "row" >
< div class = "col-xs-12" >
2019-11-07 14:28:52 -08:00
< p > You have {{ webadminClient.activeTokens.length }} active web session(s) and {{ cliClient.activeTokens.length }} CLI token(s).< / p >
2019-11-07 12:08:51 +01:00
< button class = "btn btn-outline btn-danger pull-right" ng-click = "revokeTokens()" > Logout From All< / button >
< / div >
2018-08-27 15:26:52 -07:00
< / div >
2019-11-07 12:08:51 +01:00
< / div >
2018-08-27 15:26:52 -07:00
< / div >
2018-04-26 09:32:56 -07:00
< / div >
