Com base nisso criei um plugin para o ZF que faz o carregamento dos arquivos sob demanda. Este plugin nada mais faz do que carregar os arquivos do módulo, controller, action (nesta ordem) no cabeçalho da página.

Para o correto funcionamento do plugin, é preciso que uma estrutura de pastas seja respeitada:

• [moduleName] – Nome do modulo corrente;
• [scriptPathName] – Nome da pasta de scripts JS. Por padrão, é adotado o nome ’scripts’;
• [controllerName] – Nome do controller corrente;
• [actionName] – Nome do action corrente;
• [scriptControllerName] – nome do script JS que será chamado a nível de controller. Por padrão, é adotado ‘controller’;
• [stylePathName] – Nome da pasta de estilos CSS. Por padrão, é adotado o nome ’styles’;
• [styleControllerName] – nome do estilo CSS que será chamado a nível de controller. Por padrão, é adotado ‘controller’;

O plugin irá tentar incluir todos estes arquivos no head somente se o arquivo existir.

O plugin deve ser registrado pelo objeto Zend_Controller_Front e o objeto de visualização (Zend_View_Interface) já deve estar previamente configurado para o correto funcionamento. O namespace Tavs_View_Helper deve ser adicionado através do método Zend_View::addHelperPath() para que o plugin acesse o helper Tavs_View_Helper_BaseUrl, responsável por incluir o baseUrl ao início do nome do arquivo.

Outra funcionalidade deste plugin é adicionar ao cabeçalho, códigos JS úteis para o javascript. Como o próprio baseUrl, ID da sessão e outros paths do sistema que só podem ser definidos pelo PHP.

O plugin Tavs_Controller_Plugin_View pode ser baixado juntamente com a minha biblioteca de códigos Tavs em http://tavslibary.googlecode.com/svn/trunk.

Neste post mostrarei como é feito as principais configurações (View, Modulos, IncludePath e etc…) utilizando a nova versão do poderoso Zend Framework 1.8. Para isso, criarei um novo projeto no eclipse chamado Tests no localhost.

A primeira coisa a ser feita é criar as pastas e arquivos do projeto, como segue a imagem a baixo:

Esta é a estrutura que gosto de usar, mas como o ZF é bem flexível, você pode organizar da maneira que achar mais conveniente. Neste caso, para acessar a aplicação, a url seria: http://localhost/Tests/httpdocs.

Criado os diretórios colocaremos “conteúdo” nos arquivos para iniciar a aplicação. O primeiro arquivo arquivo a ser editado é o .htaccess que reescreve as url’s de modo que todo acesso ao projeto seja redirecionado para o arquivo index.php.

SetEnv APPLICATION_ENV development

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^.*$ index.php [NC,L]

Neste momento, qualquer acesso à url http://localhost/Tests/httpdocs/ será redirecionado para o arquivo index.php. Para testar, digite qualquer coisa depois de httpdocs. Se não der erro de página não encontrada, é porque você está no caminho certo.

O próximo passo é criar o arquivo index.php que definirá o ambiente que o a aplicação será rodada.

<?php

/**
* Define o diretorio onde a aplicacao esta rodando.
* Se não tiver definido anteriormente, define usando realpath(dirname(__FILE__) . '/../application').
* O resultado será C:\<caminho_para_localhost>\Tests\application
*/
defined('APPLICATION_PATH') || define('APPLICATION_PATH', realpath(dirname(__FILE__) . '/../application') . DIRECTORY_SEPARATOR);

/**
* Define o ambiente da aplicacao.
* Assume 'production' como ambiente padrao se a variavel APPLICATION_ENV nao tiver sido setada
*/
defined('APPLICATION_ENV') || define('APPLICATION_ENV', (getenv('APPLICATION_ENV') ? getenv('APPLICATION_ENV') : 'production'));

//Zend_Application
require_once 'Zend/Application.php';

/**
* Cria uma instancia de Zend_Application passando o ambiente e o caminho para o arquivo de configuracoes.
* Este componente irá automatizar algumas configurações definidas no config.ini
*/
$application = new Zend_Application(
APPLICATION_ENV,
APPLICATION_PATH . 'config/config.ini'
);

//Faz as configuraçoes basicas (Views, Layout, DB, ...)
$application->bootstrap();

