This is an automated email from the git hooks/post-receive script. New commit to branch feature/44_several_email_address in repository pollen. See https://gitlab.nuiton.org/chorem/pollen.git commit ca0eeef88116a1851487cd75a54c0c5b22214d88 Author: Kevin Morin <morin@codelutin.com> Date: Mon Oct 16 11:01:59 2017 +0200 refs #44 gestion des adresses email par l'admin --- pollen-ui-riot-js/src/main/web/css/main.css | 8 ++ pollen-ui-riot-js/src/main/web/i18n/en.json | 21 ++-- pollen-ui-riot-js/src/main/web/i18n/fr.json | 19 +-- pollen-ui-riot-js/src/main/web/js/AuthService.js | 4 + pollen-ui-riot-js/src/main/web/js/UserService.js | 30 ++++- .../src/main/web/tag/PollenHeader.tag.html | 4 +- .../src/main/web/tag/UserProfile.tag.html | 93 +------------- .../src/main/web/tag/admin/UserCard.tag.html | 7 +- .../src/main/web/tag/admin/UserEditModal.tag.html | 129 +++++++++---------- .../src/main/web/tag/components/Card.tag.html | 8 +- .../tag/components/UserEmailAddressList.tag.html | 139 +++++++++++++++++++++ .../main/web/tag/popup/InformationPopup.tag.html | 2 +- .../src/main/web/tag/popup/Modal.tag.html | 2 +- 13 files changed, 269 insertions(+), 197 deletions(-) diff --git a/pollen-ui-riot-js/src/main/web/css/main.css b/pollen-ui-riot-js/src/main/web/css/main.css index 160fbb50..41769f89 100644 --- a/pollen-ui-riot-js/src/main/web/css/main.css +++ b/pollen-ui-riot-js/src/main/web/css/main.css @@ -483,3 +483,11 @@ pollenfooter a:hover { .italic { font-style: italic; } + +.u-higher { + z-index: 50; +} + +.u-highest { + z-index: 100; +} \ No newline at end of file diff --git a/pollen-ui-riot-js/src/main/web/i18n/en.json b/pollen-ui-riot-js/src/main/web/i18n/en.json index 0a685c86..e7e10a0c 100644 --- a/pollen-ui-riot-js/src/main/web/i18n/en.json +++ b/pollen-ui-riot-js/src/main/web/i18n/en.json @@ -414,16 +414,6 @@ "userProfile_updatedIdentity": "Your identity has been updated", "userProfile_name": "Name", "userProfile_name_placeholder": "Enter your user name", - "userProfile_email": "Email address", - "userProfile_emails": "Email addresses", - "userProfile_defaultEmailAddress": "Set as default email address", - "userProfile_email_placeholder": "Enter your email address", - "userProfile_emailValidate": "Validate", - "userProfile_resendValidation": "Send a new validation email", - "userProfile_validationResent": "An email has been sent to {0}", - "userProfile_addEmailAddress": "Add a new email address", - "userProfile_deleteEmailAddress": "Delete the email address", - "userProfile_deleteEmailAddressMessage": "Delete the email address {0}?", "userProfile_passwordChange": "Password change", "userProfile_oldPassword": "Old password", "userProfile_oldPassword_placeholder": "Enter your old password", @@ -619,5 +609,14 @@ "gtu_validation_after" : "", "gtu_change_title": "CGU has change", "gtu_change_action": "Accept", - "privacy_title": "Privacy policy" + "privacy_title": "Privacy policy", + "emailAddressList_emailAddresses": "Email addresses", + "emailAddressList_resendValidation": "Send a new validation email", + "emailAddressList_validationResent": "An email has been sent to {0}", + "emailAddressList_validate": "Validate this email address", + "emailAddressList_defaultEmailAddress": "Set as default email address", + "emailAddressList_deleteEmailAddress": "Delete the email address", + "emailAddressList_deleteEmailAddressMessage": "Delete the email address {0}?", + "emailAddressList_newAddressPlaceholder": "Enter a new email address", + "emailAddressList_addEmailAddress": "Add a new email address" } diff --git a/pollen-ui-riot-js/src/main/web/i18n/fr.json b/pollen-ui-riot-js/src/main/web/i18n/fr.json index 60d7782e..e0483962 100644 --- a/pollen-ui-riot-js/src/main/web/i18n/fr.json +++ b/pollen-ui-riot-js/src/main/web/i18n/fr.json @@ -415,14 +415,6 @@ "userProfile_saveIdentity": "Enregistrer", "userProfile_updatedIdentity": "Votre identité a été mise à jour", "userProfile_email": "Adresse électronique", - "userProfile_emails": "Adresses électroniques", - "userProfile_defaultEmailAddress": "Définir comme adresse par défaut", - "userProfile_email_placeholder": "Entrez votre adresse électronique", - "userProfile_resendValidation": "Envoyer un nouveau courriel de validation de l'adresse électronique", - "userProfile_validationResent": "Un courriel a été envoyé à l'adresse {0}", - "userProfile_addEmailAddress": "Ajouter une adresse électronique", - "userProfile_deleteEmailAddress": "Supprimer l'adresse électronique", - "userProfile_deleteEmailAddressMessage": "Supprimer l'adresse électronique {0} ?", "userProfile_passwordChange": "Changement de mot de passe", "userProfile_oldPassword": "Ancien mot de passe", "userProfile_oldPassword_placeholder": "Entrez votre ancien mot de passe", @@ -619,5 +611,14 @@ "gtu_validation_after" : "", "gtu_change_title": "Changement des CGU", "gtu_change_action": "Accepter", - "privacy_title": "Politique de confidentialité" + "privacy_title": "Politique de confidentialité", + "emailAddressList_emailAddresses": "Adresses électroniques", + "emailAddressList_resendValidation": "Envoyer un nouveau courriel de validation de l'adresse électronique", + "emailAddressList_validationResent": "Un courriel a été envoyé à l'adresse {0}", + "emailAddressList_validate": "Valider cette adresse électronique", + "emailAddressList_defaultEmailAddress": "Définir comme adresse par défaut", + "emailAddressList_deleteEmailAddress": "Supprimer l'adresse électronique", + "emailAddressList_deleteEmailAddressMessage": "Supprimer l'adresse électronique {0} ?", + "emailAddressList_newAddressPlaceholder": "Entrez une nouvelle adresse électronique", + "emailAddressList_addEmailAddress": "Ajouter une adresse électronique" } diff --git a/pollen-ui-riot-js/src/main/web/js/AuthService.js b/pollen-ui-riot-js/src/main/web/js/AuthService.js index 7fd0dbd5..5fcc60f9 100644 --- a/pollen-ui-riot-js/src/main/web/js/AuthService.js +++ b/pollen-ui-riot-js/src/main/web/js/AuthService.js @@ -75,6 +75,10 @@ class AuthService extends FetchService { return this.put("/v1/users/" + userId + "?token=" + token); } + validateEmailByAdmin(userId, emailAddressId) { + return this.put("/v1/users/" + userId + "/email/" + emailAddressId); + } + newPassword(email) { return this.post("/v1/lostpassword", email); } diff --git a/pollen-ui-riot-js/src/main/web/js/UserService.js b/pollen-ui-riot-js/src/main/web/js/UserService.js index aed9818d..317a9df9 100644 --- a/pollen-ui-riot-js/src/main/web/js/UserService.js +++ b/pollen-ui-riot-js/src/main/web/js/UserService.js @@ -57,18 +57,36 @@ class UserService extends FetchService { return this.post(url, user); } - addEmailAddressToUser(emailAddress) { - let url = this._getUserUrlPrefix() + "/email"; + addEmailAddressToUser(emailAddress, userId) { + let url; + if (userId) { + url = this._getUsersUrlPrefix(userId); + } else { + url = this._getUserUrlPrefix(); + } + url += "/email"; return this.post(url, emailAddress); } - deleteEmailAddress(emailAddressId) { - let url = this._getUserUrlPrefix() + "/email/" + emailAddressId; + deleteEmailAddress(emailAddressId, userId) { + let url; + if (userId) { + url = this._getUsersUrlPrefix(userId); + } else { + url = this._getUserUrlPrefix(); + } + url += "/email/" + emailAddressId; return this.doDelete(url); } - setDefaultEmailAddress(emailAddressId) { - let url = this._getUserUrlPrefix() + "/email/default?emailAddressId=" + emailAddressId; + setDefaultEmailAddress(emailAddressId, userId) { + let url; + if (userId) { + url = this._getUsersUrlPrefix(userId); + } else { + url = this._getUserUrlPrefix(); + } + url += "/email/default?emailAddressId=" + emailAddressId; return this.put(url); } diff --git a/pollen-ui-riot-js/src/main/web/tag/PollenHeader.tag.html b/pollen-ui-riot-js/src/main/web/tag/PollenHeader.tag.html index 5a0c56d2..7b97d6f4 100644 --- a/pollen-ui-riot-js/src/main/web/tag/PollenHeader.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/PollenHeader.tag.html @@ -167,8 +167,8 @@ require("./components/Avatar.tag.html"); } pollenheader .user-avatar { - width: 45px; - height: 45px; + width: 40px; + height: 40px; font-size: 1.5em; } 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 512ae8cc..d9419472 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 @@ -60,58 +60,7 @@ require("./components/Avatar.tag.html"); </div> </form> - <div class="email-addresses"> - <h3 class="c-heading"><i class="fa fa-at"/> {__.emails}</h3> - <div each="{emailAddress, index in user.emailAddresses}" class="email-address {index % 2 == 0 ? 'even' : 'odd'}"> - <span class="email-address-label {validation-pending : !emailAddress.validated} {default-address : user.defaultEmailAddress.id === emailAddress.id}"> - {emailAddress.emailAddress} - </span> - <button type="button" - class="c-button u-small c-button--gost-info" - if={!emailAddress.validated} - title="{__.resendValidation}" - onclick={resendValidation(emailAddress.emailAddress)}> - <i class="fa fa-paper-plane" aria-hidden="true"></i> - </button> - <button if="{user.defaultEmailAddress.id !== emailAddress.id && emailAddress.validated}" - class="c-button u-small c-button--info" - title="{__.defaultEmailAddress}" - onclick="{setDefaultEmailAddress(emailAddress.id)}"> - <i class="fa fa-envelope"></i> - </button> - <button disabled="{user.defaultEmailAddress.id === emailAddress.id}" - class="c-button u-small c-button--error" - title="{__.deleteEmailAddress}" - onclick="{deleteEmailAddress(emailAddress.id, index)}"> - <i class="fa fa-trash"></i> - </button> - </div> - </div> - - <form ref="new-email-form" class="new-email-form"> - <HumanInput onsubmit={submitEmailAddress}/> - <div class="o-form-element c-input-group"> - <div class="o-field o-field--icon-right"> - <input class="c-field {c-field--error : errors.email}" - type="email" - name="email" - ref="newEmailAddress" - placeholder="{__.email_placeholder}" - required - maxlength="255"> - </div> - <button type="submit" - class="c-button c-button--success" - title="{__.addEmailAddress}"> - <i class="fa fa-plus" aria-hidden="true"></i> - </button> - </div> - <div if="{errors.email}" - class="c-hint--static c-hint--error"> - {errors.email} - </div> - </form> - + <UserEmailAddressList class="email-addresses" user="{user}" admin="{false}"/> </div> <form ref="password-form" class="password-form column-content"> @@ -276,46 +225,6 @@ require("./components/Avatar.tag.html"); }); }; - this.resendValidation = (emailAddress) => () => { - this.authService.resendValidation(emailAddress).then(() => { - this.bus.trigger("message", new Message(this._l("validationResent", emailAddress), "success")); - }); - }; - - this.deleteEmailAddress = (emailAddressId, index) => () => { - this.confirm(this._l("deleteEmailAddressMessage", this.user.emailAddresses[index].emailAddress)).then((confirm) => { - if (!confirm) { - return Promise.reject(); - } - return userService.deleteEmailAddress(emailAddressId); - }).then(result => { - this.user.emailAddresses.splice(index, 1); - this.session.updateUser(); - }); - }; - - this.setDefaultEmailAddress = (emailAddressId, index) => () => { - userService.setDefaultEmailAddress(emailAddressId).then(() => { - this.user.defaultEmailAddress = this.user.emailAddresses[index]; - this.session.updateUser(); - }); - }; - - this.submitEmailAddress = e => { - e.preventDefault(); - e.stopPropagation(); - let emailAddress = this.refs.newEmailAddress.value; - userService.addEmailAddressToUser(emailAddress).then((result) => { - this.user.emailAddresses.push({id: result.id, emailAddress: emailAddress, validated: false}); - this.refs.newEmailAddress.value = null; - this.update(); - this.session.updateUser(); - }).catch((e) => { - this.errors.email = e.email; - this.update(); - }); - } - this.checkPassword = () => { var password = this.refs.newPassword.value; var repeatPassword = this.refs.repeatPassword.value; diff --git a/pollen-ui-riot-js/src/main/web/tag/admin/UserCard.tag.html b/pollen-ui-riot-js/src/main/web/tag/admin/UserCard.tag.html index 72e1b301..76e8a22b 100644 --- a/pollen-ui-riot-js/src/main/web/tag/admin/UserCard.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/admin/UserCard.tag.html @@ -22,7 +22,8 @@ require("../components/Card.tag.html"); require("./UserEditModal.tag.html"); <UserCard> - <Card name={opts.user.name} + <Card avatar={opts.user.avatar} + name={opts.user.name} ondelete={delete} onedit={edit} class="user-card"> @@ -36,9 +37,9 @@ require("./UserEditModal.tag.html"); class="premium fa fa-star-o" aria-hidden="true" title={parent.__.premiumOf + ' ' + parent.formatDate(parent.opts.user.premiumTo, 'LL')}></i> - <div class="user-email"> + <div class="user-email" if="{parent.opts.user.defaultEmailAddress}"> <i class="fa fa-refresh" if={!parent.opts.user.emailIsValidate} title={parent.__.emailValidate}></i> - {parent.opts.user.email} + {parent.opts.user.defaultEmailAddress.emailAddress} </div> <div class="user-badges"> <span class="c-badge c-badge--rounded c-badge--success" diff --git a/pollen-ui-riot-js/src/main/web/tag/admin/UserEditModal.tag.html b/pollen-ui-riot-js/src/main/web/tag/admin/UserEditModal.tag.html index e8ccf5d2..768e1b66 100644 --- a/pollen-ui-riot-js/src/main/web/tag/admin/UserEditModal.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/admin/UserEditModal.tag.html @@ -19,6 +19,7 @@ #L% --> require("../popup/Modal.tag.html"); +require("../components/UserEmailAddressList.tag.html"); <UserEditModal> <Modal ref="modal" @@ -26,75 +27,55 @@ require("../popup/Modal.tag.html"); label={__.save} type="success" onsubmit={save}> - <div class="o-form-element"> - <label class="c-label" for="name">{parent.__.name}</label> - <input type="text" - id="name" - ref="name" - class="c-field" - value={parent.opts.user.name} - maxlength="255"> - </div> - <div class="o-form-element"> - <label class="c-label" for="name">{parent.__.email}</label> - <input type="email" - id="email" - ref="email" - required - class="c-field {c-field--error: parent.errors.email}" - value={parent.opts.user.email} - maxlength="255"> - <div class="c-hint c-hint--static c-hint--error" each={error in parent.errors.email}>{error}</div> - </div> - <div class="o-form-element"> - <label class="c-label" for="premiumTo">{parent.__.premiumTo}</label> - <date-picker class="o-field o-field--icon-left" - inputclass="c-field o-field--icon-left" - iconleftclass="calendar" - id="premiumTo" - ref="premiumTo" - date="{parent.premiumTo}"> - </date-picker> - <div class="c-hint c-hint--static c-hint--error" each={error in parent.errors.premiumTo}>{error}</div> - </div> - <div class="o-form-element"> - <label class="c-toggle c-toggle--info"> - {parent.__.administrator} - <input type="checkbox" - id="administrator" - ref="administrator" - checked={parent.opts.user.administrator}> - <div class="c-toggle__track"> - <div class="c-toggle__handle"></div> - </div> - </label> - </div> - <div class="o-form-element"> - <label class="c-toggle c-toggle--info"> - {parent.__.banned} - <input type="checkbox" - id="banned" - ref="banned" - checked={parent.opts.user.banned}> - <div class="c-toggle__track"> - <div class="c-toggle__handle"></div> - </div> - </label> - </div> - <div class="o-form-element"> - <label class="c-toggle c-toggle--info"> - {parent.__.emailIsValidate} - <input type="checkbox" - id="emailIsValidate" - ref="emailIsValidate" - disabled={parent.opts.user.emailIsValidate} - checked={parent.opts.user.emailIsValidate}> - <div class="c-toggle__track"> - <div class="c-toggle__handle"></div> - </div> - </label> - </div> - + <div class="modal-content"> + <div class="column"> + <div class="o-form-element"> + <label class="c-label" for="name">{parent.__.name}</label> + <input type="text" + id="name" + ref="name" + class="c-field" + value={parent.opts.user.name} + maxlength="255"> + </div> + <div class="o-form-element"> + <label class="c-label" for="premiumTo">{parent.__.premiumTo}</label> + <date-picker class="o-field o-field--icon-left" + inputclass="c-field o-field--icon-left" + iconleftclass="calendar" + id="premiumTo" + ref="premiumTo" + date="{parent.premiumTo}"> + </date-picker> + <div class="c-hint c-hint--static c-hint--error" each={error in parent.errors.premiumTo}>{error}</div> + </div> + <div class="o-form-element"> + <label class="c-toggle c-toggle--info"> + {parent.__.administrator} + <input type="checkbox" + id="administrator" + ref="administrator" + checked={parent.opts.user.administrator}> + <div class="c-toggle__track"> + <div class="c-toggle__handle"></div> + </div> + </label> + </div> + <div class="o-form-element"> + <label class="c-toggle c-toggle--info"> + {parent.__.banned} + <input type="checkbox" + id="banned" + ref="banned" + checked={parent.opts.user.banned}> + <div class="c-toggle__track"> + <div class="c-toggle__handle"></div> + </div> + </label> + </div> + </div> + <UserEmailAddressList class="column" user="{parent.opts.user}" admin="{true}"/> + </div> </Modal> <script type="es6"> @@ -102,6 +83,7 @@ require("../popup/Modal.tag.html"); let Message = require("../../js/Message"); this.installBundle(session, "user"); let userService = require("../../js/UserService"); + let authService = require("../../js/AuthService"); let moment = require("moment-timezone"); this.errors = {}; @@ -133,6 +115,15 @@ require("../popup/Modal.tag.html"); </script> <style> + .modal-content { + display: flex; + flex-direction: row; + } + + .modal-content .column { + padding: 10px; + } + date-picker { display: inherit; } diff --git a/pollen-ui-riot-js/src/main/web/tag/components/Card.tag.html b/pollen-ui-riot-js/src/main/web/tag/components/Card.tag.html index 9ff6888b..bad435f3 100644 --- a/pollen-ui-riot-js/src/main/web/tag/components/Card.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/components/Card.tag.html @@ -18,7 +18,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>. #L% --> -require("./LetterAvatar.tag.html"); +require("./Avatar.tag.html"); <Card> <div class="card-actions"> @@ -38,11 +38,11 @@ require("./LetterAvatar.tag.html"); <div class="card-content"> <div if={!opts.href && !opts.onletterclick} class="card-avatar"> - <LetterAvatar name={opts.name} rounded="true"/> + <Avatar avatar={opts.avatar} name={opts.name} rounded="true"/> </div> <a if={opts.href || opts.onletterclick} href={opts.href} onclick={opts.onletterclick} class="card-avatar"> - <LetterAvatar name={opts.name} rounded="true"/> + <Avatar avatar={opts.avatar} name={opts.name} rounded="true"/> </a> <div class="card-name" title={opts.name}> @@ -92,6 +92,8 @@ require("./LetterAvatar.tag.html"); .card-avatar { margin: 5px 0; font-size: 3em; + width: 2.1em; + height: 2.1em; } .card-name { diff --git a/pollen-ui-riot-js/src/main/web/tag/components/UserEmailAddressList.tag.html b/pollen-ui-riot-js/src/main/web/tag/components/UserEmailAddressList.tag.html new file mode 100644 index 00000000..f49ea357 --- /dev/null +++ b/pollen-ui-riot-js/src/main/web/tag/components/UserEmailAddressList.tag.html @@ -0,0 +1,139 @@ +<UserEmailAddressList> + <h3 class="c-heading"><i class="fa fa-at"/> {__.emailAddresses}</h3> + <div each="{emailAddress, index in opts.user.emailAddresses}" class="email-address {index % 2 == 0 ? 'even' : 'odd'}"> + <span class="email-address-label {validation-pending : !emailAddress.validated} {default-address : parent.opts.user.defaultEmailAddress.id === emailAddress.id}"> + {emailAddress.emailAddress} + </span> + <button type="button" + class="c-button u-small" + if={!emailAddress.validated} + title="{parent.__.resendValidation}" + onclick={parent.resendValidation(emailAddress.emailAddress)}> + <i class="fa fa-paper-plane" aria-hidden="true"></i> + </button> + <button type="button" + class="c-button u-small c-button--success" + if={!emailAddress.validated && parent.opts.admin} + title="{parent.__.validate}" + onclick={validate(emailAddress.id, index)}> + <i class="fa fa-check" aria-hidden="true"></i> + </button> + <button if="{parent.opts.user.defaultEmailAddress.id !== emailAddress.id && emailAddress.validated}" + type="button" class="c-button u-small c-button--info" + title="{parent.__.defaultEmailAddress}" + onclick="{parent.setDefaultEmailAddress(emailAddress.id, index)}"> + <i class="fa fa-envelope"></i> + </button> + <button disabled="{parent.opts.user.defaultEmailAddress.id === emailAddress.id}" + type="button" class="c-button u-small c-button--error" + title="{parent.__.deleteEmailAddress}" + onclick="{parent.deleteEmailAddress(emailAddress.id, index)}"> + <i class="fa fa-trash"></i> + </button> + </div> + <div ref="new-email-form" class="new-email-form"> + <div class="o-form-element c-input-group"> + <div class="o-field o-field--icon-right"> + <input class="c-field {c-field--error : errors.email}" + type="email" + name="email" + ref="newEmailAddress" + placeholder="{__.newAddressPlaceholder}"> + </div> + <button type="button" class="c-button c-button--success" + title="{__.addEmailAddress}" + onclick="{submitEmailAddress}"> + <i class="fa fa-plus" aria-hidden="true"></i> + </button> + </div> + <div if="{errors.email}" + class="c-hint--static c-hint--error"> + {errors.email} + </div> + </div> + + <script> + let session = require("../../js/Session"); + let Message = require("../../js/Message"); + this.installBundle(session, "emailAddressList"); + let userService = require("../../js/UserService"); + let authService = require("../../js/AuthService"); + + this.errors = {}; + + this.resendValidation = (emailAddress) => () => { + authService.resendValidation(emailAddress).then(() => { + this.bus.trigger("message", new Message(this._l("validationResent", emailAddress), "success")); + }); + }; + + this.validate = (emailAddressId, index) => () => { + authService.validateEmailByAdmin(this.opts.user.id, emailAddressId).then(() => { + this.opts.user.emailAddresses[index].validated = true; + this.update(); + }); + }; + + this.deleteEmailAddress = (emailAddressId, index) => () => { + this.confirm(this._l("deleteEmailAddressMessage", this.opts.user.emailAddresses[index].emailAddress)).then((confirm) => { + if (!confirm) { + return Promise.reject(); + } + return userService.deleteEmailAddress(emailAddressId, this.opts.admin ? this.opts.user.id : null) + }).then(result => { + this.opts.user.emailAddresses.splice(index, 1); + this.update(); + }); + }; + + this.setDefaultEmailAddress = (emailAddressId, index) => () => { + userService.setDefaultEmailAddress(emailAddressId, this.opts.admin ? this.opts.user.id : null).then(() => { + this.opts.user.defaultEmailAddress = this.opts.user.emailAddresses[index]; + this.update(); + }); + }; + + this.submitEmailAddress = e => { + let emailAddress = this.refs.newEmailAddress.value; + userService.addEmailAddressToUser(emailAddress, this.opts.admin ? this.opts.user.id : null).then((result) => { + this.opts.user.emailAddresses.push({id: result.id, emailAddress: emailAddress, validated: false}); + this.refs.newEmailAddress.value = null; + this.update(); + }).catch((e) => { + this.errors.email = e.email; + this.update(); + }); + }; + + </script> + + <style> + + .email-address { + display: flex; + justify-content: space-around; + align-items: center; + margin: 1px 0; + padding: 1px 5px; + } + + .email-address.odd { + background-color: var(--list-alternate-row); + } + + .email-address-label { + flex-grow: 1; + padding: 0 5px; + } + + .email-address-label.default-address { + font-weight: bold; + } + + .email-address-label.validation-pending { + font-style: italic; + opacity: 0.7; + } + + </style> +</UserEmailAddressList> \ No newline at end of file diff --git a/pollen-ui-riot-js/src/main/web/tag/popup/InformationPopup.tag.html b/pollen-ui-riot-js/src/main/web/tag/popup/InformationPopup.tag.html index 186abec8..906426f9 100644 --- a/pollen-ui-riot-js/src/main/web/tag/popup/InformationPopup.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/popup/InformationPopup.tag.html @@ -21,7 +21,7 @@ <InformationPopup show={openModal}> <div class="c-overlay"></div> - <div class="o-modal u-highest"> + <div class="o-modal u-higher"> <div class="c-card c-card--higher"> <header class="c-card__header"> <h2 class="c-heading"> diff --git a/pollen-ui-riot-js/src/main/web/tag/popup/Modal.tag.html b/pollen-ui-riot-js/src/main/web/tag/popup/Modal.tag.html index c93f18af..d83f0c52 100644 --- a/pollen-ui-riot-js/src/main/web/tag/popup/Modal.tag.html +++ b/pollen-ui-riot-js/src/main/web/tag/popup/Modal.tag.html @@ -22,7 +22,7 @@ require("../components/HumanInput.tag.html"); <modal show={openModal}> <div class="c-overlay"></div> - <div class="o-modal u-highest"> + <div class="o-modal u-higher"> <form class="c-card c-card--higher"> <HumanInput onsubmit={submit}/> <header class="c-card__header"> -- To stop receiving notification emails like this one, please contact chorem.org SCM administrator <admin+scm@chorem.org>.