<!DOCTYPE html>
<?php
//echo json_encode(Session::isAlive());
$url = explode('=', $_SERVER['REQUEST_URI']);
$error = strtolower($url[count($url) - 1]);
if (Session::isAlive() == true) {
    header('Location: ' . SITE_LINK . 'main_page');
}
?>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html;charset=UTF-8"/>
        <meta charset="utf-8"/>
        <title>PIN | Login</title>
        <link rel="icon" type="image/x-icon" href="favicon.ico"/>
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-touch-fullscreen" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="default">
        <meta content="" name="description"/>
        <meta content="" name="author"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
        <link href="Theme/plugins/font-awesome/css/font-awesome.css" rel="stylesheet" type="text/css"/>
        <link rel="stylesheet" type="text/css" href="Theme/css/login.css">
        <link href="Theme/plugins/toastr/toastr.min.css" rel="stylesheet" type="text/css"/>
    </head>
    <body>
        <form id="form-login" class="p-t-15" role="form" action="smc/dologinpos" method="post">
            <div class="main_loginBox_Cont">
                <div class="main_loginBox">
                    <div class="main_loginBox_in">
                        <div class="log_in_header">
                            <div class="log_in_header_inner">
                                <div class="log_in_header_content">
                                    <img src="img/pin_img.png" alt="">
                                </div>
                                <div class="log_in_header_content">
                                    Enter Pin
                                </div>
                                <div class="log_in_header_content pull-right m-t-2">
                                    <a href="<?php echo SITE_LINK; ?>"><span class="fa fa-home fa-2x white-color"></span></a>
                                </div>
                                <div class="log_in_header_content">
                                    <input name="secret_code" type="password" id="secret_code" class="log_in_header_content_txt form-control " autofocus="">
                                </div>
                                <div class="btn_clear">
                                    <ul>
                                        <li><a  id="clear_pin" href="javascript:;"><span>Clear</span></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="log_in_btns_area">
                            <div class="mid_btn_row">
                                <ul>
                                    <li><a class="key action" data-content="1" href="javascript:;"><span>1</span></a></li>
                                    <li><a class="key action" data-content="2" href="javascript:;"><span>2</span></a></li>
                                    <li><a class="key action" data-content="3" href="javascript:;"><span>3</span></a></li>
                                    <li><a class="key action" data-content="4" href="javascript:;"><span>4</span></a></li>
                                    <li><a class="key action" data-content="5" href="javascript:;"><span>5</span></a></li>
                                    <li><a class="key action" data-content="6" href="javascript:;"><span>6</span></a></li>
                                    <li><a class="key action" data-content="7" href="javascript:;"><span>7</span></a></li>
                                    <li><a class="key action" data-content="8" href="javascript:;"><span>8</span></a></li>
                                    <li><a class="key action" data-content="9" href="javascript:;"><span>9</span></a></li>
                                    <li><a class="key action" data-content="0" href="javascript:;"><span>0</span></a></li>
                                    <li><a class="key action  backspace" data-content="back_space" href="javascript:;"><span class=" fa fa-backward"></span></a></li>
                                    <li><a  href="javascript:;" id="pin_login" onclick="document.forms[0].submit()"><span>OK</span></a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </form>
        <script src="Theme/plugins/jquery/jquery-2.1.1.js" type="text/javascript"></script>
        <script src="Theme/plugins/jquery-ui/jquery-ui.min.js" type="text/javascript"></script>
        <script src="Theme/plugins/jquery-scrollbar/jquery.scrollbar.min.js"></script>
        <script src="Theme/plugins/jquery-validation/js/jquery.validate.min.js" type="text/javascript"></script>
        <script src="Theme/plugins/toastr/toastr.min.js" type="text/javascript"></script>
        <script src="<?php echo THEME_PATH; ?>plugins/jQuery-Scanner-Detection-master/jquery.scannerdetection.js"></script>
        <script src="<?php echo THEME_PATH; ?>plugins/jQuery-Scanner-Detection-master/jquery.scannerdetection.compatibility.js"></script>
        <script type="text/javascript">
                                        var URLStatus = <?php echo json_encode($error); ?>;
                                        $(function () {
                                            $('#form-login').validate();
                                            if (URLStatus == 1) {
                                                toastr.error('username or password is invalid')
                                            } else if (URLStatus == 5) {
                                                toastr.error('This version is expired')
                                            } else if (URLStatus == 6) {
                                                toastr.error('failed, Please try again')
                                            }
                                            $('#clear_pin').on('click', function () {
                                                $('#secret_code').val('');
                                            });
                                            $('.key.action').on('click', function () {
                                                var btnVal = $(this).attr('data-content'),
                                                        secret_code_value = $("input[name=secret_code]").val();
                                                if (btnVal === 'back_space') {
                                                    var newformula = secret_code_value.substring(0, secret_code_value.length - 1);
                                                    $("input[name=secret_code]").val(newformula);
                                                } else {
                                                    var new_input_value = secret_code_value + btnVal;
                                                    $("input[name=secret_code]").val(new_input_value);
                                                }
                                            });
                                        });
                                        //

                                        $(window).ready(function (e) {
                                            //for magnetic card detection: %value? always scanned data will start with % and end with ? so we must remove them
                                            $(window).scannerDetection({minLength: 6});
                                            $(window)
                                                    .bind('scannerDetectionComplete', function (e, data) {
                                                        //for magnetic card detection: %value? always scanned data will start with % and end with ? so we must remove them
                                                        ID = data.string;
                                                        //so here remove first and last character
                                                        $('#secret_code').val(data.string.substring(1, data.string.length - 1));
                                                        $('#pin_login').click();
                                                    })
                                                    .bind('scannerDetectionError', function (e, data) {
                                                    })
                                                    .bind('scannerDetectionReceive', function (e, data) {
                                                    });
                                        });

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