});

    return false;

};

var showRepoSize = function(target, repo_name){

    var args = '_authentication_token=' + _authentication_token;

    if(!$("#" + target).hasClass('loaded')){

        $("#" + target).html(_TM['Loading ...']);

        var url = pyroutes.url('repo_size', {"repo_name":repo_name});

        $.post(url, args, function(data) {

            $("#" + target).html(data);

            $("#" + target).addClass('loaded');

        });

    }

    return false;

};

/**

 * tooltips

 */

var tooltip_activate = function(){

    $(document).ready(_init_tooltip);

};

var _activate_tooltip = function($tt){

    $tt.mouseover(_show_tooltip);

    $tt.mousemove(_move_tooltip);

    $tt.mouseout(_close_tooltip);

};

var _init_tooltip = function(){

    var $tipBox = $('#tip-box');

    if(!$tipBox.length){

        $tipBox = $('<div id="tip-box"></div>')

        $(document.body).append($tipBox);

    }

    $tipBox.hide();

    $tipBox.css('position', 'absolute');

    $tipBox.css('max-width', '600px');

    _activate_tooltip($('.tooltip'));

};

var _show_tooltip = function(e, tipText, safe){

    e.stopImmediatePropagation();

    var el = e.currentTarget;

    var $el = $(el);

    if(tipText){

        // just use it

    } else if(el.tagName.toLowerCase() === 'img'){

        tipText = el.alt ? el.alt : '';

    } else {

        tipText = el.title ? el.title : '';

        safe = safe || $el.hasClass("safe-html-title");

    }

    if(tipText !== ''){

        // save org title

        $el.attr('tt_title', tipText);

        // reset title to not show org tooltips

        $el.attr('title', '');

        var $tipBox = $('#tip-box');

        if (safe) {

            $tipBox.html(tipText);

        } else {

            $tipBox.text(tipText);

        }

        $tipBox.css('display', 'block');

    }

};

var _move_tooltip = function(e){

    e.stopImmediatePropagation();

    var $tipBox = $('#tip-box');

    $tipBox.css('top', (e.pageY + 15) + 'px');

    $tipBox.css('left', (e.pageX + 15) + 'px');

};

var _close_tooltip = function(e){

    e.stopImmediatePropagation();

    var $tipBox = $('#tip-box');

    $tipBox.hide();

    var el = e.currentTarget;

    $(el).attr('title', $(el).attr('tt_title'));

};

/**

 * Quick filter widget

 *

 * @param target: filter input target

 * @param nodes: list of nodes in html we want to filter.

 * @param display_element function that takes current node from nodes and

 *    does hide or show based on the node

 */

var q_filter = (function() {

    var _namespace = {};

    var namespace = function (target) {

        if (!(target in _namespace)) {

            _namespace[target] = {};

        }

        return _namespace[target];

    };

    return function (target, $nodes, display_element) {

        var $nodes = $nodes;

        var $q_filter_field = $('#' + target);

        var F = namespace(target);

        $q_filter_field.keyup(function (e) {

            clearTimeout(F.filterTimeout);

            F.filterTimeout = setTimeout(F.updateFilter, 600);

        });

        F.filterTimeout = null;

        F.updateFilter = function () {

            // Reset timeout

            F.filterTimeout = null;

            var obsolete = [];

            var req = $q_filter_field.val().toLowerCase();

            var showing = 0;

            $nodes.each(function () {

                var n = this;

                var target_element = display_element(n);

                if (req && n.innerHTML.toLowerCase().indexOf(req) == -1) {

                    $(target_element).hide();

                }

                else {

                    $(target_element).show();

                    showing += 1;

                }

            });

            $('#repo_count').html(showing);

            /* FIXME: don't hardcode */

        }

    }

})();

/* return jQuery expression with a tr with body in 3rd column and class cls and id named after the body */

var _table_tr = function(cls, body){

    // like: <div class="comment" id="comment-8" line="o92"><div class="comment-wrapp">...

    // except new inlines which are different ...

    var comment_id = ($(body).attr('id') || 'comment-new').split('comment-')[1];

    var tr_id = 'comment-tr-{0}'.format(comment_id);

    return $(('<tr id="{0}" class="{1}">'+

                  '<td class="lineno-inline new-inline"></td>'+

                  '<td class="lineno-inline old-inline"></td>'+

                  '<td>{2}</td>'+

                 '</tr>').format(tr_id, cls, body));

};

/** return jQuery expression with new inline form based on template **/

