$pinc.ui.auth

3min
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
JS

<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>



<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

<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>

<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>
﻿
﻿
﻿
Updated 03 Mar 2023
Did this page help you?
Methods
Integration Setup Guides