This commit is contained in:
afornerot 2019-11-20 09:45:12 +01:00
parent d540b9f815
commit ac8d60f5db
1 changed files with 451 additions and 44 deletions

View File

@ -8,14 +8,48 @@ templatetour+="<div class='popover-content'></div>";
templatetour+="<div class='popover-navigation'>";
templatetour+="<button class='btn btn-sm btn-default' data-role='prev'>« Prec</button>";
templatetour+="<button class='btn btn-sm btn-default' data-role='next'>Suiv »</button>";
templatetour+="<button class='btn btn-sm btn-default' data-role='end'>Fin</button>";
templatetour+="</div>";
templatetour+="<div class='popover-navigation'>"
templatetour+="<button onClick='$(\".popover\").hide(); top.callTour(\"MyTour\");' class='btn btn-sm btn-default'>Entête</button>";
templatetour+="<button onClick='$(\".popover\").hide(); top.callTour(\"MyTourAcceuil\");' class='btn btn-sm btn-default'>Page Accueil</button>";
templatetour+="<button class='btn btn-sm btn-default' data-role='end'>Tuto Accueil</button>";
templatetour+="</div>";
templatetour+="</div>";
var templatetour2;
templatetour2 ="<div class='popover tour' style='max-width:500px !important;'>";
templatetour2+="<div class='arrow'></div>";
templatetour2+="<h3 class='popover-title'></h3>";
templatetour2+="<div class='popover-content'></div>";
templatetour2+="<div class='popover-navigation'>";
templatetour2+="<button class='btn btn-sm btn-default' data-role='prev'>« Prec</button>";
templatetour2+="<button class='btn btn-sm btn-default' data-role='next'>Suiv »</button>";
templatetour2+="<button class='btn btn-sm btn-default' data-role='end'>Tuto Ajout Bureau</button>";
templatetour2+="</div>";
templatetour2+="</div>";
var templatetourSolo;
templatetourSolo="<div class='popover tour' style='max-width:500px !important;'>";
templatetourSolo+="<div class='arrow'></div>";
templatetourSolo+="<h3 class='popover-title'></h3>";
templatetourSolo+="<div class='popover-content'></div>";
templatetourSolo+="<div class='popover-navigation'>";
templatetourSolo+="<button class='btn btn-sm btn-default' data-role='prev'>« Prec</button>";
templatetourSolo+="<button class='btn btn-sm btn-default' data-role='next'>Suiv »</button>";
templatetourSolo+="<button class='btn btn-sm btn-default' data-role='end'>Fin</button>";
templatetourSolo+="</div>";
templatetourSolo+="</div>";
var templatetourLink;
templatetourLink="<div class='popover tour' style='max-width:500px !important;'>";
templatetourLink+="<div class='arrow'></div>";
templatetourLink+="<h3 class='popover-title'></h3>";
templatetourLink+="<div class='popover-content'></div>";
templatetourLink+="<div class='popover-navigation'>";
templatetourLink+="<button class='btn btn-sm btn-default' data-role='prev'>« Prec</button>";
templatetourLink+="<button class='btn btn-sm btn-default' data-role='next'>Suiv »</button>";
templatetourLink+="<a target='_blank' href='https://transnum.oo.ac-dijon.fr/products/files/doceditor.aspx?fileid=10627&doc=bW54dUwybk5NN1Z3Wk0zUU9RengzQStKZU5naWdZWFJUZlk1L0VOU3ErWT0_IjEwNjI3Ig2'><button class='btn btn-sm btn-default'>page groupe</button></a>";
templatetourLink+="</div>";
templatetourLink+="</div>";
function callTour(mytour) {
// Tour entête
if(mytour=="MyTour") {
@ -29,7 +63,7 @@ function callTour(mytour) {
top.$(".navbar-left").find("a").eq(0).click();
// On lance le tour au bout de 1s le temps que l'iframe se réalise
setTimeout(function(){top.$("iframe").first().prop('contentWindow').MyTourAccueil(); }, 2000);
setTimeout(function(){top.$("iframe").first().prop('contentWindow').MyTourAccueil(); }, 3000);
}
}
@ -39,47 +73,76 @@ function MyTour() {
name: "tour",
template: templatetour,
onEnd: function (tour) {
$("#page-51").prop('contentWindow').MyTourAccueil();
// On force l'affichage de la premiere frame
top.$(".navbar-left").find("a").eq(0).click();
// On lance le tour au bout de 1s le temps que l'iframe se réalise
setTimeout(function(){top.$("iframe").first().prop('contentWindow').MyTourAccueil(); }, 3000);
},
steps: [
{
element: "#logo",
title: "Transnum",
content: "Bienvenue sur le portail TRANSNUM"
content: "Bienvenue sur le portail TRANSNUM. A tout moment, vous pouvez cliquer ici, sur le logo de votre service, pour revenir à la page d'accueil de votre portail."
},
{
element: "#menu-profil",
title: "Votre Profil",
{
element: $("[title=Configuration]"),
title: "Configuration",
placement : "left",
content: "Vous pouvez modifier les informations vous concernant à cet emplacement. A droite du bouton 'profil', vous trouvez le bouton vous permettant de vous déconnecter du portail"
content: "Accédez ici aux outils de configuration de Transnum"
},
{
element: "#menu-notice",
title: "Charte utilisateur",
{
element: $("[title=Tuto]"),
title: "Tutoriel",
placement : "left",
content: "Vous pouvez consulter ici la charte d'utilisation du portail qui précise les conditions que vous vous engagez à respecter notamment en termes de sécurité et de protection des données"
},
{
element: "#menu-group",
title: "Vos Groupes",
placement : "left",
content: "Vous accédez ici aux groupes auxquels vous êtes inscrits"
content: "A tout moment et dans toutes les pages de Transnum, cliquez ici pour trouver une aide contextuelle !"
},
{
element: "#menu-annuaire",
title: "Annuaire",
placement : "left",
content: "Vous pouvez rechercher un utilisateur dans l'annuaire du portail"
content: "Vous pouvez rechercher un utilisateur dans l'annuaire du portail en cliquant ici."
},
{
element: "#menu-group",
title: "Vos Groupes",
placement : "left",
content: "Vous accédez ici aux groupes auxquels vous êtes inscrits"
},
{
element: "#menu-notice",
title: "Charte utilisateur",
placement : "left",
content: "Vous pouvez consulter ici la charte d'utilisation du portail qui précise les conditions que vous vous engagez à respecter notamment en termes de sécurité et de protection des données"
},
{
element: "#menu-profil",
title: "Votre Profil",
placement : "left",
content: "Vous pouvez modifier les informations vous concernant à cet emplacement. A droite du bouton 'profil', vous trouvez le bouton vous permettant de vous déconnecter du portail"
},
{
element: "#menusubmit",
title: "Créer une page",
placement : "left",
content: "Vous pouvez, en cliquant ici, créer une page personnelle, que vous pourrez partager ensuite, ou bien créer directement une page rattachée à un groupe."
},
{
element: "#appmenu",
title: "Barre de navigation rapide",
placement : "bottom",
content: "Cette barre vous permet d'accéder rapidement à la page d'accueil et à vos groupes de travail",
},
content: "Cette barre vous permet d'accéder rapidement à la page d'accueil et à vos groupes de travail. Vous pouvez maintenant passer à la 2nde partie du tutoriel, consacrée à la page d'accueil.",
onNext: function (tour) {
// On force l'affichage de la premiere frame
top.$(".navbar-left").find("a").eq(0).click();
// On lance le tour au bout de 1s le temps que l'iframe se réalise
setTimeout(function(){top.$("iframe").first().prop('contentWindow').MyTourAccueil(); }, 3000);
}
}
]
});
// Initialize the tour
tour.init();
@ -91,56 +154,163 @@ function MyTour() {
function MyTourAccueil() {
var tour = new Tour({
name: "touraccueil",
template: templatetour,
steps: [
template: templatetour2,
onEnd: function(tour) {
jQuery.ajax({
type: "GET",
url: "/ninegate/page/application",
dataType:"text",
success:function(response){
var newDoc = document.open("text/html", "replace");
newDoc.write(response);
newDoc.close();
MyTourApplication();
},
error: function(xhr, textStatus, errorThrown) {
console.log('Error! Status = ' + xhr.status);
setTimeout(MyTourApplication(), 2500);
}
});
},
steps: [
{
element: $(".widget-itemessential").find(".widgetheader"),
title: "le Bureau",
placement : "right",
content: "Dans le premier panneau d'outils ci-dessous, vous trouvez les applications qui vous sont proposées. En cliquant sur le bouton '+', vous avez accès à d'autres applications",
content: "Dans ce premier panneau d'outils, vous trouvez les applications qui vous sont proposées. Passez votre souris sur les différentes applications pour faire apparaître le 'i' et avoir une information sur chaque application. En cliquant sur le bouton '+', vous avez accès à d'autres applications.",
},
{
element: $(".widget-group").find(".widgetheader"),
title: "Mes Groupes de travail",
placement : "right",
content: "Dans le 2nd panneau d'outils ci-dessous, vous trouvez les 'groupes de travail' auxquels vous avez été invités et ceux que vous avez créés. En cliquant sur le bouton '+', vous pouvez créer un groupe de travail. ",
},
{
element: $(".widget-group").find(".widgetheader"),
title: "Mes Groupes de travail",
placement : "right",
content: "Dans le 2nd panneau d'outils ci-dessous, vous trouvez les 'groupes de travail' auxquels vous avez été invités et ceux que vous avez créés. En cliquant sur le bouton '+', vous pouvez créer un groupe de travail. ",
content: "Dans le 2nd panneau d'outils, vous trouvez les 'groupes de travail' auxquels vous avez été invités et ceux que vous avez créés. En cliquant sur le bouton '+', vous pouvez créer un groupe de travail.",
},
{
element: $(".widget-blog").find(".widgetheader"),
title: "Journaux des groupes",
placement : "right",
content: "Dans le 3ème panneau d'outils ci-dessous, vous trouvez les 'Journaux des Groupes' auxquels vous avez été invités et ceux que vous avez créés. ",
content: "Ici, vous trouvez les 'Journaux des Groupes' auxquels vous avez été invités et ceux que vous avez créés. Ils vous donnent les principales nouvelles concernant vos groupes de travail.",
},
{
element: $(".widget-alert").find(".widgetheader"),
title: "Radio Transnum",
placement : "left",
content: "Dans le premier panneau de droite ci-dessous, vous trouvez les annonces et nouvelles qui concernent tous les membres du portail. ",
content: "Dans ce panneau, vous trouvez les annonces et nouvelles d'intérêt général, qui concernent tous les membres du portail. ",
},
{
element: $(".widget-groupmessage").find(".widgetheader"),
title: "Actualités des groupes",
placement : "left",
content: "Dans le 2nd panneau de droite ci-dessous, vous trouvez les annonces et nouvelles qui vous concernent uniquement comme membre de groupes. ",
content: "Dans ce panneau, vous trouvez les évènements de la vie de vos groupes : principalement les discussions, l'arrivée de nouveaux membres, le partage de nouveaux fichiers et de nouveaux liens 'favoris'.",
},
{
element: $(".widget-calendar").find(".widgetheader"),
title: "Agenda des groupes",
placement : "left",
content: "Dans le troisième panneau de droite ci-dessous, vous trouvez les prochains évènements de vos agendas de groupes. ",
content: "Dans ce panneau, vous trouvez les prochains évènements de vos agendas de groupes. ",
},
{
element: $(".widget-appexternal").find(".widgetheader"),
placement : "left",
title: "Formulaires",
content: "Dans le dernier panneau de droite ci-dessous, vous trouvez les formulaires qui sont mis à votre disposition pour effectuer des demandes (par exemple faire un 'ticket de support'). ",
}
content: "Dans ce dernier panneau, vous trouvez les formulaires qui sont mis à votre disposition pour effectuer des demandes (par exemple pour faire un 'ticket de support'). ",
},
]
});
// Initialize the tour
tour.init();
// Start the tour
tour.goTo(0);
tour.restart();
}
function MyTourGroupe() {
var tour = new Tour({
name: "tourgroupe",
template: templatetourSolo,
steps: [
{
element: $("#group_label"),
title: "Nom du groupe",
placement : "right",
content: "Indiquez ici le nom que vous souhaitez donner à votre groupe. Le nom du groupe doit désigner en 1 à 3 mots le thème, l'objet ou l'objectif des travaux qui y sont menés.",
},
{
element: $("#group_description"),
title: "Description du groupe",
placement : "right",
content: "Vous pouvez préciser ici les objectifs de votre groupe ou tout autre élément permettant de le décrire. Ces éléments seront affichés sur la page du groupe",
},
{
element: $("#group_color"),
title: "Couleur du groupe",
placement : "right",
content: "La couleur que vous choisissez ici permet de différencier visuellement les actualités qui remontent sur votre page d'accueil (une couleur spécifique pour chaque groupe).",
},
{
element: $("#group_fgopen"),
title: "Ouvert ou fermé ?",
placement : "right",
content: "Par défaut votre groupe est fermé, ce qui signifie que seul le propriétaire du groupe ou un de ses managers peut gérer les inscriptions. Si le groupe est ouvert, tout utilisateur de Transnum pourra s'inscrire lui-même dans votre groupe.",
},
{
element: $("#group_fgcanshare"),
title: "Type de groupe",
placement : "right",
content: "Par défaut votre groupe est créé sous forme de groupe de travail.",
},
{
element: $("#group_pagetemplate"),
title: "Modèle de page pour le groupe",
placement : "right",
content: "Choisissez un modèle de page pour votre groupe.",
},
{
element: $("#diviconsel"),
title: "Icône du groupe",
placement : "right",
content: "Choisissez l'icône pour votre groupe en cliquant sur 'Sélectionner un icône'.",
},
{
element: $("#group_submit"),
title: "Validation de la création du groupe",
placement : "right",
content: "N'oubliez pas de valider la création de votre groupe !",
},
]
});
// Initialize the tour
tour.init();
// Start the tour
tour.goTo(0);
tour.restart();
}
function MyTourGroupUsers() {
var tour = new Tour({
name: "tourGroupusers",
template: templatetourSolo,
steps: [
{
element: $("[type=search]:first"),
title: "Rechercher un utilisateur",
placement : "top",
content: "Rechercher un utilisateur dans la colonne de gauche pour l'ajouter à votre groupe en cliquant sur '+'. Dans la colonne de droite s'affichent les utilisateurs déjà ajoutés, que vous pouvez retirer en cliquant sur '-'.",
},
{
element: $(".switch:first"),
title: "Ajouter comme manager",
placement : "left",
content: " Vous pouvez ajouter un utilisateur comme manager, cela lui donne des droits sur la gestion de votre groupe, notamment celui d'ajouter ou de retirer des utilisateurs ou d'organiser l'espace de travail du groupe. Comme propiétaire du groupe, vous avez des droits supplémentaires, comme celui de supprimer le groupe.",
},
{
element: $(".btn"),
title: "Fermer",
placement : "right",
content: " En fermant, vous enregistrez automatiquement vos modifications.",
},
]
});
@ -152,9 +322,246 @@ function MyTourAccueil() {
tour.restart();
}
function MyTourUser() {
var tour = new Tour({
name: "touruser",
template: templatetourSolo,
steps: [
{
element: $("#user_username"),
title: "Votre login",
placement : "right",
content: "Votre login ne peut pas être modifié car c'est sur celui-ci que vous êtes identifié dans le portail Transnum.",
},
{
element: $("#user_password_first"),
title: "Votre mot de passe",
placement : "right",
content: "Vous pouvez changer ici votre mot de passe. Vous devrez aussi le retaper dans le champ ci-dessous.",
},
{
element: $("#user_email"),
title: "Votre adresse email",
placement : "right",
content: "Vous pouvez changer votre adresse email, si vous changez par exemple de service. Pour des raisons de sécurité, il est interdit de changer une adresse professionnelle par une adresse personnelle.",
},
{
element: $("#user_visible"),
title: "Visibilité de vos informations",
placement : "right",
content: "Par défaut, les informations basiques vous concernant (Nom, Prénom, Adresse email, Service...) doivent rester visibles par les autres membres de la communauté Transnum. Les informations personnelles optionnelles ne sont pas visibles par les autres membres.",
},
{
element: $("#user_job"),
title: "Votre métier",
placement : "right",
content: "Vous pouvez préciser ici le métier que vous exercez.",
},
{
element: $("#user_position"),
title: "Votre fonction",
placement : "right",
content: "Vous pouvez préciser ici la fonction, le poste que vous occupez.",
},
{
element: $("#user_niveau01"),
title: "Votre service",
placement : "right",
content: "Merci de vérifier que votre service est toujours bien renseigné.",
},
{
element: $("#select2-user_niveau02-container"),
title: "Votre localisation",
placement : "right",
content: "Merci de vérifier que votre localisation est bien renseignée.",
},
{
element: $("#user_avatar_img"),
title: "Votre avatar",
placement : "right",
content: "Vous pouvez charger ici votre photo ou un avatar de votre choix. La communauté Transnum regroupe de nombreux services et agents. Publiez votre photo, cela aidera vos collègues à vous reconnaître plus facilement et renforcera la convivialité au sein des services. ",
},
{
element: $("#user_avatar_img"),
title: "Vos groupes",
placement : "right",
content: "Ci-dessous, vous retrouvez la liste de vos groupes. Si vous cliquez sur 'Inscription à un groupe', vous avez accès aux groupes 'ouverts' que vous pouvez rejoindre. Pour les groupes 'fermés' vous devez être invité par le propriétaire du groupe ou l'un de ses managers.",
},
{
element: $("#user_submit"),
title: "Validez vos modifications",
placement : "right",
content: "Attention, avant de fermer cette page, n'oubliez pas de valider vos modifications !",
},
]
});
// Initialize the tour
tour.init();
// Start the tour
tour.goTo(0);
tour.restart();
}
function MyTourUsers() {
var tour = new Tour({
name: "tourusers",
template: templatetourSolo,
steps: [
{
element: $("#dataTables_filter"),
title: "Rechercher",
placement : "top",
content: "Vous avez accès ici à l'ensemble des personnes inscrites sur Transnum. Lancer votre recherche par le nom, le prénom... ou bien trier la liste par ordre croissant ou décroissant. La recherche s'exécute sur tous les champs sauf le téléphone, la localisation et les groupes.",
},
]
});
// Initialize the tour
tour.init();
// Start the tour
tour.goTo(0);
tour.restart();
}
function Groups() {
var tour = new Tour({
name: "tourgroups",
template: templatetourLink,
steps: [
{
element: $("#dataTables_filter"),
title: "Liste des groupes",
placement : "top",
content: "Voici la liste de tous les groupes où vous êtes inscrits. Pour ceux que vous avez créés vous en êtes 'propriétaire'. Pour les autres groupes, soit vous en êtes 'manager', dans ce cas vous pouvez les gérer (en particulier ajouter des utilisateurs), soit vous êtes seulement 'utilisateur', dans ce cas vous avez accès aux contenus auxquels vous pouvez contribuer et avez aussi la possibilité de quitter le groupe. A gauche de ce message, vous disposez aussi d'un bouton vous permettant de créer un nouveau groupe. Maintenant continuez ce tutoriel en cliquant sur 'page groupe' ",
},
]
});
// Initialize the tour
tour.init();
// Start the tour
tour.goTo(0);
tour.restart();
}
function MyTourPage() {
var tour = new Tour({
name: "tourPage",
template: templatetourSolo,
steps: [
{
element: $("#page_submit_name"),
title: "Nom de la page",
placement : "top",
content: "Donnez un nom court mais explicite à votre page.. Si cette page est partagée au sein d'un groupe, elle s'ajoutera à la page par défaut du groupe via un sous-menu.",
},
{
element: $("#page_submit_pagecategory"),
title: "Catégorie de page URL",
placement : "top",
content: "Choisissez le type de page que vous souhaitez utiliser : si vous choisissez 'URL' vous devrez coller l'URL de destination - par exemple, l'URL d'une page 'Tableau blanc' que vous aurez pris le soin de partager avec un lien public : seuls les membres du groupe (ou ceux qui connaissent l'URL) auront accès à cette page.",
},
{
element: $("#page_submit_pagecategory"),
title: "Catégorie de page WIDGET",
placement : "top",
content: "Si vous choisissez 'Widget' vous pourrez composer votre page avec des widgets existants dans votre groupe (comme l'agenda, le chat...) : dans ce cas attention à ne pas faire double emploi avec la page principale du groupe (cela peut être intéressant pour un sous-projet par exemple)",
},
{
element: $("#page_submit_pagecategory"),
title: "Catégorie de page Editeur",
placement : "top",
content: "Enfin si vous choisissez 'Editeur' vous pourrez créer votre page avec un éditeur HTML sans avoir à rentrer de code... Cependant n'oubliez pas que vous pouvez aussi utiliser un 'journal de groupe' ou l'outil 'micro-sites' pour ce type d'usage",
},
{
element: $("#page_submit_usage"),
title: "Usage de la page",
placement : "top",
content: "Indiquez ici s'il s'agit pour l'instant d'une page personnelle (vous pourrez la partager ensuite à un ou plusieurs groupes) ou si vous souhaitez directement la lier à un ou plusieurs groupes.",
},
{
element: $("#select2-page_submit_page-container"),
title: "Modèle de page",
placement : "top",
content: "Choisissez le modèle de page que vous souhaitez. Vous partez ainsi d'un modèle mais vous pourrez ensuite modifier l'organisation de votre page si besoin.",
},{
element: $("#page_submit_roworder"),
title: "ordre",
placement : "top",
content: "Laissez 0 par défaut, un autre chiffre n'a aucun impact sur l'ordre de présentation des pages.",
},{
element: $("#page_submit_maxwidth"),
title: "Usage de la page",
placement : "top",
content: "Laissez sur 0, votre page s'adaptera à la largeur de l'affichage de l'utilisateur.",
},
]
});
// Initialize the tour
tour.init();
// Start the tour
tour.goTo(0);
tour.restart();
}
function MyTourApplication() {
var tour = new Tour({
name: "tourApplication",
template: templatetourSolo,
steps: [
{
element: $("#searchitems"),
title: "Favoris",
placement : "top",
content: "Ajouter une application existante à vos favoris en cliquant sur le bouton ' ♥ ' qui se trouve en haut à gauche du bouton de l'application que vous avez choisie d'ajouter comme favori.",
},
{
element: $("#searchitems"),
title: "Favoris",
placement : "top",
content: "Cliquez sur le bouton ' + ' pour créer un favori : vous devrez alors indiquer l'URL de la page (Application ou espace collaboratif) que vous souhaitez ouvrir avec ce favori.",
},
{
element: $("#searchitems"),
title: "Applications",
placement : "top",
content: "Cliquez sur le bouton ' i ' en haut à droite du bouton de l'application, pour savoir ce que cette application vous permet de réaliser.",
},
]
});
// Initialize the tour
tour.init();
// Start the tour
tour.goTo(0);
tour.restart();
}
// Create Button Tour
$(document).on('ready', function(){
var url = document.location.href;
if (new RegExp("ninegate/user/group/submit$").test(url)) {
$("<li><a title='Tuto' style='cursor:pointer'><i onClick='MyTourGroupe()' class='fa fa-question fa-fw'></i></a></li>").insertBefore($("#menu-annuaire"));
}
else if (new RegExp("ninegate/user/users$").test(url)) {
$("<li><a title='Tuto' style='cursor:pointer'><i onClick='MyTourUsers()' class='fa fa-question fa-fw'></i></a></li>").insertBefore($("#menu-annuaire"));
}
else if (new RegExp("ninegate/user$").test(url)) {
$("<li><a title='Tuto' style='cursor:pointer'><i onClick='MyTourUser()' class='fa fa-question fa-fw'></i></a></li>").insertBefore($("#menu-annuaire"));
}
else if (new RegExp("ninegate/user/group$").test(url)) {
$("<li><a title='Tuto' style='cursor:pointer'><i onClick='Groups()' class='fa fa-question fa-fw'></i></a></li>").insertBefore($("#menu-annuaire"));
}
else if (new RegExp(/ninegate\/user\/group\/users\/\d+$/).test(url)) {
$("<li><a title='Tuto' style='cursor:pointer'><i onClick='MyTourGroupUsers()' class='fa fa-question fa-fw'></i></a></li>").insertBefore($("#menu-annuaire"));
}
else if (new RegExp("ninegate/user/page/submit").test(url)) {
$("<li><a title='Tuto' style='cursor:pointer'><i onClick='MyTourPage()' class='fa fa-question fa-fw'></i></a></li>").insertBefore($("#menu-annuaire"));
}
// Instance the Tour
if($("#menu-annuaire".length))
else if($("#menu-annuaire".length)) {
$("<li><a title='Tuto' style='cursor:pointer'><i onClick='MyTour()' class='fa fa-question fa-fw'></i></a></li>").insertBefore($("#menu-annuaire"));
});
}
});