<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title>WorkAble</title>
        <!-- Tell the browser to be responsive to screen width -->
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <!-- Font Awesome -->
        <link rel="stylesheet" href="<?php echo base_url("assets/plugins/fontawesome-free/css/all.min.css") ?>">
        <!-- Ionicons -->
        <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">

        <!-- Theme style -->
        <link rel="stylesheet" href="<?php echo base_url("assets/dist/css/adminlte.min.css") ?>">
        <!-- Google Font: Source Sans Pro -->
        <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-164670420-1"></script>
        <script>
            window.dataLayer = window.dataLayer || [];
            function gtag() {
                dataLayer.push(arguments);
            }
            gtag('js', new Date());

            gtag('config', 'UA-164670420-1');
        </script>
    </head>

    <body class="hold-transition login-page" >
        <div class="login-box">
            <div class="login-logo">
                <a href=""><b>WORK</b>able</a>
            </div> 
            <!-- /.login-logo -->
            <div class="card">
                <div class="card-body login-card-body" id="welcome_form">
                    <p class="login-box-msg">Please select</p>
                    <div class="row">
                        <button type="button" onclick="clickAction('dataForm')" class="btn btn-success btn-lg btn-block"><i class="fa fa-users"></i> &nbsp; Employee</button>
                        <button type="button" onclick="clickAction('admin')" class="btn btn-info btn-lg btn-block"><i class="fa fa-user-tie"></i> &nbsp; Supervisor / Admin</button>


                    </div>

                </div>

                <div class="card-body login-card-body" style="display: none" id="loginForm">

                    <p class="login-box-msg">Sign in to start</p>

                    <form action="<?php echo base_url("welcome/login") ?>" method="post">
                        <div class="input-group mb-3">
                            <input type="text" name="username" id="username" required class="form-control" placeholder="User Name / EmpID">
                            <div class="input-group-append">
                                <div class="input-group-text">
                                    <span class="fas fa-user"></span>
                                </div>
                            </div>
                        </div>
                        <div class="input-group mb-3">
                            <input name="password" id="password" required type="password" class="form-control" placeholder="Password">
                            <div class="input-group-append">
                                <div class="input-group-text">
                                    <span class="fas fa-lock"></span>
                                </div>
                            </div>
                        </div>
                        <?php
                        if ($this->session->flashdata('error')) {
                            $erro = $this->session->flashdata('error');
                            echo $erro;
                            unset($_SESSION['error']);
                            if ($erro != "") {
                                ?>
                                <input type="hidden" name="logingVal" id="logingVal" value="1">
                            <?php }
                            ?>

                        <?php } else { ?>
                            <input type="hidden" name="logingVal" id="logingVal" value="0">
                        <?php }
                        ?>

                        <div class="row">
                            <div class="col-8">
                                <button type="button" onclick="clickAction('back')" class="btn btn-default">Back</button>
                            </div>
                            <!-- /.col -->
                            <div class="col-4 btn-toolbar justify-content-between">
                                <button type="submit" class="btn btn-primary btn-block">Sign In</button>
                            </div>
                            <!-- /.col -->
                        </div>
                    </form>


                    <!-- /.social-auth-links -->

                    <p class="mb-1">
                        <a href="<?php echo base_url("welcome/userRegistration") ?>">Supervisor Register</a>
                    </p>

                </div>
                <!-- /.login-card-body -->
            </div>
        </div>

        <script src="<?php echo base_url("assets/plugins/jquery/jquery.min.js") ?>"></script>
        <!-- Bootstrap 4 -->
        <script src="<?php echo base_url("assets/plugins/bootstrap/js/bootstrap.bundle.min.js") ?>"></script>
        <!-- AdminLTE App -->
        <script src="<?php echo base_url("assets/dist/js/adminlte.min.js") ?>"></script>

    </body>
</html>
<script>
                                    function clickAction(click) {
                                        if (click == "admin") {
                                            $("#welcome_form").hide(1000);
                                            $("#loginForm").show(1000);
                                        } else if (click == "back") {
                                            $("#loginForm").hide(1000);
                                            $("#welcome_form").show(1000);
                                        } else {
                                            window.location.href = "<?php echo base_url('welcome/dataCollectionform'); ?>";
                                        }
                                    }

                                    jQuery(function ($) {
//                                    console.log($("#logingVal").val());
//                                    console.log(typeof ($("#logingVal").val()));
                                        if ($("#logingVal").val()==="1") {
                                            clickAction('admin');
                                        }
                                    })
</script>