Only create Controller when showing onboarding

This commit is contained in:
James Allen 2017-02-15 09:47:37 +01:00
parent bdee15128b
commit d01d6a35cf
4 changed files with 116 additions and 118 deletions

View file

@ -225,7 +225,7 @@ module.exports = ProjectController =
if !user_id? if !user_id?
return cb() return cb()
timeout = setTimeout cb, 500 timeout = setTimeout cb, 500
AnalyticsManager.getLastOccurance user_id, "shown-track-changes-onboarding", (error, event) -> AnalyticsManager.getLastOccurance user_id, "shown-track-changes-onboarding-2", (error, event) ->
clearTimeout timeout clearTimeout timeout
if error? if error?
return cb(null, false) return cb(null, false)

View file

@ -1,112 +1,112 @@
div(ng-controller="FeatureOnboardingController") .feat-onboard(
.feat-onboard( ng-controller="FeatureOnboardingController"
ng-class="('feat-onboard-step' + onboarding.innerStep)" ng-class="('feat-onboard-step' + onboarding.innerStep)"
ng-if="!state.loading && showCollabFeaturesOnboarding" ng-if="!state.loading && ui.showCollabFeaturesOnboarding"
ng-cloak ng-cloak
stop-propagation="click" stop-propagation="click"
) )
a.feat-onboard-dismiss( a.feat-onboard-dismiss(
href href
ng-click="dismiss();" ng-click="dismiss();"
) × ) ×
.feat-onboard-wrapper .feat-onboard-wrapper
h1.feat-onboard-title h1.feat-onboard-title
| Introducing  | Introducing 
span.feat-onboard-highlight Commenting span.feat-onboard-highlight Commenting
| & | &
span.feat-onboard-highlight Track Changes span.feat-onboard-highlight Track Changes
p.feat-onboard-description p.feat-onboard-description
span.feat-onboard-highlight Commenting span.feat-onboard-highlight Commenting
| and | and
span.feat-onboard-highlight Track Changes span.feat-onboard-highlight Track Changes
| will make it easier for you to work with peers in your documents. | will make it easier for you to work with peers in your documents.
.feat-onboard-tutorial-wrapper .feat-onboard-tutorial-wrapper
button.btn.btn-primary.feat-onboard-nav-btn( button.btn.btn-primary.feat-onboard-nav-btn(
ng-click="gotoPrevStep();" ng-click="gotoPrevStep();"
ng-disabled="onboarding.innerStep === 1;") ng-disabled="onboarding.innerStep === 1;")
i.fa.fa-arrow-left i.fa.fa-arrow-left
div(ng-show="onboarding.innerStep === 1;") div(ng-show="onboarding.innerStep === 1;")
video.feat-onboard-video( video.feat-onboard-video(
video-play-state="onboarding.innerStep === 1;" video-play-state="onboarding.innerStep === 1;"
autoplay autoplay
loop loop
) )
source(src="/img/onboarding/review-panel/open-review.mp4", type="video/mp4") source(src="/img/onboarding/review-panel/open-review.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/open-review.gif") img(src="/img/onboarding/review-panel/open-review.gif")
div(ng-show="onboarding.innerStep === 2;") div(ng-show="onboarding.innerStep === 2;")
video.feat-onboard-video( video.feat-onboard-video(
video-play-state="onboarding.innerStep === 2;" video-play-state="onboarding.innerStep === 2;"
autoplay autoplay
loop loop
) )
source(src="/img/onboarding/review-panel/commenting.mp4", type="video/mp4") source(src="/img/onboarding/review-panel/commenting.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/commenting.gif") img(src="/img/onboarding/review-panel/commenting.gif")
div(ng-show="onboarding.innerStep === 3;") div(ng-show="onboarding.innerStep === 3;")
video.feat-onboard-video( video.feat-onboard-video(
video-play-state="onboarding.innerStep === 3;" video-play-state="onboarding.innerStep === 3;"
autoplay autoplay
loop loop
) )
source(src="/img/onboarding/review-panel/add-changes.mp4", type="video/mp4") source(src="/img/onboarding/review-panel/add-changes.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/add-changes.gif") img(src="/img/onboarding/review-panel/add-changes.gif")
div(ng-show="onboarding.innerStep === 4;") div(ng-show="onboarding.innerStep === 4;")
video.feat-onboard-video( video.feat-onboard-video(
video-play-state="onboarding.innerStep === 4;" video-play-state="onboarding.innerStep === 4;"
autoplay autoplay
loop loop
) )
source(src="/img/onboarding/review-panel/accept-changes.mp4", type="video/mp4") source(src="/img/onboarding/review-panel/accept-changes.mp4", type="video/mp4")
img(src="/img/onboarding/review-panel/accept-changes.gif") img(src="/img/onboarding/review-panel/accept-changes.gif")
button.btn.btn-primary.feat-onboard-nav-btn( button.btn.btn-primary.feat-onboard-nav-btn(
ng-click="gotoNextStep();" ng-click="gotoNextStep();"
ng-disabled="onboarding.innerStep === onboarding.nSteps;") ng-disabled="onboarding.innerStep === onboarding.nSteps;")
i.fa.fa-arrow-right i.fa.fa-arrow-right
div(ng-switch="onboarding.innerStep") div(ng-switch="onboarding.innerStep")
.row(ng-switch-when="1") .row(ng-switch-when="1")
.col-xs-6 .col-xs-6
h2.feat-onboard-adv-title Commenting h2.feat-onboard-adv-title Commenting
p.feat-onboard-description Want to discuss specific parts of the text? p.feat-onboard-description Want to discuss specific parts of the text?
p.feat-onboard-description Use our brand-new commenting system. p.feat-onboard-description Use our brand-new commenting system.
.col-xs-6 .col-xs-6
h2.feat-onboard-adv-title Track Changes h2.feat-onboard-adv-title Track Changes
p.feat-onboard-description See changes in your documents, live. p.feat-onboard-description See changes in your documents, live.
p.feat-onboard-description Track, accept and reject changes individually. p.feat-onboard-description Track, accept and reject changes individually.
.row(ng-switch-when="2") .row(ng-switch-when="2")
.col-xs-12 .col-xs-12
h2.feat-onboard-adv-title Commenting h2.feat-onboard-adv-title Commenting
p.feat-onboard-description Just select a span of text and click on p.feat-onboard-description Just select a span of text and click on
span.feat-onboard-highlight “Add comment” span.feat-onboard-highlight “Add comment”
| . | .
p.feat-onboard-description p.feat-onboard-description
span.feat-onboard-highlight Comments span.feat-onboard-highlight Comments
| can be | can be
span.feat-onboard-highlight replied span.feat-onboard-highlight replied
| to, | to,
span.feat-onboard-highlight resolved span.feat-onboard-highlight resolved
| and permanently | and permanently
span.feat-onboard-highlight deleted span.feat-onboard-highlight deleted
| . | .
.row(ng-switch-when="3") .row(ng-switch-when="3")
.col-xs-12 .col-xs-12
h2.feat-onboard-adv-title Track Changes h2.feat-onboard-adv-title Track Changes
p.feat-onboard-description p.feat-onboard-description
| Let your peers know what you've been up to. | Let your peers know what you've been up to.
p.feat-onboard-description p.feat-onboard-description
| Click on the | Click on the
span.feat-onboard-highlight “Track Changes” span.feat-onboard-highlight “Track Changes”
| toggle to start marking your insertions, as well as your deletions. | toggle to start marking your insertions, as well as your deletions.
.row(ng-switch-when="4") .row(ng-switch-when="4")
.col-xs-12 .col-xs-12
h2.feat-onboard-adv-title Track Changes h2.feat-onboard-adv-title Track Changes
p.feat-onboard-description Upon reviewing, p.feat-onboard-description Upon reviewing,
span.feat-onboard-highlight changes span.feat-onboard-highlight changes
| can be accepted or undone. | can be accepted or undone.
p.feat-onboard-description p.feat-onboard-description
| Click  | Click 
span.feat-onboard-highlight “Accept” span.feat-onboard-highlight “Accept”
| or  | or 
span.feat-onboard-highlight “Reject” span.feat-onboard-highlight “Reject”
| to incorporate or discard an individual change. | to incorporate or discard an individual change.

