Watermark e descrizione di un’immagine, con PHP!

Sabato 7 Giugno 2008 at 7:46 pm (Guide, PHP, Programmazione, Tutti i posts) (, , , , , )

Ho realizzato questo script veramente facile da utilizzare e configurare (sotto una vista del codice di configurazione), con questo script potrete disegnare un box trasparente sulla vostra immagine ed inserirci del testo, ed aggiungere l’”effetto watermark”, ovvero una di quelle immagini sfumate con il copyright (usate da praticamente tutti i fotografi e photostock per evitare la copiatura selvaggia delle immagini destinate alla vendita). Che dire, se vi piace usatelo! =)

La trasparenza dell’immagine watermark è da impostare quando la si crea (in formato PNG)!

Archivio ZIP: quì
Demo funzionante: quì

Ecco l’anteprima di un’immagine e del codice:

Permalink 2 Commenti

Una classe per gestire l’upload di un file in PHP

Mercoledì 4 Giugno 2008 at 11:30 pm (Guide, PHP, Programmazione, Tutti i posts) (, , , , )

Oggi ho creato una classe che ritengo utile e che mi fa piacere condividere con voi, ecco come si usa:
La classe è reperibile quì

Prima pagina: un form di invio dati

Copiare quanto segue in una pagina ed omettere i cancelletti all’inizio delle righe

<form action=”seconda_pagina.php” method=”post” enctype=”multipart/form-data” name=”form1″>
<input type=”file” name=”to_upload”>
<input type=”submit” name=”Submit” value=”Submit”>
</form>

Seconda pagina (seconda_pagina.php)

Apriamo i tags php:
<?

Ed ora cominciamo ad usare la classe:
$upload=new fileUpload;

Configuriamo l’opzione safe_mode (default: 1)
0: Niente safe_mode
1: Non permette allo script di gestire le cartella madri, ovvero permette solo di usare la directory corrente e tutte le sue subdirectories
$upload->safe_mode=1;

Configuriamo l’opzione allow_overwrite:
0: Non permette agli utenti di sovrascrivere files
1: Permette agli utenti di sovrascrivere files
$upload->allow_overwrite=1;

Lista delle estensioni consentite (indicare senza il “.”, es. array(“png”, “gif”))
$upload->allowed_extensions=array(“jpg”,”jpeg”,”bmp”,”gif”,”png”,”tif”, “wav”);

Dimensione massima del file in byte
$upload->max_size=”3145728″;

La cartella nella quale salvare i files
$upload->setTargetDir(“mydir”);

File da uploadare (dove “to_upload” indica il nome del campo file del modulo)
$upload->setTargetFilename($_FILES['to_upload']['name']);

Nome temporaneo del file (non cambiare se non sai cosa tocchi :P )
if($upload->saveFile($_FILES['to_upload']))
{

Azioni da intraprendere qualora il trasferimento fosse andato a buon fine
print “Tutto ok!”;
}

Se vogliamo informare l’utente del massimo numero di bytes inviabile possiamo scrivere quanto segue
print “<strong>Dimensione massima file</strong>: “.$upload->getMaxSize().” bytes<br>\n”;

Configuriamo la modalità debug (questo parametro va inserito sempre in fondo)
0: Modalita’ debug disattivata
1: Modalita’ debug attivata: dei messaggi ti aiuteranno a capire dove si nascondono i problemi
$upload->debug(0);


Chiudiamo ora i tags
?>

Diamo ora uno sguardo al codice completo:

<?
$upload=new fileUpload;
$upload->safe_mode=1;
$upload->allow_overwrite=1;
$upload->allowed_extensions=array(“jpg”,”jpeg”,”bmp”,”gif”,”png”,”tif”, “wav”);
$upload->max_size=3145728;
$upload->setTargetDir(“mydir”);
$upload->setTargetFilename($_FILES['to_upload']['name']);
if($upload->saveFile($_FILES['to_upload']))
{
print “Tutto ok!”;
}
print “<strong>Dimensione massima file</strong>: “.$upload->getMaxSize().” bytes<br>\n”;
$upload->debug(0);
?>

Permalink Lascia un Commento

Menu orizzontale “rotondeggiante” con css

Lunedì 2 Giugno 2008 at 7:20 pm (Guide, Programmazione, Tutti i posts) (, , , , )

Anteprima

Oggi pacioccavo con il CSS, e ne è venuto fuori qualcosa che ho ritenuto carino, ho deciso di condividerlo.

Ecco cosa ci serve:
Immagine sinistra (sfondo_sx.gif):

Immagine destra (sfondo_dx.gif):  

Logo (logo_30x30.gif):

CSS:

