[gitg] Add expander to diff view



commit e34a2b669103078a71e202af3382bc4c4cf40917
Author: Sindhu S <sindhus live in>
Date:   Sun Jun 9 21:11:39 2013 +0530

    Add expander to diff view
    
    Add expander to expand or collapse diffs in diff view.

 libgitg-gtk/resources/diff-view-html-builder.js |    2 +-
 libgitg-gtk/resources/diff-view.css             |   19 +++++++++++++++++++
 libgitg-gtk/resources/diff-view.js              |   21 +++++++++++++++++++++
 3 files changed, 41 insertions(+), 1 deletions(-)
---
diff --git a/libgitg-gtk/resources/diff-view-html-builder.js b/libgitg-gtk/resources/diff-view-html-builder.js
index 10df3c6..3c30b64 100644
--- a/libgitg-gtk/resources/diff-view-html-builder.js
+++ b/libgitg-gtk/resources/diff-view-html-builder.js
@@ -106,7 +106,7 @@ function diff_file(file, lnstate, data)
        var addedp = Math.floor(added / total * 100);
        var removedp = 100 - addedp;
 
-       var stats = '<div class="stats"><span class="number">' + (added + removed)  + '</span><span 
class="bar"><span class="added" style="width: ' + addedp + '%;"></span><span class="removed" style="width: ' 
+ removedp + '%;"></span></span></div>';
+       var stats = '<div class="expander">-</div><div class="stats"><span class="number">' + (added + 
removed)  + '</span><span class="bar"><span class="added" style="width: ' + addedp + '%;"></span><span 
class="removed" style="width: ' + removedp + '%;"></span></span></div>';
 
        var template = data.file_template;
        var repls = {
diff --git a/libgitg-gtk/resources/diff-view.css b/libgitg-gtk/resources/diff-view.css
index 2a22f8b..d3a9193 100644
--- a/libgitg-gtk/resources/diff-view.css
+++ b/libgitg-gtk/resources/diff-view.css
@@ -96,6 +96,25 @@ div.file tr.file_header td {
   background: #d3d7cf;
 }
 
+div.expander {
+  float:left;
+
+  background-color: #ececec;
+  border-radius: 5px;
+  box-shadow: 1px 1px #ccc inset;
+  margin: 5px;
+  display: inline-block;
+  vertical-align: middle;
+  padding: 3px;
+  padding-left: 6px;
+  padding-right: 6px;
+  cursor: pointer;
+}
+
+tbody.collapsed > :not(.file_header) {
+  display:none;
+}
+
 div.stats {
   width: 75px;
   background-color: #ececec;
diff --git a/libgitg-gtk/resources/diff-view.js b/libgitg-gtk/resources/diff-view.js
index d990685..1b4ef80 100644
--- a/libgitg-gtk/resources/diff-view.js
+++ b/libgitg-gtk/resources/diff-view.js
@@ -169,6 +169,27 @@ function update_diff(id)
                        }
 
                        content.innerHTML = event.data.diff_html;
+
+                       $(".expander").click(function()
+                       {
+                               var expander = $(this);
+
+                               // If expanded, will be true
+                               var toExpand = expander.text() == "+";
+
+                               if (toExpand)
+                               {
+                                       // next step to close it
+                                       expander.text("-");
+                               }
+                               else
+                               {
+                                       // next step is to open it
+                                       expander.text("+");
+                               }
+
+                               expander.closest('tbody').toggleClass("collapsed");
+                       });
                }
        }
 


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]