From a639f13cb624c799d8c70964d8ded5dc66406a38 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Thu, 16 Feb 2017 15:48:58 +0000
Subject: [PATCH 01/33] Bootstrap collapsing behavior in files list. Store
 state.

---
 .../app/views/project/editor/review-panel.pug | 53 +++++++++++--------
 .../controllers/ReviewPanelController.coffee  |  3 ++
 .../stylesheets/app/editor/review-panel.less  | 10 ++++
 3 files changed, 43 insertions(+), 23 deletions(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 72e6640cdb..37490227df 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -92,32 +92,39 @@
 		)
 			.rp-overview-file-header(
 				ng-if="reviewPanel.entries[doc.doc.id] | notEmpty"
+				ng-click="reviewPanel.overview.docsCollapsedState[doc.doc.id] = ! reviewPanel.overview.docsCollapsedState[doc.doc.id]"
 			)
 				| {{ doc.path }}
-			.rp-entry-wrapper(
-				ng-repeat="(entry_id, entry) in reviewPanel.entries[doc.doc.id] | orderOverviewEntries"
-				ng-if="!(entry.type === 'comment' && reviewPanel.commentThreads[entry.thread_id].resolved === true)"
-			)
-				div(ng-if="entry.type === 'insert' || entry.type === 'delete'")
-					change-entry(
-						entry="entry"
-						user="users[entry.metadata.user_id]"
-						on-indicator-click="toggleReviewPanel();"
-						ng-click="gotoEntry(doc.doc.id, entry)"
-						permissions="permissions"
-					)
+				span.rp-overview-file-header-collapse(
+					ng-class="{ 'rp-overview-file-header-collapse-on': reviewPanel.overview.docsCollapsedState[doc.doc.id] }"
+				)
+					i.fa.fa-angle-down
 
