Merge pull request #1 from GoogolApp/events

Events

config.xml

@@ -82,6 +82,8 @@
     <plugin name="cordova-plugin-ionic-webview" spec="1.1.19" />
     <plugin name="cordova-plugin-ionic-keyboard" spec="2.0.5" />
     <plugin name="cordova-plugin-statusbar" spec="^2.4.2" />
+    <allow-navigation href="http://10.0.0.9:8101" />
     <engine name="ios" spec="4.5.4" />
     <engine name="android" spec="7.0.0" />
+    <allow-navigation href="http://10.0.0.9:8100" />
 </widget>

src/_models/user.ts

@@ -1,9 +1,12 @@
 export class User{
     username: string;
+    email: string;
+    password: string;
     token: string;
 
-    constructor(_id: string, username: string, email: string){
+    constructor(username: string, email: string, password: string){
         this.username = username;
-        this.token = "";
+        this.email = email;
+        this.password = password;
     }
 }

src/_services/auth.ts

@@ -10,22 +10,20 @@ import { appConfig } from '../app/app.config';
 export class AuthService{
 
     public token: string;
-    private url: string = appConfig.apiUrl + '/api/auth/login';
+    private url: string = appConfig.apiUrl + '/auth/login';
     private httpOptions = {headers: new HttpHeaders({ 'Content-Type': 'application/json' })};
 
     constructor(private http: HttpClient) { 
-        let authUser = JSON.parse(localStorage.getItem('authUser'));
-        this.token = authUser && authUser.token;
     }
 
     /**
      * Realiza o signin na aplicação. O retorno representa um login realizado ou não.
-     * @param username 
+     * @param email 
      * @param password 
      */
-    signIn(username: string, password: string) : Observable<boolean>{
+    signIn(email: string, password: string) : Observable<boolean>{
 
-        let body = { username: username, password: password };
+        let body = { email: email, password: password };
 
         return this.http.post<User>( this.url, body, this.httpOptions)
             .map( user => {
@@ -46,9 +44,9 @@ export class AuthService{
      */
     isAuthenticated() : boolean{
         if(localStorage.getItem('authUser')){
-            return true
+            return true;
         }else{
-            return false
+            return false;
         }
     }
 

src/_services/users.ts

@@ -0,0 +1,35 @@
+import { Injectable } from '@angular/core';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Observable } from 'rxjs/observable';
+import 'rxjs/add/operator/map';
+
+import { User } from '../_models/user';
+import { appConfig } from '../app/app.config';
+
+@Injectable()
+export class UsersService{
+
+    private url: string = appConfig.apiUrl + '/users';
+    private httpOptions = {headers: new HttpHeaders({ 'Content-Type': 'application/json' })};
+
+    constructor(private http: HttpClient) {}
+
+    /**
+     * Cria um novo usuário
+     * @param user 
+     */
+    create(user : User) : Observable<User>{
+
+        let body = {
+            "username" : user.username,
+            "email" : user.email,
+            "password": user.password
+        }
+
+        return this.http.post<User>( this.url, body, this.httpOptions)
+            .map( user => {
+                return user;
+            })
+    }
+
+}

src/app/app.config.ts

@@ -1,3 +1,3 @@
 export const appConfig = {
-    apiUrl: 'http://10.0.0.9:4040'
+    apiUrl: 'http://localhost:4040/api'
 };

src/app/app.module.ts

@@ -14,6 +14,8 @@ import { ProfilePage } from '../pages/profile/profile';
 import { MatchesPage } from '../pages/matches/matches';
 import { CreateEventPage } from '../pages/matches/create-event/create-event';
 import { EventsPage } from '../pages/events/events';
+import { AllEventsTab } from '../pages/events/all-events/all-events';
+import { MyEventsTab } from '../pages/events/my-events/my-events';
 import { SearchPage } from '../pages/search/search';
 import { SignInPage } from '../pages/signin/signin';
 import { SignUpPage } from '../pages/signup/signup'; 
@@ -23,6 +25,7 @@ import { SplashScreen } from '@ionic-native/splash-screen';
 import { AuthService } from '../_services/auth';
 import { MatchesService } from '../_services/matches';
 import { EventsService } from '../_services/events';
+import { UsersService } from '../_services/users';
 
 @NgModule({
   declarations: [
@@ -32,6 +35,8 @@ import { EventsService } from '../_services/events';
     MatchesPage,
     CreateEventPage,
     EventsPage,
+    AllEventsTab,
+    MyEventsTab,
     SearchPage,
     SignInPage,
     SignUpPage,
@@ -51,6 +56,8 @@ import { EventsService } from '../_services/events';
     MatchesPage,
     CreateEventPage,
     EventsPage,
+    AllEventsTab,
+    MyEventsTab,
     SearchPage,
     SignInPage,
     SignUpPage,
@@ -62,7 +69,8 @@ import { EventsService } from '../_services/events';
     {provide: ErrorHandler, useClass: IonicErrorHandler},
     AuthService,
     MatchesService,
-    EventsService
+    EventsService,
+    UsersService
   ]
 })
 export class AppModule {}

src/pages/events/all-events/all-events.html

@@ -0,0 +1,4 @@
+<ion-content padding>
+    <p *ngIf="events.length === 0" class="text-default-medium" text-center> Não existem eventos cadastrados!</p>
+    <googol-card *ngFor="let event of events" [event]="event" action="CONFIRM_PRESENCE"></googol-card>
+</ion-content>

src/pages/events/all-events/all-events.ts

@@ -0,0 +1,23 @@
+import { Component, OnInit } from '@angular/core';
+import { EventsService } from '../../../_services/events';
+import { Event } from '../../../_models/event';
+
+@Component({
+    selector: 'tab-all-events',
+    templateUrl: 'all-events.html'
+})
+
+export class AllEventsTab implements OnInit{
+
+    events: Array<Event> = [];
+
+    constructor(public eventsService: EventsService){}
+
+    ngOnInit(){
+        this.fetchEvents();
+      }
+
+    fetchEvents(){
+        this.events = this.eventsService.getAll();
+    }
+}

src/pages/events/events.html

@@ -7,7 +7,7 @@
   </ion-navbar>
 </ion-header>
 
-<ion-content padding>
-  <p *ngIf="events.length === 0" class="text-default-medium" text-center> Não existem eventos cadastrados!</p>
-  <googol-card *ngFor="let event of events" [event]="event" action="CONFIRM_PRESENCE"></googol-card>
-</ion-content>
+<ion-tabs tabsPlacement="top" style="margin-top: 50px;">
+  <ion-tab tabTitle="Todos" [root]="tab1"></ion-tab>
+  <ion-tab tabTitle="Criados por mim" [root]="tab2"></ion-tab>
+</ion-tabs>`

src/pages/events/events.ts

@@ -1,38 +1,18 @@
 import { Component, OnInit } from '@angular/core';
 import { NavController } from 'ionic-angular';
-import { EventsService } from '../../_services/events';
-import { Event } from '../../_models/event';
+
+import { AllEventsTab } from './all-events/all-events';
+import { MyEventsTab } from './my-events/my-events';
 
 @Component({
   selector: 'page-events',
   templateUrl: 'events.html'
 })
-export class EventsPage implements OnInit{
-
-  events: Array<Event> = [];
-
-  match = {
-    league: "Brasileirão Série A",
-    location: "Bar do Agostini, Campina Grande",
-    hour: new Date(2018, 4, 14, 20, 0, 0, 0),
-    home: {
-      name: "Botafogo",
-      logo: "https://ssl.gstatic.com/onebox/media/sports/logos/KLDWYp-H8CAOT9H_JgizRg_96x96.png"
-    },
-    away: {
-      name: "Fluminense",
-      logo: "https://ssl.gstatic.com/onebox/media/sports/logos/fCMxMMDF2AZPU7LzYKSlig_96x96.png"
-    }
-  }
-
-  constructor(public navCtrl: NavController, public eventsService: EventsService) {}
+export class EventsPage{
 
-  ngOnInit(){
-    this.fetchEvents();
-  }
+  tab1 = AllEventsTab;
+  tab2 = MyEventsTab;
 
-  fetchEvents(){
-    this.events = this.eventsService.getAll();
-  }
+  constructor(public navCtrl: NavController) {}
 
 }

src/pages/events/my-events/my-events.html

@@ -0,0 +1,4 @@
+<ion-content padding>
+    <p *ngIf="events.length === 0" class="text-default-medium" text-center> Você ainda não criou nenhum evento!</p>
+    <googol-card *ngFor="let event of events" [event]="event" action="CONFIRM_PRESENCE"></googol-card>
+</ion-content>

src/pages/events/my-events/my-events.ts

@@ -0,0 +1,23 @@
+import { Component, OnInit } from '@angular/core';
+import { EventsService } from '../../../_services/events';
+import { Event } from '../../../_models/event';
+
+@Component({
+    selector: 'tab-my-events',
+    templateUrl: 'my-events.html'
+})
+
+export class MyEventsTab implements OnInit{
+
+    events: Array<Event> = [];
+
+    constructor(public eventsService: EventsService){}
+
+    ngOnInit(){
+        this.fetchEvents();
+      }
+
+    fetchEvents(){
+        this.events = this.eventsService.getAll();
+    }
+}

src/pages/signin/signin.html

@@ -2,8 +2,8 @@
 
   <img width="290" height="75" src="./assets/imgs/logo_sidemenu.png">
 
-  <input class="googol-input" type="text" placeholder="Usuário" [(ngModel)]="user"/>
-  <input class="googol-input" type="password" placeholder="Senha" [(ngModel)]="pass"/>
+  <input class="googol-input" type="email" placeholder="Email" [(ngModel)]="email"/>
+  <input class="googol-input" type="password" placeholder="Senha" [(ngModel)]="password"/>
 
   <button class="googol-btn-danger" (click)="signIn()">Entrar</button>
 

src/pages/signin/signin.ts

@@ -10,8 +10,8 @@ import { SignUpPage } from '../signup/signup';
 })
 export class SignInPage {
 
-  user: string = "";
-  pass: string = "";
+  email: string = "";
+  password: string = "";
 
   constructor(public navCtrl: NavController, public auth: AuthService, public alert:AlertController) {
     if(this.auth.isAuthenticated()){
@@ -20,7 +20,7 @@ export class SignInPage {
   }
 
   signIn(){
-    this.auth.signIn(this.user, this.pass).subscribe(
+    this.auth.signIn(this.email, this.password).subscribe(
       user => {
         if(user){
           this.resetFields();
@@ -45,8 +45,8 @@ export class SignInPage {
   }
 
   resetFields(){
-    this.user = "";
-    this.pass = "";
+    this.email = "";
+    this.password = "";
   }
 
   goSignUp(){

src/pages/signup/signup.html

@@ -1,13 +1,13 @@
-<ion-content padding id="SIGNIN_PAGE" text-center>
+<ion-content padding id="SIGNUP_PAGE" text-center>
 
   <img width="290" height="75" src="./assets/imgs/logo_sidemenu.png">
 
-  <input class="googol-input" type="email" placeholder="E-mail" [(ngModel)]="mail"/>
-  <input class="googol-input" type="text" placeholder="Usuário" [(ngModel)]="user"/>
-  <input class="googol-input" type="password" placeholder="Senha" [(ngModel)]="pass"/>
-  <input class="googol-input" type="password" placeholder="Confirmar Senha" [(ngModel)]="pass_confirm"/>
+  <input class="googol-input" type="email" placeholder="E-mail" [(ngModel)]="email"/>
+  <input class="googol-input" type="text" placeholder="Usuário" [(ngModel)]="username"/>
+  <input class="googol-input" type="password" placeholder="Senha" [(ngModel)]="password"/>
+  <input class="googol-input" type="password" placeholder="Confirmar Senha" [(ngModel)]="password_confirm"/>
 
-  <button class="googol-btn-secondary" (click)="fakeUser()">Criar Conta</button>
+  <button class="googol-btn-secondary" (click)="createUser()">Criar Conta</button>
 
   <p class="text-default-normal text-mute account">Já tem uma conta?</p>
   <p class="text-default-medium" (click)="goSignIn()">ENTRE AQUI</p>

src/pages/signup/signup.ts

@@ -3,31 +3,53 @@ import { NavController, AlertController } from 'ionic-angular';
 import { HomePage } from '../home/home';
 import { SignInPage } from '../signin/signin';
 
+import { User } from '../../_models/user';
+
+import { UsersService } from '../../_services/users';
+
 @Component({
   selector: 'page-signup',
   templateUrl: 'signup.html'
 })
 export class SignUpPage {
 
-  mail: string = "";
-  user: string = "";
-  pass: string = "";
-  pass_confirm: string = ""; 
+  email: string = "";
+  username: string = "";
+  password: string = "";
+  password_confirm: string = ""; 
 
-  constructor(public navCtrl: NavController, public alert:AlertController) {
+  constructor(public navCtrl: NavController, public alert:AlertController, public usersService:UsersService) {
   }
 
-  fakeUser(){
-    if(this.pass !== this.pass_confirm){
+  createUser(){
+    if(this.password !== this.password_confirm){
       this.presentAlert("As senhas não combinam!")
     }else{
-      this.navCtrl.push(HomePage, {}, {animate: false});
+      let user = new User(this.username, this.email, this.password);
+
+      this.usersService.create(user).subscribe(
+        data => {
+          this.presentAlert("Usuário criado com sucesso!");
+          this.clearFields();
+          this.goSignIn();
+        },
+        err => {
+          this.presentAlert("Usuário não pode ser criado!")
+        }
+      )
     }
   }
 
+  clearFields(){
+    this.email = "";
+    this.username = "";
+    this.password =  "";
+    this.password_confirm = "";
+  }
+
   presentAlert(message) {
     let alert = this.alert.create({
-      title: 'Erro',
+      title: 'Atenção',
       subTitle: message,
       buttons: ['Entendido']
     });