Colocar título

WirelessBR		WirelessBr é um site brasileiro, independente, sem vínculos com empresas ou organizações, sem finalidade comercial, feito por voluntários, para divulgação de tecnologia em telecomunicações
ÁLBUM DE FOTOS EM WAP 1.2.1 e PHP
AUTOR : MARCELO YONAMINE

Publicado em 22/Abril/2004

Nota do autor: O leitor deste tutorial deve ter uma noção de como criar páginas dinâmicas em PHP.

Introdução
Na primeira versão da tecnologia WAP, as telas dos terminais eram pequenas e monocromáticas.
Como a tecnologia não anda para trás, hoje temos celulares com telas maiores e coloridas e capacidade de tirar fotos e até reproduzir vídeos.

Antes de começar a escrever os códigos, vou citar algumas diferenças importantes do WML em relação ao HTML.

a) Todas as tags devem ser escritas em letras minúsculas com exceção da declaração !DOCTYPE
 Exemplo:
 errado texto
 certo texto

b) Os elementos (tags) devem estar convenientemente aninhados.
 Exemplo:
 errado <a href="music.mid">music.mid</a>
 certo <a href="music.mid">music.mid</a>

c) Os documentos devem ser bem formados.
Um documento diz-se bem formado quando está estruturado de acordo com as regras definidas nas recomendações para XML 1.0
Exemplo:
Abaixo está a estrutura básica de uma página WAP que possibilita ver imagens e fotos.
Código do programa "teste.wap":

<?xml version="1.0"?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml12.dtd">
<wml>
<head>
<meta http-equiv="Cache-Control" content="must-revalidate"/>
<meta http-equiv="Expires" content="Tue, 01 Jan 1980 1:00:00 GMT"/>
<meta http-equiv="Cache-Control" content="max-age=0"/>
</head>
<card id="teste" title="wap page">
<img src="logo.gif" alt="logo"/> 
<img src="photo.jpg" alt="photo"/> 
teste 
<do type="prev" name="Prev" label="back">
<prev></prev>
</do>
</card>
</wml>

d) O uso de tags de fechamento é obrigatório.
 Exemplo:
 errado parágrafo 1 parágrafo 2
 certo parágrafo 1parágrafo 2

e) Elementos vazios devem ser fechados.
 Exemplo:
 errado <img src="photo.jpg" alt="photo.jpg">
 certo <img src="photo.jpg" alt="photo.jpg"/>

Wap e páginas dinâmicas em PHP
Uma página PHP tem a extensão .php, .phtml, etc.

Você pode mixar tags wml e código PHP em sua página dinâmica usando delimitadores:

<?PHP código PHP ?>

Precisamos fazer com que o navegador WAP reconheça uma página PHP como sendo uma página WAP.
Usando o cabeçalho Header:

<?PHP Header("Content-type: text/vnd.wap.wml"); ?>

Coloque o Header na primeira linha de sua página PHP.

Código do programa "teste.php":

<?PHP
Header("Content-type: text/vnd.wap.wml");
echo "<?xml version=\"1.0\"?>";
?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml12.dtd">
<wml>
<head>
<meta http-equiv="Cache-Control" content="must-revalidate"/>
<meta http-equiv="Expires" content="Tue, 01 Jan 1980 1:00:00 GMT"/>
<meta http-equiv="Cache-Control" content="max-age=0"/>
</head>
<card id="teste" title="wap page">
<img src="logo.gif" alt="logo"/> 
<img src="photo.jpg" alt="photo"/> 
teste 
<do type="prev" name="Prev" label="back">
<prev></prev>
</do>
</card>
</wml>

Para testar é necessário um servidor web (PWS, Apache, IIS), PHP4 com suporte a biblioteca gráfica GD2, e um navegador wap.
Um dos mais simples e eficientes navegadores wap para teste é o Wapaka que é free.
Este navegador foi escrito em java, sendo necessário instalar primeiro o J2SE RE.
Álbum de fotos WAP

Até aqui foi mostrado o básico. 
Agora vamos editar um script em PHP que vai listar e identificar arquivos de fotos .jpg .png em um diretório. 
Este script deve mostrar as fotos em miniatura e contar as fotos de cinco em cinco por página wap dinâmica.

Na verdade o álbum virtual é dividido em dois scripts PHP: 
- Um que vai listar os arquivos de foto e fazer a paginação, 
- e outro script cuja função é gerar a miniatura da foto.

O primeiro script base é o "album.php"; abaixo, está o código:
<?PHP
Header("Content-type: text/vnd.wap.wml");
echo "<?xml version=\"1.0\"?>"; 
?>
<!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.2//EN" "http://www.wapforum.org/DTD/wml12.dtd">
<wml>
<head>
<meta http-equiv="Cache-Control" content="must-revalidate"/>
<meta http-equiv="Expires" content="Tue, 01 Jan 1980 1:00:00 GMT"/>
<meta http-equiv="Cache-Control" content="max-age=0"/>
</head>

