kallithea/templates/compare/compare_diff.html

## -*- coding: utf-8 -*-
<%inherit file="/base/base.html"/>

<%block name="title">
    %if c.compare_home:
        ${_('%s Compare') % c.repo_name}
    %else:
        ${_('%s Compare') % c.repo_name} - ${'%s@%s' % (c.a_repo.repo_name, c.a_ref_name)} &gt; ${'%s@%s' % (c.cs_repo.repo_name, c.cs_ref_name)}
    %endif
</%block>

<%def name="breadcrumbs_links()">
  ${_('Compare Revisions')}
</%def>

<%block name="header_menu">
    ${self.menu('repositories')}
</%block>

<%def name="main()">
${self.repo_context_bar('changelog')}
<div class="panel panel-primary">
    <div class="panel-heading clearfix">
        ${self.breadcrumbs()}
    </div>
    <div class="panel-body">
      <div class="panel panel-default">
        <div id="body" class="panel-heading">
            <div class="compare-revision-selector">
                ## divs are "inline-block" and cannot have whitespace between them.
                <span>
                    ${h.hidden('compare_org')}
                </span><span>
                    <i class="icon-right"></i>
                </span><span>
                    ${h.hidden('compare_other')}
                </span><span>
                    %if not c.compare_home:
                        <a class="btn btn-default btn-sm" href="${c.swap_url}"><i class="icon-arrows-cw"></i>${_('Swap')}</a>
                    %endif
                    <button type="button" id="compare_revs" class="btn btn-default btn-sm"><i class="icon-git-compare"></i>${_('Compare Revisions')}</button>
                </span>
            </div>
        </div>

    %if c.compare_home:
        <div id="changeset_compare_view_content" class="panel-body">
         <h4 class="text-muted">${_('Compare revisions, branches, bookmarks, or tags.')}</h4>
        </div>
    %else:
        <div id="changeset_compare_view_content" class="panel-body">
                ##CS
                <h5>${ungettext('Showing %s commit','Showing %s commits', len(c.cs_ranges)) % len(c.cs_ranges)}</h5>
                <%include file="compare_cs.html" />

                ## FILES
                <h5>
                % if c.limited_diff:
                    ${ungettext('%s file changed', '%s files changed', len(c.file_diff_data)) % len(c.file_diff_data)}:
                % else:
                    ${ungettext('%s file changed with %s insertions and %s deletions','%s files changed with %s insertions and %s deletions', len(c.file_diff_data)) % (len(c.file_diff_data),c.lines_added,c.lines_deleted)}:
                %endif

                ${c.ignorews_url(request.GET)}
                ${c.context_url(request.GET)}
                </h5>
                <div class="cs_files">
                  %if not c.file_diff_data:
                     <span class="text-muted">${_('No files')}</span>
                  %endif
                  %for fid, url_fid, op, a_path, path, diff, stats in c.file_diff_data:
                    <div class="cs_${op} clearfix">
                      <span class="node">
                          <i class="icon-diff-${op}"></i>
                          ${h.link_to(path, '#%s' % fid)}
                      </span>
                      <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>
    %endif

    %if not c.compare_home:
        ## diff block
        <%namespace name="diff_block" file="/changeset/diff_block.html"/>
        ${diff_block.diff_block_js()}
        ${diff_block.diff_block(c.a_repo.repo_name, c.a_ref_type, c.a_ref_name, c.a_rev,
                                c.cs_repo.repo_name, c.cs_ref_type, c.cs_ref_name, c.cs_rev, c.file_diff_data)}
        % 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')}</a></h4>
        % endif
    %endif
    </div>

</div>
    <script type="text/javascript">

   $(document).ready(function(){
    var cache = {};

    function make_revision_dropdown(css_selector, repo_name, ref_name, cache_key) {
      $(css_selector).select2({
        placeholder: '{0}@{1}'.format(repo_name, ref_name || ${h.jshtml(_('Select changeset'))}),
        formatSelection: function(obj){
            return '{0}@{1}'.format(repo_name, obj.text).html_escape();
        },
        dropdownAutoWidth: true,
        maxResults: 50,
        query: function(query){
          var key = cache_key;
          var cached = cache[key] ;
          if(cached) {
            var data = {results: []};
            var queryLower = query.term.toLowerCase();
            //filter results
            $.each(cached.results, function(){
                var section = this.text;
                var children = [];
                $.each(this.children, function(){
                    if(children.length < 50 ?
                       ((queryLower.length == 0) || (this.text.toLowerCase().indexOf(queryLower) >= 0)) :
                       ((queryLower.length != 0) && (this.text.toLowerCase().indexOf(queryLower) == 0))) {
                        children.push(this);
                    }
                });
                children = branchSort(children, undefined, query)
                data.results.push({'text': section, 'children': children});
            });
            //push the typed in changeset
            data.results.push({'text':_TM['Specify changeset'],
                               'children': [{'id': query.term, 'text': query.term, 'type': 'rev'}]});
            query.callback(data);
          }else{
              $.ajax({
                url: pyroutes.url('repo_refs_data', {'repo_name': repo_name}),
                data: {},
                dataType: 'json',
                type: 'GET',
                success: function(data) {
                  cache[key] = data;
                  query.callback(data);
                }
              });
          }
        }
    });
    }

    make_revision_dropdown("#compare_org",   ${h.js(c.a_repo.repo_name)},  ${h.js(c.a_ref_name)},  'cache');
    make_revision_dropdown("#compare_other", ${h.js(c.cs_repo.repo_name)}, ${h.js(c.cs_ref_name)}, 'cache2');

    var values_changed = function() {
        var values = $('#compare_org').select2('data') && $('#compare_other').select2('data');
        if (values) {
             $('#compare_revs').removeClass("disabled");
             // TODO: the swap button ... if any
        } else {
             $('#compare_revs').addClass("disabled");
             // TODO: the swap button ... if any
        }
    }
    values_changed();
    $('#compare_org').change(values_changed);
    $('#compare_other').change(values_changed);
    $('#compare_revs').on('click', function(e){
        var org = $('#compare_org').select2('data');
        var other = $('#compare_other').select2('data');
        if (!org || !other) {
            return;
        }

        var compare_url = ${h.js(h.url('compare_url',repo_name=c.repo_name,org_ref_type='__other_ref_type__',org_ref_name='__org__',other_ref_type='__org_ref_type__',other_ref_name='__other__', other_repo=c.cs_repo.repo_name))};
        var u = compare_url.replace('__other_ref_type__',org.type)
                           .replace('__org__',org.text)
                           .replace('__org_ref_type__',other.type)
                           .replace('__other__',other.text);
        window.location = u;
    });
   });
    </script>
</%def>