Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Users accessing yuuvis® Momentum via a browser have to select their tenant before their credentials are requested. This tenant selection web page is provided by the AUTHENTICATION Service. In order to customize the design, it is possible to replace the underlying default form files by a set of custom form files. There are different ways to proceed:

  • Kubernetes ConfigMaps
  • Manual replacement after starting the pod
  • A custom Docker image with the custom form files in a separated layer
  • Integration of the custom form files via Kubernetes Volumes

In all cases, a

Required Sources

A directory public has to be available in the root of the AUTHENTICATION service's container when the service is started. In this public directory, there must be at least the files tenant.html and error.html.

In the tenant.html file, the reference on http://www.thymeleaf.org (line 2) and the corresponding form definition are required (lines 11-12) in order to provide the tenant selection functionality.

Code Block
languagexml
titleExample 'tenant.html'
linenumberstrue
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
	<head>
		<meta charset="utf-8" />
		<link rel="stylesheet" type="text/css" href="res/tenant.css" />
	</head>
	<body>
		<span id="container">
			<span>
				<h3>Type in your tenant.</h3><br>
				<form id="tenant" th:action="@{/tenant}" method="post">
					<input type="text" name="tenant" placeholder="Tenant" /><br>
					<img src="res/next-btn.svg" onclick="document.getElementById('tenant').submit()">
				</form>
			</span>
		</span>
	</body>
</html>

In the error.html file, the reference on http://www.thymeleaf.org (line 2) and the three span definitions are required (lines 8-10) in order to provide error details.

Code Block
languagexml
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="utf-8" />
</head>
	<body>
		An error has occurred <br /><br />
		<span th:text="${status}" /> (<span th:text="${reason}" />) <br />
		<span th:utext="${message}" /> <br />
		<span th:text="'timestamp: '+${timestamp}" style="display: none" />
	</body>
</html>

The usage of resource files is possible if they are located in the sub directory /public/res/ or if they are stored by a client application.

The example custom form files used in this article are available for download as public.zip file.
>> Download example 'public.zip'

Possible Procedures

There are different ways to proceed:

  • Kubernetes ConfigMaps
  • Manual replacement after starting the pod
  • A custom Docker image with the custom form files in a separated layer
  • Integration of the custom form files via Kubernetes Volumes

In this article, only the first procedure via Kubernetes ConfigMaps is described. The replacement of the default form files is explained by means of a simple example.

Configuration

...

via Kubernetes ConfigMaps

By following these steps, you configure a simple custom web page for the tenant selection dialog:

...