<card id="teste" title="photo album">

<?
$imgthumb = "imgthumb.php"; #nome do script gerador de miniatura
$fileimage = "flist.txt"; #arquivo texto referência do array
$arquivo = fopen("$fileimage", 'w+'); #abre o arquivo texto
$myfiledir = dirname(__FILE__); #diretório local
$handle=opendir($myfiledir); #abre o diretório local
while ($filet = readdir($handle))
{
if($filet=='.'||$filet=='..')
continue;
$filetl = strtolower($filet); #para minusculas
if (preg_match("/\.(jpeg|jpg|jpe|png)$/", $filetl)){ // filtro de extensão
$filetlist [$filet] = filemtime ($filet); #ordena por data de atualização
}
}
if (empty($filetlist)) {} else {
arsort($filetlist); #este array somente aceita asort ou arsort

while (list ($key, $val) = each ($filetlist))
{
$filesize = filesize("$myfiledir/$key");
fputs($arquivo, "$key|$filesize\n", 20000000); #grava o nome do arquivo e o tamanho
}
}
fclose($arquivo);
$arquivos = file("$fileimage"); #abre o arquivo txt e lista os elementos em um array
$count = count($arquivos); #número total dos elementos do array
echo "$count photo s \n";
$nfotos = 5; #define a quantidade de fotos por página
if (empty($max)) {
$max = $nfotos;
}
if (empty($min)) {
$min = 0;
}
if ($max > $count) {
$max = $count;
}
for ($i = $min; $i < $max; $i++) {
$imagename = $arquivos[$i];
$explode = explode("|", $imagename); #extrai os elementos dos campos do array
echo "<img src=\"$imgthumb?filename=$explode[0]\" alt=\"$explode[0]\"/> \n";
echo "$explode[0] \n"; #mostra o nome do arquivo
echo "size $explode[1] \n"; #mostra o tamanho do arquivo
}
$maxp = $max + $nfotos; #próxima página
if ($max < $count)
{
echo "<a href=\"album.php?min=$max & amp; max=$maxp\">next</a> \n"; #link do paginador
}
?>
<do type="prev" name="Prev" label="back">
<prev></prev>
</do>
</card>
</wml>

Lembrando que no Servidor Linux é necessário o comando CHMOD 777, permissão de escrita de arquivos no diretório.

O script abaixo é o gerador de miniaturas.
Este script PHP lê o arquivo .jpg ou .png e redimensiona a imagem com os parâmetros de altura e largura.

Código do script "imgthumb.php" :

<?PHP
#Para rodar este script é necessário o PHP 4 e a biblioteca GD 2
##$thumb->save("teste.jpg"); // salva o arquivo miniatura função não usada

define(MAX_WIDTH, 96); #define a largura da foto miniatura
define(MAX_HEIGHT, 65); #define a altura da foto miniatura

$mydir = dirname(__FILE__); #diretório local dos arquivos de foto

$image_file = "$mydir/$filename";

# Carrega a imagem
$img = null;

$extensao = strtolower(end(explode('.', $image_file)));

if ($extensao == 'jpg' || $extensao == 'jpeg' || $extensao == 'jpe') {

$img = @imagecreatefromjpeg($image_file);

} else if ($extensao == 'png') {

$img = @imagecreatefrompng($image_file);

// Se a versão do GD incluir suporte a GIF, mostra...
} else if ($extensao == 'gif') {

$img = @imagecreatefromgif($image_file);
}

if ($img) {

// Pega o tamanho da imagem e proporção de resize
$width = imagesx($img);
$height = imagesy($img);
$scale = min(MAX_WIDTH/$width, MAX_HEIGHT/$height);

// Se a imagem é maior que o permitido, encolhe ela!
if ($scale < 1) {
$new_width = floor($scale*$width);
$new_height = floor($scale*$height);
} else {
$new_width = MAX_WIDTH;
$new_height = MAX_HEIGHT;
}
}

if(!$img) {

$img = imagecreate(MAX_WIDTH, MAX_HEIGHT); #cria imagem de erro

imagecolorallocate($img,230,230,230);

$c = imagecolorallocate($img,173,173,173);
$c1 = imagecolorallocate($img,8,8,8);

imagestring($img, 2, 12, 35, 'image error !',$c1 );
// Mostra a imagem
header('Content-type: image/jpeg');
imagejpeg($img);

}

$thumb=new thumbnail("$image_file"); // seta o nome do arquivo para redimensionar
$thumb->size_width($new_width); // seta largura para a miniatura, ou
$thumb->size_height($new_height); // seta altura para a miniatura
$thumb->size_auto($new_width);
$thumb->show();

