login.html.twig

{% extends 'base.html.twig' %}

{% block title %}Log in!{% endblock %}

{% block body %}
    <form method="post">
        {% if error %}
            <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
        {% endif %}

        <h1 class="h3 mb-3 font-weight-normal">Please sign in</h1>
        <label for="inputLogin" class="sr-only">Login</label>
        <input type="text" value="{{ last_username }}" name="login" id="inputLogin" class="form-control"
               placeholder="Login" required autofocus>
        <label for="inputPassword" class="sr-only">Password</label>
        <input type="password" name="password" id="inputPassword" class="form-control" placeholder="Password" required>

        <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">

        <button class="btn btn-lg btn-primary" type="submit">
            Sign in
        </button>
        <button class="btn-facebook btn btn-lg btn-primary">Entre com facebook</button>
    </form>
{% endblock %}
{% block javascripts %}
    <script>
        $(".btn-facebook").on("click", function (e) {
            e.preventDefault();

            fb_login();
        })

        window.fbAsyncInit = function () {
            FB.init({
                appId: '225654845054108', // aqui vai o id do App do facebook =)
                status: true,
                xfbml: true
            })
        };

        // Load the SDK asynchronously
        (function (d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0];

            if (d.getElementById(id)) {
                return;
            }

            js = d.createElement(s);
            js.id = id;
            js.src = "//connect.facebook.net/pt_BR/all.js";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));

        function fb_login() {
            var urlParaAutenticar = "aqui vai a url pra autenticar";

            FB.getLoginStatus(function (response) {
                if (response.status === 'connected') {
                    document.location = urlParaAutenticar;
                } else {
                    // not_authorized
                    FB.login(function (response) {
                        if (response.authResponse) {
                            document.location = urlParaAutenticar;
                        } else {
                            toastr.error("Mensagem caso tudo de errado")
                        }
                    });
                }
            })
        }

    </script>

{% endblock %}