import { Component, OnInit, Input } from '@angular/core';
import { DataService } from '../../core/data.service';
import { FavoriteCourse } from '../../core/models/favorite-course';
import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';

@Component({
	selector: 'cse-favorites-container',
	templateUrl: './favorites-container.component.html',
	styleUrls: ['./favorites-container.component.scss']
})

export class FavoritesContainerComponent implements OnInit {
	favoriteCourses: FavoriteCourse[];
	favoriteCourse: FavoriteCourse;
	@Input() subjectsMap: Object;
	@Input() favoriteDropZone: [];

	constructor(private dataService: DataService) {

		this.dataService.getFavoriteCourses()
		.subscribe(favoriteCourses => {
			this.favoriteCourses = favoriteCourses;
		});
	}

	ngOnInit() {
	}

	drop(event: CdkDragDrop<string[]>) {
		if (event.previousContainer.id !== event.container.id) {
			transferArrayItem(event.previousContainer.data,
				event.container.data,
				event.previousIndex,
				event.currentIndex);

			// Add this coruse to the favorites list
			this.dataService.saveFavoriteCourse(event.item.data.subjectCode, event.item.data.courseId)
			.subscribe(favoriteCourse => {
				this.favoriteCourse = favoriteCourse;
			});

			// Remove this course from the degree plan
			this.dataService.removeCourse(event.item.data.id)
			.subscribe(data => {
				console.log(data);
			});

			console.log(event);
		}
	}
}