//Inicia efetivamente a aplicacao. Neste momento é dado o dispatch para instanciar os controllers e chamar os actions
$application->run();

Para setar variáveis de ambiente no Windows basta pressionar as teclas Window+Pause para a abrir a janela de propriedades do computador. Vá na guia Advanced/Avançado clica botão Environment Variables/Variáveis de Ambiente. Na próxima tela, acrescente a variável APPLICATION_ENV no grupo de System Variables/Variáveis de Sistema com o valor ‘development‘. Para não perder o costume, reinicie o computador. Uma alternativa seria setar a variável no .htaccess, igual ao citado anteriormente.

Agora teremos que criar a classe Bootstrap para iniciar as configurações básicas. Por padrão, o ZF consegue configurar algumas coisas como conexão com banco, diretorios dos modulos/controllers e etc apenas lendo o config.ini. Eu prefiro colocar no config.ini tudo aquilo que varia de ambiente para ambiente, configurando o restante na classe Bootstrap.

Um dos grandes benefícios desta classe é a inteligência para chamar os métodos de inicialização. Todo método iniciado por _init da classe Zend_Application_Bootstrap_Bootstrap será chamado, assim fica mais organizado o bootstrap onde cada método configura somente uma parte do projeto. No exemplo abaixo, criei somente o método _initFrontController para informar ao dispatcher onde está as pastas com os módulos. Nos próximos posts, mostrarei outras configurações como BD, View, IncludePath e etcs….

<?php

class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
{
/**

* Configura o objeto FrontControoler.     *
* @return Zend_Controller_Front
*/
protected function _initFrontController()
{
$front = Zend_Controller_Front::getInstance();
$front
->addModuleDirectory(APPLICATION_PATH . 'modules')
->setDefaultModule('default');

return $front;
}
}

Para o exemplo, defini a pasta modules como o diretorio que conterá todos os modulos do projeto. O Zend automaticamente lê cada diretório de ‘modules’ como sendo um módulo do projeto.

Agora criaremos os controller, actions e views para fazer a renderização. Edite o arquivo IndexController.php e implemente a classe IndexController como abaixo:

class IndexController extends Zend_Controller_Action
{
/**
* Irá renderizar o arquivo view/scripts/index/index.phtml
*
*/
public function indexAction()
{

}
}

Código do script index.phtml

<h3>Hello World</h3>

Neste momento, ao acessar http://localhost/Tests/httpdocs, você deverá ver uma página com o texto Hello World. No próximo post, mostrarei como configurar o banco de dados e o Zend_Layout, ótimo componente para utilização do MVC.

Abraços.

Atualmente o Zend_Paginator no permite paginar quatro tipos de model:

• Array
• DbSelect
• DbTableSelect
• Iterator

Para este exemplo farei a paginação usando o DbSelect, que acredito ser o mais utilizado por retornar registros do banco de dados.

A primeira coisa a ser feita é fazer a consulta ao banco de dados. Apenas selecionei todos os registros da tabela cliente:

//fazendo a consulta no banco de dados
$db = Zend_Db_Table::getDefaultAdapter();
$select = $db->fetchAll("SELECT * FROM cliente");

Realizada a consulta, vamos criar a paginação:

//criando a paginaçao
Zend_Paginator::setDefaultScrollingStyle('Sliding');
Zend_View_Helper_PaginationControl::setDefaultViewPartial('partials/paginator.phtml');
$paginator = Zend_Paginator::factory($select);

//pagina atual. Se nao vier nenhuma pagina, mostra a primeira
$currentPage = $this->_getParam('page', 1);
$paginator
->setCurrentPageNumber($currentPage)
->setItemCountPerPage(5);

//manda para a viewer
$this->view->paginator = $paginator;

As chamadas estáticas servem para mostrar ao paginator qual o tipo de paginação e qual será a template padrão da paginação. No exemplo, a template padrão será o paginator.phtml, localizado em view/scripts/partials/paginator.phtml. Segue o código dela:

<?php if ($this->pageCount): ?>
<div class="paginationControl">
<!-- Previous page link -->
<?php if (isset($this->previous)): ?>
<a href="<?php echo $this->url(array('page' => $this->previous)); ?>">
< Previous
</a> |
<?php else: ?>
<span class="disabled">< Previous</span> |
<?php endif; ?>

