working progress widget, thought infolog uses a button with an image, which is a progressbar ...

This commit is contained in:
Ralf Becker 2011-09-09 12:17:16 +00:00
parent 3ec9de5a30
commit e4b8dfd9f5
2 changed files with 28 additions and 26 deletions

View File

@ -14,14 +14,14 @@
/*egw:uses /*egw:uses
jquery.jquery; jquery.jquery;
et2_core_interfaces; et2_core_interfaces;
et2_core_baseWidget; et2_core_valueWidget;
*/ */
/** /**
* Class which implements the "image" XET-Tag * Class which implements the "image" XET-Tag
*/ */
var et2_progress = et2_baseWidget.extend(/*et2_IDetachedDOM,*/ { var et2_progress = et2_valueWidget.extend(et2_IDetachedDOM,
{
attributes: { attributes: {
"href": { "href": {
"name": "Link Target", "name": "Link Target",
@ -48,50 +48,53 @@ var et2_progress = et2_baseWidget.extend(/*et2_IDetachedDOM,*/ {
{ {
this._super.apply(this, arguments); this._super.apply(this, arguments);
var outer = $j(document.createElement("div")).addClass("et2_progress"); var outer = document.createElement("div");
this.node = $j(document.createElement("div")).width(0).appendTo(outer); outer.className = "et2_progress";
this.progress = document.createElement("div");
this.progress.style.width = "0";
outer.appendChild(this.progress);
if (this.options.href) if (this.options.href)
{ {
outer.addClass('et2_clickable'); outer.className += ' et2_clickable';
} }
if(this.options["class"]) if(this.options["class"])
{ {
outer.addClass(this.options["class"]); outer.className += ' '+this.options["class"];
} }
this.setDOMNode(outer[0]); this.setDOMNode(outer); // set's this.node = outer
// gives error "this.node has no method width"
// this.set_value(50);
}, },
click: function() click: function()
{ {
this._super.apply(this, arguments);
if(this.options.href) if(this.options.href)
{ {
egw.call_link(this.options.href, this.options.extra_link_target, this.options.extra_link_popup); egw.call_link(this.options.href, this.options.extra_link_target, this.options.extra_link_popup);
} }
}, },
// tried set_value and setValue, both get never called :-( // setting the value as width of the progress-bar
set_value: function(_value) set_value: function(_value)
{ {
if (_value != "") _value = parseInt(_value)+"%"; // make sure we have percent attached _value = parseInt(_value)+"%"; // make sure we have percent attached
this.node.width(_value); this.progress.style.width = _value;
if (!this.options.label) this.set_label(_value); if (!this.options.label) this.set_label(_value);
}, },
// set's label as title of this.node // set's label as title of this.node
set_label: function(_value) set_label: function(_value)
{ {
this.node.attr("title", _value); this.node.title = _value;
} },
/** /**
* Implementation of "et2_IDetachedDOM" for fast viewing in gridview * Implementation of "et2_IDetachedDOM" for fast viewing in gridview
*/ */
/*
getDetachedAttributes: function(_attrs) { getDetachedAttributes: function(_attrs) {
_attrs.push("src", "label"); _attrs.push("value", "label");
}, },
getDetachedNodes: function() { getDetachedNodes: function() {
@ -100,21 +103,20 @@ var et2_progress = et2_baseWidget.extend(/*et2_IDetachedDOM,*/ {
setDetachedAttributes: function(_nodes, _values) { setDetachedAttributes: function(_nodes, _values) {
// Set the given DOM-Nodes // Set the given DOM-Nodes
this.node = $j(_nodes[0]); this.node = _nodes[0];
this.transformAttributes(_values); this.transformAttributes(_values);
// Set the attributes // Set the attributes
if (_values["src"])
{
this.set_value(_values["value"]);
}
if (_values["label"]) if (_values["label"])
{ {
this.set_label(_values["label"]); this.set_label(_values["label"]);
} }
}*/ if (_values["value"])
{
this.set_value(_values["value"]);
}
}
}); });
et2_register_widget(et2_progress, ["progress"]); et2_register_widget(et2_progress, ["progress"]);

View File

@ -66,7 +66,7 @@
<hbox align="center" options="5"> <hbox align="center" options="5">
<image label="$row_cont[info_type]" src="${row}[info_type]"/> <image label="$row_cont[info_type]" src="${row}[info_type]"/>
<button statustext="Change the status of an entry, eg. close it" label="$row_cont[info_status_label]" id="edit_status[$row_cont[info_id]]" onclick="window.open(egw::link('/index.php','menuaction=infolog.infolog_ui.edit&amp;info_id=$row_cont[info_id]'),'_blank','dependent=yes,width=750,height=600,scrollbars=yes,status=yes'); return false;" image="$row_cont[info_status_label]" ro_image="$row_cont[info_status_label]"/> <button statustext="Change the status of an entry, eg. close it" label="$row_cont[info_status_label]" id="edit_status[$row_cont[info_id]]" onclick="window.open(egw::link('/index.php','menuaction=infolog.infolog_ui.edit&amp;info_id=$row_cont[info_id]'),'_blank','dependent=yes,width=750,height=600,scrollbars=yes,status=yes'); return false;" image="$row_cont[info_status_label]" ro_image="$row_cont[info_status_label]"/>
<button statustext="Change the status of an entry, eg. close it" label="$row_cont[info_percent]" id="edit_percent[$row_cont[info_id]]" onclick="window.open(egw::link('/index.php','menuaction=infolog.infolog_ui.edit&amp;info_id=$row_cont[info_id]'),'_blank','dependent=yes,width=750,height=600,scrollbars=yes,status=yes'); return false;" image="$row_cont[info_percent]"/> <progress statustext="Change the status of an entry, eg. close it" id="${row}[info_percent]" onclick="window.open(egw::link('/index.php','menuaction=infolog.infolog_ui.edit&amp;info_id=$row_cont[info_id]'),'_blank','dependent=yes,width=750,height=600,scrollbars=yes,status=yes'); return false;"/>
<image label="$row_cont[info_percent2]" src="{$row}[info_percent2]" onclick="window.open(egw::link('/index.php','menuaction=infolog.infolog_ui.edit&amp;info_id=$row_cont[info_id]'),'_blank','dependent=yes,width=750,height=600,scrollbars=yes,status=yes'); return false;"/> <image label="$row_cont[info_percent2]" src="{$row}[info_percent2]" onclick="window.open(egw::link('/index.php','menuaction=infolog.infolog_ui.edit&amp;info_id=$row_cont[info_id]'),'_blank','dependent=yes,width=750,height=600,scrollbars=yes,status=yes'); return false;"/>
</hbox> </hbox>
<vbox options="0,0" class="fullWidth"> <vbox options="0,0" class="fullWidth">