This is an automated email from the git hooks/post-receive script. New commit to branch feature/1_socialauth in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git commit 6e891e738403a7413e977ca566411d1e9b5260b9 Author: Kevin Morin <morin@codelutin.com> Date: Thu Sep 7 10:48:45 2017 +0200 refs #1 mise en page des comptes externes dans le profil --- .../pollen/services/bean/UserCredentialBean.java | 11 ++++ pollen-ui-riot-js/src/main/web/css/custom.css | 2 + .../src/main/web/tag/UserProfile.tag.html | 73 +++++++++++++++------- 3 files changed, 62 insertions(+), 24 deletions(-) diff --git a/pollen-services/src/main/java/org/chorem/pollen/services/bean/UserCredentialBean.java b/pollen-services/src/main/java/org/chorem/pollen/services/bean/UserCredentialBean.java index d88f3444..85b44ae1 100644 --- a/pollen-services/src/main/java/org/chorem/pollen/services/bean/UserCredentialBean.java +++ b/pollen-services/src/main/java/org/chorem/pollen/services/bean/UserCredentialBean.java @@ -10,6 +10,7 @@ public class UserCredentialBean extends PollenBean<UserCredential> { protected String provider; protected String userName; + protected String emailAddress; protected UserCredentialBean() { super(UserCredential.class); @@ -20,6 +21,7 @@ public class UserCredentialBean extends PollenBean<UserCredential> { setEntityId(entity.getTopiaId()); setProvider(entity.getProvider()); setUserName(entity.getUserName()); + setEmailAddress(entity.getEmail()); } @Override @@ -28,6 +30,7 @@ public class UserCredentialBean extends PollenBean<UserCredential> { entity.setTopiaId(getEntityId()); entity.setProvider(getProvider()); entity.setUserName(getUserName()); + entity.setEmail(getEmailAddress()); return entity; } @@ -46,4 +49,12 @@ public class UserCredentialBean extends PollenBean<UserCredential> { public void setUserName(String userName) { this.userName = userName; } + + public String getEmailAddress() { + return emailAddress; + } + + public void setEmailAddress(String emailAddress) { + this.emailAddress = emailAddress; + } } diff --git a/pollen-ui-riot-js/src/main/web/css/custom.css b/pollen-ui-riot-js/src/main/web/css/custom.css index 5dd7b38c..dbbd4d85 100644 --- a/pollen-ui-riot-js/src/main/web/css/custom.css +++ b/pollen-ui-riot-js/src/main/web/css/custom.css @@ -93,4 +93,6 @@ --report: rgba(0,0,0,0.05); --report-hover: #04c4bb; + + --list-alternate-row: #f3f3f3; } diff --git a/pollen-ui-riot-js/src/main/web/tag/UserProfile.tag.html b/pollen-ui-riot-js/src/main/web/tag/UserProfile.tag.html index d036bbe2..3f30abfd 100644 --- a/pollen-ui-riot-js/src/main/web/tag/UserProfile.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/UserProfile.tag.html @@ -59,28 +59,6 @@ require("./components/HumanInput.tag.html"); {__.saveIdentity} </button> </div> - - <div> - <div each="{credential in user.credentials}" class="credential"> - <i if="{authService.providerIcons[credential.provider]}" - class="fa fa-{authService.providerIcons[credential.provider]}"></i> - <span if="{!authService.providerIcons[credential.provider]}">{credential.userName}</span> - <span>{credential.userName}</span> - <a if="{user.withPassword && user.email || user.credentials.length > 1}" - onclick="{unlinkProvider(credential.id)}">X</a> - </div> - </div> - - <div class="o-form-element align-center" if="{loginProviders.length > 0}"> - <p>{__.linkProvider}</p> - <p> - <a each="{loginProvider in loginProviders}" class="provider-link" - onclick="{linkProvider(loginProvider)}"> - <i class="fa fa-{authService.providerIcons[loginProvider]}" if="{authService.providerIcons[loginProvider]}"></i> - <span if="{!authService.providerIcons[loginProvider]}">{loginProvider}</span> - </a> - </p> - </div> </form> <form ref="password-form" class="password-form"> @@ -142,6 +120,32 @@ require("./components/HumanInput.tag.html"); </button> </div> </form> + + <div class="providers"> + <h3 class="c-heading"><i class="fa fa-sign-in"/> {__.loginProviders}</h3> + <div class="user-credentials"> + <div each="{credential, index in user.credentials}" class="user-credential {index % 2 == 0 ? 'even' : 'odd'}"> + <i if="{authService.providerIcons[credential.provider]}" + class="fa fa-{authService.providerIcons[credential.provider]}"></i> + <span if="{!authService.providerIcons[credential.provider]}">{credential.userName}</span> + <span class="credential-name">{credential.userName} <em if="{credential.emailAddress}">({credential.emailAddress})</em></span> + <button if="{user.withPassword && user.email || user.credentials.length > 1}" + onclick="{unlinkProvider(credential.id)}" class="c-button u-small c-button--error"><i class="fa fa-trash"></i></button> + </div> + </div> + + <div class="o-form-element align-center" if="{loginProviders.length > 0}"> + <p>{__.linkProvider}</p> + <p> + <a each="{loginProvider in loginProviders}" class="provider-link" + onclick="{linkProvider(loginProvider)}"> + <i class="fa fa-{authService.providerIcons[loginProvider]}" if="{authService.providerIcons[loginProvider]}"></i> + <span if="{!authService.providerIcons[loginProvider]}">{loginProvider}</span> + </a> + </p> + </div> + </div> + </div> </div> @@ -250,8 +254,29 @@ require("./components/HumanInput.tag.html"); padding: 0 5px; } - .credential { - font-size: 1.5em; + .providers { + padding: 0 10px; + } + + .user-credentials { + width: 100%; + } + + .user-credential { + display: flex; + justify-content: space-around; + align-items: center; + margin: 1px 0; + padding: 1px 5px; + } + + .user-credential.odd { + background-color: var(--list-alternate-row); + } + + .credential-name { + flex-grow: 1; + padding: 0 5px; } .provider-link { -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.