import { Input, Inject, Component, OnInit } from '@angular/core';
import { MatDialog, MatDialogConfig} from '@angular/material/dialog';

import { faCartShopping } from '@fortawesome/free-solid-svg-icons';

import { Observable } from 'rxjs';
import { Item } from '../item.model';
import { Owner } from '../../owner.model';
import { FullnodeService } from '../../fullnode.service';
import { UserService } from '../../user.service';
import { ItemService } from '../items.service';
import { OrderService} from '../../order/order.service';
import { ItemCreateComponent } from '../item-create/item-create.component';
import { ItemEditComponent } from '../item-edit/item-edit.component';
import { ItemDeleteComponent } from '../item-delete/item-delete.component';
import { ItemAddComponent } from '../item-add/item-add.component';
import { NotifierService } from '../../notifier.service';

import { LanguageService } from '../../language.service';
import { LanguageData } from '../../language.model';

@Component({
	selector: 'app-item-list',
	templateUrl: './item-list.component.html',
	styleUrls: ['./item-list.component.css']
})
 
export class ItemListComponent implements OnInit{

	@Input() zecPrice: number;

	public items: Item[] = [];

	faCartShopping = faCartShopping;
    
	owner: Owner = {
		_id: '',
		name: '',
		address: '',
		currency: 'usd',
		tax: false,
		taxValue: 0,
		vat: false,
		vatValue: 0,
		first: '',
		last: '',
		email: '',
		street: '',
		city: '',
		state: '',
		postal: '',
		phone: '',
		paid: false,
		website: '',
		country: '',
		zats: false,
		invoices: false,
		expiration: new Date(Date.now()).toISOString(),
		payconf: false,
		viewkey: '',
		crmToken: ''
	};

	public ownerUpdate: Observable<Owner>;
	public itemsUpdate: Observable<Item[]>;

    //
    // Language Support
    //
    vE = {
    	itemlistAvailItems : '',
    	itemlistListEmpty : '',
    	itemlistItemAdded : '',
    	itemlistItemUpdated : '',
    	itemlistItemDeleted : '',
    	itemlistNotifClose : '',
    	itemlistNotifSuccess : ''
    }
    //
    // ------------------------------------------------------------
	constructor(
		public itemService: ItemService,
		userService: UserService,
		public orderService: OrderService,
		public fullnodeService: FullnodeService,
		private dialog: MatDialog,
		private notifierService: NotifierService,
		private languageService: LanguageService )
	{
			this.ownerUpdate = userService.ownerUpdate;
			this.itemsUpdate = itemService.itemsUpdated;
			this.ownerUpdate.subscribe((owner) => {
				this.owner = owner;
				itemService.getItems(this.owner.address);
				this.itemsUpdate.subscribe((items) => {
					this.items = items;
				});
			});
			this.zecPrice = 1;
	}

	ngOnInit(){
        this.chgUILanguage();
		this.itemsUpdate.subscribe((items) => {
			this.items = items;
		});
	}

	openDialog(){
		const dialogConfig = new MatDialogConfig();

		dialogConfig.disableClose = true;
		dialogConfig.autoFocus = true;
		dialogConfig.data = {_id: '', name: '' , user: '', description: '', cost: 0}

		const dialogRef = this.dialog.open(ItemCreateComponent, dialogConfig);

		dialogRef.afterClosed().subscribe((val) => {
			if(val != null) {
				var item:Item = {_id: '', name: val.name, description: val.description, cost: val.cost, owner: this.owner.address};
				this.itemService.addItem(item);
				console.log('creando item y llamando a notifier >>>');
				this.notifierService
				    .showNotification(this.vE.itemlistItemAdded ,
		    	              		  this.vE.itemlistNotifClose,
			    	              	  "success",
			    	              	  this.vE.itemlistNotifSuccess);
			}
			this.itemService.getItems(this.owner.address);
			this.itemsUpdate.subscribe((items) => {
				this.items = items;
			});
		});
	}