-				div(ng-if="entry.type === 'comment'")
-					comment-entry(
-						entry="entry"
-						threads="reviewPanel.commentThreads"
-						on-reply="submitReply(entry, entry_id);"
-						on-save-edit="saveEdit(entry.thread_id, comment)"
-						on-delete="deleteComment(entry.thread_id, comment)"
-						on-indicator-click="toggleReviewPanel();"
-						ng-click="gotoEntry(doc.doc.id, entry)"
-						permissions="permissions"
-					)
+			.rp-overview-file-entries(ng-class="{ 'rp-overview-file-entries-collapsed' : reviewPanel.overview.docsCollapsedState[doc.doc.id] }")
+				.rp-entry-wrapper(
+					ng-repeat="(entry_id, entry) in reviewPanel.entries[doc.doc.id] | orderOverviewEntries"
+					ng-if="!(entry.type === 'comment' && reviewPanel.commentThreads[entry.thread_id].resolved === true)"
+				)
+					div(ng-if="entry.type === 'insert' || entry.type === 'delete'")
+						change-entry(
+							entry="entry"
+							user="users[entry.metadata.user_id]"
+							on-indicator-click="toggleReviewPanel();"
+							ng-click="gotoEntry(doc.doc.id, entry)"
+							permissions="permissions"
+						)
+
+					div(ng-if="entry.type === 'comment'")
+						comment-entry(
+							entry="entry"
+							threads="reviewPanel.commentThreads"
+							on-reply="submitReply(entry, entry_id);"
+							on-save-edit="saveEdit(entry.thread_id, comment)"
+							on-delete="deleteComment(entry.thread_id, comment)"
+							on-indicator-click="toggleReviewPanel();"
+							ng-click="gotoEntry(doc.doc.id, entry)"
+							permissions="permissions"
+						)
 
 	.rp-nav
 		a.rp-nav-item(
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 88a3233934..07f429036f 100644
--- a/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
+++ b/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
@@ -19,6 +19,7 @@ define [
 			openSubView: $scope.SubViews.CUR_FILE
 			overview:
 				loading: false
+				docsCollapsedState: {}
 			dropdown:
 				loading: false
 			commentThreads: {}
@@ -171,6 +172,8 @@ define [
 			$http.get "/project/#{$scope.project_id}/ranges"
 				.success (docs) ->
 					for doc in docs
+						if !$scope.reviewPanel.overview.docsCollapsedState[doc.id]?
+							$scope.reviewPanel.overview.docsCollapsedState[doc.id] = false
 						if doc.id != $scope.editor.open_doc_id # this is kept up to date in real-time, don't overwrite
 							rangesTracker = getChangeTracker(doc.id)
 							rangesTracker.comments = doc.ranges?.comments or []
diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 1d1900c90c..394468a026 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -567,7 +567,17 @@
 	margin-top: 10px;
 	font-weight: @rp-semibold-weight;
 	text-align: center;
+	cursor: pointer;
 }
+	.rp-overview-file-header-collapse {
+		display: inline-block;
+		float: right;
+		transform: rotateZ(0deg);
+		transition: transform 0.15s ease
+	}
+	.rp-overview-file-header-collapse-on {
+		transform: rotateZ(180deg);
+	}
 
 .rp-comment-wrapper {
 	transition: .35s opacity ease-out .2s;

From 0841ab82789cd447863b2be3341ef31f3a433d44 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 17 Feb 2017 11:24:21 +0000
Subject: [PATCH 02/33] Add directive to collapse elements via height.

---
 services/web/app/views/project/editor/review-panel.pug      | 4 +++-
 .../coffee/ide/review-panel/ReviewPanelManager.coffee       | 1 +
 .../web/public/stylesheets/app/editor/review-panel.less     | 6 ++++++
 3 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 37490227df..5b12eff9de 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -100,7 +100,9 @@
 				)
 					i.fa.fa-angle-down
 
-			.rp-overview-file-entries(ng-class="{ 'rp-overview-file-entries-collapsed' : reviewPanel.overview.docsCollapsedState[doc.doc.id] }")
+			.rp-overview-file-entries(
+				review-panel-collapse-height="reviewPanel.overview.docsCollapsedState[doc.doc.id]"
+			)
 				.rp-entry-wrapper(
 					ng-repeat="(entry_id, entry) in reviewPanel.entries[doc.doc.id] | orderOverviewEntries"
 					ng-if="!(entry.type === 'comment' && reviewPanel.commentThreads[entry.thread_id].resolved === true)"
diff --git a/services/web/public/coffee/ide/review-panel/ReviewPanelManager.coffee b/services/web/public/coffee/ide/review-panel/ReviewPanelManager.coffee
index 1565d6db73..4e0b70768c 100644
--- a/services/web/public/coffee/ide/review-panel/ReviewPanelManager.coffee
+++ b/services/web/public/coffee/ide/review-panel/ReviewPanelManager.coffee
@@ -8,6 +8,7 @@ define [
 	"ide/review-panel/directives/addCommentEntry"
 	"ide/review-panel/directives/resolvedCommentEntry"
 	"ide/review-panel/directives/resolvedCommentsDropdown"
+	"ide/review-panel/directives/reviewPanelCollapseHeight"
 	"ide/review-panel/filters/notEmpty"
 	"ide/review-panel/filters/orderOverviewEntries"
 ], () ->
\ No newline at end of file
diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 394468a026..62f3a0e16b 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -575,10 +575,16 @@
 		transform: rotateZ(0deg);
 		transition: transform 0.15s ease
 	}
+	
 	.rp-overview-file-header-collapse-on {
 		transform: rotateZ(180deg);
 	}
 
+	.rp-overview-file-entries {
+		overflow: hidden;
+		transition: height .15s;
+	}
+
 .rp-comment-wrapper {
 	transition: .35s opacity ease-out .2s;
 

From 71cfc863b589d3b0c7859a5b2046168829fae125 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 17 Feb 2017 11:24:50 +0000
Subject: [PATCH 03/33] Avoid blank screen bug, when triggered by very large
 comments.

---
 services/web/public/stylesheets/app/editor/review-panel.less | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 62f3a0e16b..83c9d48514 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -158,6 +158,8 @@
 		position: absolute;
 		top: 0;
 		bottom: 0;
+		padding-bottom: 52px;
+		overflow: hidden;
 	}
 	
 	.rp-state-overview & {

From cd2c8e71995ccc63e458ea53af1def8321c6122a Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 17 Feb 2017 11:54:33 +0000
Subject: [PATCH 04/33] Add directive based on jQuery animation API.

---
 .../directives/reviewPanelCollapseHeight.coffee   | 15 +++++++++++++++
 1 file changed, 15 insertions(+)
 create mode 100644 services/web/public/coffee/ide/review-panel/directives/reviewPanelCollapseHeight.coffee

diff --git a/services/web/public/coffee/ide/review-panel/directives/reviewPanelCollapseHeight.coffee b/services/web/public/coffee/ide/review-panel/directives/reviewPanelCollapseHeight.coffee
new file mode 100644
index 0000000000..859e04aac7
--- /dev/null
+++ b/services/web/public/coffee/ide/review-panel/directives/reviewPanelCollapseHeight.coffee
@@ -0,0 +1,15 @@
+define [
+	"base"
+], (App) ->
+	App.directive "reviewPanelCollapseHeight", ($parse) ->
+		return {
+			restrict: "A",
+			link: (scope, element, attrs) ->
+				scope.$watch (() -> $parse(attrs.reviewPanelCollapseHeight)(scope)), (shouldCollapse) ->
+					neededHeight = element.prop("scrollHeight")
+					if neededHeight > 0
+						if shouldCollapse
+							element.animate { height: 0 }, 150
+						else
+							element.animate { height: neededHeight }, 150
+		}
\ No newline at end of file

From 1f92a494e7c0f45b305c78c70408ad4a8bb2ac29 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 17 Feb 2017 11:55:20 +0000
Subject: [PATCH 05/33] Remove unneeded CSS animation.

---
 services/web/app/views/project/editor/review-panel.pug       | 2 +-
 services/web/public/stylesheets/app/editor/review-panel.less | 1 -
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 5b12eff9de..3a69f0c759 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -98,7 +98,7 @@
 				span.rp-overview-file-header-collapse(
 					ng-class="{ 'rp-overview-file-header-collapse-on': reviewPanel.overview.docsCollapsedState[doc.doc.id] }"
 				)
-					i.fa.fa-angle-down
+					i.fa.fa-angle-up
 
 			.rp-overview-file-entries(
 				review-panel-collapse-height="reviewPanel.overview.docsCollapsedState[doc.doc.id]"
diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 83c9d48514..3cf61f4d50 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -584,7 +584,6 @@
 
 	.rp-overview-file-entries {
 		overflow: hidden;
-		transition: height .15s;
 	}
 
 .rp-comment-wrapper {

From 1e66c46ca782b4141e18459eb4b325f758b3889e Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 17 Feb 2017 14:31:50 +0000
Subject: [PATCH 06/33] Add filter to retrieve number of keys in objects.

---
 .../public/coffee/ide/review-panel/ReviewPanelManager.coffee | 1 +
 .../public/coffee/ide/review-panel/filters/numKeys.coffee    | 5 +++++
 2 files changed, 6 insertions(+)
 create mode 100644 services/web/public/coffee/ide/review-panel/filters/numKeys.coffee

diff --git a/services/web/public/coffee/ide/review-panel/ReviewPanelManager.coffee b/services/web/public/coffee/ide/review-panel/ReviewPanelManager.coffee
index 4e0b70768c..9b622ffa05 100644
--- a/services/web/public/coffee/ide/review-panel/ReviewPanelManager.coffee
+++ b/services/web/public/coffee/ide/review-panel/ReviewPanelManager.coffee
@@ -10,5 +10,6 @@ define [
 	"ide/review-panel/directives/resolvedCommentsDropdown"
 	"ide/review-panel/directives/reviewPanelCollapseHeight"
 	"ide/review-panel/filters/notEmpty"
+	"ide/review-panel/filters/numKeys"
 	"ide/review-panel/filters/orderOverviewEntries"
 ], () ->
\ No newline at end of file
diff --git a/services/web/public/coffee/ide/review-panel/filters/numKeys.coffee b/services/web/public/coffee/ide/review-panel/filters/numKeys.coffee
new file mode 100644
index 0000000000..4a37638c1e
--- /dev/null
+++ b/services/web/public/coffee/ide/review-panel/filters/numKeys.coffee
@@ -0,0 +1,5 @@
+define [
+	"base"
+], (App) ->
+	app.filter "numKeys", () ->
+		(object) -> Object.keys(object).length

From 121b783b4ac42660ae1f89b36fcb4b027ce397f7 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 17 Feb 2017 14:32:06 +0000
Subject: [PATCH 07/33] Show number of entries per file, when collapsed.

---
 services/web/app/views/project/editor/review-panel.pug       | 3 +++
 services/web/public/stylesheets/app/editor/review-panel.less | 5 +++++
 2 files changed, 8 insertions(+)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 3a69f0c759..16126dc03f 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -95,6 +95,9 @@
 				ng-click="reviewPanel.overview.docsCollapsedState[doc.doc.id] = ! reviewPanel.overview.docsCollapsedState[doc.doc.id]"
 			)
 				| {{ doc.path }}
+				span.rp-overview-file-num-entries(
+					ng-show="reviewPanel.overview.docsCollapsedState[doc.doc.id]"
+				) &nbsp;({{ reviewPanel.entries[doc.doc.id] | numKeys }})
 				span.rp-overview-file-header-collapse(
 					ng-class="{ 'rp-overview-file-header-collapse-on': reviewPanel.overview.docsCollapsedState[doc.doc.id] }"
 				)
diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 3cf61f4d50..52e217a71d 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -571,6 +571,11 @@
 	text-align: center;
 	cursor: pointer;
 }
+
+	.rp-overview-file-num-entries {
+		font-weight: normal;
+		font-size: 0.9em;
+	}
 	.rp-overview-file-header-collapse {
 		display: inline-block;
 		float: right;

From e9752b4d10362051dc71a78f082584e66ad3a336 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 17 Feb 2017 11:24:50 +0000
Subject: [PATCH 08/33] Avoid blank screen bug, when triggered by very large
 comments.

---
 services/web/public/stylesheets/app/editor/review-panel.less | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 1d1900c90c..e82170de91 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -158,6 +158,8 @@
 		position: absolute;
 		top: 0;
 		bottom: 0;
+		padding-bottom: 52px;
+		overflow: hidden;
 	}
 	
 	.rp-state-overview & {

From 2eb9058c7c972e1d015aabed8d4d4c92ec8820a8 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Fri, 17 Feb 2017 15:16:35 +0000
Subject: [PATCH 09/33] Add max-height to comment inputs.

---
 services/web/public/stylesheets/app/editor/review-panel.less | 1 +
 1 file changed, 1 insertion(+)

diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index e82170de91..8e35a6abcf 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -463,6 +463,7 @@
 		margin-top: 3px;
 		overflow-x: hidden;
 		min-height: 3em;
+		max-height: 400px;
 	}
 
 .rp-icon-delete {

From f180b258503802351d07e4925b45f22dba98d03f Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Fri, 17 Feb 2017 16:28:53 +0100
Subject: [PATCH 10/33] Convert track changes text to translation strings

---
 .../web/app/views/project/editor/header.pug   |  2 +-
 .../app/views/project/editor/review-panel.pug | 80 +++++++++----------
 services/web/package.json                     |  4 +-
 3 files changed, 40 insertions(+), 46 deletions(-)

diff --git a/services/web/app/views/project/editor/header.pug b/services/web/app/views/project/editor/header.pug
index 2817efa814..fe3732de97 100644
--- a/services/web/app/views/project/editor/header.pug
+++ b/services/web/app/views/project/editor/header.pug
@@ -93,7 +93,7 @@ header.toolbar.toolbar-header.toolbar-with-labels(
 		)
 			i.review-icon
 			p.toolbar-label
-				| Review
+				| #{translate("review")}
 				span(style="vertical-align: 20%; margin-left: 4px; padding: 2px 4px;").beta-feature-badge
 		a.btn.btn-full-height(
 			href,
diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 93ff664eed..5b68fd1bfc 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -4,9 +4,7 @@
 		ng-if="editor.wantTrackChanges"
 		ng-click="toggleReviewPanel();"
 		ng-class="{ 'rp-track-changes-indicator-on-dark' : darkTheme }"
-	) Track changes is 
-		strong on
-			
+	) !{translate("track_changes_is_on")}
 	.review-panel-toolbar
 		resolved-comments-dropdown(
 			class="rp-flex-block"
@@ -21,10 +19,8 @@
 			permissions="permissions"
 		)
 		span.review-panel-toolbar-label(ng-if="permissions.write")
-			span(ng-click="toggleTrackChanges(true)", ng-if="editor.wantTrackChanges === false") Track Changes is 
-				strong off
-			span(ng-click="toggleTrackChanges(false)", ng-if="editor.wantTrackChanges === true") Track Changes is 
-				strong on
+			span(ng-click="toggleTrackChanges(true)", ng-if="editor.wantTrackChanges === false") !{translate("track_changes_is_off")}
+			span(ng-click="toggleTrackChanges(false)", ng-if="editor.wantTrackChanges === true") !{translate("track_changes_is_on")}
 			review-panel-toggle(
 				ng-if="editor.wantTrackChanges == editor.trackChanges"
 				ng-model="editor.wantTrackChanges"
@@ -33,10 +29,8 @@
 				on-disabled-click="openTrackChangesUpgradeModal"
 			)
 		span.review-panel-toolbar-label.review-panel-toolbar-label-disabled(ng-if="!permissions.write")
-			span(ng-if="editor.wantTrackChanges === false") Track Changes is 
-				strong off
-			span(ng-if="editor.wantTrackChanges === true") Track Changes is 
-				strong on
+			span(ng-if="editor.wantTrackChanges === false") !{translate("track_changes_is_off")}
+			span(ng-if="editor.wantTrackChanges === true") !{translate("track_changes_is_on")}
 		span.review-panel-toolbar-spinner(ng-if="editor.wantTrackChanges != editor.trackChanges")
 			i.fa.fa-spin.fa-spinner
 
@@ -127,14 +121,14 @@
 			ng-class="{ 'rp-nav-item-active' : reviewPanel.subView === SubViews.CUR_FILE }"
 		)
 			i.fa.fa-file-text-o
-			span.rp-nav-label Current file
+			span.rp-nav-label #{translate("current_file")}
 		a.rp-nav-item(
 			href
 			ng-click="setSubView(SubViews.OVERVIEW);"
 			ng-class="{ 'rp-nav-item-active' : reviewPanel.subView === SubViews.OVERVIEW }"
 		)
 			i.fa.fa-list
-			span.rp-nav-label Overview
+			span.rp-nav-label #{translate("overview")}
 
 
 script(type='text/ng-template', id='changeEntryTemplate')
@@ -158,30 +152,30 @@ script(type='text/ng-template', id='changeEntryTemplate')
 					i.rp-icon-delete(ng-switch-when="delete")
 				.rp-entry-details
 					.rp-entry-description(ng-switch="entry.type")
-						span(ng-switch-when="insert") Added&nbsp;
+						span(ng-switch-when="insert") #{translate("tracked_change_added")}&nbsp;
 							ins.rp-content-highlight {{ entry.content | limitTo:(isCollapsed ? contentLimit : entry.content.length) }}
 							a.rp-collapse-toggle(
 								href
 								ng-if="needsCollapsing"
 								ng-click="toggleCollapse();"
-							) {{ isCollapsed ? '... (show all)' : ' (show less)' }}
-						span(ng-switch-when="delete") Deleted&nbsp;
+							) {{ isCollapsed ? '... (#{translate("show_all")})' : ' (#{translate("show_less")})' }}
+						span(ng-switch-when="delete") #{translate("tracked_change_deleted")}&nbsp;
 							del.rp-content-highlight {{ entry.content | limitTo:(isCollapsed ? contentLimit : entry.content.length) }}
 							a.rp-collapse-toggle(
 								href
 								ng-if="needsCollapsing"
 								ng-click="toggleCollapse();"
-							) {{ isCollapsed ? '... (show all)' : ' (show less)' }}
+							) {{ isCollapsed ? '... (#{translate("show_all")})' : ' (#{translate("show_less")})' }}
 					.rp-entry-metadata
 						| {{ entry.metadata.ts | date : 'MMM d, y h:mm a' }}&nbsp;&bull;&nbsp;
 						span.rp-entry-user(style="color: hsl({{ user.hue }}, 70%, 40%);") {{ user.name }} 
 			.rp-entry-actions(ng-if="permissions.write")
 				a.rp-entry-button(href, ng-click="onReject();") 
 					i.fa.fa-times
