Consultez la formation SEO spéciale Wordpress
par WebRankInfo / Ranking Metrics

Messages: 2192

Enregistré le: 2 Avr 2005

Message le Mer Mai 18, 2005 16:53

Comme promis dans le post http://forum.webrankinfo.com/mise-cache-des-pages-php-t28614.html j'ouvre un nouveau fil pour proposer une autre astuce! (j'ai lancé l'idée en espérant être suivi, car à raison d'une astuce par jour, je porrais pas tenir six mois! :wink: ) Alors webmasters, reveillez-vous! vous avez surement des codes à partager! et puis, si ça marche, ça pourrait faire l'objet d'un forum spécifique sur wri!

bon. on y vas...

ceux qui ont visité le site de mon profil ont du constater qu'il y avait beaucoups d'images de differentes tailles (affiches de films ou wallpapers)
avec plus de 8000 affiches et 2500 wallpapers en trois tailles différentes je m'ammuse pas à faire les recadrages à la main, c'est php qui fait ça, et il le fait une bonne fois pour toute et il fait cela lorsque j'iploade l'image sur le serveur.

Comme pour mon précédant fil, vous pouvez m'insulter si le truc est archi connu! :wink:

Comment ça marche?

Prennons l'exemple d'une affiche de film: Elle existe sous trois format (sa taille originale, une taille reduite sur la fiche du film en 260 pixels de large, 185 pixels de haut et une miniature en 85 pixels de large un peu partout ailleurs sur le site)

le principe est de lire les caracteristiques de l'image originale avec la fonction php getimagesize(), puis de creer une image à partir de son url avec imagecreatefromjpeg(), ensuite on calcule la taille des images à générer puis on les fabrique avec le couple de fonctions imagecreatetruecolor () et
imagecopyresampled (), à la fin on renvoi un header("Content-Type: image/jpeg") pour voir le resultat.

voici le code commenté:

Code: Tout sélectionner
<?php
   $url_img=$_GET["image"];
   $conn_id = ftp_connect($ftpHost);
   $login_result = ftp_login($conn_id, $ftpLogin, $ftpPwd); // on se connecte en ftp
   @ftp_mkdir ( $conn_id, "chemin vers le repertoire 1"); // si le repertoire ou stocker l'image originale n'existe pas on le crée
   @ftp_site ($conn_id, "CHMOD 777 chemin vers le repertoire 1"); // on donne les droit d'accés à ce répertoire
   @ftp_mkdir ( $conn_id, "chemin vers le repertoire 2"); // idem pour le repertoire ou on veut stocker le format 85px
   @ftp_site ($conn_id, "CHMOD 777 chemin vers le repertoire 2");
   @ftp_mkdir ( $conn_id, "chemin vers le repertoire 3");// idem pour le repertoire ou on veut stocker le format 190px par 260
   @ftp_site ($conn_id, "CHMOD 777 chemin vers le repertoire 3");
   list($imx, $imy, $type, $attr) = getimagesize($url_img); //lecture des caracteristiques de l'image à traiter
   $ims=imagecreatefromjpeg ($url_img); // création de l'image en mémoire à partir de son url
   imagejpeg($ims,"nom de l'image jpeg",80);// on stocke l'image originale avec un facteur qualité de 80%
   $ratiox=$imx/190; // on calcule le rapport de réduction en  x
   $ratioy=$imy/260;// on calcule le rapport de réduction en  y
   if($ratiox>$ratioy) { // comme on veut pas déformer l'image, on fait un test pour qu'elle s'incrive dans le rectangle 185x260
      $imd=imagecreatetruecolor (floor($imx/$ratiox),floor($imy/$ratiox));// on fabrique l'image
      imagecopyresampled ($imd,$ims,0,0,0,0, floor($imx/$ratiox),floor($imy/$ratiox),$imx,$imy);// on la stocke
   } else {
      $imd=imagecreatetruecolor (floor($imx/$ratioy),floor($imy/$ratioy));// on fabrique l'image
      imagecopyresampled ($imd,$ims,0,0,0,0, floor($imx/$ratioy),floor($imy/$ratioy),$imx,$imy);// on la stocke
   }
   // on refait la même opération pour l'mage miniature
   imagejpeg($imd,"nom de l'image jpeg",80);
   imagedestroy($imd);// on detruit la ressource image qui n'est plus utile
   $ratiox=$imx/85;
   $imd=imagecreatetruecolor (floor($imx/$ratiox),110);
   imagecopyresampled ($imd,$ims,0,0,0,0, floor($imx/$ratiox),floor($imy/$ratiox),$imx,$imy);
   imagejpeg($imd,"nom de l'image jpeg",80);
   imagedestroy($ims);// on detruit la ressource image qui n'est plus utile
   @ftp_site ($conn_id, "CHMOD 755 chemin vers le repertoire 1"); // on protege à nouveau l'accés au repertoire 1
   @ftp_site ($conn_id, "CHMOD 755 chemin vers le repertoire 2"); // on protege à nouveau l'accés au repertoire 21
   @ftp_site ($conn_id, "CHMOD 755 chemin vers le repertoire 3"); // on protege à nouveau l'accés au repertoire 3
   ftp_quit($conn_id); // on ferme la session ftp
   header("Content-Type: image/jpeg"); // on crée une entête image jpg
   imagejpeg ($imd); // on retourne l'image miniature
   imagedestroy($imd); // on detruit la ressource image qui n'est plus utile