	edit(id: string) {
//		console.log('Edit:', id);
		const item = this.items.find(element => element._id == id);
//		console.log(item);
		const dialogConfig = new MatDialogConfig();

		dialogConfig.disableClose = true;
		dialogConfig.autoFocus = true;
		dialogConfig.data = item;
		console.log('Entrando a dialogo de edicion')
		const dialogRef = this.dialog.open(ItemEditComponent, dialogConfig);
		dialogRef.afterClosed().subscribe((val) => {
			if (val != null) {
				var editItem: Item = {
					_id: val.id,
					name: val.name,
					description: val.description,
					cost: val.cost,
					owner: this.owner.address
				};
				console.log('Edit:', editItem);
				console.log('itemlistItemUpdated = ' + this.vE.itemlistItemUpdated);
				this.itemService.addItem(editItem).subscribe((response) => {
					this.itemService.getItems(this.owner.address);
				});
				this.notifierService
				    .showNotification(this.vE.itemlistItemUpdated,
		    	              		  this.vE.itemlistNotifClose,
			    	              	  "success",
			    	              	  this.vE.itemlistNotifSuccess);
			}
			this.itemService.getItems(this.owner.address);
		});
	}

	delete(id: string) {
		//console.log('Edit:', id);
		const item = this.items.find(element => element._id == id);
		//console.log(item);
		const dialogConfig = new MatDialogConfig();

		dialogConfig.disableClose = true;
		dialogConfig.autoFocus = true;
		dialogConfig.data = item;

		const dialogRef = this.dialog.open(ItemDeleteComponent, dialogConfig);
		dialogRef.afterClosed().subscribe((val) => {
			if (val != null) {
//				console.log('Deleting', val);
				this.itemService.deleteItem(val);
				this.items = [];
				this.notifierService
				    .showNotification(this.vE.itemlistItemDeleted,
			    	              this.vE.itemlistNotifClose,
			    	              "success",
			    	              this.vE.itemlistNotifSuccess);
			}
			this.itemService.getItems(this.owner.address);
			this.itemsUpdate.subscribe((items) => {
				this.items = items;
			});
		});
	}

	addToOrder(id: string) {
		const item = this.items.find(element => element._id == id);
		//console.log(item);
		const dialogConfig = new MatDialogConfig();

		dialogConfig.disableClose = true;
		dialogConfig.autoFocus = true;
		dialogConfig.data = {
			qty: 1,
			name: item!.name,
			cost: item!.cost
		};

		const dialogRef = this.dialog.open(ItemAddComponent, dialogConfig);
		dialogRef.afterClosed().subscribe((val) => {
			if (val != null) {
				console.log('Adding to order', val);
				this.orderService.addToOrder(val);
			}
			this.itemService.getItems(this.owner.address);
		});
	}

	getCurrency(){
		return this.owner.currency.toUpperCase();
	}

	chgUILanguage(){
        console.log('ITEMLIST.chgUILanguage Called ');
 		this.languageService.getViewElements('itemlist').subscribe(
				response => { 
					console.log('Received >> ', response );
					console.log('Language Code : ', response.language);
					console.log('Component Name : ',response.component);
					console.log('Language data : ',response.data);

			        this.vE.itemlistListEmpty = response.data.itemlist_list_empty;
			        this.vE.itemlistAvailItems = response.data.itemlist_avail_items;
			        this.vE.itemlistItemAdded = response.data.itemlist_item_added;
			        this.vE.itemlistItemUpdated = response.data.itemlist_item_updated;
			        this.vE.itemlistItemDeleted = response.data.itemlist_item_deleted;
			        this.vE.itemlistNotifClose = response.data.itemlist_notif_close;
			        this.vE.itemlistNotifSuccess = response.data.itemlist_notif_success;
			    },
				error  => { console.log('Error >> ',error); }
			);
	}

}