HTMLCanvasElementLuminanceSource.js 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  1. "use strict";
  2. var __extends = (this && this.__extends) || (function () {
  3. var extendStatics = function (d, b) {
  4. extendStatics = Object.setPrototypeOf ||
  5. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  6. function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
  7. return extendStatics(d, b);
  8. };
  9. return function (d, b) {
  10. extendStatics(d, b);
  11. function __() { this.constructor = d; }
  12. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  13. };
  14. })();
  15. Object.defineProperty(exports, "__esModule", { value: true });
  16. exports.HTMLCanvasElementLuminanceSource = void 0;
  17. var InvertedLuminanceSource_1 = require("../core/InvertedLuminanceSource");
  18. var LuminanceSource_1 = require("../core/LuminanceSource");
  19. var IllegalArgumentException_1 = require("../core/IllegalArgumentException");
  20. /**
  21. * @deprecated Moving to @zxing/browser
  22. */
  23. var HTMLCanvasElementLuminanceSource = /** @class */ (function (_super) {
  24. __extends(HTMLCanvasElementLuminanceSource, _super);
  25. function HTMLCanvasElementLuminanceSource(canvas, doAutoInvert) {
  26. if (doAutoInvert === void 0) { doAutoInvert = false; }
  27. var _this = _super.call(this, canvas.width, canvas.height) || this;
  28. _this.canvas = canvas;
  29. _this.tempCanvasElement = null;
  30. _this.buffer = HTMLCanvasElementLuminanceSource.makeBufferFromCanvasImageData(canvas, doAutoInvert);
  31. return _this;
  32. }
  33. HTMLCanvasElementLuminanceSource.makeBufferFromCanvasImageData = function (canvas, doAutoInvert) {
  34. if (doAutoInvert === void 0) { doAutoInvert = false; }
  35. var imageData = canvas.getContext('2d').getImageData(0, 0, canvas.width, canvas.height);
  36. return HTMLCanvasElementLuminanceSource.toGrayscaleBuffer(imageData.data, canvas.width, canvas.height, doAutoInvert);
  37. };
  38. HTMLCanvasElementLuminanceSource.toGrayscaleBuffer = function (imageBuffer, width, height, doAutoInvert) {
  39. if (doAutoInvert === void 0) { doAutoInvert = false; }
  40. var grayscaleBuffer = new Uint8ClampedArray(width * height);
  41. HTMLCanvasElementLuminanceSource.FRAME_INDEX = !HTMLCanvasElementLuminanceSource.FRAME_INDEX;
  42. if (HTMLCanvasElementLuminanceSource.FRAME_INDEX || !doAutoInvert) {
  43. for (var i = 0, j = 0, length_1 = imageBuffer.length; i < length_1; i += 4, j++) {
  44. var gray = void 0;
  45. var alpha = imageBuffer[i + 3];
  46. // The color of fully-transparent pixels is irrelevant. They are often, technically, fully-transparent
  47. // black (0 alpha, and then 0 RGB). They are often used, of course as the "white" area in a
  48. // barcode image. Force any such pixel to be white:
  49. if (alpha === 0) {
  50. gray = 0xFF;
  51. }
  52. else {
  53. var pixelR = imageBuffer[i];
  54. var pixelG = imageBuffer[i + 1];
  55. var pixelB = imageBuffer[i + 2];
  56. // .299R + 0.587G + 0.114B (YUV/YIQ for PAL and NTSC),
  57. // (306*R) >> 10 is approximately equal to R*0.299, and so on.
  58. // 0x200 >> 10 is 0.5, it implements rounding.
  59. gray = (306 * pixelR +
  60. 601 * pixelG +
  61. 117 * pixelB +
  62. 0x200) >> 10;
  63. }
  64. grayscaleBuffer[j] = gray;
  65. }
  66. }
  67. else {
  68. for (var i = 0, j = 0, length_2 = imageBuffer.length; i < length_2; i += 4, j++) {
  69. var gray = void 0;
  70. var alpha = imageBuffer[i + 3];
  71. // The color of fully-transparent pixels is irrelevant. They are often, technically, fully-transparent
  72. // black (0 alpha, and then 0 RGB). They are often used, of course as the "white" area in a
  73. // barcode image. Force any such pixel to be white:
  74. if (alpha === 0) {
  75. gray = 0xFF;
  76. }
  77. else {
  78. var pixelR = imageBuffer[i];
  79. var pixelG = imageBuffer[i + 1];
  80. var pixelB = imageBuffer[i + 2];
  81. // .299R + 0.587G + 0.114B (YUV/YIQ for PAL and NTSC),
  82. // (306*R) >> 10 is approximately equal to R*0.299, and so on.
  83. // 0x200 >> 10 is 0.5, it implements rounding.
  84. gray = (306 * pixelR +
  85. 601 * pixelG +
  86. 117 * pixelB +
  87. 0x200) >> 10;
  88. }
  89. grayscaleBuffer[j] = 0xFF - gray;
  90. }
  91. }
  92. return grayscaleBuffer;
  93. };
  94. HTMLCanvasElementLuminanceSource.prototype.getRow = function (y /*int*/, row) {
  95. if (y < 0 || y >= this.getHeight()) {
  96. throw new IllegalArgumentException_1.default('Requested row is outside the image: ' + y);
  97. }
  98. var width = this.getWidth();
  99. var start = y * width;
  100. if (row === null) {
  101. row = this.buffer.slice(start, start + width);
  102. }
  103. else {
  104. if (row.length < width) {
  105. row = new Uint8ClampedArray(width);
  106. }
  107. // The underlying raster of image consists of bytes with the luminance values
  108. // TODO: can avoid set/slice?
  109. row.set(this.buffer.slice(start, start + width));
  110. }
  111. return row;
  112. };
  113. HTMLCanvasElementLuminanceSource.prototype.getMatrix = function () {
  114. return this.buffer;
  115. };
  116. HTMLCanvasElementLuminanceSource.prototype.isCropSupported = function () {
  117. return true;
  118. };
  119. HTMLCanvasElementLuminanceSource.prototype.crop = function (left /*int*/, top /*int*/, width /*int*/, height /*int*/) {
  120. _super.prototype.crop.call(this, left, top, width, height);
  121. return this;
  122. };
  123. /**
  124. * This is always true, since the image is a gray-scale image.
  125. *
  126. * @return true
  127. */
  128. HTMLCanvasElementLuminanceSource.prototype.isRotateSupported = function () {
  129. return true;
  130. };
  131. HTMLCanvasElementLuminanceSource.prototype.rotateCounterClockwise = function () {
  132. this.rotate(-90);
  133. return this;
  134. };
  135. HTMLCanvasElementLuminanceSource.prototype.rotateCounterClockwise45 = function () {
  136. this.rotate(-45);
  137. return this;
  138. };
  139. HTMLCanvasElementLuminanceSource.prototype.getTempCanvasElement = function () {
  140. if (null === this.tempCanvasElement) {
  141. var tempCanvasElement = this.canvas.ownerDocument.createElement('canvas');
  142. tempCanvasElement.width = this.canvas.width;
  143. tempCanvasElement.height = this.canvas.height;
  144. this.tempCanvasElement = tempCanvasElement;
  145. }
  146. return this.tempCanvasElement;
  147. };
  148. HTMLCanvasElementLuminanceSource.prototype.rotate = function (angle) {
  149. var tempCanvasElement = this.getTempCanvasElement();
  150. var tempContext = tempCanvasElement.getContext('2d');
  151. var angleRadians = angle * HTMLCanvasElementLuminanceSource.DEGREE_TO_RADIANS;
  152. // Calculate and set new dimensions for temp canvas
  153. var width = this.canvas.width;
  154. var height = this.canvas.height;
  155. var newWidth = Math.ceil(Math.abs(Math.cos(angleRadians)) * width + Math.abs(Math.sin(angleRadians)) * height);
  156. var newHeight = Math.ceil(Math.abs(Math.sin(angleRadians)) * width + Math.abs(Math.cos(angleRadians)) * height);
  157. tempCanvasElement.width = newWidth;
  158. tempCanvasElement.height = newHeight;
  159. // Draw at center of temp canvas to prevent clipping of image data
  160. tempContext.translate(newWidth / 2, newHeight / 2);
  161. tempContext.rotate(angleRadians);
  162. tempContext.drawImage(this.canvas, width / -2, height / -2);
  163. this.buffer = HTMLCanvasElementLuminanceSource.makeBufferFromCanvasImageData(tempCanvasElement);
  164. return this;
  165. };
  166. HTMLCanvasElementLuminanceSource.prototype.invert = function () {
  167. return new InvertedLuminanceSource_1.default(this);
  168. };
  169. HTMLCanvasElementLuminanceSource.DEGREE_TO_RADIANS = Math.PI / 180;
  170. HTMLCanvasElementLuminanceSource.FRAME_INDEX = true;
  171. return HTMLCanvasElementLuminanceSource;
  172. }(LuminanceSource_1.default));
  173. exports.HTMLCanvasElementLuminanceSource = HTMLCanvasElementLuminanceSource;