<!DOCTYPE html>
<html>
    <meta http-equiv="Cache-control" content="public">
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <head>
        <meta charset="utf-8">
        <title>Golars Tank | Golars Facility Management</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link href="{{url('assets/img/favicon/fav.png')}}" rel="shortcut icon" type="image/x-icon">
        <link href="{{url('assets/img/favicon/fav.png')}}" rel="icon" type="image/x-icon">
        <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
        <link href="{{url('public/assets/css/components-md.min.css')}}" rel="stylesheet" id="style_components" type="text/css" />
        <link href="{{url('assets/css/gelogin.css')}}" rel="stylesheet">
        <link href="{{url('public/assets_new/bootstrap/dist/css/bootstrap.min.css')}}" rel="stylesheet">
        <link href="{{url('public/assets_new/css/style.css')}}" rel="stylesheet">
        <link href="{{ url('css/mui.css') }}" rel="stylesheet" type="text/css"/>
        <script src="https://www.google.com/recaptcha/api.js" async defer></script> 
        <style>@media screen and (max-width: 460px){.btn-login{margin-bottom:10px}.login-logo{height:69px}}</style>
    </head>
    <body>
        <div class="bodybg" id="image">
            <div class="container-fluid">
                <div class="col-md-12">
                    <div class="row">
                        @if(session()->has('message'))
                        <div class="alert success col-md-12" id="flash_message">
                            <span class="closebtn">&times;</span>
                            <p class="text-center"><strong>Successfully!</strong> {{ session()->get('message') }}</p>
                        </div>
                        @endif
                        <div class="col-md-6 col-xs-6 logotopmargin">
                            <div class="logobg"> <a href="#"> <img src="{{ url('assets/img/gtlogo.jpg') }}" class="login-logo" style="width:100%" width="" height="" > </a></div>
                        </div>
                        <div class="col-md-6 col-xs-6 toprightbutton">
                            <div class="row text-right"> <button type="button" class="btn btn-outline-success btn-login" id="loginbutton" > <i class="fa fa-user-circle-o" ></i>Login </button> <button class="btn btn-outline-success btn-contact" id="contactbutton" style="margin-right:10px"> <i class="fa fa-phone" aria-hidden="true"></i>Contact Us </button></div>
                        </div>
                    </div>
                </div>
                @include('message') @include('errors')
                <div class="col-md-12" style="display:none" id="loginform">
                    <div class="row">
                        <form action="{{ url('/auth/login') }}" class="login-form form-horizontal mui-form" id="form1" method="post" >
                            {!! csrf_field() !!}
                            <div class="col-md-3 col-xs-12 pull-right form-bg">
                                <i class="fa fa-times loginclose" style="font-size: 24px; color: #00215E;" aria-hidden="true"></i>
                                <h2 style="text-align:center;font-size: 34px; color: #2B9356;padding-bottom:10px;" >Login Here</h2>
                                @if(Session::has('Error'))
                                <h1>{{ Session::get('Error') }}</h1>
                                @endif
                                <h1 id="email"></h1>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="text" name="email" value="{{ old('email') }}" required> <label>User ID</label></div>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="password" name="password" value="{{ old('password') }}" required> <label>Password</label></div>
                                <div class="form-group " style="position:relative;">
                                    <div class="col-md-12">
                                        <div class="checkbox checkbox-primary pull-left " style="padding: 0px 0px 0px 17px;margin:15px 36px 4px -12px"> <input id="checkbox-signup" type="checkbox"> <label for="checkbox-signup"> Remember me </label></div>
                                        <a id="forgotpassword" class="pull-right">Forgot Password?</a>
                                    </div>
                                </div>
                                <div class="g-recaptcha centercaptha" id="recaptcha1"></div>
                                <input type="hidden" class="hiddenRecaptcha" value="" name="recaptcha1" id="recaptcha1_hidden">
                                <div id="msg1"></div>
                                <div class="col-md-12 center block"> <button type="submit" class="btn btn-outline-success btn-loginhere" id="loginload" >Login Here</button></div>
                                <div class="text-center" style="margin:50px 0px 0px 0px"> <a id="register"> <b class="text-dark">New User?</b> Register Here</a></div>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="col-md-12" style="display: none;" id="registerform">
                    <div class="row">
                        <form action="{{ url('register') }}" class=" form-horizontal mui-form" id="form2" method="post">
                            {!! csrf_field() !!}
                            <div class="col-md-3 col-xs-12 pull-right form-bg">
                                <i class="fa fa-times loginclose" style="font-size: 24px; color: #00215E;" aria-hidden="true"></i>
                                <h2 class="logintext">Register Now</h2>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="text" name="reg_name" required> <label>Name</label></div>
                                <div class="mui-textfield mui-textfield--float-label"> <input name="reg_email" type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2,3}$" required> <label>Email</label></div>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="text" pattern="[0-9]{10}" name="reg_phone" required> <label>Phone Number</label></div>
                                <div class="g-recaptcha centercaptha" id="recaptcha2"></div>
                                <input type="hidden" class="hiddenRecaptcha" value="" name="recaptcha2" id="recaptcha2_hidden">
                                <div id="msg2"></div>
                                <div class="col-md-12 center block"> <button type="submit" class="btn btn-outline-success btn-loginhere" id="sa-close" >Sign Up</button></div>
                                <div class="text-center" style="margin:50px 0px 0px 0px" > <a id="register_form_close" ><b class="text-dark">Already have an account?</b> Sign In</a></div>
                        </form>
                        </div>
                    </div>
                </div>
                <div class="col-md-12" style="display: none;" id="forgotpasswordform">
                    <div class="row">
                        <form action="{{ url('reset') }}" class=" form-horizontal mui-form" id="form3" method="post">
                            {!! csrf_field() !!}
                            <div class="col-md-3 col-xs-12 pull-right form-bg">
                                <i class="fa fa-times loginclose" style="font-size: 24px; color: #00215E;" aria-hidden="true"></i>
                                <h2 class="logintext">Reset Password</h2>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="text" name="reset_name" required> <label>Name</label></div>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2,3}$" name="reset_email" required> <label>Email</label></div>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="text" pattern="[0-9]{10}" name="reset_phone" required> <label>Phone Number</label></div>
                                <div class="g-recaptcha centercaptha" id="recaptcha3"></div>
                                <input type="hidden" class="hiddenRecaptcha" value="" name="recaptcha3" id="recaptcha3_hidden">
                                <div id="msg3"></div>
                                <div class="col-md-12 center block"> <button type="submit" class="btn btn-outline-success btn-loginhere" id="sa-close" >Reset Password</button></div>
                                <div class="text-center" style="margin:50px 0px 0px 0px"> <a id="forget_form_close"><b class="text-dark">Already have an account?</b> Sign In</a></div>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="col-md-12" style="display: none;" id="contactform">
                    <div class="row">
                        <form action="{{ url('contact') }}" class=" form-horizontal mui-form" id="form4" method="post">
                            {!! csrf_field() !!}
                            <div class="col-md-3 col-xs-12 pull-right form-bg" style="margin-top:-50px;">
                                <i class="fa fa-times contactclose" style="font-size: 24px; color: #00215E;" aria-hidden="true"></i>
                                <h2 class="logintext">Contact Now</h2>
                                <div class="mui-textfield mui-textfield--float-label" style="padding-top:11px; "> <input type="text" name="contact_name" required> <label>Name</label></div>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+.[a-z]{2,3}$" name="contact_email" required> <label>Email</label></div>
                                <div class="mui-textfield mui-textfield--float-label"> <input type="text" pattern="[0-9]{10}" name="contact_phone" required> <label>Phone Number</label></div>
                                <div class="mui-textfield mui-textfield--float-label"><textarea style="resize:none;min-height:25px" rows="1" required name="contact_description"></textarea><label>Description</label></div>
                                <div class="g-recaptcha centercaptha" id="recaptcha4"></div>
                                <input type="hidden" class="hiddenRecaptcha" name="recaptcha4" id="recaptcha4_hidden">
                                <div id="msg4"></div>
                                <div class="col-md-12 center block"> <button type="submit" id="contactnowsubmit" class="btn btn-outline-success btn-loginhere" >Submit</button></div>
                                <p class="text-center" style="font-size:12px; margin-top:50px; padding-left:21px;">Please Feel Free to Contact: <a href="tel://1-317-500-0000"><span style="color:red">1-(317)-500-0000</span></a></p>
                                <div class="text-center" style="margin: 5px 0px 0px 40px;"> <a id="contact_form_close" ><b class="text-dark">Already have an account?</b> Sign In</a></div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <script src="{{url('js/mui.min.js')}}"></script>
