Google social sign in directive #angular #directive #google #social

analyticsController.js

$scope.$on('event:google-plus-signin-success', function (event, authResult) {
            // Send login to server or save into cookie
            $scope.showLoader = true;
            if (authResult && authResult['code']) {
                $http.post('/setup/authorize', { code: authResult['code'] }).then(function () {
                    $http.get('/setup/getaccounts').then(function (response) {
                        $scope.signedIn = true;
                        $scope.data.accounts = response.data;
                        $scope.showLoader = false;
                    });
                });
            }
        });

gSignin.js

angular.module('app').directive('gSignin',function () {

        var container = angular.element('<span class="g-signin"></span>');

        var defaults = {
            scope: 'https://www.googleapis.com/auth/analytics.edit https://www.googleapis.com/auth/analytics https://www.googleapis.com/auth/analytics.manage.users',
            redirecturi: 'postmessage',
            accesstype: 'offline',
            cookiepolicy: 'single_host_origin',
            callback: 'signInCallback'
        };

        // Asynchronously load the G+ SDK.
        (function () {
            var po = document.createElement('script');
            po.type = 'text/javascript';
            po.async = true;
            po.src = 'https://apis.google.com/js/client:plusone.js?onload=start';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(po, s);
        })();

        return {
            restrict: 'E',
            compile: function (element, attrs, transclude) {

                if (!attrs.hasOwnProperty('clientid')) {
                    throw "Client Id Required";
                }

                container.attr('data-clientid', attrs.clientid);

                angular.forEach(Object.getOwnPropertyNames(defaults), function (propName) {
                    if (!attrs.hasOwnProperty(propName)) {
                        container.attr('data-' + propName, defaults[propName]);
                    } else {
                        container.attr('data-' + propName, attrs[propName]);
                    }
                });

                element.append(container);
            }
        };

    }).run(['$window', '$rootScope', function ($window, $rootScope) {
            $window.signInCallback = function (authResult) {
                if (authResult && authResult.access_token) {
                    $rootScope.$broadcast('event:google-plus-signin-success', authResult);
                } else {
                    $rootScope.$broadcast('event:google-plus-signin-failure', authResult);
                }
            };
        }]);

view.html

<div class="row text-center" ng-hide="signedIn || showLoader">
        <div class="col-md-10 col-md-push-1">
            <g-signin clientid="XXXXXX"></g-signin>
        </div>
    </div>