Menu de l'interface dynamique

Aller à : navigation, rechercher
menu4 overview

Présentation

L'objet de cette page est de présenter l'aspect du menu de la version 4 d'OpenFlyers.

Aspect

Vue d'ensemble

OF4-menu-standard.png

Iconographie

Pictogramme principal

  • Le pictogramme principal indique le domaine de l'application.
  • Il existe en version standard et en version simplifiée.
Pictogramme standard Pictogramme simplifié Signification
Folder personal.png Action icon princ personal.png Données personnelles de l'utilisateur connecté
Folder accountancy.png Action icon princ accountancy.png Comptabilité
Folder activities.png Action icon princ activités.png Activités
Folder configuration.png Action icon princ configuration.png Configuration
Folder logs.png Action icon princ logs.png Logs
Folder maintenance.png Action icon princ maintenance.png Maintenance
Folder planning.png Action icon princ planning.png Planning de réservation
Folder prepare flight.png Action icon princ prepare flight.png Préparation des activités
Folder flight path.png Action picto princ flight path.png Préparation du trajet de l'activité
Folder online selling.png Action icon princ online selling.png E-commerce
Folder sales.png Action icon princ sales.png Ventes
Folder purchases.png Action icon princ purchases.png Achats
Folder reports.png Action icon princ reports.png Rapports
Folder ressource.png Action icon princ ressources.png Ressources
Folder plane.png Action picto princ plane.png Aviation
Folder sailing.png Action picto princ sailing.png Nautisme

Pictogramme secondaire

Le pictogramme secondaire indique un type d'action.

Pictogramme Signification
Action picto sec account credit.png Créditer un compte
Action picto sec account list.png Liste des comptes
Action picto sec account ressources.png Comptes des ressources
Action picto sec account transfer.png Transfert d'argent
Action picto sec account users.png Comptes des utilisateurs
Action picto sec actions.png Actions enregistrées sur le serveur
Action picto sec activite.png Activité
Action picto sec activity pricing.png Tarification des activités
Action picto sec add.png Ajouter
Action picto sec adresses.png Carnet d'adresses
Action picto sec application.png Application OpenFlyers
Action picto sec availability.png Disponibilités
Action picto sec budget.png Budget
Action picto sec classification.png Classification
Action picto sec custom field.png Champ personnalisé
Action picto sec flux add.png Ajouter un flux
Action picto sec flux validate.png Valider un flux
Action picto sec flux.png Flux
Action picto sec import ODT.png Document .odt
Action picto sec importer.png Importer
Action picto sec informations.png Informations
Action picto sec instructeur day.png Instructeurs : données quotidiennes
Action picto sec instructeur list.png Liste des instructeurs
Action picto sec instructeur week.png Instructeurs : données hebdomadaires
Action picto sec ip banned.png Adresses IP bannies
Action picto sec list.png Liste
Action picto sec parcours.png Parcours
Action picto sec payment types.png Types de paiements
Action picto sec planning.png Planning
Action picto sec product add.png Ajouter un produit
Action picto sec product list.png Liste de produits
Action picto sec profile.png Profils
Action picto sec ressourc day.png Ressources : données quotidiennes
Action picto sec ressource list.png Liste des ressources
Action picto sec ressource week.png Ressources : données hebdomadaires
Action picto sec stocks.png Stocks
Action picto sec structure custom field.png Champ personnalisé de la structure
Action picto sec structure.png Structure
Action picto sec types.png Types
Action picto sec user banned.png Utilisateur banni
Action picto sec user list.png Liste des utilisateurs
Action picto sec user types.png Types d'utilisateurs
Action picto sec user waiting.png Utilisateur en attente
Action picto sec user.png Utilisateur
Action picto sec vaildity types.png Types de validités
Action picto sec vaildity.png Validité
Action picto sec vars.png Variables
Action picto sec x1.png Données quotidiennes

Pictogrammes du menu

Pictogramme-action

Définition

  • Un pictogramme-action représente une action.
  • Une action correspond à un lien vers une page de l'application.

Composition

Menu4 action icon jaune.png Menu4 action icon bleu.png

  • Pictogramme principal simple de couleur blanche situé en bas à droite.
  • Pictogramme secondaire de couleur bleue foncée situé en haut à gauche.
  • Titre-utilisateur : titre personnalisable par l'utilisateur et visible dans le mode utilisation du menu.
  • Nom de l'action : c'est le nom initial de l'action, défini par OpenFlyers. L'utilisateur ne peut pas modifier ce nom.

Dossier

Menu4 folder.png

Univers

Il existe 3 menus différents – ou univers – qui correspondent à trois niveaux de droits d'accès à OpenFlyers.

Menu Utilisation

Le menu utilisation rassemble les pages normalement accessibles à l'utilisateur final de l'application comme le planning de réservation ou la saisie des activités.

Il se matérialise par un bandeau de couleur bleue.

Univers4 personal.png

