How can I get the user's email and username fr

Question

We want to allow users to login to our site with their Facebook account, so I followed the steps that FB gave to add a facebook login button to our header:

Right after the body tag on the site i ended up with this:

<div id="fb-root"></div>
<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId      : '331796760586880',
            cookie     : true,
            xfbml      : true,
            version    : 'v2.8'
        });
        FB.AppEvents.logPageView();
    };

    (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/en_US/sdk.js";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

The blue login button in the nav bar (or potentially the login menu):

if($loggedIn == false){ 
?>
     <div style="margin-top: 5px;"><div class="fb-login-button" data-max-rows="1" data-size="small" data-button-type="login_with" data-show-faces="false" data-auto-logout-link="false" data-use-continue-as="false"></div></div>
<?php }

Now I need to somehow get the email and username of the facebook user into a php variable, because that's how our site knows who is logged in.

so it should end up something like this:

$user_email = //facebook user's email
$user_username = //facebook user's username

Then i can compare it to existing users on our site and either log them in or create a new account.

Or at least put them in js variables, then i can figure out a way to send them to the server side php with Ajax or something:

var user_email = //facebook user's email
var user_username = //facebook user's username

In the code facebook gave me I don't see where it returns the user's credentials

I found some code that might be it:

$user = $response->getGraphUser();
echo 'Name: ' . $user['name'];

But i have no idea where to put it.

Thanks :)