import { Component, Input } from '@angular/core';
import { CdkDragDrop } from '@angular/cdk/drag-drop';
import { MatDialog } from '@angular/material';

import { DataService } from '../../core/data.service';
import { DegreePlannerDataService } from './../../core/service/degree-planner-data.service';
import { SidenavService } from './../../core/service/sidenav.service';

// Models
import { PlannedTerm } from '@app/core/models/planned-term';
import {
	NotesDialogComponent,
	NotesDialogData
} from '../dialogs/notes-dialog/notes-dialog.component';

@Component({
	selector: 'cse-term-container',
	templateUrl: './term-container.component.html',
	styleUrls: ['./term-container.component.scss']
})
export class TermContainerComponent {
	@Input() term: PlannedTerm;

	constructor(
		private dataService: DataService,
		public degreePlannerDataSvc: DegreePlannerDataService,
		public dialog: MatDialog,
		private sidenavService: SidenavService
	) {}

	public openAddSidenav(): void {
		this.sidenavService.open();
	}

	public openNotesDialog(): void {
		const termCode = this.term.termCode;
		const data: NotesDialogData = this.term.note
			? { termCode, hasExistingNote: true, initialText: this.term.note.note }
			: { termCode, hasExistingNote: false };
		this.dialog.open<any, NotesDialogData>(NotesDialogComponent, { data });
	}

	public getTotalCredits(): number {
		return this.term.courses.reduce((sum, course) => {
			return sum + course.credits;
		}, 0);
	}

	drop(event: CdkDragDrop<string[]>) {
		const { container, previousContainer, previousIndex } = event;

		// Get the course JSON
		const item = event.item.data;

		console.log(event);

		const newTermCode = event.container.id.substr(5, 4);

		if (
			event.previousContainer.id === 'saved-courses' &&
			event.container.id !== 'saved-courses'
		) {
			// If moving from favorites to term
			container.data.push(item);
			previousContainer.data.splice(previousIndex, 1);

			this.dataService
				.addCourse(
					this.degreePlannerDataSvc.getPlanId(),
					event.item.data.subjectCode,
					event.item.data.courseId,
					newTermCode
				)
				.subscribe(data => {
					const yearCode = newTermCode.substring(0, 3);
					const termCode = newTermCode.substring(3);
				});

			this.dataService
				.removeFavoriteCourse(
					event.item.data.subjectCode,
					event.item.data.courseId
				)
				.subscribe();
		} else if (event.previousContainer.id !== event.container.id) {
			container.data.push(item);
			previousContainer.data.splice(previousIndex, 1);

			// Tell the API this course updated
			this.dataService
				.updateCourseTerm(
					this.degreePlannerDataSvc.getPlanId(),
					event.item.data.id,
					newTermCode
				)
				.subscribe();
		}
		// Do nothing on drop to same term
	}
}