Menu Gestion

Le menu Gestion rassemble les pages qui permettent de gérer la structure. Ses fonctionnalités ne sont normalement accessibles qu'à des utilisateurs disposant de droits de gestion.

Il se matérialise par un bandeau de couleur jaune orangée.

Univers4 admin.png

Lorsqu'une page de gestion dépend d'un paramétrage et que l'utilisateur connecté dispose des droits de paramétrage correspondant, un pictogramme symbolisant une roue crantée lui permet d'ouvrir un nouvel onglet dans son navigateur contenant la page de paramétrage correspondante.

Menu Paramétrage

Le menu Paramétrage rassemble les pages qui permettent de configurer la plateforme de la structure. Ses fonctionnalités ne sont normalement accessibles qu'à des utilisateurs disposant de droits de paramétrage.

Il se matérialise par un bandeau de couleur grise.

Utilisation

Présentation

  • Dans son mode utilisation, le menu d'OpenFlyers permet d'accéder aux pages de l'application.
  • Le mode configuration permet de personnaliser le menu.

Tutoriel vidéo

Ouvrir/fermer le menu

  • Par défaut, le menu s'affiche fermé. Il est matérialisé par le pictogramme menu composé de carrés en haut à droite de la page.

Menu4 1 ferme.png

  • Cliquer sur le pictogramme afin d'ouvrir le menu : l'affichage du menu se matérialise par un effet de volet s'ouvrant vers le bas. Le contenu de la page est alors poussé vers le bas.
  • Pour fermer le menu : cliquer de nouveau sur le pictogramme menu.

Pagination

  • Les pictogrammes sont répartis en pages.
  • Chaque page contient 12 pictogrammes.
  • Le nombre de pages est indiqué par des points de navigation cliquables sous les pictogrammes.
  • Pour changer de page :
    • Cliquer sur les flèches à gauche ou à droite des pictogrammes.
    • Sur écran tactile, effectuer un mouvement de balayage vers la gauche ou la droite. Ou alors, utiliser les flèches.

OF4 menu standard.png

Regroupement par dossiers

  • Les pictogrammes-actions peuvent être regroupés dans des dossiers.
  • Il n'y a qu'un seul niveau de dossiers. On peut pas imbriquer de dossier dans un dossier.
  • Pour entrer dans un dossier, cliquer sur le dossier souhaité.
  • La localisation à l'intérieur d'un dossier se matérialise par :
    • La présence d'un bouton Retour.
    • Au centre de la page : le pictogramme du dossier en miniature et le nom du dossier.
  • Pour sortir du dossier et revenir au niveau supérieur, cliquer sur le bouton Retour.

Menu4 use parent.png

Configuration

  • Le menu est personnalisable grâce à son mode configuration.

Activer / désactiver le mode configuration

  • Cliquer sur le pictogramme configuration représenté par un drapeau rouge afin d'activer le mode configuration.
  • Les pictogrammes spécifiques à la configuration apparaissent.

Menu4 3 config barre.png

  • Pour désactiver le mode configuration, cliquer de nouveau sur le pictogramme configuration.
  • Une fenêtre de confirmation apparaît si des modifications n'ont pas été enregistrées. Soit vous cliquez sur oui. Le mode configuration est désactivé mais vous avez perdu vos modification. Soit vous cliquez sur non. La fenêtre de confirmation disparait et le mode configuration reste actif. Vous pouvez enregistrer vos modifications.

Ordonnancement

  • La modification de l'ordonnancement du menu s'effectue en déplaçant les pictogrammes par glisser/déposer.
  • Des témoins montrent le pictogramme en cours de déplacement, son emplacement de destination, le dossier ou la page dans les il va être déposé.
  • Les types de déplacements sont les suivants :

Déplacement dans une page

  • Cliquer sur le pictogramme souhaité et maintenir le clic.
  • Déplacer le pictogramme dans la page du menu.
  • L'emplacement où sera déposée le pictogramme est indiqué avec un témoin de destination, matérialisé par un trait vertical blanc.

Menu4 config move.png

Changement de page

  • Cliquer sur le pictogramme souhaité et maintenir le clic.
  • Positionner le pictogramme au-dessus d'une flèche de [navigation entre les pages].
  • Un fond grisé apparaît.
  • Les icônes de la page en cours coulissent alors vers la droite ou vers la gauche, selon la flèche que l'on survole.
  • La page change.
  • Toujours en maintenant le clic, déplacer le pictogramme dans la page, jusqu'à ce que le témoin de destination apparaisse.
  • Relâcher le clic à l'emplacement souhaité pour valider le changement de page.

Menu4 config change page.png

Classement dans des dossiers

Insertion
  • Cliquer sur le pictogramme-action souhaité et maintenir le clic.
  • Positionner le pictogramme-action au-dessus d'un dossier.
  • Un fond grisé apparaît.
  • La page en cours disparaît pour être remplacée par la page du dossier.
  • Toujours en maintenant le clic, déplacer le pictogramme-action dans la page, jusqu'à ce que le témoin de destination apparaisse.
  • Relâcher le clic à l'emplacement souhaité pour valider l'insertion dans le dossier.

