add pull page design

ubiratanbraga · Aug 13, 2013 · 871dba1 · 871dba1
1 parent 394bada
commit 871dba1
Show file tree

Hide file tree

Showing 4 changed files with 102 additions and 5 deletions.
diff --git a/lib/Gitprep.pm b/lib/Gitprep.pm
@@ -223,6 +223,9 @@ sub startup {
 
         # Network Graph
         $r->get('/network/graph/(*rev1)...(*rev2_abs)' => template '/network/graph');
+
+        # Pull
+        $r->get('/pull/(*rev1)...(*rev2_abs)' => template '/pull');
 
         # Get branches and tags
         $r->get('/api/revs' => template '/api/revs');

diff --git a/templates/network.html.ep b/templates/network.html.ep
@@ -24,8 +24,8 @@
 
   %= javascript begin
     $(document).ready(function () {
-      // Update user and project hidden field
-      $('[name=remote-btn]').on('click', function () {
+      // Click compare button
+      $('[name=compare-btn]').on('click', function () {
         var branch = $('[name=branch]').val();
         var remote = $(this).closest('[name=remote]');
         var remote_member = remote.find('[name=remote-member]').text();
@@ -35,6 +35,18 @@
         location.href = '<%= url_for("/$user/$project/network/graph/") %>' + branch + '...'
           + remote_member + '/' + remote_project + '/' + remote_branch;
       });
+
+      // Click pull button
+      $('[name=pull-btn]').on('click', function () {
+        var branch = $('[name=branch]').val();
+        var remote = $(this).closest('[name=remote]');
+        var remote_member = remote.find('[name=remote-member]').text();
+        var remote_project = remote.find('[name=remote-project]').text();
+        var remote_branch = remote.find('[name=remote-branch]').val();
+
+        location.href = '<%= url_for("/$user/$project/pull/") %>' + branch + '...'
+          + remote_member + '/' + remote_project + '/' + remote_branch;
+      });
     });
   % end
 
@@ -67,7 +79,8 @@
               %= select_field 'remote-branch' => $mbranches, style => 'margin-top:5px;margin-bottom:7px;width:150px';
             </div>
             <div class="text-right">
-              <button name="remote-btn" class="btn" style="margin-top:5px">Compare</button>
+              <button name="compare-btn" class="btn" style="margin-top:5px">Compare</button>
+              <button name="pull-btn" class="btn" style="margin-top:5px">Pull</button>
             </div>
           </div>
           <hr style="margin:0">

diff --git a/templates/network/graph.html.ep b/templates/network/graph.html.ep
@@ -61,7 +61,7 @@
     <h3>Graph</h3>
     <div style="margin-bottom:20px">Compare 100 commits.</div>
     <div style="margin-bottom:10px">
-      <span style="color:blue;font-size:22px"><b><%= "$user / $project / $branch" %></big></span>
+      <span style="color:blue;font-size:22px"><%= "$user / $project / $branch" %></span>
     </div>
     <div id="graph" class="well" style="width:800px;overflow:auto;padding-left:10px;padding-right:10px">
       <table>
@@ -88,7 +88,7 @@
       </table>
     </div>
     <div style="margin-bottom:30px">
-      <span style="color:green;font-size:18px"><b><big><%= "$remote_user / $remote_project / $remote_branch" %></big></b></span>
+      <span style="color:green;font-size:22px"><%= "$remote_user / $remote_project / $remote_branch" %></span>
     </div>
   </div>
 

diff --git a/templates/pull.html.ep b/templates/pull.html.ep
@@ -0,0 +1,81 @@
+<%
+  my $user = param('user');
+  my $project = param('project');
+  my $branch = param('rev1');
+  my $rev2_abs = param('rev2_abs');
+  my ($remote_user, $remote_project, $remote_branch) = split /\//, $rev2_abs, 3;
+
+  my $commits = app->git->get_commits($user, $project, $branch, 100);
+  my $remote_commits = app->git->get_commits(
+    $remote_user,
+    $remote_project,
+    $remote_branch,
+    100
+  );
+
+  my $merged_commits_h = {};
+  for my $commit (@$commits) {
+    my $id = $commit->{id};
+    $merged_commits_h->{$id} ||= {};
+    $merged_commits_h->{$id}{age} = $commit->{age};
+    $merged_commits_h->{$id}{age_string_date} = $commit->{age_string_date};
+    $merged_commits_h->{$id}{title} = $commit->{title};
+    $merged_commits_h->{$id}{type} = 'local';
+  }
+  for my $commit (@$remote_commits) {
+    my $id = $commit->{id};
+    if ($merged_commits_h->{$id}) {
+      $merged_commits_h->{$id}{type} = 'same';
+    }
+    else {
+      $merged_commits_h->{$id} ||= {};
+      $merged_commits_h->{$id}{age} = $commit->{age};
+      $merged_commits_h->{$id}{age_string_date} = $commit->{age_string_date};
+      $merged_commits_h->{$id}{title} = $commit->{title};
+      $merged_commits_h->{$id}{type} = 'remote';
+    }
+  }
+
+  my $merged_commits = [];
+  for my $id (
+    sort { $merged_commits_h->{$b}{age} <=> $merged_commits_h->{$a}{age}}
+    keys %$merged_commits_h)
+  {
+    my $commit = {%{$merged_commits_h->{$id}}};
+    $commit->{id} = $id;
+    push @$merged_commits, $commit;
+  }
+%>
+
+% layout 'common', title => "Pull $user/$project/$branch...$rev2_abs";
+  %= include 'include/header';
+
+  %= javascript begin
+    $('document').ready(function () {
+      // Scroll to right
+      $('#graph').scrollLeft(1000);
+    });
+  % end
+
+  <div class="container">
+    <h3>Pull</h3>
+    <div class="row" style="font-size:22px">
+      <div class="span5">
+        <div class="well" style="text-align:center">
+          <span style="color:blue;"><%= "$user / $project / $branch" %></span>
+        </div>
+      </div>
+      <div class="span2">
+        <div style="padding: 19px;text-align:center;font-size:26px">
+          &lArr;
+        </div>
+      </div>
+      <div class="span5">
+        <div class="well" style="text-align:center">
+          <span style="color:green;"><%= "$remote_user / $remote_project / $remote_branch" %></span>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  %= include '/include/footer';