web-apps/apps/common/main/lib/mods/perfect-scrollbar-patch-margins.diff

diff -r c7981f4f7e09 apps/common/main/lib/mods/perfect-scrollbar.js
--- a/apps/common/main/lib/mods/perfect-scrollbar.js	Tue Oct 07 11:32:00 2014 +0400
+++ b/apps/common/main/lib/mods/perfect-scrollbar.js	Wed Oct 08 11:37:27 2014 +0400
//  Use margins of scrollbarYRail when calculate scrollbarYRail height (scrollbarYRailHeight) and top position
@@ -28,7 +28,8 @@
     suppressScrollY: false,
     scrollXMarginOffset: 0,
     scrollYMarginOffset: 0,
-    includePadding: false
+    includePadding: false,
+    includeMargin: true
   };
 
   var getEventClassName = (function () {
@@ -97,11 +98,12 @@
           scrollbarYHeight,
           scrollbarYTop,
           scrollbarYRight = parseInt($scrollbarYRail.css('right'), 10),
+          scrollbarYRailHeight,
           eventClassName = getEventClassName();
 
       var updateContentScrollTop = function (currentTop, deltaY) {
         var newTop = currentTop + deltaY,
-            maxTop = containerHeight - scrollbarYHeight;
+            maxTop = scrollbarYRailHeight - scrollbarYHeight;
 
         if (newTop < 0) {
           scrollbarYTop = 0;
@@ -113,7 +115,7 @@
           scrollbarYTop = newTop;
         }
 
-        var scrollTop = parseInt(scrollbarYTop * (contentHeight - containerHeight) / (containerHeight - scrollbarYHeight), 10);
+        var scrollTop = parseInt(scrollbarYTop * (contentHeight - containerHeight) / (scrollbarYRailHeight - scrollbarYHeight), 10);
         $this.scrollTop(scrollTop);
         $scrollbarXRail.css({bottom: scrollbarXBottom - scrollTop});
       };
@@ -148,9 +150,9 @@
         $scrollbarXRail.css({left: $this.scrollLeft(), bottom: scrollbarXBottom - $this.scrollTop(), width: containerWidth, display: scrollbarXActive ? "inherit": "none"});
 
         if ($scrollbarYRail.hasClass('in-scrolling'))
-            $scrollbarYRail.css({/*top: $this.scrollTop(),*/ right: scrollbarYRight - $this.scrollLeft(), height: containerHeight, display: scrollbarYActive ? "inherit": "none"});
+            $scrollbarYRail.css({/*top: $this.scrollTop(),*/ right: scrollbarYRight - $this.scrollLeft(), height: scrollbarYRailHeight, display: scrollbarYActive ? "inherit": "none"});
         else
-            $scrollbarYRail.css({top: $this.scrollTop(), right: scrollbarYRight - $this.scrollLeft(), height: containerHeight, display: scrollbarYActive ? "inherit": "none"});
+            $scrollbarYRail.css({top: $this.scrollTop(), right: scrollbarYRight - $this.scrollLeft(), height: scrollbarYRailHeight, display: scrollbarYActive ? "inherit": "none"});
 
         $scrollbarX.css({left: scrollbarXLeft, width: scrollbarXWidth});
         $scrollbarY.css({top: scrollbarYTop, height: scrollbarYHeight});
@@ -159,6 +161,7 @@
       var updateBarSizeAndPosition = function () {
         containerWidth = settings.includePadding ? $this.innerWidth() : $this.width();
         containerHeight = settings.includePadding ? $this.innerHeight() : $this.height();
+        scrollbarYRailHeight = containerHeight - (settings.includeMargin ? (parseInt($scrollbarYRail.css('margin-top')) + parseInt($scrollbarYRail.css('margin-bottom'))): 0);
         contentWidth = $this.prop('scrollWidth');
         contentHeight = $this.prop('scrollHeight');
 
@@ -176,8 +179,8 @@
 
         if (!settings.suppressScrollY && containerHeight + settings.scrollYMarginOffset < contentHeight) {
           scrollbarYActive = true;
-          scrollbarYHeight = getSettingsAdjustedThumbSize(parseInt(containerHeight * containerHeight / contentHeight, 10));
-          scrollbarYTop = parseInt($this.scrollTop() * (containerHeight - scrollbarYHeight) / (contentHeight - containerHeight), 10);
+          scrollbarYHeight = getSettingsAdjustedThumbSize(parseInt(scrollbarYRailHeight * containerHeight / contentHeight, 10));
+          scrollbarYTop = parseInt($this.scrollTop() * (scrollbarYRailHeight - scrollbarYHeight) / (contentHeight - containerHeight), 10);
         }
         else {
           scrollbarYActive = false;
@@ -186,8 +189,8 @@
           $this.scrollTop(0);
         }
 
-        if (scrollbarYTop >= containerHeight - scrollbarYHeight) {
-          scrollbarYTop = containerHeight - scrollbarYHeight;
+        if (scrollbarYTop >= scrollbarYRailHeight - scrollbarYHeight) {
+          scrollbarYTop = scrollbarYRailHeight - scrollbarYHeight;
         }
         if (scrollbarXLeft >= containerWidth - scrollbarXWidth) {
           scrollbarXLeft = containerWidth - scrollbarXWidth;
@@ -235,12 +238,12 @@
           currentTop = $scrollbarY.position().top;
           $scrollbarYRail.addClass('in-scrolling');
 
-            var padding = parseInt($scrollbarYRail.offsetParent().css('padding-top'));
+            var margin = parseInt($scrollbarYRail.css('margin-top'));
             var rect = $scrollbarYRail[0].getBoundingClientRect();
             $scrollbarYRail.css({
                 position: 'fixed',
                 left: rect.left,
-                top: rect.top - padding
+                top: rect.top - margin
             });
 
           e.stopPropagation();
@@ -419,7 +422,7 @@
         $scrollbarYRail.bind('click' + eventClassName, function (e) {
           var halfOfScrollbarLength = parseInt(scrollbarYHeight / 2, 10),
               positionTop = e.pageY - $scrollbarYRail.offset().top - halfOfScrollbarLength,
-              maxPositionTop = containerHeight - scrollbarYHeight,
+              maxPositionTop = scrollbarYRailHeight - scrollbarYHeight,
               positionRatio = positionTop / maxPositionTop;
 
           if (positionRatio < 0) {