-					| &nbsp;Reject
+					| &nbsp;#{translate("reject")}
 				a.rp-entry-button(href, ng-click="onAccept();") 
 					i.fa.fa-check
-					| &nbsp;Accept
+					| &nbsp;#{translate("accept")}
 
 script(type='text/ng-template', id='commentEntryTemplate')
 	.rp-comment-wrapper(
@@ -198,7 +192,7 @@ script(type='text/ng-template', id='commentEntryTemplate')
 		)
 
 			.rp-loading(ng-if="!threads[entry.thread_id].submitting && (!threads[entry.thread_id] || threads[entry.thread_id].messages.length == 0)")
-				| No comments
+				| #{translate("no_comments")}
 			.rp-comment-loaded
 				.rp-comment(
 					ng-repeat="comment in threads[entry.thread_id].messages track by comment.id"
@@ -222,16 +216,16 @@ script(type='text/ng-template', id='commentEntryTemplate')
 						span(ng-if="!comment.deleting") {{ comment.timestamp | date : 'MMM d, y h:mm a' }}
 						span.rp-comment-actions(ng-if="comment.user.isSelf && !comment.deleting")
 							| &nbsp;&bull;&nbsp;
-							a(href, ng-click="startEditing(comment)") Edit
+							a(href, ng-click="startEditing(comment)") #{translate("edit")}
 							span(ng-if="threads[entry.thread_id].messages.length > 1")
 								| &nbsp;&bull;&nbsp;
-								a(href, ng-click="confirmDelete(comment)") Delete
+								a(href, ng-click="confirmDelete(comment)") #{translate("delete")}
 						span.rp-confim-delete(ng-if="comment.user.isSelf && comment.deleting")
-							| Are you sure?
+							| #{translate("are_you_sure")}
 							| &bull;&nbsp;
-							a(href, ng-click="doDelete(comment)") Delete
+							a(href, ng-click="doDelete(comment)") #{translate("delete")}
 							| &nbsp;&bull;&nbsp;
-							a(href, ng-click="cancelDelete(comment)") Cancel
+							a(href, ng-click="cancelDelete(comment)") #{translate("cancel")}
 
 			.rp-loading(ng-if="threads[entry.thread_id].submitting")
 				i.fa.fa-spinner.fa-spin
@@ -249,20 +243,20 @@ script(type='text/ng-template', id='commentEntryTemplate')
 					ng-if="permissions.comment && permissions.write"
 				) 
 					i.fa.fa-inbox
-					| &nbsp;Resolve
+					| &nbsp;#{translate("resolve")}
 				button.rp-entry-button(
 					ng-click="onReply();"
 					ng-if="permissions.comment"
 					ng-disabled="!entry.replyContent.length"
 				)
 					i.fa.fa-reply
-					| &nbsp;Reply
+					| &nbsp;#{translate("reply")}
 	
 script(type='text/ng-template', id='resolvedCommentEntryTemplate')
 	.rp-resolved-comment
 		div
 			.rp-resolved-comment-context
-				| Quoted text on&nbsp;
+				| #{translate("quoted_text_in")}&nbsp;
 				span.rp-resolved-comment-context-file {{ thread.docName }}
 				p.rp-resolved-comment-context-quote
 					span {{ thread.content | limitTo:(isCollapsed ? contentLimit : thread.content.length)}}
@@ -270,7 +264,7 @@ script(type='text/ng-template', id='resolvedCommentEntryTemplate')
 						href
 						ng-if="needsCollapsing"
 						ng-click="toggleCollapse();"
-					) &nbsp;{{ isCollapsed ? '... (show all)' : ' (show less)' }}
+					) &nbsp;{{ isCollapsed ? '... (#{translate("show_all")})' : ' (#{translate("show_less")})' }}
 			.rp-comment(
 				ng-repeat="comment in thread.messages track by comment.id"
 			)
@@ -287,7 +281,7 @@ script(type='text/ng-template', id='resolvedCommentEntryTemplate')
 					span.rp-entry-user(
 						style="color: hsl({{ thread.resolved_by_user.hue }}, 70%, 40%);"
 					) {{ thread.resolved_by_user.name }}:&nbsp;
