Merge pull request #310 from sharelatex/ja-link-sharing-tweaks

Link sharing UX improvments

services/web/app/views/project/editor/share.pug

@@ -12,11 +12,11 @@ script(type='text/ng-template', id='shareProjectModalTemplate')
 			//- Private (with token-access available)
 			.row.public-access-level(ng-show="project.publicAccesLevel == 'private'")
 				.col-xs-12.text-center
-					| #{translate('link_sharing_is_off')}.
+					| #{translate('link_sharing_is_off')}
 					|   
 					a(
 						href
-						ng-click="openMakeTokenBasedModal()"
+						ng-click="makeTokenBased()"
 					) #{translate('turn_on_link_sharing')}
 					span   
 					a(
@@ -35,7 +35,7 @@ script(type='text/ng-template', id='shareProjectModalTemplate')
 						|   
 					a(
 						href
-						ng-click="openMakePrivateModal()"
+						ng-click="makePrivate()"
 					) #{translate('turn_off_link_sharing')}
 					span   
 					a(
@@ -49,10 +49,12 @@ script(type='text/ng-template', id='shareProjectModalTemplate')
 				.col-xs-12.access-token-display-area
 					div.access-token-wrapper
 						strong #{translate('anyone_with_link_can_edit')}
-						pre.access-token {{ getReadAndWriteTokenLink() }}
+						pre.access-token(ng-show="readAndWriteTokenLink") {{ readAndWriteTokenLink }}
+						pre.access-token(ng-hide="readAndWriteTokenLink") #{translate('loading')}...
 					div.access-token-wrapper
 						strong #{translate('anyone_with_link_can_view')}
-						pre.access-token {{ getReadOnlyTokenLink() }}
+						pre.access-token(ng-show="readOnlyTokenLink") {{ readOnlyTokenLink }}
+						pre.access-token(ng-hide="readOnlyTokenLink") #{translate('loading')}...
 
 			//- legacy public-access
 			.row.public-access-level(ng-show="project.publicAccesLevel == 'readAndWrite' || project.publicAccesLevel == 'readOnly'")
@@ -62,7 +64,7 @@ script(type='text/ng-template', id='shareProjectModalTemplate')
 					|   
 					a(
 						href
-						ng-click="openMakePrivateModal()"
+						ng-click="makePrivate()"
 					) #{translate("make_private")}
 
 			.row.project-member
@@ -198,64 +200,6 @@ script(type='text/ng-template', id='shareProjectModalTemplate')
 				ng-click="done()"
 			) #{translate("close")}
 
-script(type="text/ng-template", id="makeTokenBasedModalTemplate")
-	.modal-header
-		button.close(
-			type="button"
-			data-dismiss="modal"
-			ng-click="cancel()"
-		) ×
-		h3 Enable link-sharing?
-	.modal-body.modal-body-share
-		p #{translate('turn_on_link_sharing_consequences')}
-		a(href="/learn/Kb/what_is_link_sharing" target="blank")
-			| #{translate('learn_more_about_link_sharing')}
-	.modal-footer
-		button.btn.btn-default(
-			ng-click="cancel()"
-		) #{translate("cancel")}
-		button.btn.btn-info(
-			ng-click="makeTokenBased()"
-		) #{translate('turn_on_link_sharing')}
-
-script(type="text/ng-template", id="makePrivateModalTemplate")
-	//- Token
-	div(ng-if="project.publicAccesLevel == 'tokenBased'")
-		.modal-header
-			button.close(
-				type="button"
-				data-dismiss="modal"
-				ng-click="cancel()"
-			) ×
-			h3 #{translate("make_project_private")}?
-		.modal-body.modal-body-share
-			p #{translate('turn_off_link_sharing_consequences')}
-		.modal-footer
-			button.btn.btn-default(
-				ng-click="cancel()"
-			) #{translate("cancel")}
-			button.btn.btn-info(
-				ng-click="makePrivate()"
-			) #{translate("turn_off_link_sharing")}
-	//- Legacy public-access
-	div(ng-if="project.publicAccesLevel != 'tokenBased'")
-		.modal-header
-			button.close(
-				type="button"
-				data-dismiss="modal"
-				ng-click="cancel()"
-			) ×
-			h3 #{translate("make_project_private")}?
-		.modal-body.modal-body-share
-			p #{translate("make_project_private_consequences")}
-		.modal-footer
-			button.btn.btn-default(
-				ng-click="cancel()"
-			) #{translate("cancel")}
-			button.btn.btn-info(
-				ng-click="makePrivate()"
-			) #{translate("make_private")}
-
 script(type="text/ng-template", id="shareTagTemplate")
 	.tag-template
 		span(ng-if="data.type")

services/web/public/coffee/ide/share/controllers/ShareProjectModalController.coffee

@@ -1,7 +1,7 @@
 define [
 	"base"
 ], (App) ->
-	App.controller "ShareProjectModalController", ($scope, $modalInstance, $timeout, projectMembers, projectInvites, $modal, $http, ide, validateCaptcha) ->
+	App.controller "ShareProjectModalController", ($scope, $modalInstance, $timeout, projectMembers, projectInvites, $modal, $http, ide, validateCaptcha, settings, event_tracking) ->
 		$scope.inputs = {
 			privileges: "readAndWrite"
 			contacts: []
@@ -182,72 +182,29 @@ define [
 					$scope.state.error = "Sorry, something went wrong resending the invite :("
 					event.target.blur()
 
-		$scope.openMakePrivateModal = () ->
-			$modal.open {
-				templateUrl: "makePrivateModalTemplate"
-				controller:  "MakePrivateModalController"
-				scope: $scope
-			}
-
-		$scope.openMakeTokenBasedModal = () ->
-			$modal.open {
-				templateUrl: "makeTokenBasedModalTemplate"
-				controller:  "MakeTokenBasedModalController"
-				scope: $scope
-			}
-
-		$scope.getReadAndWriteTokenLink = () ->
-			if $scope?.project?.tokens?.readAndWrite?
-				location.origin + "/" + $scope.project.tokens.readAndWrite
-			else
-				''
-
-		$scope.getReadOnlyTokenLink = () ->
-			if $scope?.project?.tokens?.readOnly?
-				location.origin + "/read/" + $scope.project.tokens.readOnly
-			else
-				''
-
-		$scope.done = () ->
-			$modalInstance.close()
-
-		$scope.cancel = () ->
-			$modalInstance.dismiss()
-
-
-
-	App.controller "MakePublicModalController", ["$scope", "$modalInstance", "settings", ($scope, $modalInstance, settings) ->
-		$scope.inputs = {
-			privileges: "readAndWrite"
-		}
-
-		$scope.makePublic = () ->
-			$scope.project.publicAccesLevel = $scope.inputs.privileges
-			settings.saveProjectAdminSettings({publicAccessLevel: $scope.inputs.privileges})
-			$modalInstance.close()
-
-		$scope.cancel = () ->
-			$modalInstance.dismiss()
-	]
-
-	App.controller "MakeTokenBasedModalController", ["$scope", "$modalInstance", "settings", "event_tracking", ($scope, $modalInstance, settings, event_tracking) ->
-
 		$scope.makeTokenBased = () ->
 			$scope.project.publicAccesLevel = "tokenBased"
 			settings.saveProjectAdminSettings({publicAccessLevel: "tokenBased"})
 			event_tracking.sendMB 'project-make-token-based'
-			$modalInstance.close()
-
-		$scope.cancel = () ->
-			$modalInstance.dismiss()
-	]
 
-	App.controller "MakePrivateModalController", ["$scope", "$modalInstance", "settings", ($scope, $modalInstance, settings) ->
 		$scope.makePrivate = () ->
 			$scope.project.publicAccesLevel = "private"
 			settings.saveProjectAdminSettings({publicAccessLevel: "private"})
+
+		$scope.$watch "project.tokens.readAndWrite", (token) ->
+			if token?
+				$scope.readAndWriteTokenLink = "#{location.origin}/#{token}"
+			else
+				$scope.readAndWriteTokenLink = null
+
+		$scope.$watch "project.tokens.readOnly", (token) ->
+			if token?
+				$scope.readOnlyTokenLink = "#{location.origin}/#{token}"
+			else
+				$scope.readOnlyTokenLink = null
+
+		$scope.done = () ->
 			$modalInstance.close()
 
 		$scope.cancel = () ->
 			$modalInstance.dismiss()
-	]

services/web/public/stylesheets/app/editor/share.less

@@ -13,10 +13,9 @@
 	}
 
 	.public-access-level {
-		color: @gray;
 		padding-top: 0;
-		font-size: 12px;
-		padding-bottom: @line-height-computed/2;
+		font-size: 13px;
+		padding-bottom: @modal-inner-padding;
 		.access-token-display-area {
 			margin-top: @line-height-computed/4;
 			.access-token-wrapper {