Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
[FIXED JENKINS-13289] "Advanced" button can collapse its body
- Advanced body is now placed inside the same tbody, there is no need to handle nameref any more.
- A lot of people miss advanced buttons. It's better to change color.
  • Loading branch information
ohtake committed Mar 30, 2012
1 parent de7ba25 commit 2e1a0f6
Show file tree
Hide file tree
Showing 3 changed files with 39 additions and 39 deletions.
Expand Up @@ -25,7 +25,7 @@ package jenkins.security.ApiTokenProperty;

f=namespace(lib.FormTagLib)

f.advanced(title:_("Show API Token"), align:"left") {
f.advanced(title:_("Show API Token"), titleHide:_("Hide API Token"), align:"left") {
f.entry(title:_("API Token"), field:"apiToken") {
f.readOnlyTextbox(id:"apiToken") // TODO: need to figure out the way to do this without using ID.
}
Expand Down
15 changes: 9 additions & 6 deletions core/src/main/resources/lib/form/advanced.jelly
Expand Up @@ -30,7 +30,10 @@ THE SOFTWARE.
appears.

<st:attribute name="title" use="optional">
Caption of the button. By default "Advanced"
Caption of the button when advanced block is hidden. By default "Advanced"
</st:attribute>
<st:attribute name="titleHide" use="optional">
Caption of the button when advanced block is visible. By default "Hide Advanced"
</st:attribute>
<st:attribute name="style" use="optional">
Additional styles
Expand All @@ -43,12 +46,12 @@ THE SOFTWARE.
<tr><td/><td/>
<td>
<div class="advancedLink" style="${attrs.align!=null?('text-align:'+attrs.align):''}">
<input type="button" value="${attrs.title?:'%Advanced'}..." class="advancedButton" />
<input type="button" value="${attrs.title?:'%Advanced'}..." class="advancedButton btn btn-info" data-textToggled="${attrs.titleHide?:'%Hide Advanced'}" />
</div>
<table class="advancedBody"><tbody>
<!-- this is the hidden portion that hosts the "advanced" part. Contents will be moved to the master table when "advanced..." is clicked -->
<d:invokeBody/>
</tbody></table>
</td>
</tr>
<tr class="advancedBody-start rowvg-start"><td/><td/><td/></tr>
<!-- this is the hidden portion that hosts the "advanced" part. Contents will be moved to the master table when "advanced..." is clicked -->
<d:invokeBody/>
<tr class="advancedBody-end rowvg-end"><td/><td/><td/></tr>
</j:jelly>
61 changes: 29 additions & 32 deletions war/src/main/webapp/scripts/hudson-behavior.js
Expand Up @@ -646,31 +646,6 @@ var jenkinsRules = {
});
},

"INPUT.advancedButton" : function(e) {
makeButton(e,function(e) {
var link = e.target;
while(!Element.hasClassName(link,"advancedLink"))
link = link.parentNode;
link.style.display = "none"; // hide the button

var container = $(link).next().down(); // TABLE -> TBODY

var tr = link;
while (tr.tagName != "TR")
tr = tr.parentNode;

// move the contents of the advanced portion into the main table
var nameRef = tr.getAttribute("nameref");
while (container.lastChild != null) {
var row = container.lastChild;
if(nameRef!=null && row.getAttribute("nameref")==null)
row.setAttribute("nameref",nameRef); // to handle inner rowSets, don't override existing values
tr.parentNode.insertBefore(row, $(tr).next() || null);
}
});
e = null; // avoid memory leak
},

"INPUT.expandButton" : function(e) {
makeButton(e,function(e) {
var link = e.target;
Expand Down Expand Up @@ -1096,7 +1071,7 @@ var jenkinsRules = {
* Considers the visibility of the row group from the point of view of outside.
* If you think of a row group like a logical DOM node, this is akin to its .style.display.
*/
makeOuterVisisble : function(b) {
makeOuterVisible : function(b) {
this.outerVisible = b;
this.updateVisibility();
},
Expand All @@ -1107,10 +1082,13 @@ var jenkinsRules = {
*
* If you think of a row group like a logical DOM node, this is akin to its children's .style.display.
*/
makeInnerVisisble : function(b) {
makeInnerVisible : function(b) {
this.innerVisible = b;
this.updateVisibility();
},
toggleInnerVisible : function() {
this.makeInnerVisible(!this.innerVisible);
},

/**
* Based on innerVisible and outerVisible, update the relevant rows' actual CSS display attribute.
Expand All @@ -1119,7 +1097,7 @@ var jenkinsRules = {
var display = (this.outerVisible && this.innerVisible) ? "" : "none";
for (var e=this.start; e!=this.end; e=$(e).next()) {
if (e.rowVisibilityGroup && e!=this.start) {
e.rowVisibilityGroup.makeOuterVisisble(this.innerVisible);
e.rowVisibilityGroup.makeOuterVisible(this.innerVisible);
e = e.rowVisibilityGroup.end; // the above call updates visibility up to e.rowVisibilityGroup.end inclusive
} else {
e.style.display = display;
Expand Down Expand Up @@ -1167,6 +1145,23 @@ var jenkinsRules = {
applyNameRef(start,end,ref);
},

"INPUT.advancedButton" : function(e) {
var findAdvancedBodyStart = function(el) {
var tr = findAncestor(el, "TR");
return $(tr).next();
};
Event.observe(e, "click", function(ev) {
var button = ev.target;
var start = findAdvancedBodyStart(button);
start.rowVisibilityGroup.toggleInnerVisible(!start.rowVisibilityGroup.innerVisible);
var text = button.value;
button.value = button.getAttribute("data-textToggled");
button.setAttribute("data-textToggled",text);
});
findAdvancedBodyStart(e).rowVisibilityGroup.makeInnerVisible(false); // advanced block should be hidden at first
e = null; // avoid memory leak
},

"TR.optional-block-start ": function(e) { // see optionalBlock.jelly
// this is suffixed by a pointless string so that two processing for optional-block-start
// can sandwitch row-set-end
Expand Down Expand Up @@ -1259,7 +1254,7 @@ var jenkinsRules = {
var f = $(subForms[i]);

if (show) renderOnDemand(f.next());
f.rowVisibilityGroup.makeInnerVisisble(show);
f.rowVisibilityGroup.makeInnerVisible(show);

// TODO: this is actually incorrect in the general case if nested vg uses field-disabled
// so far dropdownList doesn't create such a situation.
Expand Down Expand Up @@ -1566,14 +1561,16 @@ function updateOptionalBlock(c,scroll) {

var checked = xor(c.checked,Element.hasClassName(c,"negative"));

vg.rowVisibilityGroup.makeInnerVisisble(checked);
vg.rowVisibilityGroup.makeInnerVisible(checked);

if(checked && scroll) {
var D = YAHOO.util.Dom;

var r = D.getRegion(s);
r = r.union(D.getRegion(vg.rowVisibilityGroup.end));
scrollIntoView(r);
if(r) { // if element is display:none, Dom.getRegion returns false
r = r.union(D.getRegion(vg.rowVisibilityGroup.end));
scrollIntoView(r);
}
}

if (c.name == 'hudson-tools-InstallSourceProperty') {
Expand Down

0 comments on commit 2e1a0f6

Please sign in to comment.