From d60b91f61fdb69c738a7b1357a82a6e6c4794309 Mon Sep 17 00:00:00 2001
From: Hadi Nategh <hn@stylite.de>
Date: Tue, 25 Aug 2015 15:28:30 +0000
Subject: [PATCH] Introduce new widget called et2_barcode, which can generate
 different barcode types from a string value

---
 etemplate/js/et2_widget_barcode.js | 162 +++++++++++++++++++++++++++++
 etemplate/js/etemplate2.js         |   1 +
 2 files changed, 163 insertions(+)
 create mode 100644 etemplate/js/et2_widget_barcode.js

diff --git a/etemplate/js/et2_widget_barcode.js b/etemplate/js/et2_widget_barcode.js
new file mode 100644
index 0000000000..5eb8b7b85b
--- /dev/null
+++ b/etemplate/js/et2_widget_barcode.js
@@ -0,0 +1,162 @@
+/**
+ * EGroupware eTemplate2 - JS barcode widget
+ *
+ * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
+ * @package etemplate
+ * @subpackage api
+ * @link http://www.egroupware.org
+ * @author Hadi Nategh <hn[at]stylite.de>
+ * @copyright Stylite AG
+ * @version $Id:$
+ */
+
+"use strict";
+
+/*egw:uses
+	jquery.jquery;
+	/phpgwapi/js/jquery/barcode/jquery-barcode.min.js;
+	et2_core_interfaces;
+	et2_core_baseWidget;
+*/
+
+/**
+ * This widget creates barcode out of a given text
+ *
+ * The widget can be created in the following ways:
+ * <code>
+ * var barcodeTag = et2_createWidget("barcode", {
+ *	code_type:et2_barcode.TYPE_CSS,
+ *	bgColor:"#FFFFFF",
+ *	barColor:"#000000",
+ *	format:et2_barcode.FORMAT_SVG,
+ *	barWidth:"1",
+ *	barHeight:"50"
+ * });
+ * </code>
+ * Or by adding XET-tag in your template (.xet) file:
+ * <code>
+ * <barcode [attributes...]/>
+ * </code>
+ *
+ * Further information about types and formats are defined in static part of the class at the end
+ */
+
+/**
+ * Class which implements the "barcode" XET-Tag
+ *
+ * @augments et2_baseWidget
+ */
+var et2_barcode = et2_valueWidget.extend(
+{
+	attributes : {
+		"code_type": {
+			"name": "code type",
+			"type": "string",
+			"default": "datamatrix", //et2_barcode.TYPE_DATAMATRIX
+			"description": "Barcode type to be generated, default is QR barcode"
+		},
+		bgColor: {
+			"name":"bgColor",
+			"type": "string",
+			"default":'#FFFFFF',
+			"description": "Defines backgorund color of barcode container"
+		},
+		barColor: {
+			"name":"barColor",
+			"type": "string",
+			"default":'#000000',
+			"description": "Defines color of the bars in barcode."
+		},
+		format: {
+			"name":"format",
+			"type": "string",
+			"default":'css', //et2_barcode.FORMAT_CSS
+			"description": "Defines in which format the barcode should be rendered. Default is SVG."
+		},
+		barWidth: {
+			"name":"bar width",
+			"type": "string",
+			"default":'1',
+			"description": "Defines width of each bar in the barcode."
+		},
+		barHeight: {
+			"name":"bar height",
+			"type": "string",
+			"default":'50',
+			"description": "Defines heigh of each bar in the barcode."
+		},
+	},
+
+	/**
+	 * Constructor
+	 *
+	 * @memberOf et2_video
+	 */
+	init: function()
+	{
+		this._super.apply(this, arguments);
+
+		this.div = jQuery(document.createElement('div')).attr({	class:'et2_barcode'	});
+
+		// Set domid
+		this.set_id(this.id);
+
+		this.setDOMNode(this.div[0]);
+		this.createWidget();
+	},
+
+	createWidget: function ()
+	{
+		this.settings = {
+			output:this.options.format,
+			bgColor: this.options.bgColor,
+			color: this.options.barColor,
+			barWidth: this.options.barWidth,
+			barHeight: this.options.barHeight,
+		};
+		if (this.get_value()) this.div.barcode(this.get_value(), this.options.code_type, this.settings);
+	},
+
+	set_value: function (_val)
+	{
+		if (typeof _val !== 'undefined')
+		{
+			this.value = _val;
+			this.createWidget();
+		}
+	},
+
+	get_value: function()
+	{
+		return this.value;
+	}
+});
+et2_register_widget(et2_barcode, ["barcode"]);
+
+// Static part of the class
+jQuery.extend(et2_barcode,
+{
+	// Class Constants
+
+	/*
+	 * type const
+	 */
+	TYPE_CODEBAR: "codebar",
+	TYPE_CODE11: "code11", //(code 11)
+	TYPE_CODE39: "code39", //(code 39)
+	TYPE_CODE128: "code128", //(code 128)
+	TYPE_EAN8: "ean8", //(ean 8) - http://barcode-coder.com/en/ean-8-specification-101.html
+	TYPE_EAN13: "ean13", //(ean 13) - http://barcode-coder.com/en/ean-13-specification-102.html
+	TYPE_STD25: "std25", //(standard 2 of 5 - industrial 2 of 5) - http://barcode-coder.com/en/standard-2-of-5-specification-103.html
+	TYPE_INT25: "int25", //(interleaved 2 of 5)
+	TYPE_MSI: "msi",
+	TYPE_DATAMATRIX: "datamatrix", //(ASCII + extended) - http://barcode-coder.com/en/datamatrix-specification-104.html
+
+	/**
+	 * Formats consts
+	 */
+	FORMAT_CSS: "css",
+	FORMAT_SVG: "svg",
+	FORMAT_bmp: "bmp",
+	FORMAT_CANVAS: "canvas",
+});
\ No newline at end of file
diff --git a/etemplate/js/etemplate2.js b/etemplate/js/etemplate2.js
index d7832f4193..51c347bc72 100644
--- a/etemplate/js/etemplate2.js
+++ b/etemplate/js/etemplate2.js
@@ -53,6 +53,7 @@
 	et2_widget_ajaxSelect;
 	et2_widget_vfs;
 	et2_widget_video;
+	et2_widget_barcode;
 	et2_widget_itempicker;
 	et2_widget_script;