added support for other platforms to authenticate, issue #9

This commit is contained in:
Morgan McMillian 2017-06-17 07:57:10 -07:00
parent 6bed892b28
commit 2612c0853f
4 changed files with 76 additions and 23 deletions

View file

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

View file

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

View file

@ -15,8 +15,22 @@
<ion-content padding> <ion-content padding>
<p>Goober</p> <p>&nbsp;</p>
<p>A mobile client for pnut.io</p> <div text-center>
<button ion-button block (click)="login()">Log In</button> <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> </ion-content>

View file

@ -1,10 +1,11 @@
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular'; import { NavController, NavParams } from 'ionic-angular';
import { Storage } from '@ionic/storage'; import { Storage } from '@ionic/storage';
import { Device } from '@ionic-native/device';
import { StreamPage } from '../stream/stream'; import { StreamPage } from '../stream/stream';
import { OauthCordova } from 'ng2-cordova-oauth/platform/cordova'; 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 { PnutAuth } from '../../providers/pnut-oauth';
import * as pnut from 'pnut-butter'; import * as pnut from 'pnut-butter';
@ -20,13 +21,31 @@ import * as pnut from 'pnut-butter';
}) })
export class LoginPage { export class LoginPage {
private oauth: OauthCordova = new OauthCordova(); private oauth: any;
// private oauthb: OauthBrowser = new OauthBrowser(); private pnutProvider: any;
private pnutProvider: PnutAuth = new PnutAuth({ private oob: boolean = false;
appScope: ['basic','stream','write_post'] 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)); console.log('RESULT: ' + JSON.stringify(success));
this.storage.set('token', success['access_token']); this.storage.set('token', success['access_token']);
pnut.token = success['access_token']; pnut.token = success['access_token'];
this.navCtrl.setRoot(StreamPage, {stream: 'global'}); this.navCtrl.setRoot(StreamPage, {stream: 'personal'});
}, error=> { }, error => {
console.log('ERROR: ' + 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'});
}
} }