<!-- Numbered page links -->
<?php foreach ($this->pagesInRange as $page): ?>
<?php if ($page != $this->current): ?>
<a href="<?php echo $this->url(array('page' => $page)); ?>">
<?php echo $page; ?>
</a> |
<?php else: ?>
<?php echo $page; ?> |
<?php endif; ?>
<?php endforeach; ?>

<!-- Next page link -->
<?php if (isset($this->next)): ?>
<a href="<?php echo $this->url(array('page' => $this->next)); ?>">
Next >
</a>
<?php else: ?>
<span class="disabled">Next ></span>
<?php endif; ?>
</div>
<?php endif; ?>

Dica: Se o seu sistema possui várias paginações, seria interessante se as chamadas dos métodos estáticos mostrados acima ficassem no bootstrap. Com isso, a configuração da paginação serviria para toda aplicação.

Para finalizar a paginação, falta somente o script que renderizará a listagem e mostrar a paginação:

<?php
if ( count($this->paginator) > 0) :
foreach ($this->paginator as $item) :
Zend_Debug::dump($item);
endforeach;
echo $this->paginator;
endif;
?>

Checa se a paginacao possui algum registro, faz o loop para exibir os registros e, por fim, renderiza a lista de páginas renderizadas pelo Zend_Paginator.

Simples assim.

Leitura recomendada: Zend_Paginator

Abraços.

• php_uploadprogress_dll_WIN32.zip
• uploadprogress-1.0.0.tgz

A extensão precisa acessar a pasta de uploads temporária, portanto é necessário configurar no php.ini o caminho. Inclua as seguintes linhas no seu arquivo de configurações do php:

[UploadProgress]

extension=php_uploadprogress.dll
uploadprogress.file.contents_template="C:WINDOWSTempupload_contents_%s"
uploadprogress.file.filename_template="C:WINDOWSTempupt_%s.txt"

Obs: Reparem para a última parte dos caminhos que devem ser mantidos (“upload_contents_%s” e “upt_%s.tx”)

Obs2: Sei que não é a melhor opção, mas estou fazendo o tutorial baseado em ambiente Windows. Mas os passos são os mesmos para ambiente Unix.

Segue o controller que fará todo o controle do upload:

class IndexController extends Zend_Controller_Action
{
/**
* Monta o formulário
*
* @return void
*/
public function indexAction()
{
$request = $this->getRequest();
$this->view->id = md5(microtime() . rand());
}

/**
* Processo os arquivos quando forem finalizados
*
* @return void
*/
public function processAction()
{
Zend_Layout::getMvcInstance()->disableLayout();
$this->_helper->viewRenderer->setNoRender();

Zend_Debug::dump($_FILES);
Zend_Debug::dump($_POST);

}

/**
* Retorna o json com as informações do progresso do upload.
*
* @return void
*/
public function processInfoAction()
{
Zend_Layout::getMvcInstance()->disableLayout();
$this->_helper->viewRenderer->setNoRender();

$id = $this->_getParam('id');
echo Zend_Json::encode(uploadprogress_get_info($id));
}
}

indexAction apenas renderiza o formulário passando o ID do post. É por este ID que a extensão saberá identificar de qual upload deve ser retornado as informações.

processAction apenas recebe os arquivos e ecoa na tela as informações.

processInfoAction recebe o ID do upload e retorna o json necessário para o javascript fazer a barra de progresso.

Este é o HTML montado para o upload. Notem que é obrigatório o campo hidden com o identificador gerado no indexAction.

<form action="<?= $this->url(array('action'=>'process')) ?>" id="frmUpload" enctype="multipart/form-data" method="post">
<input type="hidden" name="UPLOAD_IDENTIFIER" value="<?= $this->id; ?>" id="UPLOAD_IDENTIFIER"/>

<label>Select File:</label>
<input type="file" name="file" style="display:block" />

<input type="submit" value="ok" />
</form>
<div id="uploadprogressbar"></div>

A div identificada por “uploadprogressbar” é onde o será feita a barra de progresso.

O que resta agora é somente o javascript. Para a barra de progresso é necessário o jQuery e o plugin jQuery ProgressBar.

Inclua o seguinte código JS no header da página que terá o formulário.

<script type="text/javascript">
var progress_key;

