commit 2a2f32c2d435a67c13e14ce194196700ff457239
Author: Pavel Fidranský <fidransky@outlook.com>
Date:   Tue Oct 9 22:24:48 2018 +0200

    elements' visibility is controlled by body class which is set based on user's login state

diff --git a/sources/src/main/webapp/css/main.css b/sources/src/main/webapp/css/main.css
index c396662..d23616e 100644
--- a/sources/src/main/webapp/css/main.css
+++ b/sources/src/main/webapp/css/main.css
@@ -889,4 +889,13 @@ ul {
 .jstree-default .jstree-clicked {
 	background: none !important;
 	box-shadow: none !important;
-}
\ No newline at end of file
+}
+
+/**
+ * USER AUTHENTICATION
+ **/
+
+.loggedIn .loggedOutOnly,
+.loggedOut .loggedInOnly {
+	display: none !important;
+}
diff --git a/sources/src/main/webapp/js/userMenu.js b/sources/src/main/webapp/js/userMenu.js
index bb31c0d..02810a7 100644
--- a/sources/src/main/webapp/js/userMenu.js
+++ b/sources/src/main/webapp/js/userMenu.js
@@ -1,6 +1,7 @@
 document.addEventListener('DOMContentLoaded', function() {
 	var toggleLoginPopupButton = document.getElementById('toggleLoginPopupButton');
 	var toggleRegisterPopupButton = document.getElementById('toggleRegisterPopupButton');
+	var usernameLabel = document.getElementById('usernameLabel');
 	var logoutButton = document.getElementById('logoutButton');
 
 	var loginPopup = document.getElementById('loginPopup');
@@ -9,94 +10,98 @@ document.addEventListener('DOMContentLoaded', function() {
 	var loginForm = document.forms['loginForm'];
 	var registerForm = document.forms['registerForm'];
 
-	if (toggleLoginPopupButton) {
-		toggleLoginPopupButton.addEventListener('click', function() {
-			loginPopup.classList.toggle('hidden');
-		});
-	}
+	toggleLoginPopupButton.addEventListener('click', function() {
+		loginPopup.classList.toggle('hidden');
+	});
 
-	if (toggleRegisterPopupButton) {
-		toggleRegisterPopupButton.addEventListener('click', function() {
-			registerPopup.classList.toggle('hidden');
-		});
-	}
+	toggleRegisterPopupButton.addEventListener('click', function() {
+		registerPopup.classList.toggle('hidden');
+	});
 
-	if (logoutButton) {
-		logoutButton.addEventListener('click', function(e) {
-			e.preventDefault();
-
-			$.ajax({
-				'type': 'GET',
-				'url': logoutButton.href,
-				'success': function() {
-					location.reload(true);
-				},
-				'error': function() {
-					alert('Something went wrong.');
-				},
-			});
+	logoutButton.addEventListener('click', function(e) {
+		e.preventDefault();
+
+		$.ajax({
+			'type': 'GET',
+			'url': logoutButton.href,
+			'success': function() {
+				document.dispatchEvent(new CustomEvent('imiger.userLoggedOut'));
+
+				usernameLabel.innerText = '';
+
+				document.body.classList.remove('loggedIn');
+				document.body.classList.add('loggedOut');
+			},
+			'error': function() {
+				alert('Something went wrong.');
+			},
 		});
-	}
+	});
 
-	if (loginForm) {
-		loginForm.addEventListener('submit', function(e) {
-			e.preventDefault();
-
-			$.ajax({
-				'type': loginForm.method,
-				'url': loginForm.action,
-				'data': {
-					'username': loginForm.username.value,
-					'password': loginForm.password.value,
-				},
-				'success': function() {
-					location.reload(true);
-				},
-				'error': function(xhr) {
-					switch (xhr.status) {
-						case 400:
-							printErrors(xhr);
-							break;
-						case 401:
-							alert('Invalid credentials.');
-							break;
-						default:
-							alert('Something went wrong.');
-					}
-				},
-			});
+	loginForm.addEventListener('submit', function(e) {
+		e.preventDefault();
+
+		$.ajax({
+			'type': loginForm.method,
+			'url': loginForm.action,
+			'data': {
+				'username': loginForm.username.value,
+				'password': loginForm.password.value,
+			},
+			'success': function(data) {
+				document.dispatchEvent(new CustomEvent('imiger.userLoggedIn'));
+
+				usernameLabel.innerText = data.user.username;
+
+				document.body.classList.remove('loggedOut');
+				document.body.classList.add('loggedIn');
+
+				loginPopup.classList.add('hidden');
+			},
+			'error': function(xhr) {
+				switch (xhr.status) {
+					case 400:
+						printErrors(xhr);
+						break;
+					case 401:
+						alert('Invalid credentials.');
+						break;
+					default:
+						alert('Something went wrong.');
+				}
+			},
 		});
-	}
+	});
+
+	registerForm.addEventListener('submit', function(e) {
+		e.preventDefault();
 
-	if (registerForm) {
-		registerForm.addEventListener('submit', function(e) {
-			e.preventDefault();
-
-			$.ajax({
-				'type': registerForm.method,
-				'url': registerForm.action,
-				'data': {
-					'name': registerForm.name.value,
-					'email': registerForm.email.value,
-					'username': registerForm.username.value,
-					'password': registerForm.password.value,
-					'passwordCheck': registerForm.passwordCheck.value,
-				},
-				'success': function() {
-					location.reload(true);
-				},
-				'error': function(xhr) {
-					switch (xhr.status) {
-						case 400:
-							printErrors(xhr);
-							break;
-						default:
-							alert('Something went wrong.');
-					}
-				},
-			});
+		$.ajax({
+			'type': registerForm.method,
+			'url': registerForm.action,
+			'data': {
+				'name': registerForm.name.value,
+				'email': registerForm.email.value,
+				'username': registerForm.username.value,
+				'password': registerForm.password.value,
+				'passwordCheck': registerForm.passwordCheck.value,
+			},
+			'success': function() {
+				document.dispatchEvent(new CustomEvent('imiger.userRegistered'));
+
+				registerPopup.classList.add('hidden');
+			},
+			'error': function(xhr) {
+				switch (xhr.status) {
+					case 400:
+						printErrors(xhr);
+						break;
+					default:
+						alert('Something went wrong.');
+				}
+			},
 		});
-	}
+	});
 });
 
 function printErrors(xhr) {
diff --git a/sources/src/main/webapp/showGraph.jsp b/sources/src/main/webapp/showGraph.jsp
index 7d4b634..1276b08 100644
--- a/sources/src/main/webapp/showGraph.jsp
+++ b/sources/src/main/webapp/showGraph.jsp
@@ -1,6 +1,10 @@
 <%@page contentType="text/html" pageEncoding="UTF-8"%>
 <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
 
+<c:set var="HOME_URL" value="${initParam.HOME_URL}"/>
+<c:set var="isLoggedIn" value="${sessionScope.isLoggedIn}"/>
+<c:set var="user" value="${sessionScope.user}"/>
+
 <!DOCTYPE html>
 <html>
 	<head>
@@ -55,11 +59,7 @@
 		<title>IMiGEr</title>
 	</head>
 
-	<body>
-		<c:set var="HOME_URL" value="${initParam.HOME_URL}"/>
-		<c:set var="isLoggedIn" value="${sessionScope.isLoggedIn}"/>
-		<c:set var="user" value="${sessionScope.user}"/>
-
+	<body class="${isLoggedIn ? 'loggedIn' : 'loggedOut'}">
 		<div class="wrapper">
 			<header class="header" id="header">
 				<img src="images/logo.png" class="header-logo" alt="logo of University of West Bohemia" title="University of West Bohemia">
@@ -144,16 +144,14 @@
 								<img src="images/png_save.png" id="applyLayoutImg" alt="Save diagram as PNG.">
 							</button>
 						</li>
-						<c:if test="${isLoggedIn}">
-							<li>
-								<hr class="navbar-separator">
-							</li>
-							<li>
-								<button class="btn save-diagram" id="btnSaveDiagramToDatabase" title="Save diagram.">
-									<img src="images/icon_save.png" id="applyLayoutImg" alt="Save diagram">
-								</button>
-							</li>
-						</c:if>
+						<li class="loggedInOnly">
+							<hr class="navbar-separator">
+						</li>
+						<li class="loggedInOnly">
+							<button class="btn save-diagram" id="btnSaveDiagramToDatabase" title="Save diagram">
+								<img src="images/icon_save.png" id="applyLayoutImg" alt="Save diagram">
+							</button>
+						</li>
 						<li>
 							<hr class="navbar-separator">
 						</li>
diff --git a/sources/src/main/webapp/uploadFiles.jsp b/sources/src/main/webapp/uploadFiles.jsp
index 8b2a0ec..4d5b1b0 100644
--- a/sources/src/main/webapp/uploadFiles.jsp
+++ b/sources/src/main/webapp/uploadFiles.jsp
@@ -1,6 +1,10 @@
 <%@page contentType="text/html" pageEncoding="UTF-8"%>
 <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
 
+<c:set var="HOME_URL" value="${initParam.HOME_URL}"/>
+<c:set var="isLoggedIn" value="${sessionScope.isLoggedIn}"/>
+<c:set var="user" value="${sessionScope.user}"/>
+
 <!DOCTYPE html>
 <html>
 	<head>
@@ -14,11 +18,7 @@
 		<title>IMiGEr</title>
 	</head>
 
-	<body>
-		<c:set var="HOME_URL" value="${initParam.HOME_URL}"/>
-		<c:set var="isLoggedIn" value="${sessionScope.isLoggedIn}"/>
-		<c:set var="user" value="${sessionScope.user}"/>
-
+	<body class="${isLoggedIn ? 'loggedIn' : 'loggedOut'}">
 		<header class="header" id="header">
 			<img src="images/logo.png" class="header-logo" alt="logo of University of West Bohemia" title="University of West Bohemia">
 
@@ -51,20 +51,18 @@
 				</form>
 			</div>
 
-			<c:if test="${isLoggedIn}">
-				<div class="diagrams-menu">
-					<h3>My diagrams</h3>
-
-					<ul>
-						<c:forEach items="${diagramsPrivate}" var="diagram">
-							<li>
-								<a href="${HOME_URL}graph?diagramId=${diagram.id}">${diagram.name}</a>
-								<button class="removeDiagramButton" data-name="${diagram.name}" data-id="${diagram.id}"><img src="images/button_cancel.png" alt="odstranit"></button>
-							</li>
-						</c:forEach>
-					</ul>
-				</div>
-			</c:if>
+			<div class="diagrams-menu loggedInOnly">
+				<h3>My diagrams</h3>
+
+				<ul id="privateDiagramList">
+					<c:forEach items="${diagramsPrivate}" var="diagram">
+						<li>
+							<a href="${HOME_URL}graph?diagramId=${diagram.id}">${diagram.name}</a>
+							<button class="removeDiagramButton" data-name="${diagram.name}" data-id="${diagram.id}"><img src="images/button_cancel.png" alt="odstranit"></button>
+						</li>
+					</c:forEach>
+				</ul>
+			</div>
 
 			<div class="diagrams-menu">
 				<h3>Public diagrams</h3>
