Translate setupAccount view

This commit is contained in:
Johannes Zellner
2020-11-19 11:33:46 +01:00
parent 2e12d1765a
commit 1d57d4d9a4
3 changed files with 91 additions and 23 deletions

View File

@@ -13,7 +13,7 @@
<link type="text/css" rel="stylesheet" href="/theme.css">
<!-- Fontawesome -->
<link type="text/css" rel="stylesheet" href="/3rdparty/fontawesome/css/all.css?<%= revision %>"/>
<link type="text/css" rel="stylesheet" href="/3rdparty/fontawesome/css/all.css"/>
<!-- jQuery-->
<script type="text/javascript" src="/3rdparty/js/jquery.min.js"></script>
@@ -29,13 +29,20 @@
<script type="text/javascript" src="/3rdparty/js/angular-loader.min.js"></script>
<!-- <script type="text/javascript" src="/3rdparty/js/angular-md5.min.js"></script> -->
<!-- <script type="text/javascript" src="/3rdparty/js/angular-ui-notification.js"></script> -->
<script type="text/javascript" src="/3rdparty/js/angular-cookies.min.js"></script>
<script type="text/javascript" src="/3rdparty/js/autofill-event.js"></script>
<!-- Angular directives for bootstrap https://angular-ui.github.io/bootstrap/ -->
<script type="text/javascript" src="/3rdparty/js/ui-bootstrap-tpls-1.3.3.min.js"></script>
<!-- Showdown (markdown converter) -->
<script type="text/javascript" src="/3rdparty/js/showdown-1.9.1.min.js?<%= revision %>"></script>
<script type="text/javascript" src="/3rdparty/js/showdown-1.9.1.min.js"></script>
<!-- Angular translate https://angular-translate.github.io/ -->
<script type="text/javascript" src="/3rdparty/js/angular-translate.min.js"></script>
<script type="text/javascript" src="/3rdparty/js/angular-translate-loader-static-files.min.js"></script>
<script type="text/javascript" src="/3rdparty/js/angular-translate-storage-cookie.min.js"></script>
<script type="text/javascript" src="/3rdparty/js/angular-translate-storage-local.min.js"></script>
<!-- Setup Application -->
<script type="text/javascript" src="/js/setupaccount.js"></script>
@@ -52,8 +59,8 @@
<div class="col-md-12" style="text-align: center;">
<img width="128" height="128" style="margin-top: -84px" src="<%= apiOrigin %>/api/v1/cloudron/avatar"/>
<br/>
<h1><small>Welcome to</small> {{ status.cloudronName || 'Cloudron' }}</h1>
<h3>Please setup your account</h3>
<h1><small>{{ 'setupAccount.welcomeTo' | tr }}</small> {{ status.cloudronName || 'Cloudron' }}</h1>
<h3>{{ 'setupAccount.description' | tr }}</h3>
</div>
</div>
<br/>
@@ -68,37 +75,37 @@
<input type="password" style="display: none;">
<div class="form-group" ng-class="{ 'has-error': ((setupAccountForm.username.$dirty && setupAccountForm.username.$invalid) || (!setupAccountForm.username.$dirty && error.username))}">
<label class="control-label">Username</label>
<label class="control-label" for="inputUsername">{{ 'setupAccount.username' | tr }}</label>
<div class="control-label" ng-show="setupAccountForm.username.$dirty && setupAccountForm.username.$invalid">
<small ng-show="setupAccountForm.username.$error.minlength">The username is too short</small>
<small ng-show="setupAccountForm.username.$error.maxlength">The username is too long</small>
<small ng-show="setupAccountForm.username.$dirty && setupAccountForm.username.$invalid">Not a valid username</small>
<small ng-show="setupAccountForm.username.$error.minlength">{{ 'setupAccount.errorUsernameTooShort' | tr }}</small>
<small ng-show="setupAccountForm.username.$error.maxlength">{{ 'setupAccount.errorUsernameTooLong' | tr }}</small>
<small ng-show="setupAccountForm.username.$dirty && setupAccountForm.username.$invalid">{{ 'setupAccount.errorUsernameInvalid' | tr }}</small>
</div>
<input type="text" class="form-control" ng-model="username" name="username" id="inputUsername" ng-disabled="profileLocked || existingUsername" required autofocus>
</div>
<div class="form-group">
<label class="control-label">Full Name</label>
<input type="displayName" class="form-control" ng-model="displayName" name="displayName" ng-disabled="profileLocked" required>
<label class="control-label" for="inputDisplayName">{{ 'setupAccount.fullName' | tr }}</label>
<input type="displayName" class="form-control" ng-model="displayName" name="displayName" id="inputDisplayName" ng-disabled="profileLocked" required>
</div>
<div class="form-group" ng-class="{ 'has-error': (setupAccountForm.password.$dirty && setupAccountForm.password.$invalid) }">
<label class="control-label">New Password</label>
<label class="control-label" for="inputPassword">{{ 'setupAccount.password' | tr }}</label>
<div class="control-label" ng-show="setupAccountForm.password.$dirty && setupAccountForm.password.$invalid">
<small ng-show="setupAccountForm.password.$dirty && setupAccountForm.password.$invalid">Password must be at least 8 characters</small>
<small ng-show="setupAccountForm.password.$dirty && setupAccountForm.password.$invalid">{{ 'setupAccount.errorPassword' | tr }}</small>
</div>
<input type="password" class="form-control" ng-model="password" name="password" ng-pattern="/^.{8,}$/" required>
<input type="password" class="form-control" ng-model="password" name="password" id="inputPassword" ng-pattern="/^.{8,}$/" required>
</div>
<div class="form-group" ng-class="{ 'has-error': (setupAccountForm.passwordRepeat.$dirty && (password !== passwordRepeat)) }">
<label class="control-label">Repeat Password</label>
<label class="control-label" for="inputPasswordRepeat">{{ 'setupAccount.passwordRepeat' | tr }}</label>
<div class="control-label" ng-show="setupAccountForm.passwordRepeat.$dirty && (password !== passwordRepeat)">
<small ng-show="setupAccountForm.passwordRepeat.$dirty && (password !== passwordRepeat)">Passwords don't match</small>
<small ng-show="setupAccountForm.passwordRepeat.$dirty && (password !== passwordRepeat)">{{ 'setupAccount.errorPasswordNoMatch' | tr }}</small>
</div>
<input type="password" class="form-control" ng-model="passwordRepeat" name="passwordRepeat" required>
<input type="password" class="form-control" ng-model="passwordRepeat" name="passwordRepeat" id="inputPasswordRepeat" required>
</div>
<button class="btn btn-primary btn-outline pull-right" type="submit" ng-disabled="busy || setupAccountForm.$invalid || password !== passwordRepeat"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> Setup</button>
<button class="btn btn-primary btn-outline pull-right" type="submit" ng-disabled="busy || setupAccountForm.$invalid || password !== passwordRepeat"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> {{ 'setupAccount.setupAction' | tr }}</button>
</form>
</div>
</div>
@@ -111,9 +118,9 @@
<div class="col-md-12" style="text-align: center;">
<img width="128" height="128" style="margin-top: -84px" src="<%= apiOrigin %>/api/v1/cloudron/avatar"/>
<br/>
<h2>Invalid or Expired Invite Link</h2>
<h2>{{ 'setupAccount.invalidToken.title' | tr }}</h2>
<br/>
<p>Contact your server admin to get a new invite link.</p>
<p>{{ 'setupAccount.invalidToken.description' | tr }}</p>
</div>
</div>
</div>
@@ -125,9 +132,9 @@
<div class="col-md-12" style="text-align: center;">
<img width="128" height="128" style="margin-top: -84px" src="<%= apiOrigin %>/api/v1/cloudron/avatar"/>
<br/>
<h2>Your Account is ready</h2>
<h2>{{ 'setupAccount.success.title' | tr }}</h2>
<br/>
<a href="/" class="btn btn-primary">Open Dashboard</a>
<a href="/" class="btn btn-primary">{{ 'setupAccount.success.openDashboardAction' | tr }}</a>
</div>
</div>
</div>