diff --git a/src/app/degree-planner/degree-planner.component.html b/src/app/degree-planner/degree-planner.component.html index 21b2c83fff8241815e08ee3d2c69cf982d3e0112..43fe4e484cfe188c934ced188c1345d0c0954306 100644 --- a/src/app/degree-planner/degree-planner.component.html +++ b/src/app/degree-planner/degree-planner.component.html @@ -25,13 +25,15 @@ <div fxLayout="column" fxLayoutGap="20px" fxLayoutAlign="start stretch" style="margin: 24px"> <mat-accordion> - <mat-expansion-panel *ngFor="let term of termsByAcademicYear | keyvalue" class="year-container"> <!--[expanded]="true"--> + <mat-expansion-panel *ngFor="let year of termsByAcademicYear | keyvalue" class="year-container"> <!--[expanded]="true"--> <mat-expansion-panel-header> <mat-panel-title> - {{ term.key | academicYearState }} + {{ termsByAcademicYear[year.key].year | academicYearState }} </mat-panel-title> </mat-expansion-panel-header> - <app-term-container [terms]="term.value"></app-term-container> + <div fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutAlign="start stretch"> + <app-term-container *ngFor="let term of termsByAcademicYear[year.key].terms" [term]="term" fxFlex="33%"></app-term-container> + </div> </mat-expansion-panel> </mat-accordion> </div> diff --git a/src/app/degree-planner/degree-planner.component.ts b/src/app/degree-planner/degree-planner.component.ts index ec091efccc96726494e1364b4d32683d9874bc37..fb67e7c4df13f3ba4fdc691e5a9657c6af38b291 100644 --- a/src/app/degree-planner/degree-planner.component.ts +++ b/src/app/degree-planner/degree-planner.component.ts @@ -35,10 +35,15 @@ export class DegreePlannerComponent { this.terms = terms; this.termsByAcademicYear = {}; this.terms.forEach(term => { - if (this.termsByAcademicYear[term.academicYear]) { - this.termsByAcademicYear[term.academicYear].push(term); + const year = term.termCode.substring(0, 3); + + if (this.termsByAcademicYear[year]) { + this.termsByAcademicYear[year].terms.push(term); } else { - this.termsByAcademicYear[term.academicYear] = [term]; + this.termsByAcademicYear[year] = { + year: year, + terms: [term] + }; } }); }); diff --git a/src/app/degree-planner/degree-planner.module.ts b/src/app/degree-planner/degree-planner.module.ts index 3339978d9103f9c8566a41a4b0990331e738a627..640702db1d60f875a0796f3b8d65b033757a5fc8 100644 --- a/src/app/degree-planner/degree-planner.module.ts +++ b/src/app/degree-planner/degree-planner.module.ts @@ -2,6 +2,7 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { DegreePlannerComponent } from './degree-planner.component'; import { SharedModule } from '../shared/shared.module'; +import {SharedDegreePlannerModule} from './shared/shared.module'; import { DegreePlannerRoutingModule } from './degree-planner.routing.module'; import { TermContainerComponent } from './term-container/term-container.component'; import { SidenavMenuItemComponent } from './sidenav-menu-item/sidenav-menu-item.component'; @@ -11,6 +12,7 @@ import { FavoritesContainerComponent } from './favorites-container/favorites-con imports: [ CommonModule, SharedModule, + SharedDegreePlannerModule, DegreePlannerRoutingModule ], declarations: [ diff --git a/src/app/degree-planner/shared/course-item/course-item.component.html b/src/app/degree-planner/shared/course-item/course-item.component.html index 5111a4475879c857f7d277598ad074d1f0d824b9..d803ebce3d8e4cb8f0db0149afccf890fa229711 100644 --- a/src/app/degree-planner/shared/course-item/course-item.component.html +++ b/src/app/degree-planner/shared/course-item/course-item.component.html @@ -1,10 +1,10 @@ <div class="course-item"> <div class="course-row course-info"> - <p class="course-number">CHEM 641</p> - <p class="course-credits">3 Cr</p> + <p class="course-number">{{course.subjectCode}} {{course.catalogNumber}}</p> + <p class="course-credits">{{course.credits}} Cr</p> </div> <div class="course-row"> - <p class="course-title">Course Title Here</p> + <p class="course-title">{{course.title}}</p> </div> </div> diff --git a/src/app/degree-planner/shared/course-item/course-item.component.ts b/src/app/degree-planner/shared/course-item/course-item.component.ts index 35ecea8791597f7be990db0e4dd2c7c91ce12cb2..450b9ed81fe30e45d9bcef5ec950d75063195e18 100644 --- a/src/app/degree-planner/shared/course-item/course-item.component.ts +++ b/src/app/degree-planner/shared/course-item/course-item.component.ts @@ -1,16 +1,14 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, Input } from '@angular/core'; import { Course } from '../../../core/models/course'; @Component({ - selector: 'app-course-item', - templateUrl: './course-item.component.html', - styleUrls: ['./course-item.component.scss'] + selector: 'app-course-item', + templateUrl: './course-item.component.html', + styleUrls: ['./course-item.component.scss'] }) -export class CourseItemComponent implements OnInit { - course: Course; +export class CourseItemComponent { + @Input() course: Course; - constructor() { } - - ngOnInit() { } + constructor() {} } diff --git a/src/app/degree-planner/shared/shared.module.ts b/src/app/degree-planner/shared/shared.module.ts index 4cf44a3d2b352b4590b769e8925173eae5056781..80ead0245a1116aca1635cd51852845d943f41aa 100644 --- a/src/app/degree-planner/shared/shared.module.ts +++ b/src/app/degree-planner/shared/shared.module.ts @@ -8,4 +8,4 @@ import { CourseItemComponent } from './course-item/course-item.component'; declarations: [ CourseItemComponent ] }) -export class SharedModule { } +export class SharedDegreePlannerModule { } diff --git a/src/app/degree-planner/term-container/term-container.component.html b/src/app/degree-planner/term-container/term-container.component.html index 06c3b2ebf331d426af8d6ff1e8998f76d94b87f6..3315e8d5edfa798f3575a3b6e8942a46254fdd74 100644 --- a/src/app/degree-planner/term-container/term-container.component.html +++ b/src/app/degree-planner/term-container/term-container.component.html @@ -1,7 +1,8 @@ -<div fxLayout="row" fxLayout.lt-md="column" fxLayoutGap="20px" fxLayoutAlign="start stretch"> - <mat-card class="term-container" *ngFor="let term of terms" fxFlex="33%"> - <div fxLayout="row" fxLayoutAlign="space-between stretch"> - <h2>{{ term.termCode | getTermDescription }}</h2><p class="text-right semi-bold">Credits: 13</p> - </div> - </mat-card> -</div> \ No newline at end of file +<mat-card class="term-container"> + <div fxLayout="row" fxLayoutAlign="space-between stretch"> + <h2>{{ term.termCode | getTermDescription }}</h2><p class="text-right semi-bold">Credits: 13</p> + </div> + <div> + <app-course-item *ngFor="let course of getCoursesByTerm(term.termCode)" [course]="course"></app-course-item> + </div> +</mat-card> \ No newline at end of file diff --git a/src/app/degree-planner/term-container/term-container.component.ts b/src/app/degree-planner/term-container/term-container.component.ts index ca27985cd00fe5049613d2056d1d7ab0b3ff7649..a644fccc95b1515a486a3922b0064e61c7967c05 100644 --- a/src/app/degree-planner/term-container/term-container.component.ts +++ b/src/app/degree-planner/term-container/term-container.component.ts @@ -1,5 +1,7 @@ -import { Component, Input, OnInit } from '@angular/core'; +import { Component, Input } from '@angular/core'; import { Term } from '../../core/models/term'; +import { Course } from '../../core/models/course'; +import { DataService } from '../../core/data.service'; @Component({ selector: 'app-term-container', @@ -7,10 +9,26 @@ import { Term } from '../../core/models/term'; styleUrls: ['./term-container.component.scss'] }) -export class TermContainerComponent implements OnInit { - @Input() terms: Term[]; +export class TermContainerComponent { + @Input() term: Term; + terms: any[]; + courses: Course[]; - constructor() { } + constructor(private dataService: DataService) { + this.dataService.getDegreePlannerCourseData() + .subscribe(degreePlanCourses => { + this.terms = degreePlanCourses; + }); + } - ngOnInit() { } + getCoursesByTerm( termCode ) { + if (this.terms) { + for ( const term of this.terms ) { + if (term.termCode === termCode) { + return term.courses; + } + } + } + return []; + } } diff --git a/src/app/shared/academic-year-state.pipe.ts b/src/app/shared/academic-year-state.pipe.ts index c333a740a6cb830bcaef4e800f31b0ec23d9c2a7..047db3a859dc653da8abd970d07066be9321b2e5 100644 --- a/src/app/shared/academic-year-state.pipe.ts +++ b/src/app/shared/academic-year-state.pipe.ts @@ -6,19 +6,28 @@ import { Pipe, PipeTransform } from '@angular/core'; 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(); + transform(yearCode: string, args?: any): any { + // Get the century digit + const century = parseInt(yearCode.substring(0, 1), 0) + 19; - if (startYear === currentYear) { - return `Current: ${fullAcademicYear}`; + // Get the year + const academicYear = parseInt(yearCode.substring(1), 0); + + const endYear = (century * 100) + academicYear; + const startYear = endYear - 1; + + const yearString = `${startYear} - ${endYear}`; + + const currentYear = new Date().getFullYear(); + + if (currentYear === (startYear)) { + return `Current: ${yearString}`; } else if (startYear > currentYear) { - return `Future: ${fullAcademicYear}`; + return `Future: ${yearString}`; } else if (startYear < currentYear) { - return `Past: ${fullAcademicYear}`; + return `Past: ${yearString}`; } - return fullAcademicYear; + return yearString; } }