improved login page

accounts/views/login.py

@@ -18,6 +18,6 @@ class LoginView(APIView):
 		serializer.is_valid(raise_exception=True)
 		user = serializer.get_user(data)
 		if user is None:
-			return Response({'user': ['Username or password wrong.']}, status.HTTP_200_OK)
+			return Response({'error': ['Username or password wrong.']}, status.HTTP_400_BAD_REQUEST)
 		login(request, user)
 		return Response({'id': user.pk}, status=status.HTTP_200_OK)

frontend/static/js/api/client.js

@@ -133,7 +133,7 @@ class Client
 		if (response.status == 200)
 			await this._update_logged(true);
 
-		return response.status;
+		return response;
 	}
 
 	async logout()

frontend/static/js/views/accounts/LoginView.js

@@ -7,14 +7,13 @@ async function login()
 	let username = document.getElementById("username-input").value;
 	let password = document.getElementById("password-input").value;
 	
-	let response_data = await client.login(username, password);
+	let response = await client.login(username, password);
 
-	if (response_data == 200) {
+	if (response.status == 200) {
 		navigateTo("/home");
 	} else {
-//TODO: error field
-		clear("innerHTML", ["username", "user", "password"]);
-		fill_errors(response_data, "innerHTML");
+		let error = await response.json();
+		fill_errors(error, "innerHTML");
 	}
 }
 
@@ -25,6 +24,17 @@ export default class extends AbstractNonAuthentifiedView {
 
 	async postInit()
 	{
+		let usernameField = document.getElementById('username-input');
+		usernameField.addEventListener('keydown', ev => {
+			if (ev.key === 'Enter')
+				login();
+		});
+		usernameField.focus();
+		let passwordField = document.getElementById('password-input');
+		passwordField.addEventListener('keydown', ev => {
+			if (ev.key === 'Enter')
+				login();
+		});
 		document.getElementById("login-button").onclick = login;
 	}
 
@@ -34,11 +44,9 @@ export default class extends AbstractNonAuthentifiedView {
 				<label>Login</label>
 				<link rel="stylesheet" href="/static/css/accounts/login.css">
 				<input type="text" id="username-input" placeholder="username">
-				<span id="username"></span>
 				<input type="password" id="password-input" placeholder="password">
-				<span id="password"></span>
 				<input type="button" value="Login" id="login-button">
-				<span id="user"></span>
+				<span id="error"></span>
 				<a href="/register" class="nav__link" data-link>Register</a>
 			</div>
         `;