<%
  # API
  my $api = gitprep_api;

  # Parameters
  my $user = param('user');
  my $project = param('project');
  my $from_rev = param('rev1');
  my $rev = param('rev2');
  my $page = param('page') || 0;
  
  # Git
  my $git = $self->app->git;
  
  # Commits
  my $commits = $git->forward_commits($user, $project, $from_rev, $rev);
  my $commits_count = @$commits;
  my $commits_date = {};
  my $authors = {};
  for my $commit (@$commits) {
    my $date = $commit->{age_string_date_local};
    $commits_date->{$date} ||= [];
    $authors->{$commit->{author}} = 1;
    push @{$commits_date->{$date}}, $commit;
  }
  my $authors_count = keys %$authors;

  # Start commit
  my $start_commit = $git->separated_commit($user, $project, $from_rev, $rev);

  # End commit
  my $end_commit = $git->get_commit($user, $project, $rev);
  
  if (!$start_commit || !$end_commit) {
    $self->reply->not_found;
    return;
  }
  
  # Branches
  my $branches = $git->branches($user, $project);
  @$branches = sort { $a->{commit}{age} <=> $b->{commit}{age} } @$branches;
  
  # Variables
  stash id => $end_commit->{id};
  stash from_id => $start_commit->{id};
  stash rev => $end_commit->{id};
  stash from_rev => $start_commit->{id};

  layout 'common', title => "Comparing $rev1...$rev2 \x{30fb} $user/$project";
%>


%= javascript begin
  $(document).ready(function () {
    
    // Change base branch
    $('#base-branch-btn').on('click', function () {
      $('#base-branch-popup')
        .css('display', 'block')
        .css('top', '40px')
        .css('left', '10px')
      ;
    });
    $('#base-branch-close').on('click', function () {
      $('#base-branch-popup').css('display', 'none');
    });
    $('[name=base-branch]').on('keypress', function (e) {
      // Enter
      if (e.which == 13) {
        location.href = '<%= url_for("/$user/$project/compare/") %>' + $(this).val() + '...<%= $rev %>';
      }
    });

    // Change compare branch
    $('#compare-branch-btn').on('click', function () {
      $('#compare-branch-popup')
        .css('display', 'block')
        .css('top', '40px')
        .css('left', '96px')
      ;
    });
    $('#compare-branch-close').on('click', function () {
      $('#compare-branch-popup').css('display', 'none');
    });
    $('[name=compare-branch]').on('keypress', function (e) {
      // Enter
      if (e.which == 13) {
        location.href = '<%= url_for("/$user/$project/compare/") %>' + '<%= $from_rev %>...' + $(this).val();
      }
    });
  });
% end

%= include '/include/header';

<div class="container">
  <div class="topic1">Compare View</div>
  <div class="compare-select">
    <div>
      <div>
        <button id="base-branch-btn" class="btn btn-small">
          <span>base:</span><b> <%= $from_rev %></b><i class="icon-arrow-down"></i>
        </button>
        ...
        <button id="compare-branch-btn" class="btn btn-small">
          <span>compare:</span> <b><%= $rev %></b><i class="icon-arrow-down"></i>
        </button>
      </div>
    </div>

    <div id="base-branch-popup" style="display:none;width:330px;position:absolute">
      <div class="radius-top border-gray" style="background:#E6E6FA;padding:10px">
        <div style="overflow:hidden">
          <div style="float:left;width:90%;">
            <b>Choose a base branch</b>
          </div>
          <div style="float:left:width:10%;text-align:right;">
            <i id="base-branch-close" class="icon-remove-circle"></i>
          </div>
        </div>
      </div>
      <div class="border-gray" style="background:#F5F5F5;border-top:none;border-bottom:none;text-align:center;padding:10px 0">
        %= text_field 'base-branch', style => 'margin-bottom:0;width:270px', placeholder => 'Branch, tag, commit, or history marker';
      </div>
      <div style="background:white;max-height:500px;overflow:auto;">
        <ul class="nav nav-tabs nav-stacked">
          % for (my $i = 0; $i < @$branches; $i++) {
            % my $branch = $branches->[$i];
              <li>
                <a style="border-top-left-radius:0px;border-top-right-radius:0px;" href="<%= url_for("/$user/$project/compare/$branch->{name}...$rev") %>">
                  <%= $branch->{name} %>
                </a>
              </li>
          % }
        </ul>
      </div>
    </div>

    <div id="compare-branch-popup" style="display:none;width:330px;position:absolute">
      <div class="radius-top border-gray" style="background:#E6E6FA;padding:10px">
        <div style="overflow:hidden">
          <div style="float:left;width:90%;">
            <b>Choose a compare branch</b>
          </div>
          <div style="float:left:width:10%;text-align:right;">
            <i id="compare-branch-close" class="icon-remove-circle"></i>
          </div>
        </div>
      </div>
      <div class="border-gray" style="background:#F5F5F5;border-top:none;border-bottom:none;text-align:center;padding:10px 0">
        %= text_field 'compare-branch', style => 'margin-bottom:0;width:270px', placeholder => 'Branch, tag, commit, or history marker';
      </div>
      <div style="background:white;max-height:500px;overflow:auto;">
      <ul class="nav nav-tabs nav-stacked">
        % for (my $i = 0; $i < @$branches; $i++) {
          % my $branch = $branches->[$i];
            <li>
              <a style="border-top-left-radius:0px;border-top-right-radius:0px;" href="<%= url_for("/$user/$project/compare/$from_rev...$branch->{name}") %>">
                <%= $branch->{name} %>
              </a>
            </li>
        % }
      </ul>
      </div>
    </div>
  </div>

  % if (keys %$commits_date) {
    <ul class="compare-header">
      <li>
        <b><%= @$commits %></b> <span>commit</span>
      </li>
      <li>
        <b><%= $authors_count %></b> <span>contributor</span>
      </li>
      <li>
        
      </li>
      <li>
        
      </li>
    </ul>
    
    <div class="commits">
      % for my $date (reverse sort keys %$commits_date) {
        % my $commits = $commits_date->{$date};
        
        <div class="commit-date">
          <i class="icon-off"></i><span>Commits on <%= $date %></span>
        </div>
        
        <ul class="compare-commits-date-container">
          % for my $commit (sort {$b->{author_epoch} <=> $a->{author_epoch}} @$commits) {
            <li>
              <div class="compare-commits-author">
                <span title="<%= $commit->{author_email} %>"><%= $commit->{author_name} %></span>
              </div>
              <div class="compare-commits-commit-title">
                <a style="color:#333" href="<%= url_for("/$user/$project/commit/$commit->{id}") %>">
                  <%= $commit->{title_short} %>
                </a>
              </div>
              <div class="compare-commits-commit-id">
                <a href="<%= url_for("/$user/$project/commit/$commit->{id}") %>">
                  <%= substr($commit->{id}, 0, 7) %>
                </a>
              </div>
            </li>
          % }
        </ul>
      % }
    </div>
  
    %= include '/include/commit_body';
  % } else {
    <div>
      <b>There isn't anything to compare.</b>
    </div>
  % }
</div>
%= include '/include/footer';