diff --git a/scripts/esbuild.js b/scripts/esbuild.js
index aa753d76..4448d427 100644
--- a/scripts/esbuild.js
+++ b/scripts/esbuild.js
@@ -1,6 +1,6 @@
const esbuild = require('esbuild')
-for (let f of ["content", "background", "help", "newtab", "reader", "commandline_frame"]) {
+for (let f of ["content", "background", "help", "newtab", "reader", "commandline_frame", "qrCodeGenerator"]) {
esbuild.build({
entryPoints: [`src/${f}.ts`],
bundle: true,
diff --git a/src/excmds.ts b/src/excmds.ts
index a2d78b6a..143d19a6 100644
--- a/src/excmds.ts
+++ b/src/excmds.ts
@@ -5899,6 +5899,42 @@ export async function issue() {
textarea.value = template
}
+/**
+ * generates qr code for the given text
+ */
+//#content
+export async function text2qr(...args: string[]) {
+ let text: string = null
+ let isParsed = false
+ let openMode = null
+ while (!isParsed) {
+ switch (args[0]) {
+ case "--window":
+ openMode = winopen
+ args.shift()
+ break
+ case "--current":
+ openMode = open
+ args.shift()
+ break
+ default:
+ isParsed = true
+ break
+ }
+ }
+
+ if (!openMode) openMode = tabopen // default to new tab if no option provided
+
+ text = args.join(" ").trim()
+ if (!text || text.length == 0) {
+ text = window.location.href
+ }
+ const urlEncodedText = encodeURIComponent(text)
+ const url = new URL(browser.runtime.getURL("static/qrcode.html"))
+ url.searchParams.append("data", btoa(urlEncodedText))
+ openMode(url.href)
+}
+
/**
* Checks if there are any stable updates available for Tridactyl.
*
diff --git a/src/qrCodeGenerator.ts b/src/qrCodeGenerator.ts
new file mode 100644
index 00000000..0bab0077
--- /dev/null
+++ b/src/qrCodeGenerator.ts
@@ -0,0 +1,44 @@
+import QRCode from "../vendor/qrcode"
+import * as Logging from "@src/lib/logging"
+
+const logger = new Logging.Logger("qrcode-display")
+
+function displayError() {
+ const errorDisplay: HTMLDivElement =
+ document.querySelector("div#error-display")
+ errorDisplay.classList.remove("hide")
+ errorDisplay.innerHTML = "Unable to generate QR code for the given data"
+}
+
+function setUpPage() {
+ const imgElem: HTMLImageElement =
+ document.querySelector("div#qr-canvas img")
+ const anchorElem: HTMLAnchorElement =
+ document.querySelector("div#qr-buttons a")
+ const downloadButton: HTMLButtonElement = document.querySelector(
+ "div#qr-buttons button",
+ )
+
+ const url = new URL(window.location.href)
+ let data = url.searchParams.get("data")
+ data = decodeURIComponent(atob(data))
+ const opts = {
+ scale: 10,
+ }
+
+ QRCode.toDataURL(data, opts, (error: Error, url: string) => {
+ if (error) {
+ logger.error(error)
+ displayError()
+ } else {
+ imgElem.src = url
+ anchorElem.href = url
+ }
+ })
+
+ downloadButton.addEventListener("click", function () {
+ anchorElem.click()
+ })
+}
+
+window.addEventListener("load", setUpPage)
diff --git a/src/static/css/qrcode.css b/src/static/css/qrcode.css
new file mode 100644
index 00000000..94ad13b1
--- /dev/null
+++ b/src/static/css/qrcode.css
@@ -0,0 +1,33 @@
+div.container {
+ display: flex;
+ flex-direction: column;
+}
+
+div#qr-canvas {
+ text-align: center;
+}
+
+div.container div.buttons {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+button#download {
+ background: #2183ec;
+ color: white;
+ font-size: 20px;
+ border-radius: 10px;
+ padding: 12px;
+}
+
+div.hide {
+ display: none;
+}
+
+div.error {
+ color: red;
+ font-size: 20px;
+ text-align: center;
+ padding: 20px;
+}
diff --git a/src/static/qrcode.html b/src/static/qrcode.html
new file mode 100644
index 00000000..3330881e
--- /dev/null
+++ b/src/static/qrcode.html
@@ -0,0 +1,27 @@
+
+
+ QR Code display
+
+
+
+
+
+
+
+
+
+
+
+
![]()
+
+
+
+
+