Merge branch 'ja-track-changes' of github.com:sharelatex/web-sharelatex into ja-track-changes

services/web/app/views/project/editor/review-panel.jade

@@ -3,6 +3,7 @@
 		resolved-comments-dropdown(
 			entries="reviewPanel.entries"
 			threads="reviewPanel.commentThreads"
+			resolved-ids="reviewPanel.resolvedThreadIds"
 			docs="docs"
 			on-open="refreshResolvedCommentsDropdown();"
 			on-unresolve="unresolveComment(threadId);"
@@ -255,10 +256,10 @@ script(type='text/ng-template', id='addCommentEntryTemplate')
 
 script(type='text/ng-template', id='resolvedCommentsDropdownTemplate')
 	.resolved-comments
-		//- .resolved-comments-backdrop(
-		//- 	ng-class="{ 'resolved-comments-backdrop-visible' : state.isOpen }"
-		//- 	ng-click="state.isOpen = !state.isOpen"
-		//- )
+		.resolved-comments-backdrop(
+			ng-class="{ 'resolved-comments-backdrop-visible' : state.isOpen }"
+			ng-click="state.isOpen = false"
+		)
 		a.resolved-comments-toggle(
 			href
 			ng-click="toggleOpenState();"
@@ -269,11 +270,11 @@ script(type='text/ng-template', id='resolvedCommentsDropdownTemplate')
 		)
 			.rp-loading(ng-if="isLoading")
 				i.fa.fa-spinner.fa-spin
-			div(
+			.resolved-comments-scroller(
 				ng-if="!isLoading"
 			)
 				resolved-comment-entry(
-					ng-repeat="thread in resolvedComments"
+					ng-repeat="thread in resolvedComments | orderBy:'-resolved_at'"
 					thread="thread"
 					on-unresolve="handleUnresolve(threadId);"
 					on-delete="handleDelete(entryId, threadId);"

services/web/public/coffee/ide/review-panel/controllers/ReviewPanelController.coffee

@@ -21,6 +21,7 @@ define [
 			dropdown:
 				loading: false
 			commentThreads: {}
+			resolvedThreadIds: {}
 
 		$scope.commentState =
 			adding: false
@@ -52,7 +53,6 @@ define [
 			_onCommentReopened(thread_id)
 
 		rangesTrackers = {}
-		resolvedThreadIds = {}
 
 		getDocEntries = (doc_id) ->
 			$scope.reviewPanel.entries[doc_id] ?= {}
@@ -61,7 +61,7 @@ define [
 		getChangeTracker = (doc_id) ->
 			if !rangesTrackers[doc_id]?
 				rangesTrackers[doc_id] = new RangesTracker()
-				rangesTrackers[doc_id].resolvedThreadIds = resolvedThreadIds
+				rangesTrackers[doc_id].resolvedThreadIds = $scope.reviewPanel.resolvedThreadIds
 			return rangesTrackers[doc_id]
 
 		scrollbar = {}
@@ -96,7 +96,7 @@ define [
 			# The open doc range tracker is kept up to date in real-time so
 			# replace any outdated info with this
 			rangesTrackers[doc.doc_id] = doc.ranges
-			rangesTrackers[doc.doc_id].resolvedThreadIds = resolvedThreadIds
+			rangesTrackers[doc.doc_id].resolvedThreadIds = $scope.reviewPanel.resolvedThreadIds
 			$scope.reviewPanel.rangesTracker = rangesTrackers[doc.doc_id]
 			if old_doc?
 				old_doc.off "flipped_pending_to_inflight"
@@ -253,8 +253,7 @@ define [
 			$timeout () ->
 				$scope.$broadcast "review-panel:layout"
 
-		$scope.submitReply = (entry, entry_id) ->
-			$scope.unresolveComment(entry, entry_id)
+		$scope.submitReply = (entry, entry_id) ->			
 			thread_id = entry.thread_id
 			content   = entry.replyContent
 			$http.post("/project/#{$scope.project_id}/thread/#{thread_id}/messages", {content, _csrf: window.csrfToken})
@@ -285,7 +284,7 @@ define [
 			thread.resolved = true
 			thread.resolved_by_user = formatUser(user)
 			thread.resolved_at = new Date()
-			resolvedThreadIds[thread_id] = true
+			$scope.reviewPanel.resolvedThreadIds[thread_id] = true
 			$scope.$broadcast "comment:resolve_thread", thread_id
 		
 		_onCommentReopened = (thread_id) ->
@@ -293,14 +292,16 @@ define [
 			delete thread.resolved
 			delete thread.resolved_by_user
 			delete thread.resolved_at
-			delete resolvedThreadIds[thread_id]
+			delete $scope.reviewPanel.resolvedThreadIds[thread_id]
 			$scope.$broadcast "comment:unresolve_thread", thread_id
 
 		_onCommentDeleted = (thread_id) ->
+			if $scope.reviewPanel.resolvedThreadIds[thread_id]?
+				delete $scope.reviewPanel.resolvedThreadIds[thread_id]
+				
 			delete $scope.reviewPanel.commentThreads[thread_id]
 		
 		$scope.deleteComment = (entry_id, thread_id) ->
-			console.log thread_id
 			_onCommentDeleted(thread_id)
 			$scope.$broadcast "comment:remove", entry_id
 
@@ -345,15 +346,15 @@ define [
 		refreshThreads = () ->
 			$http.get "/project/#{$scope.project_id}/threads"
 				.success (threads) ->
-					for thread_id, _ of resolvedThreadIds
-						delete resolvedThreadIds[thread_id]
+					for thread_id, _ of $scope.reviewPanel.resolvedThreadIds
+						delete $scope.reviewPanel.resolvedThreadIds[thread_id]
 					for thread_id, thread of threads
 						for comment in thread.messages
 							formatComment(comment)
 						if thread.resolved_by_user?
 							$scope.$broadcast "comment:resolve_thread", thread_id
 							thread.resolved_by_user = formatUser(thread.resolved_by_user)
-							resolvedThreadIds[thread_id] = true
+							$scope.reviewPanel.resolvedThreadIds[thread_id] = true
 					$scope.reviewPanel.commentThreads = threads
 
 		refreshThreads()

services/web/public/coffee/ide/review-panel/directives/resolvedCommentsDropdown.coffee

@@ -7,6 +7,7 @@ define [
 		scope: 
 			entries 	: "="
 			threads 	: "="
+			resolvedIds	: "="
 			docs		: "="
 			onOpen		: "&"
 			onUnresolve	: "&"
@@ -27,11 +28,9 @@ define [
 
 			scope.handleUnresolve = (threadId) ->
 				scope.onUnresolve({ threadId })
-				filterResolvedComments()
 
 			scope.handleDelete = (entryId, threadId) ->
 				scope.onDelete({ entryId, threadId })
-				filterResolvedComments()
 
 			getDocNameById = (docId) ->
 				doc = _.find(scope.docs, (doc) -> doc.doc.id = docId)
@@ -56,7 +55,4 @@ define [
 
 							scope.resolvedComments.push(resolvedComment)
 
-			scope.$watchCollection "entries", filterResolvedComments
-			scope.$watchCollection "threads", filterResolvedComments
-
-						
+			scope.$watchCollection "resolvedIds", filterResolvedComments

services/web/public/stylesheets/app/editor/review-panel.less

@@ -93,6 +93,7 @@
 	border-left: solid 1px @rp-border-grey;
 	font-size: @rp-base-font-size;
 	color: @rp-type-blue;
+	z-index: 4; // 3 is Ace's gutter z-index value.
 }
 
 .review-panel-toolbar {
@@ -102,17 +103,17 @@
 		align-items: center;
 		padding: 0 5px;
 	}
-	.rp-state-current-file & {
-		position: absolute;
-		top: 0;
-		left: 0;
-		right: 0;
-	}
+	// .rp-state-current-file & {
+	// 	position: absolute;
+	// 	top: 0;
+	// 	left: 0;
+	// 	right: 0;
+	// }
 	height: @rp-toolbar-height;
 	border-bottom: 1px solid @rp-border-grey;
 	background-color: @rp-bg-dim-blue;
 	text-align: center;
-	z-index: 2;
+	z-index: 3;
 	flex-basis: 32px;
 	flex-shrink: 0;
 }
@@ -687,30 +688,31 @@
 	}
 }
 
-// .resolved-comments-backdrop {
-// 	display: none;
-// 	position: fixed;
-// 	top: 0;
-// 	right: 0;
-// 	bottom: 0;
-// 	left: 0;
-// 	background-color: rgba(0, 0, 0, .5);
+.resolved-comments-backdrop {
+	display: none;
+	position: fixed;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
 
-// 	&-visible {
-// 		display: block;
-// 	}
-// }
+	&-visible {
+		display: block;
+	}
+}
 
 .resolved-comments-dropdown {
 	display: none;
 	position: absolute;
 	width: 300px;
 	left: -150px;
+	max-height: 90%;
 	margin-top: @rp-entry-arrow-width * 1.5;
 	margin-left: 1em;
 	background-color: @rp-bg-blue;
 	text-align: left;
-	padding: 5px;
+	align-items: stretch;
+	justify-content: center;
 	border-radius: 3px;
 	box-shadow: 0 0 20px 10px rgba(0, 0, 0, .3);
 
@@ -723,6 +725,11 @@
 	}
 
 	&-open {
-		display: block;
+		display: flex;
 	}
 }
+	.resolved-comments-scroller {
+		flex: 0 0 100%;
+		padding: 5px;
+		overflow-y: auto;
+	}