Changeset - 90282e663313
[Not reviewed]
default
0 2 0
domruf - 8 years ago 2017-07-03 21:45:37
dominikruf@gmail.com
changelog: avoid cutting off commit messages

Split commit message into 2 <div> elements: one with just the first line, and
one with the full message. This makes it easier to handle the toggling of
showing the whole commit message. This way, we no longer have to mess with the
line height, and we avoid problems with cutting off parts of the text below the
text baseline.

Also stop cutting off the first line if it is too long for the table column.

It adds a bit of overhead to store the first line twice, but having them
separate make things simpler and is worth it.

Patch modified by Mads Kiilerich.
2 files changed with 7 insertions and 4 deletions:
0 comments (0 inline, 0 general)
kallithea/public/css/style.css
Show inline comments
 
@@ -1465,100 +1465,99 @@ tr.out-of-range {
 

	
 
#graph_content tr .date {
 
    width: auto !important;
 
    color: #666;
 
    font-size: 10px;
 
    white-space: nowrap;
 
}
 

	
 
#graph_content_pr .compare_view_commits .expand_commit,
 
#graph_content tr .expand_commit {
 
    width: 24px;
 
    cursor: pointer;
 
    color: #999;
 
}
 

	
 
#graph_content tr .right {
 
    width: 120px;
 
    padding-right: 0px;
 
    overflow: visible;
 
    position: relative;
 
}
 

	
 
#graph_content tr .mid {
 
    width: 100%;
 
    padding: 0;
 
}
 

	
 
#graph_content .log-container {
 
    position: relative;
 
    margin-top: 8px;
 
}
 

	
 
#graph_content tr #singlerange,
 
#graph_content tr .changeset_range {
 
    float: left;
 
    margin: 2px 0;
 
}
 

	
 
#graph_content tr .author img {
 
    vertical-align: middle;
 
}
 

	
 
#graph_content tr .author .user {
 
    color: #444444;
 
}
 

	
 
#graph_content tr td.mid .message,
 
#graph_content_pr .compare_view_commits .message {
 
    white-space: pre-wrap;
 
    white-space: nowrap;
 
    padding: 0;
 
    overflow: hidden;
 
    height: 1.2em;
 
}
 

	
 
#graph_content_pr .compare_view_commits .message {
 
    padding: 0 !important;
 
}
 

	
 
#graph_content tr td.mid .message.expanded,
 
#graph_content_pr .compare_view_commits .message.expanded {
 
    height: auto;
 
    overflow: initial;
 
}
 

	
 
#graph_content tr .extra-container {
 
    display: block;
 
    position: absolute;
 
    top: -15px;
 
    right: 0;
 
    padding-left: 5px;
 
    background: #FFFFFF;
 
    height: 41px;
 
}
 

	
 
#pull_request_overview .comments-container,
 
#changeset_compare_view_content .comments-container,
 
#graph_content .comments-container,
 
#shortlog_data .comments-container,
 
#graph_content .logtags {
 
    display: block;
 
    float: left;
 
    overflow: hidden;
 
    padding: 0;
 
    margin: 0;
 
    white-space: nowrap;
 
}
 

	
 
#graph_content .comments-container {
 
    margin: 0.8em 0;
 
    margin-right: 0.5em;
 
}
 

	
 
#graph_content .tagcontainer {
 
    width: 80px;
 
    position: relative;
 
    float: right;
 
    height: 100%;
 
    top: 7px;
 
    margin-left: 0.5em;
 
}
kallithea/templates/changelog/changelog.html
Show inline comments
 
