253 lines
12 KiB
PHP
253 lines
12 KiB
PHP
<!DOCTYPE html>
|
|
<html class="no-js css-menubar" lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
|
|
<meta name="description" content="bootstrap admin template">
|
|
<meta name="author" content="">
|
|
|
|
<title>-*-*-LOGIN DBOIS-*-*-</title>*
|
|
|
|
<link rel="icon" href="css/images/dbo-01-80x80.png" type="image/png">
|
|
|
|
<!-- Stylesheets -->
|
|
<link rel="stylesheet" href="css/vendor/bootstrap.min.css?v=? =$this-version ?>">
|
|
<link rel="stylesheet" href="css/vendor/bootstrap-extend.css?v=? =$this-version ?>">
|
|
<link rel="stylesheet" href="css/vendor/site.min.css?v=? =$this-version ?>">
|
|
|
|
<!-- Plugins -->
|
|
<!-- <link rel="stylesheet" href="css/vendor/plugins/animsition/animsition.css">-->
|
|
<link rel="stylesheet" href="css/vendor/plugins/asscrollable/asScrollable.css?v=? =$this-version ?>">
|
|
<link rel="stylesheet" href="css/vendor/plugins/switchery/switchery.css?v=? =$this-version ?>">
|
|
<link rel="stylesheet" href="css/vendor/plugins/slidepanel/slidePanel.css?v=? =$this-version ?>">
|
|
<link rel="stylesheet" href="css/vendor/plugins/flag-icon-css/flag-icon.css?v=? =$this-version ?>">
|
|
<link rel="stylesheet" href="css/login-v3.css?v=? =$this-version ?>">
|
|
|
|
|
|
<!-- Fonts -->
|
|
<link rel="stylesheet" href="fonts/web-icons/web-icons.min.css?v=? =$this-version ?>">
|
|
<link rel="stylesheet" href="fonts/brand-icons/brand-icons.min.css?v=? =$this-version ?>">
|
|
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Roboto:300,400,500,300italic'>
|
|
</head>
|
|
<body class="animsition page-login-v3 layout-full">
|
|
<!-- Page -->
|
|
<?php $this->load->view('specials/tellme_modal'); ?>
|
|
|
|
<!-- Password Change Modal -->
|
|
<div class="modal fade" id="password-change-modal" tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false">
|
|
<div class="modal-dialog modal-dialog-centered" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header bg-warning">
|
|
<h4 class="modal-title">
|
|
<i class="icon wb-warning" aria-hidden="true"></i>
|
|
Wachtwoord wijzigen verplicht
|
|
</h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="alert alert-warning">
|
|
<strong>Let op:</strong> Uw huidige wachtwoord voldoet niet aan de beveiligingseisen.
|
|
U moet uw wachtwoord wijzigen om door te gaan.
|
|
</div>
|
|
|
|
<h5>Wachtwoordeisen:</h5>
|
|
<ul class="list-unstyled" data-bind="foreach: passwordRequirements">
|
|
<li style="padding: 5px 0;">
|
|
<i class="icon wb-check text-success" aria-hidden="true"></i>
|
|
<span data-bind="text: $data"></span>
|
|
</li>
|
|
</ul>
|
|
|
|
<!-- New Password Input -->
|
|
<div class="form-group form-material floating" data-plugin="formMaterial" style="margin-top: 30px;">
|
|
<input type="password"
|
|
class="form-control"
|
|
id="newPassword"
|
|
data-bind="textInput: newPassword"
|
|
autocomplete="new-password" />
|
|
<label class="floating-label">Nieuw wachtwoord</label>
|
|
</div>
|
|
|
|
<!-- Confirm Password Input -->
|
|
<div class="form-group form-material floating" data-plugin="formMaterial">
|
|
<input type="password"
|
|
class="form-control"
|
|
id="confirmPassword"
|
|
data-bind="textInput: confirmPassword, event: { keyup: handlePasswordChangeKeyup }"
|
|
autocomplete="new-password" />
|
|
<label class="floating-label">Bevestig wachtwoord</label>
|
|
</div>
|
|
|
|
<!-- Error Message -->
|
|
<div data-bind="visible: passwordChangeError()" class="alert alert-danger" style="margin-top: 20px;">
|
|
<span data-bind="text: passwordChangeError"></span>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button"
|
|
class="btn btn-primary btn-lg btn-block"
|
|
data-bind="click: changePassword, enable: newPassword().length >= 8 && confirmPassword().length >= 8 && !isChangingPassword()">
|
|
<span data-bind="visible: !isChangingPassword()">Wachtwoord wijzigen</span>
|
|
<span data-bind="visible: isChangingPassword()">Wijzigen...</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 2FA Verification Modal -->
|
|
<div class="modal fade" id="twofactor-modal" tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false">
|
|
<div class="modal-dialog modal-dialog-centered" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title">
|
|
<i class="icon wb-lock" aria-hidden="true"></i>
|
|
Tweefactorauthenticatie
|
|
</h4>
|
|
</div>
|
|
<div class="modal-body text-center">
|
|
<!-- Email Method -->
|
|
<div data-bind="visible: twoFactorMethod() === 'email'">
|
|
<div style="font-size: 48px; color: #348eda; margin-bottom: 20px;">
|
|
<i class="icon wb-envelope" aria-hidden="true"></i>
|
|
</div>
|
|
<p>Voer de 6-cijferige code in die naar uw e-mail is verzonden.</p>
|
|
</div>
|
|
|
|
<!-- Authenticator Method -->
|
|
<div data-bind="visible: twoFactorMethod() === 'authenticator'">
|
|
<div style="font-size: 48px; color: #348eda; margin-bottom: 20px;">
|
|
<i class="icon wb-mobile" aria-hidden="true"></i>
|
|
</div>
|
|
<p>Voer de 6-cijferige code in van uw authenticator app.</p>
|
|
</div>
|
|
|
|
<!-- Code Input -->
|
|
<div class="form-group" style="margin-top: 30px;">
|
|
<input type="text"
|
|
class="form-control text-center"
|
|
id="twoFactorCode"
|
|
maxlength="6"
|
|
placeholder="000000"
|
|
style="font-size: 32px; letter-spacing: 8px; font-weight: bold;"
|
|
data-bind="textInput: twoFactorCode, event: { keyup: handleTwoFactorKeyup }"
|
|
autocomplete="off" />
|
|
</div>
|
|
|
|
<!-- Error Message -->
|
|
<div data-bind="visible: twoFactorError()" class="alert alert-danger" style="margin-top: 20px;">
|
|
<span data-bind="text: twoFactorError"></span>
|
|
</div>
|
|
|
|
<!-- Resend Button (Email only) -->
|
|
<div data-bind="visible: twoFactorMethod() === 'email'" style="margin-top: 20px;">
|
|
<a href="#" data-bind="click: resendOtp, enable: !isResending()">
|
|
<span data-bind="visible: !isResending()">Code opnieuw verzenden</span>
|
|
<span data-bind="visible: isResending()">Verzenden...</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-default" data-bind="click: cancelTwoFactor">Annuleren</button>
|
|
<button type="button" class="btn btn-primary btn-lg" data-bind="click: verifyTwoFactor, enable: twoFactorCode().length === 6 && !isVerifying()">
|
|
<span data-bind="visible: !isVerifying()">Verifiëren</span>
|
|
<span data-bind="visible: isVerifying()">Verifiëren...</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="page vertical-align text-center" data-animsition-in="fade-in" data-animsition-out="fade-out">
|
|
<div class="page-content vertical-align-middle animation-slide-top animation-duration-1">
|
|
<div class="panel" id="login-form">
|
|
<div class="panel-body">
|
|
<div class="brand">
|
|
<img class="brand-img" src="css/images/logo_dbo.png" alt="...">
|
|
<h2 class="brand-text font-size-18">projectbeheer</h2>
|
|
</div>
|
|
<div data-bind="visible: !showPasswordRequest()">
|
|
<div>
|
|
<div class="form-group form-material floating" data-plugin="formMaterial">
|
|
<input type="text" class="form-control" name="gebruikersnaam"
|
|
data-bind="textInput:username" />
|
|
<label class="floating-label">gebruikersnaam</label>
|
|
</div>
|
|
<div class="form-group form-material floating" data-plugin="formMaterial">
|
|
<input type="password" class="form-control" name="password"
|
|
data-bind="textInput:password" />
|
|
<label class="floating-label">wachtwoord</label>
|
|
</div>
|
|
<button type="button"
|
|
class="btn btn-primary btn-block btn-lg mt-40"
|
|
data-bind="click:login">Log in</button>
|
|
</div>
|
|
<div>
|
|
<br />
|
|
<a href="#" data-bind="click:togglePasswordrequest">wachtwoord vergeten?</a>
|
|
</div>
|
|
</div>
|
|
<div data-bind="visible: showPasswordRequest()">
|
|
<p>
|
|
Vul hieronder uw emailadres en gebruikersnaam in, u krijgt dan een mail met een nieuw wachtwoord toegezonden!
|
|
</p>
|
|
<div class="form-group form-material floating" data-plugin="formMaterial">
|
|
<input type="text"
|
|
class="form-control"
|
|
name="gebruikersnaam"
|
|
data-bind="textInput:username" />
|
|
<label class="floating-label">gebruikersnaam</label>
|
|
</div>
|
|
<div class="form-group form-material floating" data-plugin="formMaterial">
|
|
<input type="text"
|
|
class="form-control"
|
|
name="password"
|
|
data-bind="textInput:email" />
|
|
<label class="floating-label">emailadres</label>
|
|
</div>
|
|
<button type="button"
|
|
class="btn btn-primary btn-block btn-lg mt-40"
|
|
data-bind="click:requestPassword">vraag aan</button>
|
|
<div>
|
|
<br />
|
|
<a href="#" data-bind="click:togglePasswordrequest">terug naar inlog?</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<footer class="page-copyright page-copyright-inverse">
|
|
<p>© 2018. De Beleidsonderzoekers</p>
|
|
<!-- <p style="font-size:.8em">powered by: Pensare Software</p>-->
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
<!-- End Page -->
|
|
|
|
|
|
<!-- Core -->
|
|
<script src="js/vendor/jquery/jquery.js?v=<? $this->version ?>"></script>
|
|
<script src="js/vendor/popper-js/umd/popper.min.js?v=<? $this->version ?>"></script>
|
|
<script src="js/vendor/bootstrap/bootstrap.js?v=<? $this->version ?>"></script>
|
|
<script src="js/vendor/animsition/animsition.js?v=<? $this->version ?>"></script>
|
|
|
|
<!-- Scripts -->
|
|
<script src="js/vendor/Config.js?v=<? $this->version ?>"></script>
|
|
|
|
|
|
<!-- Page -->
|
|
|
|
<script src="js/vendor/Knockout.min.js?v=<? $this->version ?>"></script>
|
|
<script src="js/lib/modules/login/loginModule.js?v=<? $this->version ?>"></script>
|
|
<script src="js/lib/modules/specials/tellmeModule.js?v=<? $this->version ?>"></script>
|
|
<script src="js/lib/helpers.js?v=<? $this->version ?>"></script>
|
|
<script>
|
|
// Apply bindings for password change modal
|
|
$(function() {
|
|
ko.applyBindings(dbo.loginModel, document.getElementById('password-change-modal'));
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|