pseudo login and remembering a users info

client/src/app/app.component.ts

@@ -10,7 +10,9 @@ import { TabsPage } from '../pages/tabs/tabs';
 })
 export class MyApp {
   //rootPage:any = TabsPage;
-  rootPage:any = 'RegisterPage';
+  //rootPage:any = 'RegisterPage';
+  rootPage:any = 'LoginPage';
+
 
   constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
     platform.ready().then(() => {

client/src/app/app.module.ts

@@ -14,6 +14,7 @@ import {GamesPageModule} from "../pages/games/games.module";
 import {UserPageModule} from "../pages/user/user.module";
 import {HttpClientModule} from "@angular/common/http";
 import {AuthServiceProvider} from "../providers/auth-service";
+import { RegisterPage } from '../pages/register/register';
 
 @NgModule({
   declarations: [
@@ -21,7 +22,8 @@ import {AuthServiceProvider} from "../providers/auth-service";
     AboutPage,
     ContactPage,
     HomePage,
-    TabsPage
+    TabsPage,
+    RegisterPage
   ],
   imports: [
     BrowserModule,
@@ -36,7 +38,8 @@ import {AuthServiceProvider} from "../providers/auth-service";
     AboutPage,
     ContactPage,
     HomePage,
-    TabsPage
+    TabsPage,
+    RegisterPage
   ],
   providers: [
     StatusBar,

client/src/pages/games/games.html

@@ -16,6 +16,13 @@
         <ion-icon name="add-circle"></ion-icon>
       </button>
     </ion-buttons>
+
+    <ion-buttons end>
+        <button ion-button icon-only (click)="getImageURL()" color="danger">
+          <ion-icon name="image"></ion-icon>
+        </button>
+    </ion-buttons>
+
   </ion-navbar>
 </ion-header>
 
@@ -24,7 +31,7 @@
     <ion-item-sliding  *ngFor="let game of userGames" (click)="openSummary({id:game.id})">
     <ion-item>
         <ion-thumbnail item-start>
-            <img src="http://images.igdb.com/igdb/image/upload/t_thumb/svpkxcxez7fvg93kktl8.jpg">
+            <img src="{{game.imageURL}}">
         </ion-thumbnail>
       <h2>{{game.title}}</h2>
       <h3>{{ game.studio }}</h3>

client/src/pages/games/games.ts

@@ -20,6 +20,7 @@ export class GamesPage {
   private games: Array<any>;
   private userGames: Array<any>
   private singleGame: any ={};
+  gameDetails: Array<any>;
 
   constructor(public navCtrl: NavController, public navParams: NavParams,
               public gameService: GameService, public modalCtrl: ModalController,
@@ -32,6 +33,13 @@ export class GamesPage {
     //}, 5000);
   }
 
+  getImageURL(){
+    this.gameService.getImageURL(this.gameService.currentGame.title).subscribe(games => {
+      this.gameDetails = games;
+      console.log(games.summary);
+    })
+  }
+
   getGamesByUserId(){
     this.gameService.getGameByUserId(this.authService.currentUserId).subscribe(games => {
       this.userGames = games;

client/src/pages/home/home.html

@@ -5,15 +5,9 @@
 </ion-header>
 
 <ion-content padding>
-  <h2>User</h2>
-  <p>
-    This starter project comes with simple tabs-based layout for apps
-    that are going to primarily use a Tabbed UI.
-  </p>
-  <p>
-    Take a look at the <code>src/pages/</code> directory to add or change tabs,
-    update any existing page or create new pages.
-  </p>
+  <h2>backlogg feed</h2>
+  <p>List of Games?</p>
+  <p>List of friends?</p>
 </ion-content>
 
 

client/src/pages/login/login.html

@@ -1,18 +1,39 @@
-<!--
-  Generated template for the LoginPage page.
-
-  See http://ionicframework.com/docs/components/#navigation for more info on
-  Ionic pages and navigation.
--->
 <ion-header>
+    <ion-navbar>
+      <ion-title color="white">Login</ion-title>
+    </ion-navbar>
+  </ion-header>
+  
+  
+  <ion-content class="login-content" padding>
+    <div class="login-box">
+  
+      <form (ngSubmit)="login()" #loginForm="ngForm">
+        <ion-row>
+          <ion-col>
+            <ion-list inset>
+  
+              <ion-item>
+                <ion-input type="text" placeholder="Email" name="email" [(ngModel)]="loginCredentials.email" required></ion-input>
+              </ion-item>
+  
+              <ion-item>
+                <ion-input type="password" placeholder="Password" name="password" [(ngModel)]="loginCredentials.password" required></ion-input>
+              </ion-item>
+  
+            </ion-list>
+          </ion-col>
+        </ion-row>
+  
+        <ion-row>
+          <ion-col class="signup-col">
+            <button ion-button class="submit-btn" full type="submit" [disabled]="!loginForm.form.valid">Login</button>
+          </ion-col>
+        </ion-row>
 
-  <ion-navbar>
-    <ion-title>login</ion-title>
-  </ion-navbar>
-
-</ion-header>
-
+      </form>
+      <button ion-button class="register-btn" block clear (click)="createAccount()">Register New Account</button>
 
-<ion-content padding>
+    </div>
+  </ion-content>
 
-</ion-content>

client/src/pages/login/login.scss

@@ -1,3 +1,47 @@
 page-login {
-
-}
+  
+    .toolbar-background {
+      background-color: rgb(35, 223, 29);
+    }
+  
+    .login-content {
+      background: #fcf1e0;
+  
+      .login-box {
+        background: #d7dfe0;
+        padding: 20px 20px 0px 20px;
+        margin-top: 30px;
+      }
+  
+      ion-row {
+        align-items: center;
+        text-align: center;
+      }
+  
+      ion-item {
+        border-radius: 30px !important;
+        padding-left: 30px !important;
+        font-size: 0.9em;
+        margin-bottom: 10px;
+        border: 1px solid #ffffff;
+        border-bottom: 0px !important;
+        box-shadow: none !important;
+      }
+  
+      .signup-col {
+        margin: 0px 16px 0px 16px;
+        padding-bottom: 20px;
+      }
+  
+      .item-inner {
+        border-bottom-color: #ffffff !important;
+        box-shadow: none !important;
+      }
+  
+      .submit-btn {
+        background: #51CFB1;
+        border-radius: 30px !important;
+        border: 1px solid #ffffff;
+      }
+    }
+  }

client/src/pages/login/login.ts

@@ -1,5 +1,10 @@
 import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { IonicPage, NavController, NavParams, AlertController } from 'ionic-angular';
+import { AuthServiceProvider } from '../../providers/auth-service';
+import { GameService } from '../../providers/game-service';
+import { TabsPage} from "../tabs/tabs";
+import { RegisterPage } from '../register/register';
+
 
 /**
  * Generated class for the LoginPage page.
@@ -15,11 +20,58 @@ import { IonicPage, NavController, NavParams } from 'ionic-angular';
 })
 export class LoginPage {
 
-  constructor(public navCtrl: NavController, public navParams: NavParams) {
+  loginCredentials = { email: '', password:''};
+
+  constructor(public navCtrl: NavController, public navParams: NavParams,
+              public authService: AuthServiceProvider,
+              public alertCtrl: AlertController,
+              public gameService: GameService) {
+  }
+
+  public login(){
+    this.authService.login(this.loginCredentials.email).subscribe(
+      response => {
+        console.log(response);
+        if (response == null){
+           this.existingUser();
+           return; 
+        }
+        this.authService.currentUser = response;
+        this.authService.currentUserId = response.id;
+        this.gameService.currentUserId = response.id;
+        this.showPopup("Welcome back!", `Enjoy your stay ${response.name}!`,
+         [{
+            text: 'ok',
+            handler: () => this.navCtrl.push(TabsPage)
+         }]
+       )
+      },
+      error => {
+        this.showPopup("You have an error!", `Error code: ${error.status}`, [{ text: "ok"}])
+      }
+
+    )
+  }
+
+  existingUser(){
+    this.showPopup("Try Registering!", `This user does not exist!`,
+         [{
+            text: 'ok',
+            handler: () => this.navCtrl.push(RegisterPage)
+         }]
+       )
+  }
+
+  showPopup(title, text, buttons) {
+    return this.alertCtrl.create({
+      title: title,
+      subTitle: text,
+      buttons
+    }).present();
   }
 
-  ionViewDidLoad() {
-    console.log('ionViewDidLoad LoginPage');
+  createAccount(){
+    this.navCtrl.push(RegisterPage);
   }
 
 }

client/src/pages/register/register.html

@@ -37,4 +37,4 @@
 
     </form>
   </div>
-</ion-content>
+</ion-content>

client/src/pages/tabs/tabs.ts

@@ -14,8 +14,8 @@ export class TabsPage {
   tab1Root = HomePage;
   tab2Root = UserPage;
   tab3Root = GamesPage
-  tab4Root = AboutPage;
-  tab5Root = ContactPage;
+  // tab4Root = AboutPage;
+  // tab5Root = ContactPage;
 
   constructor() {
 

client/src/providers/auth-service.ts

@@ -48,16 +48,11 @@ export class AuthServiceProvider {
       return this.http.post(this.REGISTER_URL, credentials);
       
   }
-
-  // setUser(data){
-  //   data.subscribe(response => {
-  //      this.currentUser = response;
-  //      this.currentUserId = response.id;
-  //   })
-
-  //   return data;
-  // }
-
+  
+  login(email): Observable<any>{
+    console.log("BEFORE REQUEST: " + email);
+    return this.http.get(this.LOGIN_URL + "/email/" + email);
+  }
   getUsers(): Observable<any> {
     return this.http.get(this.LOGIN_URL);
   }

client/src/providers/game-service.ts

@@ -1,5 +1,5 @@
 import {Injectable} from "@angular/core";
-import {HttpClient} from "@angular/common/http";
+import {HttpClient, HttpHeaders} from "@angular/common/http";
 import {Observable} from "rxjs/Observable";
 
 export class Game{
@@ -7,12 +7,14 @@ export class Game{
   title: string;
   studio: string;
   platform: string;
+  imageURL: string;
   
-  constructor(id:number, title: string, studio: string, platform: string){
+  constructor(id:number, title: string, studio: string, platform: string, imageURL: string){
     this.id = id;
     this.title = title;
     this.studio = studio;
     this.platform = platform;
+    this.imageURL = imageURL;
   }
 }
 
@@ -24,6 +26,7 @@ export class GameService{
   public currentGame: Game;
   public currentGameId: number;
   public currentUserId: number;
+  public 
 
   constructor(public http: HttpClient){
   }
@@ -53,6 +56,15 @@ export class GameService{
     return this.http.get(this.GAME_API + "/name/" + credentials);
   }
 
+  getImageURL(gameTitle: string): Observable<any>{
+    var url = "https://cors-anywhere.herokuapp.com/api-endpoint.igdb.com/games/?search=" + gameTitle + "&fields=name,cover,summary";
+    let header = new HttpHeaders();
+    header = header.set("user-key","4aafe5d7db305154aa7b60f13bad89bd");
+    header = header.set('content-type','application/json');
+      
+    return this.http.get(url,{headers:header});
+  }
+
   
 
 }

server/src/main/java/com/example/demo/Controller/UserController.java

@@ -36,6 +36,11 @@ public class UserController {
         return this.userService.findAllUsers();
     }
 
+    @GetMapping( value = "/users/email/{emailField}")
+    public User findByEmail(@PathVariable String emailField){
+        return this.userService.findByEmail(emailField);
+    }
+
     @PutMapping( value = "/users/{userId}/username")
     public User updateUserName(@RequestBody String newName, @PathVariable Long userId){
         return this.userService.updateUserName(newName, userId);

server/src/main/java/com/example/demo/Entity/User.java

@@ -6,7 +6,7 @@ import java.util.HashSet;
 import java.util.Set;
 
 @Entity
-@Table( name = "users")
+@Table( name = "users", uniqueConstraints={@UniqueConstraint(columnNames={"email"})})
 public class User {
 
     @Id

server/src/main/java/com/example/demo/Repository/UserRepository.java

@@ -13,7 +13,8 @@ import java.util.Set;
 
 @RepositoryRestResource
 public interface UserRepository extends JpaRepository<User, Long> {
-    User findByName(String name);
+
+    User findByEmail(String email);
 
 //    @Query("select g.title, g.studio, g.platform" +
 //    " from Game g" +

server/src/main/java/com/example/demo/Service/UserService.java

@@ -33,6 +33,11 @@ public class UserService {
         return this.userRepository.findAll();
     }
 
+    public User findByEmail(String email){
+
+        return this.userRepository.findByEmail(email);
+    }
+
 
 
     public User findUserById(Long userId) {

server/src/test/java/com/example/demo/RepositoryTest/UserRepositoryTest.java

@@ -23,20 +23,20 @@ public class UserRepositoryTest {
     @Autowired
     private UserRepository userRepository;
 
-    @Test
-    public void findByNameTest(){
-
-        //given
-        User nafis = new User("nafis", "nafis@fake.com", "1234");
-        entityManager.persist(nafis);
-        entityManager.flush();
-
-        //when
-        User found = userRepository.findByName(nafis.getName());
-
-        //then
-        assertThat(found.getName()).isEqualTo(nafis.getName());
-    }
+//    @Test
+//    public void findByNameTest(){
+//
+//        //given
+//        User nafis = new User("nafis", "nafis@fake.com", "1234");
+//        entityManager.persist(nafis);
+//        entityManager.flush();
+//
+//        //when
+//        User found = userRepository.findByName(nafis.getName());
+//
+//        //then
+//        assertThat(found.getName()).isEqualTo(nafis.getName());
+//    }
 
     @Test
     public void findByIdTest(){