Commit 6f654a34 authored by Martins Berzins's avatar Martins Berzins
Browse files

Implemented working navigation bar

parent 03a13579
......@@ -34,7 +34,7 @@ public class CalendarController {
EventRepo eventRepo;
@GetMapping(value = "/calendar")
@GetMapping({"/", "/calendar"})
public String calendarGet(Model models)
{
......
......@@ -9,9 +9,42 @@
<body>
<div class="container w-50">
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<a class="navbar-brand" href="#">SimpleCal</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<br> <form action="#" th:action="@{/add-new-event}" th:object="${event}" method="post">
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link" href="/calendar">Calendar</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="#">Add new event <span class="sr-only">(current)</span></a>
</li>
</ul>
<form id="logoutForm" action="#" method="POST" th:action="@{/logout}" class="form-inline my-2 my-lg-0">
<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
</form>
<h6 style="color:white;"> Welcome, <span th:text="${#request.userPrincipal.name}"></span> | <a onclick="document.forms['logoutForm'].submit()">Logout</a></h6>
</div>
</nav>
<style>
a:hover {
cursor: pointer;
}
</style>
<div class="container w-50 ">
<br><br><br> <form action="#" th:action="@{/add-new-event}" th:object="${event}" method="post">
<h2 class="form-signin-heading text-center">Add an event</h2><br>
<input name="name" type="text" th:field="*{name}" class="form-control" placeholder="Title" autofocus="true"/><br>
......
......@@ -5,64 +5,47 @@
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.7/semantic.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
<div class = "listElements">
<ul >
<li><p th:text="'Hello ' + ${currentUser} + '!'" ></p></li>
<li><a href="add-new-event">Add a new event</a></li>
<li style="float:right"><a href="logout">Logout</a></li>
</ul>
</div>
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
<a class="navbar-brand" href="#">SimpleCal</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Calendar <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="/add-new-event">Add new event</a>
</li>
</ul>
<form id="logoutForm" action="#" method="POST" th:action="@{/logout}" class="form-inline my-2 my-lg-0">
<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
</form>
<h6 style="color:white;"> Welcome, <span th:text="${#request.userPrincipal.name}"></span> | <a onclick="document.forms['logoutForm'].submit()">Logout</a></h6>
</div>
</nav>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
background-color: #007bff;
overflow: hidden;
}
.listElements a
{
float: left;
color: #f2f2f2;
text-align: center;
padding: 30px 16px;
text-decoration: none;
font-size: 20px;
}
.listElements a:hover
{
background-color: #84b6ff;
color: white;
}
.listElements p
{
float: left;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 30px;
}
.fc-content{
font-size: 1.5em;
color: white;
}
.fc-event{
background-color:#007bff;
}
a:hover {
cursor: pointer;
}
</style>
<br/>
......@@ -78,11 +61,15 @@ background-color:#007bff;
<input type="hidden" id="events" th:value="${allEvents}"/>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.7/semantic.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.min.js"></script>
<script th:inline="javascript">
$(document).ready(function() {
var all = JSON.parse($("#events").val());
......
......@@ -14,7 +14,7 @@
<body>
<div class="container w-50">
<form action="#" method="POST" th:action="@{/login}" class="form-signin">
<br><br><br> <form action="#" method="POST" th:action="@{/login}" class="form-signin">
<br> <h2 class="form-heading text-center">Log in to Your SimpleCal</h2> <br>
......
......@@ -15,7 +15,7 @@
<div class="container w-50">
<br> <form action="#" method="POST" th:action="@{/registration}" class="form-signin" th:object="${userForm}">
<br><br><br> <form action="#" method="POST" th:action="@{/registration}" class="form-signin" th:object="${userForm}">
<h2 class="form-signin-heading text-center">Create your account</h2><br>
<div class="form-group" th:classappend="${#fields.hasErrors('*')} ? 'has-error' : ''">
......
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