$(document).ready(function() {
progress_key = $("#UPLOAD_IDENTIFIER").val();
$("#frmUpload").bind("submit", function() {
beginUpload();
});
$("#uploadprogressbar").progressBar();
});

function beginUpload() {
$("#uploadprogressbar").fadeIn();
setTimeout("showUpload()", 100);
}

function showUpload() {
$.get("<?= $this->url(array('action'=>'process.info')); ?>/id/" + progress_key, function(data) {
if (!data)
return;

var response;
eval ("response = " + data);

if (!response)
return;

var percentage = Math.floor(100 * parseInt(response['bytes_uploaded']) / parseInt(response['bytes_total']));
$("#uploadprogressbar").progressBar(percentage);

});
setTimeout("showUpload()", 100);
}
</script>

Feito isso, é só testar e ver o resultado.

Para mais informações do plugin ProgressBar acesse o site do mesmo.

Qualquer dúvida entre em contato que farei o possível para ajudar.

Abraços!

Mais informações à respeito do evento pode ser encontradas no site oficial do grupo.

Para tentar exemplificar, irei fazer um passo-a-passo da integração. Estou assumindo que seu projeto já esteja funcionando corretamente, ou seja, MVC configurado corretamente e etc.

A primeira coisa a se fazer é adicionar o componente no mesmo nível onde está o ZF:

/library

/library/Tavs

/library/Zend

Feito isso, seu projeto já terá acesso ao componente Flexigrid. Obs: Tomei o cuidado de escrever as classes mantendo o padrão adotado pelo ZF, onde cada “/” é representada por “_” no nome da classe.

Com o componente incluído, já podemos escrever no controller os métodos que farão configuração do Flexigrid.

IndexController.php

<?php

class IndexController extends Zend_Controller_Action
{
/**
* Retorna a instancia do flexigrid
*
* @return Tavs_jQuery_Flexigrid
*/
private function _getFlexigrid()
{
$front = $this-&gt;getFrontController();
$flexigrid = new Tavs_jQuery_Flexigrid($front-&gt;getBaseUrl() . '/index/list');

$flexigrid
-&gt;setTitle('Clientes')
-&gt;orderBy(
$this-&gt;_getParam('sortname', 'cliente_nome'),
$this-&gt;_getParam('sortorder', Tavs_jQuery_Flexigrid::SORT_ASC)
);

$flexigrid
-&gt;addColumn('text', 'cliente_nome', array(
'label' =&gt; 'Nome'
))
-&gt;addColumn('text', 'cliente_email', array(
'label' =&gt; 'Email'
))
-&gt;addColumn('date', 'cliente_nascimento', array(
'label' =&gt; 'Data de Nascimento',
'align' =&gt; Tavs_JQuery_Flexigrid_Column_Abstract::ALIGN_CENTER
))
-&gt;addColumn('checkbox', 'cliente_ativo', array(
'label' =&gt; 'Ativo?',
'align' =&gt; Tavs_JQuery_Flexigrid_Column_Abstract::ALIGN_CENTER
));

//seletor e atributos da tabela
$flexigrid
-&gt;setSelector('#grid-clientes')
-&gt;addTableAttrib('id', 'grid-clientes');

//paginacao
$flexigrid-&gt;configPaginator($this-&gt;_getParam('rp', 20), $this-&gt;_getParam('page', 1));

return $flexigrid;

}

/**
* Recupera e a manda para a view a instancia do Flexigrid
*/
public function indexAction()
{
$this-&gt;view-&gt;flexigrid = $this-&gt;_getFlexigrid();
}

/**
* Faz a busca no banco de dados para listar no flexigrid.
*
*/
public function listAction()
{

Zend_Layout::getMvcInstance()-&gt;disableLayout();
$this-&gt;_helper-&gt;viewRenderer-&gt;setNoRender(true);

//cria o objeto para montar da query
$db = Zend_Db_Table::getDefaultAdapter();
$select = $db-&gt;select();

//monta o select
$select-&gt;from(array('C'=&gt;'cliente'), array('cliente_id', 'cliente_nome', 'cliente_email', 'cliente_nascimento', 'cliente_ativo'));

$field_search = $this-&gt;_getParam('qtype');
$field_search_value = $this-&gt;_getParam('query');

if ( !empty($field_search) &amp;&amp; !empty($field_search_value) )
{
$select-&gt;where($field_search . ' LIKE ?', '%' . $field_search_value . '%');
}

$flexigrid = $this-&gt;_getFlexigrid();

echo $flexigrid-&gt;generateRows($select, 'cliente_id');

}

}

