From a123b0840e839a6226f98ffcde7349473593acf9 Mon Sep 17 00:00:00 2001
From: David Huynh <dfhuynh@gmail.com>
Date: Wed, 3 Feb 2010 07:54:23 +0000
Subject: [PATCH] Styled the history widget and hopefully made it more
 comprehensible.

git-svn-id: http://google-refine.googlecode.com/svn/trunk@30 7d457c2a-affb-35e4-300a-418c747d4874
---
 src/main/webapp/images/down-arrow.png         | Bin 0 -> 215 bytes
 src/main/webapp/images/up-arrow.png           | Bin 0 -> 211 bytes
 .../webapp/scripts/project/history-widget.js  |   8 +++--
 src/main/webapp/styles/history.css            |  29 ++++++++++++++----
 4 files changed, 28 insertions(+), 9 deletions(-)
 create mode 100644 src/main/webapp/images/down-arrow.png
 create mode 100644 src/main/webapp/images/up-arrow.png

diff --git a/src/main/webapp/images/down-arrow.png b/src/main/webapp/images/down-arrow.png
new file mode 100644
index 0000000000000000000000000000000000000000..1b3eadf9cdf43a9a8d73f4263728e686bea96b57
GIT binary patch
literal 215
zcmeAS@N?(olHy`uVBq!ia0vp^AT}EZ8<70<f&UngVo7)Ob!1@J*jMvAa59jukn9oU
z%fL{j%D~Xj%)s#TKahUOz))(y!0;-8fx&791A}<}r1+z5K((9&9+AZi40?(n%*Y=7
z2dJ1qqQo_#Bsf2<q&%@Gl_4N8Gp|I?&oxA$%vjIZY~}MuK!X`HJzX3_B*K#u6nJke
zF*LaG=Xhgdkp{!+q!L#HS&gnjO{YK~55c_oj11||g|Ds>{-y`i#Ng@b=d#Wzp$Pzm
C%{(Lk

literal 0
HcmV?d00001

diff --git a/src/main/webapp/images/up-arrow.png b/src/main/webapp/images/up-arrow.png
new file mode 100644
index 0000000000000000000000000000000000000000..ec028b04621cd1a235e6725d86192411cae3a976
GIT binary patch
literal 211
zcmeAS@N?(olHy`uVBq!ia0vp^AT}EZ8<70<f&UngVo7)Ob!1@J*jMvAa59jukn9oU
z%fL{j%D~Xj%)s#TKahUOz))(y!0;-8fx&791A}<}r1+z5K((9&9+AZi40?(n%*Y=7
z2dJ1qqQo_#Bsf2<q&%@Gl_4N8Gp|I?&oxA$%vjIZY~}MuK!X`nJzX3_B*K#u6y$F#
yF*Il}h+_!*BHvZ0=@!`HZ5Za-;&bes8AI86;j1^#?8yddVDNPHb6Mw<&;$U6%sZa|

literal 0
HcmV?d00001

diff --git a/src/main/webapp/scripts/project/history-widget.js b/src/main/webapp/scripts/project/history-widget.js
index 4d7e5f9ed..05c3725b2 100644
--- a/src/main/webapp/scripts/project/history-widget.js
+++ b/src/main/webapp/scripts/project/history-widget.js
@@ -19,7 +19,7 @@ HistoryWidget.prototype._render = function() {
     
     this._div.empty();
     
-    $('<h3>History</h3>').appendTo(this._div);
+    $('<h3>History for Undo/Redo</h3>').appendTo(this._div);
     
     var bodyDiv = $('<div></div>').addClass("history-panel-body").appendTo(this._div);
     bodyDiv.mouseover(function() {
@@ -43,17 +43,19 @@ HistoryWidget.prototype._render = function() {
     } else {
         for (var i = 0; i < this._data.past.length; i++) {
             var entry = this._data.past[i];
-            lastPast = renderEntry(divPast, entry, i == 0 ? 0 : this._data.past[i - 1].id, "Undo upto and including this change");
+            lastPast = renderEntry(divPast, entry, i == 0 ? 0 : this._data.past[i - 1].id, "Undo to here");
         }
     }
     
+    $('<div></div>').text("done upto here").addClass("history-now").appendTo(bodyDiv);
+    
     var divFuture = $('<div></div>').addClass("history-future").appendTo(bodyDiv);
     if (this._data.future.length == 0) {
         $('<div></div>').addClass("history-panel-message").text("No change to redo").appendTo(divFuture);
     } else {
         for (var i = 0; i < this._data.future.length; i++) {
             var entry = this._data.future[i];
-            renderEntry(divFuture, entry, entry.id, "Redo upto and including this change");
+            renderEntry(divFuture, entry, entry.id, "Redo to here");
         }
     }
     
diff --git a/src/main/webapp/styles/history.css b/src/main/webapp/styles/history.css
index 4bfc0873c..c1ddcb4eb 100644
--- a/src/main/webapp/styles/history.css
+++ b/src/main/webapp/styles/history.css
@@ -26,27 +26,44 @@
 
 .history-past {
     padding-bottom: 3px;
-    border-bottom: 2px solid #f88;
+}
+.history-now {
+    padding: 1px;
+    background: #f88;
+    color: white;
+    font-size: 80%;
+    text-align: center;
+    font-variant: small-caps;
+    font-weight: bold;
 }
 .history-future {
     padding-top: 3px;
 }
 a.history-entry {
     display: block;
-    padding: 3px 5px;
+    padding: 7px 5px;
     text-decoration: none;
     color: black;
-    border-top: 1px solid #eee;
+    border-top: 1px solid #ddd;
 }
 a.history-entry:first-child {
     border-top: none;
 }
 a.history-entry:hover {
-    background: #eee;
-    color: #a88;
+    background: #ddd;
+}
+
+.history-past a.history-entry:hover{
+    padding: 11px 5px 2px 5px;
+    border-top: 2px solid red;
+    background: url(../images/up-arrow.png) top center no-repeat;
+}
+.history-future a.history-entry:hover{
+    padding: 2px 5px 11px 5px;
+    border-bottom: 2px solid red;
+    background: url(../images/down-arrow.png) bottom center no-repeat;
 }
 
 .history-future a.history-entry {
     color: #888;
-    font-style: italic;
 }