Update properties in course.ts

src/app/core/config.service.ts

@@ -3,6 +3,7 @@ import { Injectable } from '@angular/core';
 @Injectable()
 export class ConfigService {
 	apiPlannerUrl = '/api/planner/v1/';
+	apiSearchUrl = '/api/search/v1/';
 	constructor() { }
 
 }

src/app/core/data.service.ts

@@ -6,13 +6,16 @@ import { catchError, map } from 'rxjs/operators';
 import { ConfigService } from './config.service';
 import { Course } from './models/course';
 import { DegreePlan } from './models/degree-plan';
+import { Term } from './models/term';
 
 @Injectable()
 export class DataService {
 	private plannerApiUrl: string;
+	private searchApiUrl: string;
 
 	constructor(private http: HttpClient, private configService: ConfigService) {
 		this.plannerApiUrl = this.configService.apiPlannerUrl;
+		this.searchApiUrl = this.configService.apiSearchUrl;
 	}
 
 	getDegreePlans(): Observable<DegreePlan[]> {
@@ -21,7 +24,12 @@ export class DataService {
 	}
 
 	getDegreePlannerCourseData(): Observable<Course[]> {
-		return this.http.get<Course[]>(this.plannerApiUrl + '/degreePlan/520224/courses')
+		return this.http.get<Course[]>(this.plannerApiUrl + '/degreePlan/520224/termcourses')
+			.pipe(catchError(this.errorHandler));
+	}
+
+	getTerms(): Observable<Term[]> {
+		return this.http.get<Term[]>(this.searchApiUrl + '/terms')
 			.pipe(catchError(this.errorHandler));
 	}
 

src/app/core/models/course.ts

@@ -9,25 +9,21 @@ export interface Course {
 	credits: number;
 	creditMin: number;
 	creditMax: number;
-	grade: any;
+	grade?: any;
 	classNumber: string;
 	courseOrder: number;
 	honors: string;
 	waitlist: string;
-	relatedClassNumber1: any;
-	relatedClassNumber2: any;
-	classPermissionNumber: any;
-	sessionCode: any;
+	relatedClassNumber1?: any;
+	relatedClassNumber2?: any;
+	classPermissionNumber?: any;
+	sessionCode?: any;
 	validationResults: any[];
 	enrollmentResults: any[];
 	pendingEnrollments: any[];
-	details: any;
-	classMeetings: any;
-	enrollmentOptions: any;
-	packageEnrollmentStatus: any;
-	creditRange: any;
-}
-
-export interface TermContainer {
-	termCode: string;
-}
+	details?: any;
+	classMeetings?: any;
+	enrollmentOptions?: any;
+	packageEnrollmentStatus?: any;
+	creditRange?: any;
+}
\ No newline at end of file

src/app/core/models/term.ts

+export interface Term {
+    termCode: string;
+    shortDescription: string;
+    longDescription: string;
+    beginDate: number;
+    endDate: number;
+    instructionBeginDate: number;
+    instructionEndDate: number;
+    academicYear: string;
+    pastTerm: boolean;
+}
\ No newline at end of file

src/app/degree-planner/degree-planner.component.html

@@ -10,7 +10,7 @@
 				<mat-form-field>
 					<mat-select placeholder="Degree Plans" [disableOptionCentering]=true [value]="selectedDegreePlan">
 						<mat-option *ngFor="let degreePlan of degreePlans" [value]="degreePlan.roadmapId">
-							{{degreePlan.name}}
+							{{ degreePlan.name }}
 						</mat-option>
 					</mat-select>
 				</mat-form-field>
@@ -24,34 +24,22 @@
 
 		<div fxLayout="column" fxLayoutGap="20px" fxLayoutAlign="start stretch" style="margin: 24px">
 
-		<mat-accordion>
-				<mat-expansion-panel class="year-container" [expanded]="true">
+			<mat-accordion>
+				<mat-expansion-panel *ngFor="let term of terms" class="year-container" [expanded]="true">
 					<mat-expansion-panel-header>
 						<mat-panel-title>
-						Past: 2017-2018
+							{{ term.academicYear | academicYearState }}
 						</mat-panel-title>
 					</mat-expansion-panel-header>
 					<div fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutAlign="start stretch">
 						<mat-card class="term-container" fxFlex="33%">
 							<div fxLayout="row" fxLayoutAlign="space-between stretch">
-								<h2>Fall 2017</h2><p class="text-right semi-bold">14 Credits</p>
+								<h2>{{ term.termCode | getTermDescription }}</h2><p class="text-right semi-bold">Credits: 13</p>
 							</div>
 							<div style="background-color: #fff">
 								<app-term-container></app-term-container>
 							</div>
 						</mat-card>
-						<mat-card class="term-container" fxFlex="33%" fxFlexOrder="3">
-							<div fxLayout="row" fxLayoutAlign="space-between stretch">
-								<h2>Spring 2018</h2><p class="text-right semi-bold">14 Credits</p>
-							</div>
-							<div style="background-color: #fff">Courses go here....</div>
-						</mat-card>
-						<mat-card class="term-container" fxFlex="33%" fxFlexOrder="3">
-							<div fxLayout="row" fxLayoutAlign="space-between stretch">
-								<h2>Summer 2018</h2><p class="text-right semi-bold">14 Credits</p>
-							</div>
-							<div style="background-color: #fff">Courses go here....</div>
-						</mat-card>
 					</div>
 				</mat-expansion-panel>
 			</mat-accordion>

src/app/degree-planner/degree-planner.component.ts

@@ -2,24 +2,36 @@ import { Component } from '@angular/core';
 
 import { DataService } from '../core/data.service';
 import { DegreePlan } from '../core/models/degree-plan';
+import { Course } from '../core/models/course';
+import { Term } from '../core/models/term';
 
 @Component({
 	selector: 'app-degree-planner',
 	templateUrl: './degree-planner.component.html',
 	styleUrls: ['./degree-planner.component.scss']
 })
+
 export class DegreePlannerComponent {
 	degreePlans: DegreePlan[];
+	degreePlanCourses: Course[];
 	selectedDegreePlan: number;
+	terms: Term[];
 
 	constructor(private dataService: DataService) {
 		this.dataService.getDegreePlans()
-			.subscribe(data => {
-				this.degreePlans = data;
-				this.selectedDegreePlan = this.degreePlans[0].roadmapId;
-			});
+		.subscribe(data => {
+			this.degreePlans = data;
+			this.selectedDegreePlan = this.degreePlans[0].roadmapId;
+		});
+
+		this.dataService.getDegreePlannerCourseData()
+		.subscribe(degreePlanCourses => {
+			this.degreePlanCourses = degreePlanCourses;
+		});
 
-		// 	this.dataService.getDegreePlannerCourseData()
-		// 		.subscribe((data) => console.log('data: ', data));
+		this.dataService.getTerms()
+		.subscribe(terms => {
+			this.terms = terms;
+		});
 	}
 }

src/app/shared/academic-year-state.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+	name: 'academicYearState'
+})
+
+export class AcademicYearStatePipe implements PipeTransform {
+
+	transform(academicYear: string, args?: any): any {
+		const fullAcademicYear = academicYear.replace('-', ' - 20');
+		const startYear = parseInt(fullAcademicYear.substring(0, 4), 10);
+		const currentYear = (new Date()).getFullYear();
+
+		if (startYear === currentYear) {
+			return `Current: ${fullAcademicYear}`;
+		} else if (startYear > currentYear) {
+			return `Future: ${fullAcademicYear}`;
+		} else if (startYear < currentYear) {
+			return `Past: ${fullAcademicYear}`;
+		}
+		return fullAcademicYear;
+	}
+
+}

