Commit 658eaf3c authored by Sandro Lutz's avatar Sandro Lutz Committed by lic
Browse files

Use input components on profile page / studydocs upload form

parent 50102d42
......@@ -63,11 +63,14 @@
"profile.change_password": "Passwort ändern",
"profile.revert_to_ldap": "Zu LDAP zurückkehren",
"profile.set_password": "Passwort setzen",
"profile.password_requirements": "Anforderungen: min. 8 Zeichen, Gross-, Kleinbuchstaben und Zahlen.",
"profile.password_requirements": "Mindestens 8 Zeichen erforderlich.",
"profile.old_password": "Altes Passwort",
"profile.old_password_error": "Passwort ist falsch.",
"profile.new_password": "Neues Passwort",
"profile.repeat_password": "Wiederholen",
"profile.passwords_not_equal": "Passwörter stimmen nicht überein.",
"profile.rfid": "RFID",
"profile.rfid_error": "6 Ziffern erforderlich. Siehe auf der Rückseite deiner Legi.",
"profile.newsletter_unsubscribe": "Vom Newsletter abmelden",
"profile.newsletter_subscribe": "Newsletter abonnieren",
"profile.search_groups": "Gruppen durchsuchen",
......@@ -87,12 +90,14 @@
"studydocs.semester5+": "5+ Semester",
"studydocs.lecture": "Vorlesung",
"studydocs.lectures_all": "Alle Vorlesungen",
"studydocs.no_department": "Kein Departement",
"studydocs.department": "Departement",
"studydocs.type": "Typ",
"studydocs.title": "Titel",
"studydocs.professor": "Professor",
"studydocs.author": "Author",
"studydocs.semester": "Semester",
"studydocs.no_semester": "Kein Semester",
"studydocs.course_year": "Kursjahr",
"studydocs.files": "Dateien",
"studydocs.upload": "Dokument(e) hochladen",
......
......@@ -63,11 +63,14 @@
"profile.change_password": "Change password",
"profile.revert_to_ldap": "Revert to LDAP",
"profile.set_password": "Set password",
"profile.password_requirements": "Requirements: min 8 characters, upper and lower case letters and numbers",
"profile.password_requirements": "At least 8 characters required.",
"profile.old_password": "Old Password",
"profile.old_password_error": "Password is incorrect.",
"profile.new_password": "New Password",
"profile.repeat_password": "Repeat",
"profile.passwords_not_equal": "Passwords do not match.",
"profile.rfid": "RFID",
"profile.rfid_error": "6 digits required. See on the back of your legi.",
"profile.newsletter_unsubscribe": "Unsubscribe from Newsletter",
"profile.newsletter_subscribe": "subscribe to Newsletter",
"profile.search_groups": "Search groups",
......@@ -87,12 +90,14 @@
"studydocs.semester5+": "5+ semester",
"studydocs.lecture": "Lecture",
"studydocs.lectures_all": "All lectures",
"studydocs.no_department": "No department",
"studydocs.department": "Department",
"studydocs.type": "Type",
"studydocs.title": "Title",
"studydocs.professor": "Professor",
"studydocs.author": "Author",
"studydocs.semester": "Semester",
"studydocs.no_semester": "No semester",
"studydocs.course_year": "Course Year",
"studydocs.files": "Files",
"studydocs.upload": "Upload study document(s)",
......
import m from 'mithril';
import { apiUrl } from 'config';
import { log } from '../models/log';
import { error } from '../models/log';
import * as user from '../models/user';
import * as groups from '../models/groups';
import { Button, InputGroupForm } from '../components';
// import { Button, InputGroupForm } from '../components';
import { Button, TextField } from '../components';
import { i18n } from '../models/language';
// shows all relevant user information
......@@ -35,6 +36,9 @@ class changePasswordForm {
this.password_old = '';
this.password1 = '';
this.password2 = '';
this.password_old_valid = true;
this.password1_valid = false;
this.password2_valid = true;
}
static _createSession(password) {
......@@ -73,10 +77,11 @@ class changePasswordForm {
} catch ({ _error: { code } }) {
// TODO: show error message
if (code === 401) {
log('Authentication failed.');
error('Authentication failed.');
} else {
log(`An error occurred: ${code}`);
error(`An error occurred: ${code}`);
}
this.password_old_valid = false;
}
this.busy = false;
......@@ -84,32 +89,13 @@ class changePasswordForm {
this.password2 = '';
}
// Password policy:
// * Minimum length: 8
// * Maximum length: 100
// * Contains capital/lower letters
// * Contains numbers
// * Does not contain any whitespace characters
validate() {
this.valid =
this.password_old.length > 0 &&
this.password1.length >= 8 &&
this.password1.length <= 100 &&
!this.password1.match(/\s/g) &&
this.password1.match(/[A-Z]/g) &&
this.password1.match(/[a-z]/g) &&
this.password1.match(/\d/g) &&
this.password1.match(/\W+/g);
this.equal = this.password1 === this.password2;
}
view() {
if (user.get() === undefined) return m();
const buttonArgs = {};
let buttons;
if (!this.valid || !this.equal || this.busy) {
if (!this.password_valid || !this.password_old_valid || !this.password_equal || this.busy) {
buttonArgs.disabled = true;
}
......@@ -142,34 +128,52 @@ class changePasswordForm {
return m('div', [
m('div', i18n('profile.password_requirements')),
m(InputGroupForm, {
m(TextField, {
name: 'password_old',
title: i18n('profile.old_password'),
label: i18n('profile.old_password'),
floatingLabel: true,
error: i18n('profile.old_password_error'),
type: 'password',
valid: this.password_old_valid,
value: this.password_old,
oninput: e => {
this.password_old = e.target.value;
this.validate();
events: {
oninput: e => {
this.password_old = e.target.value;
this.password_old_valid = this.password_old.length > 0;
},
},
}),
m(InputGroupForm, {
m(TextField, {
name: 'password1',
title: i18n('profile.new_password'),
label: i18n('profile.new_password'),
floatingLabel: true,
focusHelp: true,
help: i18n('profile.password_requirements'),
type: 'password',
valid: this.password_valid,
value: this.password1,
oninput: e => {
this.password1 = e.target.value;
this.validate();
events: {
oninput: e => {
this.password1 = e.target.value;
this.password_valid = this.password1.length >= 8 && this.password1.length <= 100;
this.password_equal = this.password1 === this.password2;
},
},
}),
m(InputGroupForm, {
m(TextField, {
name: 'password2',
title: i18n('profile.repeat_password'),
label: i18n('profile.repeat_password'),
floatingLabel: true,
focusHelp: true,
error: i18n('profile.passwords_not_equal'),
type: 'password',
valid: this.password_equal,
value: this.password2,
oninput: e => {
this.password2 = e.target.value;
this.validate();
events: {
oninput: e => {
this.password2 = e.target.value;
this.password_equal = this.password1 === this.password2;
},
},
}),
buttons,
......@@ -198,18 +202,23 @@ class rfidForm {
const buttonArgs = { events: { onclick: () => this.submit() } };
if (this.rfid === undefined) this.rfid = user.get().rfid;
if (!this.valid || this.busy) {
if (!this.valid || this.rfid === user.get().rfid || this.busy) {
buttonArgs.disabled = true;
}
return m('div', [
m(InputGroupForm, {
m(TextField, {
name: 'rfid',
title: i18n('profile.rfid'),
label: i18n('profile.rfid'),
floatingLabel: true,
error: i18n('profile.rfid_error'),
valid: this.valid,
value: this.rfid,
oninput: e => {
this.rfid = e.target.value;
this.valid = /^\d{6}$/g.test(this.rfid) && this.rfid !== user.get().rfid;
events: {
oninput: e => {
this.rfid = e.target.value;
this.valid = /^\d{6}$/g.test(this.rfid);
},
},
}),
m(Button, { ...buttonArgs, label: 'save' }),
......@@ -260,14 +269,16 @@ class groupMemberships {
view() {
// Searchbar for groups
const filterForm = m('div', [
m(InputGroupForm, {
m(TextField, {
name: 'group_search',
title: i18n('profile.search_groups'),
oninput: e => {
this.query = e.target.value;
if (this.query.length > 0) {
this.isValid = true;
}
label: i18n('profile.search_groups'),
events: {
oninput: e => {
this.query = e.target.value;
if (this.query.length > 0) {
this.isValid = true;
}
},
},
}),
]);
......
import m from 'mithril';
import StudydocsController from '../../models/studydocs';
import { Button, InputGroupForm, SelectGroupForm } from '../../components';
import { Button, InputGroupForm, Dropdown } from '../../components';
import { currentLanguage, i18n } from '../../models/language';
export default class studydocNew {
oninit() {
// We need to set the default values because they get only added to the request
// 'onchange' and thus do not appear in a request if the user does not change them
this.doc = { semester: 1, type: 'exams', department: 'itet' };
this.doc = { semester: null, type: null, department: null };
this.isValid = false;
this.isBusy = false;
}
......@@ -26,6 +26,11 @@ export default class studydocNew {
}
}
validate() {
console.log(this.doc.type);
this.isValid = this.doc.files && this.doc.files.length > 0 && this.doc.type !== null;
}
async submit() {
if (this.isValid && !this.isBusy) {
this.isBusy = true;
......@@ -64,29 +69,42 @@ export default class studydocNew {
getSuggestions: (input, callback) =>
studydocNew._getInputSuggestions('author', input, callback),
}),
m(SelectGroupForm, {
m(Dropdown, {
name: 'semester',
title: i18n('studydocs.semester'),
type: 'select',
onchange: e => {
this.doc.semester = e.target.value;
const { value } = e.target;
if (value === '') {
this.doc.semester = null;
} else {
this.doc.semester = value;
}
},
options: [
{ value: '1', text: '1' },
{ value: '2', text: '2' },
{ value: '3', text: '3' },
{ value: '4', text: '4' },
{ value: '5+', text: '5+' },
selected: null,
data: [
{ value: '', label: i18n('studydocs.no_semester') },
{ value: '1', label: '1' },
{ value: '2', label: '2' },
{ value: '3', label: '3' },
{ value: '4', label: '4' },
{ value: '5+', label: '5+' },
],
}),
m(SelectGroupForm, {
m(Dropdown, {
name: 'department',
title: i18n('studydocs.department'),
type: 'select',
onchange: e => {
this.doc.department = e.target.value;
const { value } = e.target;
if (value === '') {
this.doc.department = null;
} else {
this.doc.department = value;
}
},
options: [{ value: 'itet', text: 'itet' }, { value: 'mavt', text: 'mavt' }],
selected: null,
data: [
{ value: '', label: i18n('studydocs.no_department') },
{ value: 'itet', label: 'ITET' },
{ value: 'mavt', label: 'MAVT' },
],
}),
m(InputGroupForm, {
name: 'lecture',
......@@ -108,18 +126,24 @@ export default class studydocNew {
this.doc.course_year = e.target.value;
},
}),
m(SelectGroupForm, {
m(Dropdown, {
name: 'type',
title: i18n('studydocs.type'),
type: 'select',
onchange: e => {
this.doc.type = e.target.value;
const { value } = e.target;
if (value === '') {
this.doc.type = null;
} else {
this.doc.type = value;
}
this.validate();
},
options: [
{ value: 'exams', text: i18n('exams') },
{ value: 'cheat sheets', text: i18n('cheat sheets') },
{ value: 'lecture documents', text: i18n('lecture documents') },
{ value: 'exercises', text: i18n('exercises') },
selected: '',
data: [
{ value: '', label: `${i18n('studydocs.type')}*`, disabled: true },
{ value: 'exams', label: i18n('exams') },
{ value: 'cheat sheets', label: i18n('cheat sheets') },
{ value: 'lecture documents', label: i18n('lecture documents') },
{ value: 'exercises', label: i18n('exercises') },
],
}),
m(InputGroupForm, {
......@@ -131,11 +155,7 @@ export default class studydocNew {
},
onchange: e => {
this.doc.files = e.target.files;
if (this.doc.files && this.doc.files.length > 0) {
this.isValid = true;
} else {
this.isValid = false;
}
this.validate();
},
}),
m(Button, {
......
Supports Markdown
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