diff --git a/src/main/twirl/diff.scala.html b/src/main/twirl/diff.scala.html
index 0753d29..018cd4e 100644
--- a/src/main/twirl/diff.scala.html
+++ b/src/main/twirl/diff.scala.html
@@ -2,6 +2,7 @@
 @import context._
 @import org.eclipse.jgit.diff.DiffEntry.ChangeType
 @diffs.zipWithIndex.map { case (diff, i) =>
+  <a name="diff-@i"></a>
   <table class="table table-bordered">
     <tr>
       <th style="font-weight: normal;" class="box-header">
@@ -27,7 +28,7 @@
           @if(diffs.size > 10 && diff.changeType != ChangeType.MODIFY){
             @diff.changeType
           } else {
-            <div id="diff-@i"></div>
+            <div id="diffText-@i"></div>
             <textarea id="newText-@i" style="display: none;">@diff.newContent.getOrElse("")</textarea>
             <textarea id="oldText-@i" style="display: none;">@diff.oldContent.getOrElse("")</textarea>
           }
@@ -95,7 +96,7 @@
   @diffs.zipWithIndex.map { case (diff, i) =>
     @if(diff.newContent != None || diff.oldContent != None){
       if($('#oldText-@i').length > 0){
-        diffUsingJS('oldText-@i', 'newText-@i', 'diff-@i');
+        diffUsingJS('oldText-@i', 'newText-@i', 'diffText-@i');
       }
     }
   }
diff --git a/src/main/twirl/repo/commit.scala.html b/src/main/twirl/repo/commit.scala.html
index 5a70f9b..49b0157 100644
--- a/src/main/twirl/repo/commit.scala.html
+++ b/src/main/twirl/repo/commit.scala.html
@@ -46,5 +46,59 @@
       </td>
     </tr>
   </table>
+  <div>
+    <div class="pull-right" style="margin-bottom: 10px;">
+      <input id="toggle-file-list" type="button" class="btn" value="Show file list"/>
+    </div>
+    @if(diffs.size == 1){
+      Showing 1 changed files
+    } else {
+      Showing @diffs.size changed files
+    }
+  </div>
+  <ul id="commit-file-list" style="display: none;">
+  @diffs.zipWithIndex.map { case (diff, i) =>
+    <li@if(i > 0){ class="border"}>
+      <a href="#diff-@i">
+        @if(diff.changeType == ChangeType.COPY || diff.changeType == ChangeType.RENAME){
+          <img src="@path/assets/common/images/page_edit.png"/> @diff.oldPath -> @diff.newPath
+        }
+        @if(diff.changeType == ChangeType.ADD){
+          <img src="@path/assets/common/images/page_add.png"/> @diff.newPath
+        }
+        @if(diff.changeType == ChangeType.MODIFY){
+          <img src="@path/assets/common/images/page_edit.png"/> @diff.newPath
+        }
+        @if(diff.changeType == ChangeType.DELETE){
+          <img src="@path/assets/common/images/page_delete.png"/> @diff.oldPath
+        }
+      </a>
+    </li>
+  }
+  </ul>
   @html.diff(diffs, repository, Some(commit.id))
 }
+<script>
+$(function(){
+  $('#toggle-file-list').click(function(){
+    $('#commit-file-list').toggle();
+    if($(this).val() == 'Show file list'){
+      $(this).val('Hide file list');
+    } else {
+      $(this).val('Show file list');
+    }
+  });
+});
+</script>
+<style type="text/css">
+ul#commit-file-list {
+  list-style-type: none;
+  padding-left: 0px;
+  margin-left: 0px;
+}
+
+ul#commit-file-list li.border {
+  padding-bottom: 2px;
+  border-top: 1px solid #eeeeee;
+}
+</style>
diff --git a/src/main/webapp/assets/common/images/page_add.png b/src/main/webapp/assets/common/images/page_add.png
new file mode 100644
index 0000000..d5bfa07
--- /dev/null
+++ b/src/main/webapp/assets/common/images/page_add.png
Binary files differ
diff --git a/src/main/webapp/assets/common/images/page_delete.png b/src/main/webapp/assets/common/images/page_delete.png
new file mode 100644
index 0000000..3141467
--- /dev/null
+++ b/src/main/webapp/assets/common/images/page_delete.png
Binary files differ
diff --git a/src/main/webapp/assets/common/images/page_edit.png b/src/main/webapp/assets/common/images/page_edit.png
new file mode 100644
index 0000000..046811e
--- /dev/null
+++ b/src/main/webapp/assets/common/images/page_edit.png
Binary files differ