ev|Apps Builder - 02.2015 - Présentation des nouveautés
Nouveautés sur l'infrastructure : Les Trusted Provider
Un Trusted Provider est un tiers de confiance chargé de gérer l'authentification des utilisateurs à la place du mécanisme d'authentification intégré aux applications.
Notes :
- Dans cette version, seuls les Trusted Provider ITsm fonctionnent.
- Les Trusted providers ne peuvent être activés pour un tenant particulier qu'au niveau du CMC EasyVista.
Lorsqu'un Trusted Provider est actif, la boîte de login n'est plus forcément celle des applications mais peut être la boîte de login du Trusted Provider (la boîte de login ITsm par exemple).
Authentification via un Trusted Provider
Lorsqu'un Trusted provider est présent, il est possible de lui déléguer la partie authentification. Dans ce cas, l'application délègue la boîte de login au Trusted Provider (qui affiche sa propre boîte de ) et reçoit en retour un jeton d'accès si l'utilisateur est correctement référencé dans la base du Trusted Provider. L'utilisateur est ensuite validé par le système des SApps via son propre mécanisme de gestion des accès.
Authentification SSO / LDAP via un Trusted Provider
Si le Trusted Provider gère l'authentification en mode SSO, ce fonctionnement est automatiquement appliqué à l'authentification décrite ci-dessus.
Synchronisation automatique des utilisateurs / groupes ITsm via un Trusted Provider ITsm
Le module de gestion des droits d'accès permet de créer des utilisateurs et des groupes (appelés Teams), ainsi que de leur donner des droits. Il est possible d'importer des fichiers CSV d'utilisateurs et de groupes afin d'initialiser ces informations. Dans ce cas, la méthode de synchronisation (et d'initialisation) dédiée aux utilisateurs ITsm qui est appliquée est la suivante :
- Une personne se connectant à APPS et possédant un compte sur SM voit son compte créé automatiquement lors de sa première connexion : aucune manipulation n'est à réaliser. Lors de la connexion, APPS détecte qu'un Trusted Provider est défini : si lors du processus, quel qu'il soit, un utilisateur ITsm est trouvé, un compte similaire est créé sur APPS (même nom, même mail, même groupes/teams) ; si des teams sont manquants, ils sont créés et affectés au nouvel utilisateur.
- Lors des connexions suivantes, une vérification est toujours effectuée permettant d'invalider le compte APPS si l'utilisateur n'est plus valide sur ITsm (date de fin / sortie de l'entreprise renseignée et dépassée). De même, l'appartenance aux différents teams est maintenue en assignant de nouveaux teams ou en désaffectant l'utilisateur de teams dont il ne fait plus partie sur ITsm.
Note : Seuls les teams initialement assignés de cette façon automatique peuvent être à leur tour enlevés automatiquement (les teams créés automatiquement sont flagués et donc reconnaissables pour être par la suite manipulés automatiquement). Les teams créés via APPS ne sont pas concernés par ces manipulations.
Nouveautés sur le studio
App Store
L'App Store fait maintenant apparaître la date de dernière modification des applications.
Les Custom widgets
De nouveaux widgets réutilisables peuvent maintenant être ajoutés sans avoir de lignes de code à écrire. Ces widgets sont appelés des Custom widgets et apparaissent dans des sections dédiées de la bibliothèque ; ils sont créés en spécialisant un widget existant, c'est -à-dire en définissant ses propriétés une fois pour toutes.
Création d'un Custom widget
Exemple : Tous les pages sites de la société se finissent par un footer. Il est donc intéressant de créer un widget réutilisable au travers de toutes les pages des applications, à partir du code HTML.
1. Création d'une nouvelle application composée d'une seule page sur laquelle est placé un layout mono colonne ainsi qu'un widget Secured HTML initialisé avec le code HTML du footer.
2. Création du Custom widget : il suffit de cliquer sur à gauche de l'icône du widget dans la barre des propriétés puis de renseigner les propriétés dans la nouvelle boîte de dialogue :
- Le nom du nouveau Custom widget doit être saisi (1). Si un Custom widget de même nom existe déjà, un message d'avertissement est affiché.
- Les Custom widgets sont privés si la case (2) est cochée. Les widgets privés ne sont accessibles qu'à leur créateur et apparaissent dans une section dédiée de la bibliothèque 'My Custom widgets'.
- Sous-catégorie du Custom widget (3).
- Icône du nouveau Custom widget : utilisez les fonctions (4), (5) et (6).
- Vous pouvez saisir l'URL d'une icône trouvée sur Internet (4). Tous les formats d'image supportés par le navigateur sont autorisés. L'icône apparait dans la fenêtre.
- Ou utilisez la bibliothèque standard fournissant plus de 400 icônes réutilisables (5).
- Si votre image est au format SVG (ce qui est le cas de toutes les icônes de la bibliothèque), vous pouvez en changer la couleur via (6).
- Vous pouvez saisir l'URL d'une icône trouvée sur Internet (4). Tous les formats d'image supportés par le navigateur sont autorisés. L'icône apparait dans la fenêtre.
- La zone (7) permet de cacher des propriétés du widget initial dans le Custom widget afin qu'elles ne soient plus modifiables. Les propriétés sont classées dans des sections et sous-sections identiques à celle du widget initial. Dans l'exemple, pour cacher la zone de saisie HTML afin que le footer ne puisse pas être édité par la suite, il suffit de cliquer sur la case à cocher 'Hidden' en regard du nom de la propriété Html Code.
3. Il ne reste plus qu'à valider les modifications. Un nouveau Custom widget figure maintenant dans la section de la bibliothèque affichée lors de l'ajout d'un widget :
4. La réutilisation de ce widget s'effectue de la même manière que pour les autres widgets, via drag & drop dans la zone de création des applications. On remarque que la section 'Content' pour la saisie du code HTML qui a été cachée n'est plus affichée.
Modification d'un Custom widget existant
Pour modifier un Custom widget existant, il faut créer une nouvelle application, le positionner dessus, le modifier puis le réenregistrer sous forme de Custom widget en gardant le même nom.
Notes :
- Si vous en changez le nom, vous allez créer un nouveau Custom widget.
- Si vous avez caché des propriétés, il n'est plus possible de les faire réapparaître pour les modifier à nouveau.
Suppression d'un Custom Widget
Pour supprimer un Custom widget, il suffit de cliquer sur en haut et à droite de chaque Custom widget. Notes :
- La suppression ne change en rien les applications ayant utilisé ce Custom widget. Il est seulement supprimé de la liste des Custom widgets disponibles.
- Les règles de suppression sont les suivantes : Un profil App Center Manager peut supprimer tous les Custom widgets non privés. Un profil App Creator ne peut supprimer que les widgets qu'il a lui-même créés.
Custom widgets et datasources
- Si le Custom widget est lié à une datasource qui n'existe pas dans l'application dans laquelle le widget est réutilisé, la datasource est automatiquement recréée : toute la connectivité est rétablie lors de la réutilisation du widget.
- Si la datasource existe déjà dans l'application cible (la comparaison s'effectuant sur le nom de la datasource) mais si sa structure est différente de celle de la datasource originale (celle qui est stockée avec le widget), le nouveau widget ne peut pas fonctionner correctement.
Note : Il est préférable d'utiliser des datasources basées sur des alias que des datasources basées sur des connecteurs. Cette notion assurant un certain niveau d'indépendance entre le widget et les données facilite la réutilisation des widgets en les rendant plus génériques.
Gestion des catégories
Lorsque le nombre de Custom widgets devient important, il est nécessaire de les classer par sous-catégories. Cela s'effectue au niveau de la boîte de dialogue de création du Custom widget.
- La combo-box permet de sélectionner les catégories existantes. Dans la bibliothèque, le widget est alors déplacé dans la catégorie sélectionnée.
- L'ajout d'une nouvelle catégorie s'effectue via le bouton '+' à droite de la combo-box.
- Il est possible de modifier les catégories des widgets via drag & drop. Par exemple, pour faire passer le widget 'New York Traffic Info' dans la catégorie Maps Widgets, il suffit de le déplacer dans cette section :
Custom widgets fournis par défaut
Une installation standard du SAppStore intègre les Custom widgets ci-dessous. Les Custom widgets bleus sont liés à ITsm. Ils nécessitent pour certains des vues particulières que le CMC peut vous fournir.
Nouveauté sur la boîte 'Au sujet de…'
La boîte 'Au sujet de…' (accessible en cliquant sur le logo en haut et à gauche du studio) a été enrichie. Elle intègre maintenant la version précise de l'API ITsm, qui correspond au fichier EZVAPI.PHP, ainsi que la version minimale requise. Lorsque la version de l'API installée est antérieure à la version minimale requise, un message d'erreur (en rouge) le signale.
Harmonisation des thèmes
Lorsque vous choisissez un thème (dans la boîte de propriétés) de l'application, celui-ci ne concerne que l'application et pas du tout le studio de création.
Nouveautés sur l'accès aux données
Les contextes d'exécution
Les contextes d'exécution ajoutent une couche d'abstraction au niveau de l'accès aux données. Ils permettent de créer une application sur une base donnée (par exemple une base de tests) puis de la déployer sur une autre base (par exemple une base d'exploitation) sans avoir à changer quoi que ce soit au niveau du paramétrage de l'application. Seul le contexte courant doit être modifié. La notion d'alias utilisée dans le système des contextes est aussi importante pour les Custom widgets.
Notion d'alias
Dans les versions précédentes, une application se connectait à une source de données via une datasource directement 'branchée' sur un connecteur. Ce mécanisme est toujours possible mais il est maintenant possible de choisir de passer par un alias. La figure suivante explicite le fonctionnement de l'alias :
Si un alias est présent, il est possible de le sélectionner dans la combo de choix du connecteur lors de la création d'une nouvelle datasource (ici ITsm).
Création et édition d'un alias
La gestion des alias s'effectue via un nouvel onglet de la fenêtre des connecteurs. Chaque alias intègre son nom, son type (easyvista ou MYSQL pour l'instant) ainsi que le connecteur correspondant.
L'utilisation de l'alias permet de faire pointer l'application vers une autre base de données SANS avoir à réécrire quoi que ce soit dans l'application (pour autant bien entendu que la nouvelle base soit structurellement compatible). Dans l'exemple ci-dessous, passer par l'alias appelé 'Easyvista ITsm' correspond à utiliser le connecteur 'Easyvista Connector'.
Note : Pour accéder aux fonctions d'édition, il faut avoir au minimum le profil App Center Manager.
- La création d'un nouvel alias s'effectue via le bouton
.
- La suppression s'effectue via
.
Les contextes d'exécution
Le système des alias est global : la modification de la source d'un alias va modifier TOUTES les applications utilisant cet alias. C'est la raison pour laquelle la notion de contexte d'exécution a été introduite :
- Un contexte d'exécution correspond à la définition d'un ou plusieurs alias avec le connecteur cible défini.
- Dans une application, il est possible de choisir le contexte d'exécution courant et par conséquent la base de travail courante de l'application.
- Le contexte d'exécution permet ainsi de créer une application sur une base de démo (ou sandbox) puis de la déployer ensuite sur une base de production SANS avoir à toucher le paramétrage de l'application.
Création d'un contexte d'exécution
La gestion des contextes d'exécution s'effectue via un nouvel onglet de la fenêtre des connecteurs. Définir un contexte d'exécution consiste à indiquer le connecteur utilisé par tous les alias courants. Cliquer sur un contexte affiche les détails.
Dans l'exemple ci-dessous, 2 alias sont définis : easyvista ITsm et mySQL db, ainsi que 2 contextes : Sandbox et Prod.
- Si une application utilise le contexte Prod, les 2 alias sont basés sur des bases de production.
- Si une application utilise le contexte Sandbox, elle fonctionne avec des bases de démo.
Choix du contexte courant pour une application
Le choix du contexte courant d'exécution s'effectue via la boîte de propriété de l'application.
Note : Cette boîte peut être vide. Si c'est le cas et si vous utilisez des alias, ce sont leurs valeurs par défaut définies sur l'onglet 'Alias' qui sont utilisées.
En résumé : Comment créer des applications en mode Sandbox puis les publier sur une base de production
1. Avoir une base Sandbox et une base de production.
2. Avoir 2 connecteurs, un sur chaque base. Note : Les connecteurs ITsm ne peuvent être créés que par le CMC EasVvista.
3. Créer un alias Easyvista.
4. Créer 2 contextes d'exécution : Sandbox et Prod, chacun positionnant correctement l'alias Easyvista.
5. Lors de la création de l'application, choisir le contexte Sandbox.
6. Lors de son déploiement, choisir le contexte Prod.
Les 5 premières opérations ne sont à effectuer qu'une seule fois.
Enregistrement courant / Synchronisation de widgets
Enregistrement courant
La notion d'enregistrement courant apparaît lorsqu'un widget est connecté à une base de données et apparaît différemment en fonction des widgets : surlignage vert pour un widget Data Viewer, infobulle pour un widget Google Maps.
Sur un widget Data Viewer, il est possible de désactiver l'affichage de l'enregistrement courant via une propriété dédiée.
Synchronisation entre widgets
L'ajout de la notion d'enregistrement courant a une conséquence importante immédiate : tous les widgets pointant vers la même source de données sont automatiquement synchronisés. Cela signifie que si l'on change l'enregistrement courant via un widget, il est également modifié sur tous les widgets utilisant la même source de données qui sont automatiquement rafraîchis.
Dans l'exemple ci-dessous, 3 widgets utilisent la même datasource : un widget Data Viewer en mode Liste (1), un widget Google Maps (2) et un widget HTML sécurisé (3) dans lequel une fiche a été construite.
Si on clique sur une ligne du Data Viewer, les 2 autres widgets sont automatiquement rafraîchis pour refléter le nouveau contenu.
De la même façon, si on clique sur une pastille sur le widget Google Maps, la zone surlignée en vert se modifie sur le Data Viewer et la fiche se modifie pour afficher les bonnes informations.
Nouveautés pour l'environnement ITsm
Gestion du drill-down ITsm
Lorsque la source de données utilisée est de type easyvista ITsm et que les données sont agrégées, il est possible d'effectuer des opérations (avec certains widgets) de drill-down afin de descendre des niveaux d'arborescence. Note : Sur les widgets Data Viewer, la fonctionnalité est disponible uniquement en mode Grid.
Application exemple
- L'application est composée de 5 widgets : un widget Breadcrumb (1), un widget Bar Chart (2), un widget Pie Chart (3), 2 widgets Data Viewer (4) et (5).
- Tous les widgets sont connectés à la même datasource ITsm présentant la liste des équipements triés par localisation, qui est identique à la vue du drill-down dans ITsm.
- Les 2 widgets Bar Chart (2) ou le widget Pie Chart (3) détectent que la datasource permet le drill-down et autorisent le clic sur les barres ou les portions du camembert : lorsqu'on clique sur l'une des localisations affichées sur l'un des 2 widgets, un drill-down est alors effectué sur la localisation 'Los Angeles'. Comme tous les widgets basés sur une même datasource sont synchronisés, les autres widgets sont réaffichés avec les valeurs associées au bon niveau de drill-down.
Widget Breadcrumb
Ce nouveau widget ((1) sur l'application exemple ci-dessus) permet de naviguer dans les niveaux de drill-down. Il est possible de cliquer sur n'importe quel niveau supérieur afin de revenir à la position correspondante.
Le widget utilise 2 paramètres :
- la datasource à utiliser : dans l'exemple, il s'agit de la même datasource que les autres widgets. Le mécanisme de synchronisation automatique se charge ensuite de gérer toutes les mises à jour ;
- le séparateur à utiliser entre les niveaux affichés lors de l'utilisation du widget.
Vue agrégée et vue Liste (flat)
Lors du drill-down sur une grille de données, ITsm propose 2 types de vues, qui sont également disponibles dans une application. Note : Il est possible de faire coexister des widgets affichant une vue agrégée et d'autres utilisant une vue Liste. Le mécanisme de synchronisation se charge de tout le travail.
- Une vue agrégée (par défaut), correspondant à au widget Data Viewer ((4) ci-dessous).
- Une vue Liste (flat) à laquelle on accède via
dans la barre d'outils de la grille. Elle affiche tous les enregistrements situés sous le niveau courant et ses sous-niveaux, et correspond correspondant au widget Data Viewer ((5) ci-dessous).
- Le choix du type de vue s'effectue via une propriété dédiée dans la section Content du widget Data Viewer : La case est cochée pour la vue en mode agrégé ((4) ci-dessous) et décochée pour la vue en mode Liste ((5) ci-dessous).
Note : Les widgets qui autorisent le choix du type de vue sont les suivants : Data Viewer, Filtre, tous les dérivés du widget HTML (HTML secured, HTML Composer, etc…).
Gestion de l'adresse pour les sources ITsm
Le widget Google Maps permet de sélectionner un champ de la source de données à utiliser comme adresse. C'est ce champ qui permet de positionner les enregistrements sur la carte :
Sous ITsm, le champ adresse des localisations est distribué entre plusieurs champs le rendant ainsi inexploitable directement via le widget Google Maps :
Un nouveau mécanisme a été rajouté afin de concaténer tous les champs adresse dans un nouveau champ (virtuel) utilisable depuis une application.
- Ce champ est rajouté dès qu'une vue mettant en œuvre un champ de la table AM_LOCATION est utilisée.
- Il y a autant de champs rajoutés que d'occurences de la table AM_LOCATION dans la requête.
- Le nom du nouveau champ virtuel se présente sous la forme “Full Address (NOM_PHYSIQUE_DE_LA_TABLE)”.
- Ce champ est automatiquement descendu par héritage pour les localisations enfant qui ne possèdent pas d'adresse renseignée exactement sous ITsm.
L'exemple ci-dessus utilise la requête ITsm Operation > Incidents > Tous les incidents et une vue Liste contenant le bénéficiaire et sa localisation. Un champ a été automatiquement ajouté pour contenir l'adresse concaténée : « Full Address (AM_RECIPIENT_LOCATION) », qu'il est maintenant possible d'utiliser sur le widget Google Maps.
Les barres d'actions
Ce mécanisme permet de mettre en œuvre toutes les actions de validation ITsm et les actions de fin sur les actions des incidents et demandes de service depuis une application.
Fonctionnement général
- Lorsqu'on accède à une fiche d'une demande de service sous ITsm via la liste 'Mes actions' et lorsqu'on clique sur le bouton 'Terminer', l'assistant de validation de l'action est ouvert, avec 3 choix possibles d'action.
- Une application affiche cette même la liste 'Mes actions' d'ITsm : les boutons d'action affichés correspondent aux actions de validation réalisables sur la fiche ITsm correspondante. Ils sont utilisables à la fois en mode Liste (via un widget Data Viewer) ce qui est impossible sous ITsm, et en mode Fiche.
- Sur les actions de validation, 3 possibilités :
- Accepter : Aucune boîte supplémentaire n'est affichée
- Refuser : Une boîte invite à saisir le commentaire de l'incident
- Demande d'information : Une boîte invite à saisir la question
- Sur les autres actions, le bouton 'Terminer' affiche un formulaire où l'utilisateur est invité à saisir la date de fin, la durée de l'action ainsi qu'un éventuel commentaire.
Mise en place
- La barre d'actions est gérée par un nouveau tag #[EZVTAG-ACTIONS]# qu'il est possible de positionner via un nouveau bouton sur la barre d'outils de l'éditeur HTML. Pour que ce tag fonctionne, il faut que la datasource utilisée sur le widget pointe vers la table action ITsm. La vue doit être 'Mes actions' ou 'Les actions de mes groupes' pour que le système fonctionne correctement.
- Lorsqu'un questionnaire est associé à l'étape de workflow, il est affiché à la suite. Exemple sur l'action 'Refuser', où le questionnaire a été rajouté après le commentaire du rejet :
Nouveautés sur les questionnaires
Le système des questionnaires ITsm a été refondu. Il est maintenant compatible avec les nouveautés des questionnaires de la version de février d'ITsm, sa charte graphique est plus proche de celle des applications et il fonctionne parfaitement sur mobiles en mode responsive design.
Les limitations du système actuel sont les suivantes :
- Pas de support des questions SQL
- L'affichage est toujours mono-colonne
![]() | ![]() |
Version Mobile du questionnaire | Version Desktop du questionnaire |
Nouveaux widgets et widgets modifiés
Nouveautés globales sur les widgets
Nouveau Color Picker
Le Color Picker (choix d'une couleur dans une palette) se présente maintenant sous la forme suivante.
Gestion de la hauteur des widgets
Cette fonction permet de s'assurer que l'éventuel ascenseur présent sur le navigateur est géré par le widget le plus haut de la page. Ce mécanisme correspond à une organisation de site assez classique, comme l'exemple ci-dessous à 3 colonnes.
Sur le widget du milieu, l'option 'Set Full Height' (dans la section 'Thème') a été cochée. Dans ce cas, la taille du widget est calée sur son contenu et la scrollbar du navigateur gère ce widget particulier.
Nouveaux tags utilisables dans du code HTML
Les widgets basés sur le Widget HTML exposent des tags utilisables à l'intérieur du code HTML. Comme le montre l'exemple suivant (basé sur Street View), vous pouvez utiliser les 2 tags #WIDTH# et #HEIGHT# qui sont dynamiquement remplacés à l'exécution par la largeur et la hauteur du widget.
<img alt="Image Street View" src="http://maps.googleapis.com/maps/api/streetview?size=#WIDTH#x#HEIGHT#&location=#[FIELD('Localisation')]#&heading=-13&fov=90&pitch=1&sensor=false" />
Widget Menu
Ce widget se trouve dans la catégorie 'Basic' de la bibliothèque. Il permet de réaliser toutes sortes de menus, horizontaux ou verticaux, utilisables en mode desktop, sur tablettes ou mobiles.
Description
Un menu se compose de plusieurs entrées caractérisées par un libellé, une icône (tous 2 optionnels) et une action à effectuer.
- La section 'Content' permet de jouer sur la présentation globale du menu et d'avoir une présentation différente pour les mêmes éléments de menu, en modifiant les couleurs des icônes, du fond des menus, de la position et la couleur du texte etc…
- La section 'Data' permet la gestion des différents éléments du menu :
- La zone (1) permet de choisir l'icône de l'élément de menu dans une bibliothèque d'images SVG (la même que celles des Custom widgets).
- La zone (2) permet de saisir le libellé de l'élément de menu.
- L'icône (4) permet de supprimer l'élément courant.
- L'icône (5) permet de réorganiser via drag & drop les éléments entre eux (un mécanisme similaire existe déjà pour de nombreux widgets).
- La zone (3) permet de sélectionner l'action qui sera effectuée lors du clic sur le menu.
- La zone (1) permet de choisir l'icône de l'élément de menu dans une bibliothèque d'images SVG (la même que celles des Custom widgets).
Les différents types d'action possibles
- Affichage d'une autre page de l'application : option 'Page Link' puis choix de la page dans la combo-box.
- Affichage d'une page WEB dans un autre onglet : option Href puis saisie de l'URL.
- Lancement d'une autre application : option 'Application Button' puis choix de l'application dans la combo-box. L'application IT Dashboard permet de créer des Apps 'launcher' servant de base au lancement des autres applications.
Note : Aucune vérification n'est effectuée sur les droits d'accès. Il faut veiller à ne pas donner l'accès à des applications que l'utilisateur ne pourra pas lancer car interdites par ses droits d'accès. Un message d'erreur apparaît dans ce cas.
- Création d'une demande de service : option 'New Request Button' puis saisie du GUID du service
Notes :- Cette option fonctionne uniquement pour ITsm. Pour qu'elle soit active, il faut d'une source de données soit indiquée sur le menu et qu'elle corresponde à une datasource pointant vers la table SD_CATALOG.
- Aucune vérification n'est effectuée sur le domaine de l'utilisateur. Il faut veiller à ne pas positionner des entrées de menu sur des créations de demandes que l'utilisateur ne pourra pas effectuer par la suite.
Widget Sliding Images
Ce nouveau widget se trouve dans la catégorie 'Basic' de la bibliothèque. Il est similaire aux widgets Sliding Pages et Sliding Panel mais il est dédié à la gestion des images.
- La zone (1) affiche l'image courante.
- Le bouton (2) permet d'uploader une nouvelle image.
- Le bouton (3) permet de supprimer l'image courante.
- L'icône (4) permet de réorganiser via drag & drop les images entre elles.
- Le bouton (5) permet d'ajouter de nouvelles images.
Widget HTML Composer
Ce nouveau widget se trouve dans la catégorie 'Basic' de la bibliothèque. Il permet la création rapide de pages via un système de snippets qu'il est possible de réutiliser et de paramétrer pour créer des mises en pages efficaces. Plus de 300 snippets réalisés par des designers professionnels sont utilisables.
L'édition du contenu s'effectue via dans la zone 'Content'.
La fenêtre d'édition
- La zone (1) est la zone principale de travail. Les snippets sont placés les uns sous les autres (3 snippets dans l'exemple ci-dessus, cernés d'un rectangle rouge).
- Les snippets (3) sont disponibles sur cette zone et ils sont catégorisés (2). L'ajout d'un nouveau snippet s'effectue via drag & drop.
- En cliquant sur une section, une barre d'outils apparaît à sa gauche.
La barre d'outils d'un snippet
- (1) : permet de repositionner le widget verticalement. Il doit être maintenu en même temps que vous effectuez le déplacement à la souris.
- (2) : affiche un éditeur de texte contenant le code HTML du snippet.
- (3) : permet de dupliquer le snippet.
- (4) : permet de supprimer le snippet.
Les éléments constitutifs d'un snippet
Chaque élément d'un snippet peut être édité séparément. En cliquant dessus, des options de paramétrage dédiées apparaissent.
- Paramétrage d'une image, via 2 icônes :
: permet de définir les éléments HTML ;
: permet de télécharger une image.
- Paramétrage d'un texte, via une barre d'édition apparaissant en haut : elle contient les habituels boutons d'édition, ainsi que 3 boutons dédiés aux applications et à ITsm.
(1) : permet de sélectionner une page à afficher à la place de la page courante.
(2) : affiche la page choisie sous forme de fenêtre popup.
(3) : permet de sélectionner un champ via le data picker.
Nouveautés sur le widget Google Maps
Modifications globales
Le niveau de zoom lors de l'affichage de cartes peut dorénavant être finement réglé via les nouvelles options de la section 'Visualisation' :
- La première option permet d'indiquer que le niveau de zoom doit être automatiquement ajusté pour que toutes les 'pastilles' tiennent à l'écran.
- La deuxième option (antinomique) permet de spécifier un niveau de zoom par défaut.
Nouveau mode de visualisation 'PinCircle'
Cette représentation est compatible avec le choix de seuils permettant de placer des pastilles de couleur sur la carte.
Gestion des moyens de transport
Une barre optionnelle est située dans la zone inférieure de la carte et permet :
- d'afficher le temps de transport entre la localisation courante de l'utilisateur connecté et le lieu sélectionné, via différents moyens de transport ;
- d'afficher ou de masquer les informations sur le trafic routier ainsi que les itinéraires de transport en commun en utilisant les cases à cocher en regard de chaque mode de transport ;
- de choisir le moyen de transport courant (métro, train, tramway etc…) via la flèche située à droite de l'icône correspondante.
Le paramétrage de ces nouvelles fonctions s'effectue via des cases à cocher dédiées dans la section 'Visualisation' :
- Les 2 premiers paramètres doivent être activés pour que la barre s'affiche.
- Le premier paramètre demande l'autorisation de la récupération courante de l'utilisateur connecté. Le navigateur est susceptible d'afficher la première fois une boîte de dialogue pour l'autoriser à récupérer la position courante : il est conseillé de l'activer tout le temps.
- La position courante est matérialisée par un marqueur particulier sur la carte :
Nouveautés sur le Data Viewer
Il est maintenant possible de définir une taille minimale pour les cellules en mode mosaïque. En mode responsive design, le système va calculer en permanence le nombre de cellules affichées sur une ligne afin que la largeur des cellules ne descende pas en deçà de cette valeur.
Nouveautés sur les composants graphes
Nouveautés globales
De nouvelles palettes de couleurs ont été ajoutées.
Widgets Bar Chart, Line Chart et Pie/Donut Chart
Il est maintenant possible de limiter le nombre de données remontées (important pour éviter des problèmes de performance sur de gros ensembles de données) et de limiter le nombre de données affichées.
Lorsque le nombre de données affichées est moins élevé que le nombre de données remontées, une zone 'Others / Autres' sommant les éléments non affichés est présente sur le graphe.
Note : Il n'est pas possible de faire du drill-down sur la valeur 'Others'.
Exemple d'un Pie Chart avec 10 valeurs affichées parmi un maximum de 20. Et le même graphe avec seulement 5 valeurs affichées :
Widgets Bar Chart et Line Chart
- Les nombres de grande taille sont affichés au format 'Big number' (avec un suffixe K, M etc… selon le cas), de la même façon que pour le widget KPI.
- Les propriétés communes au widgets Bar Chart et Line Chart ont été harmonisées.
- Possibilité d'afficher en biais les longs libellés sur l'axe des abscisses.
- Possibilité de tronquer les libellés.
- Possibilité de modifier la taille de la zone d'affichage des libellés (Bottom margin).
Compatibilité avec les versions précédentes
Widget Data Viewer
En mode cellule, les éléments étaient par défaut centrés. Ils sont maintenant correctement justifiés à gauche. Certaines applications devront donc être légèrement reprises si le contenu des Data Viewer n'est plus correctement aligné.