-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
126 lines (125 loc) · 3.98 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
var generateButton = document.querySelector("#generateButton");
var downloadButton=document.getElementById("download-button");
var upiButton=document.getElementById("switch");
const toasts=document.getElementById("toasts");
upiButton.addEventListener("click",generateUPI);
generateButton.addEventListener("click", generateQRCode);
//keypress for input field
document.querySelector("input").addEventListener("keydown",function(e){
if(e.key==="Enter"){
let inputValue = document.querySelector("input").value;
if(inputValue.indexOf("@")!=-1){
generateUPI();
}else{
generateQRCode();
}
}
});
//generate QRCode Function
function generateQRCode(){
let inputValue = document.querySelector("input").value;
if(inputValue.length===0){
createNotification("Input field can't be blank","fail");
return;
}
if(inputValue.indexOf("@")!=-1){
createNotification("use upi button to generate","fail");
return;
}
if(!inputValue.startsWith("https://") && !inputValue.startsWith("http://")){
inputValue = "https://"+inputValue;
}
let defaultImg = document.querySelector("#default-img");
let loader = document.querySelector(".honeycomb");
let qrCode = document.querySelector("#qrcode");
defaultImg.style.display = "none";
qrCode.style.display = "none";
loader.style.display = "block";
setTimeout(function () {
let image = document.querySelector("#qrcode img");
let canvasElement = document.querySelector("canvas");
if(canvasElement){
canvasElement.remove();
}
if (image) {
image.remove();
}
downloadButton.style.display="block";
qrCode.style.display = "block";
loader.style.display = "none";
var qrcode = new QRCode("qrcode", inputValue, {
width: 80,
height: 80,
});
createNotification("QR Code Generated Successfully:)","success");
}, 1200);
}
//generate UPI Function
function generateUPI(){
let inputValue = document.querySelector("input").value;
if(inputValue.length===0){
createNotification("Input field can't be blank","fail");
return;
}
if(inputValue.indexOf("@")==-1){
createNotification("Enter a valid upi address","fail");
return;
}
inputValue="upi://pay?pa="+inputValue;
let defaultImg = document.querySelector("#default-img");
let loader = document.querySelector(".honeycomb");
let qrCode = document.querySelector("#qrcode");
defaultImg.style.display = "none";
qrCode.style.display = "none";
loader.style.display = "block";
setTimeout(function () {
let image = document.querySelector("#qrcode img");
let canvasElement = document.querySelector("canvas");
if(canvasElement){
canvasElement.remove();
}
if (image) {
image.remove();
}
downloadButton.style.display="block";
qrCode.style.display = "block";
loader.style.display = "none";
var qrcode = new QRCode("qrcode", inputValue, {
width: 80,
height: 80,
});
createNotification("UPI QR Generated Successfully:)","success");
}, 1200);
}
//download button
downloadButton.addEventListener("click",function(){
var container = document.getElementById("qrcode");
html2canvas(container, { allowTaint: true }).then(function (canvas) {
var link = document.createElement("a");
document.body.appendChild(link);
link.download = "qrcode-in-temp.jpg";
link.href = canvas.toDataURL();
link.target = '_blank';
link.click();
createNotification("Download started successfully:)","success");
setTimeout(function(){
createNotification("if you found this helpful share it with your friends:)","success");
},1000);
});
});
//toast notification
function createNotification(message,type){
const notif=document.createElement('div');
notif.classList.add('toast');
if(type==="success"){
notif.classList.add('success');
}
if(type==="fail"){
notif.classList.add('fail');
}
notif.innerHTML=message;
toasts.appendChild(notif);
setTimeout(function(){
notif.remove();
},2000);
}