É importante lembrar que a inclusão de colunas no flexigrid é obrigatória. O parâmetro do construtor é a URL que o flexigrid irá chamar para popular o grid com o dados. Lembrando que essa requisição é feita com AJAX.

A principal característica deste componente é a personalização das colunas. No exemplo acima temos 4 colunas: duas com texto normal, uma para exibição de data e outra para checkbox. Atualmente, o componente suporta colunas para:

1. Checkbox
2. Date
3. Link
4. Select
5. Text

Para criar uma coluna personalizada por você, é necessário extender a classe Tavs_JQuery_Flexigrid_Column_Abstract e implementar o método render(). Ainda não tive tempo para documentar a utilização do componente, mas é só fazer uma boa leitura no código que fica trivial.

O método listAction monta a consulta para executar no banco de dados. Depois de criado o objeto $select, este é passado como parametro para o método $flexigrid->generateRows onde será configurada a paginação e trazer somente os registros necessários para a página em questão.

Depois de configurado o flexigrid, ecoamos a instância que foi enviada para a view:

index.phtml

<?php echo $this->flexigrid ?>

Está quase pronto! Agora falta incluirmos os arquivos jquery.js, flexigrid.js e flexigrid.css. Normalmente se faz essas inclusões no layout “master” da aplicação, no meu caso:

main.phtml

<?php

$base = Zend_Controller_Front::getInstance()->getBaseUrl();

$this
->headScript()
->appendFile( $base . '/scripts/jquery-1.2.6.min.js' )
->appendFile( $base . '/scripts/flexigrid.js' );

$this
->headLink()
->appendStylesheet( $base . '/styles/flexigrid.css' );

echo $this->doctype()
?>
<html>

<head>
<meta http-equiv="Content-Type"; content="text/html; charset=UTF-8" />
<?php
echo $this->headScript();
echo $this->headLink();
echo $this->JQuery();
?>
</head>

<body>
<?php echo $this->layout()->content ?>
</body>

</html>

Arquivos utilizados para o tutorial:

* Biblioteca jQuery
* Flexigrid
* Tavs Library baseado em ZF (Classes PHP).

Script de banco de dados usado no tutorial:

CREATE TABLE `cliente` (
`cliente_id` int(11) NOT NULL,
`cliente_nome` varchar(50) NOT NULL,
`cliente_email` varchar(50) NOT NULL,
`cliente_nascimento` datetime NOT NULL,
`cliente_ativo` int(11) NOT NULL default ‘1′,
PRIMARY KEY (`cliente_id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

–
– Extraindo dados da tabela `cliente`
–

INSERT INTO `cliente` VALUES(1, ‘Tales’, ‘tales@gmail.com’, ‘2009-03-29 22:15:00′, 0);
INSERT INTO `cliente` VALUES(2, ‘Tales’, ‘tales@hotmail.com’, ‘2009-03-27 22:15:11′, 1);

Qualquer contribuição é sempre bem vinda. Correção de bugs ou coisas do gênero pode ser informado através do email contato@talesaugusto.com.br

É isso aí pessoal, espero que ter conseguido passar alguma informação útil a vocês.

Abraços.

Para este primeiro post no blog, mostrarei um simples exemplo de como adicionar uma funcionalidade trivial no componente Zend_Form do ZF.

Basicamente, o que fiz é extender a classe Zend_Form e sobrepor o método addElement. Este método adiciona um novo elemento ao Zend_Form e seta o atributo tabindex se este não estiver setado anteriormente.

class MyForm extends Zend_Form {

private $_elementTabindex = 1;

public function addElement($element, $name = null, $options = null) {

parent::addElement($element, $name, $options);

if (null !== $name) {
$element = $this->getElement($name);
}

if (!isset($element->tabindex)) {
$element->tabindex = $this->_elementTabindex++;
}

return $element;

}

}

Este foi post, na verdade, foi para me familiarizar com a ferramenta Worpress. Estou preparando materiais para outros posts mais “robustos”. Pretendo escrever algo sobre ZF e jQuery.

Aguardem!