Project

General

Profile

Feature #5516

Images redimensionnées automatiquement

Added by Nicolas Eysseric over 5 years ago. Updated over 4 years ago.

Status:
Closed
Priority:
Normal
Category:
ViewGenerator
Start date:
04/30/2014
Due date:
% Done:

100%

Estimated time:

Description

Les utilisateurs peuvent transmettre des images à différents endroits selon leurs droits. Ces images sont stockées telles quelles. Lorsqu'elles sont affichées, leurs tailles sont contraintes. C'est alors le navigateur web qui adapte la taille de ces images.
Avec un tel mécanisme, il est très fréquent que les utilisateurs transmettent des images bien trop volumineuses pour une utilisation dans la plate-forme. Cela a pour résultat de consommer inutilement de la bande passante et potentiellement dégrader les temps d'affichage des pages de la plate-forme.

L'objectif de cette évolution est de fournir des images dont la dimension et donc le poids est adapté à leurs usages. Cela de façon totalement transparente pour l'utilisateur.
Ce mécanisme sera utilisé pour :
  • les avatars,
  • les images des formulaires (champ image),
  • les vignettes associées aux actualités.

Par défaut, les images seront toujours stockées telles quelles sont. Le redimensionnement sera réalisée "à la demande".
Un cache intelligent gérera les images déjà redimensionnées.


Related issues

Related to Petites annonces - Support #6105: Poids des imagesClosed12/08/2014

Actions
Has duplicate Silverpeas Core - Feature #6098: Retaillage automatique d'images sur le serveurRejected12/04/2014

Actions

History

#1

Updated by Nicolas Eysseric over 5 years ago

  • Status changed from New to Assigned
  • Assignee set to Miguel Moquillon
#2

Updated by Miguel Moquillon over 5 years ago

  • Status changed from Assigned to In progress...
#3

Updated by Miguel Moquillon over 5 years ago

  • Status changed from In progress... to Resolved
  • % Done changed from 0 to 100
Actuellement, le redimensionnement des images à la demande est réalisé à l'affichage :
  • des avatars des utilisateurs,
  • des images de formulaires,
  • des vignettes des publications dans une GED
Pour la réalisation du redimensionnement à chaud, deux objets ont été introduits :
  • un tag de ViewGenerator pour l'affichage d'une image ; ce dernier s'occupe de mettre à jour l'URL de l'image avec les indications de taille demandée,
  • un service d'accès au fichier de Silverpeas et au sein duquel le redimensionnement a lieu.

Le tag image

Les informations de redimensionnement sont définis par défaut dans le fichier de propriétés properties/org/silverpeas/lookAndFeel/generalLook.properties. Elles sont sous la forme de propriétés dont la clé est préfixée par le terme image.size. Exemple des avatars :

image.size.avatar = 60x
image.size.avatar.profil = x140

Les valeurs de ces propriétés sont sous la forme WIDTHxHEIGHT avec WIDTH la largeur en pixels de l'image et HEIGHT la hauteur en pixels de l'image. L'un des deux paramètres peut être omis. Seul le séparateur x est requis.
Tout ce qui suit le préfixe dans la clé définit le type de l'image et peut être passé au tag via l'attribut éponyme. Exemple :
<view:image src='/display/avatar/moi.jpg' type='avatar.profil'/>

Il est possible aussi d'indiquer explicitement la taille voulue de l'image via l'attribut size et sous le même format que les propriétés de taille (WIDTHxHEIGHT). Si les deux attributs, type et size, sont valorisés, l'attribut size prédomine sur celui type.

L'URL de l'image d'origine peut être passée comme telle au tag, ce dernier s'occupera de la formater correctement selon la taille mais aussi selon le contexte Web de l'application (il n'est pas nécessaire d'utiliser le tag <c:url .../> pour ce faire).

Le service d'accès au fichier dans Silverpeas

Des objets ont été introduits pour gérer définir un point d'accès unique au fichier dans Silverpeas pour l'IHM : SilverpeasFileProvider. C'est un singleton qui retourne un objet SilverpeasFile (une sous-classe de java.io.File) avec des informations additionnelles sur le fichier. Ce dernier est destiné avant tout pour accéder un fichier existant dans Silverpeas. Pour les activités de gestion de fichier comme la copie, la suppression, etc. il est recommandé de continuer à utiliser java.io.File. En effet, l'instance unique de SilverpeasFileProvider déroule une chaîne de pré-processeurs sur le chemin du fichier demandé et une chaîne de post-processeurs sur le fichier récupéré. Ces derniers peuvent donc altérés le chemin mais aussi le fichier retourné.

