Realizzare una galleria di immagini in PHP (Parte I)

In questi articoli voglio descrivere come realizzare una fotogallery, costituita da un sistema di visualizzazione foto e dall’upload di queste, utilizzando un database MYSQL.

Oltre al linguaggio PHP e al database, ricorrerò all’uso delle librerie grafiche di PHP denominate GD2, esse servono a manipolare le immagini infatti permettono di creare e modificare file di immagine dotati delle più diffuse estensioni come GIF, JPG e PNG.

Come vedremo più avanti queste verranno utilizzate per creare una thumbnail (ossia una miniatura) che verrà salvata per essere, poi, mostrata nella serie delle miniature che compongono la galleria fotografica.
Prima di iniziare a mostrare qualche riga, è necessario aver installato nel proprio sistema le librerie GD2 che possono essere reperite all’indirizzo:http://www.boutell.com/gd/

Quello che si andrà a creare è una tabella nel database che si userà per archiviare le informazioni e dei file PHP che sono denominati: config.php, function.php, uploader.php, gallery.php, visual.php.

Procedo, ora, con l’esaminare ciascuna parte del nostro lavoro partendo dal database e dalla tabella.
Nel database che si vuole utilizzare si creerà una tabella che può essere denominata images; questa tabella è composta da un campo id (di tipo integer) della foto, dal campo titolo dell’immagine, dal nome del file e dal tipo di file (JPG, GIF, JPEG, etc); questi campi possono essere settati tutti di tipo varchar(255), per una scelta più semplice, come chiave primaria è possibile settare il campo id.

Fatta questa premessa relativa al database passo e esaminare singolarmente i file necessari per la realizzazione della gallery passando in rassegna le funzioni descritte dalle principali righe di codice che le compongono.
Come detto in altri articoli, il primo step consiste nella realizzazione di un file di configurazione che conterrà i parametri necessari alla connessione al database: un esempio di contenuto del file config.php potrebbe essere il seguente:

<?php
// Connessione al DB
$host = 'host';
$user = 'user';
$pass = 'pwd';
$data = 'database';
 
global $Link;
 
$Link=mysql_connect($host , $user, $pass) or die("connessione al DB impossibile"); 
mysql_select_db($data, $Link);
 
// Cartella fisica in cui andremo ad inserire le immagini.
// Va creata nella stessa posizione dove si trovano i file .php
$path_img = "/files";

Come al solito imposto i dati di accesso al database quali l’host, l’user, la password etc. Imposto, inoltre, la directory in cui verranno salvate le immagini; è importante che la dir in cui verranno immagazzinate le foto sia sullo stesso livello in cui si trovano i file PHP che realizzano la gallery.
Il secondo file che esamino è il primo file utile per realizzare la gallery: il file function.php. Esso contiene una function PHP, che viene richiamata dal file upload.php, per realizzare le miniature facendo uso delle librerie GD2 e delle istruzioni specifiche di queste.

Il listato della pagina function.php può essere il seguente:

< ?php
function makeThumb($dir,$pic,$n,$t){
  @list($width, $height, $type, $attr) = @getimagesize($pic);
  $max_w = 100;
  $max_h = 100;
  $ratio = @min($max_w/$width,$max_h/$height);
 
  // Verifico che l'immagine originale sia più grande delle dimensioni massime 100*100pxl
  if ($ratio < 1){
    // Individuo le nuove dimensioni da assegnare all'immagine
    $w = @floor($ratio*$width);
    $h = @floor($ratio*$height);
 
    // creo una nuova immagine con le dimensioni appena calcolate
    $thumb = @imagecreatetruecolor($w,$h);
    if ($t == 'image/jpeg'){$temp = @imagecreatefromjpeg($pic);}
    elseif ($t == 'image/gif'){$temp = @imagecreatefromgif($pic);}
    elseif ($t == 'image/png'){$temp = @imagecreatefrompng($pic);}
 
    // ridimensiono l'originale e salvo nella cartella di destinazione
    @imagecopyresized($thumb,$temp,0,0,0,0,$w,$h,$width,$height);
    if ($t == 'image/jpeg'){@imagejpeg($thumb,"$dir/tb_".$n, 75);}
    elseif ($t == 'image/gif'){@imagegif($thumb,"$dir/tb_".$n, 75);}
    elseif ($t == 'image/png'){@imagepng($thumb,"$dir/tb_".$n, 75);}
  }
}
?>

Quando la function viene richiamata, nella chiamata verranno passati i parametri che verranno poi usati nella function stessa per eseguire le varie operazioni. I parametri passati sono: la directory dove le miniature saranno salvate, il percorso completo comprendente anche il nome del file che deve essere elaborato, il nome del file compresa l’estensione e il tipo di file.

Nella terza riga, tramite l’istruzione list (la presenza della @ ha lo scopo di non mostrare eventuali messaggi di errore dovuti alla esecuzione di quella istruzione) si estraggono i parametri necessari alla elaborazione della miniatura e cioè: l’altezza, la larghezza e l’estensione. Con le variabili $max_w e $max_h si stabiliscono le dimensioni della thumb, viene calcolato, quindi, il rapporto tra la dimensione massima di altezza e larghezza e i valori analoghi della immagine processata.

Se l’immagine è più grande dei valori impostati nelle variabili $max_w e $max_h (corrispondente a un rapporto maggiore di 1) la foto viene ridimensionata. A questo punto viene creata una nuova immagine con le dimensioni dedotte dal calcolo delle due variabili $w e $h usando l’istruzione adatta della libreria GD2 in base al formato dell’immagine.

Nell’ultima parte la foto viene ridimensionata e salvata come thumb anteponendo al nome originale la dicitura tb_ che la identificherà come miniatura della immagine.

Il successivo file che prendo in esame è il file che ha il compito di eseguire l’upload delle immagini. E’ possibile usare diversi sistemi per caricare sul server remoto le immagini quali, ad esempio, avere un’unica casella di input file per selezionare il file da caricare (il che equivale alla possibilità di caricare una foto alla volta) oppure avere una serie di queste caselle per poter caricare un certo numero di foto contemporaneamente o, infine, integrare nella pagina upload.php dei componenti specifici per l’upoload dei file realizzati in altri linguaggi quali javascript piuttosto che jquery.

La situazione che prendo in esame che, a mio avviso, è la più comoda è quella che permette di avere 5 caselle per la selezione singola di 5 foto da caricare in un unico passaggio. Questo tipo di upload è semplice da gestire dal punto di vista software ed è anche usato, per esempio, da Facebook per l’upload rapido delle immagini sul profilo personale.

Conclusioni

Per ora è tutto nella prossima parte del tutorial vedremo invece come realizzare il file upload.php che ci permetterà di caricare nella nostra galleria delle immagini.

Condividi questo articolo:

• Tweet

Info sull' autore:

Laureato in matematica con la passione per internet. Ho fatto una esperienza abbastanza interessante in questo ruolo con un assegno di ricerca. Ho avuto modo di approfondire e utilizzare al meglio le potenzialità del linguaggio PHP e dei database MYSQL mirati alla gestione e pubblicazioni di dati ambientali.
Leggi gli altri articoli di PeppePegasus