Diploma QR in modal

wwWallet · Oct 3, 2023 · 2a00417 · 2a00417
1 parent 734c290
commit 2a00417
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 6 deletions.
diff --git a/public/js/qr-popup.js b/public/js/qr-popup.js
@@ -0,0 +1,23 @@
+const qrDialog = document.getElementById('qrDialog');
+const qrImage = document.getElementById('qrImage');
+const closeDialogBtn = document.getElementById('closeDialogBtn');
+
+function openDialog(qrCodeURL) {
+	qrImage.src = qrCodeURL;
+	qrDialog.showModal();
+}
+
+function closeDialog() {
+	qrDialog.close();
+}
+
+// Handle "Scan QR" button click
+const scanQRButtons = document.querySelectorAll('.credential .Btn.Small.ScanQRBtn');
+scanQRButtons.forEach(button => {
+	button.addEventListener('click', () => {
+		const credentialOfferQR = button.dataset.credentialOfferQR;
+		openDialog(credentialOfferQR);
+	});
+});
+
+closeDialogBtn.addEventListener('click', closeDialog);
diff --git a/views/issuer/consent.pug b/views/issuer/consent.pug
@@ -12,6 +12,11 @@ block layout-content
 				section.consent-description Inspect your credentials by clicking on them and authorize the sharing of them with the client
 
 				section.MainLayout
+					dialog#qrDialog
+						img#qrImage(src="", alt="QR Code")
+						.centered
+							button.Btn.Small(type="button" id="closeDialogBtn") Close
+
 					section.CredentialsArea
 						//- form.diplomas(name='selectDiplomas' method="post")
 						for credential in credentialViewList
@@ -35,8 +40,7 @@ block layout-content
 													input(type="checkbox" class="scopeCheckbox" id=row.name name=row.name value=row.value checked)
 									br
 									if grant_type != "authorization_code"
-										img(src=`${credential.credentialOfferQR}` height=250 width=250)
-										button.Btn.Small(type='button' onclick=`window.location.href = '${credential.credentialOfferURL}'`) Get
+										button.Btn.Small(type='button' onclick=`openDialog('${credential.credentialOfferQR}')`) Scan QR
 				.GetMultiBtnArea
 					p.Errors.Hidden#NoCredentialSelectedError Please select at least one Credential to be issued
 					if grant_type == "authorization_code"
@@ -62,4 +66,5 @@ block layout-content
 
 	link(rel="stylesheet" href="/styles/consent.css")
 	link(rel="stylesheet" href="/styles/inspect.css")
-	script(src='/js/consent.js')
+	script(src='/js/consent.js')
+	script(src='/js/qr-popup.js')
diff --git a/views/issuer/personal-info.pug b/views/issuer/personal-info.pug
@@ -26,5 +26,4 @@ block layout-content
 				button.Btn.Medium.gray #{locale.personalInfo.back}
 				button.Btn.Medium.Landing(id="mainBtn" name="proceed" type="submit") #{locale.personalInfo.proceed}
 
-	link(rel="stylesheet" href="/styles/styles.css")
-	link(rel="stylesheet" href="/styles/profile.css")
+	link(rel="stylesheet" href="/styles/styles.css")
diff --git a/views/issuer/selection.pug b/views/issuer/selection.pug
@@ -7,8 +7,14 @@ block layout-content
 			div(class='dropdownContainer')
 				select(name="issuer" class='issuerDropdown')
 					option(value="uoa" selected) National and Kapodistrian University of Athens
-					option(value="uwa") University of West Attica
+					option(value="uniwa") University of West Attica
 					option(value="aegean") University of the Aegean
+					option(value="eap") Hellenic Open University
+					option(value="auth") Aristotle University of Thessaloniki
+					option(value="uoi") University of Ioannina
+					option(value="upatras") University of Patras
+					option(value="aueb") Athens University of Economics and Business
+					option(value="ihu") International Hellenic University
 				button.Btn.Large.Landing(id="mainBtn" type="submit") #{locale.index.proceed}