Browse Source

Uniform and correct styling

Signed-off-by: Pekka Helenius <fincer89@hotmail.com>
v0.0.2-alpha
Pekka Helenius 4 years ago
parent
commit
8ad66f24a0
5 changed files with 492 additions and 494 deletions
  1. +17
    -19
      bookstore/src/main/resources/templates/apiref.html
  2. +211
    -211
      bookstore/src/main/resources/templates/bookadd.html
  3. +209
    -209
      bookstore/src/main/resources/templates/bookedit.html
  4. +48
    -48
      bookstore/src/main/resources/templates/booklist.html
  5. +7
    -7
      bookstore/src/main/resources/templates/error.html

+ 17
- 19
bookstore/src/main/resources/templates/apiref.html View File

@ -1,25 +1,25 @@
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<title th:text="${#messages.msgOrNull('page.title.browser.apiref')} ?: 'page.title.browser.apiref'">
page.title.browser.apiref
</title>
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<title th:text="${#messages.msgOrNull('page.title.browser.apiref')} ?: 'page.title.browser.apiref'">
page.title.browser.apiref
</title>
</head>
<body th:with="baseUrl=(@{__${#httpServletRequest.scheme}__} + '://' + @{__${#httpServletRequest.serverName}__} + ':' + @{__${#httpServletRequest.serverPort}__} + '/')">
<h1 th:text="${#messages.msgOrNull('page.title.webform.apiref')} ?: 'page.title.webform.apiref'">
page.title.webform.apiref
</h1>
<h1 th:text="${#messages.msgOrNull('page.title.webform.apiref')} ?: 'page.title.webform.apiref'">
page.title.webform.apiref
</h1>
<p th:text="${#messages.msgOrNull('page.text.apiref.warning')} ?: 'page.text.apiref.warning'">
page.text.apiref.warning
</p>
<p th:text="${#messages.msgOrNull('page.text.apiref.warning')} ?: 'page.text.apiref.warning'">
page.text.apiref.warning
</p>
<table class="table table-striped">
<tbody>
@ -136,7 +136,7 @@
<small th:text="${#messages.msgOrNull('page.text.apiref.unix.info')} ?: 'page.text.apiref.unix.info'">page.text.apiref.unix.info</small>
</td>
</tr>
<tr>
<th class="apiref-table-right apiref-table-title">
<h3 th:text="${#messages.msgOrNull('page.text.apiref.book.add')} ?: 'page.text.apiref.book.add'">
@ -170,7 +170,7 @@
<small th:text="${#messages.msgOrNull('page.text.apiref.unix.info')} ?: 'page.text.apiref.unix.info'">page.text.apiref.unix.info</small>
</td>
</tr>
<tr>
<th class="apiref-table-right apiref-table-title">
<h3 th:text="${#messages.msgOrNull('page.text.apiref.book.delete')} ?: 'page.text.apiref.book.delete'">
@ -188,7 +188,7 @@
<small th:text="${#messages.msgOrNull('page.text.apiref.unix.info')} ?: 'page.text.apiref.unix.info'">page.text.apiref.unix.info</small>
</td>
</tr>
<tr>
<th class="apiref-table-right apiref-table-title">
<h3 th:text="${#messages.msgOrNull('page.text.apiref.author.edit')} ?: 'page.text.apiref.author.edit'">
@ -209,7 +209,7 @@
</tbody>
<tr>
<td>
<a class="btn btn-success" th:href="@{__${listpage}__}"
<a class="btn btn-success" th:href="@{__${listpage}__}"
th:text="${#messages.msgOrNull('button.page.list.return')} ?: 'button.page.list.return'">
button.page.list.return
</a>
@ -218,7 +218,5 @@
</tr>
</table>
</body>
</html>

+ 211
- 211
bookstore/src/main/resources/templates/bookadd.html View File