?>


dans la page appelant le script on met:

Code: Tout sélectionner
<img src="nomduscript.php?image=url de l'image à traiter">


Attention! ce genre de script consomme pas mal de ressources mémoire (c'est pour cela que je le lance lorsque j'uploade de nouvelle images) Il peut être nécessaire selon la taille de l'image d'allouer plus de mémoire au script en ajoutant dans le .htaccess:
Code: Tout sélectionner
php_value memory_limit 64M


voilà! c'est tout.
Haut
44 Réponses
Messages: 348

Enregistré le: 23 Mar 2005

Message le Mer Mai 18, 2005 17:00

tu pourrais verifier l'existance de l'image afin de ne faire ce redimentionnement qu'une seule fois. je vais chercher le bout de script et je le mets ici
Haut
Messages: 348

Enregistré le: 23 Mar 2005

Message le Mer Mai 18, 2005 17:04

bon on va dire que tu as un repertoire taille1 taille2 taille3

en debut de fichier
<?
if (file_exists("taille1/$image")
{
header( "location: taille1/l$image");
}
else
{

ton fichier
avec à la fin

imagejpeg ($imd,"taille1/$image");
imagejpeg ($imd);
ImageDestroy ($imd);
?>
Haut
Messages: 2192

Enregistré le: 2 Avr 2005

Message le Mer Mai 18, 2005 17:24

d'accord avec toi, mais telle que je le présente ce script est à inclure dans un back office (outils de mise à jour de site) et nom pas sur le site lui même (d'ailleur sur le mien, avec la mise en cache des pages php ça marcherais pas de faire un file_exists()!) Et dans la cas d'un back office, l'image étant nouvelle, tu est sur qu'elle n'existe pas déjà, qlqsoit le format.
Haut
Messages: 416

Enregistré le: 3 Juil 2004

Message le Jeu Mai 19, 2005 0:38

le problème, c'est que si tu décides de changer la taille d'affichage sur ton site, t'as tout à refaire.

Nous, on upload l'image originale et on stocke le fichier généré au premier affichage.

C'est ce fichier qu'appelle le script directement s'il existe déjà
Haut
Messages: 871

Enregistré le: 21 Juil 2003

Message le Jeu Mai 19, 2005 14:25

fandecine je suis fan de toi :D
merci pour ce nouveau script, si tout le monde prenait le temps de partager comme toi, je t'explique pas les progressions qu'on ferait.
encore merci :wink:
carole
Haut
Messages: 15815

Enregistré le: 23 Déc 2003

Message le Jeu Mai 19, 2005 14:26

lol ca s'appelle l'open source ...
Haut
Messages: 865

Enregistré le: 5 Juil 2004

Message le Jeu Mai 19, 2005 14:47

e-kiwi a écrit:lol ca s'appelle l'open source ...


Mais les gens n'y sont pas encore sensibilisés, il faut continuer l'*Evangélisme*.

Prenons l'exemple de Linux. Bon ça va les webmasters savent ce que c'est. IBM nous fait un matraquage publicitaire depuis des années sur Linux et bien le commun des mortel dit ne jamais en avoir entendu parlé, les SSII clament haut et fort que c'est un truc pour bidouilleurs qu'il ne faut pas utiliser en production ...

Je commence à désespérer.
Haut
Messages: 2192

Enregistré le: 2 Avr 2005

Message le Jeu Mai 19, 2005 15:12

caro a écrit:fandecine je suis fan de toi


arrête carole :oops:
Haut
Messages: 2192

Enregistré le: 2 Avr 2005

Message le Jeu Mai 19, 2005 15:15

dreamclic a écrit:le problème, c'est que si tu décides de changer la taille d'affichage sur ton site, t'as tout à refaire.

Nous, on upload l'image originale et on stocke le fichier généré au premier affichage.

C'est ce fichier qu'appelle le script directement s'il existe déjà


mon problème, c'est que je met les pages en cache pour soulager le serveur. Donc si je génére l'image au premier chargement de la page, les cript sera appellé également aux chargement suivants. Donc les economies de ressources que j'obtiens avec la mise en cache sont perdues, car, question ressources, ce script en consomme pas mal (surtout de la mémoire).
Haut
Messages: 14

Enregistré le: 30 Mar 2004

Message le Lun Juin 13, 2005 11:38

Salut,

sympa de faire partager tes scripts ! Moi j'utilise le même genre de systeme pour des images et leurs vignettes par contre j'utilise netpbm pour redimensionner les images qui donne un meilleur résultat et consomme moins de ressources apache. Par contre c'est un programme externe à php donc il faut qu'il soit installé sur le serveur.

un petit comparatif gd/netpbm : http://gallery.menalto.com/modules.php? ... file=index
Haut
Messages: 249

Enregistré le: 6 Fév 2004

Message le Lun Juin 13, 2005 11:48

Den-S a écrit:un petit comparatif gd/netpbm : http://gallery.menalto.com/modules.php? ... file=index

2/5/2004 Note: This page is at least two years out of date. When it was originally written, GD2 was not available. Now that GD2 is available and offers better quality image manipulation we are working on integrating it into Gallery 2.0

:P
Haut
Messages: 2192

Enregistré le: 2 Avr 2005

Message le Lun Juin 13, 2005 11:49

Oups! pas assez rapide, mais j'allais le dire! :wink:
Haut
Messages: 449

Enregistré le: 9 Juil 2004

Message le Lun Juin 13, 2005 11:53

perso je fait tous mes resize d'images lors de l'upload avec le script qui upload l'image originale (pas besoin de FTP), comme ça le resize est fait une bonne fois pour toutes, si un jour une nouvelle taille apparait je ferait un script pour tout resizer depuis l'original qui est également sur le serveur. (pour l'anecdote je bosse aussi pour un site de cine :) (un gros))
Haut
Messages: 744

Enregistré le: 13 Oct 2004

Message le Lun Juin 13, 2005 12:08

... et moi je compresse a l'upload et resize dynamiquement en jouant sur les parametres de la balise img a la generation de la page, ainsi une seule image sert pour differentes presentations et il n'y a pas de charge serveur :)
Haut
Messages: 2192

Enregistré le: 2 Avr 2005

Message le Lun Juin 13, 2005 12:30

itsme a écrit:... et moi je compresse a l'upload et resize dynamiquement en jouant sur les parametres de la balise img a la generation de la page, ainsi une seule image sert pour differentes presentations et il n'y a pas de charge serveur :)


