view mod_invites_register_web/html/register.html @ 4976:75b6e5df65f9

various: Improve error reporting if missing file server module on 0.12 If there is some error loading net.http.files then it would be swallowed by the pcall and then it would proceed to trying mod_http_files, which might cause unexpected behavior on 0.12 Ref #1765
author Kim Alvefur <zash@zash.se>
date Mon, 18 Jul 2022 22:47:54 +0200
parents 15cf32e666da
children
line wrap: on
line source

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>{site_name}</title>
	<link rel="stylesheet" href="/share/bootstrap4/css/bootstrap.min.css">
	<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
	<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
	<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
	<link rel="manifest" href="/site.webmanifest">
	<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
	<meta name="msapplication-TileColor" content="#fbd308">
	<meta name="theme-color" content="#fbd308">
</head>
<body>
	<div id="background" class="fixed-top overflow-hidden" aria-role="none presentation"></div>
	<div id="form" class="container col-md-8 col-md-offset-2 col-sm-8 cold-sm-offset-2 col-lg-6 col-lg-offset-3 mt-2 mt-md-5">
		<div class="card rounded-lg shadow">
			<h1 class="card-header rounded-lg rounded-lg">
				Register on {site_name}<br/>
			</h1>
			<div class="card-body" >
				<p>{site_name} is part of XMPP, a secure and decentralized messaging network. To begin
				chatting {app&using {app.name} }you need to first register an account.</p>

				<p>Creating an account will allow to communicate with {inviter&{inviter} and }other
				people on {site_name} and other services on the XMPP network.</p>

				{app&{app.supports_preauth_uri&
				<div class="alert alert-info">
					<p>If you already have {app.name} installed,
					we recommend that you continue the account creation process using the app
					by clicking on the button below:</p>

					<h6 class="text-center">{app.name} already installed?</h6>

					<div class="text-center">
						<a href="{uri}"><button class="btn btn-secondary btn-sm">Open the app</button></a><br/>
						<small class="text-muted">This button works only if you have the app installed already!</small>
					</div>
					<br/>
				</div>
				}}

				<h5 class="card-title">Create an account</h5>

				{message&<div class="alert {msg_class?alert-info}" role="alert">
				  {message}
				</div>}

				<form method="post">
					<div class="form-group form-row">
						<label for="user" class="col-md-4 col-lg-12 col-form-label">Username:</label>
						<div class="col-md-8 col-lg-12">
							<div class="input-group">
								<input
								       type="text" name="user" class="form-control" aria-describedby="usernameHelp"
								       required autofocus minlength="1" maxlength="30" length="30"
								>
								<div class="input-group-append">
									<span class="input-group-text">@{domain}</span>
								</div>
							</div>
							<small id="usernameHelp" class="d-block form-text text-muted">Choose a username, this will become the first part of your new chat address.</small>
						</div>
					</div>
					<div class="form-group form-row">
						<label for="password" class="col-md-4 col-lg-12 col-form-label">Password:</label>
						<div class="col-md-8 col-lg-12">
							<input type="password" name="password" class="form-control" aria-describedby="passwordHelp"
							       autocomplete="new-password" required minlength="{password_policy.length}"
							>
							<small id="passwordHelp" class="form-text text-muted">Enter a secure password that you do not use anywhere else.</small>
						</div>
					</div>
					<div class="form-group form-row">
						<input type="hidden" name="token" value="{token}">
						{app&<input type="hidden" name="app_id" value="{app.id}">}
						<button type="submit" class="btn btn-primary btn-lg">Submit</button>
					</div>
				</form>
			</div>
		</div>
	</div>
	<script src="/share/jquery/jquery.min.js"></script>
	<script src="/share/bootstrap4/js/bootstrap.min.js"></script>
</body>
</html>