1
0
mirror of https://github.com/covidpass-org/covidpass.git synced 2025-02-23 06:57:40 +01:00

Version 1.1

incorporated feedback from the team
This commit is contained in:
Billy Lo 2021-08-27 01:15:49 -04:00
parent 3f3ed17d50
commit b3e8f09ac5
8 changed files with 67 additions and 53 deletions

1
.env.production Normal file
View File

@ -0,0 +1 @@
API_BASE_URL=https://covidpassapinet-pnrnxf7lvq-pd.a.run.app

View File

@ -65,6 +65,10 @@ function Form(): JSX.Element {
inputFile.current.click();
}
async function gotoOntarioHealth() {
window.location.href = 'https://covid19.ontariohealth.ca';
}
// Hide camera view
async function hideCameraView() {
if (globalControls !== undefined) {
@ -125,6 +129,7 @@ function Form(): JSX.Element {
// Add Pass to wallet
async function addToWallet(event: FormEvent<HTMLFormElement>) {
event.preventDefault();
setLoading(true);
@ -146,15 +151,14 @@ function Form(): JSX.Element {
try {
if (file) {
payloadBody = await getPayloadBodyFromFile(file, color);
} else {
payloadBody = await getPayloadBodyFromQR(qrCode, color);
}
let pass = await PassData.generatePass(payloadBody);
const passBlob = new Blob([pass], {type: "application/vnd.apple.pkpass"});
saveAs(passBlob, 'covid.pkpass');
setLoading(false);
}
} catch (e) {
setErrorMessage(e.message);
setLoading(false);
@ -164,7 +168,27 @@ function Form(): JSX.Element {
return (
<div>
<form className="space-y-5" id="form" onSubmit={addToWallet}>
<Card step="1" heading={t('index:selectCertificate')} content={
<Card step="1" heading={t('index:downloadReceipt')} content={
<div className="space-y-5">
<p>
{t('index:visit')}&nbsp;
<Link href="https://covid19.ontariohealth.ca">
<a className="underline">
{t('index:ontarioHealth')}
</a>
</Link>&nbsp;
{t('index:downloadSignedPDF')}
</p>
<button id="ontariohealth" onClick={gotoOntarioHealth}
className="focus:outline-none bg-green-600 py-2 px-3 text-white font-semibold rounded-md disabled:bg-gray-400">
{t('index:gotoOntarioHealth')}
</button>
</div>
}/>
<Card step="2" heading={t('index:selectCertificate')} content={
<div className="space-y-5">
<p>{t('index:selectCertificateDescription')}</p>
<div className="grid grid-cols-1 md:grid-cols-2 gap-5">
@ -182,8 +206,8 @@ function Form(): JSX.Element {
</button>
</div>
<video id="cameraPreview"
className={`${isCameraOpen ? undefined : "hidden"} rounded-md w-full`}/>
{/* <video id="cameraPreview"
className={`${isCameraOpen ? undefined : "hidden"} rounded-md w-full`}/> */}
<input type='file'
id='file'
accept="application/pdf,image/png"
@ -209,15 +233,8 @@ function Form(): JSX.Element {
}
</div>
}/>
{/* <Card step="2" heading={t('index:pickColor')} content={
<div className="space-y-5">
<p>{t('index:pickColorDescription')}</p>
<div className="relative inline-block w-full">
<Colors onChange={setSelectedColor} initialValue={selectedColor}/>
</div>
</div>
}/> */}
<Card step="2" heading={t('index:addToWallet')} content={
<Card step="3" heading={t('index:addToWallet')} content={
<div className="space-y-5">
<p>
{t('index:dataPrivacyDescription')}
@ -234,17 +251,7 @@ function Form(): JSX.Element {
{/* <Check text={t('hostedInEU')}/> */}
</ul>
</div>
{/* <label htmlFor="privacy" className="flex flex-row space-x-4 items-center pb-2">
<input type="checkbox" id="privacy" value="privacy" required className="h-5 w-5 outline-none"/>
<p>
{t('index:iAcceptThe')}&nbsp;
<Link href="/privacy">
<a className="underline">
{t('index:privacyPolicy')}
</a>
</Link>.
</p>
</label> */}
<div className="flex flex-row items-center justify-start">
<button id="download" type="submit"
className="focus:outline-none bg-green-600 py-2 px-3 text-white font-semibold rounded-md disabled:bg-gray-400">

View File

@ -1,5 +1,5 @@
title: Vaccination Receipt to Wallet
subtitle: This tool verifies your electronic receipt (PDF) and save the record onto your Apple Wallet securely.
subtitle: This tool converts your vaccination receipt from Ontario Health to an Apple Wallet pass with an QR code. Other organizations (e.g. school, workplaces) can then scan the QR code to verify your vaccination status easily.
privacyPolicy: Privacy Policy
donate: Sponsor
gitHub: GitHub

View File

@ -2,11 +2,16 @@ iosHint: On iOS, please use Safari.
errorClose: Close
selectCertificate: Select vaccination receipt (PDF)
selectCertificateDescription: |
If you have more than one receipts, download the most recent one from covid19.ontariohealth.ca
Press "Select File", "Browse..." and select the PDF file you have saved in Step 1.
#stopCamera: Stop Camera
#startCamera: Start Camera
openFile: Select File
#foundQrCode: Found QR Code!
downloadReceipt: Download official receipt from Ontario Health
visit: Visit
ontarioHealth: Ontario Health
gotoOntarioHealth: Go to Ontario Health
downloadSignedPDF: and enter your information to display your official vaccination receipt. Press the Share Icon at the bottom, "Save As Files" to store it onto your iPhone.
pickColor: Pick a Color
pickColorDescription: Pick a background color for your pass.
colorWhite: white
@ -19,7 +24,7 @@ colorPurple: purple
colorTeal: teal
addToWallet: Add to Wallet
dataPrivacyDescription: |
Your vaccination receipt is processed on your mobile phone only.
Press the "Add to Wallet" below to import the data in Wallet.
iAcceptThe: I accept the
privacyPolicy: Privacy Policy
createdOnDevice: No personal data is sent to the Internet.

View File

@ -15,7 +15,8 @@ export enum COLORS {
PURPLE = 'rgb(137, 68, 171)',
RED = 'rgb(215, 0, 21)',
TEAL = 'rgb(0, 130, 153)',
YELLOW = 'rgb(178, 80, 0)'
YELLOW = 'rgb(178, 80, 0)',
LIGHTGREEN = 'rgb(144, 238, 144)'
}
export function rgbToHex(rgbString: string) {

View File

@ -157,5 +157,6 @@ export class PassData {
this.barcodes = [qrCode];
this.barcode = qrCode;
this.generic = payload.generic;
this.sharingProhibited = true;
}
}

View File

@ -84,22 +84,20 @@ export class Payload {
}
],
auxiliaryFields: [
],
backFields: [
{
key: "name",
label: "Name",
value: name
},
{
key: "dob",
label: "Date of Birth",
value: body.receipt.dateOfBirth,
textAlignment: TextAlignment.right
}
],
backFields: [
// {
// key: "dob",
// label: "Date of Birth",
// value: body.receipt.dateOfBirth,
// textAlignment: TextAlignment.right
// }
]
}
@ -114,7 +112,7 @@ export class Payload {
this.backgroundColor = COLORS.YELLOW;
}
this.labelColor = COLORS.WHITE
this.labelColor = COLORS.BLACK
this.foregroundColor = COLORS.BLACK
this.img1x = Constants.img1xBlack
this.img2x = Constants.img2xBlack

View File

@ -2,6 +2,7 @@ import {PayloadBody, Receipt} from "./payload";
import * as PdfJS from 'pdfjs-dist'
import {COLORS} from "./colors";
import { getCertificatesInfoFromPDF } from "@ninja-labs/verify-pdf"; // ES6
import { TextItem } from "pdfjs-dist/types/display/api";
// import verifyPDF from "@ninja-labs/verify-pdf";
// import {PNG} from 'pngjs'
// import {decodeData} from "./decode";
@ -83,22 +84,22 @@ async function getPdfDetails(fileBuffer: ArrayBuffer): Promise<Receipt> {
let name, vaccinationDate, vaccineName, dateOfBirth, numDoses, organization;
for (let i = 0; i < numItems; i++) {
const item = content.items[i];
let item = content.items[i] as TextItem;
const value = item.str;
if (value.includes('Name / Nom'))
name = content.items[i+1].str;
name = (content.items[i+1] as TextItem).str;
if (value.includes('Date:')) {
vaccinationDate = content.items[i+1].str;
vaccinationDate = (content.items[i+1] as TextItem).str;
vaccinationDate = vaccinationDate.split(',')[0];
}
if (value.includes('Product name')) {
vaccineName = content.items[i+1].str;
vaccineName = (content.items[i+1] as TextItem).str;
vaccineName = vaccineName.split(' ')[0];
}
if (value.includes('Date of birth'))
dateOfBirth = content.items[i+1].str;
dateOfBirth = (content.items[i+1] as TextItem).str;
if (value.includes('Authorized organization'))
organization = content.items[i+1].str;
organization = (content.items[i+1] as TextItem).str;
if (value.includes('You have received'))
numDoses = Number(value.split(' ')[3]);
}