Convert et2_widget_html to TS

api/js/etemplate/et2_types.d.ts

@@ -191,3 +191,4 @@ declare function nm_open_popup(_action, _selected) : void;
 declare function nm_submit_popup(button) : void;
 declare function nm_hide_popup(element, div_id) : false;
 declare function nm_activate_link(_action, _senders) : void;
+declare function egw_seperateJavaScript(_html) : void;

api/js/etemplate/et2_widget_html.js

@@ -1,3 +1,4 @@
+"use strict";
 /**
  * EGroupware eTemplate2 - JS widget class containing raw HTML
  *
@@ -6,110 +7,110 @@
  * @subpackage api
  * @link http://www.egroupware.org
  * @author Andreas Stöckel
- * @copyright Stylite 2011
- * @version $Id$
  */
-
+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 __());
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
 /*egw:uses
-	jsapi.jsapi; // Needed for egw_seperateJavaScript
+    jsapi.jsapi; // Needed for egw_seperateJavaScript
-	/vendor/bower-asset/jquery/dist/jquery.js;
+    /vendor/bower-asset/jquery/dist/jquery.js;
-	et2_core_baseWidget;
+    et2_core_baseWidget;
 */
-
+var et2_core_valueWidget_1 = require("./et2_core_valueWidget");
+var et2_core_widget_1 = require("./et2_core_widget");
+var et2_core_inheritance_1 = require("./et2_core_inheritance");
 /**
  * @augments et2_valueWidget
  */
-var et2_html = (function(){ "use strict"; return et2_valueWidget.extend([et2_IDetachedDOM],
+var et2_html = /** @class */ (function (_super) {
-{
+    __extends(et2_html, _super);
-	attributes: {
+    /**
-		'label': {
+     * Constructor
-			'default': "",
+     *
-			description: "The label is displayed by default in front (for radiobuttons behind) each widget (if not empty). If you want to specify a different position, use a '%s' in the label, which gets replaced by the widget itself. Eg. '%s Name' to have the label Name behind a checkbox. The label can contain variables, as descript for name. If the label starts with a '@' it is replaced by the value of the content-array at this index (with the '@'-removed and after expanding the variables).",
+     * @memberOf et2_html
-			ignore: false,
+     */
-			name: "Label",
+    function et2_html(_parent, _attrs, _child) {
-			translate: true,
+        var _this = 
-			type: "string"
+        // Call the inherited constructor
-		},
+        _super.call(this, _parent, _attrs, et2_core_inheritance_1.ClassWithAttributes.extendAttributes(et2_html._attributes, _child || {})) || this;
-		"needed": {
+        _this.htmlNode = null;
-			"ignore": true
+        // Allow no child widgets
-		},
+        _this.supportedWidgetClasses = [];
-		value: {
+        _this.htmlNode = jQuery(document.createElement("span"));
-			name: "Value",
+        if (_this.getType() == 'htmlarea') {
-			description: "The value of the widget",
+            _this.htmlNode.addClass('et2_textbox_ro');
-			type: "html",	// "string" would remove html tags by running html_entity_decode
+        }
-			default: et2_no_init
+        if (_this.options.label) {
-		}
+            _this.htmlNode.append('<span class="et2_label">' + _this.options.label + '</span>');
-	},
+        }
-
+        _this.setDOMNode(_this.htmlNode[0]);
-	/**
+        return _this;
-	 * Constructor
+    }
-	 *
+    et2_html.prototype.loadContent = function (_data) {
-	 * @memberOf et2_html
+        // Create an object containg the given value and an empty js string
-	 */
+        var html = { html: _data ? _data : '', js: '' };
-	init: function() {
+        // Seperate the javascript from the given html. The js code will be
-		this._super.apply(this, arguments);
+        // written to the previously created empty js string
-
+        egw_seperateJavaScript(html);
-		// Allow no child widgets
+        // Append the html to the parent element
-		this.supportedWidgetClasses = [];
+        if (this.options.label) {
-
+            this.htmlNode.append('<span class="et2_label">' + this.options.label + '</span>');
-		this.htmlNode = jQuery(document.createElement("span"));
+        }
-		if(this._type == 'htmlarea')
+        this.htmlNode.append(html.html);
-		{
+        this.htmlNode.append(html.js);
-			this.htmlNode.addClass('et2_textbox_ro');
+    };
-		}
+    et2_html.prototype.set_value = function (_value) {
-		if(this.options.label)
+        this.htmlNode.empty();
-		{
+        this.loadContent(_value);
-			this.htmlNode.append('<span class="et2_label">'+this.options.label+'</span>');
+    };
-		}
+    /**
-		this.setDOMNode(this.htmlNode[0]);
+     * Code for implementing et2_IDetachedDOM
-	},
+     *
-
+     * @param {array} _attrs
-	loadContent: function(_data) {
+     */
-		// Create an object containg the given value and an empty js string
+    et2_html.prototype.getDetachedAttributes = function (_attrs) {
-		var html = {html: _data ? _data : '', js: ''};
+        _attrs.push("value", "class");
-
+    };
-		// Seperate the javascript from the given html. The js code will be
+    et2_html.prototype.getDetachedNodes = function () {
-		// written to the previously created empty js string
+        return [this.htmlNode[0]];
-		egw_seperateJavaScript(html);
+    };
-
+    et2_html.prototype.setDetachedAttributes = function (_nodes, _values) {
-		// Append the html to the parent element
+        this.htmlNode = jQuery(_nodes[0]);
-		if(this.options.label)
+        if (typeof _values['value'] !== 'undefined') {
-		{
+            this.set_value(_values['value']);
-			this.htmlNode.append('<span class="et2_label">'+this.options.label+'</span>');
+        }
-		}
+    };
-		this.htmlNode.append(html.html);
+    et2_html._attributes = {
-		this.htmlNode.append(html.js);
+        'label': {
-	},
+            'default': "",
-
+            description: "The label is displayed by default in front (for radiobuttons behind) each widget (if not empty). If you want to specify a different position, use a '%s' in the label, which gets replaced by the widget itself. Eg. '%s Name' to have the label Name behind a checkbox. The label can contain variables, as descript for name. If the label starts with a '@' it is replaced by the value of the content-array at this index (with the '@'-removed and after expanding the variables).",
-	set_value: function(_value) {
+            ignore: false,
-		this.htmlNode.empty();
+            name: "Label",
-		this.loadContent(_value);
+            translate: true,
-	},
+            type: "string"
-
+        },
-	/**
+        "needed": {
-	 * Code for implementing et2_IDetachedDOM
+            "ignore": true
-	 *
+        },
-	 * @param {array} _attrs
+        value: {
-	 */
+            name: "Value",
-	getDetachedAttributes: function(_attrs)
+            description: "The value of the widget",
-	{
+            type: "html",
-		_attrs.push("value", "class");
+            default: et2_no_init
-	},
+        }
-
+    };
-	getDetachedNodes: function()
+    return et2_html;
-	{
+}(et2_core_valueWidget_1.et2_valueWidget));
-		return [this.htmlNode[0]];
+et2_core_widget_1.et2_register_widget(et2_html, ["html", "htmlarea_ro"]);
-	},
+//# sourceMappingURL=et2_widget_html.js.map
-
-	setDetachedAttributes: function(_nodes, _values)
-	{
-		this.htmlNode = jQuery(_nodes[0]);
-		if(typeof _values['value'] !== 'undefined')
-		{
-			this.set_value(_values['value']);
-		}
-	}
-
-});}).call(this);
-et2_register_widget(et2_html, ["html","htmlarea_ro"]);
-