Mais là, c'est l'internaute qui est pénalisé car le poids de la petite image est le même que la grosse!

Personnellement, je génère toutes les images dont j'ai besoin à l'upload (parfois 4 ou 5 tailles différentes) et je la fais même sur plusieurs sites à la fois!

Un jour, peut-être, je publierais le script complet de ce back-office! :wink:
Haut
Messages: 744

Enregistré le: 13 Oct 2004

Message le Lun Juin 13, 2005 12:37

Mais là, c'est l'internaute qui est pénalisé car le poids de la petite image est le même que la grosse!


Tu as mal lu: je compresse a l'upload ;)
Haut
Messages: 449

Enregistré le: 9 Juil 2004

Message le Lun Juin 13, 2005 12:41

ouais mais du coup la grosse image est moche :)
Haut
Messages: 744

Enregistré le: 13 Oct 2004

Message le Lun Juin 13, 2005 13:24

Il est exact que je ne fait pas d'affiches de film, juste des vignettes et des images a inclure dans les descriptions :)

Mais le rendu est suffisant pour l'usage: Résumé et zoom
Modifié en dernier par itsme le Mar Nov 29, 2005 17:15, modifié 1 fois.
Haut
Messages: 14

Enregistré le: 30 Mar 2004

Message le Lun Juin 13, 2005 16:51

