zgo/src/app/checkout/checkout.component.ts

import { Inject, Component, OnInit, ViewEncapsulation} from '@angular/core';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
import { DomSanitizer, SafeUrl } from '@angular/platform-browser';

import { NotifierService } from '../notifier.service';

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

var QRCode = require('easyqrcodejs');
var URLSafeBase64 = require('urlsafe-base64');
var Buffer = require('buffer/').Buffer;

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

export class CheckoutComponent implements OnInit {
	address: string;
	total: number;
	orderId: string;
	codeString: string = '';
	zcashUrl: SafeUrl;
	
	// -------------------------------------
	//
	// Language Support
	//
	vE = {
		checkoutScanPayment : '',
		checkoutAcceptBtn : '',
		checkoutCloseBtn : '',
		checkoutCantScan : '',
		checkoutUseThis : '',
		checkoutWalletLink : '',
		checkoutWalletOr : '',
		checkoutCopyAddress : '',
		checkoutCopyAmount : '',
		checkoutCopyMemo : '',
		checkoutCopyNotavail : '',
		checkoutNotservClose : '',
		checkoutNotservError : '',
		checkoutCopyaddressError : '',
		checkoutCopyamountError : '',
		checkoutCopymemoError : ''
	};
	//
	constructor(
		private languageService : LanguageService,
		private dialogRef: MatDialogRef<CheckoutComponent>,
		private sanitizer: DomSanitizer,
		@Inject(MAT_DIALOG_DATA) public data: { totalZec: number, addr: string, orderId: string},
		private notifierService : NotifierService ) {
	
		console.log("Entra a Constructor")
		this.address = data.addr;
		this.total = data.totalZec;
		this.orderId = data.orderId;
		this.codeString = `zcash:${this.address}?amount=${this.total.toFixed(8)}&memo=${URLSafeBase64.encode(Buffer.from('ZGo Order::'.concat(this.orderId)))}`; 
		this.zcashUrl = this.sanitizer.bypassSecurityTrustUrl(this.codeString);
	}

	ngOnInit() {
		var qrcode = new QRCode(document.getElementById("checkout-qr"),
			{ 
		        text: this.codeString,
				logo: "/assets/zcash.png",
				width: 230,
				height: 230,
				logoWidth: 60,
				logoHeight: 60,
		        correctLevel: QRCode.CorrectLevel.H
	    	});
	    console.log("mgOnInit - pasa");
	    this.chgUILanguage();
	}

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

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

	copyAddress() {
		if (!navigator.clipboard) {
//			alert("Copy functionality not supported");
			this.notifierService
			    .showNotification(this.vE.checkoutCopyNotavail,
			    	this.vE.checkoutNotservClose,
			    	"error",
			    	this.vE.checkoutNotservError);
		}
		try {
			navigator.clipboard.writeText(this.address);
		} catch (err) {
			this.notifierService
			    .showNotification(this.vE.checkoutCopyaddressError,
			    	this.vE.checkoutNotservClose,
			    	"error",
			    	this.vE.checkoutNotservError);
//			console.error("Error", err);
		}
	}

	copyAmount() {
		if (!navigator.clipboard) {
//			alert("Copy functionality not supported");
			this.notifierService
			    .showNotification(this.vE.checkoutCopyNotavail,
			    	this.vE.checkoutNotservClose,
			    	"error",
			    	this.vE.checkoutNotservError);
		}
		try {
			navigator.clipboard.writeText(this.total.toString());
		} catch (err) {
			this.notifierService
			    .showNotification(this.vE.checkoutCopyamountError,
			    	this.vE.checkoutNotservClose,
			    	"error",
			    	this.vE.checkoutNotservError);
//			console.error("Error", err);
		}
	}

	copyMemo() {
		if (!navigator.clipboard) {
//			alert("Copy functionality not supported");
			this.notifierService
			    .showNotification(this.vE.checkoutCopyNotavail,
			    	this.vE.checkoutNotservClose,
			    	"error",
			    	this.vE.checkoutNotservError);
		}
		try {
			navigator.clipboard.writeText("ZGo Order::" + this.orderId);
		} catch (err) {
			this.notifierService
			    .showNotification(this.vE.checkoutCopymemoError,
			    	this.vE.checkoutNotservClose,
			    	"error",
			    	this.vE.checkoutNotservError);
//			console.error("Error", err);
		}
	}

	chgUILanguage(){
    	console.log('CHECKOUT.chgUILanguage Called ');
 		this.languageService.getViewElements('checkout').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.checkoutScanPayment = response.data.checkout_scan_payment;
					this.vE.checkoutAcceptBtn = response.data.checkout_accept_btn;
					this.vE.checkoutCloseBtn = response.data.checkout_close_btn;
					this.vE.checkoutCantScan = response.data.checkout_cant_scan;
					this.vE.checkoutUseThis = response.data.checkout_use_this;
					this.vE.checkoutWalletLink = response.data.checkout_wallet_link;
					this.vE.checkoutWalletOr = response.data.checkout_wallet_or;
					this.vE.checkoutCopyAddress = response.data.checkout_copy_address;
					this.vE.checkoutCopyAmount = response.data.checkout_copy_amount;
					this.vE.checkoutCopyMemo = response.data.checkout_copy_memo;
					this.vE.checkoutCopyNotavail = response.data.checkout_copy_notavail;
					this.vE.checkoutNotservClose = response.data.checkout_notserv_close;
					this.vE.checkoutNotservError = response.data.checkout_notserv_error;
					this.vE.checkoutCopyaddressError = response.data.checkout_copyaddress_error;
					this.vE.checkoutCopyamountError = response.data.checkout_copyamount_error;
					this.vE.checkoutCopymemoError = response.data.checkout_copymemo_error;
			    },
					error  => { console.log('Error >> ',error); }
			);
	}

}