One month ago ted put up a patch to fix bug 445560 to implement expand/collapse functionality for merge changesets for the pushlog. The patch works properly except for one issue. When a user clicks on a particular [Expand] link it should only expand the changesets belonging to it and not all merge changesets on the page. Right now all merge changesets are expanding. For example the following are 2 merge changesets that have [Expand] links:

With ted’s patch when the user clicks on the first Expand link the following happens:

Both merge changesets expand when only the first one should.

The Fix

jQuery is used to implement this expand/collapse feature which allows us to perform hide() and toggle() to hide and show the appropriate merge changesets. Each row which should be hidden is given the class name “hidden” which then allows one to go $(’.hidden’).hide() and $(’.hidden’).toggle(). But the problem is that all rows have the same class name so no matter which Expand link one clicks ALL rows with the class name “hidden” will get toggled.

Somehow each set of merge changesets have to be given their own unique identifier. In this case I decided to use the date, which is common for a set of changesets that are grouped together. To do this I made some back-end changes to changelist() in the pushlog-feed.py file. Now, it also returns a dateId:

def changelist(limit=0, **map):
        #pdb.set_trace()
        allentries = []
        lastid = None
        ch = None
        l = []
        mergehidden = ""
        p = 0
        currentpush = None
        for id, user, date, node in entries:
            ctx = web.repo.changectx(node)
            n = ctx.node()
            entry = {"author": ctx.user(),
                     "desc": ctx.description(),
                     "files": web.listfilediffs(tmpl, ctx.files(), n),
                     "rev": ctx.rev(),
                     "node": hex(n),
                     "tags": nodetagsdict(web.repo, n),
                     "branches": nodebranchdict(web.repo, ctx),
                     "inbranch": nodeinbranch(web.repo, ctx),
                     "hidden": "",
                     "push": [],
                     "mergerollup": [],
                     "dateId": localdate(date)
                     }

I then passed this dateId to the map file to make it the id of each hidden row and the row which holds the expand link:

pushlogentry = '<tr id="date#dateId#" class="parity#parity# #hidden# #dateId#">

mergehidden = '<br/>← #count# hidden changesets <a id="hidedate#dateId#" class="expand" href="#">[Expand]</a>'

Now each grouped set of hidden rows has a unique id, which will allow me to hide the right set of changesets according to which Expand link the user clicks. To do this I changed some code in the pushlog.tmpl file:

1
2
3
4
5
6
7
8
9
10
11
12
13

// hide things that should be hidden
  $('.hidden').hide();
  // add click handler to unhide hidden things
  $('.expand').click(function (idDate) {
    if ($(this).text() == "[Expand]")
      $(this).text("[Collapse]");
    else
      $(this).text("[Expand]");
    //XXX: don't toggle all hidden, just the ones following this row
    var id = $(this).attr("id");
    id = '#' + id.substring(4, id.length);
    $(id).nextAll(id).toggle();
    return false;

I replaced the line $(’.hidden’).toggle() with lines 10-12. Basically:

1. I get the id of the Expand row that the user clicked.
2. Then, I manipulate the string to get the id of the hidden rows
3. Lastly, I toggle the id of the hidden rows

The above code gives the appropriate result when the first expand link is clicked: