Get images working in buttons, sort of

-- Don't know what's happening with events in the grid.  Something happens if you double click, but it's not the button's click method.

etemplate/js/et2_dataview_view_rowProvider.js

@@ -230,6 +230,10 @@ var et2_dataview_rowProvider = Class.extend({
 	},
 
 	_nodeIndex: function(_node) {
+		if(_node.parentNode == null) 
+		{
+			return 0;
+		}
 		for (var i = 0; i < _node.parentNode.childNodes.length; i++)
 		{
 			if (_node.parentNode.childNodes[i] == _node)
@@ -402,7 +406,7 @@ var et2_dataview_rowProvider = Class.extend({
 			}
 
 			// Adjust data for that row
-			entry.widget.transformAttributes(data);
+			entry.widget.transformAttributes.call(entry.widget,data);
 
 			// Call the setDetachedAttributes function
 			entry.widget.setDetachedAttributes(nodes, data);

etemplate/js/et2_widget_button.js

@@ -21,7 +21,7 @@
 /**
  * Class which implements the "button" XET-Tag
  */ 
-var et2_button = et2_baseWidget.extend(et2_IInput, {
+var et2_button = et2_baseWidget.extend([et2_IInput, et2_IDetachedDOM], {
 
 	attributes: {
 		"label": {
@@ -30,7 +30,11 @@ var et2_button = et2_baseWidget.extend(et2_IInput, {
 			"description": "Label of the button",
 			"translate": true
 		},
-
+		"image": { 
+			"name": "Icon",
+			"type": "string",
+			"description": "Use an icon instead of label (when available)"
+		},
 		"onclick": {
 			"name": "onclick",
 			"type": "js",
@@ -49,11 +53,36 @@ var et2_button = et2_baseWidget.extend(et2_IInput, {
 		{
 			this.btn = $j(document.createElement("button"))
 				.addClass("et2_button");
-
 			this.setDOMNode(this.btn[0]);
 		}
 	},
 
+	set_image: function(_image) {
+		if(!this.isInTree()) return;
+		this.options.image = _image;
+
+		var found_image = false;
+		if(this.options.image != "") 
+		{
+			if(!this.image)
+			{
+				this.image = et2_createWidget("image",{label: this.options.label});
+			}
+			found_image = this.image.set_src(this.options.image);
+			jQuery(this.image.getDOMNode()).appendTo(this.btn);
+		}
+		if(found_image)
+		{
+			// No label if there's an image
+			this.options.label = "";
+		}
+	},
+
+	getDOMNode: function() {
+		return this.btn[0];
+	},
+
+	// TODO: What's going on here?  It doesn't get called, but something happens if you double click.
 	click: function() {
 		// Execute the JS code connected to the event handler
 		if (this.options.onclick)
@@ -104,8 +133,39 @@ var et2_button = et2_baseWidget.extend(et2_IInput, {
 		// If "null" is returned, the result is not added to the submitted
 		// array.
 		return null;
-	}
+	},
 
+	/**
+	 * et2_IDetachedDOM
+	 */
+	getDetachedAttributes: function(_attrs)
+	{
+		_attrs.push("value", "class", "image");
+	},
+
+	getDetachedNodes: function()
+	{
+		return [this.getDOMNode(),this.image];
+	},
+
+	setDetachedAttributes: function(_nodes, _values)
+	{
+		this.btn = _nodes[0];
+		this.image = _nodes[1];
+
+		if (typeof _values["id"] != "undefined")
+		{
+			this.set_id(_values["id"]);
+		}
+		if (typeof _values["value"] != "undefined")
+		{
+		}
+
+		if (typeof _values["class"] != "undefined")
+		{
+			this.set_class(_values["class"]);
+		}
+	}
 });
 
 et2_register_widget(et2_button, ["button", "buttononly"]);

etemplate/js/et2_widget_image.js

@@ -129,15 +129,18 @@ var et2_image = et2_baseWidget.extend(et2_IDetachedDOM, {
 		if(src)
 		{
 			this.image.attr("src", src).show();
+			return true;
 		}
 		// allow url's too
 		else if (_value[0] == '/' || _value.substr(0,4) == 'http')
 		{
 			this.image.attr('src', _value).show();
+			return true;
 		}
 		else
 		{
 			this.image.css("display","none");
+			return false;
 		}
 	},