-					| Marked as resolved.
+					| #{translate("mark_as_resolveded")}.
 				.rp-entry-metadata
 					| {{ thread.resolved_at | date : 'MMM d, y h:mm a' }}
 				
@@ -296,12 +290,12 @@ script(type='text/ng-template', id='resolvedCommentEntryTemplate')
 				href
 				ng-click="onUnresolve({ 'threadId': thread.threadId });"
 			) 
-				| &nbsp;Re-open
+				| &nbsp;#{translate("reopen")}
 			a.rp-entry-button(
 				href
 				ng-click="onDelete({ 'entryId': thread.entryId, 'docId': thread.docId, 'threadId': thread.threadId });"
 			)
-				| &nbsp;Delete
+				| &nbsp;#{translate("delete")}
 
 
 script(type='text/ng-template', id='addCommentEntryTemplate')
@@ -324,7 +318,7 @@ script(type='text/ng-template', id='addCommentEntryTemplate')
 				ng-click="startNewComment();"
 			) 
 				i.fa.fa-comment
-				| &nbsp;Add comment
+				| &nbsp;#{translate("add_comment")}
 			div(ng-if="state.isAdding")
 				.rp-new-comment
 					textarea.rp-comment-input(
@@ -340,13 +334,13 @@ script(type='text/ng-template', id='addCommentEntryTemplate')
 						ng-click="cancelNewComment();"
 					) 
 						i.fa.fa-times
-						| &nbsp;Cancel
+						| &nbsp;#{translate("cancel")}
 					button.rp-entry-button(
 						ng-click="submitNewComment()"
 						ng-disabled="!state.content.length"
 					) 
 						i.fa.fa-comment
-						| &nbsp;Comment
+						| &nbsp;#{translate("cancel")}
 
 script(type='text/ng-template', id='resolvedCommentsDropdownTemplate')
 	.resolved-comments
@@ -378,7 +372,7 @@ script(type='text/ng-template', id='resolvedCommentsDropdownTemplate')
 					permissions="permissions"
 				)
 				.rp-loading(ng-if="!resolvedComments.length")
-					| No resolved threads.
+					| #{translate("no_resolved_threads")}.
 			
 script(type="text/ng-template", id="trackChangesUpgradeModalTemplate")
 	.modal-header
@@ -387,14 +381,14 @@ script(type="text/ng-template", id="trackChangesUpgradeModalTemplate")
 			data-dismiss="modal"
 			ng-click="cancel()"
 		) &times;
-		h3 Upgrade to Track Changes
+		h3 #{translate("upgrade_to_track_changes")}
 	.modal-body
 		.teaser-video-container
 			video.teaser-video(autoplay, loop)
 				source(src="/img/teasers/track-changes/teaser-track-changes.mp4", type="video/mp4")
 				img(src="/img/teasers/track-changes/teaser-track-changes.gif")
 		
-		h4.teaser-title See changes in your documents, live
+		h4.teaser-title #{translate("see_changes_in_your_documents_live")}
 	
 		p.small(ng-show="startedFreeTrial")
 			| #{translate("refresh_page_after_starting_free_trial")}
@@ -404,15 +398,15 @@ script(type="text/ng-template", id="trackChangesUpgradeModalTemplate")
 				ul.list-unstyled
 					li
 						i.fa.fa-check &nbsp;
-						| Track any change, in real-time
+						| #{translate("track_any_change_in_real_time")}
 					
 					li
 						i.fa.fa-check &nbsp;
-						| Review your peers' work
+						| #{translate("review_your_peers_work")}
 
 					li
 						i.fa.fa-check &nbsp;
-						| Accept or reject each change individually
+						| #{translate("accept_or_reject_each_changes_individually")}
 					
 
 		.row.text-center(ng-controller="FreeTrialModalController")
@@ -420,8 +414,8 @@ script(type="text/ng-template", id="trackChangesUpgradeModalTemplate")
 				href
 				ng-click="startFreeTrial('real-time-track-changes')"
 				ng-show="project.owner._id == user.id"
-			) Try it for free
-			p(ng-show="project.owner._id != user.id"): strong Please ask the project owner to upgrade to use track changes
+			) #{translate("try_it_for_free")}
+			p(ng-show="project.owner._id != user.id"): strong #{translate("please_ask_the_project_owner_to_upgrade_to_track_changes")}
 
 	.modal-footer()
 		button.btn.btn-default(
diff --git a/services/web/package.json b/services/web/package.json
index 100b55f75c..1134b9433c 100644
--- a/services/web/package.json
+++ b/services/web/package.json
@@ -59,6 +59,7 @@
     "settings-sharelatex": "git+https://github.com/sharelatex/settings-sharelatex.git#v1.0.0",
     "sixpack-client": "^1.0.0",
     "temp": "^0.8.3",
+    "translations-sharelatex": "git+https://github.com/sharelatex/translations-sharelatex.git#master",
     "underscore": "1.6.0",
     "v8-profiler": "^5.2.3",
     "xml2js": "0.2.0",
@@ -93,7 +94,6 @@
     "grunt-sed": "^0.1.1",
     "sandboxed-module": "0.2.0",
     "sinon": "",
-    "timekeeper": "",
-    "translations-sharelatex": "git+https://github.com/sharelatex/translations-sharelatex.git#master"
+    "timekeeper": ""
   }
 }

From 71b13b3f433469b2228805907edd0d90d1bc7906 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Fri, 17 Feb 2017 16:30:06 +0100
Subject: [PATCH 11/33] Fix translation string

---
 services/web/app/views/project/editor/review-panel.pug | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 5b68fd1bfc..c62de43d4a 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -340,7 +340,7 @@ script(type='text/ng-template', id='addCommentEntryTemplate')
 						ng-disabled="!state.content.length"
 					) 
 						i.fa.fa-comment
-						| &nbsp;#{translate("cancel")}
+						| &nbsp;#{translate("comment")}
 
 script(type='text/ng-template', id='resolvedCommentsDropdownTemplate')
 	.resolved-comments

From 44377ed03c2bc2cbb634355cab99ea2689aa3ddb Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Fri, 17 Feb 2017 16:37:49 +0100
Subject: [PATCH 12/33] Fix typo

---
 services/web/app/views/project/editor/review-panel.pug | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index c62de43d4a..d6f849eb3b 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -281,7 +281,7 @@ script(type='text/ng-template', id='resolvedCommentEntryTemplate')
 					span.rp-entry-user(
 						style="color: hsl({{ thread.resolved_by_user.hue }}, 70%, 40%);"
 					) {{ thread.resolved_by_user.name }}:&nbsp;
-					| #{translate("mark_as_resolveded")}.
+					| #{translate("mark_as_resolved")}.
 				.rp-entry-metadata
 					| {{ thread.resolved_at | date : 'MMM d, y h:mm a' }}
 				

From 637cfa2e18cc3f902e2eea26f21ca97d6d148f30 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Mon, 20 Feb 2017 11:51:06 +0100
Subject: [PATCH 13/33] Translate tooltips

---
 services/web/app/views/project/editor/review-panel.pug | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index d6f849eb3b..73d9bcfcf5 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -304,7 +304,7 @@ script(type='text/ng-template', id='addCommentEntryTemplate')
 		.rp-entry-indicator(
 			ng-if="!commentState.adding"
 			ng-click="startNewComment(); onIndicatorClick();"
-			tooltip="Add a comment"
+			tooltip=translate("add_comment")
 			tooltip-placement="{{ layoutToLeft ? 'left' : 'right' }}"
 			tooltip-append-to-body="true"
 		)
@@ -351,7 +351,7 @@ script(type='text/ng-template', id='resolvedCommentsDropdownTemplate')
 		a.resolved-comments-toggle(
 			href
 			ng-click="toggleOpenState();"
-			tooltip="Resolved Comments"
+			tooltip=translate("resolved_comments")
 			tooltip-placement="bottom"
 			tooltip-append-to-body="true"
 		)

From 7ffb6edd1cb4efffc3901773cf2b2c8bbf5595b9 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Mon, 20 Feb 2017 11:21:56 +0000
Subject: [PATCH 14/33] Use solid color instead of opacity, to avoid rendering
 issues.