class thumbnail
{
var $img;

function thumbnail($imgfile)
{
//deteta formato da imagem
$this->img["format"]=ereg_replace(".*\.(.*)$","\\1",$imgfile);
$this->img["format"]=strtoupper($this->img["format"]);
if ($this->img["format"]=="JPG" || $this->img["format"]=="JPEG") {
//JPEG
$this->img["format"]="JPEG";
$this->img["src"] = ImageCreateFromJPEG ($imgfile);
} elseif ($this->img["format"]=="PNG") {
//PNG
$this->img["format"]="PNG";
$this->img["src"] = ImageCreateFromPNG ($imgfile);
} elseif ($this->img["format"]=="GIF") {
//GIF
$this->img["format"]="GIF";
$this->img["src"] = ImageCreateFromGIF ($imgfile);
} elseif ($this->img["format"]=="WBMP") {
//WBMP
$this->img["format"]="WBMP";
$this->img["src"] = ImageCreateFromWBMP ($imgfile);
} else {
//DEFAULT

exit();
}
@$this->img["lebar"] = imagesx($this->img["src"]);
@$this->img["tinggi"] = imagesy($this->img["src"]);
//default quality jpeg
$this->img["quality"]=75;
}

function size_height($size=100)
{
//height
$this->img["tinggi_thumb"]=$size;
@$this->img["lebar_thumb"] = ($this->img["tinggi_thumb"]/$this->img["tinggi"])*$this->img["lebar"];
}

function size_width($size=100)
{
//width
$this->img["lebar_thumb"]=$size;
@$this->img["tinggi_thumb"] = ($this->img["lebar_thumb"]/$this->img["lebar"])*$this->img["tinggi"];
}

function size_auto($size=100)
{
//size
if ($this->img["lebar"]>=$this->img["tinggi"]) {
$this->img["lebar_thumb"]=$size;
@$this->img["tinggi_thumb"] = ($this->img["lebar_thumb"]/$this->img["lebar"])*$this->img["tinggi"];
} else {
$this->img["tinggi_thumb"]=$size;
@$this->img["lebar_thumb"] = ($this->img["tinggi_thumb"]/$this->img["tinggi"])*$this->img["lebar"];
}
}

function jpeg_quality($quality=75)
{
//jpeg quality
$this->img["quality"]=$quality;
}

function show()
{
//mostra miniatura
@Header("Content-Type: image/".strtolower($this->img["format"])); #cabeçalho header mime type

/* muda ImageCreateTrueColor para ImageCreate se a versão do GD não suporta função ImageCreateTrueColor */
$this->img["des"] = ImageCreateTrueColor($this->img["lebar_thumb"],$this->img["tinggi_thumb"]);
@imagecopyresized ($this->img["des"], $this->img["src"], 0, 0, 0, 0, $this->img["lebar_thumb"], $this->img["tinggi_thumb"], $this->img["lebar"], $this->img["tinggi"]);

if ($this->img["format"]=="JPG" || $this->img["format"]=="JPEG") {
//JPEG
imageJPEG($this->img["des"],"",$this->img["quality"]);
} elseif ($this->img["format"]=="PNG") {
//PNG
imagePNG($this->img["des"]);
} elseif ($this->img["format"]=="GIF") {
//GIF
imageGIF($this->img["des"]);
} elseif ($this->img["format"]=="WBMP") {
//WBMP
imageWBMP($this->img["des"]);
}
}

function save($save="")
{
//salva a miniatura no diretório
if (empty($save)) $save=strtolower("./thumb.".$this->img["format"]);
/* muda ImageCreateTrueColor para ImageCreate se a versão do GD não suporta função ImageCreateTrueColor*/
$this->img["des"] = ImageCreateTrueColor($this->img["lebar_thumb"],$this->img["tinggi_thumb"]);
@imagecopyresized ($this->img["des"], $this->img["src"], 0, 0, 0, 0, $this->img["lebar_thumb"], $this->img["tinggi_thumb"], $this->img["lebar"], $this->img["tinggi"]);

if ($this->img["format"]=="JPG" || $this->img["format"]=="JPEG") {
//JPEG
imageJPEG($this->img["des"],"$save",$this->img["quality"]);
} elseif ($this->img["format"]=="PNG") {
//PNG
imagePNG($this->img["des"],"$save");
} elseif ($this->img["format"]=="GIF") {
//GIF
imageGIF($this->img["des"],"$save");
} elseif ($this->img["format"]=="WBMP") {
//WBMP
imageWBMP($this->img["des"],"$save");
}
}
}

?>

Conclusão

Este é o fim deste tutorial.
Tentamos mostrar o básico de um sistema de álbum de fotos para celulares com acesso a WAP 1.2.1
Um desenvolvedor com conhecimento da tecnologia PHP e WAP poderia incluir ao álbum virtual suporte a Mensagens MMS, como a empresa MMS2WEB, por exemplo.

Espero que tenham gostado deste tutorial
Abraços
Marcelo Yonamine
ci555@zipmail.com.br

Home WirelessBR