Ho seguito qsto:
1. Database e file di configurazione della galleria
In questa breve serie di articoli descriveremo il processo di creazione di una galleria d'immagini con l'utilizzo combinato di PHP, le librerie grafiche GD2 e il DBMS MySQL.
Per la nostra galleria andremo a creare:
•Un database MySQL chiamato 'img_gallery' in cui verrà generata una tabella ('images'), all'interno della quale inseriremo 5 campi: 'Id', 'Titolo', 'Descrizione', 'Nome', 'Tipo'.
•Un file di configurazione ('config.php' ) con i dati di connessione al DBMS, di selezione del database e il percorso alla cartella in cui verranno inserite le immagini.
•Un file contenente una funzione ('function.php') in grado di generare e salvare miniature (thumbnails) nei tre formati grafici più diffusi ('GIF', 'JPEG', 'PNG') utilizzando le librerie GD2.
•Un file contenente il form per l'upload delle immagini ('form.php') e l'inserimento dei dati nella tabella; all'inteno di esso avverrà il controllo sul tipo di formati grafici consentiti e la chiamata alla funzione per le miniature.
•Un file per la visualizzazione della galleria ('gallery.php'); le miniature saranno incolonnate all'interno di una tabella e ogni immagine sarà anche un link destinato al collegamento con la pagina per gli ingrandimenti.
•Un file che permetterà di vedere ingrandite le immagini contenute nella galleria ('visual.php'). Sarà presente un piccolo menù di navigazione con il quale spostarsi sugli ingrandimenti delle immagini precedenti o successive.
Di seguito riportiamo l'SQL necessario alla creazione della tabella 'images':
CREATE TABLE images (
Id int(11) NOT NULL auto_increment,
Titolo varchar(255) NOT NULL default '',
Descrizione varchar(255) NOT NULL default '',
Nome varchar(255) NOT NULL default '',
Tipo varchar(255) NOT NULL default '',
PRIMARY KEY (Id)
);Ecco invece il semplice codice del file di configurazione che andremo ad includere in tutte le restanti pagine del nostro script:
<?php
// Connessione al DB
$host = 'localhost';
$user = 'user';
$pass = 'password';
$data = 'img_gallery';
$cn = @mysql_connect($host,$user,$pass) or die (mysql_error());
$sl = @mysql_select_db($data) or die (mysql_error());
// Cartella fisica in cui andremo ad inserire le immagini.
// Va creata nella stessa posizione dove si trovano i file .php
$path_img = 'files/';
?>
Nel prossimo paragrafo analizzeremo la funzione per la creazione delle miniature da immagini originali.
Poi
Di seguito presentiamo l'intero listato della funzione che chiameremo makeThumb():
<?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,$widt h,$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);}
}
}
?>
POI
Ecco il codice del nostro 'uploader'
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" enctype="multipart/form-data">
Titolo:
<input name="titolo" type="text" size="20">
Descrizione:
<textarea name="descrizione" cols="20" rows="4"></textarea>
Immagine:
<input type="file" name="imagefile">
<input type="submit" name="Submit" value="Submit">
<?php
if(isset($_POST['Submit'])){
// faccio un po' di inclusioni...
@include 'config.php';
@require 'function.php';
// Creo una array con i formati accettati
$tipi_consentiti = array("image/gif","image/jpeg","image/png");
// verifico che il formato del file sia tra quelli accettati
if (@in_array($_FILES['imagefile']['type'], $tipi_consentiti)){
// copio il file nella cartella delle immagini
@copy ($_FILES['imagefile']['tmp_name'], $path_img . $_FILES['imagefile']['name']);
// recupero i dati dal form
$titolo = @addslashes($_POST['titolo']);
$descrizione = @addslashes($_POST['descrizione']);
$nome = @addslashes($_FILES['imagefile']['name']);
$path = $path_img . stripslashes($nome);
$tipo = @addslashes($_FILES['imagefile']['type']);
// creo la miniatura
@makeThumb($path_img,$path,$nome,$tipo);
// aggiorno il database
$query = "INSERT INTO images (Titolo,Descrizione,Nome,Tipo) VALUES('$titolo','$descrizione','$nome','$tipo')";
$res = @mysql_query($query) or die (mysql_error());
@mysql_close($cn);
// Stampo a video un po' di informazioni
echo "Nome: ".$_FILES['imagefile']['name']."
";
echo "Dimensione: ".$_FILES['imagefile']['size']."
";
echo "Tipo: ".$_FILES['imagefile']['type']."
";
echo "Copia eseguita con successo.";
}else{
// stampo un messaggio di errore nel caso in cui il file sia di un formato non consentito
echo "Impossibile eseguire l'upload.";
}
}
?>
</form>
POI
Ecco il codice della nostra galleria:
<?php
@include 'config.php';
// apro la tabella che ci servirà per l'impaginazione
echo "<table>";
// recupero i dati dal DB
$query = "SELECT * FROM images ORDER By Id";
$res = mysql_query($query) or die (mysql_error());
// numero delle immagini presenti nel DB
$n_img = mysql_num_rows($res);
// verifico che il DB ospiti almeno un'immagine
if($n_img >= 1 ){
// stabilisco il numero di riche e colonne della nostra tabella per l'impagninazione
$colonne = 3;
$righe=0;
// ciclo tutti i record recuperati attraverso la nostra query
while ($f=@mysql_fetch_array($res)){
$righe++;
$id = $f['Id'];
$titolo = stripslashes($f['Titolo']);
$nome = stripslashes($f['Nome']);
$descrizione = stripslashes($f['Descrizione']);
// stampo la cella contenente l'immagine
echo "<td width=\"33%\">\n";
echo $titolo . "
";
echo "<a href=\"visual.php?id=" . $id . "\">";
echo "<img src=\"" . $path_img . "tb_" . $nome . "\" border=\"0\"></a>";
echo "
" . $descrizione;
echo "</td>\n";
// quando il numero di righe equivale al valore impostato nella variabile $righe
// procedo a chiudere la linea e ad azzerare il valore di $righe
if ($righe == $colonne){
echo "</tr><tr>\n";
$righe = 0;
}
}
}else{
// stampo un messaggio se il DB è vuoto
echo "Nessuna immagine inserita.";
}
@mysql_close($cn);
echo "</table>";
?>Il listato proposto è molto semplice: vengono prelevati i valori 'Titolo', 'descrizione' e 'Nome' del file dal database; quindi i risultati vengono incolonnati per 3 in modo che ogni immagine riporti titolo e descrizione corrispondente; ad ogni immagine è associato un link al file di visualizzazione che riconoscerà il giusto ingrandimento da visualizzare sulla base dell'Id passato per querystring.
Di seguito riportiamo il codice completo della pagina 'visual.php':
<?php
if(isset($_GET['id'])){
@include 'config.php';
// apro la tabella
echo "<table><tr><td>";
// recupero dalla querystring l'ID dell'immagine da visualizzare
$id_vis = $_GET['id'];
// verifico la presenza dell'immagine sul DB
$query = "SELECT * FROM images WHERE Id = '$id_vis'";
$res = @mysql_query($query) or die (mysql_error());
$n_img = @mysql_num_rows($res);
// se l'id specificato esiste procedo con la visualizzazione
if($n_img == 1 )
{
// recupero i dati dell'immagine selezionata
$f = @mysql_fetch_array($res) or die (mysql_error());
$titolo = stripslashes($f['Titolo']);
$nome = stripslashes($f['Nome']);
$descrizione = stripslashes($f['Descrizione']);
// stampo a video l'imagine e le relative informazioni
echo $titolo . "
";
echo "<img src=\"" . $path_img . $nome . "\" border=\"0\">";
echo "
" . $descrizione . "
";
// estraggo dal DB il primo e l'ultimo ID
$sql_count = @mysql_query("SELECT MIN(Id) AS min, MAX(Id) AS max FROM images") or die (mysql_error());
$id_max = @mysql_fetch_array($sql_count) or die (mysql_error());
$min = $id_max['min'];
$max = $id_max['max'];
// calcolo e stampo il link per l'immagine precedente
if($_GET['id'] != $min){
$query_prev = @mysql_query("SELECT Id FROM images WHERE Id < '$id_vis' ORDER BY Id DESC LIMIT 1") or die (mysql_error());
$f_prev = @mysql_fetch_array($query_prev)or die (mysql_error());
$id_prev = $f_prev['Id'];
echo "<a href=\"visual.php?id=$id_prev\"><< Precedente</a>";
}
// calcolo e stampo il link per l'immagine successiva
if($_GET['id'] < $max){
$query_next = @mysql_query("SELECT Id FROM images WHERE Id > '$id_vis' ORDER BY Id ASC LIMIT 1") or die (mysql_error());
$f_next = @mysql_fetch_array($query_next)or die (mysql_error());
$id_next = $f_next['Id'];
echo "<a href=\"visual.php?id=$id_next\">Successiva >></a>";
}
}else{
// stampo un errore se l'immagine non esiste
echo "Nessuna immagine inserita.";
}
// chiudo la tabella
echo "</td></tr></table>";
}
?>Da notare come il conteggio dei file presenti nella cartella sia effettuato tramite una query COUNT. Questo ci permette di comunicare all'applicazione il numero di slides visualizzabili anche nel caso in cui gli ID non siano sequenziali.
Rispondi quotando