Add a per-user TC notice dialog.

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

@@ -51,12 +51,13 @@
 				ng-if="editor.wantTrackChanges === true"
 			)
 				i.fa.fa-circle
-			span(ng-click="toggleFullTCStateCollapse();", ng-if="editor.wantTrackChanges === false") !{translate("track_changes_is_off")}
+			span(ng-click="toggleFullTCStateCollapse();")
-			span(ng-click="toggleFullTCStateCollapse();", ng-if="editor.wantTrackChanges === true") !{translate("track_changes_is_on")}
+				span(ng-if="editor.wantTrackChanges === false") !{translate("track_changes_is_off")}
-			span.rp-tc-state-collapse(
+				span(ng-if="editor.wantTrackChanges === true") !{translate("track_changes_is_on")}
-				ng-class="{ 'rp-tc-state-collapse-on': reviewPanel.fullTCStateCollapsed }"
+				span.rp-tc-state-collapse(
-			)
+					ng-class="{ 'rp-tc-state-collapse-on': reviewPanel.fullTCStateCollapsed }"
-				i.fa.fa-angle-down
+				)
+					i.fa.fa-angle-down
 		ul.rp-tc-state(
 			review-panel-collapse-height="reviewPanel.fullTCStateCollapsed"
 		)
@@ -67,20 +68,6 @@
 					on-toggle="toggleTrackChangesForEveryone(isOn);"
 					disabled="!project.features.trackChanges || !permissions.write"
 				)
-			//- li.rp-tc-state-item(
-			//- 	ng-init="formattedOwner = formatUser(project.owner);"
-			//- )
-			//- 	pre {{ project.owner | json }}
-			//- 	pre {{ formattedOwner | json }}
-			//- 	span.rp-tc-state-item-name.rp-tc-state-item-owner(
-			//- 		ng-class="{ 'rp-tc-state-item-name-disabled' : reviewPanel.trackChangesOnForEveryone}"
-			//- 		style="color: hsl({{ formattedOwner.hue }}, 70%, 40%);"
-			//- 	) {{ formattedOwner.name }}
-			//- 	review-panel-toggle(
-			//- 		ng-model="reviewPanel.trackChangesState[formattedOwner.id].value"
-			//- 		on-toggle="toggleTrackChangesForUser(isOn, formattedOwner.id);"
-			//- 		disabled="reviewPanel.trackChangesOnForEveryone || !project.features.trackChanges || !permissions.write"
-			//- 	)
 			li.rp-tc-state-item(
 				ng-repeat="member in reviewPanel.formattedProjectMembers"
 			)
@@ -526,7 +513,7 @@ script(type="text/ng-template", id="trackChangesUpgradeModalTemplate")
 	.modal-body
 		.teaser-video-container
 			video.teaser-video(autoplay, loop)
-				source(src="/img/teasers/track-changes/teaser-track-changes.mp4", type="video/mp4")
+				source(ng-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 #{translate("see_changes_in_your_documents_live")}
@@ -564,6 +551,37 @@ script(type="text/ng-template", id="trackChangesUpgradeModalTemplate")
 		)
 			span #{translate("close")}
 
+script(type="text/ng-template", id="perUserTCNoticeModalTemplate")
+	.modal-header
+		button.close(
+			type="button"
+			data-dismiss="modal"
+			ng-click="$close()"
+		) ×
+		h3 Per-user Track Changes
+	.modal-body
+		.teaser-video-container
+			video.teaser-video(autoplay, loop)
+				source(ng-src="{{ '/img/teasers/track-changes/per-user-track-changes.mp4' }}", type="video/mp4")
+				img(src="/img/teasers/track-changes/per-user-track-changes.gif")
+		h4.teaser-title Now you can use Track Changes on a per-user basis
+		.row
+			.col-md-8.col-md-offset-2
+				ul.list-unstyled
+					li
+						i.fa.fa-check  
+						| Turn Track Changes on for individuals users
+					
+					li
+						i.fa.fa-check  
+						| Or keep it on for everyone, like before
+
+	.modal-footer()
+		button.btn.btn-default(
+			ng-click="$close()"
+		)
+			span #{translate("close")}
+
 script(type="text/ng-template", id="bulkActionsModalTemplate")
 	.modal-header
 		button.close(

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

@@ -15,8 +15,6 @@ define [
 			SYNCED  : "synced"
 			PENDING : "pending"
 
-
-		window.reviewPanel = # DEBUG LINE
 		$scope.reviewPanel =
 			trackChangesState: {}
 			trackChangesOnForEveryone: false
@@ -42,6 +40,7 @@ define [
 			# A count of user-facing selected changes. An aggregated change (insertion + deletion) will count
 			# as only one.
 			nVisibleSelectedChanges: 0
+			showPerUserTCNotice: window.showPerUserTCNotice
 
 		window.addEventListener "beforeunload", () ->
 			collapsedStates = {}
@@ -586,7 +585,9 @@ define [
 
 		$scope.toggleFullTCStateCollapse = () ->
 			if $scope.project.features.trackChanges
-				reviewPanel.fullTCStateCollapsed = !reviewPanel.fullTCStateCollapsed
+				if true or $scope.reviewPanel.showPerUserTCNotice
+					$scope.openPerUserTCNoticeModal()
+				$scope.reviewPanel.fullTCStateCollapsed = !$scope.reviewPanel.fullTCStateCollapsed
 			else
 				$scope.openTrackChangesUpgradeModal()
 
@@ -636,7 +637,6 @@ define [
 			_setEveryoneTCState onForEveryone, true
 			applyClientTrackChangesStateToServer()
 	
-		window.toggleTrackChangesForUser = # DEBUG LINE
 		$scope.toggleTrackChangesForUser = (onForUser, userId) ->
 			_setUserTCState userId, onForUser, true
 			applyClientTrackChangesStateToServer()				
@@ -753,3 +753,11 @@ define [
 				controller: "TrackChangesUpgradeModalController"
 				scope: $scope.$new()
 			}
+
+		$scope.openPerUserTCNoticeModal = () ->
+			$scope.reviewPanel.showPerUserTCNotice = false
+			$modal.open({
+				templateUrl: "perUserTCNoticeModalTemplate"
+			}).result.finally () ->
+				event_tracking.sendMB "shown-per-user-tc-notice"
+