var _createInlineForm = function(parent_tr, f_path, line) {

    var $tmpl = $('#comment-inline-form-template').html().format(f_path, line);

    var $form = _table_tr('comment-form-inline', $tmpl)

    // create event for hide button

    $form.find('.hide-inline-form').click(function(e) {

        var newtr = e.currentTarget.parentNode.parentNode.parentNode.parentNode.parentNode;

        if($(newtr).next().hasClass('inline-comments-button')){

            $(newtr).next().show();

        }

        $(newtr).remove();

        $(parent_tr).removeClass('form-open');

        $(parent_tr).removeClass('hl-comment');

    });

    return $form

};

/**

 * Inject inline comment for an given TR. This tr should always be a .line .

 * The form will be inject after any comments.

 */

var injectInlineForm = function(tr){

    var $tr = $(tr);

    if(!$tr.hasClass('line')){

        return

    }

    var submit_url = AJAX_COMMENT_URL;

    var $td = $tr.find('.code');

    if($tr.hasClass('form-open') || $tr.hasClass('context') || $td.hasClass('no-comment')){

        return

    }

    $tr.addClass('form-open hl-comment');

    var lineno = _getLineNo(tr);

    var $form = _createInlineForm(tr, f_path, lineno, submit_url);

    var $parent = $tr;

    while ($parent.next().hasClass('inline-comments')){

        var $parent = $parent.next();

    }

    $form.insertAfter($parent);

    var $overlay = $form.find('.submitting-overlay');

    var $inlineform = $form.find('.inline-form');

    $form.submit(function(e){

        e.preventDefault();

        if(lineno === undefined){

            alert('Error submitting, line ' + lineno + ' not found.');

            return;

        }

        if(f_path === undefined){

            alert('Error submitting, file path ' + f_path + ' not found.');

            return;

        }

        var text = $('#text_'+lineno).val();

        if(text == ""){

            return;

        }

        $overlay.show();

        var success = function(json_data){

            $tr.removeClass('form-open');

            $form.remove();

            _renderInlineComment(json_data);

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

        };

        var postData = {

                'text': text,

                'f_path': f_path,

                'line': lineno

        };

        ajaxPOST(submit_url, postData, success);

    });

    $('#preview-btn_'+lineno).click(function(e){

        var text = $('#text_'+lineno).val();

        if(!text){

            return

        }

        $('#preview-box_'+lineno).addClass('unloaded');

        $('#preview-box_'+lineno).html(_TM['Loading ...']);

        $('#edit-container_'+lineno).hide();

        $('#edit-btn_'+lineno).show();

        $('#preview-container_'+lineno).show();

        $('#preview-btn_'+lineno).hide();

        var url = pyroutes.url('changeset_comment_preview', {'repo_name': REPO_NAME});

        var post_data = {'text': text};

        ajaxPOST(url, post_data, function(html){

            $('#preview-box_'+lineno).html(html);

            $('#preview-box_'+lineno).removeClass('unloaded');

        })

    })

    $('#edit-btn_'+lineno).click(function(e){

        $('#edit-container_'+lineno).show();

        $('#edit-btn_'+lineno).hide();

        $('#preview-container_'+lineno).hide();

        $('#preview-btn_'+lineno).show();

    })

    setTimeout(function(){

        // callbacks

        tooltip_activate();

        MentionsAutoComplete('text_'+lineno, 'mentions_container_'+lineno,

                             _USERS_AC_DATA);

        $('#text_'+lineno).focus();

    },10)

};

var deleteComment = function(comment_id){

    var url = AJAX_COMMENT_DELETE_URL.replace('__COMMENT_ID__',comment_id);

    var postData = {'_method':'delete'};

    var success = function(o){

        var $deleted = $('#comment-tr-'+comment_id);

        var $prev = $deleted.prev('tr');

        while ($prev.hasClass('inline-comments')){

            $prev = $prev.prev('tr');

        }

        $deleted.remove();

        _placeAddButton($prev);

    }

    ajaxPOST(url,postData,success);

}

var _getLineNo = function(tr) {

    var line;

    var o = $(tr).children()[0].id.split('_');

    var n = $(tr).children()[1].id.split('_');

    if (n.length >= 2) {

        line = n[n.length-1];

    } else if (o.length >= 2) {

        line = o[o.length-1];

    }

    return line

};

var _placeAddButton = function($line_tr){

    var $tr = $line_tr;

    while ($tr.next().hasClass('inline-comments')){

        $tr.find('.add-comment').remove();

        $tr = $tr.next();

    }

    $tr.find('.add-comment').remove();

    var label = TRANSLATION_MAP['Add Another Comment'];

    var $html_el = $('<div class="add-comment"><span class="btn btn-mini">{0}</span></div>'.format(label));

    $html_el.click(function(e) {

        injectInlineForm($line_tr);

    });

    $tr.find('.comment').after($html_el);

};

