You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
140 lines
6.7 KiB
140 lines
6.7 KiB
<div class="row">
|
|
<div class="col-md-12">
|
|
<h1><span class="glyphicon glyphicon-user" aria-hidden="true"></span> Create new account</h1>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
|
|
<form method="post" id="create-form" action="/account/create">
|
|
<input type="hidden" name="_csrf" value="{{csrfToken}}">
|
|
<input type="hidden" id="domain" name="domain" value="{{values.domain}}">
|
|
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h3 class="panel-title">Account information</h3>
|
|
</div>
|
|
<div class="panel-body">
|
|
|
|
<p>
|
|
Enter your account details. Account username is allowed to include latin characters only. Activated accounts can add extra identity addresses that may contain unicode characters as well.
|
|
</p>
|
|
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
|
|
<div class="form-group{{#if errors.name}} has-error{{/if}}">
|
|
<label for="name">Your name</label>
|
|
<input type="text" class="form-control" name="name" id="name" placeholder="eg. "Jaan Tamm"" value="{{values.name}}" required>
|
|
{{#if errors.name}}
|
|
<span class="help-block">{{errors.name}}</span>
|
|
{{/if}}
|
|
</div>
|
|
|
|
<div class="form-group{{#if errors.username}} has-error{{/if}}">
|
|
<label for="name">Your new address (also the username)</label>
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" name="username" id="username" placeholder="eg. "username" or "user.name"" value="{{values.username}}" pattern="^[A-Za-z0-9][A-Za-z\-\.0-9]*$" required>
|
|
|
|
<span class="input-group-btn">
|
|
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
@<span class="selected-domain" style="text-transform: lowercase;">{{values.domain}}</span><span class="caret"></span>
|
|
</button>
|
|
<ul class="dropdown-menu dropdown-menu-right">
|
|
{{#each domains}}
|
|
<li><a href="#" class="change-domain-link" data-domain="{{this}}">{{this}}</a></li>
|
|
{{/each}}
|
|
</ul>
|
|
</span>
|
|
</div>
|
|
|
|
{{#if errors.username}}
|
|
<span class="help-block">{{errors.username}}</span>
|
|
{{else}}
|
|
<span class="help-block">Latin letters and numbers only. Dots and dashes are allowed as separators.<span>
|
|
{{/if}}
|
|
</div>
|
|
|
|
<div class="form-group{{#if errors.password}} has-error{{/if}}">
|
|
<label for="password">Your password</label>
|
|
<input type="password" class="form-control" name="password" id="password" placeholder="eg. "supersecret"" required>
|
|
{{#if errors.password}}
|
|
<span class="help-block">{{errors.password}}</span>
|
|
{{/if}}
|
|
</div>
|
|
|
|
<div class="form-group{{#if errors.password}} has-error{{/if}}">
|
|
<label for="password2">Repeat password</label>
|
|
<input type="password" class="form-control" name="password2" id="password2" placeholder="repeat password" required>
|
|
</div>
|
|
|
|
<div class="form-group{{#if errors.remember}} has-error{{/if}}">
|
|
<div class="checkbox">
|
|
<label>
|
|
<input type="checkbox" name="remember" required> Agree to <a href="/tos" target="_blank">terms of service</a>
|
|
{{#if errors.remember}}
|
|
<span class="help-block">{{errors.remember}}</span>
|
|
{{/if}}
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
{{#if recaptcha}}
|
|
<button
|
|
class="g-recaptcha btn btn-success"
|
|
data-sitekey="{{recaptcha}}"
|
|
data-callback="onCreateSubmit">
|
|
<span class="glyphicon glyphicon-user" aria-hidden="true"></span>Create new account
|
|
</button>
|
|
{{else}}
|
|
<button type="submit" class="btn btn-success"><span class="glyphicon glyphicon-user" aria-hidden="true"></span>Create new account</button>
|
|
{{/if}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
{{#if recaptcha}}
|
|
<script src='https://www.google.com/recaptcha/api.js'></script>
|
|
|
|
<script>
|
|
function onCreateSubmit(token) {
|
|
document.getElementById("create-form").submit();
|
|
}
|
|
</script>
|
|
{{/if}}
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
|
|
var domainElement = document.getElementById('domain');
|
|
|
|
var updateDomain = function(e,elm){
|
|
e.preventDefault();
|
|
var domain = elm.dataset.domain;
|
|
if(domain){
|
|
domainElement.value = domain;
|
|
document.querySelector('.selected-domain').textContent = domain;
|
|
}
|
|
};
|
|
|
|
var setupDomainButton = function(elm){
|
|
elm.addEventListener('click', function(e){updateDomain(e,elm)}, false);
|
|
elm.addEventListener('touch', function(e){updateDomain(e,elm)}, false);
|
|
}
|
|
|
|
var domainLinks = document.querySelectorAll('.change-domain-link');
|
|
for(var i=0, len = domainLinks.length; i<len; i++){
|
|
setupDomainButton(domainLinks[i]);
|
|
}
|
|
}, false);
|
|
</script>
|