spijoelx a écrit:
Den-S a écrit:un petit comparatif gd/netpbm : http://gallery.menalto.com/modules.php? ... file=index

2/5/2004 Note: This page is at least two years out of date. When it was originally written, GD2 was not available. Now that GD2 is available and offers better quality image manipulation we are working on integrating it into Gallery 2.0

:P


Oui je l'ai lu aussi qu'avec GD2 la qualité est meilleure. N'empeche que je je maintiens que ça te bouffe moins de ressources sur apache qui est déjà bien assez gourmand comme ça. En plus de ça tu as des fonctions de recadrage pour les vignettes qui sont vraiment sympas. Dommage que je ne puisse pas vous montrer car ça se trouve dans mon back office mais dans la galerie photo ça donne ça :
http://www.kr1deg1.com/tee-shirt-people.php

et tout ça se fait en ligne sans un logiciel de type toshop. Enfin bref. Mais GD2 c'est bien aussi ! :D
Haut
Messages: 76

Enregistré le: 26 Juin 2004

Message le Ven Aoû 12, 2005 22:32

Petite question ici pour éviter de recréer un topic ;)

J'aimerai savoir si il y a moyen de régler le taux de compression lors de la création d'une image JPG ?

Merci ;)



Edit : c'est bon j'ai trouvé : imagejpeg($destination,'',100);
Haut
Messages: 39

Enregistré le: 26 Sep 2005

Message le Mar Sep 27, 2005 15:17

Salut à tous !

moi aussi j'utilise le redimensionnement d'images dynamiques. D'ailleur, je n'utilise que ca. Mais à la différence de vous, jai développé un module de retouche d'image, qui me permet de générer les images à la volées lors de l'affichage des pages.
voir : http://www.agencement-hotellerie.com
et : http://www.agencement-hotellerie.com/fo ... 6_480.html (pour voir les logos de tailles différentes sur la même page)
Tous les logos en page d'accueil et en colone de droite sont générées à la volées. L'originale étant la version "grande" visible sur la page du fournisseur.
L'interet de mon module est de configurer une retouche différente pour la même image via des fichiers INI. De ce fait, le jour ou j'ai besoin de changer un paramêtre de redimension, ca se fait automatiquement, sur toutes les images concernées.

Le problème en effet, c'est que c'est lourd de regénérer à chaque fois (ce qui est le cas sur le site sité plus haut).

Suite à la lecture de vos post hier, j'ai rajouter ce matin, la mise en cache automatique des images retouchée (facultatif), et cette mise en cache est paramêtrable dans le temps. De plus une modification du fichier INI pour changer la taille des images par exemple va regénérer automatiquement de nouvelles images en cache.
Donc, aucune manipulation à faire. Pour remettre à jour les images, juste a effacer en FTP le dossier cache. Elle se recrérons lors du prochain appel.

Et du coup, je peu mettre toutes mes images en FTP, sans m'inquiéter de la résolution finale.

Si vous êtes extrèmement sages, je songerai à vous filer mon code ... a savoir, qu'il est complètement paramêtrable, qu'il gère tous les formats d'images en entrée et sortie (gérés par la GD2), et qu'il permet même de dessiner directement sur l'image (genre, ajouter un contour, un texte ... )

A+
Nico
Haut
Messages: 6

Enregistré le: 3 Oct 2005

Message le Lun Oct 03, 2005 14:24

Re images

Salut tlm,

Je suis nouveau ici alors me tapez pas dessus trop fort :D

Je ne veux pas me méler de vos blemes d'images mais au lieu de vous ennuyer avec un tas de manips sur le serveur, pourquoi ne pas redimensionner vos images sur votre pc avant de les envoyer sur le serveur ?
La création dynamiques d'images n'est utile que pour des images de style graphiques de stats, etc.

Je suis développeur web je voulais juste vous conseiller. Si vous n'avez pas d'éditeur moi je peux vous fournir un logiciel (uniquement pour PC) qui permet de créer toutes vos images en un bloc dans une dimension voulu. vous n'avez ensuite qu'à les virer sur ftp. Pas de ressources bousillées et c bien plus pratique.

Un petit cadeau pour vous. C un objet this que j'ai réalisé il y a quelques années. Il permet de créer une visioneuse d'images sur vos pc. Il fonctionne sur netscape et ie. Je n'ai pas refait la mise à jour pour les nouveaux navigateurs il me sert à rien.

