added support for other platforms to authenticate, issue #9

src/app/app.component.ts

@@ -3,6 +3,7 @@ import { Nav, Platform } from 'ionic-angular';
 import { StatusBar } from '@ionic-native/status-bar';
 import { SplashScreen } from '@ionic-native/splash-screen';
 import { Storage } from '@ionic/storage';
+import { Device } from '@ionic-native/device';
 
 import { LoginPage } from '../pages/login/login';
 import { StreamPage } from '../pages/stream/stream';
@@ -15,11 +16,12 @@ import * as pnut from 'pnut-butter';
 export class MyApp {
   @ViewChild(Nav) nav: Nav;
 
-  rootPage: any = LoginPage;
+  rootPage: any = StreamPage;
 
   pages: Array<{title: string, component: any, params: Object}>;
 
-  constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen, private storage: Storage) {
+  constructor(public platform: Platform, public statusBar: StatusBar, public splashScreen: SplashScreen,
+    private storage: Storage, private device: Device) {
     this.initializeApp();
 
     // used for an example of ngFor and navigation
@@ -32,6 +34,12 @@ export class MyApp {
 
   initializeApp() {
     console.log('--- initializeApp ---');
+
+
+    this.platform.ready().then(() => {
+      // Okay, so the platform is ready and our plugins are available.
+      // Here you can do any higher level native things you might need.
+
       this.storage.get('token').then((val) => {
         if (val.length > 1) {
           pnut.token = val;
@@ -39,13 +47,14 @@ export class MyApp {
         }
       }).catch(err => {
         console.log('ERROR: ' + err);
+        this.nav.setRoot(LoginPage);
       });
 
-    this.platform.ready().then(() => {
-      // Okay, so the platform is ready and our plugins are available.
-      // Here you can do any higher level native things you might need.
       this.statusBar.styleDefault();
       this.splashScreen.hide();
+      console.log('---');
+      console.log(this.device.platform);
+      console.log('---');
     });
   }
 

src/app/app.module.ts

@@ -10,6 +10,7 @@ import { ThreadPage } from '../pages/thread/thread';
 import { StatusBar } from '@ionic-native/status-bar';
 import { SplashScreen } from '@ionic-native/splash-screen';
 import { IonicStorageModule } from '@ionic/storage';
+import { Device } from '@ionic-native/device';
 import { TimeagoPipe } from '../pipes/timeago/timeago';
 
 @NgModule({
@@ -37,6 +38,7 @@ import { TimeagoPipe } from '../pipes/timeago/timeago';
   providers: [
     StatusBar,
     SplashScreen,
+    Device,
     {provide: ErrorHandler, useClass: IonicErrorHandler}
   ]
 })

src/pages/login/login.html

@@ -15,8 +15,22 @@
 
 <ion-content padding>
 
-<p>Goober</p>
-<p>A mobile client for pnut.io</p>
-<button ion-button block (click)="login()">Log In</button>
+<p>&nbsp;</p>
+<div text-center>
+  <h2>Goober</h2>
+  <p block>A mobile client for pnut.io</p>
+</div><p>&nbsp;</p>
+<div *ngIf="!showToken">
+  <p>Tap the Log In button to open browser window and enter your pnut.io creditionals and authorize Goober.</p>
+  <div *ngIf="oob">
+    <p>Afterwards, copy the token provided, close the pop up window, and paste the token into the input field shown and tap Save Token.</p>
+  </div>
+  <button ion-button block (click)="login()">Log In</button><p>
+</div>
+<div *ngIf="showToken">
+  <p>Paste the token provided into this field and then tap Save Token.</p>
+  <ion-input [(ngModel)]="token" type="text" placeholder="Token"></ion-input>
+  <p><button ion-button block (click)="saveToken()">Save Token</button></p>
+</div>
 
 </ion-content>

src/pages/login/login.ts

@@ -1,10 +1,11 @@
 import { Component } from '@angular/core';
 import { NavController, NavParams } from 'ionic-angular';
 import { Storage } from '@ionic/storage';
+import { Device } from '@ionic-native/device';
 import { StreamPage } from '../stream/stream';
 
 import { OauthCordova } from 'ng2-cordova-oauth/platform/cordova';
-// import { OauthBrowser } from 'ng2-cordova-oauth/platform/browser';
+import { OauthBrowser } from 'ng2-cordova-oauth/platform/browser';
 import { PnutAuth } from '../../providers/pnut-oauth';
 import * as pnut from 'pnut-butter';
 
@@ -20,13 +21,31 @@ import * as pnut from 'pnut-butter';
 })
 export class LoginPage {
 
-  private oauth: OauthCordova = new OauthCordova();
-  // private oauthb: OauthBrowser = new OauthBrowser();
-  private pnutProvider: PnutAuth = new PnutAuth({
-    appScope: ['basic','stream','write_post']
-  });
+  private oauth: any;
+  private pnutProvider: any;
+  private oob: boolean = false;
+  private showToken: boolean = false;
+  private token: string;
 
-  constructor(public navCtrl: NavController, public navParams: NavParams, private storage: Storage) {
+  constructor(public navCtrl: NavController, public navParams: NavParams, private storage: Storage,
+    private device: Device) {
+
+    let scope = ['basic','stream','write_post'];
+
+    if (this.device.platform === "Android") {
+      this.oauth = new OauthCordova();
+      this.pnutProvider = new PnutAuth({
+        appScope: scope,
+        redirectUri: 'http://localhost/callback'
+      });
+    } else {
+      this.oauth = new OauthBrowser();
+      this.pnutProvider = new PnutAuth({
+        appScope: scope,
+        redirectUri: 'urn:ietf:wg:oauth:2.0:oob'
+      });
+      this.oob = true;
+    }
 
   }
 
@@ -35,10 +54,19 @@ export class LoginPage {
       console.log('RESULT: ' + JSON.stringify(success));
       this.storage.set('token', success['access_token']);
       pnut.token = success['access_token'];
-      this.navCtrl.setRoot(StreamPage, {stream: 'global'});
-    }, error=> {
-      console.log('ERROR: ' + error);
+      this.navCtrl.setRoot(StreamPage, {stream: 'personal'});
+    }, error => {
+      console.log(error);
+      if (this.oob) {
+        this.showToken = true;
+      }
     });
   }
 
+  saveToken() {
+    this.storage.set('token', this.token);
+    pnut.token = this.token;
+    this.navCtrl.setRoot(StreamPage, {stream: 'personal'});
+  }
+
 }