@ -1,233 +1,233 @@
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<title th:text="${#messages.msgOrNull('page.title.browser.add')} ?: 'page.title.browser.add'">
page.title.browser.add
</title>
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<title th:text="${#messages.msgOrNull('page.title.browser.add')} ?: 'page.title.browser.add'">
page.title.browser.add
</title>
</head>
<body>
<div class="col-md-4 mb-3">
<h1 th:text="${#messages.msgOrNull('page.title.webform.add')} ?: 'page.title.webform.add'">
page.title.webform.add
</h1>
<h1 th:text="${#messages.msgOrNull('page.title.webform.add')} ?: 'page.title.webform.add'">
page.title.webform.add
</h1>
<form th:object="${book}" action="#" th:action="@{__${addpage}__}" method="post">
<form th:object="${book}" action="#" th:action="@{__${addpage}__}" method="post">
<div class="bookform-section">
<div>
<h3 th:text="${#messages.msgOrNull('book.author')} ?: 'book.author'">
book.author
</h3>
</div>
<div class="form-group row">
<div class="col">
<label for="BookAuthorFirstName"
th:text="${#messages.msgOrNull('book.author.firstName')} ?: 'book.author.firstName'">
book.author.firstName
</label>
<input class="form-control" type="text" th:field="*{author.firstName}" placeholder="Book author first name"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.author.firstname')} ?: 'book.desc.set.author.firstname'">
book.desc.set.author.firstname
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.author.firstname')} ?: 'book.desc.example.author.firstname'">
book.desc.example.author.firstname
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author.firstName')}"
th:errors="*{author.firstName}">Invalid author first name value</div>
</div>
<div class="col">
<label for="BookAuthorLastName"
th:text="${#messages.msgOrNull('book.author.lastName')} ?: 'book.author.lastName'">
book.author.lastName
</label>
<input class="form-control" type="text" th:field="*{author.lastName}" placeholder="Book author last name"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.author.lastname')} ?: 'book.desc.set.author.lastname'">
book.desc.set.author.lastname
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.author.lastname')} ?: 'book.desc.example.author.lastname'">
book.desc.example.author.lastname
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author.lastName')}"
th:errors="*{author.lastName}">Invalid author last name value</div>
</div>
</div>
</div>
<div class="form-group bookform-section">
<label for="BookTitle"
th:text="${#messages.msgOrNull('book.title')} ?: 'book.title'">
book.title
</label>
<input class="form-control" type="text" th:field="*{title}" placeholder="Book title"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.title')} ?: 'book.desc.set.title'">
book.desc.set.title
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.title')} ?: 'book.desc.example.title'">
book.desc.example.title
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('title')}"
th:errors="*{title}">Invalid title value</div>
</div>
<div class="form-group bookform-section">
<label for="BookISBN"
th:text="${#messages.msgOrNull('book.isbn')} ?: 'book.isbn'">
book.isbn
</label>
<input class="form-control" type="text" th:field="*{isbn}" placeholder="Book ISBN code"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.isbn')} ?: 'book.desc.set.isbn'">
book.desc.set.isbn
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.isbn')} ?: 'book.desc.example.isbn'">
book.desc.example.isbn
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('isbn')}"
th:errors="*{isbn}">Invalid ISBN code</div>
</div>
<div class="form-group bookform-section">
<label for="BookYear"
th:text="${#messages.msgOrNull('book.year')} ?: 'book.year'">
book.year
</label>
<input class="form-control" type="text" th:field="*{year}" placeholder="Book publication year (YYYY)"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.year')} ?: 'book.desc.set.year'">
book.desc.set.year
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
<div>
<h3 th:text="${#messages.msgOrNull('book.author')} ?: 'book.author'">
book.author
</h3>
</div>
<div class="form-group row">
<div class="col">
<label for="BookAuthorFirstName"
th:text="${#messages.msgOrNull('book.author.firstName')} ?: 'book.author.firstName'">
book.author.firstName
</label>
<input class="form-control" type="text" th:field="*{author.firstName}" placeholder="Book author first name"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.author.firstname')} ?: 'book.desc.set.author.firstname'">
book.desc.set.author.firstname
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.author.firstname')} ?: 'book.desc.example.author.firstname'">
book.desc.example.author.firstname
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author.firstName')}"
th:errors="*{author.firstName}">Invalid author first name value</div>
</div>
<div class="col">
<label for="BookAuthorLastName"
th:text="${#messages.msgOrNull('book.author.lastName')} ?: 'book.author.lastName'">
book.author.lastName
</label>
<input class="form-control" type="text" th:field="*{author.lastName}" placeholder="Book author last name"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.author.lastname')} ?: 'book.desc.set.author.lastname'">
book.desc.set.author.lastname
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.author.lastname')} ?: 'book.desc.example.author.lastname'">
book.desc.example.author.lastname
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author.lastName')}"
th:errors="*{author.lastName}">Invalid author last name value</div>
</div>
</div>
</div>
<div class="form-group bookform-section">
<label for="BookTitle"
th:text="${#messages.msgOrNull('book.title')} ?: 'book.title'">
book.title
</label>
<input class="form-control" type="text" th:field="*{title}" placeholder="Book title"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.title')} ?: 'book.desc.set.title'">
book.desc.set.title
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.title')} ?: 'book.desc.example.title'">
book.desc.example.title
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('title')}"
th:errors="*{title}">Invalid title value</div>
</div>
<div class="form-group bookform-section">
<label for="BookISBN"
th:text="${#messages.msgOrNull('book.isbn')} ?: 'book.isbn'">
book.isbn
</label>
<input class="form-control" type="text" th:field="*{isbn}" placeholder="Book ISBN code"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.isbn')} ?: 'book.desc.set.isbn'">
book.desc.set.isbn
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.isbn')} ?: 'book.desc.example.isbn'">
book.desc.example.isbn
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('isbn')}"
th:errors="*{isbn}">Invalid ISBN code</div>
</div>
<div class="form-group bookform-section">
<label for="BookYear"
th:text="${#messages.msgOrNull('book.year')} ?: 'book.year'">
book.year
</label>
<input class="form-control" type="text" th:field="*{year}" placeholder="Book publication year (YYYY)"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.year')} ?: 'book.desc.set.year'">
book.desc.set.year
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.year')} ?: 'book.desc.example.year'">
book.desc.example.year
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('year')}"
th:errors="*{year}">Invalid year value</div>
</div>
<div class="form-group bookform-section">
<label for="BookPrice"
th:text="${#messages.msgOrNull('book.price')} ?: 'book.price'">
book.price
</label>
<div class="input-group mb-2">
<div class="input-group-prepend">
<div class="input-group-text"
th:text="${#messages.msgOrNull('page.symbols.currency')} ?: 'page.symbols.currency'">
page.symbols.currency
</div>
</div>
<input class="form-control" type="text" th:field="*{price}" placeholder="0.00"/>
</div>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.price')} ?: 'book.desc.set.price'">
book.desc.set.price
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.year')} ?: 'book.desc.example.year'">
book.desc.example.year
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('year')}"
th:errors="*{year}">Invalid year value</div>
</div>
<div class="form-group bookform-section">
<label for="BookPrice"
th:text="${#messages.msgOrNull('book.price')} ?: 'book.price'">
book.price
</label>
<div class="input-group mb-2">
<div class="input-group-prepend">
<div class="input-group-text"
th:text="${#messages.msgOrNull('page.symbols.currency')} ?: 'page.symbols.currency'">
page.symbols.currency
</div>
</div>
<input class="form-control" type="text" th:field="*{price}" placeholder="0.00"/>
</div>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.price')} ?: 'book.desc.set.price'">
book.desc.set.price
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.price')} ?: 'book.desc.example.price'">
book.desc.example.price
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('price')}"
th:errors="*{price}">Invalid price value</div>
</div>
<div class="form-group bookform-section">
<label for="BookCategory"
th:text="${#messages.msgOrNull('book.category')} ?: 'book.category'">
book.category
</label>
<select class="form-control" th:field="*{category}">
<option
th:each="category : ${categories}"
th:value="${category.id}"
th:text="${category.name}"
>(obj) category.name</option>
<option value=""
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.price')} ?: 'book.desc.example.price'">
book.desc.example.price
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('price')}"
th:errors="*{price}">Invalid price value</div>
</div>
<div class="form-group bookform-section">
<label for="BookCategory"
th:text="${#messages.msgOrNull('book.category')} ?: 'book.category'">
book.category
</label>
<select class="form-control" th:field="*{category}">
<option
th:each="category : ${categories}"
th:value="${category.id}"
th:text="${category.name}"
>(obj) category.name</option>
<option value=""
th:text="${#messages.msgOrNull('book.null.category')} ?: 'book.null.category'">
book.null.category
</option>
</select>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.category')} ?: 'book.desc.set.category'">
book.desc.set.category
</small>
</div>
<button class="btn btn-primary" type="submit"
th:text="${#messages.msgOrNull('button.book.add')} ?: 'button.book.add'">
button.book.add
</button>
</form>
<br>
<a class="btn btn-success" th:href="@{../__${listpage}__}"
</select>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.category')} ?: 'book.desc.set.category'">
book.desc.set.category
</small>
</div>
<button class="btn btn-primary" type="submit"
th:text="${#messages.msgOrNull('button.book.add')} ?: 'button.book.add'">
button.book.add
</button>
</form>
<br>
<a class="btn btn-success" th:href="@{../__${listpage}__}"
th:text="${#messages.msgOrNull('button.page.list.return')} ?: 'button.page.list.return'">
button.page.list.return
</a>
</div>
</div>
</body>
</html>

