## -*- 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="${h.tooltip(_('Show full diff for this file'))}">
                      <img class="icon" src="${h.url('/images/icons/page_white_go.png')}"/>
                  </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="${h.tooltip(_('Show full side-by-side diff for this file'))}">
                      <img class="icon" src="${h.url('/images/icons/application_double.png')}"/>
                  </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="${h.tooltip(_('Raw diff'))}">
                      <img class="icon" src="${h.url('/images/icons/page_white.png')}"/>
                  </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="${h.tooltip(_('Download diff'))}">
                      <img class="icon" src="${h.url('/images/icons/page_save.png')}"/>
                  </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>
        <div class="code-body">
            <div class="full_f_path" path="${h.safe_unicode(path)}"></div>
            ${diff|n}
            %if path.rsplit('.')[-1] in ['png', 'gif', 'jpg', 'bmp']:
              <div class="btn btn-image-diff-show">Show images</div>
              <div id="${FID}_image-diff" class="btn btn-image-diff-swap" style="display:none">Press to swap images</div>
              <div>
                <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) if change in 'DM' else ''}"
                /><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) if change in 'AM' else ''}"
                />
              </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.org_repo.repo_name, f_path=filenode_path, revision=c.org_rev)}">${h.short_id(c.org_ref_name) if c.org_ref_type=='rev' else c.org_ref_name}</a>
                  %elif op == 'M':
                    <a class="spantag" href="${h.url('files_home', repo_name=c.org_repo.repo_name, f_path=filenode_path, revision=c.org_rev)}">${h.short_id(c.org_ref_name) if c.org_ref_type=='rev' else c.org_ref_name}</a>
                    <i class="icon-arrow-right"></i>
                    <a class="spantag" href="${h.url('files_home', repo_name=c.other_repo.repo_name, f_path=filenode_path, revision=c.other_rev)}">${h.short_id(c.other_ref_name) if c.other_ref_type=='rev' else c.other_ref_name}</a>
                  %elif op == 'D':
                    ${_('Deleted')}
                    <a class="spantag" href="${h.url('files_home', repo_name=c.other_repo.repo_name, f_path=filenode_path, revision=c.other_rev)}">${h.short_id(c.other_ref_name) if c.other_ref_type=='rev' else c.other_ref_name}</a>
                  %else:
                    ${op}???
                  %endif
              </div>
              <div class="diff-actions">
                %if c.other_repo.repo_name == c.repo_name:
                  <a href="${h.url('files_diff_2way_home',repo_name=c.repo_name,f_path=h.safe_unicode(filenode_path),diff1=c.other_rev,diff2=c.org_rev,diff='diff',fulldiff=1)}" class="tooltip" title="${h.tooltip(_('Show full side-by-side diff for this file'))}">
                      <img class="icon" src="${h.url('/images/icons/application_double.png')}"/>
                  </a>
                %endif
                ${c.ignorews_url(request.GET)}
                ${c.context_url(request.GET)}
              </div>
          </div>
      </div>
        <div class="code-body">
            <div class="full_f_path" path="${h.safe_unicode(filenode_path)}"></div>
            ${diff|n}
            %if filenode_path.rsplit('.')[-1] in ['png', 'gif', 'jpg', 'bmp']:
              <div class="btn btn-image-diff-show">Show images</div>
              <div id="${h.FID('',filenode_path)}_image-diff" class="btn btn-image-diff-swap" style="display:none">Press to swap images</div>
              <div>
                <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.repo_name,revision=c.org_rev,f_path=filenode_path) if op in 'DM' else ''}"
                /><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.repo_name,revision=c.other_rev,f_path=filenode_path) if op in 'AM' else ''}"
                />
              </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>