@@ -59,102 +59,106 @@ ${self.repo_context_bar('changelog', c.f
 
                               class="btn btn-default btn-sm"><i class="icon-git-compare"></i> ${_('Compare fork with parent repository (%s)' % c.db_repo.fork.repo_name)}</a>
 
                        %endif
 
                        ## text and href of open_new_pr is controlled from javascript
 
                        <a id="open_new_pr" class="btn btn-default btn-sm"></a>
 
                        ${_("Branch filter:")} ${h.select('branch_filter',c.branch_name,c.branch_filters)}
 
                    </div>
 
                </div>
 

	
 
                <div id="graph_nodes">
 
                    <canvas id="graph_canvas" style="width:0"></canvas>
 
                </div>
 
                <div id="graph_content" style="${'margin: 0px' if c.changelog_for_path else ''}">
 

	
 
                <table class="table" id="changesets">
 
                <tbody>
 
                %for cnt,cs in enumerate(c.pagination):
 
                    <tr id="chg_${cnt+1}" class="${'mergerow' if len(cs.parents) > 1 else ''}">
 
                        <td class="checkbox-column">
 
                            %if c.changelog_for_path:
 
                                ${h.checkbox(cs.raw_id,class_="changeset_range", disabled="disabled")}
 
                            %else:
 
                                ${h.checkbox(cs.raw_id,class_="changeset_range")}
 
                            %endif
 
                        </td>
 
                        <td class="status">
 
                          %if c.statuses.get(cs.raw_id):
 
                            %if c.statuses.get(cs.raw_id)[2]:
 
                              <a data-toggle="tooltip" title="${_('Changeset status: %s by %s\nClick to open associated pull request %s') % (c.statuses.get(cs.raw_id)[1], c.statuses.get(cs.raw_id)[5].username, c.statuses.get(cs.raw_id)[4])}" href="${h.url('pullrequest_show',repo_name=c.statuses.get(cs.raw_id)[3],pull_request_id=c.statuses.get(cs.raw_id)[2])}">
 
                                <i class="icon-circle changeset-status-${c.statuses.get(cs.raw_id)[0]}"></i>
 
                              </a>
 
                            %else:
 
                              <a data-toggle="tooltip" title="${_('Changeset status: %s by %s') % (c.statuses.get(cs.raw_id)[1], c.statuses.get(cs.raw_id)[5].username)}"
 
                                 href="${c.comments[cs.raw_id][0].url()}">
 
                                  <i class="icon-circle changeset-status-${c.statuses.get(cs.raw_id)[0]}"></i>
 
                              </a>
 
                            %endif
 
                          %endif
 
                        </td>
 
                        <td class="author" data-toggle="tooltip" title="${cs.author}">
 
                            ${h.gravatar(h.email_or_none(cs.author), size=16)}
 
                            <span class="user">${h.person(cs.author)}</span>
 
                        </td>
 
                        <td class="hash">
 
                            ${h.link_to(h.show_id(cs),h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id), class_='changeset_hash')}
 
                        </td>
 
                        <td class="date">
 
                            <div class="date" data-toggle="tooltip" title="${h.fmt_date(cs.date)}">${h.age(cs.date,True)}</div>
 
                        </td>
 
                        <% message_lines = cs.message.splitlines() %>
 
                        <td class="expand_commit" title="${_('Expand commit message')}">
 
                            <i class="icon-align-left"></i>
 
                        </td>
 
                        <td class="mid">
 
                            <div class="log-container">
 
                                <div class="message">${h.urlify_text(cs.message, c.repo_name,h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id))}</div>
 
                                <div class="message">
 
                                    <div class="message-firstline">${h.urlify_text(message_lines[0], c.repo_name,h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id))}</div>
 
                                    <div class="message-full hidden">${h.urlify_text(cs.message, c.repo_name)}</div>
 
                                </div>
 
                                <div class="extra-container">
 
                                    %if c.comments.get(cs.raw_id):
 
                                        <a class="comments-container comments-cnt" href="${c.comments[cs.raw_id][0].url()}" data-toggle="tooltip" title="${_('%s comments') % len(c.comments[cs.raw_id])}">
 
                                            ${len(c.comments[cs.raw_id])}
 
                                            <i class="icon-comment-discussion"></i>
 
                                        </a>
 
                                    %endif
 
                                    %if cs.bumped:
 
                                        <span class="bumpedtag" title="Bumped">
 
                                            Bumped
 
                                        </span>
 
                                    %endif
 
                                    %if cs.divergent:
 
                                        <span class="divergenttag" title="Divergent">
 
                                            Divergent
 
                                        </span>
 
                                    %endif
 
                                    %if cs.extinct:
 
                                        <span class="extincttag" title="Extinct">
 
                                            Extinct
 
                                        </span>
 
                                    %endif
 
                                    %if cs.unstable:
 
                                        <span class="unstabletag" title="Unstable">
 
                                            Unstable
 
                                        </span>
 
                                    %endif
 
                                    %if cs.phase:
 
                                        <span class="phasetag" title="Phase">
 
                                            ${cs.phase}
 
                                        </span>
 
                                    %endif
 
                                    %if h.is_hg(c.db_repo_scm_instance):
 
                                        %for book in cs.bookmarks:
 
                                            <span class="booktag" title="${_('Bookmark %s') % book}">
 
                                                ${h.link_to(book,h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id))}
 
                                            </span>
 
                                        %endfor
 
                                    %endif
 
                                    %for tag in cs.tags:
 
                                        <span class="tagtag" title="${_('Tag %s') % tag}">
 
                                            ${h.link_to(tag,h.url('changeset_home',repo_name=c.repo_name,revision=cs.raw_id))}
 
                                        </span>
 
                                    %endfor
 
                                    %if (not c.branch_name) and cs.branch:
 
                                        <span class="branchtag" title="${_('Branch %s' % cs.branch)}">
 
                                            ${h.link_to(cs.branch,h.url('changelog_home',repo_name=c.repo_name,branch=cs.branch))}
 
                                        </span>
 
