<?php
/**
 * @var Laminas\View\Renderer\PhpRenderer $this
 */
?>

<?= $this->doctype() ?>

<?php
//   $csrf = '';
//   if (!empty($_SESSION['__KHANSIA'])) {
//     $csrf = $_SESSION['__KHANSIA']['csrf_token'];
//   }
?>
<!DOCTYPE html>
<html 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">
    <!-- <meta name="csrf-token" content="<?= $csrf ?>"> -->

    <?= $this->headTitle('Sistem Penilaian Kerja Praktik')->setSeparator(' - ')->setAutoEscape(false) ?>

    <?= $this->headMeta()
        ->appendName('viewport', 'width=device-width, initial-scale=1.0')
        ->appendHttpEquiv('X-UA-Compatible', 'IE=edge')
    ?>


    <link href="https://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700,900" rel="stylesheet" type="text/css">
    <?= $this->headLink(['rel' => 'shortcut icon', 'type' => 'image/vnd.microsoft.icon', 'href' => $this->basePath() . '/img/logo_itb_128.ico'])

    ?>

	<!-- Global stylesheets -->
	<link href="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/css/icons/icomoon/styles.css" rel="stylesheet" type="text/css">
	<link href="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/css/bootstrap.css" rel="stylesheet" type="text/css">
	<link href="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/css/core.css" rel="stylesheet" type="text/css">
	<link href="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/css/components.css" rel="stylesheet" type="text/css">
	<link href="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/css/colors.css" rel="stylesheet" type="text/css">
	<!-- /global stylesheets -->

    <script type="text/javascript" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/action-js/global-js/crypto.js"></script>
	<link rel="stylesheet" href="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/colorpick/jquery.minicolors.css">

    <style>
        .logoitb{
            width: 80px;
            height: 80px;
        }

        .login-container{
            background: #33aae1;
        }

        .btn-primary{
            background-color: #09c;
            border-color: #09c;
        }
    </style>
</head>

<body class="login-container">

	<!-- Page container -->
	<div class="page-container">

		<!-- Page content -->
		<div class="page-content">

			<!-- Main content -->
			<div class="content-wrapper">

				<!-- Content area -->
                <div class="content ">

                    <form method="post" id="login" action="<?php echo $this->basePath()?>/user/authenticate">
						<div class="panel panel-body login-form">
							<div class="text-center">
								<div><img class="logoitb" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/img/itb_login.png" alt=""></div>
								<h5 class="content-group">Login ke SIPENKP <small class="display-block"></small></h5>
							</div>

							<div class="form-group has-feedback has-feedback-left">
								<input type="text" class="form-control" placeholder="Username" name="username" required>
								<div class="form-control-feedback">
									<i class="icon-user text-muted"></i>
								</div>
							</div>

							<div class="form-group has-feedback has-feedback-left">
								<input type="password" class="form-control" placeholder="Password" name="passwd" required>
								<div class="form-control-feedback">
									<i class="icon-lock2 text-muted"></i>
								</div>
							</div>

                            <input type="text" name="token_keamanan" value="<?php if(isset($this->token_keamanan)) { echo $this->token_keamanan; }?>" hidden>
                            <input type="text" id="key" name="key" value="0" hidden>
                            <div class="" style="text-align:center; color:red; margin-bottom: 10px"><?php if(isset($this->message)) { echo $this->message; }?></div>

							<div class="form-group">
								<button type="submit" class="btn btn-primary btn-block">Sign in <i class="icon-circle-right2 position-right"></i></button>
							</div>

							<div class="text-center">
								<a href="login_password_recover.html">Forgot password?</a>
							</div>
						</div>
					</form>
					<!-- /simple login form -->

                </div>
                    <!-- /content area -->

			</div>
			<!-- /main content -->

		</div>
		<!-- /page content -->

	</div>
	<!-- /page container -->

    <!-- Core JS files -->
	<script type="text/javascript" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/js/plugins/loaders/pace.min.js"></script>
	<script type="text/javascript" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/js/core/libraries/jquery.min.js"></script>
	<script type="text/javascript" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/js/core/libraries/bootstrap.min.js"></script>
	<script type="text/javascript" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/js/plugins/loaders/blockui.min.js"></script>
	<!-- /core JS files -->

	<!-- Theme JS files -->
	<script type="text/javascript" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/js/plugins/forms/styling/uniform.min.js"></script>

	<script type="text/javascript" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/js/core/app.js"></script>
	<script type="text/javascript" src="<?php echo '//'.$_SERVER['SERVER_NAME'].':'.$_SERVER['SERVER_PORT'].$this->basePath();?>/distro/assets/js/pages/login.js"></script>
	<!-- /theme JS files -->
</body>
</html>
