Encodage d'une version - nombreuses déclinaisons

Il est parfois souhaitable de redimensionner une image dans un site, sans devoir la réuploader à cette nouvelle taille dans Nectil. Si l'on a besoin de vignettes à de nombreuses tailles différentes, un scénario de transformation d'image n'est pas envisageable, car trop contraignant (il n'est pas imaginable que l'administrateur du site encode 4/5 versions d'une même image).

Vous pourriez laisser le navigateur redimensionner l'image mais la qualité n'est souvent pas au rendez-vous.

A la volée

Une solution est d'appeler une page php qui redimensionnera/déclinera l'image pour vous. Cette page pourra être appelée depuis une animation Flash aussi bien que depuis une page HTML dans un tag <img>.

<img src="resize_image.php? path=/media/imports/cartoon1.jpg&width=150"/>
Cet exemple appelle une page php qui redimensionne une image à une largeur de 150 pixels.

Page php

Pour les transformations à la volée, tous les effets déjà disponibles dans les scénarios de transformation sont à votre disposition.

Voici un exemple de page php (la télécharger) qui va redimensionner une image à 100 pixels de large.

<?php
include_once("../Kernel/common/common_functions.inc.php");

imageTransform('<IMAGE path="'.$_GET['path'].'"><resize width="100"/></IMAGE>');
?>

La fonction imageTransform va générer la déclinaison de l'image et l'envoyer au navigateur.

A l'intérieur du noeud IMAGE se trouvent les différents effets que l'on souhaite appliquer à l'image.

Cette image est désignée par son chemin Nectil, utilisé notamment dans les DESCRIPTIONS.

C'est pourquoi nous pouvons l'utiliser très facilement depuis une feuille xsl, par exemple de cette façon :

<img src="resize_image.php? path={DESCRIPTIONS/DESCRIPTION/CUSTOM/Image}"/>

NB : On se rappellera qu'en xsl, les { } servent à intégrer du contenu dynamique dans du code html.

Si vous avez besoin de redimensionner à plusieurs tailles, au lieu de créer plusieurs pages vous pouvez changer légèrement la page php :

<?php
include_once("../Kernel/common/common_functions.inc.php");
imageTransform('<IMAGE path="'.$_GET['path'].'"><resize width="'.$_GET['width'].'"/></IMAGE>');
?>

et l'appeler dans la feuille de style xsl de cette façon :

<img src="resize_image.php?path={DESCRIPTIONS/DESCRIPTION/CUSTOM/Image }&amp;width=150"/>