@@ -241,85 +245,85 @@ ${self.repo_context_bar('changelog', c.f
 
                        }
 
                    } else {
 
                        $('#singlerange').hide().prop('checked', false);
 
                        $('#rev_range_clear').hide();
 
                        %if c.revision:
 
                            $('#open_new_pr').prop('href', pyroutes.url('pullrequest_home',
 
                                                                        {'repo_name': ${h.js(c.repo_name)},
 
                                                                         'rev_end':${h.js(c.first_revision.raw_id)}}));
 
                            $('#open_new_pr').html(_TM['Open New Pull Request from {0}'].format(${h.jshtml(c.revision)}));
 
                        %else:
 
                            $('#open_new_pr').prop('href', pyroutes.url('pullrequest_home',
 
                                                                        {'repo_name': ${h.js(c.repo_name)},
 
                                                                        'branch':${h.js(c.first_revision.branch)}}));
 
                            $('#open_new_pr').html(_TM['Open New Pull Request from {0}'].format(${h.jshtml(c.first_revision.branch)}));
 
                        %endif
 
                        $('#compare_fork').show();
 
                        $checkboxes.closest('tr').removeClass('out-of-range');
 
                    }
 
                };
 
                checkbox_checker();
 
                $checkboxes.click(function() {
 
                    checkbox_checker();
 
                    graph.render(jsdata);
 
                });
 
                $('#singlerange').click(checkbox_checker);
 

	
 
                $('#rev_range_clear').click(function(e){
 
                    $checkboxes.prop('checked', false);
 
                    checkbox_checker();
 
                    graph.render(jsdata);
 
                });
 

	
 
                var $msgs = $('.message');
 
                // get first element height
 
                var el = $('#graph_content tr')[0];
 
                var row_h = el.clientHeight;
 
                $msgs.each(function() {
 
                    var m = this;
 

	
 
                    var h = m.clientHeight;
 
                    if(h > row_h){
 
                        var offset = row_h - (h+12);
 
                        $(m.nextElementSibling).css('display', 'block');
 
                        $(m.nextElementSibling).css('margin-top', offset+'px');
 
                    }
 
                });
 

	
 
                $('.expand_commit').on('click',function(e){
 
                    $(this).next('.mid').find('.message').toggleClass('expanded');
 
                    $(this).next('.mid').find('.message > div').toggleClass('hidden');
 

	
 
                    //redraw the graph, r and jsdata are bound outside function
 
                    graph.render(jsdata);
 
                });
 

	
 
                // change branch filter
 
                $("#branch_filter").select2({
 
                    dropdownAutoWidth: true,
 
                    maxResults: 50,
 
                    sortResults: branchSort
 
                    });
 

	
 
                $("#branch_filter").change(function(e){
 
                    var selected_branch = e.currentTarget.options[e.currentTarget.selectedIndex].value;
 
                    if(selected_branch != ''){
 
                        window.location = pyroutes.url('changelog_home', {'repo_name': ${h.js(c.repo_name)},
 
                                                                          'branch': selected_branch});
 
                    }else{
 
                        window.location = pyroutes.url('changelog_home', {'repo_name': ${h.js(c.repo_name)}});
 
                    }
 
                    $("#changelog").hide();
 
                });
 

	
 
                graph.render(jsdata);
 
            });
 

	
 
            $(window).resize(function(){
 
                graph.render(jsdata);
 
            });
 
        </script>
 
        %else:
 
            ${_('There are no changes yet')}
 
        %endif
 
    </div>
 
</div>
 
</%def>
0 comments (0 inline, 0 general)