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 5874c903fd786129b38f50307dfbe7626cc45d65..ebf8cb5c3848d732a91063da711562010d9b7896 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
@@ -22,20 +22,20 @@
<div fxLayout="column" fxLayoutAlign="space-between end" fxFlex="20">
<div fxLayout="row" fxLayoutAlign="end center">
- <mat-icon [matMenuTriggerFor]="courseMenu" aria-label="Course menu" matTooltip="Course Menu" matTooltipPosition="right"
+ <mat-icon [matMenuTriggerFor]="courseMenu" (menuOpened)="onMenuOpen()" aria-label="Course menu" matTooltip="Course Menu" matTooltipPosition="right"
class="material-icons">more_horiz</mat-icon>
<mat-menu #courseMenu="matMenu" class="course-item-menu">
<button mat-menu-item (click)="openCourseDetailsDialog(course)">Course Details</button>
<button mat-menu-item [matMenuTriggerFor]="academicYearsGroup">Move</button>
<mat-menu #academicYearsGroup="matMenu" class="course-item-submenu">
- <!-- <button mat-menu-item (click)="moveToFavorites(course)" *ngIf="!savedForLater" class="favorites-list">Saved for later</button>
- <button mat-menu-item *ngFor="let termCode of termCodes" (click)="savedForLater ? addToTerm(termCode) : switchTerm(termCode)">{{ termCode | getTermDescription }}</button> -->
+ <button mat-menu-item (click)="moveToFavorites(course)" *ngIf="type != 'saved'" class="favorites-list">Saved for later</button>
+ <button mat-menu-item *ngFor="let term of visibleTerms" (click)="(type == 'saved') ? addToTerm(course, term) : switchTerm(course, term)">{{ term | getTermDescription }}</button>
</mat-menu>
<button *ngIf="!disabled" mat-menu-item (click)="openRemoveConfirmationDialog()">Remove</button>
</mat-menu>
</div>
<div fxLayout="row" fxLayoutAlign="end center">
- <p class="course-credits">{{ course.credits !== undefined ? course.credits : "--" }} Cr</p>
+ <p class="course-credits">{{ course.credits ? course.credits : "--" }} Cr</p>
</div>
</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 9c19e2d8b2ea7e32de5330a61a74cb8844e4d5d4..5e8aa9df2e9634ad4245b6372ad0f614bbdaef45 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,6 +1,14 @@
import { Component, Input, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material';
+import { Store, select } from '@ngrx/store';
+import {
+ AddCourse,
+ AddSaveForLater,
+ MoveCourseBetweenTerms,
+} from './../../store/actions/course.actions';
+import { getDropableTerms } from '@app/degree-planner/store/selectors';
+import { GlobalState } from '@app/core/state';
import { Course } from '@app/core/models/course';
import { DegreePlannerApiService } from '@app/degree-planner/services/api.service';
@@ -15,15 +23,49 @@ import { RemoveCourseConfirmDialogComponent } from '@app/degree-planner/dialogs/
styleUrls: ['./course-item.component.scss'],
})
export class CourseItemComponent implements OnInit {
- status; // TODO make this work k thx plz!?
@Input() course: Course;
@Input() disabled: string;
@Input() type: 'saved' | 'course' | 'search';
+ status; // TODO make this work k thx plz!?
+ visibleTerms: any;
- constructor(private api: DegreePlannerApiService, public dialog: MatDialog) {}
+ constructor(
+ private api: DegreePlannerApiService,
+ public dialog: MatDialog,
+ private store: Store<GlobalState>,
+ ) {}
ngOnInit() {}
+ onMenuOpen() {
+ this.store
+ .pipe(select(getDropableTerms))
+ .subscribe(terms => (this.visibleTerms = terms));
+ }
+
+ moveToFavorites(course) {
+ this.store.dispatch(
+ new AddSaveForLater({
+ courseId: course.courseId,
+ subjectCode: course.subjectCode,
+ title: course.title,
+ catalogNumber: course.catalogNumber,
+ }),
+ );
+ }
+
+ addToTerm(course, term) {
+ const { subjectCode, courseId } = course;
+ const termCode = term;
+ this.store.dispatch(new AddCourse({ subjectCode, courseId, termCode }));
+ }
+
+ switchTerm(course, term) {
+ const { id, termCode: from } = course;
+ const to = term;
+ this.store.dispatch(new MoveCourseBetweenTerms({ to, from, id }));
+ }
+
openCourseDetailsDialog(course) {
this.api
.getCourseDetails(course.subjectCode, course.courseId)
diff --git a/src/app/degree-planner/store/selectors.ts b/src/app/degree-planner/store/selectors.ts
index bbfa1571da8c87df1a500a50c247058a32b8141f..d13ce80112ffb9972a3b5f9b4e5df852c3cc515e 100644
--- a/src/app/degree-planner/store/selectors.ts
+++ b/src/app/degree-planner/store/selectors.ts
@@ -4,8 +4,6 @@ import { createSelector } from '@ngrx/store';
// Models
import { GlobalState } from '@app/core/state';
import { Year } from '@app/core/models/year';
-import { Note } from '@app/core/models/note';
-import { Course } from '@app/core/models/course';
import { PlannedTerm } from '@app/core/models/planned-term';
import { DegreePlannerState } from './state';
@@ -58,6 +56,16 @@ export const getAllVisibleTerms = createSelector(
state => state.visibleTerms,
);
+export const getDropableTerms = createSelector(
+ getDegreePlannerState,
+ (state: DegreePlannerState) => {
+ const allTerms = state.visibleTerms.map(term => term.termCode);
+ const currentTerm = state.activeTermCodes[0];
+ const indexOfActive = allTerms.indexOf(currentTerm);
+ return allTerms.slice(indexOfActive - allTerms.length);
+ },
+);
+
export const getAllVisibleTermsByYear = createSelector(
getDegreePlannerState,
state => {
diff --git a/src/app/shared/pipes/get-term-description.pipe.ts b/src/app/shared/pipes/get-term-description.pipe.ts
index 164eae22b676c19eee590b0df32e51622e3a6207..83b91be7bf8f6f6498f40a9d899d117447c9e763 100644
--- a/src/app/shared/pipes/get-term-description.pipe.ts
+++ b/src/app/shared/pipes/get-term-description.pipe.ts
@@ -1,37 +1,34 @@
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
- name: 'getTermDescription'
+ 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]);
- 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;
- }
-
+ 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;
+ }
}