Changeset - 5153c491a964
[Not reviewed]
default
0 2 0
Mads Kiilerich - 11 years ago 2015-05-07 16:26:40
madski@unity3d.com
comments: show status changes as a part of the comment instead of in the header

This makes it obvious what the user said and there is no reason to explain what
he is saying or where he is saying it.

Comments will always have a text or a status change - there is no need for "No
comments".
2 files changed with 21 insertions and 38 deletions:
0 comments (0 inline, 0 general)
kallithea/public/css/style.css
Show inline comments
 
@@ -4026,385 +4026,385 @@ div#legend_choices table td {
 
    height: 20px !important;
 
    padding: 0 !important;
 
}
 

	
 
.q_filter_box {
 
    -webkit-box-shadow: rgba(0,0,0,0.07) 0 1px 2px inset;
 
    -webkit-border-radius: 4px;
 
    border-radius: 4px;
 
    border: 0 none;
 
    margin-bottom: -4px;
 
    margin-top: -4px;
 
    padding-left: 3px;
 
}
 

	
 
#node_filter {
 
    border: 0px solid #545454;
 
    color: #AAAAAA;
 
    padding-left: 3px;
 
}
 

	
 

	
 
.group_members_wrap {
 
    min-height: 85px;
 
    padding-left: 20px;
 
}
 

	
 
.group_members .group_member {
 
    height: 30px;
 
    padding: 0px 0px 0px 0px;
 
}
 

	
 
.reviewer_status {
 
    float: left;
 
}
 

	
 
.reviewers_member {
 
    height: 15px;
 
    padding: 0px 0px 0px 10px;
 
}
 

	
 
.emails_wrap {
 
    padding: 0px 20px;
 
}
 

	
 
.emails_wrap .email_entry {
 
    height: 30px;
 
    padding: 0px 0px 0px 10px;
 
}
 
.emails_wrap .email_entry .email {
 
    float: left
 
}
 
.emails_wrap .email_entry .email_action {
 
    float: left
 
}
 

	
 
.ips_wrap {
 
    padding: 0px 20px;
 
}
 

	
 
.ips_wrap .ip_entry {
 
    height: 30px;
 
    padding: 0px 0px 0px 10px;
 
}
 
.ips_wrap .ip_entry .ip {
 
    float: left
 
}
 
.ips_wrap .ip_entry .ip_action {
 
    float: left
 
}
 

	
 

	
 
/*README STYLE*/
 

	
 
div.readme {
 
    padding: 0px;
 
}
 

	
 
div.readme h2 {
 
    font-weight: normal;
 
}
 

	
 
div.readme .readme_box {
 
    background-color: #fafafa;
 
}
 

	
 
div.readme .readme_box {
 
    clear: both;
 
    overflow: hidden;
 
    margin: 0;
 
    padding: 0 20px 10px;
 
}
 

	
 
div.readme .readme_box h1,
 
div.readme .readme_box h2,
 
div.readme .readme_box h3,
 
div.readme .readme_box h4,
 
div.readme .readme_box h5,
 
div.readme .readme_box h6 {
 
    border-bottom: 0 !important;
 
    margin: 0 !important;
 
    padding: 0 !important;
 
    line-height: 1.5em !important;
 
}
 

	
 

	
 
div.readme .readme_box h1:first-child {
 
    padding-top: .25em !important;
 
}
 

	
 
div.readme .readme_box h2,
 
div.readme .readme_box h3 {
 
    margin: 1em 0 !important;
 
}
 

	
 
div.readme .readme_box h2 {
 
    margin-top: 1.5em !important;
 
    border-top: 4px solid #e0e0e0 !important;
 
    padding-top: .5em !important;
 
}
 

	
 
div.readme .readme_box p {
 
    color: black !important;
 
    margin: 1em 0 !important;
 
    line-height: 1.5em !important;
 
}
 

	
 
div.readme .readme_box ul {
 
    list-style: disc !important;
 
    margin: 1em 0 1em 2em !important;
 
}
 

	
 
div.readme .readme_box ol {
 
    list-style: decimal;
 
    margin: 1em 0 1em 2em !important;
 
}
 

	
 
div.readme .readme_box code {
 
    font-size: 12px !important;
 
    background-color: ghostWhite !important;
 
    color: #444 !important;
 
    padding: 0 .2em !important;
 
    border: 1px solid #dedede !important;
 
}
 

	
 
div.readme .readme_box pre code {
 
    padding: 0 !important;
 
    font-size: 12px !important;
 
    background-color: #eee !important;
 
    border: none !important;
 
}
 

	
 
