From 391288d8611e58b7b7faee46d9aab5243e81e24b Mon Sep 17 00:00:00 2001
From: magnolia-fan <magnolia_fan@me.com>
Date: Tue, 28 Jun 2011 03:25:27 +0400
Subject: [PATCH] Scrolling fixes

---
 public/javascripts/jquery/jquery.scroll.js |  7 ++-
 public/stylesheets/_sass/misc.scss         | 69 ++++++++++++----------
 public/stylesheets/misc.css                | 29 +++++----
 3 files changed, 63 insertions(+), 42 deletions(-)

diff --git a/public/javascripts/jquery/jquery.scroll.js b/public/javascripts/jquery/jquery.scroll.js
index 87b6b86..1d990f2 100755
--- a/public/javascripts/jquery/jquery.scroll.js
+++ b/public/javascripts/jquery/jquery.scroll.js
@@ -188,6 +188,7 @@
             this.handleArrows =    this.container.find('.scrollbar-handle-up, .scrollbar-handle-down');
             this.handleArrowUp =   this.container.find('.scrollbar-handle-up');
             this.handleArrowDown = this.container.find('.scrollbar-handle-down');
+			this.pane_last_top = 0;
 
             // set some default CSS attributes (may be overwritten by CSS definitions in an external CSS file)
             this.pane.defaultCss({
@@ -388,7 +389,11 @@
             // derive position of content from position of handle 
             this.pane.top = -1 * this.props.handleContentRatio * this.handle.top;
 
+			// var distance = Math.round(Math.abs(this.pane_last_top - this.pane.top));			
+			// $(this.pane[0]).stop().animate({top: this.pane.top}, 10 * distance / Math.sqrt(distance));
+			
             this.pane[0].style.top = this.pane.top + 'px';
+			this.pane_last_top = this.pane.top;
         },
 
 
@@ -398,7 +403,7 @@
         onMouseWheel: function(ev, delta){
 
             // calculate new handle position
-            this.handle.top -= delta*5; // awfull fix
+            this.handle.top -= delta*15; // awfull fix
 
             this.setHandlePosition();
             this.setContentPosition();
diff --git a/public/stylesheets/_sass/misc.scss b/public/stylesheets/_sass/misc.scss
index f7ce722..dd04ca7 100644
--- a/public/stylesheets/_sass/misc.scss
+++ b/public/stylesheets/_sass/misc.scss
@@ -22,7 +22,9 @@
 }
 
 /* Scrollbars */
-.css-scrollbar {
+
+	
+.data-container {
 	.scrollbar-pane {
 	    margin-right: 8px;
 	}
@@ -34,42 +36,49 @@
 	.scrollbar-handle {
 	    width: 8px;
 	}
-	
-	&.data-container {
-		.scrollbar-handle-container {
-			background-color: #FFF;
-		}
-		.scrollbar-handle {
-			background-color: #CCC;
-			
-			&:hover {
-			    background-color: #999;
-			}
-			
-			&.move {
-			    background-color: #AAA;
-			}
-		}
+	.scrollbar-handle-container {
+		background-color: #FFF;
 	}
+	.scrollbar-handle {
+		background-color: #CCC;
 	
-	&.player-container {
-		.scrollbar-handle-container {
-			background-color: #222;
+		&:hover {
+		    background-color: #999;
 		}
-		.scrollbar-handle {
-			background-color: #444;
-			
-			&:hover {
-			    background-color: #666;
-			}
-			
-			&.move {
-			    background-color: #888;
-			}
+	
+		&.move {
+		    background-color: #AAA;
 		}
 	}
 }
 
+.player-container {
+	.scrollbar-pane {
+	    margin-right: 8px;
+	}
+
+	.scrollbar-handle-container {
+	    width: 8px;
+	}
+
+	.scrollbar-handle {
+	    width: 8px;
+	}
+	.scrollbar-handle-container {
+		background-color: #222;
+	}
+	.scrollbar-handle {
+		background-color: #444;
+	
+		&:hover {
+		    background-color: #666;
+		}
+	
+		&.move {
+		    background-color: #888;
+		}
+	}
+}
 
 .error_page {
 	position: relative;
diff --git a/public/stylesheets/misc.css b/public/stylesheets/misc.css
index 3270531..339f220 100644
--- a/public/stylesheets/misc.css
+++ b/public/stylesheets/misc.css
@@ -18,27 +18,34 @@
     border-color: #DDD; }
 
 /* Scrollbars */
-.css-scrollbar .scrollbar-pane {
+.data-container .scrollbar-pane {
   margin-right: 8px; }
-.css-scrollbar .scrollbar-handle-container {
+.data-container .scrollbar-handle-container {
   width: 8px; }
-.css-scrollbar .scrollbar-handle {
+.data-container .scrollbar-handle {
   width: 8px; }
-.css-scrollbar.data-container .scrollbar-handle-container {
+.data-container .scrollbar-handle-container {
   background-color: #FFF; }
-.css-scrollbar.data-container .scrollbar-handle {
+.data-container .scrollbar-handle {
   background-color: #CCC; }
-  .css-scrollbar.data-container .scrollbar-handle:hover {
+  .data-container .scrollbar-handle:hover {
     background-color: #999; }
-  .css-scrollbar.data-container .scrollbar-handle.move {
+  .data-container .scrollbar-handle.move {
     background-color: #AAA; }
-.css-scrollbar.player-container .scrollbar-handle-container {
+
+.player-container .scrollbar-pane {
+  margin-right: 8px; }
+.player-container .scrollbar-handle-container {
+  width: 8px; }
+.player-container .scrollbar-handle {
+  width: 8px; }
+.player-container .scrollbar-handle-container {
   background-color: #222; }
-.css-scrollbar.player-container .scrollbar-handle {
+.player-container .scrollbar-handle {
   background-color: #444; }
-  .css-scrollbar.player-container .scrollbar-handle:hover {
+  .player-container .scrollbar-handle:hover {
     background-color: #666; }
-  .css-scrollbar.player-container .scrollbar-handle.move {
+  .player-container .scrollbar-handle.move {
     background-color: #888; }
 
 .error_page {