Skip to content

Commit

Permalink
load qr content
Browse files Browse the repository at this point in the history
  • Loading branch information
strukturart committed Dec 26, 2023
1 parent b19945a commit 1a6d648
Show file tree
Hide file tree
Showing 3 changed files with 57 additions and 109 deletions.
162 changes: 55 additions & 107 deletions application/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -201,80 +201,42 @@ let read_files = (callback) => {
};
read_files();

let load_qrcode_content = (filepath) => {
let sdcard = "";
let load_qrcode_content = (blobUrl) => {
document.querySelector(".loading-spinner").style.display = "block";

try {
sdcard = navigator.getDeviceStorage("sdcard");
} catch (e) {}
const img = new Image();

if ("b2g" in navigator) {
try {
sdcard = navigator.b2g.getDeviceStorage("sdcard");
} catch (e) {}
}

let request = sdcard.get(filepath);
img.onload = function () {
const width = img.width;
const height = img.height;

request.onsuccess = function (e) {
const file = e.target.result; // The retrieved file

const reader = new FileReader();

reader.addEventListener("load", function (event) {
const arrayBuffer = event.target.result; // This is the ArrayBuffer

if (arrayBuffer instanceof ArrayBuffer) {
const blob = new Blob([arrayBuffer]);
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");

// Create an Image object
const img = new Image();
canvas.width = width;
canvas.height = height;
ctx.drawImage(img, 0, 0);

img.onload = function () {
const width = img.width; // Get the width of the image
const height = img.height; // Get the height of the image
const imageData = ctx.getImageData(0, 0, width, height);
const code = jsQR(imageData.data, width, height);

// Create a canvas and draw the image on it
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
canvas.width = width;
canvas.height = height;
ctx.drawImage(img, 0, 0);

// Get image data
const imageData = ctx.getImageData(0, 0, width, height);

// Use jsQR to decode the QR code
const code = jsQR(imageData.data, width, height);

if (code) {
qrcode_content = code.data;
helper.bottom_bar("<img src='assets/images/eye.svg'>", "", "");
document.querySelector(".loading-spinner").style.display = "none";
} else {
qrcode_content = "";
helper.bottom_bar("", "", "");
document.querySelector(".loading-spinner").style.display = "none";
}
};

img.onerror = function () {
console.error("Failed to load the image.");
};

// Set the image source to the Blob URL
img.src = URL.createObjectURL(blob);
} else {
console.error("Invalid ArrayBuffer type.");
}
});

reader.readAsArrayBuffer(file);
if (code) {
qrcode_content = code.data;
helper.bottom_bar("<img src='assets/images/eye.svg'>", "", "");
document.querySelector(".loading-spinner").style.display = "none";
} else {
qrcode_content = "";
helper.bottom_bar("", "", "");
document.querySelector(".loading-spinner").style.display = "none";
}
};

request.onerror = function (error) {
console.log(error);
img.onerror = function () {
console.error("Failed to load the image.");
document.querySelector(".loading-spinner").style.display = "none";
};

img.src = blobUrl;
};

let pdfContainer; // Define pdfContainer in a higher scope
Expand Down Expand Up @@ -561,14 +523,12 @@ document.addEventListener("DOMContentLoaded", function () {
m("img", {
src: selected_image,
id: "image",
oninit: () => {
document.querySelector(".loading-spinner").style.display = "block";
},
oninit: () => {},
oncreate: () => {
qrcode_content = "";
helper.bottom_bar("", "", "");
try {
load_qrcode_content(selected_image_url);
load_qrcode_content(selected_image);
} catch (e) {
document.querySelector(".loading-spinner").style.display = "none";
}
Expand Down Expand Up @@ -758,55 +718,48 @@ document.addEventListener("DOMContentLoaded", function () {
case "Backspace":
evt.preventDefault();

if (m.route.get().includes("/show_image")) {
if (general.importAction) {
m.route.set("/start");
general.importAction = false;
helper.bottom_bar(
"<img src='assets/images/save.svg'>",
"",
"<img src='assets/images/option.svg'>"
);
} else if (m.route.get().includes("/show_image")) {
m.route.set("/start?focus=" + selected_image_url);

break;
}

if (m.route.get().includes("/show_pdf")) {
} else if (m.route.get().includes("/show_pdf")) {
m.route.set("/start?focus=" + selected_image_url);

break;
}

if (m.route.get().includes("/options")) {
} else if (m.route.get().includes("/options")) {
m.route.set("/start");
break;
}

if (m.route.get().includes("/scan")) {
} else if (m.route.get().includes("/scan")) {
m.route.set("/start");
break;
}
if (m.route.get().includes("/start")) {
window.close();
}
if (m.route.get().includes("/show_qr_content")) {
} else if (
m.route.get().includes("/start") &&
general.importAction == false
) {
// window.close();
} else if (m.route.get().includes("/show_qr_content")) {
if (status == "after_scan") {
m.route.set("/start");
} else {
m.route.set("/show_image");
}
break;
} else {
window.close();
}
break;

case "EndCall":
evt.preventDefault();

if (m.route.get().includes("/show_image")) {
m.route.set("/start?focus=" + selected_image_url);

break;
}

if (m.route.get().includes("/show_pdf")) {
} else if (m.route.get().includes("/show_pdf")) {
m.route.set("/start?focus=" + selected_image_url);

break;
}

if (m.route.get().includes("/start")) {
} else {
window.close();
}
break;
Expand Down Expand Up @@ -900,7 +853,8 @@ document.addEventListener("DOMContentLoaded", function () {
} else {
selected_image = document.activeElement.getAttribute("data-file");
selected_image_url = document.activeElement.getAttribute("data-path");
if (selected_image == "") return false;
if (selected_image == null) return false;
if (files.length == 0) return false;

if (document.activeElement.getAttribute("data-type") == "pdf") {
m.route.set("/show_pdf");
Expand Down Expand Up @@ -950,7 +904,7 @@ document.addEventListener("DOMContentLoaded", function () {
break;

case "2":
if (m.route.get().includes("/start")) {
if (m.route.get().includes("/start") && files.length > 0) {
general.fileAction = true;
helper.bottom_bar(
"<img src='assets/images/pencil.svg'>",
Expand All @@ -972,16 +926,10 @@ document.addEventListener("DOMContentLoaded", function () {

if (evt.key === "EndCall") {
evt.preventDefault();
if (m.route.get().includes("/start")) {
window.close();
}
}

if (evt.key === "Backspace") {
evt.preventDefault();
if (m.route.get().includes("/start")) {
window.close();
}
}

if (!evt.repeat) {
Expand Down
2 changes: 1 addition & 1 deletion application/manifest.webapp
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"version": "1.2.11",
"version": "1.2.12",
"name": "passport",
"description": "At times it is practically fast to access digital train airplane qrcode tickets to showcase at a check-in. I wrote an app for that. All images in the folder passport are listed.",
"launch_path": "/index.html",
Expand Down
2 changes: 1 addition & 1 deletion application/manifest.webmanifest
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
],

"b2g_features": {
"version": "0.0.730",
"version": "0.0.731",
"id": "passport",
"core": true,
"categories": ["utilities"],
Expand Down

0 comments on commit 1a6d648

Please sign in to comment.