import { Component, OnInit, OnDestroy } from '@angular/core';
import { DataService } from './../../services/data.service';
import { Router } from '@angular/router';
import { IntervalObservable } from 'rxjs/observable/IntervalObservable';
import { Subscription } from 'rxjs/Subscription';

import { User } from "./../../classes/user.class";

@Component({
  selector: 'app-users',
  templateUrl: './users.component.html',
  styleUrls: ['./users.component.css']
})

export class UsersComponent implements OnInit, OnDestroy {

	loading:boolean = true;
	error:boolean = false;
	
	users:Array<User> = new Array<User>();

	public subscription:Subscription;

	constructor(private router: Router, private data:DataService){}

	getUsersData(): void {
		this.data.load().then(()=> {
			this.data
		      .users()
		      .subscribe(response => {

		      	var status = response.status_code;

		      	if(status != 200)
		      	{
		      		this.loading = false;
		      		this.error = true;
		      	}	
		      	else{      	

			      	for(let i = 0; i < response.data.length; i++)
			      	{
			      		var temp:User = User.toUser(response.data[i]);
			      		var user:User = this.getUserByID(temp.id);

			      		if(user)
			      		{
			      			if(!temp.equals(user))
			      			{
			      				// push new one, delete old
			      				var index = this.users.indexOf(user);
			      				this.users.splice(index, 1);
			      				this.users.push(temp);
			      			}
			      		} else {
			      			this.users.push(temp);
			      		}

			      	}

			      	this.users.sort((a, b) => {
			      		return a.name > b.name ? 1 : -1;
			      	});

			      	this.loading = false;
			      }

		      });
		});
	}

	ngOnInit(): void {
	    this.getUsersData();

        this.subscription = IntervalObservable.create(5000).subscribe(() => {
        	console.log("Reloading data...");
            this.getUsersData();
        });
	}

	ngOnDestroy(): void {
	    this.subscription.unsubscribe();
	}

	onClick(user: User): void {
      this.router.navigate(['/user', user.id]);
    }

    getUserByID(id:number): User {
		return this.users.find((f) => {return f.id === id});
	}

}