christoph/lecture-professional-software-development
1
Fork 0
Code Activity

search page refactor

Browse Source
This commit is contained in:
Christoph
2020-04-11 01:02:02 +02:00
parent 072ac32338
commit bda952a308
6 changed files with 65 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/main/java/mops/gruppen2/controller/SearchAndInviteController.java
View File

@ -57,7 +57,7 @@ public class SearchAndInviteController {
User user = new User(token);
List<Group> groups = searchService.searchPublicGroups(search, user);
model.addAttribute("gruppen", groups);
model.addAttribute("groups", groups);
return "search";
}

8
src/main/resources/data-h2.sql
View File

@ -1,16 +1,16 @@
INSERT INTO event
VALUES (1, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '07FEA694', 'CreateGroupEvent',
'{"type":"CreateGroupEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"07FEA694","groupParent":null,"groupType":"PUBLIC"}'),
(2, '2d90ae27-1129-4b61-84a5-6c7d585e777e', 'orga', 'AddUserEvent',
'{"type":"AddUserEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"orga","givenname":"Marcos","familyname":"Glover","email":"Marcos.Glover@mail.de"}'),
(2, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '2', 'AddUserEvent',
'{"type":"AddUserEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"2","givenname":"Marcos","familyname":"Glover","email":"Marcos.Glover@mail.de"}'),
(3, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '2', 'UpdateUserLimitEvent',
'{"type":"UpdateUserLimitEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"2","userLimit":"1000"}'),
(4, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '5CFBF1AF', 'UpdateGroupTitleEvent',
'{"type":"UpdateGroupTitleEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"5CFBF1AF","newGroupTitle":"Zyra"}'),
'{"type":"UpdateGroupTitleEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"5CFBF1AF","newGroupTitle":"Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra"}'),
(5, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '41E11CBC', 'UpdateGroupDescriptionEvent',
'{"type":"UpdateGroupDescriptionEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"41E11CBC","newGroupDescription":"Have you seen my Bear Tibbers?"}'),
'{"type":"UpdateGroupDescriptionEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"41E11CBC","newGroupDescription":"Have you seen my Bear Tibbers? Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyra Zyrav"}'),
(6, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '3', 'AddUserEvent',
'{"type":"AddUserEvent","groupId":"2d90ae27-1129-4b61-84a5-6c7d585e777e","userId":"3","givenname":"Antwan","familyname":"Smitham","email":"Antwan.Smitham@mail.de"}'),
(7, '2d90ae27-1129-4b61-84a5-6c7d585e777e', '4', 'AddUserEvent',

9
src/main/resources/static/index.css
View File

@ -29,3 +29,12 @@
margin-right: 0;
box-shadow: inset 0 .125rem .25rem rgba(0, 0, 0, .25);
}
.float-right {
margin-right: 10px;
margin-left: 10px;
}
.content:hover .float-right {
margin-right: 0;
}

20
src/main/resources/static/search.css Normal file
View File

@ -0,0 +1,20 @@
.top {
padding: 10px 10px !important;
margin-bottom: 15px !important;
}
/*Grouplist Hover Effect*/
.content {
margin-top: 5px;
padding: 5px 5px;
}
.content-heading {
margin-bottom: 5px;
transition: 100ms;
}
.content-text-in {
margin-bottom: 0;
padding: 5px;
}

6
src/main/resources/static/style.css
View File

@ -82,16 +82,10 @@
/*Positioning*/
.float-right {
margin-right: 10px;
margin-left: 10px;
float: right;
transition: 100ms;
}
.content:hover .float-right {
margin-right: 0;
}
/*Miscellanous*/
.def-cursor {
cursor: default;

100
src/main/resources/templates/search.html
View File

@ -1,80 +1,42 @@
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"
th:replace="~{mopslayout :: html(name='Gruppenbildung', headcontent=~{:: headcontent}, navigation=~{:: navigation}, bodycontent=~{:: bodycontent})}">
<head>
<meta charset="utf-8">
<title>Suche</title>
<th:block th:fragment="headcontent">
<!-- Links, Skripts, Styles hier einfügen! -->
</th:block>
</head>
<html lang="de" xmlns:th="http://www.thymeleaf.org" th:replace="~{mopslayout :: html(
name='Gruppenbildung',
headcontent=~{fragments/general :: headcontent(style='/search.css')},
navigation=~{fragments/general :: nav(current='search')},
bodycontent=~{:: bodycontent})}">
<body>
<header>
<nav class="navigation navigation-secondary" is="mops-navigation" th:fragment="navigation">
<ul>
<li>
<a th:href="@{/gruppen2}">Gruppen</a>
</li>
<li>
<a th:href="@{/gruppen2/create}">Erstellen</a>
</li>
<li class="active">
<a th:href="@{/gruppen2/search}">Suche</a>
</li>
</ul>
</nav>
</header>
<main th:fragment="bodycontent">
<div class="container-fluid">
<div class="row">
<div class="col-10">
<h1>Gruppensuche</h1>
<div class="shadow-sm p-2"
style="border: 10px solid aliceblue; border-radius: 5px; background: aliceblue;">
<form method="post" th:action="@{/gruppen2/search}">
<div class="form-group">
<label for="suchleiste">Suchbegriff:</label>
<input class="form-control" id="suchleiste"
placeholder="z.B. Programmieren, Lerngruppe, ..."
th:name="string" type="text">
</div>
<button class="btn btn-primary" style="background: #52a1eb; border-style: none;" type="submit">
Suchen
</button>
</form>
<h1>Suche</h1>
<div class="content top">
<form method="post" th:action="@{/gruppen2/search}">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span class="input-group-text text-monospace">Suchbegriff:</span>
</div>
<input class="form-control" th:name="string" type="text">
</div>
<br>
<table class="table" th:if='${!gruppen.isEmpty()}'>
<!-- Erscheint dann, wenn man "Suchen" Button klickt und Ergebnisse angezeigt werden, aber so solls aussehen -->
<thead>
<tr>
<th scope="col">Gruppenname</th>
<th scope="col">Beschreibung</th>
<th scope="col">Max. Mitgliederanzahl</th>
</tr>
</thead>
<tbody>
<tr th:each="gruppe : ${gruppen}" th:switch="${gruppe.getUserLimit() != 100000}">
<th scope="row">
<span class="badge badge-pill badge-success"
style="background: lightseagreen; margin-right: 25px;"
th:if='${gruppe.getType() == lecture}'>Veranstaltung</span>
<a th:href="@{/gruppen2/details/{id}(id=${gruppe.getId()})}"
th:text="${#strings.abbreviate(gruppe.getTitle(), 50)}">Gruppenname</a>
</th>
<td style="" th:text="${#strings.abbreviate(gruppe.getDescription(), 50)}">
Beschreibung
</td>
<td th:case="${true}">
<a th:text="${gruppe.getUserLimit()}"></a>
</td>
<td th:case="${false}">unbegrenzt</td>
</tr>
</tbody>
</table>
<button class="btn btn-primary" type="submit">Suchen</button>
</form>
</div>
<div class="content" th:each="group: ${groups}">
<div class="content-heading">
<a class="link" th:href="@{/gruppen2/details/{id}(id=${group.getId()})}"
th:text="${group.getTitle()}"></a>
</div>
<div class="content-text-in">
<span th:text="${group.getDescription()}"></span>
</div>
</div>
</div>
</main>
</body>
</html>