From d01d6a35cfa84263c5c4ec8e11d09c5be53b1cb6 Mon Sep 17 00:00:00 2001 From: James Allen Date: Wed, 15 Feb 2017 09:47:37 +0100 Subject: [PATCH] Only create Controller when showing onboarding --- .../Features/Project/ProjectController.coffee | 2 +- .../project/editor/feature-onboarding.pug | 218 +++++++++--------- services/web/public/coffee/ide.coffee | 4 + .../ide/FeatureOnboardingController.coffee | 10 +- 4 files changed, 116 insertions(+), 118 deletions(-) diff --git a/services/web/app/coffee/Features/Project/ProjectController.coffee b/services/web/app/coffee/Features/Project/ProjectController.coffee index e674b2b63a..563ace8a51 100644 --- a/services/web/app/coffee/Features/Project/ProjectController.coffee +++ b/services/web/app/coffee/Features/Project/ProjectController.coffee @@ -225,7 +225,7 @@ module.exports = ProjectController = if !user_id? return cb() 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 if error? return cb(null, false) diff --git a/services/web/app/views/project/editor/feature-onboarding.pug b/services/web/app/views/project/editor/feature-onboarding.pug index 8bcdcbdbd2..ad62137241 100644 --- a/services/web/app/views/project/editor/feature-onboarding.pug +++ b/services/web/app/views/project/editor/feature-onboarding.pug @@ -1,112 +1,112 @@ -div(ng-controller="FeatureOnboardingController") - .feat-onboard( - ng-class="('feat-onboard-step' + onboarding.innerStep)" - ng-if="!state.loading && showCollabFeaturesOnboarding" - ng-cloak - stop-propagation="click" - ) - a.feat-onboard-dismiss( - href - ng-click="dismiss();" - ) × - .feat-onboard-wrapper - h1.feat-onboard-title - | Introducing  - span.feat-onboard-highlight Commenting - | & - span.feat-onboard-highlight Track Changes - p.feat-onboard-description - span.feat-onboard-highlight Commenting - | and - span.feat-onboard-highlight Track Changes - | will make it easier for you to work with peers in your documents. +.feat-onboard( + ng-controller="FeatureOnboardingController" + ng-class="('feat-onboard-step' + onboarding.innerStep)" + ng-if="!state.loading && ui.showCollabFeaturesOnboarding" + ng-cloak + stop-propagation="click" +) + a.feat-onboard-dismiss( + href + ng-click="dismiss();" + ) × + .feat-onboard-wrapper + h1.feat-onboard-title + | Introducing  + span.feat-onboard-highlight Commenting + | & + span.feat-onboard-highlight Track Changes + p.feat-onboard-description + span.feat-onboard-highlight Commenting + | and + span.feat-onboard-highlight Track Changes + | will make it easier for you to work with peers in your documents. - .feat-onboard-tutorial-wrapper - button.btn.btn-primary.feat-onboard-nav-btn( - ng-click="gotoPrevStep();" - ng-disabled="onboarding.innerStep === 1;") - i.fa.fa-arrow-left - div(ng-show="onboarding.innerStep === 1;") - video.feat-onboard-video( - video-play-state="onboarding.innerStep === 1;" - autoplay - loop - ) - source(src="/img/onboarding/review-panel/open-review.mp4", type="video/mp4") - img(src="/img/onboarding/review-panel/open-review.gif") - div(ng-show="onboarding.innerStep === 2;") - video.feat-onboard-video( - video-play-state="onboarding.innerStep === 2;" - autoplay - loop - ) - source(src="/img/onboarding/review-panel/commenting.mp4", type="video/mp4") - img(src="/img/onboarding/review-panel/commenting.gif") - div(ng-show="onboarding.innerStep === 3;") - video.feat-onboard-video( - video-play-state="onboarding.innerStep === 3;" - autoplay - loop - ) - source(src="/img/onboarding/review-panel/add-changes.mp4", type="video/mp4") - img(src="/img/onboarding/review-panel/add-changes.gif") - div(ng-show="onboarding.innerStep === 4;") - video.feat-onboard-video( - video-play-state="onboarding.innerStep === 4;" - autoplay - loop - ) - source(src="/img/onboarding/review-panel/accept-changes.mp4", type="video/mp4") - img(src="/img/onboarding/review-panel/accept-changes.gif") - button.btn.btn-primary.feat-onboard-nav-btn( - ng-click="gotoNextStep();" - ng-disabled="onboarding.innerStep === onboarding.nSteps;") - i.fa.fa-arrow-right + .feat-onboard-tutorial-wrapper + button.btn.btn-primary.feat-onboard-nav-btn( + ng-click="gotoPrevStep();" + ng-disabled="onboarding.innerStep === 1;") + i.fa.fa-arrow-left + div(ng-show="onboarding.innerStep === 1;") + video.feat-onboard-video( + video-play-state="onboarding.innerStep === 1;" + autoplay + loop + ) + source(src="/img/onboarding/review-panel/open-review.mp4", type="video/mp4") + img(src="/img/onboarding/review-panel/open-review.gif") + div(ng-show="onboarding.innerStep === 2;") + video.feat-onboard-video( + video-play-state="onboarding.innerStep === 2;" + autoplay + loop + ) + source(src="/img/onboarding/review-panel/commenting.mp4", type="video/mp4") + img(src="/img/onboarding/review-panel/commenting.gif") + div(ng-show="onboarding.innerStep === 3;") + video.feat-onboard-video( + video-play-state="onboarding.innerStep === 3;" + autoplay + loop + ) + source(src="/img/onboarding/review-panel/add-changes.mp4", type="video/mp4") + img(src="/img/onboarding/review-panel/add-changes.gif") + div(ng-show="onboarding.innerStep === 4;") + video.feat-onboard-video( + video-play-state="onboarding.innerStep === 4;" + autoplay + loop + ) + source(src="/img/onboarding/review-panel/accept-changes.mp4", type="video/mp4") + img(src="/img/onboarding/review-panel/accept-changes.gif") + button.btn.btn-primary.feat-onboard-nav-btn( + ng-click="gotoNextStep();" + ng-disabled="onboarding.innerStep === onboarding.nSteps;") + i.fa.fa-arrow-right - div(ng-switch="onboarding.innerStep") - .row(ng-switch-when="1") - .col-xs-6 - h2.feat-onboard-adv-title Commenting - p.feat-onboard-description Want to discuss specific parts of the text? - p.feat-onboard-description Use our brand-new commenting system. - .col-xs-6 - h2.feat-onboard-adv-title Track Changes - p.feat-onboard-description See changes in your documents, live. - p.feat-onboard-description Track, accept and reject changes individually. - .row(ng-switch-when="2") - .col-xs-12 - h2.feat-onboard-adv-title Commenting - p.feat-onboard-description Just select a span of text and click on - span.feat-onboard-highlight “Add comment” - | . - p.feat-onboard-description - span.feat-onboard-highlight Comments - | can be - span.feat-onboard-highlight replied - | to, - span.feat-onboard-highlight resolved - | and permanently - span.feat-onboard-highlight deleted - | . - .row(ng-switch-when="3") - .col-xs-12 - h2.feat-onboard-adv-title Track Changes - p.feat-onboard-description - | Let your peers know what you've been up to. - p.feat-onboard-description - | Click on the - span.feat-onboard-highlight “Track Changes” - | toggle to start marking your insertions, as well as your deletions. + div(ng-switch="onboarding.innerStep") + .row(ng-switch-when="1") + .col-xs-6 + h2.feat-onboard-adv-title Commenting + p.feat-onboard-description Want to discuss specific parts of the text? + p.feat-onboard-description Use our brand-new commenting system. + .col-xs-6 + h2.feat-onboard-adv-title Track Changes + p.feat-onboard-description See changes in your documents, live. + p.feat-onboard-description Track, accept and reject changes individually. + .row(ng-switch-when="2") + .col-xs-12 + h2.feat-onboard-adv-title Commenting + p.feat-onboard-description Just select a span of text and click on + span.feat-onboard-highlight “Add comment” + | . + p.feat-onboard-description + span.feat-onboard-highlight Comments + | can be + span.feat-onboard-highlight replied + | to, + span.feat-onboard-highlight resolved + | and permanently + span.feat-onboard-highlight deleted + | . + .row(ng-switch-when="3") + .col-xs-12 + h2.feat-onboard-adv-title Track Changes + p.feat-onboard-description + | Let your peers know what you've been up to. + p.feat-onboard-description + | Click on the + span.feat-onboard-highlight “Track Changes” + | toggle to start marking your insertions, as well as your deletions. - .row(ng-switch-when="4") - .col-xs-12 - h2.feat-onboard-adv-title Track Changes - p.feat-onboard-description Upon reviewing, - span.feat-onboard-highlight changes - | can be accepted or undone. - p.feat-onboard-description - | Click  - span.feat-onboard-highlight “Accept” - | or  - span.feat-onboard-highlight “Reject” - | to incorporate or discard an individual change. + .row(ng-switch-when="4") + .col-xs-12 + h2.feat-onboard-adv-title Track Changes + p.feat-onboard-description Upon reviewing, + span.feat-onboard-highlight changes + | can be accepted or undone. + p.feat-onboard-description + | Click  + span.feat-onboard-highlight “Accept” + | or  + span.feat-onboard-highlight “Reject” + | to incorporate or discard an individual change. diff --git a/services/web/public/coffee/ide.coffee b/services/web/public/coffee/ide.coffee index 9bf86d576e..9fbbfe9937 100644 --- a/services/web/public/coffee/ide.coffee +++ b/services/web/public/coffee/ide.coffee @@ -72,6 +72,10 @@ define [ reviewPanelOpen: localStorage("ui.reviewPanelOpen.#{window.project_id}") } $scope.user = window.user + + $scope.$watch "project.features.trackChangesVisible", (visible) -> + return if !visible? + $scope.ui.showCollabFeaturesOnboarding = window.showTrackChangesOnboarding and visible $scope.shouldABTestPlans = false if $scope.user.signUpDate >= '2016-10-27' diff --git a/services/web/public/coffee/ide/FeatureOnboardingController.coffee b/services/web/public/coffee/ide/FeatureOnboardingController.coffee index 20700bc9a3..156b3c9b91 100644 --- a/services/web/public/coffee/ide/FeatureOnboardingController.coffee +++ b/services/web/public/coffee/ide/FeatureOnboardingController.coffee @@ -5,16 +5,10 @@ define [ $scope.onboarding = innerStep: 1 nSteps: 4 - - $scope.$watch "project.features.trackChangesVisible", (visible) -> - return if !visible? - $scope.showCollabFeaturesOnboarding = window.showTrackChangesOnboarding and visible $scope.dismiss = () -> - event_tracking.sendMB "shown-track-changes-onboarding" - $scope.$applyAsync(() -> $scope.showCollabFeaturesOnboarding = false) - $(document).off "keydown", handleKeydown - $(document).off "click", $scope.dismiss + event_tracking.sendMB "shown-track-changes-onboarding-2" + $scope.$applyAsync(() -> $scope.ui.showCollabFeaturesOnboarding = false) $scope.gotoPrevStep = () -> if $scope.onboarding.innerStep > 1