Code: Tout sélectionner
/*
** Viewer.js
** Copyright © Chérif Yahiaoui 2001 - 2003
** www.azwin.com Or www.gratonet.com
*/

function Viewer(){
   this.Version = "0.01 [Viewer.js; Viewer Element; 170102]";
   this.Name = "Viewer" + (Viewer.Count++);
   this.Layer = null;
   this.nie=(document.layers)? true : ((document.all)? false : null);
   this.BackColortable = "#FFFFFF";
   this.BackColorSquare = "#FF80FF";
   this.CellsSpacingtable = 5;
   this.Square = 100;
   this.Alignement = "CENTER"; // left, right ou center par défaut
   this.SmallImages = new Array();
   this.BigImages = new Array();
   this.ImagesUrl = "";
   this.Window = null;
   this.WindowLeft = 1;
   this.WindowTop = 1;
   this.WindowWidth = 500;
   this.WindowHeight = 500;
   this.WindowBackColor = "#000000";
   this.AddItem = Viewer_AddItem;
   this.ImageLoading = false;
   this.Imageobj = null;
   this.CreateViewer = Viewer_CreateViewer;
   this.ConvertCoordSmall = Viewer_ConvertCoordinatesSmall;
   this.loadimage = Viewer_loadimage;
// spécial netscape
if (this.nie){
   this.Top = 20;
   this.ImageNsp = null;
   this.SrcSource = "";
   this.IndexImage = -1;
   this.IndexCel = -1;
   this.NumberCells = 0;
   this.WidthTable = 0;
   this.CreateSourceNsp = Viewer_CreateSourceNsp;
   this.CreateNetscape = Viewer_CreateNetscape;}
   this.NsIeLoadBigImage = Viewer_NsIeLoadBigImage;
   this.Vardoc = this.Name+"Object";
   eval(this.Vardoc+"=this");

}
Viewer.Count = 0;

function Viewer_AddItem (smallimg, bigimg){
   if (this.nie == null){ return;}
   if (smallimg.length == 0 ){
   this.SmallImages[this.SmallImages.length] = bigimg;
   }else
   {this.SmallImages[this.SmallImages.length] = smallimg;}
   this.BigImages[this.BigImages.length] = bigimg;
}

function Viewer_ConvertCoordinatesSmall(Objimg, index){
if (this.nie == true || this.nie == null){ return;}
var frmx , frmy, xl , xh , m;
var ValX , ValY
   ValX = Objimg.width;
   ValY = Objimg.height;
frmx = this.Square;
frmy = this.Square;
   if (ValX > frmx){
   xl = frmx;
   m = (ValY/ValX)*100;
   xh = (xl/100)*m;
      if (xh > frmy || xl > frmx){
      xh = frmy;
      m = (ValX/ValY)*100;
      xl = (xh/100)*m; }
   }
if (ValY > frmy){
   xh = frmy;
   m = (ValX/ValY)*100;
   xl = (xh/100)*m
      if(xh > frmy || xl > frmx){
      xl = frmx;
      m = (ValY/ValX)*100;
      xh = (xl/100)*m;}
}else{
xh = Math.floor(ValY); xl = Math.floor(ValX); }
Objimg.width = xl; Objimg.height = xh;
Objimg.style.visibility = "visible";
}

function Viewer_CreateSourceNsp(){
if (this.nie == false || this.nie == null){ return;}
var frmx , frmy, xl , xh , m;
var ValX , ValY
   ValX = this.ImageNsp.width;
   ValY = this.ImageNsp.height;
frmx = this.Square;
frmy = this.Square;
   xh = null; xl = null;
   if (ValX > frmx){
   xl = frmx;
   m = (ValY/ValX)*100;
   xh = (xl/100)*m;
   if (xh > frmy || xl > frmx){
   xh = frmy;
   m = (ValX/ValY)*100;
   xl = (xh/100)*m; }}
   if (ValY > frmy && xh == null){
   xh = frmy;
   m = (ValX/ValY)*100;
   xl = (xh/100)*m;
   if(xh > frmy || xl > frmx){
   xl = frmx;
   m = (ValY/ValX)*100;
   xh = (xl/100)*m;}
   }else if (xh == null && xl==null){ xh = ValY; xl = ValX; }
xh = Math.floor(xh); xl = Math.floor(xl);
this.SrcSource += '<td align=center width=\"'+this.Square+'\" height=\"'+this.Square+'\" bgcolor=\"'+this.BackColorSquare+'\" >\n';
this.SrcSource += '<CENTER>\n';
this.SrcSource += '<A HREF=\"javascript:void('+this.Vardoc+'.loadimage('+this.IndexImage+'))\" >\n';
this.SrcSource += '<IMG NAME="vieimg'+this.IndexImage+ '" SRC=\"'+this.ImagesUrl+this.SmallImages[this.IndexImage]+'\" BORDER=\"0\" WIDTH=\"'+xl+'\" HEIGHT=\"'+xh+'\" >';
this.SrcSource += '</A>\n';
this.SrcSource += '</CENTER>\n';
this.SrcSource += '</td>\n';
this.ImageNsp = "";
this.CreateNetscape();
}

