From 7a366525afefa4e184d5f664a87b7732f01a4efa Mon Sep 17 00:00:00 2001 From: mmcwilliams Date: Mon, 23 Dec 2024 23:03:07 -0500 Subject: [PATCH] Black and white example works --- index.html | 21 ++++++++++++++++----- src/content.js | 17 +++++++++-------- src/content.js.map | 2 +- src/content.ts | 18 +++++++++--------- 4 files changed, 35 insertions(+), 23 deletions(-) diff --git a/index.html b/index.html index 38861f6..56ae10c 100644 --- a/index.html +++ b/index.html @@ -16,21 +16,32 @@ padding: 0; } html,body{ - background: #000; - max-width: 100vw; - width: 100vw; - overflow-x: hidden; + background: #000; + max-width: 100vw; + width: 100vw; + height: 100vh; + max-height: 100vh; + overflow-x: hidden; + overflow-y: hidden; } #display,#video{ width: 100vw; height: auto; } + #start{ + display: block; + border: 1px solid #fff; + border-radius: 0; + color: #fff; + background: #000; + } - +
+ diff --git a/src/content.js b/src/content.js index be8a1b8..1d95b08 100644 --- a/src/content.js +++ b/src/content.js @@ -43,8 +43,8 @@ var Content = /** @class */ (function () { this.displayCtx = this.displayCanvas.getContext('2d'); this.displayCanvas.height = this.height; this.displayCanvas.width = this.width; - // - this.videoCanvas = document.getElementById('video'); //document.createElement('canvas') as HTMLCanvasElement; + //document.getElementById('video') as HTMLCanvasElement; + this.videoCanvas = document.createElement('canvas'); this.videoCtx = this.videoCanvas.getContext('2d'); this.startCamera(); } @@ -56,8 +56,8 @@ var Content = /** @class */ (function () { case 0: constraints = { video: { - width: { ideal: 4096 }, - height: { ideal: 2160 }, + width: { ideal: 640 }, + height: { ideal: 480 }, facingMode: 'environment' }, audio: false @@ -104,11 +104,11 @@ var Content = /** @class */ (function () { } if (code !== null && code.binaryData.length === 266) { document.querySelector('#data').innerText = code.binaryData.toString(); - console.dir(code); + //console.dir(code); this.display(code.binaryData); } else { - console.log('No QR'); + //console.log('No QR') } }; Content.prototype.display = function (data) { @@ -122,7 +122,8 @@ var Content = /** @class */ (function () { }; return Content; }()); -(function main() { +function start() { new Content(); -})(); +} +; //# sourceMappingURL=content.js.map \ No newline at end of file diff --git a/src/content.js.map b/src/content.js.map index cc578b4..9c47c73 100644 --- a/src/content.js.map +++ b/src/content.js.map @@ -1 +1 @@ -{"version":3,"file":"content.js","sourceRoot":"","sources":["content.ts"],"names":[],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"content.js","sourceRoot":"","sources":["content.ts"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/src/content.ts b/src/content.ts index 2a237f8..dd4fc02 100644 --- a/src/content.ts +++ b/src/content.ts @@ -23,8 +23,8 @@ class Content { this.displayCanvas.height = this.height; this.displayCanvas.width = this.width; - // - this.videoCanvas = document.getElementById('video') as HTMLCanvasElement; //document.createElement('canvas') as HTMLCanvasElement; + //document.getElementById('video') as HTMLCanvasElement; + this.videoCanvas = document.createElement('canvas') as HTMLCanvasElement; this.videoCtx = this.videoCanvas.getContext('2d'); this.startCamera(); @@ -33,8 +33,8 @@ class Content { async startCamera () { const constraints : MediaStreamConstraints = { video : { - width: { ideal: 4096 }, - height: { ideal: 2160 }, + width: { ideal: 640 }, + height: { ideal: 480 }, facingMode: 'environment' }, audio: false @@ -81,11 +81,11 @@ class Content { } if (code !== null && code.binaryData.length === 266) { - (document.querySelector('#data') as HTMLDivElement).innerText = code.binaryData.toString(); - console.dir(code); + //(document.querySelector('#data') as HTMLDivElement).innerText = code.binaryData.toString(); + //console.dir(code); this.display(code.binaryData); } else { - console.log('No QR') + //console.log('No QR') } } @@ -100,6 +100,6 @@ class Content { } } -(function main () { +function start () { new Content(); -})(); \ No newline at end of file +}; \ No newline at end of file