replace login

src/app/app.component.ts

@@ -9,6 +9,7 @@ import { StreamPage } from '../pages/stream/stream';
 import { SettingsPage } from '../pages/settings/settings';
 import { AboutPage } from '../pages/about/about';
 import { ProfilePage } from '../pages/profile/profile';
+import { pnutauth } from '../pages/login/pnutauth';
 
 import { IUser } from '../models/IUser';
 
@@ -22,7 +23,6 @@ export class MyApp {
 
   rootPage: any = StreamPage;
   pages: Array<{title: string, icon: string, component: any, params: Object}>;
-  scope: Array<string> = ['basic','stream','write_post','files'];
   profile: IUser;
 
   constructor(public platform: Platform, public splashScreen: SplashScreen,
@@ -73,20 +73,20 @@ export class MyApp {
         pnut.token = val;
 
         this.storage.get('scope').then((sval) => {
-          if (JSON.stringify(sval) !== JSON.stringify(this.scope)) {
+          if (JSON.stringify(sval) !== JSON.stringify(pnutauth.scope)) {
-            this.nav.setRoot(LoginPage, {'scope': this.scope});
+            this.nav.setRoot(LoginPage, {});
           } else {
             this.nav.setRoot(StreamPage, {stream: timeline});
           }
           // this.nav.setRoot(StreamPage, {stream: timeline});
         }).catch(err => {
-          this.nav.setRoot(LoginPage, {'scope': this.scope});
+          this.nav.setRoot(LoginPage, {});
         });
         // this.nav.setRoot(StreamPage, {stream: timeline});
       }
     }).catch(err => {
       console.log('ERROR: ' + err);
-      this.nav.setRoot(LoginPage, {'scope': this.scope});
+      this.nav.setRoot(LoginPage, {});
     });
   }
 
@@ -96,7 +96,7 @@ export class MyApp {
     if (page.title === 'Logout') {
       // this.storage.remove('token');
       this.storage.clear();
-      this.nav.setRoot(LoginPage, {'scope': this.scope});
+      this.nav.setRoot(LoginPage, {});
     } else if (page.title === 'Settings' || page.title === 'About') {
       this.nav.push(page.component, page.params);
     } else if (page.title === 'Profile') {

src/app/app.module.ts

@@ -1,6 +1,7 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { ErrorHandler, NgModule } from '@angular/core';
 import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
+import { HttpClientModule } from '@angular/common/http';
 
 import { MyApp } from './app.component';
 import { LoginPage } from '../pages/login/login';
@@ -44,6 +45,7 @@ import { ClipboardModule } from 'ngx-clipboard';
   ],
   imports: [
     BrowserModule,
+    HttpClientModule,
     IonicModule.forRoot(MyApp),
     IonicStorageModule.forRoot(),
     ClipboardModule,

src/pages/login/login.html

@@ -20,17 +20,12 @@
   <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>
+<ion-label stacked>Username</ion-label>
-  <div *ngIf="oob">
+<ion-input [(ngModel)]="username" type="text"></ion-input>
-    <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>
+<ion-label stacked>Password</ion-label>
-  </div>
+<ion-input [(ngModel)]="password" type="password"></ion-input>
-  <button ion-button block (click)="login()">Log In</button><p>
+
-</div>
+<button ion-button block (click)="login()">Log In</button>
-<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,81 +1,54 @@
 import { Component } from '@angular/core';
 import { NavController, NavParams } from 'ionic-angular';
+import { HttpClient, HttpParams, HttpHeaders } from '@angular/common/http';
 import { Storage } from '@ionic/storage';
-import { Device } from '@ionic-native/device';
 import { StreamPage } from '../stream/stream';
+import { pnutauth } from './pnutauth';
 
-import { OauthCordova } from 'ng2-cordova-oauth/platform/cordova';
-import { OauthBrowser } from 'ng2-cordova-oauth/platform/browser';
-import { PnutAuth } from '../../providers/pnut-oauth';
 import * as pnut from 'pnut-butter';
 
-/**
+
- * Generated class for the LoginPage page.
- *
- * See http://ionicframework.com/docs/components/#navigation for more info
- * on Ionic pages and navigation.
- */
 @Component({
   selector: 'page-login',
   templateUrl: 'login.html',
 })
 export class LoginPage {
 
-  private oauth: any;
+  private username: string;
-  private pnutProvider: any;
+  private password: string;
-  private oob: boolean = false;
-  public showToken: boolean = false;
-  private token: string;
-  private scope: Array<string> = [];
 
-  constructor(public navCtrl: NavController, public navParams: NavParams, private storage: Storage,
+  constructor(public navCtrl: NavController, public navParams: NavParams, 
-    private device: Device) {
+    private storage: Storage, private http: HttpClient) {
-
-    this.scope = navParams.data.scope;
-
-    if (this.device.platform === "Android" || this.device.platform === "amazon-fireos") {
-      this.oauth = new OauthCordova();
-      this.pnutProvider = new PnutAuth({
-        appScope: this.scope,
-        redirectUri: 'http://localhost/callback'
-      });
-    } else if (this.device.platform === "blackberry10") {
-      this.oauth = new OauthBrowser();
-      this.pnutProvider = new PnutAuth({
-        appScope: this.scope,
-        redirectUri: 'https://zoidberg.monkeystew.net/'
-      });
-    } else {
-      this.oauth = new OauthBrowser();
-      this.pnutProvider = new PnutAuth({
-        appScope: this.scope,
-        redirectUri: 'urn:ietf:wg:oauth:2.0:oob'
-      });
-      this.oob = true;
-    }
 
   }
 
   login() {
-    this.oauth.logInVia(this.pnutProvider).then(success => {
+
-      // console.log('OAUTH SUCCESS: ' + JSON.stringify(success));
+    interface LoginResponse {
-      this.storage.set('token', success['access_token']);
+      access_token: string;
-      this.storage.set('scope', this.scope);
-      pnut.token = success['access_token'];
-      this.navCtrl.setRoot(StreamPage, {stream: 'personal'});
-    }, error => {
-      // console.log('OAUTH ERROR: ' + JSON.stringify(error));
-      if (this.oob) {
-        this.showToken = true;
     }
+
+    let headers = new HttpHeaders()
+      .set('Content-Type', 'application/x-www-form-urlencoded');
+    
+    let params = new HttpParams()
+      .set('client_id', pnutauth.clientId)
+      .set('password_grant_secret', pnutauth.clientSecret)
+      .set('username', this.username)
+      .set('password', this.password)
+      .set('grant_type', 'password')
+      .set('scope', pnutauth.scope);
+
+    this.http.post<LoginResponse>(pnutauth.url, params, {headers: headers}).subscribe(res => {
+      console.log('authorized');
+      this.storage.set('scope', pnutauth.scope);
+      this.storage.set('token', res.access_token);
+      pnut.token = res.access_token;
+      this.navCtrl.setRoot(StreamPage, {stream: "personal"});
+    }, err => {
+      console.log("error: " + JSON.stringify(err));
     });
-  }
 
-  saveToken() {
-    this.storage.set('scope', this.scope);
-    this.storage.set('token', this.token);
-    pnut.token = this.token;
-    this.navCtrl.setRoot(StreamPage, {stream: 'personal'});
   }
 
 }