div.readme .readme_box pre {
 
    margin: 1em 0;
 
    font-size: 12px;
 
    background-color: #eee;
 
    border: 1px solid #ddd;
 
    padding: 5px;
 
    color: #444;
 
    overflow: auto;
 
    -webkit-box-shadow: rgba(0,0,0,0.07) 0 1px 2px inset;
 
    -webkit-border-radius: 3px;
 
    border-radius: 3px;
 
}
 

	
 
div.readme .readme_box table {
 
    display: table;
 
    border-collapse: separate;
 
    border-spacing: 2px;
 
    border-color: gray;
 
    width: auto !important;
 
}
 

	
 

	
 
/** RST STYLE **/
 

	
 

	
 
div.rst-block {
 
    padding: 0px;
 
}
 

	
 
div.rst-block h2 {
 
    font-weight: normal;
 
}
 

	
 
div.rst-block {
 
    background-color: #fafafa;
 
}
 

	
 
div.rst-block {
 
    clear: both;
 
    overflow: hidden;
 
    margin: 0;
 
    padding: 0 20px 10px;
 
    padding: 0 20px;
 
}
 

	
 
div.rst-block h1,
 
div.rst-block h2,
 
div.rst-block h3,
 
div.rst-block h4,
 
div.rst-block h5,
 
div.rst-block h6 {
 
    border-bottom: 0 !important;
 
    margin: 0 !important;
 
    padding: 0 !important;
 
    line-height: 1.5em !important;
 
}
 

	
 

	
 
div.rst-block h1:first-child {
 
    padding-top: .25em !important;
 
}
 

	
 
div.rst-block h2,
 
div.rst-block h3 {
 
    margin: 1em 0 !important;
 
}
 

	
 
div.rst-block h2 {
 
    margin-top: 1.5em !important;
 
    border-top: 4px solid #e0e0e0 !important;
 
    padding-top: .5em !important;
 
}
 

	
 
div.rst-block p {
 
    color: black !important;
 
    margin: 1em 0 !important;
 
    line-height: 1.5em !important;
 
}
 

	
 
div.rst-block ul {
 
    list-style: disc !important;
 
    margin: 1em 0 1em 2em !important;
 
}
 

	
 
div.rst-block ol {
 
    list-style: decimal;
 
    margin: 1em 0 1em 2em !important;
 
}
 

	
 
div.rst-block code {
 
    font-size: 12px !important;
 
    background-color: ghostWhite !important;
 
    color: #444 !important;
 
    padding: 0 .2em !important;
 
    border: 1px solid #dedede !important;
 
}
 

	
 
div.rst-block pre code {
 
    padding: 0 !important;
 
    font-size: 12px !important;
 
    background-color: #eee !important;
 
    border: none !important;
 
}
 

	
 
div.rst-block pre {
 
    margin: 1em 0;
 
    font-size: 12px;
 
    background-color: #eee;
 
    border: 1px solid #ddd;
 
    padding: 5px;
 
    color: #444;
 
    overflow: auto;
 
    -webkit-box-shadow: rgba(0,0,0,0.07) 0 1px 2px inset;
 
    -webkit-border-radius: 3px;
 
    border-radius: 3px;
 
}
 

	
 

	
 
/** comment main **/
 
.comments {
 
    padding: 10px 20px;
 
    max-width: 978px;
 
}
 

	
 
.comments .comment {
 
    border: 1px solid #ddd;
 
    margin-top: 10px;
 
    -webkit-border-radius: 4px;
 
    border-radius: 4px;
 
}
 

	
 
.comments .comment .meta {
 
    background: #f8f8f8;
 
    padding: 4px;
 
    border-bottom: 1px solid #ddd;
 
    min-height: 18px;
 
    overflow: auto;
 
}
 

	
 
.comments .comment .meta img {
 
    vertical-align: middle;
 
}
 

	
 
.comments .comment .meta .user {
 
    font-weight: bold;
 
    float: left;
 
    padding: 4px 2px 2px 2px;
 
}
 

	
 
.comments .comment .meta .date {
 
    float: left;
 
    padding: 4px 4px 0px 4px;
 
}
 

	
 
.comments .comment .text {
 
    background-color: #FAFAFA;
 
}
 
.comment .text div.rst-block p {
 
    margin: 0.5em 0px !important;
 
}
 

	
 
.comments .comments-number,
 
.pr-comments-number {
 
    margin: 5px;
 
    padding: 0px 0px 10px 0px;
 
    font-weight: bold;
 
    color: #666;
 
    font-size: 16px;
 
}
 

	
 
