Changeset - 329c0584cba8
Parent rev.
Child rev.
[Not reviewed]
default
0 3 0
Thomas De Schampheleire - 10 years ago 2015-06-18 08:46:07
thomas.de.schampheleire@gmail.com
comments: remove dysfunctional comment bubble on compare and file views (issue #84)

Several compare and file views would show a comment bubble when hovering
code lines, even though clicking on this bubble would not do anything.

Instead, make sure that the bubble only appears when the diff block is in a
class 'commentable-diff', which can be set from the appropriate places
(changeset and pullrequest views) where a click handler is also attached.
3 files changed with 8 insertions and 5 deletions:
kallithea/public/css/style.css
4
3
kallithea/templates/changeset/changeset.html
2
1
kallithea/templates/pullrequests/pullrequest_show.html
2
1
0 comments (0 inline, 0 general)
kallithea/public/css/style.css
➞
Show inline comments
 
@@ -4963,99 +4963,100 @@ table.code-difftable .code td {
 
    padding: 0;
 
}
 
table.code-difftable .code pre {
 
    margin: 0 0 0 12px;
 
    padding: 0;
 
    min-height: 17px;
 
    line-height: 17px;
 
    white-space: pre-wrap;
 
}
 

			




	
	
	
		
 
table.code-difftable .del .code pre:before {

			




	
	
	
		
 
    content: "-";

			




	
	
	
		
 
    color: #800;

			




	
	
	
		
 
    float: left;

			




	
	
	
		
 
    left: -1em;

			




	
	
	
		
 
    position: relative;

			




	
	
	
		
 
    width: 0;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
table.code-difftable .add .code pre:before {

			




	
	
	
		
 
    content: "+";

			




	
	
	
		
 
    color: #080;

			




	
	
	
		
 
    float: left;

			




	
	
	
		
 
    left: -1em;

			




	
	
	
		
 
    position: relative;

			




	
	
	
		
 
    width: 0;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
table.code-difftable .unmod .code pre:before {

			




	
	
	
		
 
    content: " ";

			




	
	
	
		
 
    float: left;

			




	
	
	
		
 
    left: -1em;

			




	
	
	
		
 
    position: relative;

			




	
	
	
		
 
    width: 0;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
.add-bubble {

			




	
	
	
		
 
    position: relative;

			




	
	
	
		
 
    display: none;

			




	
	
	
		
 
    float: left;

			




	
	
	
		
 
    width: 0px;

			




	
	
	
		
 
    height: 0px;

			




	
	
	
		
 
    left: -8px;

			




	
	
	
		
 
    -webkit-box-sizing: border-box;

			




	
	
	
		
 
    -moz-box-sizing: border-box;

			




	
	
	
		
 
    box-sizing: border-box;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
tr.line.add:hover td .add-bubble,

			




	
	
	
		
 
tr.line.del:hover td .add-bubble,

			




	
	
	
		
 
tr.line.unmod:hover td .add-bubble {

			




	
	
	
		
 
/* comment bubble, only visible when in a commentable diff */

			




	
	
	
		
 
.commentable-diff tr.line.add:hover td .add-bubble,

			




	
	
	
		
 
.commentable-diff tr.line.del:hover td .add-bubble,

			




	
	
	
		
 
.commentable-diff tr.line.unmod:hover td .add-bubble {

			




	
	
	
		
 
    display: block;

			




	
	
	
		
 
    z-index: 1;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
.add-bubble div {

			




	
	
	
		
 
    background: #577632;

			




	
	
	
		
 
    width: 16px;

			




	
	
	
		
 
    height: 16px;

			




	
	
	
		
 
    cursor: pointer;

			




	
	
	
		
 
    padding: 0 2px 2px 0.5px;

			




	
	
	
		
 
    border: 1px solid #577632;

			




	
	
	
		
 
    border-radius: 3px;

			




	
	
	
		
 
    -webkit-box-sizing: border-box;

			




	
	
	
		
 
    -moz-box-sizing: border-box;

			




	
	
	
		
 
    box-sizing: border-box;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
.add-bubble div:before {

			




	
	
	
		
 
    font-size: 14px;

			




	
	
	
		
 
    color: #ffffff;

			




	
	
	
		
 
    font-family: "kallithea";

			




	
	
	
		
 
    content: '\1f5ea';

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
.add-bubble div:hover {

			




	
	
	
		
 
    transform: scale(1.2, 1.2);

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
div.comment:target>.comment-wrapp {

			




	
	
	
		
 
    border: solid 2px #ee0 !important;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
.lineno:target a {

			




	
	
	
		
 
    border: solid 2px #ee0 !important;

			




	
	
	
		
 
    margin: -2px;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
.btn-image-diff-show,

			




	
	
	
		
 
.btn-image-diff-swap {

			




	
	
	
		
 
    margin: 5px;

			




	
	
	
		
 
}

			




	
	
	
		
 

			




	
	
	
		
 
.img-diff {

			




	
	
	
		
 
    max-width: 45%;

			




	
	
	
		
 
    height: auto;

			




	
	
	
		
 
    margin: 5px;

			




	
	
	
		
 
    /* http://lea.verou.me/demos/css3-patterns.html */

			




	
	
	
		
 
    background-image:

			




        

    


    
    

    

        

                

                    kallithea/templates/changeset/changeset.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
		
 
@@ -113,103 +113,104 @@ ${self.repo_context_bar('changelog', c.c

			




	
	
	
		
 
                     <div class="author">

			




	
	
	
		
 
                         <div class="gravatar">

			




	
	
	
		
 
                           ${h.gravatar(h.email_or_none(c.changeset.author), size=20)}

			




	
	
	
		
 
                         </div>

			




	
	
	
		
 
                         <span><b>${h.person(c.changeset.author,'username_and_name')}</b> - ${h.age(c.changeset.date,True)} ${h.fmt_date(c.changeset.date)}</span><br/>

			




	
	
	
		
 
                         <span>${h.email_or_none(c.changeset.author)}</span><br/>

			




	
	
	
		
 
                     </div>

			




	
	
	
		
 
                     <% rev = c.changeset.extra.get('source') %>

			




	
	
	
		
 
                     %if rev:

			




	
	
	
		
 
                     <div>

			




	
	
	
		
 
                       ${_('Grafted from:')} ${h.link_to(h.short_id(rev),h.url('changeset_home',repo_name=c.repo_name,revision=rev))}

			




	
	
	
		
 
                     </div>

			




	
	
	
		
 
                     %endif

			




	
	
	
		
 
                     <% rev = c.changeset.extra.get('transplant_source', '').encode('hex') %>

			




	
	
	
		
 
                     %if rev:

			




	
	
	
		
 
                     <div>

			




	
	
	
		
 
                       ${_('Transplanted from:')} ${h.link_to(h.short_id(rev),h.url('changeset_home',repo_name=c.repo_name,revision=rev))}

			




	
	
	
		
 
                     </div>

			




	
	
	
		
 
                     %endif

			




	
	
	
		
 
                     <div class="message">${h.urlify_commit(c.changeset.message, c.repo_name)}</div>

			




	
	
	
		
 
                </div>

			




	
	
	
		
 
            </div>

			




	
	
	
		
 
            <div class="changes_txt">

			




	
	
	
		
 
            % if c.limited_diff:

			




	
	
	
		
 
            ${ungettext('%s file changed','%s files changed',len(c.changeset.affected_files)) % (len(c.changeset.affected_files))}:

			




	
	
	
		
 
            % else:

			




	
	
	
		
 
            ${ungettext('%s file changed with %s insertions and %s deletions','%s files changed with %s insertions and %s deletions', len(c.changeset.affected_files)) % (len(c.changeset.affected_files),c.lines_added,c.lines_deleted)}:

			




	
	
	
		
 
            %endif

			




	
	
	
		
 
            </div>

			




	
	
	
		
 
            <div class="cs_files">

			




	
	
	
		
 
              %for FID, (cs1, cs2, change, path, diff, stats) in c.changes[c.changeset.raw_id].iteritems():

			




	
	
	
		
 
                  <div class="cs_${change}">

			




	
	
	
		
 
                        <div class="node">

			




	
	
	
		
 
                            <i class="icon-diff-${change}"></i>

			




	
	
	
		
 
                            <a href="#${FID}">${h.safe_unicode(path)}</a>

			




	
	
	
		
 
                        </div>

			




	
	
	
		
 
                    <div class="changes">${h.fancy_file_stats(stats)}</div>

			




	
	
	
		
 
                  </div>

			




	
	
	
		
 
              %endfor

			




	
	
	
		
 
              % if c.limited_diff:

			




	
	
	
		
 
                <h5>${_('Changeset was too big and was cut off...')} <a href="${h.url.current(fulldiff=1, **request.GET.mixed())}">${_('Show full diff anyway')}</a></h5>

			




	
	
	
		
 
              % endif

			




	
	
	
		
 
            </div>

			




	
	
	
		
 
        </div>

			




	
	
	
		
 

			




	
	
	
		
 
    </div>

			




	
	
	
		
 

			




	
	
	
		
 
    ## diff block

			




	
	
	
		
 
    <div class="commentable-diff">

			




	
	
	
		
 
    <%namespace name="diff_block" file="/changeset/diff_block.html"/>

			




	
	
	
		
 
    ${diff_block.diff_block_js()}

			




	
	
	
		
 
    ${diff_block.diff_block(c.changes[c.changeset.raw_id])}

			




	
	
	
		
 

			




	
	
	
		
 
    % if c.limited_diff:

			




	
	
	
		
 
      <h4>${_('Changeset was too big and was cut off...')} <a href="${h.url.current(fulldiff=1, **request.GET.mixed())}">${_('Show full diff anyway')}</a></h4>

			




	
	
	
		
 
    % endif

			




	
	
	
		
 
    </div>

			




	
	
	
		
 

			




	
	
	
		
 
    ## template for inline comment form

			




	
	
	
		
 
    ${comment.comment_inline_form()}

			




	
	
	
		
 

			




	
	
	
		
 
    ## render comments and inlines

			




	
	
	
		
 
    ${comment.generate_comments()}

			




	
	
	
		
 

			




	
	
	
		
 
    ## main comment form and it status

			




	
	
	
		
 
    ${comment.comments(h.url('changeset_comment', repo_name=c.repo_name, revision=c.changeset.raw_id),

			




	
	
	
		
 
                       h.changeset_status(c.db_repo, c.changeset.raw_id))}

			




	
	
	
		
 

			




	
	
	
		
 
    ## FORM FOR MAKING JS ACTION AS CHANGESET COMMENTS

			




	
	
	
		
 
    <script type="text/javascript">

			




	
	
	
		
 
      $(document).ready(function(){

			




	
	
	
		
 
          $('.show-inline-comments').change(function(e){

			




	
	
	
		
 
              var target = e.currentTarget;

			




	
	
	
		
 
              if(target == null){

			




	
	
	
		
 
                  target = this;

			




	
	
	
		
 
              }

			




	
	
	
		
 
              var boxid = $(target).attr('id_for');

			




	
	
	
		
 
              if(target.checked){

			




	
	
	
		
 
                  $('#{0} .inline-comments'.format(boxid)).show();

			




	
	
	
		
 
                  $('#{0} .inline-comments-button'.format(boxid)).show();

			




	
	
	
		
 
              }else{

			




	
	
	
		
 
                  $('#{0} .inline-comments'.format(boxid)).hide();

			




	
	
	
		
 
                  $('#{0} .inline-comments-button'.format(boxid)).hide();

			




	
	
	
		
 
              }

			




	
	
	
		
 
          });

			




	
	
	
		
 
          $('.add-bubble').click(function(e){

			




	
	
	
		
 
              var tr = e.currentTarget;

			




	
	
	
		
 
              if(tr == null){

			




	
	
	
		
 
                  tr = this;

			




	
	
	
		
 
              }

			




	
	
	
		
 
              injectInlineForm(tr.parentNode.parentNode);

			




	
	
	
		
 
          });

			




	
	
	
		
 

			




	
	
	
		
 
          // inject comments into they proper positions

			




	
	
	
		
 
          var file_comments = $('.inline-comment-placeholder').toArray();

			




	
	
	
		
 
          renderInlineComments(file_comments);

			




	
	
	
		
 

			




	
	
	
		
 
          linkInlineComments($('.firstlink'), $('.comment'));

			




	
	
	
		
 

			




	
	
	
		
 
          pyroutes.register('changeset_home',

			




	
	
	
		
 
                            "${h.url('changeset_home', repo_name='%(repo_name)s', revision='%(revision)s')}",

			




	
	
	
		
 
                            ['repo_name', 'revision']);

			




	
	
	
		
 

			




	
	
	
		
 
          //next links

			




	
	
	
		
 
          $('#child_link').on('click', function(e){

			




        

    


    
    

    

        

                

                    kallithea/templates/pullrequests/pullrequest_show.html
                

                

                  
                      
                        

                      ➞

                      
                        
                  

                  
                      
                  
                      
                  
                      
                  
                      
                  
                  
                

                

                    Show inline comments
                    
                

        

        

            



	
	
		
 
@@ -296,105 +296,106 @@ ${self.repo_context_bar('showpullrequest

			




	
	
	
		
 

			




	
	
	
		
 
              <div style="font-size:1.1em;font-weight: bold;clear:both;padding-top:10px">

			




	
	
	
		
 
              ${_('Common ancestor')}:

			




	
	
	
		
 
              ${h.link_to(h.short_id(c.a_rev),h.url('changeset_home',repo_name=c.a_repo.repo_name,revision=c.a_rev))}

			




	
	
	
		
 
              </div>

			




	
	
	
		
 

			




	
	
	
		
 
              ## FILES

			




	
	
	
		
 
              <div style="font-size:1.1em;font-weight: bold;clear:both;padding-top:10px">

			




	
	
	
		
 

			




	
	
	
		
 
              % if c.limited_diff:

			




	
	
	
		
 
                  ${ungettext('%s file changed', '%s files changed', len(c.files)) % len(c.files)}

			




	
	
	
		
 
              % else:

			




	
	
	
		
 
                  ${ungettext('%s file changed with %s insertions and %s deletions','%s files changed with %s insertions and %s deletions', len(c.files)) % (len(c.files),c.lines_added,c.lines_deleted)}:

			




	
	
	
		
 
              %endif

			




	
	
	
		
 

			




	
	
	
		
 
              </div>

			




	
	
	
		
 
              <div class="cs_files">

			




	
	
	
		
 
                %if not c.files:

			




	
	
	
		
 
                   <span class="empty_data">${_('No files')}</span>

			




	
	
	
		
 
                %endif

			




	
	
	
		
 
                %for fid, change, f, stat in c.files:

			




	
	
	
		
 
                    <div class="cs_${change}">

			




	
	
	
		
 
                      <div class="node">

			




	
	
	
		
 
                          <i class="icon-diff-${change}"></i>

			




	
	
	
		
 
                          ${h.link_to(h.safe_unicode(f),'#' + fid)}

			




	
	
	
		
 
                      </div>

			




	
	
	
		
 
                      <div class="changes">${h.fancy_file_stats(stat)}</div>

			




	
	
	
		
 
                    </div>

			




	
	
	
		
 
                %endfor

			




	
	
	
		
 
              </div>

			




	
	
	
		
 
              % if c.limited_diff:

			




	
	
	
		
 
                <h5>${_('Changeset was too big and was cut off...')} <a href="${h.url.current(fulldiff=1, **request.GET.mixed())}">${_('Show full diff anyway')}</a></h5>

			




	
	
	
		
 
              % endif

			




	
	
	
		
 
          </div>

			




	
	
	
		
 
    </div>

			




	
	
	
		
 
    <script>

			




	
	
	
		
 
    var _USERS_AC_DATA = ${c.users_array|n};

			




	
	
	
		
 
    var _GROUPS_AC_DATA = ${c.user_groups_array|n};

			




	
	
	
		
 
    // TODO: switch this to pyroutes

			




	
	
	
		
 
    AJAX_COMMENT_URL = "${url('pullrequest_comment',repo_name=c.repo_name,pull_request_id=c.pull_request.pull_request_id)}";

			




	
	
	
		
 
    AJAX_COMMENT_DELETE_URL = "${url('pullrequest_comment_delete',repo_name=c.repo_name,comment_id='__COMMENT_ID__')}";

			




	
	
	
		
 

			




	
	
	
		
 
    pyroutes.register('pullrequest_comment', "${url('pullrequest_comment',repo_name='%(repo_name)s',pull_request_id='%(pull_request_id)s')}", ['repo_name', 'pull_request_id']);

			




	
	
	
		
 
    pyroutes.register('pullrequest_comment_delete', "${url('pullrequest_comment_delete',repo_name='%(repo_name)s',comment_id='%(comment_id)s')}", ['repo_name', 'comment_id']);

			




	
	
	
		
 

			




	
	
	
		
 
    </script>

			




	
	
	
		
 

			




	
	
	
		
 
    ## diff block

			




	
	
	
		
 
    <div class="commentable-diff">

			




	
	
	
		
 
    <%namespace name="diff_block" file="/changeset/diff_block.html"/>

			




	
	
	
		
 
    ${diff_block.diff_block_js()}

			




	
	
	
		
 
    %for fid, change, f, stat in c.files:

			




	
	
	
		
 
      ${diff_block.diff_block_simple([c.changes[fid]])}

			




	
	
	
		
 
    %endfor

			




	
	
	
		
 
    % if c.limited_diff:

			




	
	
	
		
 
      <h4>${_('Changeset was too big and was cut off...')} <a href="${h.url.current(fulldiff=1, **request.GET.mixed())}">${_('Show full diff anyway')}</a></h4>

			




	
	
	
		
 
    % endif

			




	
	
	
		
 

			




	
	
	
		
 
    </div>

			




	
	
	
		
 

			




	
	
	
		
 
    ## template for inline comment form

			




	
	
	
		
 
    ${comment.comment_inline_form()}

			




	
	
	
		
 

			




	
	
	
		
 
    ## render comments and inlines

			




	
	
	
		
 
    ${comment.generate_comments()}

			




	
	
	
		
 

			




	
	
	
		
 
    ## main comment form and it status

			




	
	
	
		
 
    ${comment.comments(h.url('pullrequest_comment', repo_name=c.repo_name,

			




	
	
	
		
 
                              pull_request_id=c.pull_request.pull_request_id),

			




	
	
	
		
 
                       c.current_voting_result,

			




	
	
	
		
 
                       is_pr=True, change_status=c.allowed_to_change_status)}

			




	
	
	
		
 

			




	
	
	
		
 
    <script type="text/javascript">

			




	
	
	
		
 
      $(document).ready(function(){

			




	
	
	
		
 
          PullRequestAutoComplete('user', 'reviewers_container', _USERS_AC_DATA, _GROUPS_AC_DATA);

			




	
	
	
		
 

			




	
	
	
		
 
          $('.add-bubble').click(function(e){

			




	
	
	
		
 
              var tr = e.currentTarget;

			




	
	
	
		
 
              injectInlineForm(tr.parentNode.parentNode);

			




	
	
	
		
 
          });

			




	
	
	
		
 

			




	
	
	
		
 
          var avail_jsdata = ${c.avail_jsdata|n};

			




	
	
	
		
 
          var avail_r = new BranchRenderer('avail_graph_canvas', 'updaterevs-table', 'chg_available_');

			




	
	
	
		
 
          avail_r.render(avail_jsdata,40);

			




	
	
	
		
 

			




	
	
	
		
 
          // inject comments into they proper positions

			




	
	
	
		
 
          var file_comments = $('.inline-comment-placeholder').toArray();

			




	
	
	
		
 
          renderInlineComments(file_comments);

			




	
	
	
		
 

			




	
	
	
		
 
          linkInlineComments($('.firstlink'), $('.comment'));

			




	
	
	
		
 

			




	
	
	
		
 
          $('#updaterevs input').change(function(e){

			




	
	
	
		
 
              var update = !!e.target.value;

			




	
	
	
		
 
              $('#pr-form-save').prop('disabled',update);

			




	
	
	
		
 
              $('#pr-form-clone').prop('disabled',!update);

			




	
	
	
		
 
          });

			




	
	
	
		
 
          var $org_review_members = $('#review_members').clone();

			




	
	
	
		
 
          $('#pr-form-reset').click(function(e){

			




	
	
	
		
 
              $('#pr-edit-form').hide();

			




	
	
	
		
 
              $('.pr-not-edit').show();

			




	
	
	
		
 
              $('#pr-form-save').prop('disabled',false);

			




	
	
	
		
 
              $('#pr-form-clone').prop('disabled',true);

			




	
	
	
		
 
              $('#review_members').html($org_review_members);

			




	
	
	
		
 
          });

			




	
	
	
		
 

			




	
	
	
		
 
          // hack: re-navigate to target after JS is done ... if a target is set and setting href thus won't reload

			




	
	
	
		
 
          if (window.location.hash != "") {

			




        

    



    


    



    



      

      





    
    0 comments (0 inline, 0 general)
    





    


  

  







  


    




    








    
        
    
    
        This site is powered by
            Kallithea 0.7.0,
        which is
        © 2010–2025 by various authors & licensed under GPLv3.