@syncfusion/ej2-barcode-generator
Version:
Barcode generator component is a pure JavaScript library which will convert a string to Barcode and show it to the user. This supports major 1D and 2D barcodes including coda bar, code 128, QR Code.
477 lines (476 loc) • 26.3 kB
JavaScript
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
import { BarcodeBase } from './barcode-base';
import { BarcodeRenderer } from './rendering/renderer';
import { Rect } from './primitives/rect';
import { createMeasureElements, measureText } from './utility/dom-util';
/**
* onedimension class is used to render all type of one dimensional shapes
*/
var OneDimension = /** @class */ (function (_super) {
__extends(OneDimension, _super);
function OneDimension() {
return _super !== null && _super.apply(this, arguments) || this;
}
OneDimension.prototype.getInstance = function (id) {
var barCode = document.getElementById(id);
var barcodeRenderer = new BarcodeRenderer(barCode.id, this.isSvgMode);
return barcodeRenderer;
};
/**
* Return the drawable size of the rectangle .
*
* @returns {Rect} Return the drawable size of the rectangle.
* @param {MarginModel} margin - Specifies the filename of the barcode image to be download.
* @param {number} w - Specifies the filename of the barcode image to be download.
* @param {number} h - Defines the format of the barcode to be exported
* @private
*/
OneDimension.prototype.getDrawableSize = function (margin, w, h) {
var topMargin = ((this.isSvgMode ? margin.bottom : margin.bottom * 1.5)
+ (this.isSvgMode ? margin.top : margin.top * 1.5));
var rightMargin = ((this.isSvgMode ? margin.right : margin.right * 1.5)
+ (this.isSvgMode ? margin.left : margin.left * 1.5));
var barcodeSize = new Rect(margin.left, margin.top, (w - rightMargin), h - topMargin);
return barcodeSize;
};
OneDimension.prototype.getBaseAttributes = function (width, height, offSetX, offsetY, color, string, stringSize, visibility, fontStyle) {
var options = {
width: width, height: height, x: offSetX, y: offsetY, color: color, string: string,
stringSize: stringSize, visibility: visibility, fontStyle: fontStyle
};
if (!this.isSvgMode) {
options.height = options.height / 1.5;
}
if (string && !this.isSvgMode) {
var scaleValue = this.margin.bottom * 1.5 - this.margin.bottom;
options.y += scaleValue;
}
return options;
};
OneDimension.prototype.getBarLineRatio = function (code, widthValue) {
var type = this.type;
if (type === 'Code39' || type === 'Code32' || type === 'Code39Extension' || type === 'Code11') {
// total number of line for single width lines
var singlewidth = code.length * ((type === 'Code39' || type === 'Code32' || type === 'Code39Extension') ? 6 : 3);
// total number of line for double width lines
var doublwidth = code.length * ((type === 'Code39' || type === 'Code32' || type === 'Code39Extension') ? 3 : 2) * 2;
return (widthValue / (doublwidth + singlewidth + code.length - 1));
}
else if (type === 'Code128A' || type === 'Code128B' || type === 'Code128C' || type === 'Code128') {
var lineCount = code[0].length;
return (widthValue / (lineCount + code.length - 1));
}
else if (type === 'Code93Extension') {
var count = 0;
for (var i = 0; i < code.length; i++) {
var numberOfDigits = code[parseInt(i.toString(), 10)];
for (var j = 0; j < numberOfDigits.length; j++) {
count += Number(numberOfDigits[parseInt(j.toString(), 10)]);
}
}
return widthValue / count;
}
else {
var lineCount = 0;
for (var i = 0; i < code.length; i++) {
var numberOfDigits = code[parseInt(i.toString(), 10)].length;
lineCount += numberOfDigits;
}
var additionalValue = void 0;
if (type === 'Ean8' || type === 'Ean13' || type === 'UpcA') {
additionalValue = 2;
}
else if (type === 'Code93') {
additionalValue = -code.length + 1;
}
return (widthValue / (additionalValue ? ((lineCount + code.length - 1) + additionalValue) : (lineCount + code.length - 1)));
}
};
OneDimension.prototype.multipleWidth = function (codeValue, k, value) {
var number;
if (codeValue[parseInt(k.toString(), 10)] === '1' && codeValue[k + 1] === '1') {
number = value + 1;
return this.multipleWidth(codeValue, k + 1, number);
}
return value;
};
OneDimension.prototype.barCodeType = function (type) {
if (type === 'Code39' || type === 'UpcE' || type === 'Code39Extension') {
return 'twoBars';
}
else if (type === 'UpcA' || type === 'Ean13' || type === 'Ean8') {
return 'threeBars';
}
else {
return 'noBars';
}
};
OneDimension.prototype.checkStartValueCondition = function (j, k, numberOfDigits, barType) {
if ((j === 1 && k === 0 && barType === 'twoBars' && this.type !== 'UpcE' ||
(((j === 0 && k === numberOfDigits - 1) || j === 2 && k === numberOfDigits - 2)
&& (this.type === 'Ean8' || this.type === 'Ean13')))
|| (this.type === 'UpcE' && j === 2 && k === 0)
|| (this.type !== 'UpcA' && barType === 'threeBars' && (j === 2 && k === numberOfDigits - 1))
|| this.type === 'UpcA' && ((j === 1 && k === numberOfDigits - 2)
|| (j === 3 && k === numberOfDigits - 2))
|| (barType === 'noBars' && j === 0 && k === 0)) {
return true;
}
else {
return false;
}
};
OneDimension.prototype.checkEndValueCondition = function (k, j, numberOfDigits, code, temp, doublwidth) {
var type = this.type;
if ((k === numberOfDigits && j === code.length - 2 && (type === 'Code39' || type === 'Code39Extension'))
|| (type === 'Code11' && j === code.length - 1 && k === numberOfDigits - 1)
|| type === 'Code93Extension' && j === code.length - 1 && k === numberOfDigits - 1
|| ((type === 'Ean8') && (j === 1 && k === numberOfDigits
|| j === code.length - 2 && k === numberOfDigits))
|| ((this.type === 'Ean13') && ((j === 2 && k === 1) || j === code.length - 2 && k === numberOfDigits))
|| (type === 'UpcA' && (j === 3 && k === 0 || j === 5 && (!temp ? (k === 1) : ((k === (doublwidth))))))
|| (type === 'UpcE' && (j === code.length - 2 && k === 1))
|| (type === 'Code93' && j === code.length - 1 && k === numberOfDigits - 1)
|| ((type !== 'Code39' && type !== 'Code39Extension'
&& type !== 'Ean8' && type !== 'Ean13') && j === code.length - 1 && k === numberOfDigits)) {
return true;
}
else {
return false;
}
};
OneDimension.prototype.getDisplayText = function (j, textProperty) {
var text;
if (this.type === 'Ean8') {
text = j === 1 ? (this.value.substring(0, 4)) : (this.value.substring(4, 8));
}
else if (this.type === 'Ean13') {
text = j === 2 ? (this.value.substring(1, 7)) : (this.value.substring(7));
}
else if (this.type === 'UpcA') {
text = j === 3 ? ((this.value.substring(0, 6))) : (this.value.substring(6, 12));
}
else {
text = textProperty.text ? textProperty.text : this.value;
}
return text;
};
OneDimension.prototype.checkExtraHeight = function (j, type, code) {
if (((j === 0 || j === code.length - 1) && (type === 'Code39' || type === 'Code39Extension'))
|| ((type === 'Ean8' || type === 'Ean13') && (j === 0 || j === 2 || j === code.length - 1))
|| type === 'UpcA' && (j === 1 || j === code.length - 2 || j === code.length - 4)
|| type === 'UpcE' && (j === 1 || j === code.length - 2 || j === code.length - 4)) {
return true;
}
else {
return false;
}
};
OneDimension.prototype.getWidthValue = function (number, width, type) {
if (this.type !== 'Code93Extension') {
if (number) {
var dividerValue = type === 'Code32' ? 3 : 2;
width = number % dividerValue ? 1 : 2;
}
else {
width = 1;
}
}
if (this.type === 'Code93Extension') {
if (number && !(number % 4)) {
width = 4;
}
else if (number && !(number % 2)) {
width = 2;
}
else if (number && !(number % 3)) {
width = 3;
}
else {
width = 1;
}
}
return width;
};
/* eslint:disable */
/**
* Returns the module name of the barcode
*
* @param {number[] | string[]} code - Returns the code as string or number collection.
* @param {HTMLElement} canvas - Returns the canvas.
* @param {string} isUpcE - Returns the UPCE values as string.
* @returns {void} Calculate the barcode attribute
* @private
*/
OneDimension.prototype.calculateBarCodeAttributes = function (code, canvas, isUpcE) {
var temp = false;
var canDoubleWidth;
var barcodeSize = this.getDrawableSize(this.margin, this.width, this.height);
if (barcodeSize.height > 0 && barcodeSize.width > 0) {
var tempBaseAttributes = void 0;
var options = [];
var offsetX = barcodeSize.x;
var ratio = this.getBarLineRatio(code, barcodeSize.width);
ratio = this.isSvgMode ? ratio : ratio / 1.5;
var startValue = 0;
var endValue = void 0;
var type = this.type;
var position = this.displayText.position;
var scaleValue = this.isSvgMode ? 1 : 1.5;
var textOptions = void 0;
var textSize = void 0;
var textHeight = void 0;
var textProperty = void 0;
for (var j = 0; j < code.length; j++) {
var codeValue = code[parseInt(j.toString(), 10)];
var check = (type !== 'UpcA' && type !== 'UpcE' && type !== 'Code11' && type !== 'Code93' && type !== 'Code93Extension');
var barType = this.barCodeType(this.type);
var extraHeight = this.checkExtraHeight(j, type, code);
var numberOfDigits = codeValue.length;
temp = false;
for (var k = 0; check ? k <= numberOfDigits : k < numberOfDigits; k++) {
var renderText = false;
if (this.checkStartValueCondition(j, k, numberOfDigits, barType)) {
startValue = offsetX;
}
else if (this.checkEndValueCondition(k, j, numberOfDigits, code, temp, canDoubleWidth)) {
endValue = offsetX;
if (this.type === 'UpcA' && temp && canDoubleWidth) {
endValue -= canDoubleWidth * ratio;
}
renderText = true;
}
var canDrawCheck = (type === 'Code39' || type === 'Code93Extension' || type === 'Code32' || type === 'Code11' || type === 'Code39Extension');
var candraw = canDrawCheck ? (k % 2 ? false : true) : (codeValue[parseInt(k.toString(), 10)] === '1' ? true : false);
var string = codeValue.toString();
var number = Number(string[parseInt(k.toString(), 10)]);
var width = void 0;
width = this.getWidthValue(number, width, type);
width = width * ratio;
textProperty = this.displayText;
var text = this.getDisplayText(j, textProperty);
textOptions = this.getBaseAttributes(undefined, undefined, startValue, position === 'Bottom' ? (barcodeSize.y + barcodeSize.height) + 2 : (barcodeSize.y + textHeight) - 2, this.foreColor, isUpcE || text, textProperty.size, textProperty.visibility, textProperty.font);
if (!textHeight) {
createMeasureElements();
textSize = measureText(textOptions);
textHeight = (textSize.height / 2) + 2;
}
if (extraHeight) {
tempBaseAttributes = this.getBaseAttributes(width, position === 'Top' && barType !== 'noBars' ? (barcodeSize.height - textHeight - this.displayText.margin.top) : (barcodeSize.height), offsetX, position === 'Bottom' ? barcodeSize.y : barcodeSize.y + textHeight + this.displayText.margin.top, this.foreColor);
}
if ((type === 'Ean13') && k === 0 && j === 0 && textProperty.visibility) {
textOptions = this.getBaseAttributes(undefined, undefined, startValue, position === 'Bottom' ? (barcodeSize.y + barcodeSize.height) + 2 : ((barcodeSize.y + textHeight + this.displayText.margin.top) - 2) - this.displayText.margin.bottom, this.foreColor, isUpcE || text, textProperty.size, textProperty.visibility, textProperty.font);
textOptions.string = this.value[0];
this.drawText(canvas, textOptions);
}
if (!extraHeight || renderText || (type === 'UpcA' && extraHeight)) {
var checkCode = type === 'Code39' || type === 'Code32' || type === 'Code93Extension' || type === 'Code39Extension' || type === 'Code11';
var value = barcodeSize.height;
var barCodeHeight = (((value) - textHeight * scaleValue) > 0 ? ((value) - textHeight * scaleValue) : 0);
if (checkCode || type === 'Ean8' || type === 'Ean13') {
barCodeHeight = position === 'Top' && barType !== 'noBars' ? (barCodeHeight - textHeight) : barCodeHeight;
var height = extraHeight ? barcodeSize.height : barCodeHeight;
if (this.type !== 'Code39') {
height = position === 'Top' && barType !== 'noBars' ? (height - this.displayText.margin.top) - textHeight : height;
}
tempBaseAttributes = this.getBaseAttributes(width, height, offsetX, position === 'Bottom' ? barcodeSize.y : barcodeSize.y + textHeight + this.displayText.margin.top, this.foreColor);
}
if ((!checkCode || (!renderText && !checkCode)) && (!renderText || this.type !== 'UpcE')) {
canDoubleWidth = this.multipleWidth((codeValue), k, 1);
k += canDoubleWidth - 1;
if (canDoubleWidth > 1) {
temp = true;
}
var rectWidth = canDoubleWidth > 1 ? (canDoubleWidth * width) : width;
var rectHeight = (barcodeSize.height - textHeight * scaleValue);
var height = extraHeight ? barcodeSize.height : rectHeight;
height = position === 'Top' && barType !== 'noBars' ? (height - this.displayText.margin.top) - textHeight : height;
tempBaseAttributes = this.getBaseAttributes(rectWidth, height, offsetX, position === 'Bottom' ? barcodeSize.y : barcodeSize.y + textHeight + this.displayText.margin.top, this.foreColor);
offsetX = canDoubleWidth > 1 ? offsetX + (canDoubleWidth * (width)) : offsetX + (1 * (width));
}
if (renderText || !extraHeight) {
this.verticalTextMargin(textProperty, tempBaseAttributes, textOptions);
}
if (textProperty.visibility &&
((endValue && type !== 'Ean8' && type !== 'Ean13' && type !== 'UpcA' && type !== 'UpcE')
|| ((type === 'Ean8' || type === 'UpcA' || type === 'UpcE' || type === 'Ean13') && renderText))) {
if (!textProperty.margin.left && !textProperty.margin.right && (textProperty.text || type === 'UpcA')) {
this.updateOverlappedTextPosition((endValue - startValue), textOptions, textSize, startValue, textProperty, endValue);
}
else {
this.getAlignmentPosition(textOptions, endValue, startValue, textSize);
}
if (type === 'UpcA') {
var checkVAl = (textOptions.string === this.value.substr(0, 6)) ? true : false;
textOptions.string = checkVAl ? this.value.substr(0, 1) : textOptions.string.substr(0, 5);
var xPosition = checkVAl ? options[0].x / 2 : options[options.length - 1].x
+ textOptions.stringSize;
var yPosition = 0;
if (checkVAl) {
var tempPosition = textOptions.x;
textOptions.x = xPosition;
yPosition = textOptions.y;
this.drawText(canvas, textOptions);
textOptions.x = tempPosition;
if (!this.isSvgMode) {
textOptions.y = yPosition;
}
textOptions.string = this.value.substr(1, 5);
this.updateOverlappedTextPosition((endValue - startValue), textOptions, textSize, startValue, textProperty, endValue);
}
else {
this.updateOverlappedTextPosition((endValue - startValue), textOptions, textSize, startValue, textProperty, endValue);
yPosition = textOptions.y;
this.drawText(canvas, textOptions);
if (!this.isSvgMode) {
textOptions.y = yPosition;
}
textOptions.string = this.value.substr(11, 12);
textOptions.x = xPosition;
}
}
this.alignDisplayText(textOptions, textProperty, startValue, endValue, textSize);
this.drawText(canvas, textOptions);
}
}
if (candraw) {
options.push(tempBaseAttributes);
}
if (this.canIncrementCheck(type, j, code)) {
offsetX += (width);
}
}
}
this.drawImage(canvas, options);
}
};
/* eslint:enable */
OneDimension.prototype.canIncrementCheck = function (type, j, code) {
if ((type === 'Code39' || type === 'Code32' || type === 'Code39Extension' || type === 'Code93Extension'
|| type === 'Code11') || (type === 'UpcE' && (j === 1 || j === code.length - 2)) ||
((type === 'Ean8' || type === 'Ean13') && (j === 0 || j === code.length - 1 || j === 2))) {
return true;
}
else {
return false;
}
};
OneDimension.prototype.verticalTextMargin = function (textProperty, tempBaseAttributes, textOptions) {
if (textProperty.margin.top && tempBaseAttributes.height - textProperty.margin.top > 0) {
if (textProperty.margin.top > 0 && textProperty.position === 'Bottom') {
tempBaseAttributes.height -= textProperty.margin.top;
}
else {
textOptions.y += textProperty.margin.top;
}
}
if (textProperty.margin.bottom && tempBaseAttributes.height - textProperty.margin.bottom > 0) {
if (textProperty.margin.bottom > 0) {
textOptions.y -= textProperty.margin.bottom;
if (this.displayText.position === 'Bottom') {
tempBaseAttributes.height -= textProperty.margin.bottom;
}
}
else {
textOptions.y -= textProperty.margin.bottom;
}
}
};
OneDimension.prototype.getAlignmentPosition = function (textOptions, endValue, startValue, textSize) {
if (this.displayText.alignment === 'Center') {
textOptions.x += (((endValue - startValue)) / 2) - textSize.width * .5;
}
else if (this.displayText.alignment === 'Left') {
textOptions.x = startValue;
}
else {
textOptions.x = endValue - textSize.width;
}
};
/**
*Will draw the image for the barcode .
*
* @param {HTMLCanvasElement} canvas Barcode canvas element.
* @param {BaseAttributes []} options Barcode attributes .
* @function drawImage
* @returns {void} Export the barcode as an image in the specified image type and downloads it in the browser.
* @memberof Barcode
* @private
*/
OneDimension.prototype.drawImage = function (canvas, options) {
var barcodeRenderer = this.getInstance(canvas.id);
for (var i = 0; i < options.length; i++) {
barcodeRenderer.renderRectElement(canvas, options[parseInt(i.toString(), 10)]);
}
};
OneDimension.prototype.updateDisplayTextSize = function (options, size, endValue, startValue, textProperty) {
if (options.x + size.width > endValue || (options.x < startValue) && options.stringSize > 2) {
// eslint-disable-next-line
var rightAlign = options.x < startValue && textProperty.margin.right ? true : false;
if (options.x < startValue && textProperty.margin.right) {
// if the displaytext rendering overlaps the barcode then need to reduce the displaytext size gradually by 2
options.stringSize -= 2;
var newSize = measureText(options);
// used to get the middle value for the text as well the total barcode size
options.x += (((endValue - startValue)) / 2) - newSize.width * .5;
var diff = textProperty.margin.right - (endValue - (options.x + size.width));
options.x -= diff;
this.updateDisplayTextSize(options, newSize, endValue, startValue, textProperty);
}
}
};
OneDimension.prototype.alignDisplayText = function (options, textProperty, startValue, endValue, size) {
var leftMargin = false;
// have to adjust the displaytext position during the rendering of default displaytext size
if ((textProperty.margin.left || textProperty.margin.right)) {
if (options.x - startValue < textProperty.margin.left && textProperty.margin.left) {
leftMargin = true;
var diff = textProperty.margin.left - (options.x - startValue);
options.x += diff;
this.updateDisplayTextSize(options, size, endValue, startValue, textProperty);
}
if ((endValue - (options.x + size.width) < textProperty.margin.right) && textProperty.margin.right && !leftMargin) {
var diff = textProperty.margin.right - (endValue - (options.x + size.width));
options.x -= diff;
this.updateDisplayTextSize(options, size, endValue, startValue, textProperty);
}
else if ((endValue - (options.x + size.width) < textProperty.margin.right)) {
var newSize = measureText(options);
this.updateOverlappedTextPosition((endValue - startValue), options, newSize, startValue, textProperty, endValue);
this.updateDisplayTextSize(options, newSize, endValue, startValue, textProperty);
}
}
};
OneDimension.prototype.updateOverlappedTextPosition = function (width, options, size, startValue, textProperty, endValue) {
if ((size.width > width || textProperty) && (endValue - (options.x + size.width) <= textProperty.margin.right)
&& options.stringSize > 2) {
options.stringSize -= !textProperty ? 2 : .2;
var newSize = measureText(options);
this.updateOverlappedTextPosition(width, options, newSize, startValue, textProperty, endValue);
}
else if (!textProperty.margin.left && !textProperty.margin.right && options.stringSize > 2) {
this.getAlignmentPosition(options, endValue, startValue, size);
}
};
OneDimension.prototype.drawText = function (canvas, options) {
if (!this.isSvgMode) {
options.y /= 1.5;
}
var barcodeRenderer = this.getInstance(canvas.id);
barcodeRenderer.renderTextElement(canvas, options);
};
return OneDimension;
}(BarcodeBase));
export { OneDimension };