<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>iLink | Log in</title>
        <!-- Tell the browser to be responsive to screen width -->
        <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
        <!-- Bootstrap 3.3.7 -->
        <link rel="stylesheet" href="<?= base_url('bower_components/bootstrap/dist/css/bootstrap.min.css') ?>">
        <!-- Font Awesome -->
        <link rel="stylesheet" href="<?= base_url('bower_components/font-awesome/css/font-awesome.min.css') ?>">
        <!-- Ionicons -->
        <link rel="stylesheet" href="<?= base_url('bower_components/Ionicons/css/ionicons.min.css') ?>">
        <!-- Theme style -->
        <link rel="stylesheet" href="<?= base_url('dist/css/AdminLTE.css') ?>">

        <link rel="stylesheet" href="<?= base_url('dist/css/main.css') ?>">
        <!-- iCheck -->
        <link rel="stylesheet" href="<?= base_url('plugins/iCheck/square/blue.css') ?>">
        <link rel="shortcut icon" href="<?= base_url('favicon.ico') ?>" type="image/x-icon">
        <link rel="icon" href="<?= base_url('favicon.ico') ?>" type="image/x-icon">
        <!-- Google Font -->
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
    </head>
    <body class="hold-transition login-page">
        <div class="login-page">
            <div class="img-container">
                <div class="choice-lang">
                    <img src="<?= base_url('images/flag_french.png') ?>" class="img-circle img-responsive" onclick="javascript:window.location ='<?= base_url(); ?>LanguageSwitcher/switchLang/french';"/>
                    <img src="<?= base_url('images/flag_uk.jpg') ?>" class="img-circle img-responsive" onclick="javascript:window.location ='<?= base_url(); ?>LanguageSwitcher/switchLang/english';"/>
                    <!--<a href='#modal-langue'data-toggle='modal'><?= $this->lang->line('langue'); ?> : <?= $this->session->userdata('site_lang') ?> </a>-->
                </div>
                <div class="text-center pull-right photo">
                    <img src="<?= base_url('images/logo_blueback.png') ?>" class="user-avatar img-circle img-responsive" />
                    <h1>iLink World<br/ > <span>Back-Office</span><br /><small>V 2.0</small></h1>
                </div>
            </div>
                <!-- form -->
            <div class="form-content">
                    <button class="tuto btn btn-success" data-toggle="modal" data-target="#select_tuto">Tutorial</button>
                      <?php
                          if($alert=="ok") {
                              ?>
                                  <div class='alert alert-danger alert-dismissible col-md-4'>
                                      <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×</button>
                                      <h4><i class='icon fa fa-ban'></i> Alert!</h4>
                                      <?= $message; ?>
                                  </div>
                              <?php
                          } elseif ($alert=="password"){
                              ?>
                              <div class='alert alert-success alert-dismissible col-md-4'>
                                  <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×</button>
                                  <h4>Félicitation!</h4>
                                  <?= $message; ?>
                              </div>
                              <?php
                          }
                       ?>

                      <form id="loginForm" action="<?= base_url('login_user') ?>" method="post" class="bottom-75">
                          <div class="table-form">
                              <div class="form-groups">
                                  <div class="input-group date" style="margin-bottom : 10px;">
                                    <input name="user_mail" id="user_mail" type="text" class="form-control input-lg" placeholder="<?= $this->lang->line('identifiant'); ?>" required>
									  <div class="input-group-addon" style="border-color: #0A639C; background-color: #0A639C; color: #fff;">
										  <i class="glyphicon glyphicon-user"></i>
									  </div>
                                  </div>
                                  <div class="input-group date">
                                    <input type="password" name="user_password" id="user_password" class="form-control input-lg" placeholder="<?= $this->lang->line('mot de passe'); ?>" required>
									  <div id='div-eyes' class="input-group-addon" style="border-color: #0A639C; background-color: #0A639C; color: #fff;">
										  <i id='eyes' class="glyphicon glyphicon-eye-close"></i>
									  </div>
                                  </div>
                                  <div class="form-group">
                                      <select class="form-control input-lg" name="user_role" required>
                                          <option value="1"><?= $this->lang->line('administrateur'); ?></option>
                                          <option value="2"><?= $this->lang->line('agent'); ?></option>
                                      </select>
                                  </div>
                              </div>
                              <div class="button-container">
                                  <button type="submit" class="btn btn-default login"><img src="<?= base_url('images/arrow.png') ?>" alt=""></button>
                              </div>
                          </div>
                          <div class="remember">
                              <a style="color:white;" href="<?= base_url('Users/forgot_password')?>"><?= $this->lang->line('mot de passe oublié'); ?>?</a>
                          </div>
                      </form>

            </div>
            <div class="modal fade" id="modal-langue">
                <div class='modal-dialog'>
                    <div class='modal-content'>
                        <div class='modal-header'>
                            <button type='button' class='close' data-dismiss='modal' aria-label='Close'>
                                <span aria-hidden='true'>&times;</span></button>
                            <h4 class='modal-title'><?= $this->lang->line('Choix de la langue'); ?></h4>
                        </div>
                        <div class='modal-body'>
                            <div class="form-group">
                                <select class="form-control input-lg" onchange="javascript:window.location.href='<?= base_url(); ?>/LanguageSwitcher/switchLang/'+this.value;">
                                    <option value="french" <?php if($this->session->userdata('site_lang') == 'french') echo 'selected="selected"'; ?>>French</option>
                                    <option value="english" <?php if($this->session->userdata('site_lang') == 'english') echo 'selected="selected"'; ?>>English</option>
                                </select>
                            </div>
                        </div>
                        <div class='modal-footer'>
                            <button type='button' class='btn btn-default pull-left' data-dismiss='modal'>Fermer</button>
                        </div>
                    </div>
                    <!-- /.modal-content -->
                </div>
                <!-- /.modal-dialog -->
            </div>
            <div class="modal fade" id="select_tuto" tabindex="-1" role="dialog" aria-labelledby="select-modal" aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">X</span>
                            </button>
                        </div>
                        <div class="modal-body">
                            <?php
                                if($this->session->userdata('site_lang')=='french'){
                            ?>
                                <form style="display: inline-block;" action="<?= base_url('flipbook/fr/super/') ?>" method="get" target="_blank">
                                    <input style="color: black" type="submit" value="Notions générales" class="btn btn-light" name="profil" id="super" />
                                </form>
                                <form style="display: inline-block;" action="<?= base_url('flipbook/fr/hyper/') ?>" method="get" target="_blank">
                                    <input style="color: black" type="submit" value="Transfert d'argent" class="btn btn-light" name="profil" id="hyper" />
                                </form>
                                <form style="display: inline-block;" action="<?= base_url('flipbook/fr/admin/') ?>" method="get" target="_blank">
                                    <input style="color: black" type="submit" value="Nano Crédit" class="btn btn-light" name="profil" id="admin" />
                                </form>
								<form style="display: inline-block;" action="<?= base_url('flipbook/fr/admin/') ?>" method="get" target="_blank">
									<input style="color: black" type="submit" value="Nano Santé" class="btn btn-light" name="profil" id="admin" />
								</form>
                            <?php
                                }elseif ($this->session->userdata('site_lang')=='english'){
                                    ?>

                                    <form style="display: inline-block;" action="<?= base_url('flipbook/en/super/') ?>" method="get" target="_blank">
                                        <input style="color: black" type="submit" value="<?= $this->lang->line('Superviseur'); ?>" class="btn btn-light" name="superviseur" id="super" />
                                    </form>
                                    <form style="display: inline-block;" action="<?= base_url('flipbook/en/hyper/') ?>" method="get" target="_blank">
                                        <input style="color: black" type="submit" value="Hypervior" class="btn btn-light" name="profil" id="hyper" />
                                    </form>
                                    <form style="display: inline-block;" action="<?= base_url('flipbook/en/admin/') ?>" method="get" target="_blank">
                                        <input style="color: black" type="submit" value="Administrateur" class="btn btn-light" name="profil" id="admin" />
                                    </form>
                                    <?php
                                }
                            ?>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- jQuery 2.2.4 -->
        <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

        <!-- Bootstrap 3.3.7 -->
        <script src="<?= base_url('bower_components/bootstrap/dist/js/bootstrap.min.js') ?>"></script>
        <!-- iCheck -->
        <script src="<?= base_url('plugins/iCheck/icheck.min.js') ?>"></script>

        <script>
            $(function () {
                $('input').iCheck({
                  checkboxClass: 'icheckbox_square-blue',
                  radioClass: 'iradio_square-blue',
                  increaseArea: '20%' // optional
                });
            });

			$("#eyes").on('click', function(event) {
				if ($("#user_password").attr("type") == "text") {
					$("#user_password").attr('type', 'password');
					$("#eyes").addClass("glyphicon-eye-close");
					$("#eyes").removeClass("glyphicon-eye-open");
				} else if ($('#user_password').attr("type") == "password") {
					$('#user_password').attr('type', 'text');
					$('#eyes').removeClass("glyphicon-eye-close");
					$('#eyes').addClass("glyphicon-eye-open");
				}
			});

        </script>
    </body>
</html>
