@extends ('index')
@section ('content')
    <!-- scrollToTop -->
    <!-- ================ -->
    <!--<div class="scrollToTop circle"><i class="icon-up-open-big"></i></div>-->

    <!-- page wrapper start -->
    <!-- ================ -->


    <div class="main-container dark-translucent-bg" ng-app="loginApp" ng-controller="loginCtlr as login"
         style="background-image:url('img/landing/planning.jpg');">
        <div class="container">
            <div class="row">
                <!-- main start -->
                <!-- ================ -->
                <div class="main object-non-visible" data-animation-effect="fadeInUpSmall" data-effect-delay="100">

                    <div class="form-block center-block p-30 light-gray-bg border-clear">

                        {{--<h3 class="title" style="color: #777777;text-transform: uppercase;"> Inicio de--}}
                            {{--Sesi&oacute;n</h3>--}}

                        <div class="mt-10 text-center">
                            <a target="_self" href="/auth/social/login/facebook"
                               class="btn btn-animated  facebook social-login">Login con Facebook<i
                                        class="pl-10 fa fa-facebook-square"></i></a>

                            {{--<a target="_self" href="/auth/social/login/linkedin"--}}
                               {{--class="btn btn-animated linkedin social-login">Linkedin<i--}}
                                        {{--class="pl-10 fa fa-linkedin"></i></a>--}}

                            {{--<a target="_self" href="/auth/social/login/google"--}}
                               {{--class="btn btn-animated googleplus social-login">Google+<i--}}
                                        {{--class="pl-10 fa fa-google-plus"></i></a>--}}
                        </div>

                        <hr>

                        {{-- 	<h2 class="title"> Inicio de Sesi&oacute;n </h2> --}}

                        <div class="alert alert-danger alert-dismissible mb-20" style="display: none" id="error"
                             role="alert">
                            <button type="button" class="close" onclick="$('#error').hide()"><span
                                        aria-hidden="true">×</span></button>
                            <strong>Error!</strong> <span id="error-content"></span>
                        </div>


                        <!--<h2 class="title text-left">Login</h2>-->
                        <form id="loginForm" name="loginForm" action="/auth/login" class="form-horizontal text-left"
                              method="post" novalidate>

                            {{ csrf_field() }}

                            @foreach (app('request')->all() as $k => $v   )
                                <input type="hidden" id="{{$k}}" name="{{$k}}" value="{{$v}}">
                            @endforeach


                            <div class="form-group has-feedback"
                                 ng-class="{'has-error has-feedback': ( login.submit || !loginForm.email.$pristine) && loginForm.email.$invalid , 'has-success has-feedback' : loginForm.email.$valid }">
                                <label for="inputUserName" class="col-sm-3 control-label">Email</label>
                                <div class="col-sm-8">
                                    <input type="email" ng-model="login.email" class="form-control" name="email"
                                           id="email" placeholder="email" required>


                                    {{--@if ($errors->has('email'))--}}
                                        {{--<span class="help-block">--}}
                                        {{--<strong>{{ $errors->first('email') }}</strong>--}}
                                    {{--</span>--}}
                                    {{--@endif--}}


                                    <i ng-hide="(!loginForm.email.$pristine)"
                                       class="fa fa-user form-control-feedback i-input"></i>

                                    <i ng-show="( login.submit || !loginForm.email.$pristine) && loginForm.email.$invalid"
                                       class="fa fa-times form-control-feedback"></i>
                                    <i ng-show="loginForm.email.$valid" class="fa fa-check form-control-feedback"></i>

                                    <em ng-show=" ( login.submit || !loginForm.email.$pristine) && loginForm.email.$invalid  "
                                        class="error help-block">Por favor ingrese un correo el&eacute;ctronico
                                        v&aacute;lido</em>

                                </div>

                            </div>
                            <div class="form-group has-feedback"
                                 ng-class="{'has-error has-feedback': ( login.submit || !loginForm.password.$pristine) && loginForm.password.$invalid , 'has-success has-feedback' : loginForm.password.$valid }">
                                <label for="inputPassword" class="col-sm-3 control-label">Contrase&ntilde;a</label>
                                <div class="col-sm-8">
                                    <input type="password" ng-model="login.password" name="password"
                                           class="form-control" id="inputPassword" placeholder="Contrase&ntilde;a"
                                           required>

                                    {{--@if ($errors->has('password'))--}}
                                        {{--<span class="help-block">--}}
                                        {{--<strong>{{ $errors->first('password') }}</strong>--}}
                                    {{--</span>--}}
                                    {{--@endif--}}

                                    <i ng-hide="(!loginForm.email.$pristine)"
                                       class="fa fa-lock form-control-feedback i-input"></i>


                                    <i ng-show="( login.submit || !loginForm.password.$pristine) && loginForm.password.$invalid"
                                       class="fa fa-times form-control-feedback"></i>
                                    <i ng-show="loginForm.password.$valid"
                                       class="fa fa-check form-control-feedback"></i>
                                    <em ng-show=" ( login.submit || !loginForm.password.$pristine) && loginForm.password.$invalid  "
                                        class="error help-block">Por favor ingrese su contrase&ntilde;a</em>
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-sm-offset-3 col-sm-8">
                                    <!--<div class="checkbox">-->
                                    <!--<label>-->
                                    <!--<input type="checkbox" required> Remember me.-->
                                    <!--</label>-->
                                    <!--</div>-->

                                    <div class="form-group has-error has-feedback">
                                        @if ($errors->has('email'))
                                            <span class="error help-block">
                                        <strong>{{ $errors->first('email') }}</strong>
                                    </span>
                                        @endif

                                    </div>

                                    <button id="button_login" type="submit"
                                            class="btn btn-group btn-default btn-animated"
                                            ng-disabled="login.working"
                                            ng-click="login.login($event,loginForm.$valid)">Entrar <i
                                                class="fa fa-user"></i></button>




                                    {{-- <button type="submit" class="btn btn-info" ng-click="login.login($event,loginForm.$valid)" >Entrar </button> --}}
                                    <ul class="space-top">
                                        <li><a href="forgotpassword" style="color: #777777">Olvid&oacute; su
                                                contraseña?</a></li>
                                    </ul>
                                    <!--<span class="text-muted">Login with</span>-->
                                    <!--<ul class="social-links colored circle clearfix">-->
                                    <!--<li class="facebook"><a target="_blank" href="http://www.facebook.com"><i class="fa fa-facebook"></i></a></li>-->
                                    <!--<li class="twitter"><a target="_blank" href="http://www.twitter.com"><i class="fa fa-twitter"></i></a></li>-->
                                    <!--<li class="googleplus"><a target="_blank" href="http://plus.google.com"><i class="fa fa-google-plus"></i></a></li>-->
                                    <!--</ul>-->
                                </div>
                            </div>
                        </form>
                        <!--<p>Don't have an account yet? <a href="page-signup-2.html">Sing up</a> now.</p>-->
                    </div>

                    <p class="text-center space-top">¿No tiene una cuenta todav&iacute;a? <a href="elegir-cuenta">Reg&iacute;strate</a>
                        ahora.</p>
                </div>
                <!-- main end -->
            </div>
        </div>
    </div>
    <!-- main-container end -->

@stop


{{--@section('script')--}}
{{--<script src="js/scripts/js/app/commonService.min.js"></script>--}}
{{--<script src="js/scripts/js/app/loginApp.min.js"></script>--}}
{{--@stop--}}