To receive notifications about scheduled maintenance, please subscribe to the mailing-list gitlab-operations@sympa.ethz.ch. You can subscribe to the mailing-list at https://sympa.ethz.ch

Commit baad51b4 authored by Sandro Lutz's avatar Sandro Lutz Committed by Sandro Lutz
Browse files

Improve event signup view

parent 1fd24197
......@@ -190,6 +190,7 @@ export default {
blacklisted: 'Du kannst dich im Moment nicht anmelden, da du auf der Blacklist bist.',
waitingList: 'Du bist auf der Warteliste.',
accepted: 'Du bist angemeldet und hast einen Platz.',
noAdditionalInfoRequired: 'Keine Zusatzinformationen erforderlich.',
},
signoff: {
action: 'abmelden',
......
......@@ -189,6 +189,7 @@ export default {
blacklisted: 'You cannot register for this event because you are on the blacklist.',
waitingList: 'You are on the waiting list.',
accepted: 'You are signed up and got a spot.',
noAdditionalInfoRequired: 'No additional information required.',
},
signoff: {
action: 'signoff',
......
......@@ -59,6 +59,10 @@
position: relative;
margin: 2em 1em .5em;
.infobox,.message {
margin-bottom: 1.5em;
}
> p {
position: absolute;
top: 50%;
......
......@@ -19,6 +19,7 @@ export default class EventDetails {
this.signupFetchError = false;
this.event = vnode.attrs.event;
this.notification = null;
this.emailValid = true;
this.signupBusy = false;
this.signoffBusy = false;
this.schema = !this.event.additional_fields
......@@ -152,7 +153,10 @@ export default class EventDetails {
eventSignupForm = this._renderSignupForm(signupFormOptions);
eventSignupButtons = this._renderSignupButtons(signupFormOptions);
} else {
eventSignupForm = m('div', [m('span', `${i18n('events.restrictions.membersOnly')} `)]);
eventSignupForm = m(
'div.message',
m('span', `${i18n('events.restrictions.membersOnly')} `)
);
eventSignupButtons = m(Button, {
label: i18n('login'),
className: 'blue-flat-button',
......@@ -161,7 +165,7 @@ export default class EventDetails {
}
this._renderParticipationNotice();
} else {
eventSignupForm = m('div', m('p', i18n('events.registration.over')));
eventSignupForm = m('div.message', m('p', i18n('events.registration.over')));
this._renderParticipationNotice();
}
} else {
......@@ -203,7 +207,13 @@ export default class EventDetails {
return m('div.event-details', { className: noSignup ? 'no-signup' : null }, [
m('p', m.trust(marked(escape(this.event.getDescription())))),
!noSignup && m('div.separator'),
!noSignup && m('div.form', [notification, eventSignupForm]),
!noSignup &&
m(
'div.form',
notification || eventSignupForm
? [notification, eventSignupForm]
: m('div.message', [m('span', `${i18n('events.signup.noAdditionalInfoRequired')} `)])
),
m(ActionBar, {
className: 'event-actions',
left: eventSignupButtons,
......@@ -238,7 +248,7 @@ export default class EventDetails {
elements.push(this._renderEmailField());
}
return m('form', { onsubmit: () => false }, elements);
return elements.length > 0 ? m('form', { onsubmit: () => false }, elements) : null;
}
_renderSignupButtons({ canChangeSignup = false, hasSignupData = false, signoffButton = false }) {
......@@ -252,14 +262,12 @@ export default class EventDetails {
}
_renderSignupButton(label) {
// TODO: evaluate email field validity!
// Waiting for MR to be accepted in web-ui-components repository.
return m(Button, {
name: 'signup',
className: 'blue-flat-button',
border: true,
label,
active: this.form.valid && !this.signupBusy,
active: this.emailValid && this.form.valid && !this.signupBusy,
events: {
onclick: () => this.signup(),
},
......@@ -273,8 +281,9 @@ export default class EventDetails {
validateOnInput: true,
floatingLabel: true,
type: 'email',
onChange: ({ value }) => {
onChange: ({ value, invalid }) => {
this.email = value;
this.emailValid = !invalid;
},
value: this.email,
});
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment