• date26/04/2018à 14:37

      Gestion des erreurs

      Chaque lien apportant des informations récupérés dynamiquement d'un service tiers peut renvoyer une erreur sous le format suivant :

      • en cas d'erreur de configuration
      <dynamic-information> 
        <dynamic-information id="directoryLink://5f71b39b-7ad4-4e2a-838e-4ee71ed07721" error="CONFIGURATION_EXCEPTION"> 
          <span class="link-info-error-message">Une erreur de configuration empêche de contacter le service distant.</span> 
        </dynamic-information> 
      </dynamic-information> 
      • en cas d'erreur d'authentification (mot de passe requis)
      <dynamic-information> 
        <dynamic-information id="directoryLink://5f71b39b-7ad4-4e2a-838e-4ee71ed07721" error="UNAUTHORIZED"> 
          <span class="link-info-error-message">Vous n'êtes pas autorisé à accéder à ce service. 
            <span id="dynamic-info-calendar-change-password-jgdtnw2k" class="link-change-password-link"/> 
            <script type="text/javascript">if (!window.MessagingConnector || !MessagingConnector.insertChangePasswordLink) { MessagingConnector = {SITE_URI_PREFIX: '', LANG: 'fr'} $j.getScript("/plugins/messaging-connector/resources/js/messaging-connector-password.js").done(function(){MessagingConnector.insertChangePasswordLink('dynamic-info-calendar-change-password-jgdtnw2k', updateDynamicInformation_null)}).fail(function(jqxhr, settings, exception) { console.error("An error occurred while loading js files", exception); }) } else{ MessagingConnector.insertChangePasswordLink('dynamic-info-calendar-change-password-jgdtnw2k', updateDynamicInformation_null) }</script> 
          </span> 
        </dynamic-information> 
      </dynamic-information> 

      Les erreurs survenues lors de la récupération des informations dynamiques sont affichées dans un nouvel élément HTML avec la classe CSS "link-info-error-message"

      Pour afficher ces éventuelles erreurs dans un tooltip au survol du lien, voici un exemple de règles CSS à ajouter dans votre charte :

      .linkdirectory-inputdata .link.error .link-dynamic-info:before {
       content: "!";
      }
      
      .linkdirectory-inputdata .link-dynamic-info .link-info-tooltip,  
      .linkdirectory-inputdata .link .link-info-error-message {      
          display: none !important;    
          position: absolute;    
          top: 100%;    
          top: calc(100% - 4px);    
          left: 0;    
          z-index: 100;    
          color: black;    
          width: 200px;    
          text-align: left;    
          background: white;    
          padding: 1px;    
          border: 1px solid #D5D5D5;    
          box-shadow: 5px 5px 5px #888888;    
          border-radius: 4px;    
      }    
      
      .linkdirectory-inputdata .link .link-info-error-message {    
          border-left: 4px solid #cc0000;    
          padding-left: 6px;    
      }    
      
      .linkdirectory-inputdata ul.links > li.link a:hover .link-info-tooltip,    
      .linkdirectory-inputdata ul.links > li.link a.error:hover + .link-info-error-message,    
      .linkdirectory-inputdata ul.links > li.link .link-info-error-message:hover {    
          display: block !important;    
      }    

      L'exemple ci-dessus est donné pour l'affichage des liens / applications depuis l'input data (fichier CSS linkdirectory-inputdata.css)
      Si vous utilisez le service annuaire de liens, vous pouvez appliquer les mêmes règles CSS dans le fichier CSS linkdirectory-thumbnails.css

Retour en haut