#main_menu {
padding: 9px;
background-color:#003300;
overflow:auto;
padding-bottom: 5px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#main_menu ul, #main_menu ul li {
display: inline;
}
#main_menu a, #main_menu .logo {
float:left;
}
#main_menu a {
cursor: pointer;
color: #FFFFFF;
text-decoration:none;
margin:0 10px;
line-height:27px;
background:url(sfondo_dx.gif) right top no-repeat;
font-size: 12px;
padding-right:9px;
background-color: #006600;
}
#main_menu span {
background:url(sfondo_sx.gif) left top no-repeat;
display:block;
padding-left:9px;
}
#main_menu a:hover {
background-color:#007700;
}

Codice HTML:

<div id="main_menu">
<ul>
<li class="logo"><img src="logo_30x30.gif" width="30" height="30" border="0"></li>
<li><a href="#"><span>Home</span></a></li>
<li><a href="#"><span>Catalogo</span></a></li>
<li><a href="#"><span>Marchi</span></a></li>
</ul>
</div>

Permalink Lascia un Commento

Un modulo protetto da un’immagine captcha! (PHP + GD)

Mercoledì 28 Maggio 2008 at 7:52 pm (Guide, Programmazione, Tutti i posts) (, , , , , , , , )

Mi è capitato oggi di ricevere la richiesta di aiuto da parte di un amico che desiderava un modulo per l’invio di emails protetto da un codice captcha, in un primo momento non sapevo cosa fosse, ma dopo una googleata ho capito che per immagine captcha si intendono quelle immagini composte da alcuni caratteri non allineati ed uno sfondo che ne disturba il riconoscimento di modo da rendere difficile la vita ai BOT che incessantemente cercano il modo per rendere aumatico l’invio. I codici captcha infatti, se ben strutturati, sono riconoscibili solamente dall’occhio umano, estendendo questo attributo all’intero script.
Ma vediamo come possiamo realizzare una simile struttura, creeremo 2 diversi files, il primo conterrà il generatore dell’immagine, il secondo il codice di verifica e il form di invio:

Primo file: il generatore dell’immagine

Questo file creerà un dato di sessione, che ho chiamato “captcha_text”, che corrisponderà alla successione dei caratteri visualizzati nell’immagine.

<?php
#Comunichiamo al browser che o' che visualizzera' questo file sara' un'immagine, è necessario che il file non dia altro output oltre al contenuto dell'immagine, quindi facciamo molta attenzione ad eventuali spazi prima e dopo i tags php!
header("Content-type: image/png");
#Creiamo un'immagine alta larga 100px ed alta 50px
$im = imagecreate(100, 50);
#Impostiamo il colore di sfondo a nero (#000000), per convenzione il primo colore dichiarato e' quello dello sfondo
$background_color = imagecolorallocate($im, 0, 0, 0);
#Impostiamo anche un colore che sara' quello del testo
$text_color = imagecolorallocate($im, 233, 14, 91);
#Diamo inizio ad un ciclo "for", che generera' una successione di 30 numeri, la dichiarazione .= significa che cio' che segue andra' a finire dopo l'attuale contenuto della variabile "$randstr"
for($i=0;$i<30;$i++)
$randstr.=rand(0,9);
#Generiamo l'hash della stringa ottenuta con il ciclo precedente
$randstr=md5($randstr);
#Diminuiamo la lunghezza della stringa (attualmente lunga 30 caratteri), ora la stringa sara' lunga 5 caratteri a partire dal primo
$randstr=substr($randstr, 0, 5);
#Trasformiamo i caratteri minuscoli in caratteri maiuscoli, per rendere piu' comprensibile l'immagine
$randstr=strtoupper($randstr);
#Ora "sminuzziamo" la stringa, in modo da ottenere un array composto da 5 elementi: i 5 caratteri della stringa
$chars=str_split($randstr);
#Tramite 5 cicli i caratteri saranno posizionati in giro per l'immagine, con un offset di +/-2 pixel, sia in X che in Y, ogni carattere distera' da quello successivo di circa 15 pixel
for($i=0;$i<5;$i++)
imagechar($im, 5, 10+15*$i+rand(-2, +2), 15+rand(-2, +2), $chars[$i], $text_color);
#Con altri 5 cicli disturberemo lo sfondo, con altrettante rette che attraverseranno l'immagine partendo da due cordinate casuali ed arrivando ad altre due cordinate casuali
for($i=0;$i<5; $i++)
imageline($im, rand(0,100), rand(0,50), rand(0,100), rand(0,50), $text_color);
Diamo in output la nostra creazione
imagepng($im);
##Eliminiamo i dati temporanei relativi all'immagine dopo averla visualizzata
imagedestroy($im);
#Richiamiamo la sessione (un passaggio obbligatorio se vogliamo dichiarare delle variabili di sessione)
session_start();
#Attribuiamo alla variabile di sessione "captcha_text" il valore $randstr, ovvero la stringa composta da 5 caratteri generata qualche linea piu' su
$_SESSION['captcha_text']=$randstr;
#Chiudiamo i tags del php
?>


