Skip to content

Commit db5abd2

Browse files
committed
More cleanup
1 parent efac3fd commit db5abd2

3 files changed

Lines changed: 46 additions & 39 deletions

File tree

src/misc/QrCodeUtils.js

Lines changed: 37 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,39 +1,56 @@
11
// @flow
2+
3+
// flowlint untyped-import:off
24
import qrcode from "../../libs/qrcode"
5+
// flowlint untyped-import:error
36

47
export type qrCodeOptions = {
5-
padding: number,
6-
width: number,
7-
height: number,
8-
typeNumber: number, // Use 0 for auto detect depending on input data length (size)
9-
fill: string,
10-
background: string,
11-
ecl: string,
12-
container: string,
8+
size: number,
139
content: string,
10+
padding?: number,
11+
typeNumber?: number, // Use 0 for auto detect depending on input data length (size)
12+
fill?: string,
13+
background?: string,
14+
ecl?: 'L' | 'M' | 'Q' | 'H',
15+
scalable?: boolean;
1416
};
1517

1618
/** Generates QR Code as SVG image */
17-
export function getQRCodeSvg(options: qrCodeOptions): string {
19+
export function getQRCodeSvgPath(options: qrCodeOptions): string {
20+
21+
let content = options.content
22+
let padding = options.padding || 0
23+
let qrcodeGenerator = qrcode(options.typeNumber || 0, options.ecl || "M")
24+
qrcodeGenerator.addData(content)
25+
qrcodeGenerator.make()
26+
27+
let cellSize = (options.size) / (qrcodeGenerator.getModuleCount())
28+
29+
return qrcodeGenerator.createSvgPath({
30+
// Round to two decimals
31+
cellSize: Math.round(cellSize * 100 - 50) / 100,
32+
background: options.background,
33+
fill: options.fill,
34+
})
35+
}
1836

1937

20-
//Gets text length
21-
function _getUTF8Length(content) {
22-
var result = encodeURI(content).toString().replace(/\%[0-9a-fA-F]{2}/g, 'a');
23-
return result.length + (result.length != content ? 3 : 0);
24-
}
38+
/** Generates QR Code as SVG image */
39+
export function getQRCodeSvg(options: qrCodeOptions): string {
2540

26-
//Generate QR Code matrix
2741
var content = options.content
28-
var qrcodeGenerator = qrcode(options.typeNumber, options.ecl)
42+
let padding = options.padding || 0
43+
var qrcodeGenerator = qrcode(options.typeNumber || 0, options.ecl || "M")
2944
qrcodeGenerator.addData(content)
3045
qrcodeGenerator.make()
31-
return qrcodeGenerator.createSvgPath({
46+
let cellSize = (options.size - 2 * padding) / (qrcodeGenerator.getModuleCount())
47+
48+
return qrcodeGenerator.createSvgTag({
3249
// Round to two decimals
33-
cellSize: Math.round(options.width / (qrcodeGenerator.getModuleCount() + 2 * options.padding) * 100) / 100,
34-
background: null,
50+
cellSize: Math.round(cellSize * 100 - 50) / 100,
51+
background: options.background,
3552
fill: options.fill,
36-
scalable: true,
53+
scalable: options.scalable || false,
3754
padding: options.padding
3855
})
3956
}

src/settings/EditSecondFactorsForm.js

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -193,14 +193,8 @@ export class EditSecondFactorsForm {
193193
this._getOtpAuthUrl(totpKeys.readableKey).then(optAuthUrl => {
194194
if (!isApp()) {
195195
let qrCode = getQRCodeSvg({
196-
typeNumber: 0,
197-
background: "#fff",
198-
fill: "#000",
199-
container: "svg",
200-
ecl: "M",
201196
padding: 10,
202-
height: 150,
203-
width: 150,
197+
size: 150,
204198
content: optAuthUrl
205199
})
206200
totpQRCodeSvg = htmlSanitizer.sanitize(qrCode, false).text

src/subscription/giftcards/GiftCardUtils.js

Lines changed: 8 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22

33
import m from "mithril"
44
import stream from "mithril/stream/stream.js"
5-
import QRCode from "qrcode"
65
import {Icons} from "../../gui/base/icons/Icons"
76
import type {ColumnWidthEnum, TableLineAttrs} from "../../gui/base/TableN"
87
import {formatDate} from "../../misc/Formatter"
@@ -46,7 +45,7 @@ import {replaceHtmlEntities} from "../../mail/MailUtils"
4645
import {getFonts} from "../../gui/main-styles"
4746
import {ColumnWidth} from "../../gui/base/TableN"
4847
import {GiftCardMessageEditorField} from "./GiftCardMessageEditorField"
49-
import {getQRCodeSvg} from "../../misc/QrCodeUtils"
48+
import {getQRCodeSvg, getQRCodeSvgPath} from "../../misc/QrCodeUtils"
5049

5150
const ID_LENGTH = GENERATED_MAX_ID.length
5251
const KEY_LENGTH = 24
@@ -276,16 +275,10 @@ export function renderGiftCardSvg(price: number, country: Country, link: ?string
276275
let qrCode = null
277276
const qrCodeSize = 80
278277
if (link) {
279-
let qrcodeSvg = getQRCodeSvg({
280-
height: qrCodeSize,
281-
width: qrCodeSize,
278+
let qrcodeSvg = getQRCodeSvgPath({
279+
size: qrCodeSize,
282280
content: link,
283-
background: theme.content_accent,
284281
fill: theme.content_bg,
285-
container: "none",
286-
padding: 4,
287-
ecl: "M",
288-
typeNumber: 0
289282
})
290283
qrCode = htmlSanitizer.sanitize(qrcodeSvg, false).text
291284
}
@@ -368,8 +361,11 @@ export function renderGiftCardSvg(price: number, country: Country, link: ?string
368361
"font-size": ".4rem"
369362
}, lang.get("validInCountry_msg", {"{country}": country.n})),
370363
qrCode
371-
? m("g", {
372-
transform: `translate(${qrCodeLeft - qrCodePadding} ${messageBoxTop + messageBoxHeight + qrCodeTopPadding})`
364+
? m("svg", {
365+
width: qrCodeSize,
366+
height: qrCodeSize,
367+
x: qrCodeLeft - qrCodePadding,
368+
y: messageBoxTop + messageBoxHeight + qrCodeTopPadding
373369
}, m.trust(qrCode))
374370
: null,
375371
m("path", {

0 commit comments

Comments
 (0)