Menu4 config move folder.png

Retrait
  • Se placer à l'intérieur d'un dossier.
  • Cliquer sur le pictogramme-action souhaité et maintenir le clic.
  • Positionner le pictogramme-action au-dessus du bouton Retour.
  • Un fond grisé apparaît.
  • La page du dossier disparaît pour être remplacée par la page de niveau supérieur.
  • Toujours en maintenant le clic, déplacer le pictogramme-action dans la page, jusqu'à ce que le témoin de destination apparaisse.
  • Relâcher le clic à l'emplacement souhaité pour valider le retrait du dossier.

Menu4 config move parent 2.png

Configuration des pictogrammes

ATTENTION : les fonctionnalités de configuration ne sont présentes que pour certains usages d'OpenFlyers.

  • La configuration des pictogrammes se fait par l'intermédiaire de boîtes de dialogue.
  • Elle s'applique dans le cadre de l'ajout ou de l'édition d'un pictogramme.
  • L'aperçu du rendu du pictogramme s'affiche dans une zone de prévisualisation de la fenêtre.
  • Lorsque la configuration est terminée, cliquer sur le bouton OK dans la barre de titre de la fenêtre de dialogue.

Configuration des pictogrammes-actions

Action

La configuration de l'action s'effectue dans la fenêtre de la liste des actions :

  • Les actions disponibles sont celles avec un bouton + à leur droite. Cliquer sur ce bouton pour définir l'action souhaitée.
  • Lors de l'ajout d'une action, la définition d'une action entraîne l'affichage de la fenêtre de configuration de l'apparence.
  • Lors de l'édition d'une action, le nom de l'action en cours apparaît dans un lien de la barre de titre de la fenêtre de dialogue. Cliquer sur ce lien permet de basculer à la fenêtre de configuration de l'apparence.

Menu4 config picto icon 2.png

Apparence

L'apparence est également modifiable dans une fenêtre de dialogue. Celle-ci permet de définir :

  • Le titre-utilisateur.
  • Le pictogramme principal :
    • Cliquer sur le pictogramme souhaité pour l'ajouter.
    • Le pictogramme sélectionné s'affiche avec un fond grisé.
    • Cliquer de nouveau sur le pictogramme sélectionné pour le supprimer.
  • Le pictogramme secondaire : pour configurer le pictogramme secondaire, procéder de la même manière que pour le pictogramme principal.
  • Il est possible de revenir à la fenêtre de définition de l'action en cliquant sur le lien portant le nom de l'action, à côté du titre-utilisateur.
  • Noter que la couleur de fond n'est pas modifiable. Elle dépend de l'action.

Menu4 config picto icon 1.png

Configuration des dossiers

L'apparence des dossiers est modifiable dans une fenêtre de dialogue :

  • Titre
  • Le pictogramme principal :
    • Cliquer sur le pictogramme souhaité pour l'ajouter.
    • Le pictogramme sélectionné s'affiche avec un fond grisé.
    • Cliquer de nouveau sur le pictogramme sélectionné pour le supprimer.

Menu4 config folder.png

Ajout d'un pictogramme

Ajouter un pictogramme-action

Ajouter un dossier

Édition d'un pictogramme

  • Cliquer sur le pictogramme roue crantée à droite de chaque pictogramme.
  • L'édition d'un pictogramme-action débute par la fenêtre de configuration de l'apparence.
  • L'édition d'un dossier ouvre la fenêtre de configuration des dossiers.

Suppression de pictogrammes

  • Cliquer sur le pictogramme delete dans les boutons de configuration du menu : Menu4 config picto delete.png.
  • Le menu passe en mode suppression :
    • Le pictogramme delete prend un aspect enfoncé : Menu4 config picto delete active.png.
    • Le pictogramme roue crantée à droite de chaque pictogramme-action ou dossier disparaît. À la place, un pictogramme delete rouge apparaît.
  • Cliquer sur les pictogrammes delete rouges pour supprimer les pictogrammes-actions ou dossier souhaités.
  • Pour sortir du mode suppression, cliquer sur le pictogramme delete des boutons de configuration du menu.

Enregistrement des modifications

  • Pour être activées, les modifications doivent être enregistrées. Si le menu est fermé sans que l'enregistrement n'ait été effectué, les modifications ne seront pas prises en compte.
  • Lorsque le menu comporte des modifications non enregistrées, un pictogramme représentant une base de données + disquette s'affiche en haut à gauche du menu : Menu4 config not saved.png.
  • Cliquer sur le pictogramme base de données + disquette pour enregistrer.
  • Le pictogramme se transforme alors en base de données + check : Menu4 config saved.png.
  • Tout nouvelle modification devra de nouveau être enregistrée.