<script type="text/javascript" src="{{url('public/assets_new/plugins/bower_components/jquery/dist/jquery.min.js')}}"></script>
<script type="text/javascript" src="{{url('public/assets_new/bootstrap/dist/js/bootstrap.min.js')}}"></script>
<script>
    $(document).ready(function() {
        $('#loginbutton').on('click', function(event) {
            $('#loginform').show();
            $('#contactform').hide();
            $('#registerform').hide();
            $('#forgotpasswordform').hide();
            $('#loginbutton').css('opacity', '0');
            $('#contactbutton').css('opacity', '1');
            if ($('#recaptcha1').length) {
                grecaptcha.render('recaptcha1', {
                    sitekey: '6LcWxYYUAAAAAOO9Z7JRWsXNqxvYPtlHONQXA28G',
                    callback: function(response) {
                        $("#recaptcha1_hidden").val(response);
                    }
                });
            }
        });
        $('.loginclose').on('click', function(event) {
            $('#loginbutton').css('opacity', '1');
            $('#contactbutton').css('opacity', '1');
            $('#loginform').hide();
            $('#registerform').hide();
            $('#forgotpasswordform').hide();
            grecaptcha.reset();
        });
        $('#contactbutton').on('click', function(event) {
            $('#contactform').show();
            $('#contactbutton').css('opacity', '0');
            $('#loginbutton').css('opacity', '1');
            $('#loginform').hide();
            $('#registerform').hide();
            $('#forgotpasswordform').hide();
            if ($('#recaptcha4').length) {
                grecaptcha.render('recaptcha4', {
                    sitekey: '6LcWxYYUAAAAAOO9Z7JRWsXNqxvYPtlHONQXA28G',
                    callback: function(response) {
                        $("#recaptcha4_hidden").val(response);
                    }
                });
            }
        });
        $('.contactclose').on('click', function(event) {
            $('#loginbutton').show();
            $('#contactbutton').css('opacity', '1');
            $('#contactform').hide();
            $('#registerform').hide();
            $('#forgotpasswordform').hide();
            grecaptcha.reset();
        });
        $('#register').on('click', function(event) {
            $('#registerform').show();
            $('#loginform').hide();
            if ($('#recaptcha2').length) {
                grecaptcha.render('recaptcha2', {
                    sitekey: '6LcWxYYUAAAAAOO9Z7JRWsXNqxvYPtlHONQXA28G',
                    callback: function(response) {
                        $("#recaptcha2_hidden").val(response);
                    }
                });
            }
        });
        $('#forgotpassword').on('click', function(event) {
            $('#forgotpasswordform').show();
            $('#loginform').hide();
            if ($('#recaptcha3').length) {
                grecaptcha.render('recaptcha3', {
                    sitekey: '6LcWxYYUAAAAAOO9Z7JRWsXNqxvYPtlHONQXA28G',
                    callback: function(response) {
                        $("#recaptcha3_hidden").val(response);
                    }
                });
            }
        });
        $('#register_form_close').on('click', function(event) {
            $('#registerform').hide();
            $('#loginform').show();
            grecaptcha.reset();
        });
        $('#contact_form_close').on('click', function(event) {
            $('#contactform').hide();
            $('#loginform').show();
            $('#loginbutton').css('opacity', '0');
            $('#contactbutton').css('opacity', '1');
            if ($('#recaptcha1').length) {
                grecaptcha.render('recaptcha1', {
                    sitekey: '6LcWxYYUAAAAAOO9Z7JRWsXNqxvYPtlHONQXA28G'
                });
            }
        });
        $('#forget_form_close').on('click', function(event) {
            $('#forgotpasswordform').hide();
            $('#loginform').show();
            grecaptcha.reset();
        });
    });
    $('#form1').on('submit', function(e) {
        e.preventDefault();
        $('#loginload').prop('disabled', true);
        $("#email").empty();
        var email = $(this).find('input[name=email]').val();
        var pass = $(this).find('input[name=password]').val();
        var _token = $('input[name="_token"]').val();
        var elem = $(e.currentTarget);
        elem.addClass('active');
        if (document.getElementById("recaptcha1_hidden").value == "") {
            $('#loginload').prop('disabled', false);
            e.preventDefault();
            $("#msg1").html("<h4 style='color:red;text-align:center;font-size:small;'>Please Check Robot</h4>");
            xhr.abort();
        } else {
            $('#loginload').append('<i id="load" class="fa fa-spinner fa-spin"></i>');
            $.ajax({
                type: 'POST',
                url: '<?php echo url("auth/login");?>',
                data: "email=" + email + "&password=" + pass + "&_token=" + _token,
                success: function(data) {
                    if (data == 'success') {
                        window.location.href = '<?php echo url("admin/facilitylist"); ?>';
                    } else {
                        $("#email").append(data);
                        $("#load ").remove();
                        $('#loginload').prop('disabled', false);
                    }
                }
            });
        }
    });
    $('#form2').on('submit', function(e) {
        if (document.getElementById("recaptcha2_hidden").value == "") {
            e.preventDefault();
            $("#msg2").html("<h4 style='color:red;text-align:center;font-size:small;'>Please Check Robot</h4>");
        }
    });
    $('#form3').on('submit', function(e) {
        if (document.getElementById("recaptcha3_hidden").value == "") {
            e.preventDefault();
            $("#msg3").html("<h4 style='color:red;text-align:center;font-size:small;'>Please Check Robot</h4>");
        }
    });
    $('#form4').on('submit', function(e) {
        if (document.getElementById("recaptcha4_hidden").value == "") {
            e.preventDefault();
            $("#msg4").html("<h4 style='color:red;text-align:center;font-size:small;'>Please Check Robot</h4>");
        }
    });
</script>
<script>
    var close = document.getElementsByClassName("closebtn");
    var i;
    for (i = 0; i < close.length; i++) {
        close[i].onclick = function() {
            var div = this.parentElement;
            div.style.opacity = "0";
            setTimeout(function() {
                div.style.display = "none";
            }, 600);
        }
    }
</script>
<script>
    $('#flash_message').fadeIn().delay(10000).fadeOut();
</script>
    </body>
</html>