diff --git a/typescript-javascript/qrcodegen-input-demo.html b/typescript-javascript/qrcodegen-input-demo.html
index cc46d6e..12846c2 100644
--- a/typescript-javascript/qrcodegen-input-demo.html
+++ b/typescript-javascript/qrcodegen-input-demo.html
@@ -79,7 +79,7 @@
|
- QR Code: |
+ QR Code: (download) |
|
-
- SVG XML code: |
-
-
- |
-
diff --git a/typescript-javascript/qrcodegen-input-demo.ts b/typescript-javascript/qrcodegen-input-demo.ts
index 79e0221..f4399bc 100644
--- a/typescript-javascript/qrcodegen-input-demo.ts
+++ b/typescript-javascript/qrcodegen-input-demo.ts
@@ -45,16 +45,15 @@ namespace app {
// Show/hide rows based on bitmap/vector image output
const bitmapOutput: boolean = getInput("output-format-bitmap").checked;
const scaleRow : HTMLElement = getElem("scale-row");
- const svgXmlRow: HTMLElement = getElem("svg-xml-row");
+ let download = getElem("download") as HTMLAnchorElement;
if (bitmapOutput) {
scaleRow.style.removeProperty("display");
- svgXmlRow.style.display = "none";
+ download.download = "qr-code.png";
} else {
scaleRow.style.display = "none";
- svgXmlRow.style.removeProperty("display");
+ download.download = "qr-code.svg";
}
- const svgXml = getElem("svg-xml-output") as HTMLTextAreaElement;
- svgXml.value = "";
+ download.removeAttribute("href");
// Reset output images in case of early termination
const canvas = getElem("qrcode-canvas") as HTMLCanvasElement;
@@ -96,6 +95,7 @@ namespace app {
return;
drawCanvas(qr, scale, border, lightColor, darkColor, canvas);
canvas.style.removeProperty("display");
+ download.href = canvas.toDataURL("image/png");
} else {
const code: string = toSvgString(qr, border, lightColor, darkColor);
const viewBox: string = (/ viewBox="([^"]*)"/.exec(code) as RegExpExecArray)[1];
@@ -105,7 +105,7 @@ namespace app {
(svg.querySelector("rect") as Element).setAttribute("fill", lightColor);
(svg.querySelector("path") as Element).setAttribute("fill", darkColor);
svg.style.removeProperty("display");
- svgXml.value = code;
+ download.href = "data:application/svg+xml," + encodeURIComponent(code);
}
// Returns a string to describe the given list of segments.