View file

@ -72,6 +72,10 @@ define [
reviewPanelOpen: localStorage("ui.reviewPanelOpen.#{window.project_id}") reviewPanelOpen: localStorage("ui.reviewPanelOpen.#{window.project_id}")
} }
$scope.user = window.user $scope.user = window.user
$scope.$watch "project.features.trackChangesVisible", (visible) ->
return if !visible?
$scope.ui.showCollabFeaturesOnboarding = window.showTrackChangesOnboarding and visible
$scope.shouldABTestPlans = false $scope.shouldABTestPlans = false
if $scope.user.signUpDate >= '2016-10-27' if $scope.user.signUpDate >= '2016-10-27'

View file

@ -5,16 +5,10 @@ define [
$scope.onboarding = $scope.onboarding =
innerStep: 1 innerStep: 1
nSteps: 4 nSteps: 4
$scope.$watch "project.features.trackChangesVisible", (visible) ->
return if !visible?
$scope.showCollabFeaturesOnboarding = window.showTrackChangesOnboarding and visible
$scope.dismiss = () -> $scope.dismiss = () ->
event_tracking.sendMB "shown-track-changes-onboarding" event_tracking.sendMB "shown-track-changes-onboarding-2"
$scope.$applyAsync(() -> $scope.showCollabFeaturesOnboarding = false) $scope.$applyAsync(() -> $scope.ui.showCollabFeaturesOnboarding = false)
$(document).off "keydown", handleKeydown
$(document).off "click", $scope.dismiss
$scope.gotoPrevStep = () -> $scope.gotoPrevStep = () ->
if $scope.onboarding.innerStep > 1 if $scope.onboarding.innerStep > 1