fixes: U4-10600 Add "Don't show this tour again" option
This commit is contained in:
@@ -16,7 +16,7 @@
|
||||
|
||||
scope.model.endTour = function() {
|
||||
unbindEvent();
|
||||
tourService.endTour();
|
||||
tourService.endTour(scope.model);
|
||||
backdropService.close();
|
||||
};
|
||||
|
||||
@@ -26,6 +26,12 @@
|
||||
backdropService.close();
|
||||
};
|
||||
|
||||
scope.model.disableTour = function() {
|
||||
unbindEvent();
|
||||
tourService.disableTour(scope.model);
|
||||
backdropService.close();
|
||||
}
|
||||
|
||||
function onInit() {
|
||||
popover = el.find(".umb-tour__popover");
|
||||
popover.hide();
|
||||
|
||||
@@ -11,6 +11,7 @@
|
||||
"name": "Introduction",
|
||||
"alias": "umbIntroIntroduction",
|
||||
"group": "Getting Started",
|
||||
"allowDisable": true,
|
||||
"steps": [
|
||||
{
|
||||
title: "Welcome to Umbraco - The Friendly CMS",
|
||||
@@ -419,13 +420,20 @@
|
||||
currentTour = tour;
|
||||
}
|
||||
|
||||
function endTour() {
|
||||
function endTour(tour) {
|
||||
eventsService.emit("appState.tour.end", tour);
|
||||
currentTour = null;
|
||||
eventsService.emit("appState.tour.end");
|
||||
}
|
||||
|
||||
function disableTour(tour) {
|
||||
tour.disabled = true;
|
||||
saveInLocalStorage(tour);
|
||||
eventsService.emit("appState.tour.end", tour);
|
||||
currentTour = null;
|
||||
}
|
||||
|
||||
function completeTour(tour) {
|
||||
tour.completed = true;
|
||||
saveInLocalStorage(tour);
|
||||
eventsService.emit("appState.tour.complete", tour);
|
||||
currentTour = null;
|
||||
@@ -452,11 +460,19 @@
|
||||
}
|
||||
|
||||
function getCompletedTours() {
|
||||
var completedTours = localStorageService.get(localStorageKey);
|
||||
var storedTours = localStorageService.get(localStorageKey);
|
||||
var completedTours = _.where(storedTours, {completed: true});
|
||||
var aliases = _.pluck(completedTours, "alias");
|
||||
return aliases;
|
||||
}
|
||||
|
||||
function getDisabledTours() {
|
||||
var storedTours = localStorageService.get(localStorageKey);
|
||||
var disabledTours = _.where(storedTours, {disabled: true});
|
||||
var aliases = _.pluck(disabledTours, "alias");
|
||||
return aliases;
|
||||
}
|
||||
|
||||
///////////
|
||||
|
||||
function setCompletedTours() {
|
||||
@@ -483,23 +499,28 @@
|
||||
var storedTours = [];
|
||||
var tourFound = false;
|
||||
|
||||
// check if something exists in local storage
|
||||
if (localStorageService.get(localStorageKey)) {
|
||||
storedTours = localStorageService.get(localStorageKey);
|
||||
}
|
||||
|
||||
// update existing tour in localstorage if it's already there
|
||||
if (storedTours.length > 0) {
|
||||
angular.forEach(storedTours, function (storedTour) {
|
||||
if (storedTour.alias === tour.alias) {
|
||||
storedTour.completed = true;
|
||||
storedTour.completed = storedTour.completed ? storedTour.completed : tour.completed;
|
||||
storedTour.disabled = storedTour.disabled ? storedTour.disabled : tour.disabled;
|
||||
tourFound = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// create new entry in local storage
|
||||
if (!tourFound) {
|
||||
var storageObject = {
|
||||
"alias": tour.alias,
|
||||
"completed": true
|
||||
"completed": tour.completed,
|
||||
"disabled": tour.disabled
|
||||
};
|
||||
storedTours.push(storageObject);
|
||||
}
|
||||
@@ -511,12 +532,14 @@
|
||||
var service = {
|
||||
startTour: startTour,
|
||||
endTour: endTour,
|
||||
disableTour: disableTour,
|
||||
completeTour: completeTour,
|
||||
getCurrentTour: getCurrentTour,
|
||||
getAllTours: getAllTours,
|
||||
getGroupedTours: getGroupedTours,
|
||||
getTourByAlias: getTourByAlias,
|
||||
getCompletedTours: getCompletedTours
|
||||
getCompletedTours: getCompletedTours,
|
||||
getDisabledTours: getDisabledTours,
|
||||
};
|
||||
|
||||
return service;
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<div ng-if="!configuredView && !elementNotFound">
|
||||
|
||||
<!-- Regular steps -->
|
||||
<umb-tour-step ng-if="model.currentStepIndex < model.steps.length" on-close="model.endTour()" hide-close="model.currentStep.type === 'intro'">
|
||||
<umb-tour-step ng-if="model.currentStepIndex < model.steps.length" on-close="model.endTour()">
|
||||
|
||||
<umb-tour-step-header
|
||||
title="model.currentStep.title">
|
||||
@@ -17,20 +17,25 @@
|
||||
content="model.currentStep.content">
|
||||
</umb-tour-step-content>
|
||||
|
||||
<umb-tour-step-footer class="flex justify-between items-center">
|
||||
<umb-tour-step-footer>
|
||||
|
||||
<umb-tour-step-counter
|
||||
current-step="model.currentStepIndex + 1"
|
||||
total-steps="model.steps.length">
|
||||
</umb-tour-step-counter>
|
||||
|
||||
<div ng-if="model.currentStep.type !== 'intro'">
|
||||
<umb-button size="xs" ng-if="!model.currentStep.event" button-style="success" type="button" action="model.nextStep()" label="Next"></umb-button>
|
||||
</div>
|
||||
<div class="flex justify-between items-center">
|
||||
|
||||
<div ng-if="model.currentStep.type === 'intro'">
|
||||
<umb-button size="m" button-style="link" type="button" action="model.endTour()" label="Do it later"></umb-button>
|
||||
<umb-button size="m" button-style="success" type="button" action="model.nextStep()" label="Start tour"></umb-button>
|
||||
<div>
|
||||
<umb-tour-step-counter
|
||||
current-step="model.currentStepIndex + 1"
|
||||
total-steps="model.steps.length">
|
||||
</umb-tour-step-counter>
|
||||
<div ng-if="model.allowDisable && model.currentStep.type === 'intro'" style="font-size: 13px;"><a href="" class="underline" ng-click="model.disableTour()">Don't show this tour again</a></div>
|
||||
</div>
|
||||
|
||||
<div ng-if="model.currentStep.type !== 'intro'">
|
||||
<umb-button size="xs" ng-if="!model.currentStep.event" button-style="success" type="button" action="model.nextStep()" label="Next"></umb-button>
|
||||
</div>
|
||||
|
||||
<div ng-if="model.currentStep.type === 'intro'">
|
||||
<umb-button size="m" button-style="success" type="button" action="model.nextStep()" label="Start tour"></umb-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</umb-tour-step-footer>
|
||||
|
||||
@@ -32,14 +32,15 @@ function startUpDynamicContentController($timeout, dashboardResource, assetsServ
|
||||
// load tours
|
||||
vm.tours = tourService.getGroupedTours();
|
||||
|
||||
// get list of completed tours
|
||||
// get list of completed tours and disabled tours
|
||||
var completedTours = tourService.getCompletedTours();
|
||||
var disabledTours = tourService.getDisabledTours();
|
||||
|
||||
// get intro tour
|
||||
var introTour = tourService.getTourByAlias("umbIntroIntroduction");
|
||||
|
||||
// start tour if it hasn't been completed
|
||||
if(completedTours.indexOf(introTour.alias) === -1) {
|
||||
// start intro tour if it hasn't been completed or disabled
|
||||
if(completedTours.indexOf(introTour.alias) === -1 && disabledTours.indexOf(introTour.alias) === -1) {
|
||||
tourService.startTour(introTour);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user