import { Inject, Component } from '@angular/core';
import { ScanComponent } from '../scan/scan.component';
import { Validators, UntypedFormGroup, FormBuilder } from '@angular/forms';
import { MatDialog, MatDialogConfig, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';

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

	nodeAddress: string = '';
	zecPrice: number = 1;
	tickets = [
		{
			value: 1,
			viewValue: '1 day: USD $1'
		},{
			value: 6,
			viewValue: '1 week: USD $6'
		},{
			value: 22,
			viewValue: '1 month: USD $22'
		},{
			value: 30,
			viewValue: '1 month Pro: USD $30'
		}
	];
	payForm: UntypedFormGroup;
	session: string;

	constructor(
		private dialog: MatDialog,
		private dialogRef: MatDialogRef<SessionpayComponent>,
		private fb: FormBuilder,
		@Inject(MAT_DIALOG_DATA) public data: { addr: string, session: string, zecPrice: number }
	) {
		this.payForm= fb.group({
			session: ['', Validators.required]
		});
		this.session = data.session;
		this.zecPrice = data.zecPrice;
		this.nodeAddress = data.addr;
	}

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

		dialogConfig.disableClose = true;
		dialogConfig.autoFocus = true;
		dialogConfig.data = {
			totalZec: (this.payForm.get('session')!.value)/this.zecPrice,
			addr: this.nodeAddress,
			session: this.session,
			pay: true
		};

		const dialogRef1 = this.dialog.open(ScanComponent, dialogConfig);
		dialogRef1.afterClosed().subscribe(val => {
			this.dialogRef.close();
		});
	}

	close(){
		this.dialogRef.close();
	}
}
