import { Component, Input } from '@angular/core'; import { Term } from '../../core/models/term'; import { Course } from '../../core/models/course'; import { DataService } from '../../core/data.service'; import { CdkDragDrop, transferArrayItem } from '@angular/cdk/drag-drop'; import { MatDialog } from '@angular/material'; import { CourseDetailsDialogComponent } from '../dialogs/course-details-dialog/course-details-dialog.component'; import { CourseDetails } from '../../core/models/course-details'; @Component({ selector: 'cse-term-container', templateUrl: './term-container.component.html', styleUrls: ['./term-container.component.scss'] }) export class TermContainerComponent { @Input() term: Term; @Input() courses: Course[]; @Input() termCodes: String[]; @Input() termsByAcademicYear: Object; @Input() course: CourseDetails; terms: any[]; constructor(private dataService: DataService, public dialog: MatDialog) { } openCourseDetailsDialog(course) { this.dataService.getCourseDetails(course.termCode, course.subjectCode, course.courseId) .subscribe(courseDetails => { const dialogRef = this.dialog.open(CourseDetailsDialogComponent, { data: { courseDetails: courseDetails } }); dialogRef.afterClosed().subscribe(result => { console.log('Dialog was closed'); }); }); } getTotalCredits() { if (!this.courses) { return '0'; } let total = 0; for (const course of this.courses) { switch (typeof course.credits) { case 'number': total += course.credits; break; } } return total; } drop(event: CdkDragDrop<string[]>) { const newTermCode = event.container.id.substr(5, 4); if (event.previousContainer.id === 'favoriteCourse-dropZone' && event.container.id !== 'favoriteCourse-dropZone') { // If moving from favorites to term this.dataService.addCourse(event.item.data.subjectCode, event.item.data.courseId, newTermCode) .subscribe(data => { const yearCode = newTermCode.substring(0, 3); const termCode = newTermCode.substring(3); this.termsByAcademicYear[yearCode].terms[termCode].courses[event.currentIndex] = data; }); this.dataService.removeFavoriteCourse(event.item.data.subjectCode, event.item.data.courseId) .subscribe(data => {}); // Move the course into the front end data structure transferArrayItem(event.previousContainer.data, event.container.data, event.previousIndex, event.currentIndex); } else if (event.previousContainer.id !== event.container.id) { // If moving from term to term // Move the course in the front end data object transferArrayItem(event.previousContainer.data, event.container.data, event.previousIndex, event.currentIndex); // Tell the API this course updated this.dataService.updateCourseTerm(event.item.data.id, newTermCode) .subscribe( data => { // TODO Handle errors }); } // Do nothing on drop to same term } }