+
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index 3a0d95a..34e4372 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -1,8 +1,12 @@
-.bg-dark {
+$m-01: #071426;
+$m-02: #546c8c;
+
+
+.bg-dark-app {
max-width: 100vw;
min-height: 100vh;
padding: 3rem 2rem;
- background-color: black;
+ background-color: $m-01;
background-image: radial-gradient(white, rgba(255, 255, 255, .1) 2px, transparent 20px),
radial-gradient(white, rgba(255, 255, 255, .08) 1px, transparent 25px),
radial-gradient(white, rgba(255, 255, 255, .05) 2px, transparent 30px),
@@ -10,3 +14,8 @@
background-size: 550px 550px, 350px 350px, 250px 250px, 150px 150px;
background-position: 0 0, 40px 60px, 130px 270px, 70px 100px;
}
+
+
+.bg-dark-blue {
+ background-color: $m-02 !important;
+}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 2d16beb..455d8ed 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -10,28 +10,40 @@ import {HomeComponent} from './components/home/home.component';
import {ButtonModule} from "primeng/button";
import {ToastModule} from "primeng/toast";
import {DialogModule} from "primeng/dialog";
-import {InfoComponent} from './components/info/info.component';
+import {InfoComponent} from './shared/info/info.component';
import {TooltipModule} from "primeng/tooltip";
import {ImageModule} from "primeng/image";
import {ApodComponent} from './components/nasa/apod/apod.component';
+import { LoadingComponent } from './shared/loading/loading.component';
+import { SearchComponent } from './shared/search/search.component';
+import {ReactiveFormsModule} from "@angular/forms";
+import {CalendarModule} from "primeng/calendar";
+import { EpicComponent } from './components/nasa/epic/epic.component';
+import {SafePipe} from "./shared/safe.pipe";
@NgModule({
- declarations: [
- AppComponent,
- HomeComponent,
- InfoComponent,
- ApodComponent
- ],
+ declarations: [
+ AppComponent,
+ HomeComponent,
+ InfoComponent,
+ ApodComponent,
+ LoadingComponent,
+ SearchComponent,
+ EpicComponent,
+ SafePipe
+ ],
imports: [
BrowserModule,
AppRoutingModule,
HttpClientModule,
BrowserAnimationsModule,
+ ReactiveFormsModule,
ButtonModule,
ToastModule,
DialogModule,
TooltipModule,
- ImageModule
+ ImageModule,
+ CalendarModule
],
providers: [MessageService],
bootstrap: [AppComponent]
diff --git a/src/app/components/home/home.component.html b/src/app/components/home/home.component.html
index 584204e..b87a0e7 100644
--- a/src/app/components/home/home.component.html
+++ b/src/app/components/home/home.component.html
@@ -1 +1,13 @@
-
+
+
NASA API
+
+
+
APOD
+
Astronomy Picture of the Day
+
+
+
EPIC
+
Earth Polychromatic Imaging Camera
+
+
+
diff --git a/src/app/components/nasa/apod/apod.component.html b/src/app/components/nasa/apod/apod.component.html
index e34e6fc..f61529b 100644
--- a/src/app/components/nasa/apod/apod.component.html
+++ b/src/app/components/nasa/apod/apod.component.html
@@ -1,19 +1,20 @@
+
+
-
{{nasaResponse?.title}}
-
{{title}}
-
{{nasaResponse?.explanation}}
-
Copyright: {{nasaResponse?.copyright || 'Not found'}}
+
{{ nasaResponse?.title }}
+
{{ nasaResponse?.explanation }}
+
Copyright: {{ nasaResponse?.copyright || 'Not found' }}
+
+
diff --git a/src/app/components/nasa/apod/apod.component.ts b/src/app/components/nasa/apod/apod.component.ts
index ab20913..62858df 100644
--- a/src/app/components/nasa/apod/apod.component.ts
+++ b/src/app/components/nasa/apod/apod.component.ts
@@ -1,7 +1,7 @@
import {Component, OnInit} from '@angular/core';
-import {NasaResponse} from "../../../models/NasaResponse";
-import {NasaService} from "../../../services/nasa.service";
import {MessageService} from "primeng/api";
+import {NasaService} from "../../../services/nasa.service";
+import {ApodResponse} from "../../../models/ApodResponse";
import {EnumsNasa} from "../../../shared/enums";
@Component({
@@ -10,9 +10,9 @@ import {EnumsNasa} from "../../../shared/enums";
styleUrls: ['./apod.component.scss']
})
export class ApodComponent implements OnInit {
- nasaResponse: NasaResponse;
+ nasaResponse: ApodResponse;
title: string;
- display = false;
+ loading = false;
constructor(private _nasaService: NasaService,
private _messageService: MessageService) {
@@ -23,14 +23,26 @@ export class ApodComponent implements OnInit {
this.getNasaData();
}
- getNasaData(): void {
- this._nasaService.getNasaApod()
- .then(data => {
+ getNasaData(params?: string): void {
+ this.nasaResponse = new ApodResponse();
+ this.loading = true;
+ this._nasaService.getNasaApod(params ? params : '').subscribe({
+ next: (data) => {
this.nasaResponse = data;
- this.display = true;
- })
- .catch(err => {
- this._messageService.add({severity: 'error', summary: 'Error', detail: 'Error retrieving data from NASA'});
- });
+ this.loading = false;
+ },
+ error: (err) => {
+ // console.log(err)
+ this.nasaResponse = new ApodResponse();
+ this.loading = false;
+ this._messageService.add({severity: 'error', summary: 'Error', detail: err.error.msg || 'Error retrieving data from NASA'});
+ }
+ });
}
+
+ searchNasaData(event: string) {
+ // console.log(event);
+ this.getNasaData(event);
+ }
+
}
diff --git a/src/app/components/nasa/epic/epic.component.ts b/src/app/components/nasa/epic/epic.component.ts
index 952fae9..a1ed6d0 100644
--- a/src/app/components/nasa/epic/epic.component.ts
+++ b/src/app/components/nasa/epic/epic.component.ts
@@ -42,7 +42,6 @@ export class EpicComponent implements OnInit {
image: NASA_EPIC_IMAGE_URL(date, item.image)
}
});
- console.log(this.nasaResponse)
this.loading = false;
},
error: (err) => {
diff --git a/src/app/models/NasaResponse.ts b/src/app/models/ApodResponse.ts
similarity index 85%
rename from src/app/models/NasaResponse.ts
rename to src/app/models/ApodResponse.ts
index 2fa9997..09ff7a4 100644
--- a/src/app/models/NasaResponse.ts
+++ b/src/app/models/ApodResponse.ts
@@ -1,4 +1,4 @@
-export class NasaResponse {
+export class ApodResponse {
title: string;
explanation: string;
media_type: string;
diff --git a/src/app/models/EpicResponse.ts b/src/app/models/EpicResponse.ts
new file mode 100644
index 0000000..98950d8
--- /dev/null
+++ b/src/app/models/EpicResponse.ts
@@ -0,0 +1,59 @@
+export class EpicResponse {
+ identifier: string;
+ caption: string;
+ image: string;
+ version: string;
+ centroid_coordinates: {
+ lat: number;
+ lon: number;
+ };
+ dscovr_j2000_position: {
+ x: number;
+ y: number;
+ z: number;
+ };
+ lunar_j2000_position: {
+ x: number;
+ y: number;
+ z: number;
+ };
+ sun_j2000_position: {
+ x: number;
+ y: number;
+ z: number;
+ };
+ attitude_quaternions: {
+ q0: number;
+ q1: number;
+ q2: number;
+ q3: number;
+ };
+ date: string;
+ coords: {
+ centroid_coordinates: {
+ lat: number;
+ lon: number;
+ };
+ dscovr_j2000_position: {
+ x: number;
+ y: number;
+ z: number;
+ };
+ lunar_j2000_position: {
+ x: number;
+ y: number;
+ z: number;
+ };
+ sun_j2000_position: {
+ x: number;
+ y: number;
+ z: number;
+ };
+ attitude_quaternions: {
+ q0: number;
+ q1: number;
+ q2: number;
+ q3: number;
+ }
+ }
+}
diff --git a/src/app/services/nasa.service.ts b/src/app/services/nasa.service.ts
index 00d8bad..892c6d4 100644
--- a/src/app/services/nasa.service.ts
+++ b/src/app/services/nasa.service.ts
@@ -1,6 +1,7 @@
import {Injectable} from '@angular/core';
import {HttpClient, HttpHeaders} from "@angular/common/http";
-import {NASA_APOD_URL} from "../shared/paths";
+import {NASA_APOD_URL, NASA_EPIC_IMAGE_URL, NASA_EPIC_URL} from "../shared/paths";
+import {Observable} from "rxjs";
@Injectable({
providedIn: 'root'
@@ -11,7 +12,15 @@ export class NasaService {
constructor(private _http: HttpClient) {
}
- getNasaApod(): Promise
{
- return this._http.get(NASA_APOD_URL).toPromise();
+ getNasaApod(params: string): Observable {
+ return this._http.get(`${NASA_APOD_URL}${params}`);
+ }
+
+ getNasaEpic(params: string): Observable {
+ return this._http.get(`${NASA_EPIC_URL}${params}`);
+ }
+
+ getNasaEpicImage(date: string, image: string): Observable {
+ return this._http.get(`${NASA_EPIC_IMAGE_URL(date, image)}`);
}
}
diff --git a/src/app/services/social-networks.service.ts b/src/app/services/social-networks.service.ts
index 9009ab7..fd6f637 100644
--- a/src/app/services/social-networks.service.ts
+++ b/src/app/services/social-networks.service.ts
@@ -10,6 +10,11 @@ export class SocialNetworksService {
getSocialNetworks(): SocialNetworkModel[] {
return [
+ {
+ name: 'LinkedIn',
+ url: 'https://www.linkedin.com/in/angellucero/',
+ icon: 'pi-linkedin',
+ },
{
name: 'GitHub',
url: 'https://github.com/angelluce',
@@ -20,11 +25,6 @@ export class SocialNetworksService {
url: 'https://www.instagram.com/angel.lu24/',
icon: 'pi-instagram',
},
- {
- name: 'LinkedIn',
- url: 'https://www.linkedin.com/in/angellucero/',
- icon: 'pi-linkedin',
- },
];
}
diff --git a/src/app/shared/enums.ts b/src/app/shared/enums.ts
index a43fca0..fde962a 100644
--- a/src/app/shared/enums.ts
+++ b/src/app/shared/enums.ts
@@ -1,3 +1,4 @@
export enum EnumsNasa {
- nasaApod = 'Astronomy Picture of the Day (APOD)'
+ nasaApod = 'Astronomy Picture of the Day (APOD)',
+ nasaEpic = 'Earth Polychromatic Imaging Camera (EPIC)',
}
diff --git a/src/app/components/info/info.component.html b/src/app/shared/info/info.component.html
similarity index 65%
rename from src/app/components/info/info.component.html
rename to src/app/shared/info/info.component.html
index 840eede..cf594f0 100644
--- a/src/app/components/info/info.component.html
+++ b/src/app/shared/info/info.component.html
@@ -4,13 +4,13 @@
+ style="font-size: 1.2rem">