var $anchorcomment = $(anchorcomment);

        var target_id = $anchorcomment.data('target-id');

        var $comment_div = _get_add_comment_div(target_id);

        var f_path = $anchorcomment.data('f_path');

        var line_no = $anchorcomment.data('line_no');

        if ($comment_div[0]) {

            $comment_div.append($anchorcomment.children());

            if (f_path && line_no) {

                _comment_div_append_add($comment_div, f_path, line_no);

            } else {

                _comment_div_append_form($comment_div, f_path, line_no);

            }

        } else {

            $anchorcomment.before("Comment to {0} line {1} which is outside the diff context:".format(f_path || '?', line_no || '?'));

        }

    });

    linkInlineComments($('.firstlink'), $('.comment:first-child'));

}

// comment bubble was clicked - insert new tr and show form

function show_comment_form($bubble) {

    var children = $bubble.closest('tr.line').children('[id]');

    var line_td_id = children[children.length - 1].id;

    var $comment_div = _get_add_comment_div(line_td_id);

    var parts = line_td_id.split('_');

    var line_no = parts[parts.length-1];

    comment_div_state($comment_div, f_path, line_no, true);

}

// return comment div for target_id - add it if it doesn't exist yet

function _get_add_comment_div(target_id) {

    var comments_box_id = 'comments-' + target_id;

    var $comments_box = $('#' + comments_box_id);

    if (!$comments_box.length) {

        var html = '<tr><td id="{0}" colspan="3" class="inline-comments"></td></tr>'.format(comments_box_id);

        $('#' + target_id).closest('tr').after(html);

        $comments_box = $('#' + comments_box_id);

    }

    return $comments_box;

}

// Set $comment_div state - showing or not showing form and Add button.

// An Add button is shown on non-empty forms when no form is shown.

// The form is controlled by show_form - if undefined, form is only shown for general comments.

function comment_div_state($comment_div, f_path, line_no, show_form_opt) {

    var show_form = show_form_opt !== undefined ? show_form_opt : !f_path && !line_no;

    var $forms = $comment_div.children('.comment-inline-form');

    var $buttonrow = $comment_div.children('.add-button-row');

                      <a href="${h.url('files_home', repo_name=cs_repo_name, f_path=cs_filename, revision=cs_rev)}" data-toggle="tooltip" title="${_("File after")}">

                        <i class="icon-doc"></i></a>

                    %endif

                  </span>

                  <a href="${h.url('files_diff_home',repo_name=cs_repo_name,f_path=h.safe_unicode(cs_filename),diff2=cs_rev,diff1=a_rev,diff='diff',fulldiff=1)}" data-toggle="tooltip" title="${_('Show full diff for this file')}">

                      <i class="icon-file-code"></i></a>

                  <a href="${h.url('files_diff_2way_home',repo_name=cs_repo_name,f_path=h.safe_unicode(cs_filename),diff2=cs_rev,diff1=a_rev,diff='diff',fulldiff=1)}" data-toggle="tooltip" title="${_('Show full side-by-side diff for this file')}">

                      <i class="icon-docs"></i></a>

                  <a href="${h.url('files_diff_home',repo_name=cs_repo_name,f_path=h.safe_unicode(cs_filename),diff2=cs_rev,diff1=a_rev,diff='raw')}" data-toggle="tooltip" title="${_('Raw diff')}">

                      <i class="icon-diff"></i></a>

                  <a href="${h.url('files_diff_home',repo_name=cs_repo_name,f_path=h.safe_unicode(cs_filename),diff2=cs_rev,diff1=a_rev,diff='download')}" data-toggle="tooltip" title="${_('Download diff')}">

                      <i class="icon-floppy"></i></a>

                  ${c.ignorews_url(request.GET, url_fid)}

                  ${c.context_url(request.GET, url_fid)}

                </div>

                <span style="float:right;margin-top:-3px">

                    <label>

                        ${_('Show inline comments')}

                        ${h.checkbox('',checked="checked",class_="show-inline-comments",id_for=url_fid)}

                    </label>

                </span>

            </div>

        </div>

            ${diff|n}

            %if cs_filename.rsplit('.')[-1] in ['png', 'gif', 'jpg', 'bmp']:

              <div class="btn btn-image-diff-show">Show images</div>

              %if op == 'M':

                <div id="${id_fid}_image-diff" class="btn btn-image-diff-swap" style="display:none">Press to swap images</div>

              %endif

              <div style="font-size: 0">

                %if op in 'DM':

                  <img id="${id_fid}_image-diff-img-a" class="img-diff img-diff-swapable" style="display:none"

                      realsrc="${h.url('files_raw_home',repo_name=a_repo_name,revision=a_rev,f_path=a_filename)}" />

                %endif

                %if op in 'AM':

                  <img id="${id_fid}_image-diff-img-b" class="img-diff img-diff-swapable" style="display:none"

                      realsrc="${h.url('files_raw_home',repo_name=cs_repo_name,revision=cs_rev,f_path=cs_filename)}" />

                %endif

              </div>

            %endif

        </div>

    </div>

</%def>

<%def name="diff_block_js()">

<script type="text/javascript">

$(document).ready(function(){