Afin de pouvoir accomplir des traitements aux fichiers demandés de manière transparente, SilvepreasFileProvider supporte un système d'attache de pré et de post traitement. Un pré-traitement travaille sur le chemin d'un fichier passé en paramètre, tandis qu'un post-traitement travaille quant à lui sur le fichier récupéré et ceci avant que ce dernier soit passé à l'appelant par la seule instance de SilverpeasFileProvider. Pour ce faire, un traitement doit être représenté par une classe qui implémente l'interface SilverpeasFileProcessor. Actuellement, deux processeurs ont été définis :
  • ImageResizingProcessor qui s'occupe de redimensionner une image à chaud, à partir des informations passés dans le chemin, si cette dernière n'existe pas dans la taille demandée,
  • FileExistenceCheckingProcessor qui s'occupe de vérifier que le fichier à retourner existe bien, sinon une instance de SilverpeasFile.NO_FILE est retournée.
#5

Updated by Nicolas Eysseric over 5 years ago

  • Category set to ViewGenerator
  • Status changed from Resolved to Closed

OK. Validé et intégré.

#6

Updated by Nicolas Eysseric about 5 years ago

  • Status changed from Closed to New
  • Assignee changed from Miguel Moquillon to Nicolas Eysseric
A certains endroits, l'image est redimensionnée dans une taille trop petite par rapport à l'affichage demandé :
  • Dans l'annuaire,
  • Dans le profil des autres utilisateurs

Cela a pour effet d'afficher une image floue (car le navigateur agrandie l'image).
Dans les cas cités ci-dessus, l'image est redimensionnée en 60px de large alors que l'image affichée a une largeur plus proche de 80px.

#7

Updated by Nicolas Eysseric about 5 years ago

  • Status changed from New to Closed
A certains endroits, l'image est redimensionnée dans une taille trop petite par rapport à l'affichage demandé :
  • Dans l'annuaire,
  • Dans le profil des autres utilisateurs

Cela a pour effet d'afficher une image floue (car le navigateur agrandie l'image).
Dans les cas cités ci-dessus, l'image est redimensionnée en 60px de large alors que l'image affichée a une largeur plus proche de 80px.

#8

Updated by Nicolas Eysseric about 5 years ago

  • Status changed from Closed to Re-opened
#9

Updated by Nicolas Eysseric about 5 years ago

  • Status changed from Re-opened to Resolved
#10

Updated by Yohann Chastagnier about 5 years ago

  • Status changed from Resolved to Closed

Validé et intégré.

#11

Updated by Nicolas Eysseric almost 5 years ago

  • Status changed from Closed to Re-opened

Les images insérées dans les contenus WYSIWYG ne sont pas redimensionnées par le serveur.
Même si la taille d'affichage est définie via l'éditeur, l'image chargée est celle d'origine.

Cette évolution permet de modifier l'URL des images au moment de la sauvegarde du contenu.
Les attributs width et style="width: " des éléments HTML <img> sont pris en compte . La valeur de ces attributs est alors utilisée pour enrichir/modifier l'URL de l'image.

cf PR :
#12

Updated by Yohann Chastagnier almost 5 years ago

  • Status changed from Re-opened to Closed

Validé et intégré.

#13

Updated by Yohann Chastagnier over 4 years ago

  • Status changed from Closed to Resolved
  • Assignee changed from Nicolas Eysseric to Yohann Chastagnier

Les images des WYSIWYG gérés par les formulaires sont maintenant pris en charge.

PR https://github.com/Silverpeas/Silverpeas-Core/pull/599

#14

Updated by Nicolas Eysseric over 4 years ago

Validé et intégré sur core-5.15.x
Yohann, je te laisse donc reporter ce commit sur la v6...

#15

Updated by Yohann Chastagnier over 4 years ago

  • Status changed from Resolved to Closed

Reporté.

Also available in: Atom PDF