$pinc.ui.auth

3 min

Dependencies

$pinc
$pinc.oauth
$pinc.auth

Script module (separate each by a comma)

pinc.auth.min
ui.auth

What does it do?

Our ui.auth module depends heavily on the pinc.auth.module and provides a user interface to enable the equivalent of a multi provider SSO. The is the primary module behind the Single Sign on (SSO) / Social login

Primary Functions

Render list of login buttons based on $pinc.auth.providers
Listen to internal events of $pinc.auth module and convert them into simplified events that map to data-on-logged-out and data-on-logged-in

Example

Part 1. Code to include in the Login Page


<html>
    <body>
        <div>
            <script src="https://labs.pathfix.com/helper.js" 
            modules="pinc.auth.min,ui.auth"
            data-public-key="...">
            data-auth-providers="fb,ms"
            data-auth-success-url="/dashboard"
            ></script>
        <div>    
    </body>
</html>

Part 2. Code to include in your Redirect Page


<html>
    <head>
        <script>
            function _loggedInCallback(){
                //Aha! Login successfull
                console.log($pinc.auth.profile)
            }

            function _loggedOutCallback(){
                //Redirect to login page
                window.location = "/login"
            }

        </script>   
        <script src="https://labs.pathfix.com/helper.js" 
            modules="pinc.auth.min,ui.auth"
            data-public-key="...">
            data-on-logged-in="_loggedInCallback()"
            data-on-logged-out="_loggedOutCallback()"
            data-auth-providers="fb,ms"
            ></script>
    </head>
    <body>
    </body>
</html>