Secondo file: un form dove inserire il codice captcha (captcha.php)

Questo file conterrà i dati che si vogliono inviare e la conferma del nostro codice captcha, sarà quindi necessario richiamare l’immagine del codice, ecco come si presenterà il nostro file:

<?
#Controlliamo che esista il dato "submitted_code", che sarà impostato solamente se è già stato digitato il codice captcha e controlliamo
if((isset($_POST['submitted_code']))&&($_POST['submitted_code']==$_SESSION['captcha_text']))
{

#Facciamo partire la sessione, questo passaggio è obbligatorio per leggerne i dati e le veriabili
session_start();
#Output ed operazioni legate alla corretta digitazione del codice (es. mandare un'email, eseguire un'operazione sul database...)
echo "Messaggio di OK";
}

#Altrimenti riproponiamo l'inserimento del codice
else
{

?>
<form name="form1" method="post" action="#">
<p>
<input type="text" name="campoacaso">Un campo a caso<br>
</p>
<p>
<input name="verify_code" type="text" id="vcode">Copia il codice sottostante nel box<br>
<img src="
captcha.php" width="100" height="50"><br>
<input type="submit" name="Submit" value="Invia">
</p>
</form>

<? }
?>

Permalink 3 Commenti

Guida all’uso delle le librerie grafiche GD con PHP!

Martedì 10 Luglio 2007 at 9:04 pm (Guide, Programmazione, Tutti i posts) (, , , , , , , , , , , )

pizza

In questo breve articolo proverò a spiegarvi come sovrapporre ad un’immagine (in questo caso una pizza) altre immagini (gli ingredienti) creando un’unica immagine.

Ricordo che per utilizzare le librerie grafiche è necessario abilitarle nel file php.ini, come descritto quì.
Le immagini che ho usato nel tutorial sono reperibili quì.

Anteprima funzionante quì.

Il codice “cucina” la pizza basandosi sulle variabili contenute nell’url ($_GET['variabile']).
Per far funzionare il codice, bisogna quindi creare un’url simile ad http://localhost/pizza.php?pomodoro=si&mozzarella=si&basilico=si

Per prima cosa, apriamo i tags php, che ci permettono di inserire codice php all’interno della pagina.

<?

Carichiamo un’immagine di sfondo (la pasta per la pizza) [sfondo.png]
$immagine=imagecreatefrompng('sfondo.png');
Come si usa? imagecreatefrompng (‘immagine’)
Carichiamo tutte le immagini da sovrapporre (ingredienti) usando lo stesso comando di prima ( imagecreatefrompng() )
$pomodori=imagecreatefrompng('pomodori.png');
$carciofini=imagecreatefrompng('carciofini.png');
$pcrudo=imagecreatefrompng('pcrudo.png');
$pomodoro=imagecreatefrompng('pomodoro.png');
$mozzarella=imagecreatefrompng('mozzarella.png');
$basilico=imagecreatefrompng('basilico.png');

Ora cominciamo a creare una raccolta di colori
Ricordo che il primo colore definito sarà quello di sfondo dell’immagine.
$bianco = imagecolorallocate($immagine, 255, 255, 255);
Come si usa? imagecolorallocate ( variabile_immagine, rosso, verde, blu )
$verde = imagecolorallocate($immagine, 0, 255, 0);
$nero = imagecolorallocate($immagine, 0, 0, 0);
$blu = imagecolorallocate($immagine, 0, 0, 255);

Questo è un comando utile per scrivere qualcosa sopra all’immagine
imagestring($immagine,5,3,3,"Viva la pizza!", $blu);
Come si usa? imagestring ( variabile_immagine, dimensione_testo, larghezza, altezza,testo,colore )
Bisogna far capire al browser che l’output sarà un’immagine e non una pagina web, per fare questo usiamo il comando:
header("Content-type: image/png");
Con questo comando disegnamo l’immagine
imagepng($immagine);
Con questo comando liberiamo la cache
imagedestroy($immagine);
Non ci resta che chiudere i tags, e giocare a fare i pizzaioli.
?>

Cosa può andarvi storto?

Warning: Cannot modify header information – headers already sent by (output started at C:\AppServ\www\pizza\immagine.php:2) in C:\AppServ\www\pizza\immagine.php on line 33
L’errore è generato da una specie di conflitto fra testo ed immagine, ovvero, come output è stato generato un “mix” di immagini e stringhe, l’errore può essere causato anche da uno spazio fuori dai tags php.
Parse error: parse error, unexpected T_VARIABLE in C:\AppServ\www\pizza\immagine.php on line 21
Avete dimenticato di comunicare la fine di un’istruzione con un “;”
Parse error: parse error, unexpected ‘}’ in C:\AppServ\www\pizza\immagine.php on line 27
Avete dimenticato di comunicare la fine di un’istruzione prima di una parentesi con un “;”

Permalink 2 Commenti