220 lines
13 KiB
HTML
220 lines
13 KiB
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
<head>
|
||
<meta name="viewport" content="width=device-width">
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||
<meta name="robots" content="noindex,nofollow">
|
||
<title>Allerta › {{ 'installation'|t }}</title>
|
||
<link rel="stylesheet" id="dashicons-css" href="dashicons.min.css?installation" type="text/css" media="all">
|
||
<link rel="stylesheet" id="buttons-css" href="buttons.min.css?installation" type="text/css" media="all">
|
||
<link rel="stylesheet" id="forms-css" href="forms.min.css?installation" type="text/css" media="all">
|
||
<link rel="stylesheet" id="install-css" href="install.min.css?installation" type="text/css" media="all">
|
||
<script async="" src="zxcvbn.js"></script>
|
||
</head>
|
||
<body class="wp-core-ui">
|
||
<p id="logo">
|
||
<a href="javascript:alert('TODO: add docs');">Allerta</a>
|
||
</p>
|
||
{% if step == 1 and not configOk %}
|
||
<h1 class="screen-reader-text">{{ 'Before starting'|t }}</h1>
|
||
<p>{{ 'Welcome in Allerta. We need some informations about the database. You have to know the following informations:'|t }}
|
||
</p>
|
||
<ol>
|
||
<li>{{ 'DB name'|t }}</li>
|
||
<li>{{ 'DB username'|t }}</li>
|
||
<li>{{ 'DB password'|t }}</li>
|
||
<li>{{ 'DB host'|t }}</li>
|
||
<li>{{ 'DB prefix'|t }}</li>
|
||
</ol>
|
||
<p>
|
||
{{ 'We will use this informations for creating a file'|t }} <code>config.php</code>. <strong>
|
||
{{ "If for any reason automatic file creation doesn't work, don't worry. You can just open %s in a text editor, enter your details, and save it as"|t|format('<code>config-sample.php</code>')|raw }}
|
||
<code>config.php</code>. </strong>
|
||
</p>
|
||
<p>{{ "In all likelihood, this information has already been provided to you by your hosting provider. If you don't have this information, you'll need to contact your provider before you can continue. But if everything is ready..."|t }}
|
||
</p>
|
||
<p class="step">
|
||
<form method="POST">
|
||
<input type="hidden" name="step" value="2">
|
||
<input type="submit" value="{{ 'Submit'|t }}" class="button button-large">
|
||
</form>
|
||
</p>
|
||
{% elseif step == 2 %}
|
||
<h1 class="screen-reader-text">{{ "Configure the database connection"|t }}</h1>
|
||
<form method="post">
|
||
<p>{{ "Below you can enter your database connection details. If you are not sure of the data to enter, contact your hosting provider"|t }}.
|
||
</p>
|
||
<table class="form-table" role="presentation">
|
||
<tbody>
|
||
<tr>
|
||
<th scope="row"><label for="dbname">{{ "DB name"|t }}</label></th>
|
||
<td><input name="dbname" id="dbname" type="text" aria-describedby="dbname-desc" size="25"
|
||
value="{{ dbConfig.dbname }}" autofocus=""></td>
|
||
<td id="dbname-desc">{{ "The name of the database you want to use with Allerta"|t }}.</td>
|
||
</tr>
|
||
<tr>
|
||
<th scope="row"><label for="uname">{{ "DB username"|t }}</label></th>
|
||
<td><input name="uname" id="uname" type="text" aria-describedby="uname-desc" size="25"
|
||
value="{{ dbConfig.user }}"></td>
|
||
<td id="uname-desc">{{ "Your"|t }} {{ "DB username"|t }}.</td>
|
||
</tr>
|
||
<tr>
|
||
<th scope="row"><label for="pwd">{{ "DB password"|t }}</label></th>
|
||
<td><input name="pwd" id="pwd" type="text" aria-describedby="pwd-desc" size="25"
|
||
value="{{ dbConfig.pwd }}" autocomplete="off"></td>
|
||
<td id="pwd-desc">{{ "Your"|t }} {{ "DB password"|t }}.</td>
|
||
</tr>
|
||
<tr>
|
||
<th scope="row"><label for="dbhost">{{ "DB host"|t }}</label></th>
|
||
<td><input name="dbhost" id="dbhost" type="text" aria-describedby="dbhost-desc" size="25"
|
||
value="{{ dbConfig.host }}"></td>
|
||
<td id="dbhost-desc">
|
||
{{ "If %s doesn't work, you can get this information from your hosting provider"|t|format("<code>localhost</code>")|raw }}
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th scope="row"><label for="prefix">{{ "DB prefix"|t }}</label></th>
|
||
<td><input name="prefix" id="prefix" type="text" aria-describedby="prefix-desc" value="{{ dbConfig.prefix }}"
|
||
size="25"></td>
|
||
<td id="prefix-desc">
|
||
{{ "Edit this item if you want to perform multiple Alert installations on a single database"|t }}.
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<input type="hidden" name="step" value="3">
|
||
<p class="step"><input name="submit" type="submit" value="{{ "Submit"|t }}" class="button button-large"></p>
|
||
</form>
|
||
{% elseif step == 3 %}
|
||
<h1 class="screen-reader-text">{{ "Configuration file created successfully!"|t }}</h1>
|
||
<p>{{ "Great job, man!"|t }} {{ "You have completed this part of the installation. Allerta can now communicate with the database"|t }}<br>{{ "If you are ready, it's time to..."|t }}</p>
|
||
<p class="step">
|
||
<form method="POST">
|
||
<input type="hidden" name="step" value="4">
|
||
<input type="submit" class="button button-large" value="{{ 'Populate DB'|t }}">
|
||
</form>
|
||
</p>
|
||
{% elseif configOk and not populated %}
|
||
<h1 class="screen-reader-text">{{ "Hurray!"|t }}</h1>
|
||
<p>{{ "You are almost finished installing Allerta, you just need to enter some information"|t }}.</p>
|
||
<h2>{{ "Necessary informations:"|t }}</h2>
|
||
<p class="step">
|
||
<form id="setup" method="post">
|
||
<script>
|
||
function validatePwd() {
|
||
var pwd = document.getElementById("pass1").value;
|
||
result = zxcvbn(pwd);
|
||
switch (result.score) {
|
||
case 0:
|
||
document.getElementById("pass1").className = "short";
|
||
document.getElementById("pass-strength-result").className = "short";
|
||
document.getElementById("pass-strength-result").innerHTML = "{{ 'Very weak'|t }}";
|
||
break;
|
||
case 1:
|
||
document.getElementById("pass1").className = "bad";
|
||
document.getElementById("pass-strength-result").className = "bad";
|
||
document.getElementById("pass-strength-result").innerHTML = "{{ 'Weak'|t }}";
|
||
break;
|
||
case 2:
|
||
document.getElementById("pass1").className = "good";
|
||
document.getElementById("pass-strength-result").className = "good";
|
||
document.getElementById("pass-strength-result").innerHTML = "{{ 'Good'|t }}";
|
||
break;
|
||
case 3:
|
||
document.getElementById("pass1").className = "strong";
|
||
document.getElementById("pass-strength-result").className = "strong";
|
||
document.getElementById("pass-strength-result").innerHTML = "{{ 'Strong'|t }}";
|
||
break;
|
||
case 4:
|
||
document.getElementById("pass1").className = "strong";
|
||
document.getElementById("pass-strength-result").className = "strong";
|
||
document.getElementById("pass-strength-result").innerHTML = "{{ 'Very strong'|t }}";
|
||
break;
|
||
default:
|
||
document.getElementById("pass1").className = "short";
|
||
document.getElementById("pass-strength-result").className = "short";
|
||
document.getElementById("pass-strength-result").innerHTML = "{{ 'Very weak'|t }}";
|
||
break;
|
||
}
|
||
}
|
||
</script>
|
||
<table class="form-table" role="presentation">
|
||
<tbody>
|
||
<tr>
|
||
<th scope="row"><label for="user_login">{{ "Admin username"|t }}</label></th>
|
||
<td>
|
||
<input name="user_name" type="text" id="user_login" size="75" value="">
|
||
<p>{{ "Usernames can only contains alphanumeric characters, spaces, underscores, dashes, periods, and the @ symbol"|t }}.
|
||
</p>
|
||
</td>
|
||
</tr>
|
||
<tr class="form-field form-required user-pass1-wrap">
|
||
<th scope="row">
|
||
<label for="pass1">
|
||
{{ "Password"|t }}</label>
|
||
</th>
|
||
<td>
|
||
<div class="wp-pwd">
|
||
<input type="text" name="admin_password" id="pass1" class="regular-text short"
|
||
autocomplete="off" aria-describedby="pass-strength-result" onkeyup="validatePwd()">
|
||
<div id="pass-strength-result" aria-live="polite" class="short">{{ "Very weak"|t }}
|
||
</div>
|
||
</div>
|
||
<p><span class="description important">
|
||
<strong>{{ "Important:"|t }}</strong>
|
||
{{ "You will need this password to log in. Keep it in a safe place"|t }}.</span></p>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th scope="row">{{ "Is admin visible?"|t }}</th>
|
||
<td>
|
||
<fieldset>
|
||
<legend class="screen-reader-text"><span>{{ "Make admin user visible"|t }}</span>
|
||
</legend>
|
||
<label for="admin_visible"><input name="admin_visible" type="checkbox"
|
||
id="admin_visible" value="0">
|
||
{{ "Make admin user visible"|t }} {{ "to other users"|t }}</label>
|
||
<p class="description">
|
||
{{ "By activating this option, the user that will be created will be visible in lists and procedures"|t }}.
|
||
</p>
|
||
</fieldset>
|
||
</td>
|
||
</tr>
|
||
<tr style="display:none">
|
||
<th scope="row">{{ "Add developer permissions to admin user"|t }}</th>
|
||
<td>
|
||
<fieldset>
|
||
<label for="developer"><input name="developer" type="checkbox" id="developer" value="0">
|
||
{{ "Add developer permissions to admin user"|t }}</label>
|
||
<p class="description">
|
||
{{ "By activating this option, the user will be able to debug Allerta"|t }}.</p>
|
||
</fieldset>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th scope="row"><label for="admin_email">{{ "Your email"|t }}</label></th>
|
||
<td><input name="admin_email" type="email" id="admin_email" size="50" value="">
|
||
<p>{{ "Please check your email address carefully before continuing"|t }}.</p>
|
||
</td>
|
||
</tr>
|
||
<tr>
|
||
<th scope="row"><label for="owner">{{ "Owner"|t }}</label></th>
|
||
<td><input name="owner" type="text" id="owner" size="100" value="">
|
||
<p>{{ "It will be used in reports"|t }}.</p>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<p class="step"><input type="submit" name="Submit" id="submit" class="button button-large"
|
||
value="{{ 'Install Allerta'|t }}"></p>
|
||
<input type="hidden" name="step" value="5">
|
||
</form>
|
||
</p>
|
||
{% elseif step == 5 %}
|
||
<h1 class="screen-reader-text">{{ "Installation completed successfully"|t }}.</h1>
|
||
<p>{{ "Great job, man!"|t }} {{ "You have completed the installation. Allerta can now function properly"|t }} <br> {{ "If you are ready, it's time to..."|t }}</p>
|
||
<p class="step">
|
||
<a href="../index.php" class="login">{{ "Login"|t }}</a>
|
||
</p>
|
||
{% endif %}
|
||
</body>
|
||
</html> |