src/app/shared/get-term-description.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+	name: 'getTermDescription'
+})
+
+export class GetTermDescriptionPipe implements PipeTransform {
+
+	transform(termCode: string, args?: any): any {
+		let termDescription = '';
+		const splitId = termCode.split('');
+		const century = (19 + Number(splitId[0])).toString();
+		const year = Number(splitId.splice(1, 2).join(''));
+		const term = Number(splitId[1]);
+
+		switch (term) {
+			case 2:
+				termDescription = 'Fall ' + century;
+				termDescription += (year - 1).toString();
+				break;
+			case 3:
+				termDescription = 'Fall ' + century;
+				termDescription += (year - 1).toString();
+				break;
+			case 4:
+				termDescription = 'Spring ' + century;
+				termDescription += (year).toString();
+				break;
+			case 6:
+				termDescription = 'Summer ' + century;
+				termDescription += (year).toString();
+				break;
+		}
+		return termDescription;
+	}
+
+}

src/app/shared/shared.module.ts

@@ -12,6 +12,9 @@ import {
 	MatSelectModule,
 	MatSidenavModule } from '@angular/material';
 
+import { GetTermDescriptionPipe } from './get-term-description.pipe';
+import { AcademicYearStatePipe } from './academic-year-state.pipe';
+
 const modules = [
 	CommonModule,
 	FormsModule,
@@ -29,7 +32,7 @@ const modules = [
 
 @NgModule({
 	imports: [ modules ],
-	exports: [ modules ],
-	declarations: [ ],
+	exports: [ modules, GetTermDescriptionPipe, AcademicYearStatePipe ],
+	declarations: [ GetTermDescriptionPipe, AcademicYearStatePipe ]
 })
 export class SharedModule { }