.automatic-comment {
 
    font-style: italic;
 
}
 

	
 
/** comment form **/
 

	
 
.status-block {
 
    margin: 5px;
 
    clear: both
 
}
 

	
 

	
 
div.comment-form {
 
    margin-top: 20px;
 
}
 

	
 
.comment-form textarea {
 
    width: 100%;
 
    height: 100px;
 
    font-family: Consolas, Monaco, Inconsolata, Liberation Mono, monospace;
 
}
 

	
 
form.comment-form {
 
    margin-top: 10px;
 
    margin-left: 10px;
 
}
 

	
 
.comment-inline-form .comment-block-ta,
 
.comment-form .comment-block-ta {
 
    border: 1px solid #ccc;
 
    border-radius: 3px;
 
    -webkit-box-sizing: border-box;
 
    -moz-box-sizing: border-box;
 
    box-sizing: border-box;
 
}
 

	
 
.comment-form-submit {
 
    margin-top: 5px;
 
    margin-left: 525px;
 
}
 

	
 
.file-comments {
 
    display: none;
 
}
 

	
 
.comment-form .comment {
 
    margin-left: 10px;
 
}
 

	
 
.comment-form .comment-help {
 
    padding: 5px 5px 5px 5px;
 
    color: #666;
 
}
 
.comment-form .comment-help .preview-btn,
 
.comment-form .comment-help .edit-btn {
 
    float: right;
 
    margin: -6px 0px 0px 0px;
 
}
 

	
 
.comment-form .preview-box.unloaded,
 
