@extends('layout.auth')

@section('content')
    <div class="login-container">
        <div class="login-header">
            <div class="login-content">
                <a href="#" class="logo">
                    <img src="" alt="" width="100" />
                </a>
                <p class="description">{{ $OAuth2App->AppName }} needs your permission to access data from Neon:</p>
                <!-- progress bar indicator -->
                <div class="login-progressbar-indicator">
                    <h3>0%</h3>
                    <span>logging in...</span>
                </div>
            </div>
        </div>

        <div class="login-form">
            <div class="login-content">
                <form method="post" role="form" id="form-auth" action="{{ URL::to('/api/oauth2/authenticate') }}">

                    <div class="form-group lockscreen-input">
                        <div class="lockscreen-thumb">
                            <img src="" width="140" class="img-circle" />
                            <div class="lockscreen-progress-indicator">0%</div>
                        </div>
                        <div class="lockscreen-details">
                            <h4>{{ $OAuth2App->AppName }}</h4>
                            <span data-login-text="logging in..."></span>
                        </div>
                    </div>

                    <div class="form-group">
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" name="IAccept" id="IAccept" value="1" class="terms-conditions"> Yes, I accept the Neon Terms & Condition of Use
                            </label>
                        </div>
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" name="IUnderstand" id="IUnderstand" value="1" class="terms-conditions"> Yes, I Understand the usage of the application is solely subject to the terms & conditions of the application supplier and that the application will use data as stated above.
                            </label>
                        </div>
                    </div>

                    <div class="form-group">
                        <input type="hidden" name="OAuth2AppID" value="{{ $OAuth2App->OAuth2AppID }}" />
                        <input type="hidden" name="redirect_url" value="{{ $OAuth2App->redirect_url }}" />
                        <input type="hidden" name="auth" id="auth" value="" />
                    </div>

                    <div class="form-group">
                        <button type="button" class="btn btn-success btn-block btn-auth" disabled="disabled" id="allow">
                            Allow
                        </button>
                    </div>
                    <div class="form-group">
                        <button type="button" class="btn btn-default btn-block btn-auth" id="deny">
                            Deny
                        </button>
                    </div>

                </form>
            </div>
        </div>
    </div>

    <script type="application/javascript">
        $(document).ready(function() {
            $('.btn-auth').on('click', function(ev) {
                ev.preventDefault();
                var auth = $(this).attr('id');
                $('#auth').val(auth);

                $('#form-auth').submit();
            });

            $('.terms-conditions').on("change", function() {
                var IAccept     = $('#IAccept').is(":checked");
                var IUnderstand = $('#IUnderstand').is(":checked");

                if(IAccept && IUnderstand) {
                    $('#allow').removeAttr('disabled');
                } else {
                    $('#allow').attr('disabled','disabled');
                }
            });
        });
    </script>

@stop