From a3c78568d15813abfe4d132e87b37d915dc2b441 Mon Sep 17 00:00:00 2001 From: Matthew Jeng Date: Thu, 26 Sep 2019 21:20:39 -0700 Subject: [PATCH 1/6] [learning] Completed learning project --- src/app/app.component.html | 251 +------------------------------------ 1 file changed, 3 insertions(+), 248 deletions(-) diff --git a/src/app/app.component.html b/src/app/app.component.html index 258196c..f7483f3 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,251 +1,6 @@ - - - - - - - - - - - - -
- - -
- - - - - - - - - - - - {{ title }} app is running! - - - - - -
- - - - - -

Resources

-

Here are some links to help you get started:

- -
- - - - Learn Angular - - - - - - - CLI Documentation - - - - - - - - Angular Blog - - - - -
- - -

Next Steps

-

What do you want to do next with your app?

- - - -
-
- - - New Component -
- -
- - - Angular Material -
- -
- - - Add Dependency -
- -
- - - Run and Watch Tests -
- -
- - - Build for Production -
-
- - -
- 
ng generate component xyz
- 
ng add @angular/material
- 
ng add _____
- 
ng test
- 
ng build --prod
-
- - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - +
+

Matt's Learning Project

+

it's a little barebones

- - - - - - - - From 308b9712f2953c3cd2a61dba02db783fe537d159 Mon Sep 17 00:00:00 2001 From: Matthew Jeng Date: Thu, 26 Sep 2019 22:16:02 -0700 Subject: [PATCH 2/6] [fixes] did my fixes --- src/app/app.component.html | 1 + 1 file changed, 1 insertion(+) diff --git a/src/app/app.component.html b/src/app/app.component.html index f7483f3..899b85d 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,6 +1,7 @@

Matt's Learning Project

it's a little barebones

+

3rd line

From 8239972bdb7c3869a46abfc2626164275442f3d4 Mon Sep 17 00:00:00 2001 From: Steven Tsay Date: Sat, 28 Sep 2019 21:51:33 -0700 Subject: [PATCH 3/6] somewhere --- src/app/app.component.html | 6 ++- src/app/app.module.ts | 26 ++++++---- .../exchange-rates.component.html | 9 ++-- .../exchange-rates.component.spec.ts | 1 + .../exchange-rates.component.ts | 51 ++++++++++++++++--- src/app/graphql.module.ts | 2 +- 6 files changed, 71 insertions(+), 24 deletions(-) diff --git a/src/app/app.component.html b/src/app/app.component.html index 258196c..01893a9 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -17,7 +17,7 @@ Welcome
- + - +
@@ -64,6 +64,8 @@ + +

Resources

Here are some links to help you get started:

diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 9ff817c..8337328 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -5,18 +5,22 @@ import { AppComponent } from './app.component'; import { GraphQLModule } from './graphql.module'; import { HttpClientModule } from '@angular/common/http'; import { ExchangeRatesComponent } from './exchange-rates/exchange-rates.component'; +import { PersonalityComponent } from './personality/personality.component'; @NgModule({ - declarations: [ - AppComponent, - ExchangeRatesComponent - ], - imports: [ - BrowserModule, - GraphQLModule, - HttpClientModule - ], - providers: [], - bootstrap: [AppComponent] + declarations: [ + AppComponent, + ExchangeRatesComponent, + PersonalityComponent + ], + imports: [ + BrowserModule, + GraphQLModule, + HttpClientModule + ], + providers: [], + bootstrap: [ + AppComponent + ] }) export class AppModule { } diff --git a/src/app/exchange-rates/exchange-rates.component.html b/src/app/exchange-rates/exchange-rates.component.html index af6b27d..073f291 100644 --- a/src/app/exchange-rates/exchange-rates.component.html +++ b/src/app/exchange-rates/exchange-rates.component.html @@ -7,7 +7,8 @@ Error :(
-
-

{{rate.currency}}: {{rate.rate}}

-
-
\ No newline at end of file +

{{rates.id}}: {{rates.number}}

+ + + + diff --git a/src/app/exchange-rates/exchange-rates.component.spec.ts b/src/app/exchange-rates/exchange-rates.component.spec.ts index 08edf1d..0df5cfa 100644 --- a/src/app/exchange-rates/exchange-rates.component.spec.ts +++ b/src/app/exchange-rates/exchange-rates.component.spec.ts @@ -24,4 +24,5 @@ describe('ExchangeRatesComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + }); diff --git a/src/app/exchange-rates/exchange-rates.component.ts b/src/app/exchange-rates/exchange-rates.component.ts index c154c1a..c695822 100644 --- a/src/app/exchange-rates/exchange-rates.component.ts +++ b/src/app/exchange-rates/exchange-rates.component.ts @@ -12,25 +12,64 @@ export class ExchangeRatesComponent implements OnInit { rates: any[]; loading = true; error: any; - + myCount: number = 0; constructor(private apollo: Apollo) {} ngOnInit() { this.apollo .watchQuery({ + // { + // rates(currency: "USD") { + // currency + // rate + // } + // } + query: gql` - { - rates(currency: "USD") { - currency - rate + { + pokemon(name: "Pikachu") { + id + number + name + attacks { + special { + name + type + damage + } + } + evolutions { + id + number + name + weight { + minimum + maximum + } + attacks { + fast { + name + type + damage + } + } } } + } `, }) .valueChanges.subscribe((result: ApolloQueryResult) => { - this.rates = result.data && result.data.rates; + this.rates = result.data.pokemon; this.loading = result.loading; this.error = result.errors; }); } + onNotify($event: any) { + + console.log($event); + this.myCount += $event; + window.alert($event); + window.alert(this.myCount); + + } } diff --git a/src/app/graphql.module.ts b/src/app/graphql.module.ts index c09af00..8e39ea3 100644 --- a/src/app/graphql.module.ts +++ b/src/app/graphql.module.ts @@ -3,7 +3,7 @@ import {ApolloModule, APOLLO_OPTIONS} from 'apollo-angular'; import {HttpLinkModule, HttpLink} from 'apollo-angular-link-http'; import {InMemoryCache} from 'apollo-cache-inmemory'; -const uri = 'https://o5x5jzoo7z.sse.codesandbox.io/graphql'; // <-- change the URL to point to Yelp GraphQL server, this is just a test server +const uri = 'https://graphql-pokemon.now.sh/'; // <-- change the URL to point to Yelp GraphQL server, this is just a test server export function createApollo(httpLink: HttpLink) { return { link: httpLink.create({uri}), From b79f8794a904c3333af51144fc583cb572e1b6a6 Mon Sep 17 00:00:00 2001 From: Steven Tsay Date: Sun, 29 Sep 2019 00:35:23 -0700 Subject: [PATCH 4/6] done! --- src/app/app.component.html | 215 ------------------ .../exchange-rates.component.html | 24 +- .../exchange-rates.component.ts | 110 +++++---- 3 files changed, 89 insertions(+), 260 deletions(-) diff --git a/src/app/app.component.html b/src/app/app.component.html index 01893a9..c55026f 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -8,35 +8,7 @@ -
@@ -64,190 +36,3 @@ - - - -

Resources

-

Here are some links to help you get started:

- -
- - - - Learn Angular - - - - - - - CLI Documentation - - - - - - - - Angular Blog - - - - -
- - -

Next Steps

-

What do you want to do next with your app?

- - - -
-
- - - New Component -
- -
- - - Angular Material -
- -
- - - Add Dependency -
- -
- - - Run and Watch Tests -
- -
- - - Build for Production -
-
- - -
- 
ng generate component xyz
- 
ng add @angular/material
- 
ng add _____
- 
ng test
- 
ng build --prod
-
- - -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
- - - - - - - - -
- - - - - - - - - - diff --git a/src/app/exchange-rates/exchange-rates.component.html b/src/app/exchange-rates/exchange-rates.component.html index 073f291..5e86142 100644 --- a/src/app/exchange-rates/exchange-rates.component.html +++ b/src/app/exchange-rates/exchange-rates.component.html @@ -1,4 +1,4 @@ -

This component is made by me! The information below is queried from a GraphQL server that gave me exchange rates:

+

What type of pokemon are you?

Loading... @@ -6,9 +6,23 @@
Error :(
-
-

{{rates.id}}: {{rates.number}}

-
- + +

I like to do things last minuite

+ +

I like to have trouble managing my time

+ +

I like fire

+ +

I like water

+

I like grass for some reason

+

I really need help

+ +

I want to free myself of this pain

+ + + + diff --git a/src/app/exchange-rates/exchange-rates.component.ts b/src/app/exchange-rates/exchange-rates.component.ts index c695822..af89bcd 100644 --- a/src/app/exchange-rates/exchange-rates.component.ts +++ b/src/app/exchange-rates/exchange-rates.component.ts @@ -1,20 +1,24 @@ -import { Component, OnInit } from '@angular/core'; -import {Apollo} from 'apollo-angular'; -import gql from 'graphql-tag'; -import { ApolloQueryResult } from 'apollo-client'; +import { Component, OnInit } from "@angular/core"; +import { Apollo } from "apollo-angular"; +import gql from "graphql-tag"; +import { ApolloQueryResult } from "apollo-client"; @Component({ - selector: 'app-exchange-rates', - templateUrl: './exchange-rates.component.html', - styleUrls: ['./exchange-rates.component.css'] + selector: "app-exchange-rates", + templateUrl: "./exchange-rates.component.html", + styleUrls: ["./exchange-rates.component.css"] }) export class ExchangeRatesComponent implements OnInit { rates: any[]; + loading = true; error: any; myCount: number = 0; + totalnum: number; + pokemon: string; + pokemonmoves: any[]; + pokemonid: string; constructor(private apollo: Apollo) {} - ngOnInit() { this.apollo .watchQuery({ @@ -26,50 +30,76 @@ export class ExchangeRatesComponent implements OnInit { // } query: gql` - { - pokemon(name: "Pikachu") { - id - number - name - attacks { - special { - name - type - damage - } - } - evolutions { - id - number + { + pokemons(first: 1000) { name - weight { - minimum - maximum - } - attacks { - fast { - name - type - damage - } - } } } - } - `, + ` }) .valueChanges.subscribe((result: ApolloQueryResult) => { - this.rates = result.data.pokemon; + this.rates = result.data.pokemons; this.loading = result.loading; this.error = result.errors; + this.totalnum = this.rates.length; }); } onNotify($event: any) { - console.log($event); this.myCount += $event; - window.alert($event); - window.alert(this.myCount); + console.log(this.totalnum); + } + whatAmI() { + this.pokemon = this.rates[ + (this.myCount * this.myCount) % this.totalnum + ].name; + window.alert(this.pokemon); + this.getInfo(); + } + getInfo() { + const pokemoninfo = gql` + query pokemoninfo($name: String!) { + pokemon(name: $name) { + id + number + name + attacks { + special { + name + type + damage + } + } + } + } + `; + + this.apollo + .watchQuery({ + query: pokemoninfo, + variables: { + name: this.pokemon + } + }) + .valueChanges.subscribe((result: ApolloQueryResult) => { + this.pokemonmoves = result.data.pokemon.attacks.special; + this.pokemonid = result.data.pokemon.id; + }); // do whatever + + // 1, "string", false + } + + getMoreInfo() { + if (!this.pokemon) { + // if a is negative,undefined,null,empty value then... + window.alert("You havent revealed your pokemon yet!!!"); // do whatever + } else { + window.alert("Your pokemon name is " + this.pokemon); + window.alert("Your pokemon id is " + this.pokemonid); + for (let move of this.pokemonmoves) { + window.alert("You can do " + move.name + " attack!"); + } + } } } From c3e94437c113ff54a7c13568d75ebb6d034e9332 Mon Sep 17 00:00:00 2001 From: Steven Tsay Date: Sun, 29 Sep 2019 00:49:37 -0700 Subject: [PATCH 5/6] added src --- src/app/personality/personality.component.css | 0 .../personality/personality.component.html | 4 +++ .../personality/personality.component.spec.ts | 28 +++++++++++++++++++ src/app/personality/personality.component.ts | 23 +++++++++++++++ 4 files changed, 55 insertions(+) create mode 100644 src/app/personality/personality.component.css create mode 100644 src/app/personality/personality.component.html create mode 100644 src/app/personality/personality.component.spec.ts create mode 100644 src/app/personality/personality.component.ts diff --git a/src/app/personality/personality.component.css b/src/app/personality/personality.component.css new file mode 100644 index 0000000..e69de29 diff --git a/src/app/personality/personality.component.html b/src/app/personality/personality.component.html new file mode 100644 index 0000000..5935d6b --- /dev/null +++ b/src/app/personality/personality.component.html @@ -0,0 +1,4 @@ + +
+ {{item}} +
diff --git a/src/app/personality/personality.component.spec.ts b/src/app/personality/personality.component.spec.ts new file mode 100644 index 0000000..1d5f8c9 --- /dev/null +++ b/src/app/personality/personality.component.spec.ts @@ -0,0 +1,28 @@ +/* tslint:disable:no-unused-variable */ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { By } from '@angular/platform-browser'; +import { DebugElement } from '@angular/core'; + +import { PersonalityComponent } from './personality.component'; + +describe('PersonalityComponent', () => { + let component: PersonalityComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ PersonalityComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(PersonalityComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/personality/personality.component.ts b/src/app/personality/personality.component.ts new file mode 100644 index 0000000..eeeee30 --- /dev/null +++ b/src/app/personality/personality.component.ts @@ -0,0 +1,23 @@ +import { Component, OnInit } from '@angular/core'; +import { Output, EventEmitter } from '@angular/core' +@Component({ + selector: 'app-personality', + templateUrl: './personality.component.html', + styleUrls: ['./personality.component.css'] +}) +export class PersonalityComponent implements OnInit { + @Output() notify = new EventEmitter(); + + submitNum($event: any) { + this.notify.emit($event); + + + } + constructor() { } + + ngOnInit() { + } + + + +} From 1114ef82617ff7f1f6b59baba75f4eb0535cae19 Mon Sep 17 00:00:00 2001 From: commanderchewbacca Date: Sun, 29 Sep 2019 02:18:42 -0700 Subject: [PATCH 6/6] added tests --- .../exchange-rates.component.html | 2 +- .../exchange-rates.component.spec.ts | 27 +++++++++++++++++-- .../personality/personality.component.spec.ts | 2 ++ 3 files changed, 28 insertions(+), 3 deletions(-) diff --git a/src/app/exchange-rates/exchange-rates.component.html b/src/app/exchange-rates/exchange-rates.component.html index 5e86142..ef1e9e3 100644 --- a/src/app/exchange-rates/exchange-rates.component.html +++ b/src/app/exchange-rates/exchange-rates.component.html @@ -11,7 +11,7 @@
-->

I like to do things last minuite

-

I like to have trouble managing my time

+

I have trouble managing my time

I like fire

diff --git a/src/app/exchange-rates/exchange-rates.component.spec.ts b/src/app/exchange-rates/exchange-rates.component.spec.ts index 0df5cfa..ad10df7 100644 --- a/src/app/exchange-rates/exchange-rates.component.spec.ts +++ b/src/app/exchange-rates/exchange-rates.component.spec.ts @@ -2,6 +2,7 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { GraphQLModule } from '../graphql.module'; import { ExchangeRatesComponent } from './exchange-rates.component'; import { HttpClientModule } from '@angular/common/http'; +import { FieldsOnCorrectTypeRule } from 'graphql'; describe('ExchangeRatesComponent', () => { let component: ExchangeRatesComponent; @@ -15,14 +16,36 @@ describe('ExchangeRatesComponent', () => { .compileComponents(); })); + it('should create', () => { + expect(component).toBeTruthy(); + }); + it('should create', () => { + expect(component.pokemon).toBeFalsy(); + }); + it('should create', () => { + expect(component.pokemonid).toBeFalsy(); + }); + it('should create', () => { + expect(component.pokemonmoves).toBeFalsy(); + }); + beforeEach(() => { fixture = TestBed.createComponent(ExchangeRatesComponent); component = fixture.componentInstance; fixture.detectChanges(); + spyOn(component, 'whatAmI'); + expect(component.pokemon).toBeTruthy(); + expect(component.pokemonid).toBeTruthy(); + expect(component.pokemonmoves).toBeTruthy(); + }); - it('should create', () => { - expect(component).toBeTruthy(); + beforeEach(() => { + fixture = TestBed.createComponent(ExchangeRatesComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + spyOn(component, 'getMoreInfo'); + expect(window.alert).toHaveBeenCalledWith("You havent revealed your pokemon yet!!!"); }); }); diff --git a/src/app/personality/personality.component.spec.ts b/src/app/personality/personality.component.spec.ts index 1d5f8c9..7830f36 100644 --- a/src/app/personality/personality.component.spec.ts +++ b/src/app/personality/personality.component.spec.ts @@ -16,6 +16,8 @@ describe('PersonalityComponent', () => { .compileComponents(); })); + + beforeEach(() => { fixture = TestBed.createComponent(PersonalityComponent); component = fixture.componentInstance;