function Viewer_CreateNetscape(){
if (this.nie == false || this.nie == null){ return;}
if (this.IndexImage == -1){
   this.SrcSource = '<center>\n';
   this.SrcSource += '<table cols='+this.NumberCells+' width=\"'+this.WidthTable+'\" cellspacing='+this.CellsSpacingtable+' cellpading=0 border=0 bgcolor=\"'+this.BackColortable+'\" >\n'; }
if ((this.IndexCel == this.NumberCells-2) || (this.IndexImage == this.SmallImages.length-1)){
this.SrcSource += '</tr>\n'; this.IndexCel = -1;}
if (this.IndexCel == -1){ this.SrcSource += '<tr align=center>\n'; }
this.IndexCel ++;
this.IndexImage ++;
if (this.IndexImage < this.SmallImages.length){
this.ImageNsp = new Image();
var urlme = this.ImagesUrl+this.SmallImages[this.IndexImage];
this.ImageNsp.onload = new Function(this.Vardoc+".CreateSourceNsp(); return (false);");
this.ImageNsp.src = urlme;
}else{
this.SrcSource += '</table>\n';
this.SrcSource += '</center>\n';
this.Layer = createlayer();
this.Layer.left = Math.floor((window.innerWidth - this.WidthTable)/2);
this.Layer.top = this.Top;
this.Layer.clip.width = this.WidthTable;
this.Layer.document.open();
this.Layer.document.write(this.SrcSource);
this.Layer.document.close();
this.Layer.visibility = "show";

this.ImageNsp = null;
}
}

function Viewer_CreateViewer(){
   if (this.nie == null){ return;}
   var x = (this.nie)? window.innerWidth : document.body.clientWidth;
   var numberimagesWidth = Math.floor((x - this.CellsSpacingtable) / (this.Square + this.CellsSpacingtable));
   var tablewidth = numberimagesWidth * this.Square;
   if (this.nie){
   this.NumberCells = numberimagesWidth;
   this.WidthTable = tablewidth;
   this.CreateNetscape(); return;}
   document.body.insertAdjacentHTML("BeforeEnd",'<TABLE ID="'+ this.Name + '"></TABLE>');
   var metable =  document.all[this.Name];
   metable.setAttribute("COLS",numberimagesWidth,"true");
   metable.setAttribute("WIDTH",tablewidth,"true");
   metable.setAttribute("CELLSPACING",this.CellsSpacingtable,"true");
   metable.setAttribute("CELLPADING",0,"true");
   metable.setAttribute("BORDER",0,"true");
   metable.setAttribute("ALIGN",this.Alignement,"true");
   metable.style.backgroundColor = this.BackColortable;
   for (var i = 0; i <  this.SmallImages.length; i++){
      var merow = metable.insertRow();
      for (var j = 0; j < (numberimagesWidth); j++){
      if (i == this.SmallImages.length ){break;}
      var mecell = merow.insertCell();
      mecell.setAttribute("WIDTH",this.Square,"true");
      mecell.setAttribute("HEIGHT",this.Square,"true");
      mecell.style.backgroundColor = this.BackColorSquare;
      var Mesource = '<A HREF=\"javascript:'+this.Vardoc+'.loadimage('+i+');\" >';
      Mesource += '<CENTER><IMG NAME="vieimg'+i+ '" SRC=\"'+this.ImagesUrl+this.SmallImages[i]+'\" ';
      Mesource += 'BORDER=\"0\" onload=\"'+this.Vardoc+'.ConvertCoordSmall(this,'+i+');\" ';
      Mesource += 'STYLE=\"visibility:hidden;\"';
      Mesource += '></CENTER></A>\n';
      mecell.insertAdjacentHTML("BeforeEnd",Mesource);
      if (j< (numberimagesWidth-1)){ i++};
      }
   }
}

