sirkitree / angular-directive.g-signin

:triangular_ruler: AngularJS Directive for Google Plus Sign-in Button
http://jeradbitner.com/angular-directive.g-signin/
148 stars 84 forks source link

signinCallback() #4

Closed sirkitree closed 10 years ago

sirkitree commented 11 years ago

We should perhaps make this configurable so that the signinCallback() can be some other function which could be used within a controller.

dbitting commented 11 years ago

The challenge, as I understand it, is that asynchronous loading of the G+ api forces something to happen in the global javascript namespace/scope/whatever-you-call-it. If you use the attribute-based mechanism (which this directive does), then the API makes a callback to a global function when an authentication attempt is complete. On the other hand, if you make use of the JavaScript API, the G+ api strongly encourages you to use an "onload" parameter on the async load of the api source; this onload function, too, is global. So, it seems to me that you're only choosing which global function you need to integrate with Angular.

For the record, this is the way I handle the callback within my toy application:

function signinCallback(authResult) {
    angular.element(<retrieve my ngApp DOM node>))
        .scope().$broadcast('signinCallback', authResult);
}

This appeals to me in that it takes a global callback and broadcasts it globally within Angular's "world."

Given that I'm new to all this stuff, I reserve the right to be wrong. :)

apple314159 commented 11 years ago

Here is how I handle the signinCallback:

function signinCallback(authResult) {
    console.log(authResult);

    var rscope = angular.element(document).scope();
    rscope.$apply( rscope.$broadcast('signinCallback', authResult) );
}

In the controller, add the following:

    $scope.$on("signinCallback", function(event, authResult) {
        // do something
    });

Perhaps this should be part of the standard package.

sirkitree commented 11 years ago

Would you mind creating a pull request @apple314159? I'd like to test this out. I'm not very familiar with $broadcast so it'll give me a chance to learn more.

gonzofish commented 10 years ago

@apple314159 There's no issue with exposing your app/controller within a global function like that?

djds4rce commented 10 years ago

@gonzofish The Global Function Doesn't Actually have access to the the controller function. Instead It follows a Publish and Subscribe Model. A global Broadcast is subscribed in the controller.

doingweb commented 10 years ago

Using the $rootScope and putting signinCallback() on $window in a run() on the module has been working for me so far:

angular.module('MyApp', ['directive.g+signin'])
    .run(function ($window, $rootScope) {
        $window.signinCallback = function (authResult) {
            // Do your signin stuff, perhaps saving parts of authResult to $rootScope.
        };

        $rootScope.signOut = function () {
            gapi.auth.signOut();
        };
    });

The Google+ API can reach the signinCallback(), and my controllers and templates can reach stuff like signOut() and other login-related variables, since their scopes all descend from the $rootScope.

doingweb commented 10 years ago

Is this still an issue, or can we close this with #8?