socketio-jwt/example/socketsio-auth0-sample/views/index.pug

extends layout

block content
    script(src="https://cdn.auth0.com/js/lock-9.2.min.js")
    script(src="/socket.io/socket.io.js")
    script(src="http://code.jquery.com/jquery-1.12.4.js")


    div#login
        button.btn Login
    div#chat
        ul#messages
            form(action="")
                input(id="m" autocomplete="off")
                button.btn Send

    script.
        var userProfile;
        var userToken;
        var lock = new Auth0Lock('#{env.AUTH0_CLIENT_ID}', '#{env.AUTH0_DOMAIN}');
        var hash = lock.parseHash();
        $('#chat').hide();
        $('#login button').click(function (e) {
            e.preventDefault();
            lock.show();
        });

        if (hash) {
            if (hash.error) {
                console.log("There was an error logging in", hash.error);
            }
            else {
                lock.getProfile(hash.id_token, function (err, profile) {
                    if (err) {
                        console.log('Cannot get user', err);
                        return;
                    }
                    console.log('connected and authenticated');
                    userProfile = profile;
                    localStorage.setItem('userToken', hash.id_token);
                    userToken = hash.id_token;
                    openChat();
                });
            }
        }

        function openChat() {
            var socket = io();
            socket.on('connect', function () {
                socket.on('authenticated', function () {
                    //Do
                    $('#login').hide();
                    $('#chat').show();
                    $('form').submit(function (event) {
                        socket.emit('chat message', $('#m').val());
                        $('#m').val('');
                        return false;
                    });
                    socket.on('chat message', function (msg) {
                        console.log("msg");
                        $('#messages').append($('<li>').text(msg));
                    });
                }).emit('authenticate', {token: userToken}); // send the jwt
            })
        };