function Viewer_loadimage(index){
   if (this.nie == null ){ return;}
   if (this.Window == null){
        this.Window = window.open("about:blank","Vieweryc","toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,
width="+this.WindowWidth+",outerWidth="+this.WindowWidth+",height="+this.WindowHeight+",outerHeight="+this.WindowHeight+",
left="+this.WindowLeft+",screenX="+this.WindowLeft+",top="+this.WindowTop+",screenY="+this.WindowTop+'"');
   }
   if(this.Window.closed){
        this.Window = window.open("about:blank","Vieweryc","toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,
width="+this.WindowWidth+",outerWidth="+this.WindowWidth+",height="+this.WindowHeight+",outerHeight="+this.WindowHeight+",
left="+this.WindowLeft+",screenX="+this.WindowLeft+",top="+this.WindowTop+",screenY="+this.WindowTop+'"');
   }
   this.ImageNsp = new Image();
   var urlme = this.ImagesUrl+this.BigImages[index];
   if (this.nie){this.ImageNsp.onload = new Function(this.Vardoc+".NsIeLoadBigImage(); return (false);");}
   if (!this.nie){this.ImageNsp.onload = new Function(this.Vardoc+".NsIeLoadBigImage()");}
   this.ImageNsp.src = urlme;
}

function Viewer_NsIeLoadBigImage(){
if (this.nie == null){ return;}
   var frmx , frmy, xl , xh , m;
   var ValX , ValY;
   var mew = (this.nie)? this.Window.innerWidth : this.Window.document.body.offsetWidth;
   var mey = (this.nie)? this.Window.innerHeight : this.Window.document.body.offsetHeight;
   ValX = this.ImageNsp.width;
   ValY = this.ImageNsp.height;
   frmx = mew; frmy = mey;
   xh = null; xl = null;
   if (ValX > frmx){
   xl = frmx;
   m = (ValY/ValX)*100;
   xh = (xl/100)*m;
   if (xh > frmy || xl > frmx){
   xh = frmy;
   m = (ValX/ValY)*100;
   xl = (xh/100)*m; }}

   if (ValY > frmy && xh == null){
   xh = frmy;
   m = (ValX/ValY)*100;
   xl = (xh/100)*m;
   if(xh > frmy || xl > frmx){
   xl = frmx;
   m = (ValY/ValX)*100;
   xh = (xl/100)*m;}
   }else if (xh == null && xl==null){ xh = ValY; xl = ValX; }
xh = Math.floor(xh); xl = Math.floor(xl);
var left1 = Math.floor((mew - xl)/2);
var top1 =  Math.floor((mey - xh)/2);

   var mesource = '<div id="loading" style="position:absolute; left:'+left1+'px; top:'+top1+'px; width:'+xl+'px; height:'+xh+'px;">';
   mesource += '<IMG ALIGN="TOP" NAME="bigimagviewer" SRC=\"'+this.ImageNsp.src+'\" BORDER=\"0\" WIDTH=\"'+xl+'\" HEIGHT=\"'+xh+'\" >';
   mesource += '</div>';
   this.Window.document.open();
   this.Window.document.write(mesource);
   this.Window.document.close();
   this.Window.document.bgColor = this.WindowBackColor;
   this.Window.focus();
   this.ImageNsp = "";
}

function createlayer(){
var n = new Layer(1);
return n
}


A+[/code]
Haut
Messages: 17

Enregistré le: 20 Oct 2005

Message le Dim Oct 23, 2005 16:27

Salut à tous,

moi je suis obligé de passer par gd2 car c'est l'utilistaeur qui va fournir l'image, donc resize par le serveur apache. Vous dites que ca consomme beaucoup en ressource mais c'est pendant un laps de temps ca de 5 second environ. Ca ne perturbera pas vraiment le serveur non ?

Sinon dans mon cas vous me conseillerez quoi ??

Pour info j'ai crée un script du meme style que fandecine.

Merci
Haut
Messages: 2192

Enregistré le: 2 Avr 2005

Message le Mar Nov 01, 2005 14:01

Re: Re images

gratonet a écrit:Salut tlm,

Je suis nouveau ici alors me tapez pas dessus trop fort :D

Je ne veux pas me méler de vos blemes d'images mais au lieu de vous ennuyer avec un tas de manips sur le serveur, pourquoi ne pas redimensionner vos images sur votre pc avant de les envoyer sur le serveur ?
La création dynamiques d'images n'est utile que pour des images de style graphiques de stats, etc.


Ouaip! mes 110000 pages, tu me propose de les écrire en html et de les uploader aussi!

Soyons serieux! j'ai 25000 images dans des formats différents, tu crois que je vais passer mon temps à les redimensionner une a une avant de les uploader?

Et puis, PHP, c'est bien pour faire des sites dynamiques?! :wink:
Haut
Messages: 1796

Enregistré le: 8 Nov 2004

Message le Ven Nov 25, 2005 23:02

Je ne comprend pas bien le script, a quoi sert il d'ouvrir trois répertoire, et traiter les images, et de les refermer (changer les droits a nouveau) en fin de script pour ne pas enregistrer les images ainsi créer dans les répertoires ouvert?
Haut
Messages: 2192

Enregistré le: 2 Avr 2005

Message le Sam Nov 26, 2005 12:48

alors zimounet! on ne lis pas le topic en entier? :wink:

Comme je le dis dans les explication, le but de ce script est de générer automatiquement à partir d'une image jpg, 3 autres images dans des formats (dimenssions) diferrents.

Ces trois images sont stockées dans trois répertoires differents, qui sont protégés par des droits d'accés. Les oppérations se faisont en FTP, je commence par donner des droits d'accés 777 pour que le script puisse accéder à ces répertoires ( le script php n'as pas forcement les droits d'écriture dans les répertoires en question) et à la fin du traitement, je rétabli les droit d'accés initiaux des répertoires.

c'est tout! :D
Haut
Messages: 708

Enregistré le: 20 Nov 2005

Message le Mar Nov 29, 2005 15:34

Je n'est pas tester les scripts mais avez vous un script , qui permet de faire une gallerie , en uploadant des photos dans un repertoire puis en uploadant un index.php on obtient une page de miniatures qui lorsque l'on clique s'affiche a la taille de l'écran ?

Voila je pense qui un script de ce type aurait du succès !

Voila bonne journée :wink:
Haut
Messages: 2192

Enregistré le: 2 Avr 2005

Message le Mar Nov 29, 2005 15:52

c'est pas trés compliqué! :wink:

Voici le script qui génére automatiquement la galerie d'images miniatures:
Code: Tout sélectionner
<?php
     $conn_id = ftp_connect(hôteftp);
     $login_result = ftp_login($conn_id, loginftp,passwordftp);
     $Files=ftp_nlist($conn_id, "cheminftp du repertoirecontenant les images");
     ftp_quit($conn_id);
     if($Files[0]!="") {
?>
<p align="center">cliquez sur les photos pour les agrandir<br />
<?php
     for ($i=0;$i<count($Files);$i++) {
          $laGalerie[$i] = "cheminhttpdurepertoirecontenantlesimages/".substr ($Files[$i], strrpos($Files[$i],"/")+1); 
     }
     $maLargeur=0;
     for($i=0;$i<count($laGalerie);$i++){
         list($imx, $imy, $type, $attr) = getimagesize($laGalerie[$i]);
?>
<a href="javascript:zoomimg('<?php echo $laGalerie[$i];?>');">
<img src="/miniature.php?Galerie=<?php echo $laGalerie[$i];?>" border="1" vspace="5" hspace="5" >
</a>
<?php    } } ?>
</p>


un petit javascript simple pour afficher l'image pleine taille:


Code: Tout sélectionner
<script language="JavaScript" type="text/JavaScript">
<!--
function zoomimg(image) {
    newWindow=window.open(image,'Photo','toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,resizable=yes,width=640,height=480');
   newWindow.focus();
   return;
}
// -->
</script>


Pour le script de génération de miniature (miniature.php) référe toi à ce que j'ai déjà publié dans ce topic. :D
Haut
Messages: 1796

Enregistré le: 8 Nov 2004

Message le Mar Nov 29, 2005 17:10

finalement, je me suis fait ma propre fonction, je la publierai si sa interresse quelqu'un.
Haut

Formation recommandée sur ce thème :

Formation SEO spéciale Wordpress : apprenez à optimiser le référencement naturel d'un site fait avec Wordpress... Formation Ranking Metrics animée par un expert SEO / Wordpress.

Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.