+ 209
- 209
bookstore/src/main/resources/templates/bookedit.html View File

@ -1,236 +1,236 @@
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<title th:text="${#messages.msgOrNull('page.title.browser.edit')} ?: 'page.title.browser.edit'">
page.title.browser.edit
</title>
<title th:text="${#messages.msgOrNull('page.title.browser.edit')} ?: 'page.title.browser.edit'">
page.title.browser.edit
</title>
</head>
<body>
<div class="col-md-4 mb-3">
<div class="col-md-4 mb-3">
<h1 th:text="${#messages.msgOrNull('page.title.webform.edit')} ?: 'page.title.webform.edit'">
page.title.webform.edit
</h1>
<h1 th:text="${#messages.msgOrNull('page.title.webform.edit')} ?: 'page.title.webform.edit'">
page.title.webform.edit
</h1>
<form th:object="${book}" action="#" th:action="@{{id}(id=${book.id})}" method="post">
<form th:object="${book}" action="#" th:action="@{{id}(id=${book.id})}" method="post">
<div class="bookform-section">
<div>
<h3 th:text="${#messages.msgOrNull('book.author')} ?: 'book.author'">
book.author
</h3>
</div>
<div class="form-group row">
<div class="col">
<label for="BookAuthor"
th:text="${#messages.msgOrNull('book.author.firstName')} ?: 'book.author.firstName'">
book.author.firstName
</label>
<input class="form-control" type="text" th:field="*{author.firstName}" placeholder="Book author first name"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.author.firstname')} ?: 'book.desc.set.author.firstname'">
book.desc.set.author.firstname
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.author.firstname')} ?: 'book.desc.example.author.firstname'">
book.desc.example.author.firstname
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author.firstName')}"
th:errors="*{author.firstName}">Invalid author first name value</div>
</div>
<div class="col">
<label for="BookAuthor"
th:text="${#messages.msgOrNull('book.author.lastName')} ?: 'book.author.lastName'">
book.author.lastName
</label>
<input class="form-control" type="text" th:field="*{author.lastName}" placeholder="Book author last name"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.author.lastname')} ?: 'book.desc.set.author.lastname'">
book.desc.set.author.lastname
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.author.lastname')} ?: 'book.desc.example.author.lastname'">
book.desc.example.author.lastname
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author.lastName')}"
th:errors="*{author.lastName}">Invalid author last name value</div>
</div>
</div>
</div>
<div class="form-group bookform-section">
<label for="BookName"
th:text="${#messages.msgOrNull('book.title')} ?: 'book.title'">
book.title
</label>
<input class="form-control" type="text" th:field="*{title}" placeholder="Book title"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.title')} ?: 'book.desc.set.title'">
book.desc.set.title
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.title')} ?: 'book.desc.example.title'">
book.desc.example.title
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('title')}"
th:errors="*{title}">Invalid title</div>
</div>
<div class="form-group bookform-section">
<label for="BookISBN"
th:text="${#messages.msgOrNull('book.isbn')} ?: 'book.isbn'">
book.isbn
</label>
<input class="form-control" type="text" th:field="*{isbn}" placeholder="Book ISBN code"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.isbn')} ?: 'book.desc.set.isbn'">
book.desc.set.isbn
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.isbn')} ?: 'book.desc.example.isbn'">
book.desc.example.isbn
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('isbn')}"
th:errors="*{isbn}">Invalid ISBN code value</div>
</div>
<div class="form-group bookform-section">
<label for="BookYear"
th:text="${#messages.msgOrNull('book.year')} ?: 'book.year'">
book.year
</label>
<input class="form-control" type="text" th:field="*{year}" placeholder="Book publication year (YYYY)"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.year')} ?: 'book.desc.set.year'">
book.desc.set.year
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.year')} ?: 'book.desc.example.year'">
book.desc.example.year
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('year')}"
th:errors="*{year}">Invalid year value</div>
</div>
<div class="form-group bookform-section">
<label for="fname"
th:text="${#messages.msgOrNull('book.price')} ?: 'book.price'">
book.price
</label>
<div class="input-group mb-2">
<div class="input-group-prepend">
<div class="input-group-text"
th:text="${#messages.msgOrNull('page.symbols.currency')} ?: 'page.symbols.currency'">
page.symbols.currency
</div>
</div>
<input class="form-control" type="text" th:field="*{price}" placeholder="Book price"/>
</div>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.price')} ?: 'book.desc.set.price'">
book.desc.set.price
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.price')} ?: 'book.desc.example.price'">
book.desc.example.price
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('price')}"
th:errors="*{price}">Invalid price value</div>
</div>
<div class="form-group bookform-section">
<label for="BookCategory"
th:text="${#messages.msgOrNull('book.category')} ?: 'book.category'">
book.category
</label>
<select class="form-control" th:field="*{category}" th:selected="*{category}">
<option
th:each="category : ${categories}"
th:value="${category.id}"
th:text="${category.name}"
>(obj) category.name</option>
<option value=""
<div>
<h3 th:text="${#messages.msgOrNull('book.author')} ?: 'book.author'">
book.author
</h3>
</div>
<div class="form-group row">
<div class="col">
<label for="BookAuthor"
th:text="${#messages.msgOrNull('book.author.firstName')} ?: 'book.author.firstName'">
book.author.firstName
</label>
<input class="form-control" type="text" th:field="*{author.firstName}" placeholder="Book author first name"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.author.firstname')} ?: 'book.desc.set.author.firstname'">
book.desc.set.author.firstname
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.author.firstname')} ?: 'book.desc.example.author.firstname'">
book.desc.example.author.firstname
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author.firstName')}"
th:errors="*{author.firstName}">Invalid author first name value</div>
</div>
<div class="col">
<label for="BookAuthor"
th:text="${#messages.msgOrNull('book.author.lastName')} ?: 'book.author.lastName'">
book.author.lastName
</label>
<input class="form-control" type="text" th:field="*{author.lastName}" placeholder="Book author last name"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.author.lastname')} ?: 'book.desc.set.author.lastname'">
book.desc.set.author.lastname
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.author.lastname')} ?: 'book.desc.example.author.lastname'">
book.desc.example.author.lastname
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('author.lastName')}"
th:errors="*{author.lastName}">Invalid author last name value</div>
</div>
</div>
</div>
<div class="form-group bookform-section">
<label for="BookName"
th:text="${#messages.msgOrNull('book.title')} ?: 'book.title'">
book.title
</label>
<input class="form-control" type="text" th:field="*{title}" placeholder="Book title"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.title')} ?: 'book.desc.set.title'">
book.desc.set.title
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.title')} ?: 'book.desc.example.title'">
book.desc.example.title
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('title')}"
th:errors="*{title}">Invalid title</div>
</div>
<div class="form-group bookform-section">
<label for="BookISBN"
th:text="${#messages.msgOrNull('book.isbn')} ?: 'book.isbn'">
book.isbn
</label>
<input class="form-control" type="text" th:field="*{isbn}" placeholder="Book ISBN code"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.isbn')} ?: 'book.desc.set.isbn'">
book.desc.set.isbn
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.isbn')} ?: 'book.desc.example.isbn'">
book.desc.example.isbn
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('isbn')}"
th:errors="*{isbn}">Invalid ISBN code value</div>
</div>
<div class="form-group bookform-section">
<label for="BookYear"
th:text="${#messages.msgOrNull('book.year')} ?: 'book.year'">
book.year
</label>
<input class="form-control" type="text" th:field="*{year}" placeholder="Book publication year (YYYY)"/>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.year')} ?: 'book.desc.set.year'">
book.desc.set.year
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.year')} ?: 'book.desc.example.year'">
book.desc.example.year
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('year')}"
th:errors="*{year}">Invalid year value</div>
</div>
<div class="form-group bookform-section">
<label for="fname"
th:text="${#messages.msgOrNull('book.price')} ?: 'book.price'">
book.price
</label>
<div class="input-group mb-2">
<div class="input-group-prepend">
<div class="input-group-text"
th:text="${#messages.msgOrNull('page.symbols.currency')} ?: 'page.symbols.currency'">
page.symbols.currency
</div>
</div>
<input class="form-control" type="text" th:field="*{price}" placeholder="Book price"/>
</div>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.price')} ?: 'book.desc.set.price'">
book.desc.set.price
</small>
<small style="display: inline-block;" class="form-text text-info"
th:text="(${#messages.msgOrNull('book.desc.example.headertext')} ?: 'book.desc.example.headertext') + ': '">
book.desc.example.headertext:
</small>
<small style="display: inline-block;" class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.example.price')} ?: 'book.desc.example.price'">
book.desc.example.price
</small>
<div class="alert alert-danger mt-2" th:if="${#fields.hasErrors('price')}"
th:errors="*{price}">Invalid price value</div>
</div>
<div class="form-group bookform-section">
<label for="BookCategory"
th:text="${#messages.msgOrNull('book.category')} ?: 'book.category'">
book.category
</label>
<select class="form-control" th:field="*{category}" th:selected="*{category}">
<option
th:each="category : ${categories}"
th:value="${category.id}"
th:text="${category.name}"
>(obj) category.name</option>
<option value=""
th:text="${#messages.msgOrNull('book.null.category')} ?: 'book.null.category'">
book.null.category
</option>
</select>
</select>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.category')} ?: 'book.desc.set.category'">
book.desc.set.category
</small>
<small class="form-text text-muted"
th:text="${#messages.msgOrNull('book.desc.set.category')} ?: 'book.desc.set.category'">
book.desc.set.category
</small>
</div>
</div>
<button class="btn btn-primary" type="submit"
th:text="${#messages.msgOrNull('button.book.edit')} ?: 'button.book.edit'">
button.book.edit
</button>
<button class="btn btn-primary" type="submit"
th:text="${#messages.msgOrNull('button.book.edit')} ?: 'button.book.edit'">
button.book.edit
</button>
</form>
</form>
<br>
<br>
<a class="btn btn-success" th:href="@{../__${listpage}__}"
<a class="btn btn-success" th:href="@{../__${listpage}__}"
th:text="${#messages.msgOrNull('button.page.list.return')} ?: 'button.page.list.return'">
button.page.list.return
</a>
</div>
</div>
</body>
</html>