.comment-inline-form .preview-box.unloaded {
 
    height: 50px;
 
    text-align: center;
 
    padding: 20px;
 
    background-color: #fafafa;
kallithea/templates/changeset/changeset_file_comment.html
Show inline comments
 
## -*- coding: utf-8 -*-
 
## usage:
 
## <%namespace name="comment" file="/changeset/changeset_file_comment.html"/>
 
## ${comment.comment_block(co)}
 
##
 
<%def name="comment_block(co)">
 
  <div class="comment" id="comment-${co.comment_id}" line="${co.line_no}">
 
    <div class="comment-wrapp">
 
      <div class="meta">
 
          <div style="float:left">
 
               ${h.gravatar(co.author.email, size=20)}
 
          </div>
 
          <div class="user">
 
              ${co.author.username_and_name}
 
          </div>
 
          <div class="date">
 

	
 
          <span>
 
              ${h.age(co.modified_at)}
 
          </div>
 
              %if co.pull_request:
 
                ${_('on pull request')}
 
                <a href="${co.pull_request.url()}">"${co.pull_request.title or _("No title")}"</a>
 
              %else:
 
                ${_('on this changeset')}
 
              %endif
 
              <a class="permalink" href="#comment-${co.comment_id}">&para;</a>
 
          </span>
 

	
 
       <div style="float:left;padding:4px 0px 0px 5px">
 
        <span class="">
 
         %if co.pull_request:
 
            %if co.status_change:
 
              ${_('Status change from pull request')}
 
              <a href="${co.pull_request.url()}">"${co.pull_request.title or _("No title")}"</a>:
 
            %else:
 
              ${_('Comment from pull request')}
 
              <a href="${co.pull_request.url()}">"${co.pull_request.title or _("No title")}"</a>
 
            %endif
 
         %else:
 
            %if co.status_change:
 
              ${_('Status change on changeset')}:
 
            %else:
 
              ${_('Comment on changeset')}
 
            %endif
 
         %endif
 
        </span>
 
       </div>
 

	
 
          %if h.HasPermissionAny('hg.admin')() or h.HasRepoPermissionAny('repository.admin')(c.repo_name) or co.author.user_id == c.authuser.user_id:
 
            <div onClick="confirm('${_("Delete comment?")}') && deleteComment(${co.comment_id})" class="buttons delete-comment btn btn-mini">${_('Delete')}</div>
 
          %endif
 
      </div>
 
      <div class="text">
 
        %if co.status_change:
 
           <div  style="float:left" class="changeset-status-container">
 
             <div style="float:left;padding:10px 2px 0px 2px"></div>
 
             <span title="${_('Changeset status')}" class="changeset-status-lbl">${_("Status change")}: ${co.status_change[0].status_lbl}</span>
 
             <span class="changeset-status-ico"><i class="icon-circle changeset-status-${co.status_change[0].status}"></i></span>
 
           <div class="rst-block automatic-comment">
 
             <p>
 
               <span title="${_('Changeset status')}" class="changeset-status-lbl">${_("Status change")}: ${co.status_change[0].status_lbl}</span>
 
               <span class="changeset-status-ico"><i class="icon-circle changeset-status-${co.status_change[0].status}"></i></span>
 
             </p>
 
           </div>
 
        %endif
 

	
 
      <a class="permalink" href="#comment-${co.comment_id}">&para;</a>
 
      %if h.HasPermissionAny('hg.admin')() or h.HasRepoPermissionAny('repository.admin')(c.repo_name) or co.author.user_id == c.authuser.user_id:
 
          <div onClick="confirm('${_("Delete comment?")}') && deleteComment(${co.comment_id})" class="buttons delete-comment btn btn-mini">${_('Delete')}</div>
 
      %endif
 
      </div>
 
      <div class="text">
 
        %if co.text:
 
          ${h.rst_w_mentions(co.text)|n}
 
        %else:
 
          <div class="rst-block automatic-comment">
 
            <p>${_('No comments.')}</p>
 
          </div>
 
        %endif
 
      </div>
 
    </div>
 
  </div>
 
</%def>
 

	
 

	
 
<%def name="comment_inline_form()">
 
<div id='comment-inline-form-template' style="display:none">
 
  <div class="comment-inline-form ac">
 
  %if c.authuser.username != 'default':
 
    ${h.form('#', class_='inline-form')}
 
      <div id="edit-container_{1}" class="clearfix">
 
        <div class="comment-help">${_('Commenting on line {1}.')}
 
          ${(_('Comments parsed using %s syntax with %s support.') % (
 
                 ('<a href="%s">RST</a>' % h.url('rst_help')),
 
                   ('<span style="color:#577632" class="tooltip" title="%s">@mention</span>' % _('Use @username inside this text to notify another user'))
 
               )
 
            )|n
 
           }
 
        </div>
 
        <div class="mentions-container" id="mentions_container_{1}"></div>
 
        <textarea id="text_{1}" name="text" class="comment-block-ta yui-ac-input"></textarea>
 
      </div>
 
      <div id="preview-container_{1}" class="clearfix" style="display:none">
 
        <div class="comment-help">
 
            ${_('Comment preview')}
 
        </div>
 
        <div id="preview-box_{1}" class="preview-box"></div>
 
      </div>
 
      <div class="comment-button">
 
        <div class="submitting-overlay">${_('Submitting ...')}</div>
 
        <input type="hidden" name="f_path" value="{0}">
 
        <input type="hidden" name="line" value="{1}">
 
        ${h.submit('save', _('Comment'), class_='btn btn-small save-inline-form')}
 
        ${h.reset('hide-inline-form', _('Cancel'), class_='btn btn-small hide-inline-form')}
 
        <div id="preview-btn_{1}" class="preview-btn btn btn-small">${_('Preview')}</div>
 
        <div id="edit-btn_{1}" class="edit-btn btn btn-small" style="display:none">${_('Edit')}</div>
 
      </div>
 
    ${h.end_form()}
 
  %else:
 
      ${h.form('')}
 
      <div class="clearfix">
 
          <div class="comment-help">
 
            ${_('You need to be logged in to comment.')} <a href="${h.url('login_home',came_from=h.url.current())}">${_('Login now')}</a>
 
          </div>
 
      </div>
 
      <div class="comment-button">
 
      ${h.reset('hide-inline-form', _('Hide'), class_='btn btn-small hide-inline-form')}
 
      </div>
 
      ${h.end_form()}
 
  %endif
 
  </div>
 
</div>
 
</%def>
 

	
 

	
 
## show comment count as "x comments (y inline, z general)"
 
<%def name="comment_count(inline_cnt, general_cnt)">
 
    ${'%s (%s, %s)' % (
 
        ungettext("%d comment", "%d comments", inline_cnt + general_cnt) % (inline_cnt + general_cnt),
 
        ungettext("%d inline", "%d inline", inline_cnt) % inline_cnt,
 
        ungettext("%d general", "%d general", general_cnt) % general_cnt
 
    )}
 
    <span class="firstlink"></span>
 
</%def>
 

	
 
## generates inlines taken from c.comments var
 
<%def name="inlines()">
 
    <div class="comments-number">
 
        ${comment_count(c.inline_cnt, len(c.comments))}
 
    </div>
 
    %for path, lines in c.inline_comments:
 
        % for line,comments in lines.iteritems():
 
            <div style="display:none" class="inline-comment-placeholder" path="${path}" target_id="${h.safeid(h.safe_unicode(path))}">
 
            %for co in comments:
 
                ${comment_block(co)}
 
            %endfor
 
            </div>
 
        %endfor
 
    %endfor
 

	
 
</%def>
 

	
 
## generate inline comments and the main ones
 
<%def name="generate_comments()">
 
<div class="comments">
 
    <div id="inline-comments-container">
 
    ## generate inlines for this changeset
 
     ${inlines()}
 
    </div>
 

	
 
    %for co in c.comments:
 
        <div id="comment-tr-${co.comment_id}">
 
          ${comment_block(co)}
 
        </div>
 
    %endfor
 
</div>
 
</%def>
 

	
 
## MAIN COMMENT FORM
 
<%def name="comments(post_url, cur_status, is_pr=False, change_status=True)">
 

	
 
<div class="comments">
 
    %if c.authuser.username != 'default':
 
    <div class="comment-form ac">
 
      ${h.form(post_url, id="main_form")}
 
        <div id="edit-container" class="clearfix">
 
            <div class="comment-help">
 
                ${(_('Comments parsed using %s syntax with %s support.') % (('<a href="%s">RST</a>' % h.url('rst_help')),
 
                  '<span style="color:#577632" class="tooltip" title="%s">@mention</span>' %
 
                  _('Use @username inside this text to notify another user.')))|n}
 
            </div>
 
            <div class="mentions-container" id="mentions_container"></div>
 
            ${h.textarea('text', class_="comment-block-ta")}
 
            %if change_status:
 
              <div id="status_block_container" class="status-block">
 
                %if is_pr:
 
                  ${_('Vote for pull request status')}:
 
                %else:
 
                  ${_('Set changeset status')}:
 
                %endif
 
                <input type="radio" class="status_change_radio" name="changeset_status" id="changeset_status_unchanged" value="" checked="checked" />
 
                <label for="changeset_status_unchanged">
 
                  ${_('No change')}
 
                </label>
 
                %for status,lbl in c.changeset_statuses:
 
                    <span style="margin-left: 15px;">
 
                        <input type="radio" class="status_change_radio" name="changeset_status" id="${status}" value="${status}">
 
                        <label for="${status}"><i class="icon-circle changeset-status-${status}" /></i>${lbl}</label>
 
                    </span>
 
                %endfor
 

	
 
                %if is_pr and ( \
 
                    h.HasPermissionAny('hg.admin')() or h.HasRepoPermissionAny('repository.admin')(c.repo_name) \
 
                    or c.pull_request.author.user_id == c.authuser.user_id):
 
                  <input id="save_close" type="checkbox" name="save_close">
 
                  <label id="save_close_label" for="save_close">${_("Close")}</label>
 
                %endif
 
              </div>
 
            %endif
 
        </div>
 

	
 
        <div id="preview-container" class="clearfix" style="display:none">
 
            <div class="comment-help">
 
                ${_('Comment preview')}
 
            </div>
 
            <div id="preview-box" class="preview-box"></div>
 
        </div>
 

	
 
        <div class="comment-button">
 
            ${h.submit('save', _('Comment'), class_="btn")}
 
            <div id="preview-btn" class="preview-btn btn">${_('Preview')}</div>
 
            <div id="edit-btn" class="edit-btn btn" style="display:none">${_('Edit')}</div>
 
        </div>
 
      ${h.end_form()}
 
    </div>
 
    %endif
 
</div>
 

	
 
<script>
 

	
 
$(document).ready(function () {
 
   MentionsAutoComplete('text', 'mentions_container', _USERS_AC_DATA, _GROUPS_AC_DATA);
 

	
 
   $(window).on('beforeunload', function(){
 
      if($('.form-open').size() || $('textarea#text').val()){
 
         // this message will not be displayed on all browsers
 
         // (e.g. some versions of Firefox), but the user will still be warned
 
         return 'There are uncommitted comments.';
 
      }
 
   });
 

	
 
   $('form#main_form').submit(function(){
 
      // if no open inline forms, disable the beforeunload check - it would
 
      // fail in the check for the textarea we are about to submit
 
      if(!$('.form-open').size()){
 
          $(window).off('beforeunload');
 
      }
 
   });
 

	
 
   $('#preview-btn').click(function(){
 
       var _text = $('#text').val();
 
       if(!_text){
 
           return;
 
       }
 
       var post_data = {'text': _text};
 
       $('#preview-box').addClass('unloaded');
 
       $('#preview-box').html(_TM['Loading ...']);
 
       $('#edit-container').hide();
 
       $('#edit-btn').show();
 
       $('#preview-container').show();
0 comments (0 inline, 0 general)