Add login/logout events

demo-angular/app/app.component.html

@@ -1,4 +1,6 @@
 <StackLayout>
-    <FacebookLoginButton [login]="onLogin"></FacebookLoginButton>
-    <Button text="Custom Login Button" (tap)="testAction()"></Button>
-</StackLayout>
+    <Label text="{{userId}}"></Label>
+    <FacebookLoginButton (login)="onLogin($event)" (logout)="onLogout($event)"></FacebookLoginButton>
+    <Button text="Custom Login Button" (tap)="manualLogin()"></Button>
+    <Button text="Custom Logout Button" (tap)="manualLogout()"></Button>
+</StackLayout>

demo-angular/app/app.component.ts

@@ -1,18 +1,41 @@
-import { Component } from "@angular/core";
+import { Component, ChangeDetectorRef } from "@angular/core";
 import * as Facebook from "nativescript-facebook";
 
 @Component({
     selector: "ns-app",
     templateUrl: "app.component.html",
 })
 export class AppComponent {
-    onLogin = function (error: string, loginResponse: Facebook.LoginResponse) {
-        console.log("TOKEN: " + loginResponse.token);
+    userId: string = "not logged in";
+
+    constructor(private ref: ChangeDetectorRef) {
+    }
+
+    onLogin = function (eventData: Facebook.LoginEventData) {
+        if (eventData.error) {
+            alert("Error during login: " + eventData.error);
+        } else {
+            this.userId = "UserId: " + eventData.loginResponse.userId;
+            this.ref.detectChanges();
+        }
+    };
+
+    manualLogin = function () {
+        Facebook.login((error, loginResponse) => {
+            this.userId = "UserId: " + loginResponse.userId;
+            this.ref.detectChanges();
+        });
     };
 
-    testAction = function () {
-        Facebook.login((error, data) => {
-            console.log("Success!");
+    manualLogout = function () {
+        Facebook.logout(() => {
+            this.userId = "not logged in";
+            this.ref.detectChanges();
         });
     };
+
+    public onLogout() {
+        this.userId = "not logged in";
+        this.ref.detectChanges();
+    }
 }

demo/app/main-page.xml

@@ -1,9 +1,9 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd"
       xmlns:Facebook="nativescript-facebook"
   loaded="pageLoaded" class="page">
-  <StackLayout class="p-20" style="vertical-align: bottom;" >
-    <Label id="userIdLabel" text="{{ labelContent }}" style="padding-bottom: 100;horizontal-align: center;"/>
-    <Facebook:LoginButton login="{{ onLogin }}"></Facebook:LoginButton>
-    <Button tap="{{ testAction }}" text="Custom Login Button"></Button>
+  <StackLayout>
+    <Label text="{{ userId }}"></Label>
+    <Facebook:LoginButton login="{{ onLogin }}" logout="{{ onLogout }}"></Facebook:LoginButton>
+    <Button text="Log Out" tap="{{ logout }}"></Button>
   </StackLayout>
-</Page> 
+</Page>

demo/app/main-view-model.ts

@@ -1,14 +1,22 @@
 import { Observable } from 'data/observable';
-import { login } from "nativescript-facebook";
+import { LoginEventData, logout as fbLogout } from "nativescript-facebook";
 
-// Facebook Authentication CODE
 export class HelloWorldModel extends Observable {
+  public userId: string = "not logged in";
 
-  public onLogin(error, data) {
-    console.log("Success!");
+  public onLogin(eventData: LoginEventData) {
+    if (eventData.error) {
+      alert("Error during login: " + eventData.error.message);
+    } else {
+      this.set("userId", "UserId: " + eventData.loginResponse.userId);
+    }
   }
 
-  public testAction() {
-    login((error, data) => console.log("Success!"));
+  public onLogout() {
+    this.set("userId", "not logged in");
+  }
+
+  public logout() {
+    fbLogout(() => this.set("userId", "not logged in"));
   }
 }

src/index.android.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":3,"metadata":{},"exports":[{"from":"./login-manager"},{"from":"./login-button"}]},{"__symbolic":"module","version":1,"metadata":{},"exports":[{"from":"./login-manager"},{"from":"./login-button"}]}]
+[{"__symbolic":"module","version":3,"metadata":{},"exports":[{"from":"./login-manager"},{"from":"./login-button"},{"from":"./login-event-data"}]},{"__symbolic":"module","version":1,"metadata":{},"exports":[{"from":"./login-manager"},{"from":"./login-button"},{"from":"./login-event-data"}]}]

src/index.android.ts

@@ -1,2 +1,3 @@
 export * from "./login-manager";
-export * from  "./login-button";
+export * from  "./login-button";
+export * from "./login-event-data";

src/index.d.ts

@@ -1,3 +1,4 @@
 export * from "./login-manager";
 export * from "./login-button";
 export * from "./login-response";
+export * from "./login-event-data";

src/index.ios.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":3,"metadata":{},"exports":[{"from":"./login-button"},{"from":"./login-manager"}]},{"__symbolic":"module","version":1,"metadata":{},"exports":[{"from":"./login-button"},{"from":"./login-manager"}]}]
+[{"__symbolic":"module","version":3,"metadata":{},"exports":[{"from":"./login-button"},{"from":"./login-manager"},{"from":"./login-event-data"}]},{"__symbolic":"module","version":1,"metadata":{},"exports":[{"from":"./login-button"},{"from":"./login-manager"},{"from":"./login-event-data"}]}]

src/index.ios.ts

@@ -1,6 +1,7 @@
 import * as applicationModule from "application";
 export * from  "./login-button";
 export * from "./login-manager";
+export * from "./login-event-data";
 
 declare class UIResponder { }
 declare class NSDictionary { }

src/login-button.common.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":3,"metadata":{"LoginButtonBase":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"ui/core/view","name":"View"},"members":{"onLoginPropertyChanged":[{"__symbolic":"method"}]}},"onLoginProperty":{"__symbolic":"error","message":"Function call not supported","line":10,"character":31}}},{"__symbolic":"module","version":1,"metadata":{"LoginButtonBase":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"ui/core/view","name":"View"},"members":{"onLoginPropertyChanged":[{"__symbolic":"method"}]}},"onLoginProperty":{"__symbolic":"error","message":"Function call not supported","line":10,"character":31}}}]
+[{"__symbolic":"module","version":3,"metadata":{"LoginButtonBase":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"ui/core/view","name":"View"},"members":{"initNativeView":[{"__symbolic":"method"}]},"statics":{"loginEvent":"login","logoutEvent":"logout"}}}},{"__symbolic":"module","version":1,"metadata":{"LoginButtonBase":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"ui/core/view","name":"View"},"members":{"initNativeView":[{"__symbolic":"method"}]},"statics":{"loginEvent":"login","logoutEvent":"logout"}}}}]

src/login-button.common.ts

@@ -1,15 +1,19 @@
 import { View, Property } from "ui/core/view";
 import * as loginManager from './login-manager';
+import { LoginResponse } from './login-response';
+import { LoginEventData } from './login-event-data';
+import { EventData } from "data/observable";
 
 export abstract class LoginButtonBase extends View {
-  onLoginPropertyChanged(callback: any) {
-    loginManager._registerLoginCallback(callback);
-  }
-}
+  public static loginEvent: string = "login";
+  public static logoutEvent: string = "logout";
 
-export const onLoginProperty = new Property<LoginButtonBase, Function>({
-  name: "login", valueChanged: (btn, oldV, newV) => {
-    btn.onLoginPropertyChanged(newV);
+  initNativeView() {
+    loginManager._registerLoginCallback((error: Error, loginResponse: LoginResponse) => {
+      this.notify(<LoginEventData>{ eventName: LoginButtonBase.loginEvent, object: this, error: error, loginResponse: loginResponse });
+    });
+    loginManager._registerLogoutCallback(() => {
+      this.notify(<EventData>{ eventName: LoginButtonBase.logoutEvent, object: this });
+    });
   }
-});
-onLoginProperty.register(LoginButtonBase);
+}

src/login-button.d.ts

@@ -1 +1,8 @@
-export declare class LoginButton {}
+import { LoginEventData } from './login-event-data';
+import { EventData } from "data/observable";
+import { View } from "ui/core/view";
+
+export declare class LoginButton extends View {
+    on(event: "login", callback: (data: LoginEventData) => void, thisArg?: any);
+    on(eventNames: string, callback: (data: EventData) => void, thisArg?: any);
+}

src/login-button.ios.ts

@@ -31,13 +31,15 @@ class LoginButtonDelegate extends NSObject implements FBSDKLoginButtonDelegate {
   public static ObjCProtocols = [FBSDKLoginButtonDelegate];
 
   loginButtonDidCompleteWithResultError(loginButton: any, result: any, error: NSError) {
-    if (loginManager._onLoginCallback) {
-      loginManager._onLoginCallback(result, error);
+    if (loginManager.onLoginCallback) {
+      loginManager.onLoginCallback(result, error);
     }
   }
 
   loginButtonDidLogOut(loginButton: any) {
-    // TODO: Provide logout callback
+    if (loginManager.onLogoutCallback) {
+      loginManager.onLogoutCallback();
+    }
   }
 
   loginButtonWillLogin(loginButton: any) {

src/login-event-data.d.ts

@@ -0,0 +1,7 @@
+import { EventData } from "data/observable";
+import { LoginResponse } from "./login-response";
+
+export declare interface LoginEventData extends EventData {
+    error: Error;
+    loginResponse: LoginResponse;
+}

src/login-event-data.metadata.json

@@ -0,0 +1 @@
+[{"__symbolic":"module","version":3,"metadata":{"LoginEventData":{"__symbolic":"interface"}}},{"__symbolic":"module","version":1,"metadata":{"LoginEventData":{"__symbolic":"interface"}}}]

src/login-event-data.ts

@@ -0,0 +1,7 @@
+import { EventData } from "data/observable";
+import { LoginResponse } from "./login-response";
+
+export interface LoginEventData extends EventData {
+  error: Error;
+  loginResponse: LoginResponse;
+}

src/login-manager.android.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":3,"metadata":{"init":{"__symbolic":"function"},"_registerLoginCallback":{"__symbolic":"function"},"requestPublishPermissions":{"__symbolic":"function"},"requestReadPermissions":{"__symbolic":"function"},"login":{"__symbolic":"function"}}},{"__symbolic":"module","version":1,"metadata":{"init":{"__symbolic":"function"},"_registerLoginCallback":{"__symbolic":"function"},"requestPublishPermissions":{"__symbolic":"function"},"requestReadPermissions":{"__symbolic":"function"},"login":{"__symbolic":"function"}}}]
+[{"__symbolic":"module","version":3,"metadata":{"onLoginCallback":{"__symbolic":"error","message":"Variable not initialized","line":7,"character":11},"onLogoutCallback":{"__symbolic":"error","message":"Variable not initialized","line":8,"character":11},"_registerLogoutCallback":{"__symbolic":"function"},"init":{"__symbolic":"function"},"_registerLoginCallback":{"__symbolic":"function"},"requestPublishPermissions":{"__symbolic":"function"},"requestReadPermissions":{"__symbolic":"function"},"login":{"__symbolic":"function"},"logout":{"__symbolic":"function"}}},{"__symbolic":"module","version":1,"metadata":{"onLoginCallback":{"__symbolic":"error","message":"Variable not initialized","line":7,"character":11},"onLogoutCallback":{"__symbolic":"error","message":"Variable not initialized","line":8,"character":11},"_registerLogoutCallback":{"__symbolic":"function"},"init":{"__symbolic":"function"},"_registerLoginCallback":{"__symbolic":"function"},"requestPublishPermissions":{"__symbolic":"function"},"requestReadPermissions":{"__symbolic":"function"},"login":{"__symbolic":"function"},"logout":{"__symbolic":"function"}}}]

src/login-manager.android.ts

@@ -5,11 +5,16 @@ declare let com: any;
 const LOGIN_PERMISSIONS = ["public_profile", "email"];
 
 // TODO: add getter and setter
-let onLoginCallback;
+export let onLoginCallback;
+export let onLogoutCallback;
 let androidApplication;
 let _act: android.app.Activity;
 let loginManager;
 
+export function _registerLogoutCallback(callback: Function) {
+  onLogoutCallback = callback;
+}
+
 export function init(fbId: string) {
   setAppId(fbId);
   androidApplication = application.android;
@@ -23,6 +28,18 @@ export function init(fbId: string) {
   onLoginCallback = com.facebook.CallbackManager.Factory.create();
   loginManager = com.facebook.login.LoginManager.getInstance();
   loginManager.logOut();
+
+  // Workaround for firing the logout event in android:
+  // https://stackoverflow.com/questions/30233284/how-to-add-a-logout-callback-for-facebook-sdk-in-android
+  let LogoutAccessTokenTracker = com.facebook.AccessTokenTracker.extend({
+    onCurrentAccessTokenChanged: function (oldToken, newToken) {
+      if (oldToken != null && newToken == null && onLogoutCallback) {
+        onLogoutCallback();
+      }
+    }
+  });
+  let accessTokenTracker = new LogoutAccessTokenTracker();
+  accessTokenTracker.startTracking();
 }
 
 export function _registerLoginCallback(callback: Function) {
@@ -38,7 +55,7 @@ export function _registerLoginCallback(callback: Function) {
       callback(null, loginResponse);
     },
     onCancel: function () {
-      callback('canceled');
+      callback(new Error('canceled'));
 
     },
     onError: function (e) {
@@ -52,7 +69,7 @@ export function _registerLoginCallback(callback: Function) {
       else {
         errorMessage += ": " + e;
       }
-      callback(errorMessage);
+      callback(new Error(errorMessage));
     }
 
   }));
@@ -89,7 +106,13 @@ export function requestReadPermissions(permissions: string[], callback: Function
 }
 
 export function login(callback: Function) {
-    console.log("requesting read permissions .... .");
   requestReadPermissions(LOGIN_PERMISSIONS, callback);
 }
 
+export function logout(callback: Function) {
+  loginManager.logOut();
+  if (callback) {
+    callback();
+  }
+}
+

src/login-manager.d.ts

@@ -1,5 +1,7 @@
 export declare function _registerLoginCallback(callback: Function): void;
-export declare let _onLoginCallback: Function;
+export declare function _registerLogoutCallback(callback: Function): void;
+export declare let onLoginCallback: Function;
+export declare let onLogoutCallback: Function;
 
 /**
 * Sets the Facebook application Id for the current app and init the native facebook sdk.
@@ -22,4 +24,9 @@ export declare function requestReadPermissions(permissions: string[], callback:
 * Trigger a login procedure by requesting the "public_profile" and "email" read permissions.
 * @param {Function} callback Function reference to be executed when the requested permissions are granted or denied.
 */
-export declare function login(callback: Function): void;
+export declare function login(callback: Function): void;
+/**
+* Trigger a logout procedure.
+* @param {Function} callback Function reference to be executed when the logout is executed.
+*/
+export declare function logout(callback: Function): void;

src/login-manager.ios.metadata.json

@@ -1 +1 @@
-[{"__symbolic":"module","version":3,"metadata":{"onLoginCallback":{"__symbolic":"error","message":"Variable not initialized","line":15,"character":11},"init":{"__symbolic":"function"},"_registerLoginCallback":{"__symbolic":"function"},"requestPublishPermissions":{"__symbolic":"function"},"requestReadPermissions":{"__symbolic":"function"},"login":{"__symbolic":"function"}}},{"__symbolic":"module","version":1,"metadata":{"onLoginCallback":{"__symbolic":"error","message":"Variable not initialized","line":15,"character":11},"init":{"__symbolic":"function"},"_registerLoginCallback":{"__symbolic":"function"},"requestPublishPermissions":{"__symbolic":"function"},"requestReadPermissions":{"__symbolic":"function"},"login":{"__symbolic":"function"}}}]
+[{"__symbolic":"module","version":3,"metadata":{"onLoginCallback":{"__symbolic":"error","message":"Variable not initialized","line":15,"character":11},"onLogoutCallback":{"__symbolic":"error","message":"Variable not initialized","line":16,"character":11},"init":{"__symbolic":"function"},"_registerLogoutCallback":{"__symbolic":"function"},"_registerLoginCallback":{"__symbolic":"function"},"requestPublishPermissions":{"__symbolic":"function"},"requestReadPermissions":{"__symbolic":"function"},"login":{"__symbolic":"function"},"logout":{"__symbolic":"function"}}},{"__symbolic":"module","version":1,"metadata":{"onLoginCallback":{"__symbolic":"error","message":"Variable not initialized","line":15,"character":11},"onLogoutCallback":{"__symbolic":"error","message":"Variable not initialized","line":16,"character":11},"init":{"__symbolic":"function"},"_registerLogoutCallback":{"__symbolic":"function"},"_registerLoginCallback":{"__symbolic":"function"},"requestPublishPermissions":{"__symbolic":"function"},"requestReadPermissions":{"__symbolic":"function"},"login":{"__symbolic":"function"},"logout":{"__symbolic":"function"}}}]

src/login-manager.ios.ts

@@ -14,6 +14,8 @@ const LOGIN_PERMISSIONS = ["public_profile", "email"];
 
 // TODO: add getter and setter
 export let onLoginCallback;
+export let onLogoutCallback;
+
 let loginManager;
 
 export function init(fbId: string) {
@@ -23,23 +25,26 @@ export function init(fbId: string) {
   loginManager.logOut();
 }
 
+export function _registerLogoutCallback(callback: Function) {
+  onLogoutCallback = callback;
+}
+
 export function _registerLoginCallback(callback: Function) {
 
   onLoginCallback = function (result: FBSDKLoginManagerLoginResult, error: NSError) {
 
     if (error) {
-      callback(error);
+      callback(new Error(error.localizedDescription));
       return;
     }
 
-    // something went really wrong no error and no result
     if (!result) {
-      callback("Fatal error");
+      callback(new Error("Fatal error"));
       return;
     }
 
     if (result.isCancelled) {
-      callback('canceled');
+      callback(new Error('canceled'));
       return;
     }
 
@@ -50,7 +55,7 @@ export function _registerLoginCallback(callback: Function) {
       callback(null, loginResponse);
     }
     else {
-      callback("Could not acquire an access token");
+      callback(new Error("Could not acquire an access token"));
       return;
     }
   };
@@ -74,3 +79,9 @@ export function login(callback: Function) {
   requestReadPermissions(LOGIN_PERMISSIONS, callback);
 }
 
+export function logout(callback: Function) {
+  loginManager.logOut();
+  if (callback) {
+    callback();
+  }
+}