mirror of
https://github.com/LaCasemate/fab-manager.git
synced 2025-01-17 06:52:27 +01:00
settings tour
This commit is contained in:
Sylvain
parent
a56f6c4e18
commit
9f9656caa4
@ -12,8 +12,8 @@
|
||||
*/
|
||||
'use strict';
|
||||
|
||||
Application.Controllers.controller('SettingsController', ['$scope', '$rootScope', '$filter', '$uibModal', 'dialogs', 'Setting', 'growl', 'settingsPromise', 'privacyDraftsPromise', 'cgvFile', 'cguFile', 'logoFile', 'logoBlackFile', 'faviconFile', 'profileImageFile', 'CSRF', '_t',
|
||||
function ($scope, $rootScope, $filter, $uibModal, dialogs, Setting, growl, settingsPromise, privacyDraftsPromise, cgvFile, cguFile, logoFile, logoBlackFile, faviconFile, profileImageFile, CSRF, _t) {
|
||||
Application.Controllers.controller('SettingsController', ['$scope', '$rootScope', '$filter', '$uibModal', 'dialogs', 'Setting', 'growl', 'settingsPromise', 'privacyDraftsPromise', 'cgvFile', 'cguFile', 'logoFile', 'logoBlackFile', 'faviconFile', 'profileImageFile', 'CSRF', '_t', 'Member', 'uiTourService',
|
||||
function ($scope, $rootScope, $filter, $uibModal, dialogs, Setting, growl, settingsPromise, privacyDraftsPromise, cgvFile, cguFile, logoFile, logoBlackFile, faviconFile, profileImageFile, CSRF, _t, Member, uiTourService) {
|
||||
/* PUBLIC SCOPE */
|
||||
|
||||
// timepickers steps configuration
|
||||
@ -48,6 +48,9 @@ Application.Controllers.controller('SettingsController', ['$scope', '$rootScope'
|
||||
cgv: false
|
||||
};
|
||||
|
||||
// default tab: general
|
||||
$scope.tabs = { active: 0 };
|
||||
|
||||
// full history of privacy policy drafts
|
||||
$scope.privacyDraftsHistory = [];
|
||||
|
||||
@ -356,6 +359,117 @@ Application.Controllers.controller('SettingsController', ['$scope', '$rootScope'
|
||||
$scope.codeMirrorEditor = editor;
|
||||
}
|
||||
|
||||
/**
|
||||
* Setup the feature-tour for the admin/settings page.
|
||||
* This is intended as a contextual help (when pressing F1)
|
||||
*/
|
||||
$scope.setupSettingsTour = function () {
|
||||
// get the tour defined by the ui-tour directive
|
||||
const uitour = uiTourService.getTourByName('settings');
|
||||
uitour.createStep({
|
||||
selector: 'body',
|
||||
stepId: 'welcome',
|
||||
order: 0,
|
||||
title: _t('app.admin.tour.settings.welcome.title'),
|
||||
content: _t('app.admin.tour.settings.welcome.content'),
|
||||
placement: 'bottom',
|
||||
orphan: true
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: '.admin-settings .home-page-content h4',
|
||||
stepId: 'home',
|
||||
order: 1,
|
||||
title: _t('app.admin.tour.settings.home.title'),
|
||||
content: _t('app.admin.tour.settings.home.content'),
|
||||
placement: 'bottom'
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: '.admin-settings .home-page-content .note-toolbar .note-insert div',
|
||||
stepId: 'components',
|
||||
order: 2,
|
||||
title: _t('app.admin.tour.settings.components.title'),
|
||||
content: _t('app.admin.tour.settings.components.content'),
|
||||
placement: 'bottom'
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: '.admin-settings .home-page-content .note-toolbar .btn-codeview',
|
||||
stepId: 'codeview',
|
||||
order: 3,
|
||||
title: _t('app.admin.tour.settings.codeview.title'),
|
||||
content: _t('app.admin.tour.settings.codeview.content'),
|
||||
placement: 'bottom'
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: '.admin-settings .reset-button',
|
||||
stepId: 'reset',
|
||||
order: 4,
|
||||
title: _t('app.admin.tour.settings.reset.title'),
|
||||
content: _t('app.admin.tour.settings.reset.content'),
|
||||
placement: 'left'
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: '.admin-settings .home-page-style',
|
||||
stepId: 'css',
|
||||
order: 5,
|
||||
title: _t('app.admin.tour.settings.css.title'),
|
||||
content: _t('app.admin.tour.settings.css.content'),
|
||||
placement: 'top'
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: '.admin-settings .about-page-tab',
|
||||
stepId: 'about',
|
||||
order: 6,
|
||||
title: _t('app.admin.tour.settings.about.title'),
|
||||
content: _t('app.admin.tour.settings.about.content'),
|
||||
placement: 'bottom'
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: '.admin-settings .privacy-page-tab',
|
||||
stepId: 'privacy',
|
||||
order: 7,
|
||||
title: _t('app.admin.tour.settings.privacy.title'),
|
||||
content: _t('app.admin.tour.settings.privacy.content'),
|
||||
placement: 'bottom'
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: '.admin-settings .history-select',
|
||||
stepId: 'draft',
|
||||
order: 8,
|
||||
title: _t('app.admin.tour.settings.draft.title'),
|
||||
content: _t('app.admin.tour.settings.draft.content'),
|
||||
placement: 'bottom'
|
||||
});
|
||||
uitour.createStep({
|
||||
selector: 'body',
|
||||
stepId: 'conclusion',
|
||||
order: 9,
|
||||
title: _t('app.admin.tour.conclusion.title'),
|
||||
content: _t('app.admin.tour.conclusion.content'),
|
||||
placement: 'bottom',
|
||||
orphan: true
|
||||
});
|
||||
// on step change, change the active tab if needed
|
||||
uitour.on('stepChanged', function (nextStep) {
|
||||
if (nextStep.stepId === 'home' || nextStep.stepId === 'css') { $scope.tabs.active = 1; }
|
||||
if (nextStep.stepId === 'about') { $scope.tabs.active = 2; }
|
||||
if (nextStep.stepId === 'privacy' || nextStep.stepId === 'draft') { $scope.tabs.active = 3; }
|
||||
});
|
||||
// on tour end, save the status in database
|
||||
uitour.on('ended', function () {
|
||||
if (uitour.getStatus() === uitour.Status.ON && $scope.currentUser.profile.tours.indexOf('settings') < 0) {
|
||||
Member.completeTour({ id: $scope.currentUser.id }, { tour: 'settings' }, function (res) {
|
||||
$scope.currentUser.profile.tours = res.tours;
|
||||
});
|
||||
}
|
||||
});
|
||||
// if the user has never seen the tour, show him now
|
||||
if ($scope.currentUser.profile.tours.indexOf('settings') < 0) {
|
||||
uitour.start();
|
||||
}
|
||||
// start this tour when an user press F1 - this is contextual help
|
||||
window.addEventListener('keydown', handleF1);
|
||||
}
|
||||
|
||||
/* PRIVATE SCOPE */
|
||||
|
||||
/**
|
||||
@ -406,8 +520,23 @@ Application.Controllers.controller('SettingsController', ['$scope', '$rootScope'
|
||||
$scope.$watch('advancedSettings.open', function (newValue) {
|
||||
if (newValue) $scope.codeMirrorEditor.refresh();
|
||||
})
|
||||
// listen the $destroy event of the controller to remove the F1 key binding
|
||||
$scope.$on('$destroy', function () {
|
||||
window.removeEventListener('keydown', handleF1);
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Callback used to trigger the feature tour when the user press the F1 key.
|
||||
* @param e {KeyboardEvent}
|
||||
*/
|
||||
const handleF1 = function (e) {
|
||||
if (e.key === 'F1') {
|
||||
e.preventDefault();
|
||||
const tour = uiTourService.getTourByName('settings');
|
||||
if (tour) { tour.start(); }
|
||||
}
|
||||
};
|
||||
// init the controller (call at the end !)
|
||||
return initialize();
|
||||
}
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<div class="row">
|
||||
<div class="col-md-12 home-page-content">
|
||||
<h4 translate>{{ 'app.admin.settings.customize_home_page' }}</h4>
|
||||
<button class="btn btn-default pull-right m-t-n-xl" ng-click="resetHomePage()" title="{{ 'app.admin.settings.reset_home_page' | translate }}"><i class="fa fa-undo"></i></button>
|
||||
<button class="btn btn-default pull-right m-t-n-xl reset-button" ng-click="resetHomePage()" title="{{ 'app.admin.settings.reset_home_page' | translate }}"><i class="fa fa-undo"></i></button>
|
||||
<summernote ng-model="homeContent.value"
|
||||
id="home_content"
|
||||
config="summernoteOptsHomePage">
|
||||
|
||||
@ -14,29 +14,35 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="m-lg admin-settings">
|
||||
<section class="m-lg admin-settings"
|
||||
ui-tour="settings"
|
||||
ui-tour-backdrop="true"
|
||||
ui-tour-template-url="'<%= asset_path "shared/tour-step-template.html" %>'"
|
||||
ui-tour-use-hotkeys="true"
|
||||
ui-tour-scroll-parent-id="content-main"
|
||||
post-render="setupSettingsTour">
|
||||
<div class="row">
|
||||
|
||||
<div class="col-md-12">
|
||||
<uib-tabset justified="true">
|
||||
<uib-tabset justified="true" active="tabs.active">
|
||||
|
||||
<uib-tab heading="{{ 'app.admin.settings.general' | translate }}">
|
||||
<uib-tab heading="{{ 'app.admin.settings.general' | translate }}" index="0">
|
||||
<ng-include src="'<%= asset_path "admin/settings/general.html" %>'"></ng-include>
|
||||
</uib-tab>
|
||||
|
||||
<uib-tab heading="{{ 'app.admin.settings.home_page' | translate }}">
|
||||
<uib-tab heading="{{ 'app.admin.settings.home_page' | translate }}" index="1">
|
||||
<ng-include src="'<%= asset_path "admin/settings/home_page.html" %>'"></ng-include>
|
||||
</uib-tab>
|
||||
|
||||
<uib-tab heading="{{ 'app.admin.settings.about' | translate }}">
|
||||
<uib-tab heading="{{ 'app.admin.settings.about' | translate }}" index="2" class="about-page-tab">
|
||||
<ng-include src="'<%= asset_path "admin/settings/about.html" %>'"></ng-include>
|
||||
</uib-tab>
|
||||
|
||||
<uib-tab heading="{{ 'app.admin.settings.privacy.title' | translate }}">
|
||||
<uib-tab heading="{{ 'app.admin.settings.privacy.title' | translate }}" index="3" class="privacy-page-tab">
|
||||
<ng-include src="'<%= asset_path "admin/settings/privacy.html" %>'"></ng-include>
|
||||
</uib-tab>
|
||||
|
||||
<uib-tab heading="{{ 'app.admin.settings.reservations' | translate }}">
|
||||
<uib-tab heading="{{ 'app.admin.settings.reservations' | translate }}" index="4">
|
||||
<ng-include src="'<%= asset_path "admin/settings/reservations.html" %>'"></ng-include>
|
||||
</uib-tab>
|
||||
</uib-tabset>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-md-offset-1">
|
||||
<select class="form-control m-b" ng-options="d.id as d.name for d in privacyDraftsHistory" ng-model="privacyPolicy.version" ng-change="handlePolicyRevisionChange()">
|
||||
<select class="form-control m-b history-select" ng-options="d.id as d.name for d in privacyDraftsHistory" ng-model="privacyPolicy.version" ng-change="handlePolicyRevisionChange()">
|
||||
<option value="" translate>{{ 'app.admin.settings.privacy.current_policy' }}</option>
|
||||
</select>
|
||||
<div class="text-justify" ng-model="privacyPolicy.bodyTemp" medium-editor options='{"placeholder": "{{ "app.admin.settings.input_the_main_content" | translate }}",
|
||||
|
||||
@ -1240,11 +1240,11 @@ fr:
|
||||
draft:
|
||||
title: "Brouillon"
|
||||
content: "Cliquez ici pour afficher un brouillon à trous d'une politique de confidentialité, qu'il ne vous reste plus qu'à relire et à compléter."
|
||||
open_api:
|
||||
welcome:
|
||||
title: "OpenAPI"
|
||||
content: "Fab-Manager propose une API ouverte permettant à des logiciels tiers de s'interfacer simplement avec ses données. Cet écran vous permet d'accorder des accès à cette API."
|
||||
doc:
|
||||
title: "Documentation"
|
||||
content: "Cliquez ici pour accéder à la documentation en ligne de l'API"
|
||||
open_api:
|
||||
welcome:
|
||||
title: "OpenAPI"
|
||||
content: "Fab-Manager propose une API ouverte permettant à des logiciels tiers de s'interfacer simplement avec ses données. Cet écran vous permet d'accorder des accès à cette API."
|
||||
doc:
|
||||
title: "Documentation"
|
||||
content: "Cliquez ici pour accéder à la documentation en ligne de l'API"
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user