redesign install.php

This commit is contained in:
Tealk 2021-03-19 10:13:23 +01:00
parent 9dfefbfa40
commit 5e7f0fffac
No known key found for this signature in database
GPG Key ID: 5FE349ABC863E7F9
2 changed files with 186 additions and 105 deletions

View File

@ -45,6 +45,11 @@ a:focus {
margin-right: auto;
}
#install .install,
#install form .card:not(:first-child) {
margin-top: 30px;
}
#status-container .input-group:last-child {
margin-bottom: 0px !important;
}
@ -245,10 +250,6 @@ article.card textarea {
padding-bottom: 25px;
}
.install .btn {
margin-top: 30px;
}
#footerwrap .dropdown-menu {
background: gray;
}

View File

@ -169,15 +169,10 @@ if (isset($_POST['server']) && empty($message)) {
}
}
Template::render_header(_("Install"));
?>
<h1 class="text-center"><?php echo _("Prerequisite"); ?></h1>
<summary><?php echo _("If any of the following prerequisites are shown as failed (red X), please correct the issue and reload the page before proceeding with the installation."); ?></summary>
<?php
$php_version_req = sprintf(_("Minimum PHP version %s"), MINIMUM_PHP_VERSION);
$preq_fail = array("remove", "danger");
$preq_ok = array("ok", "success");
$preq_fail = array("times", "danger");
$preq_ok = array("check", "success");
$preq_phpver = $preq_fail;
$preq_mysqlnd = $preq_fail;
@ -202,108 +197,193 @@ if (is_writable(__DIR__)) {
}
?>
<section class="prereq-section clearfix">
<div class="container-fluid">
<div class="row ">
<div class="col-md-6 text-right"><label for="php version"><?php echo $php_version_req; ?></div>
<div class="col-md-6"><a href="#" class="btn btn-<?php echo $preq_phpver[1]; ?>"><span class="glyphicon glyphicon-<?php echo $preq_phpver[0]; ?>"></span></a></div>
<div id="install">
<div class="card">
<div class="card-header text-center">
<?php echo _("Prerequisite"); ?>
</div>
<div class="row ">
<div class="col-md-6 text-right"><label for="mysqlnd Library installed"><?php echo _('PHP mysqlnd library installed'); ?></div>
<div class="col-md-6"><a href="#" class="btn btn-<?php echo $preq_mysqlnd[1]; ?>"><span class="glyphicon glyphicon-<?php echo $preq_mysqlnd[0]; ?>"></span></a></div>
</div>
<div class="row">
<div class="col-md-6 text-right"><label for="write_access"><?php echo _('Write access to web directory'); ?></div>
<div class="col-md-6"><a href="#" class="btn btn-<?php echo $preq_writedir[1]; ?>"><span class="glyphicon glyphicon-<?php echo $preq_writedir[0]; ?>"></span></a></div>
<div class="card-body">
<span class="card-title"><?php echo _("If any of the following prerequisites are shown as failed (red X), please correct the issue and reload the page before proceeding with the installation."); ?></span>
<p class="card-text">
<div class="container">
<div class="row">
<div class="col text-center"><?php echo $php_version_req; ?></div>
<div class="col text-center"><a class="btn btn-<?php echo $preq_phpver[1]; ?>"><i class="fas fa-<?php echo $preq_phpver[0]; ?>"></i></a></div>
</div>
<div class="row mt-1">
<div class="col text-center"><?php echo _('PHP mysqlnd library installed'); ?></div>
<div class="col text-center"><a class="btn btn-<?php echo $preq_mysqlnd[1]; ?>"><i class="fas fa-<?php echo $preq_mysqlnd[0]; ?>"></i></a></div>
</div>
<div class="row mt-1">
<div class="col text-center"><?php echo _('Write access to web directory'); ?></div>
<div class="col text-center"><a class="btn btn-<?php echo $preq_writedir[1]; ?>"><i class="fas fa-<?php echo $preq_writedir[0]; ?>"></i></a></div>
</div>
</div>
</p>
</div>
</div>
</section>
<div class="install">
<h1 class="text-center"><?php echo _("Installation"); ?></h1>
<?php
if (!empty($message)) {
?>
<p class="alert alert-danger"><?php echo $message; ?></p>
<?php
}
?>
<span><?php echo _("We will ask you some basic questions about your website. Most of the settings can be later edited in the config.php file."); ?></span>
<h1 class="text-center"><?php echo _("Installation"); ?></h1>
<?php
if (!empty($message)) {
?>
<p class="alert alert-danger"><?php echo $message; ?></p>
<?php
}
?>
<summary><?php echo _("We will ask you some basic questions about your website. Most of the settings can be later edited in the config.php file."); ?></summary>
<form method="post" action="." class="clearfix install">
<section class="install-section clearfix">
<h2><?php echo _("Website details"); ?></h2>
<summary><?php echo _("We need a name for your status page (shown behind page title after the dash) and a url of your server status installation (i.e. <a href='#'>https://example.com/status</a> - without the trailing slash), so we can mail users link for forgotten password etc..."); ?></summary>
<div class="form-group clearfix">
<div class="col-sm-6"><label for="servername"><?php echo _("Name"); ?>: </label><input type="text" name="servername" value="<?php echo ((isset($_POST['servername'])) ? htmlspecialchars($_POST['servername'], ENT_QUOTES) : ''); ?>" id="servername" placeholder="<?php echo _("Name"); ?>" class="form-control" required></div>
<div class="col-sm-6"><label for="url"><?php echo _("Url"); ?>: </label><input type="url" name="url" value="<?php echo ((isset($_POST['url'])) ? htmlspecialchars($_POST['url'], ENT_QUOTES) : ''); ?>" id="url" placeholder="<?php echo _("Url"); ?>" class="form-control" required></div>
</div>
<summary><?php echo _("A title that you want to be shown on the top of the page."); ?></summary>
<div class="form-group clearfix">
<div class="col-sm-6"><label for="title"><?php echo _("Title"); ?>: </label><input type="text" name="title" value="<?php echo ((isset($_POST['title'])) ? htmlspecialchars($_POST['title'], ENT_QUOTES) : 'Server Status'); ?>" id="title" placeholder="<?php echo _("Title"); ?>" class="form-control" required></div>
<div class="col-sm-6"></div>
</div>
<summary><?php echo _("Also an email address for mailer would be nice :)"); ?></summary>
<div class="form-group clearfix">
<div class="col-sm-6"><label for="mailer"><?php echo _("Name"); ?>: </label><input type="text" name="mailer" value="<?php echo ((isset($_POST['mailer'])) ? htmlspecialchars($_POST['mailer'], ENT_QUOTES) : ''); ?>" id="mailer" placeholder="<?php echo _("Name"); ?>" class="form-control" required></div>
<div class="col-sm-6"><label for="mailer_email"><?php echo _("Email"); ?>: </label><input type="email" name="mailer_email" value="<?php echo ((isset($_POST['mailer_email'])) ? htmlspecialchars($_POST['mailer_email'], ENT_QUOTES) : ''); ?>" id="mailer_email" placeholder="<?php echo _("Email"); ?>" class="form-control" required></div>
</div>
</section>
<section class="install-section clearfix">
<h2><?php echo _("Database connection"); ?></h2>
<summary><?php echo _("We need database connection to be able to create tables. Please check that your account has the permission needed to do that."); ?></summary>
<div class="form-group clearfix">
<div class="col-sm-6"><label for="server"><?php echo _("Server"); ?>: </label><input type="text" name="server" value="<?php echo ((isset($_POST['server'])) ? htmlspecialchars($_POST['server'], ENT_QUOTES) : ''); ?>" id="server" placeholder="<?php echo _("Server"); ?>" class="form-control" required></div>
<div class="col-sm-6"><label for="database"><?php echo _("Database"); ?>: </label><input type="text" name="database" value="<?php echo ((isset($_POST['database'])) ? htmlspecialchars($_POST['database'], ENT_QUOTES) : ''); ?>" id="database" placeholder="<?php echo _("Database"); ?>" class="form-control" required></div>
</div>
<div class="form-group clearfix">
<div class="col-sm-6"><label for="dbuser"><?php echo _("User"); ?>: </label><input type="text" name="dbuser" value="<?php echo ((isset($_POST['dbuser'])) ? htmlspecialchars($_POST['dbuser'], ENT_QUOTES) : ''); ?>" id="dbuser" placeholder="<?php echo _("User"); ?>" class="form-control" required></div>
<div class="col-sm-6"><label for="dbpassword"><?php echo _("Password"); ?>: </label><input type="password" name="dbpassword" value="<?php echo ((isset($_POST['dbpassword'])) ? htmlspecialchars($_POST['dbpassword'], ENT_QUOTES) : ''); ?>" id="dbpassword" placeholder="<?php echo _("Password"); ?>" class="form-control" required></div>
</div>
</section>
<section class="install-section clearfix">
<h2><?php echo _("Privacy Policy"); ?></h2>
<summary><?php echo _("Since you are collecting personal information, the GDPR needs you to have a privacy policy. Enter the details below."); ?></summary>
<div class="form-group clearfix">
<div class="col-sm-6"><label for="policy_name"><?php echo _("Name"); ?>: </label><input type="text" name="policy_name" value="<?php echo ((isset($_POST['policy_name'])) ? htmlspecialchars($_POST['policy_name'], ENT_QUOTES) : ''); ?>" id="policy_name" placeholder="<?php echo _("Company name"); ?>" class="form-control" required></div>
<div class="col-sm-6"><label for="address"><?php echo _("Address"); ?>: </label><input type="text" name="address" value="<?php echo ((isset($_POST['address'])) ? htmlspecialchars($_POST['address'], ENT_QUOTES) : ''); ?>" id="address" placeholder="<?php echo _("Full address"); ?>" class="form-control" required></div>
</div>
<div class="form-group clearfix">
<div class="col-sm-6"><label for="policy_mail"><?php echo _("E-Mail"); ?>: </label><input type="text" name="policy_mail" value="<?php echo ((isset($_POST['policy_mail'])) ? htmlspecialchars($_POST['policy_mail'], ENT_QUOTES) : ''); ?>" id="policy_mail" placeholder="<?php echo _("E-Mail"); ?>" class="form-control" required></div>
<div class="col-sm-6"><label for="policy_phone"><?php echo _("Phone"); ?>: </label><input type="text" name="policy_phone" value="<?php echo ((isset($_POST['policy_phone'])) ? htmlspecialchars($_POST['policy_phone'], ENT_QUOTES) : ''); ?>" id="policy_phone" placeholder="<?php echo _("Phone number"); ?>" class="form-control"></div>
</div>
<div class="form-group clearfix">
<div class=""><label for="who_we_are"><?php echo _("Who we are"); ?>: </label><textarea class="form-control" id="who_we_are" rows="3" name="who_we_are" placeholder="<?php echo _("Some info about yourself"); ?>" value="<?php echo ((isset($_POST['who_we_are'])) ? htmlspecialchars($_POST['who_we_are'], ENT_QUOTES) : ''); ?>"></textarea></div>
</div>
<div class="form-group clearfix">
<div class="col-sm-12"><label for="url"><?php echo _("External Policy Url"); ?>: </label>
<summary><?php echo _("If you alredy have an existing Policy published, please provide the full Url to override the local policy definition. Leave blank to use the local definition"); ?></summary>
<input type="policy_url" name="policy_url" value="<?php echo ((isset($_POST['policy_url'])) ? htmlspecialchars($_POST['policy_url'], ENT_QUOTES) : ''); ?>" id="policy_url" placeholder="<?php echo _("External Policy Url"); ?>" class="form-control">
<form method="post" action=".">
<div class="card">
<div class="card-header text-center">
<?php echo _("Website details"); ?>
</div>
<div class="card-body">
<span class="card-title"><?php echo _("We need a name for your status page (shown behind page title after the dash) and a url of your server status installation (i.e. <a href='#'>https://example.com/status</a> - without the trailing slash), so we can mail users link for forgotten password etc..."); ?></span>
<p class="card-text">
<div class="row">
<div class="col form-floating">
<input type="text" name="servername" value="<?php echo ((isset($_POST['servername'])) ? htmlspecialchars($_POST['servername'], ENT_QUOTES) : ''); ?>" id="servername" placeholder="<?php echo _("Servername"); ?>" class="form-control" required>
<label for="servername"><?php echo _("Servername"); ?>: </label>
</div>
<div class="col form-floating">
<input type="url" name="url" value="<?php echo ((isset($_POST['url'])) ? htmlspecialchars($_POST['url'], ENT_QUOTES) : ''); ?>" id="url" placeholder="<?php echo _("Url"); ?>" class="form-control" required>
<label for="url"><?php echo _("Url"); ?>: </label>
</div>
</div>
<div class="row mt-3">
<div class="col form-floating">
<input type="text" name="mailer" value="<?php echo ((isset($_POST['mailer'])) ? htmlspecialchars($_POST['mailer'], ENT_QUOTES) : ''); ?>" id="mailer" placeholder="<?php echo _("Mail-Name"); ?>" class="form-control" required>
<label for="mailer"><?php echo _("Mail-Name"); ?>: </label>
</div>
<div class="col form-floating">
<input type="email" name="mailer_email" value="<?php echo ((isset($_POST['mailer_email'])) ? htmlspecialchars($_POST['mailer_email'], ENT_QUOTES) : ''); ?>" id="mailer_email" placeholder="<?php echo _("Email"); ?>" class="form-control" required>
<label for="mailer_email"><?php echo _("Email"); ?>: </label>
</div>
</div>
</p>
</div>
</div>
</div>
</section>
<section class="install-section clearfix">
<h2><?php echo _("User"); ?></h2>
<summary><?php echo _("And finally, we need info to create a new user. You don't have to provide it, but then... No status page admin..."); ?></summary>
<div class="form-group">
<div class="col-sm-6"><label for="name"><?php echo _("Name"); ?>: </label><input type="text" maxlength="50" name="name" value="<?php echo ((isset($_POST['name'])) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''); ?>" id="name" placeholder="<?php echo _("Name"); ?>" class="form-control" required></div>
<div class="col-sm-6"><label for="surname"><?php echo _("Surname"); ?>: </label><input type="text" maxlength="50" name="surname" value="<?php echo ((isset($_POST['surname'])) ? htmlspecialchars($_POST['surname'], ENT_QUOTES) : ''); ?>" id="surname" placeholder="<?php echo _("Surname"); ?>" class="form-control" required></div>
</div>
<div class="form-group">
<div class="col-sm-6"><label for="username"><?php echo _("Username"); ?>:</label><input type="text" maxlength="50" name="username" value="<?php echo ((isset($_POST['username'])) ? htmlspecialchars($_POST['username'], ENT_QUOTES) : ''); ?>" id="username" placeholder="<?php echo _("Username"); ?>" class="form-control" required></div>
<div class="col-sm-6"><label for="email"><?php echo _("Email"); ?>:</label><input type="email" maxlength="60" name="email" value="<?php echo ((isset($_POST['email'])) ? htmlspecialchars($_POST['email'], ENT_QUOTES) : ''); ?>" id="email" placeholder="<?php echo _("Email"); ?>" class="form-control" required><input type="hidden" name="permission" value="0"></div>
</div>
<div class="form-group">
<div class="col-sm-6"><label for="password"><?php echo _("Password"); ?>:</label><input type="password" name="password" value="<?php echo ((isset($_POST['password'])) ? htmlspecialchars($_POST['password'], ENT_QUOTES) : ''); ?>" id="password" placeholder="<?php echo _("Password"); ?>" class="form-control" required></div>
<div class="col-sm-6">
<div class="card">
<div class="card-header text-center">
<?php echo _("Database connection"); ?>
</div>
<div class="card-body">
<span class="card-title"><?php echo _("We need database connection to be able to create tables. Please check that your account has the permission needed to do that."); ?></span>
<p class="card-text">
<div class="row">
<div class="col form-floating">
<input type="text" name="server" value="<?php echo ((isset($_POST['server'])) ? htmlspecialchars($_POST['server'], ENT_QUOTES) : ''); ?>" id="server" placeholder="<?php echo _("Server"); ?>" class="form-control" required>
<label for="server"><?php echo _("Server"); ?>: </label>
</div>
<div class="col form-floating">
<input type="text" name="database" value="<?php echo ((isset($_POST['database'])) ? htmlspecialchars($_POST['database'], ENT_QUOTES) : ''); ?>" id="database" placeholder="<?php echo _("Database"); ?>" class="form-control" required>
<label for="database"><?php echo _("Database"); ?>: </label>
</div>
</div>
<div class="row mt-3">
<div class="col form-floating">
<input type="text" name="dbuser" value="<?php echo ((isset($_POST['dbuser'])) ? htmlspecialchars($_POST['dbuser'], ENT_QUOTES) : ''); ?>" id="dbuser" placeholder="<?php echo _("User"); ?>" class="form-control" required>
<label for="dbuser"><?php echo _("User"); ?>: </label>
</div>
<div class="col form-floating">
<input type="password" name="dbpassword" value="<?php echo ((isset($_POST['dbpassword'])) ? htmlspecialchars($_POST['dbpassword'], ENT_QUOTES) : ''); ?>" id="dbpassword" placeholder="<?php echo _("Password"); ?>" class="form-control" required>
<label for="dbpassword"><?php echo _("Password"); ?>: </label>
</div>
</div>
</p>
</div>
</div>
<div class="card">
<div class="card-header text-center">
<?php echo _("Privacy Policy"); ?>
</div>
<div class="card-body">
<span class="card-title"><?php echo _("Since you are collecting personal information, the GDPR needs you to have a privacy policy. Enter the details below."); ?></span>
<p class="card-text">
<div class="row">
<div class="col form-floating">
<input type="text" name="policy_name" value="<?php echo ((isset($_POST['policy_name'])) ? htmlspecialchars($_POST['policy_name'], ENT_QUOTES) : ''); ?>" id="policy_name" placeholder="<?php echo _("Company name"); ?>" class="form-control" required>
<label for="policy_name"><?php echo _("Name"); ?>: </label>
</div>
<div class="col form-floating">
<input type="text" name="address" value="<?php echo ((isset($_POST['address'])) ? htmlspecialchars($_POST['address'], ENT_QUOTES) : ''); ?>" id="address" placeholder="<?php echo _("Full address"); ?>" class="form-control" required>
<label for="address"><?php echo _("Address"); ?>: </label>
</div>
</div>
<div class="row mt-3">
<div class="col form-floating">
<input type="text" name="policy_mail" value="<?php echo ((isset($_POST['policy_mail'])) ? htmlspecialchars($_POST['policy_mail'], ENT_QUOTES) : ''); ?>" id="policy_mail" placeholder="<?php echo _("E-Mail"); ?>" class="form-control" required>
<label for="policy_mail"><?php echo _("E-Mail"); ?>: </label>
</div>
<div class="col form-floating">
<input type="text" name="policy_phone" value="<?php echo ((isset($_POST['policy_phone'])) ? htmlspecialchars($_POST['policy_phone'], ENT_QUOTES) : ''); ?>" id="policy_phone" placeholder="<?php echo _("Phone number"); ?>" class="form-control">
<label for="policy_phone"><?php echo _("Phone"); ?>: </label>
</div>
</div>
<div class="row mt-3">
<div class="col form-floating">
<textarea class="form-control" id="who_we_are" rows="3" name="who_we_are" placeholder="<?php echo _("Some info about yourself"); ?>" value="<?php echo ((isset($_POST['who_we_are'])) ? htmlspecialchars($_POST['who_we_are'], ENT_QUOTES) : ''); ?>"></textarea>
<label for="who_we_are"><?php echo _("Who we are"); ?>: </label>
</div>
</div>
<div class="row mt-3">
<span><?php echo _("If you alredy have an existing Policy published, please provide the full Url to override the local policy definition. Leave blank to use the local definition"); ?></span>
<div class="col form-floating">
<input type="policy_url" name="policy_url" value="<?php echo ((isset($_POST['policy_url'])) ? htmlspecialchars($_POST['policy_url'], ENT_QUOTES) : ''); ?>" id="policy_url" placeholder="<?php echo _("External Policy Url"); ?>" class="form-control">
<label for="url"><?php echo _("External Policy Url"); ?>: </label>
</div>
</div>
</p>
</div>
</div>
<div class="card">
<div class="card-header text-center">
<?php echo _("User"); ?>
</div>
<div class="card-body">
<span class="card-title"><?php echo _("And finally, we need info to create a new user. You don't have to provide it, but then... No status page admin..."); ?></span>
<p class="card-text">
<div class="row">
<div class="col form-floating">
<input type="text" maxlength="50" name="name" value="<?php echo ((isset($_POST['name'])) ? htmlspecialchars($_POST['name'], ENT_QUOTES) : ''); ?>" id="name" placeholder="<?php echo _("Name"); ?>" class="form-control" required>
<label for="name"><?php echo _("Name"); ?>: </label>
</div>
<div class="col form-floating">
<input type="text" maxlength="50" name="surname" value="<?php echo ((isset($_POST['surname'])) ? htmlspecialchars($_POST['surname'], ENT_QUOTES) : ''); ?>" id="surname" placeholder="<?php echo _("Surname"); ?>" class="form-control" required>
<label for="surname"><?php echo _("Surname"); ?>: </label>
</div>
</div>
<div class="row mt-3">
<div class="col form-floating">
<input type="text" maxlength="50" name="username" value="<?php echo ((isset($_POST['username'])) ? htmlspecialchars($_POST['username'], ENT_QUOTES) : ''); ?>" id="username" placeholder="<?php echo _("Username"); ?>" class="form-control" required>
<label for="username"><?php echo _("Username"); ?>:</label>
</div>
<div class="col form-floating">
<input type="email" maxlength="60" name="email" value="<?php echo ((isset($_POST['email'])) ? htmlspecialchars($_POST['email'], ENT_QUOTES) : ''); ?>" id="email" placeholder="<?php echo _("Email"); ?>" class="form-control" required><input type="hidden" name="permission" value="0">
<label for="email"><?php echo _("Email"); ?>:</label>
</div>
</div>
<div class="row mt-3">
<div class="col form-floating">
<input type="password" name="password" value="<?php echo ((isset($_POST['password'])) ? htmlspecialchars($_POST['password'], ENT_QUOTES) : ''); ?>" id="password" placeholder="<?php echo _("Password"); ?>" class="form-control" required>
<label for="password"><?php echo _("Password"); ?>:</label>
</div>
</div>
</p>
</div>
</div>
<div class="card" style="border: none;">
<input type="hidden" value="0" name="permission">
<button type="submit" class="btn btn-success float-end"><?php echo _("Run install!"); ?></button>
</div>
</div>
</section>
</form>
</form>
</div>
</div>
<?php
Template::render_footer();