Graphics migration

    • Manuel de migration technique et graphique 2.3.0 vers 2.4.0

      Error management

      Each link providing information dynamically retrieved from a third-party service may return an error in the following format:

      • in case of configuration error
      <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> 
      • in case of authentication error (password required)
      <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> 

      Errors occurring during the retrieval of dynamic information are displayed in a new element HTML with the CSS "link-info-error-message" class.

      To display these possible errors in a tooltip when hovering over the link, here is an example of rules CSS to add to your charter:

      .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;    
}    

      The example above is given for displaying links/applications from input data ( CSS linkdirectory-inputdata.css)
      If you are using the link directory service, you can apply the same rules CSS in the CSS linkdirectory-thumbnails file.css

Back to top

Link directory