+ 48
- 48
bookstore/src/main/resources/templates/booklist.html View File

@ -1,47 +1,47 @@
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!--/*
<!--/*
Idea of the following syntax used in this and other HTML document:
<foo th:text="${#messages.msgOrNull('<key_from_messages.properties>')} ?: 'myThymeleafText'">
myHTMLPlainText
</foo>
<foo th:text="${#messages.msgOrNull('<key_from_messages.properties>')} ?: 'myThymeleafText'">
myHTMLPlainText
</foo>
-> A) In Thymeleaf, we check if a message key exists. In normal cases, a non-existent key is NOT null.
Therefore, we use method msgorNull and enforce null value if the message key is not found.
Therefore, we use method msgorNull and enforce null value if the message key is not found.
-> B) IF key is null: in section '?: myThymeleafText' we use text 'myThymeleafText' as a replacement
value for the HTML tag string value.
value for the HTML tag string value.
-> C) The last string value 'myHTMLPlainText' between tags is used if we open plain HTML file without
Thymeleaf rendering. This is useful for offline viewing and for developers who want correct file
rendering without Java overhead.
Thymeleaf rendering. This is useful for offline viewing and for developers who want correct file
rendering without Java overhead.
*/-->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!--/*
<!--/*
CSS href fields:
Plain HTML rendering gets CSS style files directly from the relative file system path.
This is useful for offline viewing and for developers who want correct file
rendering without Java overhead.
Instead, Thymeleaf template engine gets CSS style files via URI refs. Therefore, values of
href and th:href differ. However, both use cases are covered: Thymeleaf & plain HTML.
Plain HTML rendering gets CSS style files directly from the relative file system path.
This is useful for offline viewing and for developers who want correct file
rendering without Java overhead.
*/-->
Instead, Thymeleaf template engine gets CSS style files via URI refs. Therefore, values of
href and th:href differ. However, both use cases are covered: Thymeleaf & plain HTML.
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
*/-->
<title th:text="${#messages.msgOrNull('page.title.browser.list')} ?: 'page.title.browser.list'">
page.title.browser.list
</title>
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<title th:text="${#messages.msgOrNull('page.title.browser.list')} ?: 'page.title.browser.list'">
page.title.browser.list
</title>
</head>
<body>
@ -66,41 +66,41 @@ Idea of the following syntax used in this and other HTML document:
</tr>
<tr th:each="book : ${books}">
<!--/*
Check if book.author exists. If yes, then:
|-> Check if firstName exists. If yes, then:
| Set author first name
| else:
| Set empty string for first name
|----------
|-> Check if lastName exists, if yes, then:
| Set author last name
| else:
| Set empty string for last name
##########
else:
|-> Check if book.null.author exists. If yes, then:
| Get value from book.null.author message key
| else:
| Author is string value 'book.null.author'
|-> Check if firstName exists. If yes, then:
| Set author first name
| else:
| Set empty string for first name
|----------
|-> Check if lastName exists, if yes, then:
| Set author last name
| else:
| Set empty string for last name
##########
else:
|-> Check if book.null.author exists. If yes, then:
| Get value from book.null.author message key
| else:
| Author is string value 'book.null.author'
*/-->
<td th:text="${book.author != null} ? ( (${book.author.firstName != null} ? (${book.author.firstName} + ' ') : '') + (${book.author.lastName != null} ? ${book.author.lastName} : '') ) : (${#messages.msgOrNull('book.null.author')} ?: 'book.null.author')">(obj) book.author.firstName (obj) book.author.lastName</td>
<td th:text="${book.title}">(obj) book.title</td>
<td th:text="${book.isbn}">(obj) book.isbn</td>
<td th:text="${book.year}">(obj) book.year</td>
<!--/*
Check if book.category exists (book entity object). If yes, then:
Get string value of book.category.name (book entity object (method))
Get string value of book.category.name (book entity object (method))
else:
|-> Check if book.null.category (message key) exists. If yes, then:
| Get string value of book.null.category message key
| else:
| Category is string value 'book.null.category'
|-> Check if book.null.category (message key) exists. If yes, then:
| Get string value of book.null.category message key
| else:
| Category is string value 'book.null.category'
*/-->
<td th:text="${book.category != null} ? ${book.category.name} : (${#messages.msgOrNull('book.null.category')} ?: 'book.null.category')">(obj) book.category.name</td>
@ -108,7 +108,7 @@ Idea of the following syntax used in this and other HTML document:
<!--/*
Get book price with two decimal precision.
If price is not found, fall back to string value 0.00.
Combine with message key 'page.symbols.currency' value.
*/-->
@ -132,7 +132,7 @@ Idea of the following syntax used in this and other HTML document:
page.text.list.edit
</a>
</td>
<td>
<a class="btn btn-info"
th:href="@{__${restpage}__/book/{id}(id=${book.id})}"


+ 7
- 7
bookstore/src/main/resources/templates/error.html View File

@ -1,14 +1,14 @@
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bookstore.css" th:href="@{../css/bookstore.css}" />
<link type="text/css" rel="stylesheet" href="../static/css/bootstrap.min.css" th:href="@{../css/bootstrap.min.css}" />
<title th:text="${#messages.msgOrNull('page.title.browser.error')} ?: 'page.title.browser.error'">
page.title.browser.error
</title>
<title th:text="${#messages.msgOrNull('page.title.browser.error')} ?: 'page.title.browser.error'">
page.title.browser.error
</title>
</head>
<body>
@ -22,4 +22,4 @@
</div>
</div>
</body>
</html>
</html>

Loading…
Cancel
Save