Work out some styles and move the register routes around.
This commit is contained in:
parent
7805ce9f80
commit
82735d41fd
@ -41,9 +41,15 @@ main {
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.error {
|
.flash {
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.error {
|
||||||
border: 1px solid #140505;
|
border: 1px solid #140505;
|
||||||
|
border-radius: 5px;
|
||||||
background-color: #C32727;
|
background-color: #C32727;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -17,6 +17,6 @@ class DashboardPage extends Controller
|
|||||||
{
|
{
|
||||||
// get the user details
|
// get the user details
|
||||||
// get the channels
|
// get the channels
|
||||||
return $this->render('dashboard.twig');
|
return $this->render('dashboard.twig', [ 'session' => $this->session ]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -35,6 +35,6 @@ class LoginUserAction extends Controller
|
|||||||
|
|
||||||
// start the session
|
// start the session
|
||||||
$this->session->set('user', [ 'id' => $user->getId(), 'authenticated' => true ]);
|
$this->session->set('user', [ 'id' => $user->getId(), 'authenticated' => true ]);
|
||||||
return $this->render('dashboard.twig');
|
return $this->render('dashboard.twig', [ 'logged_in' => true ]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -33,9 +33,9 @@ class Routes
|
|||||||
*/
|
*/
|
||||||
protected static function users(App $app): void
|
protected static function users(App $app): void
|
||||||
{
|
{
|
||||||
$app->get('/users/register', RegisterUserPage::class)
|
$app->get('/register', RegisterUserPage::class)
|
||||||
->setName('user-register-page');
|
->setName('user-register-page');
|
||||||
$app->post('/users/register', RegisterUserAction::class)
|
$app->post('/register', RegisterUserAction::class)
|
||||||
->add(VerifyPasswordMiddleware::class)
|
->add(VerifyPasswordMiddleware::class)
|
||||||
->setName('user-register-action');
|
->setName('user-register-action');
|
||||||
|
|
||||||
|
@ -7,6 +7,8 @@
|
|||||||
<meta name="keywords" value="{{ page_tags }}">
|
<meta name="keywords" value="{{ page_tags }}">
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
<link rel="stylesheet" href="static/main.css">
|
<link rel="stylesheet" href="static/main.css">
|
||||||
|
|
||||||
|
{% block head_js %}{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
@ -21,6 +23,7 @@
|
|||||||
<li><a href="/dashboard">Dashboard</a></li>
|
<li><a href="/dashboard">Dashboard</a></li>
|
||||||
{% else %}
|
{% else %}
|
||||||
<li><a href="/login">Login</a></li>
|
<li><a href="/login">Login</a></li>
|
||||||
|
<li><a href="/register">Register</a></li>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
@ -36,5 +39,7 @@
|
|||||||
{% endblock %}
|
{% endblock %}
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{% block body_js %}{% endblock %}
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
@ -12,7 +12,7 @@
|
|||||||
<input name="password" type="password" required>
|
<input name="password" type="password" required>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<input type="submit" label="Submit">
|
<button type="submit">Login</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div>
|
<div>
|
||||||
<form action="/users/register" method="post">
|
<form action="/register" method="post" id="login-form">
|
||||||
<div>
|
<div>
|
||||||
<label for="name">Name<br>
|
<label for="name">Name<br>
|
||||||
<input name="name" type="text" required>
|
<input name="name" type="text" required>
|
||||||
@ -20,8 +20,25 @@
|
|||||||
<input name="checked_password" type="password" required>
|
<input name="checked_password" type="password" required>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<input type="submit" label="Submit">
|
<button type="submit">Register</button>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block body_js %}
|
||||||
|
<script type="javascript">
|
||||||
|
const form = document.getElementById("login-form");
|
||||||
|
form.addEventListener('submit', function (e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
// validate form
|
||||||
|
const [p1] = document.querySelector('input[name="password"]');
|
||||||
|
const [p2] = document.querySelector('input[name="checked_password"]');
|
||||||
|
|
||||||
|
if (p1.getAttribute("value") == p2.getAttribute("value")) {
|
||||||
|
return this.submit();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
{% endblock %}
|
||||||
|
Loading…
Reference in New Issue
Block a user