api/js/etemplate/et2_widget_html.ts

@@ -0,0 +1,124 @@
+/**
+ * EGroupware eTemplate2 - JS widget class containing raw HTML
+ *
+ * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
+ * @package etemplate
+ * @subpackage api
+ * @link http://www.egroupware.org
+ * @author Andreas Stöckel
+ */
+
+/*egw:uses
+	jsapi.jsapi; // Needed for egw_seperateJavaScript
+	/vendor/bower-asset/jquery/dist/jquery.js;
+	et2_core_baseWidget;
+*/
+
+import {et2_valueWidget} from "./et2_core_valueWidget";
+import {WidgetConfig, et2_register_widget} from "./et2_core_widget";
+import {ClassWithAttributes} from "./et2_core_inheritance";
+
+/**
+ * @augments et2_valueWidget
+ */
+class et2_html extends et2_valueWidget implements et2_IDetachedDOM
+{
+	static readonly _attributes : any = {
+		'label': {
+			'default': "",
+			description: "The label is displayed by default in front (for radiobuttons behind) each widget (if not empty). If you want to specify a different position, use a '%s' in the label, which gets replaced by the widget itself. Eg. '%s Name' to have the label Name behind a checkbox. The label can contain variables, as descript for name. If the label starts with a '@' it is replaced by the value of the content-array at this index (with the '@'-removed and after expanding the variables).",
+			ignore: false,
+			name: "Label",
+			translate: true,
+			type: "string"
+		},
+		"needed": {
+			"ignore": true
+		},
+		value: {
+			name: "Value",
+			description: "The value of the widget",
+			type: "html",	// "string" would remove html tags by running html_entity_decode
+			default: et2_no_init
+		}
+	};
+
+	htmlNode : JQuery = null;
+
+	/**
+	 * Constructor
+	 *
+	 * @memberOf et2_html
+	 */
+	constructor(_parent, _attrs? : WidgetConfig, _child? : object)
+	{
+		// Call the inherited constructor
+		super(_parent, _attrs, ClassWithAttributes.extendAttributes(et2_html._attributes, _child || {}));
+
+		// Allow no child widgets
+		this.supportedWidgetClasses = [];
+
+		this.htmlNode = jQuery(document.createElement("span"));
+		if(this.getType() == 'htmlarea')
+		{
+			this.htmlNode.addClass('et2_textbox_ro');
+		}
+		if(this.options.label)
+		{
+			this.htmlNode.append('<span class="et2_label">'+this.options.label+'</span>');
+		}
+		this.setDOMNode(this.htmlNode[0]);
+	}
+
+	loadContent(_data)
+	{
+		// Create an object containg the given value and an empty js string
+		let html = {html: _data ? _data : '', js: ''};
+
+		// Seperate the javascript from the given html. The js code will be
+		// written to the previously created empty js string
+		egw_seperateJavaScript(html);
+
+		// Append the html to the parent element
+		if(this.options.label)
+		{
+			this.htmlNode.append('<span class="et2_label">'+this.options.label+'</span>');
+		}
+		this.htmlNode.append(html.html);
+		this.htmlNode.append(html.js);
+	}
+
+	set_value(_value)
+	{
+		this.htmlNode.empty();
+		this.loadContent(_value);
+	}
+
+	/**
+	 * Code for implementing et2_IDetachedDOM
+	 *
+	 * @param {array} _attrs
+	 */
+	getDetachedAttributes(_attrs)
+	{
+		_attrs.push("value", "class");
+	}
+
+	getDetachedNodes()
+	{
+		return [this.htmlNode[0]];
+	}
+
+	setDetachedAttributes(_nodes, _values)
+	{
+		this.htmlNode = jQuery(_nodes[0]);
+		if(typeof _values['value'] !== 'undefined')
+		{
+			this.set_value(_values['value']);
+		}
+	}
+
+}
+et2_register_widget(et2_html, ["html","htmlarea_ro"]);
+
+