---
 services/web/public/stylesheets/app/editor/review-panel.less | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 1d1900c90c..9930eaa4a3 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -49,11 +49,11 @@
 	}
 
 	&[disabled] {
-		opacity: 0.5;
+		background-color: tint(@rp-highlight-blue, 50%);
 
 		&:hover,
 		&:focus {
-			background-color: @rp-highlight-blue;
+			background-color: tint(@rp-highlight-blue, 50%);
 		}
 	}
 }

From 995fa6122b930e4b680b4987338442c13b33382a Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Mon, 20 Feb 2017 12:56:26 +0100
Subject: [PATCH 15/33] Scroll the review panel past the limits of Ace

---
 .../ide/editor/directives/aceEditor.coffee    | 17 ++++++++++
 .../controllers/ReviewPanelController.coffee  |  3 ++
 .../directives/reviewPanelSorted.coffee       | 31 ++++++++++---------
 3 files changed, 36 insertions(+), 15 deletions(-)

diff --git a/services/web/public/coffee/ide/editor/directives/aceEditor.coffee b/services/web/public/coffee/ide/editor/directives/aceEditor.coffee
index 9205cb7b87..b3c607455b 100644
--- a/services/web/public/coffee/ide/editor/directives/aceEditor.coffee
+++ b/services/web/public/coffee/ide/editor/directives/aceEditor.coffee
@@ -184,6 +184,23 @@ define [
 							session = editor.getSession()
 							session.setScrollTop(session.getScrollTop() + newScreenPosition - previousScreenPosition)
 
+				scope.$on "#{scope.name}:set-scroll-size", (e, size) ->
+					# Make sure that the editor has enough scroll margin above and below
+					# to scroll the review panel with the given size
+					marginChanged = false
+					if editor.renderer.scrollMargin.top != size.overflowTop
+						window.editors[0].renderer.scrollMargin.top = size.overflowTop
+						marginChanged = true
+
+					maxHeight = editor.renderer.layerConfig.maxHeight
+					marginBottom = Math.max(size.height - maxHeight, 0)
+					if editor.renderer.scrollMargin.bottom != marginBottom
+						editor.renderer.scrollMargin.bottom = marginBottom
+						marginChanged = true
+
+					if marginChanged
+						editor.renderer.updateFull()
+
 				scope.$watch "theme", (value) ->
 					editor.setTheme("ace/theme/#{value}")
 
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 88a3233934..d0af889dda 100644
--- a/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
+++ b/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
@@ -39,6 +39,9 @@ define [
 			$timeout () ->
 				$scope.$broadcast "review-panel:layout"
 
+		$scope.$on "review-panel:sizes", (e, sizes) ->
+			$scope.$broadcast "editor:set-scroll-size", sizes
+
 		$scope.$watch "ui.pdfLayout", (layout) ->
 			$scope.reviewPanel.layoutToLeft = (layout == "flat")
 		
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 4028406713..551658eacb 100644
--- a/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
+++ b/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
@@ -15,9 +15,11 @@ define [
 					if scope.ui.reviewPanelOpen
 						PADDING = 8
 						TOOLBAR_HEIGHT = 38
+						OVERVIEW_TOGGLE_HEIGHT = 57
 					else
 						PADDING = 4
 						TOOLBAR_HEIGHT = 4
+						OVERVIEW_TOGGLE_HEIGHT = 0
 					
 					entries = []
 					for el in element.find(".rp-entry-wrapper")
@@ -50,19 +52,6 @@ define [
 					
 					sl_console.log "focused_entry_index", focused_entry_index
 
-					# As we go backwards, we run the risk of pushing things off the top of the editor.
-					# If we go through the entries before and assume they are as pushed together as they
-					# could be, we can work out the 'ceiling' that each one can't go through. I.e. the first
-					# on can't go beyond the toolbar height, the next one can't go beyond the bottom of the first
-					# one at this minimum height, etc.
-					heights = (entry.$layout_el.height() for entry in entries_before)
-					previousMinTop = TOOLBAR_HEIGHT
-					min_tops = []
-					for height in heights
-						min_tops.push previousMinTop
-						previousMinTop += PADDING + height
-					min_tops.reverse()
-
 					positionLayoutEl = ($callout_el, original_top, top) ->
 						if original_top <= top
 							$callout_el.removeClass("rp-entry-callout-inverted")
@@ -72,7 +61,7 @@ define [
 							$callout_el.css(top: top + line_height, height: original_top - top)
 
 					# Put the focused entry as close to where it wants to be as possible
-					focused_entry_top = Math.max(previousMinTop, focused_entry.scope.entry.screenPos.y)
+					focused_entry_top = focused_entry.scope.entry.screenPos.y
 					focused_entry.$box_el.css(top: focused_entry_top)
 					focused_entry.$indicator_el.css(top: focused_entry_top)
 					positionLayoutEl(focused_entry.$callout_el, focused_entry.scope.entry.screenPos.y, focused_entry_top)
@@ -87,6 +76,8 @@ define [
 						entry.$indicator_el.css(top: top)
 						positionLayoutEl(entry.$callout_el, original_top, top)
 						sl_console.log "ENTRY", {entry: entry.scope.entry, top}
+					
+					lastBottom = previousBottom
 
 					previousTop = focused_entry_top
 					entries_before.reverse() # Work through backwards, starting with the one just above
@@ -95,12 +86,22 @@ define [
 						height = entry.$layout_el.height()
 						original_bottom = original_top + height
 						bottom = Math.min(original_bottom, previousTop - PADDING)
-						top = Math.max(bottom - height, min_tops[i])
+						top = bottom - height
 						previousTop = top
 						entry.$box_el.css(top: top)
 						entry.$indicator_el.css(top: top)
 						positionLayoutEl(entry.$callout_el, original_top, top)
 						sl_console.log "ENTRY", {entry: entry.scope.entry, top}
+
+					lastTop = top
+					if lastTop < TOOLBAR_HEIGHT
+						overflowTop = -lastTop + TOOLBAR_HEIGHT
+					else
+						overflowTop = 0
+					scope.$emit "review-panel:sizes", {
+						overflowTop: overflowTop,
+						height: previousBottom + OVERVIEW_TOGGLE_HEIGHT
+					}
 				
 				scope.$applyAsync () ->
 					layout()

From b52e4a5d1c40081744744703a47eedb4c33f06ff Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Mon, 20 Feb 2017 15:46:53 +0100
Subject: [PATCH 16/33] Reset scroll margins when changing document

---
 .../ide/editor/directives/aceEditor.coffee    | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/services/web/public/coffee/ide/editor/directives/aceEditor.coffee b/services/web/public/coffee/ide/editor/directives/aceEditor.coffee
index b3c607455b..faa1159e00 100644
--- a/services/web/public/coffee/ide/editor/directives/aceEditor.coffee
+++ b/services/web/public/coffee/ide/editor/directives/aceEditor.coffee
@@ -187,20 +187,25 @@ define [
 				scope.$on "#{scope.name}:set-scroll-size", (e, size) ->
 					# Make sure that the editor has enough scroll margin above and below
 					# to scroll the review panel with the given size
-					marginChanged = false
-					if editor.renderer.scrollMargin.top != size.overflowTop
-						window.editors[0].renderer.scrollMargin.top = size.overflowTop
-						marginChanged = true
-
+					marginTop = size.overflowTop
 					maxHeight = editor.renderer.layerConfig.maxHeight
 					marginBottom = Math.max(size.height - maxHeight, 0)
+					setScrollMargins(marginTop, marginBottom)
+
+				setScrollMargins = (marginTop, marginBottom) ->
+					marginChanged = false
+					if editor.renderer.scrollMargin.top != marginTop
+						editor.renderer.scrollMargin.top = marginTop
+						marginChanged = true
 					if editor.renderer.scrollMargin.bottom != marginBottom
 						editor.renderer.scrollMargin.bottom = marginBottom
 						marginChanged = true
-
 					if marginChanged
 						editor.renderer.updateFull()
 
+				resetScrollMargins = () ->
+					setScrollMargins(0,0)
+
 				scope.$watch "theme", (value) ->
 					editor.setTheme("ace/theme/#{value}")
 
@@ -325,6 +330,8 @@ define [
 					sharejs_doc.attachToAce(editor)
 					editor.initing = false
 
+					resetScrollMargins()
+
 					# need to set annotations after attaching because attaching
 					# deletes and then inserts document content
 					session.setAnnotations scope.annotations

From 8c5800ceafd6abad920600f6a4d35e08a0e51692 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Mon, 20 Feb 2017 16:03:02 +0100
Subject: [PATCH 17/33] Only render the entries that are visible in the text

---
 .../app/views/project/editor/review-panel.pug |  1 +
 .../track-changes/TrackChangesManager.coffee  | 32 +++++++++++++++++--
 .../controllers/ReviewPanelController.coffee  |  6 +++-
 3 files changed, 36 insertions(+), 3 deletions(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 93ff664eed..2ef5175cf2 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -47,6 +47,7 @@
 		.rp-entry-list-inner
 			.rp-entry-wrapper(
 				ng-repeat="(entry_id, entry) in reviewPanel.entries[editor.open_doc_id]"
+				ng-if="entry.visible"
 			)
 				div(ng-if="entry.type === 'insert' || entry.type === 'delete'")
 					change-entry(
diff --git a/services/web/public/coffee/ide/editor/directives/aceEditor/track-changes/TrackChangesManager.coffee b/services/web/public/coffee/ide/editor/directives/aceEditor/track-changes/TrackChangesManager.coffee
index b75cb07dba..1e06acd4d5 100644
--- a/services/web/public/coffee/ide/editor/directives/aceEditor/track-changes/TrackChangesManager.coffee
+++ b/services/web/public/coffee/ide/editor/directives/aceEditor/track-changes/TrackChangesManager.coffee
@@ -60,6 +60,18 @@ define [
 			onChangeSession = (e) =>
 				@clearAnnotations()
 				@redrawAnnotations()
+				@editor.session.on "changeScrollTop", onChangeScroll
+
+			_scrollTimeout = null
+			onChangeScroll = () =>
+				if _scrollTimeout?
+					return
+				else
+					_scrollTimeout = setTimeout () =>
+						@recalculateVisibleEntries()
+						@$scope.$apply()
+						_scrollTimeout = null
+					, 200
 
 			bindToAce = () =>
 				@editor.on "changeSelection", onChangeSelection
@@ -282,6 +294,7 @@ define [
 		recalculateReviewEntriesScreenPositions: () ->
 			session = @editor.getSession()
 			renderer = @editor.renderer
+			{firstRow, lastRow} = renderer.layerConfig
 			entries = @_getCurrentDocEntries()
 			for entry_id, entry of entries or {}
 				doc_position = @_shareJsOffsetToAcePosition(entry.offset)
@@ -290,9 +303,24 @@ define [
 				entry.screenPos ?= {}
 				entry.screenPos.y = y
 				entry.docPos = doc_position
-
+			@recalculateVisibleEntries()
 			@$scope.$apply()
-	
+
+		recalculateVisibleEntries: () ->
+			OFFSCREEN_ROWS = 5
+			CULL_AFTER = 100 # With less than this number of entries, don't bother culling to avoid little UI jumps when scrolling.
+			{firstRow, lastRow} = @editor.renderer.layerConfig
+			entries = @_getCurrentDocEntries() or {}
+			entriesLength = Object.keys(entries).length
+			changed = false
+			for entry_id, entry of entries
+				old = entry.visible
+				entry.visible = (entriesLength < CULL_AFTER) or (firstRow - OFFSCREEN_ROWS <= entry.docPos.row <= lastRow + OFFSCREEN_ROWS)
+				if (entry.visible != old)
+					changed = true
+			if changed
+				@$scope.$emit "editor:track-changes:visibility_changed"
+
 		_getCurrentDocEntries: () ->
 			doc_id = @$scope.docId
 			entries = @$scope.reviewPanel.entries[doc_id] ?= {}
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 d0af889dda..33cfae0982 100644
--- a/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
+++ b/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
@@ -266,7 +266,11 @@ define [
 			updateEntries(doc_id)
 			$scope.$broadcast "review-panel:recalculate-screen-positions"
 			$scope.$broadcast "review-panel:layout"
-		
+
+		$scope.$on "editor:track-changes:visibility_changed", () ->
+			$timeout () ->
+				$scope.$broadcast "review-panel:layout", false
+
 		$scope.$on "editor:focus:changed", (e, selection_offset_start, selection_offset_end, selection) ->
 			doc_id = $scope.editor.open_doc_id
 			entries = getDocEntries(doc_id)

From ad05cc288cfcb70a795b981462b4d2c780c0cbee Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Mon, 20 Feb 2017 16:22:18 +0100
Subject: [PATCH 18/33] Do DOM reads first to prevent thrashing

---
 .../ide/review-panel/directives/reviewPanelSorted.coffee     | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

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 551658eacb..f64b014410 100644
--- a/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
+++ b/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
@@ -33,6 +33,7 @@ define [
 							entry.$layout_el = entry.$box_el
 						else
 							entry.$layout_el = entry.$indicator_el
+						entry.height = entry.$layout_el.height() # Do all of our DOM reads first for perfomance, see http://wilsonpage.co.uk/preventing-layout-thrashing/
 						entries.push entry
 					entries.sort (a,b) -> a.scope.entry.offset - b.scope.entry.offset
 					
@@ -69,7 +70,7 @@ define [
 					previousBottom = focused_entry_top + focused_entry.$layout_el.height()
 					for entry in entries_after
 						original_top = entry.scope.entry.screenPos.y
-						height = entry.$layout_el.height()
+						height = entry.height
 						top = Math.max(original_top, previousBottom + PADDING)
 						previousBottom = top + height
 						entry.$box_el.css(top: top)
@@ -83,7 +84,7 @@ define [
 					entries_before.reverse() # Work through backwards, starting with the one just above
 					for entry, i in entries_before
 						original_top = entry.scope.entry.screenPos.y
-						height = entry.$layout_el.height()
+						height = entry.height
 						original_bottom = original_top + height
 						bottom = Math.min(original_bottom, previousTop - PADDING)
 						top = bottom - height

From 6c21d198944c43c3bc7da48e8bbe83f11786de38 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Mon, 20 Feb 2017 16:24:19 +0100
Subject: [PATCH 19/33] Increase offscreen lines considered for visibility

---
 .../aceEditor/track-changes/TrackChangesManager.coffee          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/services/web/public/coffee/ide/editor/directives/aceEditor/track-changes/TrackChangesManager.coffee b/services/web/public/coffee/ide/editor/directives/aceEditor/track-changes/TrackChangesManager.coffee
index 1e06acd4d5..38b3e5678c 100644
--- a/services/web/public/coffee/ide/editor/directives/aceEditor/track-changes/TrackChangesManager.coffee
+++ b/services/web/public/coffee/ide/editor/directives/aceEditor/track-changes/TrackChangesManager.coffee
@@ -307,7 +307,7 @@ define [
 			@$scope.$apply()
 
 		recalculateVisibleEntries: () ->
-			OFFSCREEN_ROWS = 5
+			OFFSCREEN_ROWS = 20
 			CULL_AFTER = 100 # With less than this number of entries, don't bother culling to avoid little UI jumps when scrolling.
 			{firstRow, lastRow} = @editor.renderer.layerConfig
 			entries = @_getCurrentDocEntries() or {}

From 5e07565c8e0cd785afaa59f7da7ed901568b7881 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Mon, 20 Feb 2017 15:37:12 +0000
Subject: [PATCH 20/33] Add retina icon for review features.

---
 .../web/public/img/review-icon-sprite@2x.png    | Bin 0 -> 24635 bytes
 .../stylesheets/app/editor/review-panel.less    |   4 ++++
 2 files changed, 4 insertions(+)
 create mode 100644 services/web/public/img/review-icon-sprite@2x.png

diff --git a/services/web/public/img/review-icon-sprite@2x.png b/services/web/public/img/review-icon-sprite@2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..20c66b093946cecba13b8357612f307eaceb544e
GIT binary patch
literal 24635
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
OswA%__e{p@>i+`NV#f9W

literal 0
HcmV?d00001

diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 1d1900c90c..e6f5d5e2ba 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -762,6 +762,10 @@
 	.toolbar .btn-full-height:active & {
 		background-position-y: -60px;
 	}
+	
+	@media (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
+		background-image: url('/img/review-icon-sprite@2x.png');
+	}
 }
 
 .resolved-comments-toggle {

From e6997a8af05f4480d00ace9398a297bc52f9688e Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Mon, 20 Feb 2017 16:14:23 +0000
Subject: [PATCH 21/33] Add jank-free image.

---
 .../web/public/img/review-icon-sprite@2x.png  | Bin 24635 -> 25495 bytes
 1 file changed, 0 insertions(+), 0 deletions(-)

diff --git a/services/web/public/img/review-icon-sprite@2x.png b/services/web/public/img/review-icon-sprite@2x.png
index 20c66b093946cecba13b8357612f307eaceb544e..7a76326d63802d3c4f599f0835da77c666d45649 100644
GIT binary patch
delta 5462
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

delta 4593
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
RHvpGQN5fG4gR0}R{{j&qy_Em}


From f466be96dd76ab3f6067ca32b23cd08b8fc76702 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Tue, 21 Feb 2017 09:58:49 +0100
Subject: [PATCH 22/33] Make sure first change isn't hidden under toolbar

---
 .../coffee/ide/review-panel/directives/reviewPanelSorted.coffee | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

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 f64b014410..b76f891e7f 100644
--- a/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
+++ b/services/web/public/coffee/ide/review-panel/directives/reviewPanelSorted.coffee
@@ -62,7 +62,7 @@ define [
 							$callout_el.css(top: top + line_height, height: original_top - top)
 
 					# Put the focused entry as close to where it wants to be as possible
-					focused_entry_top = focused_entry.scope.entry.screenPos.y
+					focused_entry_top = Math.max(focused_entry.scope.entry.screenPos.y, TOOLBAR_HEIGHT)
 					focused_entry.$box_el.css(top: focused_entry_top)
 					focused_entry.$indicator_el.css(top: focused_entry_top)
 					positionLayoutEl(focused_entry.$callout_el, focused_entry.scope.entry.screenPos.y, focused_entry_top)

From 2c2f7c56256789c5f61963f0ebf0388f2f216fc1 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Tue, 21 Feb 2017 11:20:08 +0100
Subject: [PATCH 23/33] Animate call outs along with review entries

---
 .../web/public/stylesheets/app/editor/review-panel.less    | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 2ca2c4e4b6..cfe3ac2223 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -29,6 +29,8 @@
 
 @rp-toolbar-height      : 32px;
 
+@rp-entry-animation-speed: 0.3s;
+
 
 
 .rp-button() {
@@ -185,7 +187,7 @@
 	border-radius: 3px;
 	color: #FFF;
 	cursor: pointer;
-	transition: top 0.3s, left 0.1s, right 0.1s;
+	transition: top @rp-entry-animation-speed, left 0.1s, right 0.1s;
 	.no-animate & {
 		transition: none;
 	}
@@ -281,7 +283,7 @@
 	border-left: solid @rp-entry-ribbon-width transparent;
 	border-radius: 3px;
 	background-color: #FFF;
-	transition: top 0.3s, left 0.1s, right 0.1s;
+	transition: top @rp-entry-animation-speed, left 0.1s, right 0.1s;
 	.no-animate & {
 		transition: none;
 	}
@@ -499,6 +501,7 @@
 		}
 
 .rp-entry-callout {
+	transition: top @rp-entry-animation-speed, height @rp-entry-animation-speed;
 	.rp-state-current-file & {
 		position: absolute;
 		border-top: 1px solid grey;

From 4dc13134e72fd8c2b64d5519438fd45abde97c15 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Tue, 21 Feb 2017 10:40:28 +0000
Subject: [PATCH 24/33] Kill overflow rule, allowing focused items to appear
 off-panel.

---
 services/web/public/stylesheets/app/editor/review-panel.less | 1 -
 1 file changed, 1 deletion(-)

diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index cfe3ac2223..3109a200c3 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -161,7 +161,6 @@
 		top: 0;
 		bottom: 0;
 		padding-bottom: 52px;
-		overflow: hidden;
 	}
 	
 	.rp-state-overview & {

From 0b7863185c81cf887771ba015383fe8be7547677 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Tue, 21 Feb 2017 11:05:55 +0000
Subject: [PATCH 25/33] Make expand/collapse indicator consistent with the one
 used in filetree.

---
 services/web/app/views/project/editor/review-panel.pug    | 8 ++++----
 .../web/public/stylesheets/app/editor/review-panel.less   | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 16126dc03f..75b1b426c4 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -94,14 +94,14 @@
 				ng-if="reviewPanel.entries[doc.doc.id] | notEmpty"
 				ng-click="reviewPanel.overview.docsCollapsedState[doc.doc.id] = ! reviewPanel.overview.docsCollapsedState[doc.doc.id]"
 			)
+				span.rp-overview-file-header-collapse(
+					ng-class="{ 'rp-overview-file-header-collapse-on': reviewPanel.overview.docsCollapsedState[doc.doc.id] }"
+				)
+					i.fa.fa-angle-right
 				| {{ doc.path }}
 				span.rp-overview-file-num-entries(
 					ng-show="reviewPanel.overview.docsCollapsedState[doc.doc.id]"
 				) &nbsp;({{ reviewPanel.entries[doc.doc.id] | numKeys }})
-				span.rp-overview-file-header-collapse(
-					ng-class="{ 'rp-overview-file-header-collapse-on': reviewPanel.overview.docsCollapsedState[doc.doc.id] }"
-				)
-					i.fa.fa-angle-up
 
 			.rp-overview-file-entries(
 				review-panel-collapse-height="reviewPanel.overview.docsCollapsedState[doc.doc.id]"
diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index 52e217a71d..e3f37bfc95 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -578,13 +578,13 @@
 	}
 	.rp-overview-file-header-collapse {
 		display: inline-block;
-		float: right;
+		float: left;
 		transform: rotateZ(0deg);
 		transition: transform 0.15s ease
 	}
 	
 	.rp-overview-file-header-collapse-on {
-		transform: rotateZ(180deg);
+		transform: rotateZ(90deg);
 	}
 
 	.rp-overview-file-entries {

From 2553dfbf828931b87439b623b9ea774a441e2de3 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Tue, 21 Feb 2017 14:19:46 +0100
Subject: [PATCH 26/33] Translate placeholders

---
 services/web/app/views/project/editor/review-panel.pug | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 73d9bcfcf5..ed5b52fc88 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -235,7 +235,7 @@ script(type='text/ng-template', id='commentEntryTemplate')
 					ng-model="entry.replyContent"
 					ng-keypress="handleCommentReplyKeyPress($event);"
 					stop-propagation="click"
-					placeholder="{{ 'Hit \"Enter\" to reply' + (entry.resolved ? ' and re-open' : '') }}"
+					placeholder=translate("hit_enter_to_reply")
 				)
 			.rp-entry-actions
 				button.rp-entry-button(
@@ -325,7 +325,7 @@ script(type='text/ng-template', id='addCommentEntryTemplate')
 						expandable-text-area
 						ng-model="state.content"
 						ng-keypress="handleCommentKeyPress($event);"
-						placeholder="Add your comment here"
+						placeholder=translate("add_your_comment_here")
 						focus-on="comment:new:open"
 						ng-blur="submitNewComment()"
 					)

From 53a127cc65ae35f4f7a2af858215814fa90d7767 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Tue, 21 Feb 2017 14:25:26 +0100
Subject: [PATCH 27/33] Make consistent with file tree

---
 services/web/app/views/project/editor/review-panel.pug       | 2 +-
 services/web/public/stylesheets/app/editor/review-panel.less | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 75b1b426c4..afa5b4244e 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -97,7 +97,7 @@
 				span.rp-overview-file-header-collapse(
 					ng-class="{ 'rp-overview-file-header-collapse-on': reviewPanel.overview.docsCollapsedState[doc.doc.id] }"
 				)
-					i.fa.fa-angle-right
+					i.fa.fa-angle-down
 				| {{ doc.path }}
 				span.rp-overview-file-num-entries(
 					ng-show="reviewPanel.overview.docsCollapsedState[doc.doc.id]"
diff --git a/services/web/public/stylesheets/app/editor/review-panel.less b/services/web/public/stylesheets/app/editor/review-panel.less
index e3f37bfc95..5b422cbd0a 100644
--- a/services/web/public/stylesheets/app/editor/review-panel.less
+++ b/services/web/public/stylesheets/app/editor/review-panel.less
@@ -584,7 +584,7 @@
 	}
 	
 	.rp-overview-file-header-collapse-on {
-		transform: rotateZ(90deg);
+		transform: rotateZ(-90deg);
 	}
 
 	.rp-overview-file-entries {

From 33c8bc8684b22ff421ac5af0e62512fc96941f8d Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Tue, 21 Feb 2017 14:20:51 +0000
Subject: [PATCH 28/33] Support saving state to local storage.

---
 .../controllers/ReviewPanelController.coffee         | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

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 07f429036f..7faf5d7243 100644
--- a/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
+++ b/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
@@ -4,7 +4,7 @@ define [
 	"ide/colors/ColorManager"
 	"ide/review-panel/RangesTracker"
 ], (App, EventEmitter, ColorManager, RangesTracker) ->
-	App.controller "ReviewPanelController", ($scope, $element, ide, $timeout, $http, $modal, event_tracking) ->
+	App.controller "ReviewPanelController", ($scope, $element, ide, $timeout, $http, $modal, event_tracking, localStorage) ->
 		$reviewPanelEl = $element.find "#review-panel"
 
 		$scope.SubViews =
@@ -28,6 +28,16 @@ define [
 			rendererData: {}
 			loadingThreads: false
 
+		$scope.$on "project:joined", () ->
+			$scope.reviewPanel.overview.docsCollapsedState = JSON.parse(localStorage("docs_collapsed_state:#{$scope.project_id}")) or {}
+
+		window.addEventListener "beforeunload", () ->
+			collapsedStates = {}
+			for doc, state of $scope.reviewPanel.overview.docsCollapsedState
+				collapsedStates[doc] = state if state is true
+			valToStore = if Object.keys(collapsedStates).length > 0 then JSON.stringify(collapsedStates) else null
+			localStorage("docs_collapsed_state:#{$scope.project_id}", valToStore)
+
 		$scope.$on "layout:pdf:linked", (event, state) ->
 			$scope.reviewPanel.layoutToLeft = (state.east?.size < 220 || state.east?.initClosed)
 			$scope.$broadcast "review-panel:layout"

From 2df8479db3f5e3532437746f266740804be6e903 Mon Sep 17 00:00:00 2001
From: James Allen <james@sharelatex.com>
Date: Tue, 21 Feb 2017 15:25:28 +0100
Subject: [PATCH 29/33] Move translations back to devDependencies so it's not
 missed by shrinkwrap

---
 services/web/package.json | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/services/web/package.json b/services/web/package.json
index 1134b9433c..100b55f75c 100644
--- a/services/web/package.json
+++ b/services/web/package.json
@@ -59,7 +59,6 @@
     "settings-sharelatex": "git+https://github.com/sharelatex/settings-sharelatex.git#v1.0.0",
     "sixpack-client": "^1.0.0",
     "temp": "^0.8.3",
-    "translations-sharelatex": "git+https://github.com/sharelatex/translations-sharelatex.git#master",
     "underscore": "1.6.0",
     "v8-profiler": "^5.2.3",
     "xml2js": "0.2.0",
@@ -94,6 +93,7 @@
     "grunt-sed": "^0.1.1",
     "sandboxed-module": "0.2.0",
     "sinon": "",
-    "timekeeper": ""
+    "timekeeper": "",
+    "translations-sharelatex": "git+https://github.com/sharelatex/translations-sharelatex.git#master"
   }
 }

From 2e8f9173183a06879ec3465938450729f3cc872e Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Tue, 21 Feb 2017 14:27:57 +0000
Subject: [PATCH 30/33] Support initial closed state.

---
 .../review-panel/directives/reviewPanelCollapseHeight.coffee   | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/services/web/public/coffee/ide/review-panel/directives/reviewPanelCollapseHeight.coffee b/services/web/public/coffee/ide/review-panel/directives/reviewPanelCollapseHeight.coffee
index 859e04aac7..aef8a91a3b 100644
--- a/services/web/public/coffee/ide/review-panel/directives/reviewPanelCollapseHeight.coffee
+++ b/services/web/public/coffee/ide/review-panel/directives/reviewPanelCollapseHeight.coffee
@@ -12,4 +12,7 @@ define [
 							element.animate { height: 0 }, 150
 						else
 							element.animate { height: neededHeight }, 150
+					else
+						if shouldCollapse
+							element.height 0
 		}
\ No newline at end of file

From 7f6941677d32523d4ad1d93a1044945c097f21e0 Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Tue, 21 Feb 2017 14:43:05 +0000
Subject: [PATCH 31/33] Check local storage on load; use explicit condition
 syntax.

---
 .../review-panel/controllers/ReviewPanelController.coffee | 8 +++-----
 1 file changed, 3 insertions(+), 5 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 d740eb02e3..5067799571 100644
--- a/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
+++ b/services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee
@@ -19,7 +19,7 @@ define [
 			openSubView: $scope.SubViews.CUR_FILE
 			overview:
 				loading: false
-				docsCollapsedState: {}
+				docsCollapsedState: JSON.parse(localStorage("docs_collapsed_state:#{$scope.project_id}")) or {}
 			dropdown:
 				loading: false
 			commentThreads: {}
@@ -28,13 +28,11 @@ define [
 			rendererData: {}
 			loadingThreads: false
 
-		$scope.$on "project:joined", () ->
-			$scope.reviewPanel.overview.docsCollapsedState = JSON.parse(localStorage("docs_collapsed_state:#{$scope.project_id}")) or {}
-
 		window.addEventListener "beforeunload", () ->
 			collapsedStates = {}
 			for doc, state of $scope.reviewPanel.overview.docsCollapsedState
-				collapsedStates[doc] = state if state is true
+				if state
+					collapsedStates[doc] = state 
 			valToStore = if Object.keys(collapsedStates).length > 0 then JSON.stringify(collapsedStates) else null
 			localStorage("docs_collapsed_state:#{$scope.project_id}", valToStore)
 

From 96c44eec38538475a1cb17cd304f8ac751ba8b4b Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Tue, 21 Feb 2017 14:48:21 +0000
Subject: [PATCH 32/33] Support values other than objects in the numKeys
 filter, returning zero if so.

---
 .../public/coffee/ide/review-panel/filters/numKeys.coffee   | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/services/web/public/coffee/ide/review-panel/filters/numKeys.coffee b/services/web/public/coffee/ide/review-panel/filters/numKeys.coffee
index 4a37638c1e..c1822d02c9 100644
--- a/services/web/public/coffee/ide/review-panel/filters/numKeys.coffee
+++ b/services/web/public/coffee/ide/review-panel/filters/numKeys.coffee
@@ -2,4 +2,8 @@ define [
 	"base"
 ], (App) ->
 	app.filter "numKeys", () ->
-		(object) -> Object.keys(object).length
+		(object) -> 
+			if object?
+				return Object.keys(object).length
+			else
+				return 0

From 519cd3c0bd24316cd279863e5d5c88c15abe483a Mon Sep 17 00:00:00 2001
From: Paulo Reis <paulojreis@gmail.com>
Date: Tue, 21 Feb 2017 15:20:00 +0000
Subject: [PATCH 33/33] Avoid showing files in overview if the associated
 review entries object is still undefined.

---
 services/web/app/views/project/editor/review-panel.pug | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/services/web/app/views/project/editor/review-panel.pug b/services/web/app/views/project/editor/review-panel.pug
index 59ac7e5baf..8d19bf2ae4 100644
--- a/services/web/app/views/project/editor/review-panel.pug
+++ b/services/web/app/views/project/editor/review-panel.pug
@@ -93,7 +93,7 @@
 			ng-if="!reviewPanel.overview.loading"
 		)
 			.rp-overview-file-header(
-				ng-if="reviewPanel.entries[doc.doc.id] | notEmpty"
+				ng-if="(reviewPanel.entries[doc.doc.id] != null) && (reviewPanel.entries[doc.doc.id] | notEmpty)"
 				ng-click="reviewPanel.overview.docsCollapsedState[doc.doc.id] = ! reviewPanel.overview.docsCollapsedState[doc.doc.id]"
 			)
 				span.rp-overview-file-header-collapse(