/**

 * Places the inline comment into the changeset block in proper line position

 */

var _placeInline = function(target_id, lineno, html){

    var $td = $("#{0}_{1}".format(target_id, lineno));

    if (!$td.length){

        return false;

    }

    // check if there are comments already !

    var $line_tr = $td.parent(); // the tr

    var $after_tr = $line_tr;

    while ($after_tr.next().hasClass('inline-comments')){

        $after_tr = $after_tr.next();

    }

    // put in the comment at the bottom

    var $tr = _table_tr('inline-comments', html)

    $tr.find('div.comment').addClass('inline-comment');

    $after_tr.after($tr);

    // scan nodes, and attach add button to last one

    _placeAddButton($line_tr);

    return true;

}

/**

 * make a single inline comment and place it inside

 */

var _renderInlineComment = function(json_data){

    var html =  json_data['rendered_text'];

    var lineno = json_data['line_no'];

    var target_id = json_data['target_id'];

    return _placeInline(target_id, lineno, html);

}

/**

 * Iterates over all the inlines, and places them inside proper blocks of data

 */

var renderInlineComments = function(file_comments){

    for (var f in file_comments){

        // holding all comments for a FILE

        var box = file_comments[f];

        var target_id = $(box).attr('target_id');

        // actual comments with line numbers

        var comments = box.children;

        var obsolete_comments = [];

        for(var i=0; i<comments.length; i++){

            var data = {

                'rendered_text': comments[i].outerHTML,

                'line_no': $(comments[i]).attr('line'),

                'target_id': target_id

            }

            if (_renderInlineComment(data)) {

                obsolete_comments.push(comments[i]);

                $(comments[i]).hide();

            }else{

                var txt = document.createTextNode(

                        "Comment to " + YUD.getAttribute(comments[i].parentNode,'path') +

                        " line " + data.line_no +

                        " which is outside the diff context:");

                comments[i].insertBefore(txt, comments[i].firstChild);

            }

        }

        // now remove all the obsolete comments that have been copied to their

        // respective locations.

        for (var i=0; i < obsolete_comments.length; i++) {

            obsolete_comments[i].parentNode.removeChild(obsolete_comments[i]);

        }

## -*- coding: utf-8 -*-

##usage:

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

## ${diff_block.diff_block(change)}

##

<%def name="diff_block(change)">

<div class="diff-collapse">

    <span target="${'diff-container-%s' % (id(change))}" class="diff-collapse-button">&uarr; ${_('Collapse Diff')} &uarr;</span>

</div>

<div class="diff-container" id="${'diff-container-%s' % (id(change))}">

%for FID,(cs1, cs2, change, path, diff, stats) in change.iteritems():

    <div id="${FID}_target" style="clear:both;margin-top:25px"></div>

    <div id="${FID}" class="diffblock  margined comm">

        <div class="code-header">

            <div class="changeset_header">

                <div class="changeset_file">

                    ${h.link_to_if(change!='D',h.safe_unicode(path),h.url('files_home',repo_name=c.repo_name,

                    revision=cs2,f_path=h.safe_unicode(path)))}

                </div>

                <div class="diff-actions">

                  <a href="${h.url('files_diff_home',repo_name=c.repo_name,f_path=h.safe_unicode(path),diff2=cs2,diff1=cs1,diff='diff',fulldiff=1)}" class="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=c.repo_name,f_path=h.safe_unicode(path),diff2=cs2,diff1=cs1,diff='diff',fulldiff=1)}" class="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=c.repo_name,f_path=h.safe_unicode(path),diff2=cs2,diff1=cs1,diff='raw')}" class="tooltip" title="${_('Raw diff')}">

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

                  </a>

                  <a href="${h.url('files_diff_home',repo_name=c.repo_name,f_path=h.safe_unicode(path),diff2=cs2,diff1=cs1,diff='download')}" class="tooltip" title="${_('Download diff')}">

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

                  </a>

                  ${c.ignorews_url(request.GET, h.FID(cs2,path))}

                  ${c.context_url(request.GET, h.FID(cs2,path))}

                </div>

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

                  <label>

                  ${_('Show inline comments')}

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

                  </label>

                </span>

            </div>

        </div>

            ${diff|n}

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

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

              %if change =='M':

                <div 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 change == 'M':

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

                      realsrc="${h.url('files_raw_home',repo_name=c.repo_name,revision=cs1,f_path=path)}" />

                %endif

                %if change in 'AM':

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

                      realsrc="${h.url('files_raw_home',repo_name=c.repo_name,revision=cs2,f_path=path)}" />

                %endif

              </div>

            %endif

        </div>

    </div>

%endfor

</div>

</%def>

<%def name="diff_block_simple(change)">

  %for op,filenode_path,diff in change:

    <div id="${h.FID('',filenode_path)}_target" style="clear:both;margin-top:25px"></div>

    <div id="${h.FID('',filenode_path)}" class="diffblock  margined comm">

      <div class="code-header">

          <div class="changeset_header">

              <div class="changeset_file">

                  ${h.safe_unicode(filenode_path)} |

                  ## TODO: link to ancestor and head of other instead of exactly other

                  %if op == 'A':

                    ${_('Added')}

                    <a class="spantag" href="${h.url('files_home', repo_name=c.cs_repo.repo_name, f_path=filenode_path, revision=c.cs_rev)}">${h.short_id(c.cs_ref_name) if c.cs_ref_type=='rev' else c.cs_ref_name}</a>

                  %elif op == 'M':

                    <a class="spantag" href="${h.url('files_home', repo_name=c.a_repo.repo_name, f_path=filenode_path, revision=c.a_rev)}">${h.short_id(c.a_ref_name) if c.a_ref_type=='rev' else c.a_ref_name}</a>

                    <i class="icon-right"></i>

                    <a class="spantag" href="${h.url('files_home', repo_name=c.cs_repo.repo_name, f_path=filenode_path, revision=c.cs_rev)}">${h.short_id(c.cs_ref_name) if c.cs_ref_type=='rev' else c.cs_ref_name}</a>

                  %elif op == 'D':

                    ${_('Deleted')}

                    <a class="spantag" href="${h.url('files_home', repo_name=c.a_repo.repo_name, f_path=filenode_path, revision=c.a_rev)}">${h.short_id(c.a_ref_name) if c.a_ref_type=='rev' else c.a_ref_name}</a>

                  %elif op == 'R':

                    ${_('Renamed')}

                    <a class="spantag" href="${h.url('files_home', repo_name=c.a_repo.repo_name, f_path=filenode_path, revision=c.a_rev)}">${h.short_id(c.a_ref_name) if c.a_ref_type=='rev' else c.a_ref_name}</a>

                    <i class="icon-right"></i>

                    <a class="spantag" href="${h.url('files_home', repo_name=c.cs_repo.repo_name, f_path=filenode_path, revision=c.cs_rev)}">${h.short_id(c.cs_ref_name) if c.cs_ref_type=='rev' else c.cs_ref_name}</a>

                  %else:

                    ${op}???

                  %endif

              </div>

              <div class="diff-actions">

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

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

                </a>

                ${c.ignorews_url(request.GET)}

                ${c.context_url(request.GET)}

              </div>

          </div>

      </div>

            ${diff|n}

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

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

              %if op == 'M':

                <div id="${h.FID('',filenode_path)}_image-diff" class="btn btn-image-diff-swap" style="display:none">Press to swap images</div>

              %endif

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

                %if op == 'M':

                  <img id="${h.FID('',filenode_path)}_image-diff-img-a" class="img-diff img-diff-swapable" style="display:none"

                      realsrc="${h.url('files_raw_home',repo_name=c.a_repo.repo_name,revision=c.a_rev,f_path=filenode_path) if op in 'DM' else ''}" />

                %endif

                %if op in 'AM':

                  <img id="${h.FID('',filenode_path)}_image-diff-img-b" class="img-diff img-diff-swapable" style="display:none"

                      realsrc="${h.url('files_raw_home',repo_name=c.cs_repo.repo_name,revision=c.cs_rev,f_path=filenode_path) if op in 'AM' else ''}" />

                %endif

              </div>

            %endif

        </div>

    </div>

  %endfor

</%def>

<%def name="diff_block_js()">

<script type="text/javascript">

$(document).ready(function(){

    $('.btn-image-diff-show').click(function(e){

        $('.btn-image-diff-show').hide();

        $('.btn-image-diff-swap').show();

        $('.img-diff-swapable')

            .each(function(i,e){

                    $(e).attr('src', $(e).attr('realsrc'));

                })

            .show();

        });

    $('.btn-image-diff-swap').mousedown(function(e){

        $('#'+e.currentTarget.id+'-img-a.img-diff-swapable')

          .before($('#'+e.currentTarget.id+'-img-b.img-diff-swapable'));

    });

    var reset = function(e){

        $('#'+e.currentTarget.id+'-img-a.img-diff-swapable')

          .after($('#'+e.currentTarget.id+'-img-b.img-diff-swapable'));

    };

    $('.btn-image-diff-swap').mouseup(reset);

    $('.btn-image-diff-swap').mouseleave(reset);

});

</script>

</%def>