From cb27424f5bfa2e335dc88c339d5246b89a96f87e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andreas=20St=C3=B6ckel?= <andreas.stoeckel@googlemail.com>
Date: Tue, 23 Aug 2011 09:45:45 +0000
Subject: [PATCH] Added et2_createWidget function and got et2_selectbox_ro
 working correctly with predefined options and non-string option-entries.

---
 etemplate/js/et2_selectbox.js                 | 42 ++++++++++++++---
 etemplate/js/et2_widget.js                    | 47 +++++++++++++++++++
 .../js/test/et2_test_timesheet_edit.json      |  2 +-
 etemplate/js/test/test.css                    |  8 ++++
 4 files changed, 92 insertions(+), 7 deletions(-)

diff --git a/etemplate/js/et2_selectbox.js b/etemplate/js/et2_selectbox.js
index 492b5b3636..8d5138132e 100644
--- a/etemplate/js/et2_selectbox.js
+++ b/etemplate/js/et2_selectbox.js
@@ -16,6 +16,7 @@
 /*egw:uses
 	lib/tooltip;
 	jquery.jquery;
+	et2_xml;
 	et2_DOMWidget;
 	et2_inputWidget;
 */
@@ -71,7 +72,10 @@ var et2_selectbox = et2_inputWidget.extend({
 
 		this.input = null;
 	},
+
 	transformAttributes: function(_attrs) {
+		this._super.apply(this, arguments);
+
 		// Try to find the options inside the "sel-options" array
 		_attrs["select_options"] = this.getArrayMgr("sel_options").getValueForID(this.id);
 
@@ -144,10 +148,8 @@ var et2_selectbox = et2_inputWidget.extend({
 				attrs["label"] = _options[key]
 			}
 
-			// Add all other important options to the attributes
-			et2_option.prototype.generateAttributeSet(attrs);
-
-			new et2_option(root, attrs);
+			// Create the widget and add it as a child
+			this.addChild(et2_createWidget("option", attrs));
 		}
 	}
 });
@@ -167,6 +169,7 @@ var et2_selectbox_ro = et2_selectbox.extend({
 		this._super.apply(this, arguments);
 
 		this.supportedWidgetClasses = [];
+		this.optionValues = {};
 	},
 
 	createInputWidget: function() {
@@ -176,13 +179,40 @@ var et2_selectbox_ro = et2_selectbox.extend({
 
 		this.setDOMNode(this.span[0]);
 	},
+
+	loadFromXML: function(_node) {
+		// Read the option-tags
+		var options = et2_directChildrenByTagName(_node, "options");
+		for (var i = 0; i < options.length; i++)
+		{
+			this.optionValues[et2_readAttrWithDefault(options[i], "value", 0)] =
+				{
+					"label": options[i].textContent,
+					"title": et2_readAttrWithDefault(options[i], "title", "")
+				}
+		}
+	},
+
 	set_select_options: function(_options) {
-		this.select_options = _options;
+		for (var key in _options)
+		{
+			this.optionValues[key] = _options[key];
+		}
 	},
 
 	set_value: function(_value) {
 		this.value = _value;
-		this.span.text(this.select_options[_value]);
+
+		var option = this.optionValues[_value];
+		if (option instanceof Object)
+		{
+			this.span.text(option.label);
+			this.set_statustext(option.title);
+		}
+		else
+		{
+			this.span.text(option);
+		}
 	}
 });
 
diff --git a/etemplate/js/et2_widget.js b/etemplate/js/et2_widget.js
index ac3f982f47..b4a71aed32 100644
--- a/etemplate/js/et2_widget.js
+++ b/etemplate/js/et2_widget.js
@@ -48,6 +48,53 @@ function et2_register_widget(_constructor, _types)
 	}
 }
 
+/**
+ * Creates a widget registered for the given tag-name. If "readonly" is listed
+ * inside the attributes, et2_createWidget will try to use the "_ro" type of the
+ * widget.
+ *
+ * @param _name is the name of the widget with which it is registered. If the
+ * 	widget is not found, an et2_placeholder will be created.
+ * @param _attrs is an associative array with attributes. If not passed, it will
+ * 	default to true.
+ * @param _parent is the parent to which the element will be attached. If _parent
+ * 	is not passed, it will default to null. Then you have to attach the element
+ * 	to a parent using the addChild or insertChild method.
+ */
+function et2_createWidget(_name, _attrs, _parent)
+{
+	if (typeof _attrs == "undefined")
+	{
+		_attrs = {};
+	}
+
+	if (typeof _parent == "undefined")
+	{
+		_parent = null;
+	}
+
+	// Parse the "readonly" and "type" flag for this element here, as they
+	// determine which constructor is used
+	var nodeName = _attrs["type"] = _name;
+	var readonly = _attrs["readonly"] = 
+		typeof _attrs["readonly"] == "undefined" ? false : _attrs["readonly"];
+
+	// Get the constructor - if the widget is readonly, use the special "_ro"
+	// constructor if it is available
+	var constructor = typeof et2_registry[nodeName] == "undefined" ?
+		et2_placeholder : et2_registry[nodeName];
+	if (readonly && typeof et2_registry[nodeName + "_ro"] != "undefined")
+	{
+		constructor = et2_registry[nodeName + "_ro"];
+	}
+
+	// Do an sanity check for the attributes
+	constructor.prototype.generateAttributeSet(_attrs);
+
+	// Create the new widget and return it
+	return new constructor(_parent, _attrs);
+}
+
 /**
  * The et2 widget base class.
  */
diff --git a/etemplate/js/test/et2_test_timesheet_edit.json b/etemplate/js/test/et2_test_timesheet_edit.json
index 9565db83e6..c19ea96e45 100644
--- a/etemplate/js/test/et2_test_timesheet_edit.json
+++ b/etemplate/js/test/et2_test_timesheet_edit.json
@@ -9,7 +9,7 @@ var timesheet_data = {
         "ts_quantity":"2.5",
         "ts_unitprice":null,
         "cat_id":null,
-        "ts_owner":"5",
+        "ts_owner":"6",
         "ts_modified":1307039479,
         "ts_modifier":"5",
         "pl_id":null,
diff --git a/etemplate/js/test/test.css b/etemplate/js/test/test.css
index 5964621e97..3759df84b8 100644
--- a/etemplate/js/test/test.css
+++ b/etemplate/js/test/test.css
@@ -260,3 +260,11 @@ table.et2_grid {
 /*	border: 1px dashed silver;*/
 }
 
+/**
+ * Create some spacing for widgets inside labels
+ */
+label input, label span, label div, label select, label textarea {
+	margin-left: 1ex;
+	margin-right: 1ex;
+}
+