start help tour by clicking on help in user menu

also: tour descriptions of home page items

app/assets/javascripts/controllers/application.js.erb

@@ -12,8 +12,8 @@
  * Full docs: https://github.com/decaffeinate/decaffeinate/blob/master/docs/suggestions.md
  */
 
-Application.Controllers.controller('ApplicationController', ['$rootScope', '$scope', '$window', '$locale', 'Session', 'AuthService', 'Auth', '$uibModal', '$state', 'growl', 'Notification', '$interval', 'Setting', '_t', 'Version',
-  function ($rootScope, $scope, $window, $locale, Session, AuthService, Auth, $uibModal, $state, growl, Notification, $interval, Setting, _t, Version) {
+Application.Controllers.controller('ApplicationController', ['$rootScope', '$scope', '$window', '$locale', '$timeout', 'Session', 'AuthService', 'Auth', '$uibModal', '$state', 'growl', 'Notification', '$interval', 'Setting', '_t', 'Version',
+  function ($rootScope, $scope, $window, $locale, $timeout, Session, AuthService, Auth, $uibModal, $state, growl, Notification, $interval, Setting, _t, Version) {
   /* PRIVATE STATIC CONSTANTS */
 
     // User's notifications will get refreshed every 30s
@@ -267,8 +267,12 @@ Application.Controllers.controller('ApplicationController', ['$rootScope', '$sco
       toggler.toggleClass('active');
     };
 
+    /**
+     * Open the modal dialog showing that an upgrade is available
+     */
     $scope.versionModal = function() {
       if ($scope.version.up_to_date) return;
+      if ($rootScope.currentUser.role !== 'admin') return;
 
       $uibModal.open({
         templateUrl: '<%= asset_path "admin/versions/upgradeModal.html" %>',
@@ -279,6 +283,20 @@ Application.Controllers.controller('ApplicationController', ['$rootScope', '$sco
       });
     }
 
+    /**
+     * Trigger the contextual help "feature tour".
+     * @param event {Object} see https://docs.angularjs.org/guide/expression#-event-
+     */
+    $scope.help = function (event) {
+      event.preventDefault();
+
+      // we wrap the event triggering into a $timeout to prevent conflicting with current $apply
+      $timeout(function () {
+        var evt = new KeyboardEvent('keydown', { key: 'F1' });
+        window.dispatchEvent(evt);
+      });
+    }
+
     /* PRIVATE SCOPE */
     /**
      * Kind of constructor: these actions will be realized first when the controller is loaded

app/assets/javascripts/controllers/home.js

@@ -1,12 +1,21 @@
 'use strict';
 
-Application.Controllers.controller('HomeController', ['$scope', '$stateParams', 'homeContentPromise', 'Member', 'uiTourService', '_t',
-  function ($scope, $stateParams, homeContentPromise, Member, uiTourService, _t) {
+Application.Controllers.controller('HomeController', ['$scope', '$stateParams', 'settingsPromise', 'Member', 'uiTourService', '_t',
+  function ($scope, $stateParams, settingsPromise, Member, uiTourService, _t) {
   /* PUBLIC SCOPE */
 
     // Home page HTML content
     $scope.homeContent = null;
 
+    // Status of the components in the home page (exists or not?)
+    $scope.status = {
+      news: false,
+      projects: false,
+      twitter: false,
+      members: false,
+      events: false
+    };
+
     /* PRIVATE SCOPE */
 
     /**
@@ -20,7 +29,7 @@ Application.Controllers.controller('HomeController', ['$scope', '$stateParams',
       }
 
       // We set the home page content, with the directives replacing the placeholders
-      $scope.homeContent = insertDirectives(homeContentPromise.setting.value);
+      $scope.homeContent = insertDirectives(settingsPromise.home_content);
 
       // setup the tour for admins
       if ($scope.currentUser && $scope.currentUser.role === 'admin') {
@@ -45,26 +54,31 @@ Application.Controllers.controller('HomeController', ['$scope', '$stateParams',
       node.querySelectorAll('div#news').forEach((newsNode) => {
         const news = document.createElement('news');
         newsNode.parentNode.replaceChild(news, newsNode);
+        $scope.status.news = true;
       });
 
       node.querySelectorAll('div#projects').forEach((projectsNode) => {
         const projects = document.createElement('projects');
         projectsNode.parentNode.replaceChild(projects, projectsNode);
+        $scope.status.projects = true;
       });
 
       node.querySelectorAll('div#twitter').forEach((twitterNode) => {
         const twitter = document.createElement('twitter');
         twitterNode.parentNode.replaceChild(twitter, twitterNode);
+        $scope.status.twitter = true;
       });
 
       node.querySelectorAll('div#members').forEach((membersNode) => {
         const members = document.createElement('members');
         membersNode.parentNode.replaceChild(members, membersNode);
+        $scope.status.members = true;
       });
 
       node.querySelectorAll('div#events').forEach((eventsNode) => {
         const events = document.createElement('events');
         eventsNode.parentNode.replaceChild(events, eventsNode);
+        $scope.status.events = true;
       });
 
       return node.outerHTML;
@@ -185,10 +199,69 @@ Application.Controllers.controller('HomeController', ['$scope', '$stateParams',
         content: _t('app.public.tour.welcome.profile.content'),
         placement: 'bottom'
       });
+      if ($scope.status.news && settingsPromise.home_blogpost) {
+        uitour.createStep({
+          selector: 'news',
+          stepId: 'news',
+          order: 13,
+          title: _t('app.public.tour.welcome.news.title'),
+          content: _t('app.public.tour.welcome.news.content'),
+          placement: 'bottom'
+        });
+      }
+      if ($scope.status.projects) {
+        uitour.createStep({
+          selector: 'projects',
+          stepId: 'last_projects',
+          order: 14,
+          title: _t('app.public.tour.welcome.last_projects.title'),
+          content: _t('app.public.tour.welcome.last_projects.content'),
+          placement: 'top'
+        });
+      }
+      if ($scope.status.twitter) {
+        uitour.createStep({
+          selector: 'twitter',
+          stepId: 'last_tweet',
+          order: 15,
+          title: _t('app.public.tour.welcome.last_tweet.title'),
+          content: _t('app.public.tour.welcome.last_tweet.content'),
+          placement: 'left'
+        });
+      }
+      if ($scope.status.members) {
+        uitour.createStep({
+          selector: 'members',
+          stepId: 'last_members',
+          order: 16,
+          title: _t('app.public.tour.welcome.last_members.title'),
+          content: _t('app.public.tour.welcome.last_members.content'),
+          placement: 'left'
+        });
+      }
+      if ($scope.status.events) {
+        uitour.createStep({
+          selector: 'events',
+          stepId: 'next_events',
+          order: 17,
+          title: _t('app.public.tour.welcome.next_events.title'),
+          content: _t('app.public.tour.welcome.next_events.content'),
+          placement: 'top'
+        });
+      }
+      uitour.createStep({
+        selector: 'body',
+        stepId: 'customize',
+        order: 18,
+        title: _t('app.public.tour.welcome.customize.title'),
+        content: _t('app.public.tour.welcome.customize.content'),
+        placement: 'bottom',
+        orphan: 'true'
+      });
       uitour.createStep({
         selector: '.app-generator .app-version',
         stepId: 'version',
-        order: 13,
+        order: 19,
         title: _t('app.public.tour.welcome.version.title'),
         content: _t('app.public.tour.welcome.version.content'),
         placement: 'top'
@@ -196,7 +269,7 @@ Application.Controllers.controller('HomeController', ['$scope', '$stateParams',
       uitour.createStep({
         selector: 'body',
         stepId: 'conclusion',
-        order: 14,
+        order: 20,
         title: _t('app.public.tour.conclusion.title'),
         content: _t('app.public.tour.conclusion.content'),
         placement: 'bottom',

app/assets/javascripts/router.js.erb

@@ -98,7 +98,7 @@ angular.module('application.router', ['ui.router'])
           }
         },
         resolve: {
-          homeContentPromise: ['Setting', function (Setting) { return Setting.get({ name: 'home_content' }).$promise; }]
+          settingsPromise: ['Setting', function (Setting) { return Setting.query({ names: "['home_content', 'home_blogpost']" }).$promise; }]
         }
       })
       .state('app.public.privacy', {

app/assets/templates/shared/header.html.erb

@@ -40,7 +40,8 @@
         <li><a ui-sref="app.logged.dashboard.events" translate>{{ 'app.public.common.my_events' }}</a></li>
         <li><a ui-sref="app.logged.dashboard.invoices" ng-hide="fablabWithoutInvoices" translate>{{ 'app.public.common.my_invoices' }}</a></li>
         <li><a ui-sref="app.logged.dashboard.wallet" translate>{{ 'app.public.common.my_wallet' }}</a></li>
-
+        <li class="divider" ng-if="currentUser.role === 'admin'"></li>
+        <li><a class="text-black pointer" ng-click="help($event)" ng-if="currentUser.role === 'admin'"><i class="fa fa-question-circle"></i> <span translate>{{ 'app.public.common.help' }}</span> </a></li>
         <li class="divider"></li>
         <li><a class="text-black pointer" ng-click="logout($event)"><i class="fa fa-power-off"></i> {{ 'app.public.common.sign_out' | translate }}</a></li>
       </ul>

config/locales/app.admin.fr.yml

@@ -1060,7 +1060,7 @@ fr:
       tour:
         conclusion:
           title: "Merci de votre attention"
-          content: "Affichez de l'aide en appuyant sur <strong>F1</strong> à n'importe quel moment.<br> Bonne continuation avec Fab-manager."
+          content: "<p>Si vous souhaitez relancer cette aide contextuelle, appuyez sur <strong>F1</strong> à n'importe quel moment ou cliquez sur [? Aide] depuis le menu utilisateur.</p><p>Si vous avez besoin d'aide supplémentaire, vous pouvez <a href='https://github.com/sleede/fab-manager/raw/master/doc/fr/guide_utilisation_fab_manager_v4.2.pdf' target='_blank'>consulter le guide d'utilisation</a> disponible en Français.</p><p>L'équipe de Fab-manager propose également du support personnalisé (aide à la prise en main, aide à l'installation, personnalisation, etc.), <a href='mailto:contact@fab-manager.com'>contactez-nous</a> pour plus d'informations.</p>"
         trainings:
           welcome:
             title: "Suivi formations"

config/locales/app.public.fr.yml

@@ -23,6 +23,9 @@ fr:
         my_invoices: "Mes factures"
         my_wallet: "Mon porte-monnaie"
 
+        # aide contextuelle
+        help: "Aide"
+
         # connexion / déconnexion
         sign_out: "Se déconnecter"
         sign_up: "S'inscrire"
@@ -382,7 +385,7 @@ fr:
       tour:
         conclusion:
           title: "Merci de votre attention"
-          content: "Affichez de l'aide en appuyant sur <strong>F1</strong> à n'importe quel moment.<br> Bonne continuation avec Fab-manager."
+          content: "<p>Si vous souhaitez relancer cette aide contextuelle, appuyez sur <strong>F1</strong> à n'importe quel moment ou cliquez sur [? Aide] depuis le menu utilisateur.</p><p>Si vous avez besoin d'aide supplémentaire, vous pouvez <a href='https://github.com/sleede/fab-manager/raw/master/doc/fr/guide_utilisation_fab_manager_v4.2.pdf' target='_blank'>consulter le guide d'utilisation</a> disponible en Français.</p><p>L'équipe de Fab-manager propose également du support personnalisé (aide à la prise en main, aide à l'installation, personnalisation, etc.), <a href='mailto:contact@fab-manager.com'>contactez-nous</a> pour plus d'informations.</p>"
         welcome:
           welcome:
             title: "Bienvenue dans Fab-manager"
@@ -423,6 +426,24 @@ fr:
           profile:
             title: "Menu utilisateur"
             content: "<p>Retrouvez ici vos informations personnelles ainsi que toute votre activité sur Fab-manager.</p><p>Cet espace est également disponible pour tous vos membres.</p>"
+          news:
+            title: "Les brèves"
+            content: "<p>Cet espace vous permet d'afficher les dernières actualités de votre structure.</p><p>Vous pouvez facilement changer son contenu depuis [Personnalisation] > [Page d'accueil].</p>"
+          last_projects:
+            title: "les derniers projets"
+            content: "<p>Ce carousel fait défiler les derniers projets documentés par vos membres.</p>"
+          last_tweet:
+            title: "Dernier tweet"
+            content: "<p>La dernier tweet de votre flux Twitter peut s'afficher ici.</p><p>Configurez-le depuis [Personnalisation] > [Page d'accueil].</p>"
+          last_members:
+            title: "Derniers membres"
+            content: "Les derniers members inscrits qui ont validé leur adresse et accepté d'être contactés, seront affichés ici."
+          next_events:
+            title: "Prochains évènements"
+            content: "Les trois prochains évènements programmés sont affichés dans cette espace."
+          customize:
+            title: "Personnalisez la page d'accueil"
+            content: "<p>Cette page peut être entièrement personnalisée.</p><p>Vous pouvez <a href='mailto:contact@fab-manager.com'>nous contactez</a> pour réaliser une personnalisation sur mesure de la page d'accueil.</p>"
           version:
             title: "Version de l'application"
             content: "Passez votre curseur sur cette icône pour connaître la version de Fab-manager. Si vous n'êtes pas à jour, cela vous sera signalé ici et vous pourrez alors obtenir des détails en cliquant dessus."