From fe43f60b3d978b38ed9f7d4a901e6312d41de886 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Thu, 17 Nov 2016 12:02:45 +0000
Subject: [PATCH] Offset review panel when Ace scrollbar is visibl.e

---
 .../review-panel/controllers/ReviewPanelController.coffee | 8 ++++++++
 .../ide/review-panel/directives/reviewPanelSorted.coffee  | 4 ----
 .../web/public/stylesheets/app/editor/review-panel.less   | 3 +++
 3 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee b/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
index fe9566870d..b5217721e9 100644
--- a/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
+++ b/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
@@ -5,6 +5,8 @@ define [
 	"ide/review-panel/ChangesTracker"
 ], (App, EventEmitter, ColorManager, ChangesTracker) ->
 	App.controller "ReviewPanelController", ($scope, $element, ide, $timeout) ->
+		$reviewPanelEl = $element.find "#review-panel"
+
 		$scope.SubViews =
 			CUR_FILE : "cur_file"
 			OVERVIEW : "overview"
@@ -21,6 +23,12 @@ define [
 
 		$scope.reviewPanelEventsBridge = new EventEmitter()
 
+		$scope.reviewPanelEventsBridge.on "aceScrollbarVisibilityChanged", (isVisible, scrollbarWidth) ->
+			if isVisible
+				$reviewPanelEl.css "right", "#{ scrollbarWidth }px"
+			else
+				$reviewPanelEl.css "right", "0"
+
 		changesTrackers = {}
 
 		$scope.$watch "editor.open_doc_id", (open_doc_id) ->
diff --git a/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee b/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
index 7443dd5fa1..4a0aeea5a2 100644
--- a/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
+++ b/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
@@ -111,9 +111,6 @@ define [
 				# need to trigger the event back to the original panel.
 				ignoreNextPanelEvent = false
 				ignoreNextAceEvent = false
-			
-				handleScrollbarVisibilityChanged = (isVisible, scrollbarWidth) ->
-					console.log isVisible, scrollbarWidth
 
 				scrollPanel = (scrollTop, height) ->
 					if ignoreNextAceEvent
@@ -132,5 +129,4 @@ define [
 						scope.reviewPanelEventsBridge.emit "externalScroll", scrollTop
 				
 				scope.reviewPanelEventsBridge.on "aceScroll", scrollPanel
-				scope.reviewPanelEventsBridge.on "aceScrollbarVisibilityChanged", handleScrollbarVisibilityChanged
 		}	
diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 4e0e5cca44..1ea717ecd3 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -485,6 +485,9 @@
 		right: @review-off-width;
 		.ace-editor-body {
 			overflow: visible;
+			.ace_scrollbar-v {
+				right: -@review-off-width;
+			}
 		}
 	}
 }