HUFERSIL.WEBDEVELOPER

Criando um catálogo de produtos com Lumine e CodeIgniter – Parte 7

Olá Pessoal!

Hoje vamos fazer a a sétima parte desta série de artigos.
Iremos começar a montar a nossa parte pública. E para isso, vamos fazer a nossa home page.

Antes de iniciarmos, precisamos fazer algumas alterações na função fncImprimeConteudoAninhado, para que possamos reaproveitá-la em outras partes de nosso desenvolvimento. Para isso, abra o arquivo application/helpers/util_helper.php, encontre a função e a substitua pelo código abaixo:

function fncImprimeConteudoAninhado(array $lista, $tpl, $nomeIndice, $indentString = ' ', $level = 0, $strAbertura = '', $strFechamento = ''){
	$str = '';
	foreach($lista as $item){
		$item['_indent'] = str_repeat($indentString, $level);
 
		$str .= preg_replace('@:(\w+)\b@e', 'isset($item["$1"]) ? $item["$1"] : ":$1"', $tpl);
 
		if(!empty($item[$nomeIndice])){
			$filho = $strAbertura;
			$filho .= fncImprimeConteudoAninhado($item[$nomeIndice], $tpl, $nomeIndice, $indentString, $level+1, $strAbertura, $strFechamento);
			$filho .= $strFechamento;
 
			if(strpos($str, ':_conteudoFilho') !== false){
				$str = str_replace(':_conteudoFilho', $filho, $str);
			} else {
				$str .= $filho;
			}
		}
 
		// tirando o lixo
		$str = preg_replace('@:(\w+)\b@', '', $str);
	}
 
	return $str;
}

Agora, vamos alterar a rota padrão do site, para direcionar para a nossa controller do site.
Abra o arquivo application/config/routes.php e encontre a linha:

$route['default_controller'] = "admin/login/index";

E substitua por

$route['default_controller'] = "home/index";

Isto fará com que o usuário seja direcionado para esta controller quando entrar no site.

Na parte de administração, criamos a controller de base AdminController, para facilitar o desenvolvimento na parte administrativa. Faremos a mesma coisa para a parte pública.

Crie um arquivo na estrutura application/core/SiteController.php com os códigos abaixo:

<?php
/**
 * Controller para gerenciamento do site.
 *
 *
 * @author Hugo Ferreira da Silva
 */
class SiteController extends MY_Controller {
 
	public function __construct(){
		parent::__construct();
		$this->layoutFile = 'site/template.php';
	}
 
	/**
	 * Carrega as configurações comuns
	 *
	 * @author Hugo Ferreira da Silva
	 */
	protected function loadCommonAssets(){
		// categorias que montam o menu principal
		$categoria = new Categoria();
		$categoria->order('ordem')
			->find();
 
		// produtos que aparecem no rodape
		$produto = new Produto();
		$produto->getProdutosSite('rand()', 4);
 
		$this->assign('_outrosProdutosRodape', $produto->allToArray(false,true));
		$this->assign('_categorias', fncAninharElementos($categoria->allToArray(), 'codcategoria', 'codpai'));
	}
}

E no arquivo application/core/MY_Controller.php, adicione a linha abaixo no final do arquivo:

require_once dirname(__FILE__) . '/SiteController.php';

Criando a nossa controller inicial

Agora que fizemos nossas alterações de base, podemos criar nossa controller inicial (a que usuário verá assim que entrar em nossa vitrine virtual).
Crie um arquivo na estrutura application/controllers/home.php com o conteúdo abaixo:

<?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');
 
/**
 * Controller para acesso ao conteudo principal do site
 *
 *
 * @author Hugo Ferreira da Silva
 *
 */
class Home extends SiteController {
 
	/**
	 * Acesso principal ao site.
	 *
	 * @author Hugo Ferreira da Silva
	 */
	public function index(){
 
		// consultamos os produtos
		// fazendo join com a categoria
		// e pegando somente a primeira foto do produto.
		// ATENCAO - O produto TEM que ter uma foto com a ordem = 1
		$lista = new Produto();
		$lista->getProdutosSite('rand()', 12);
		$this->assign('destaques', $lista->allToArray(false,true));
 
		$this->loadCommonAssets();
		$this->display('home/index');
	}
}

Veja que foi chamado um método diferente na classe Produto.
Para adicionar este método, abra o arquivo application/models/Produto.php e adicione o método abaixo:

    /**
     * Recupera uma lista de produtos.
     *
     * Já faz o join com a categoria do produto e com
     * a imagem principal do produto.
     *
     * @param string $order Ordem em que os produtos deverão ser listados
     * @param int $limit Limite de produtos nesta consulta
     * @param int $offset Inicio da recuperação dos produtos
     * @return int Numero de registros encontrados
     * @author Hugo Ferreira da Silva
     */
    public function getProdutosSite($order, $limit, $offset = 0){
    	return $this->alias('p')
	    	->join(new Categoria(),'inner','c')
	    	->join(new Foto(),'inner','f',null,null,'f.ordem = 1')
	    	->select('f.thumb, f.grande')
	    	->select('p.nome,p.codproduto,p.permalink,substring(p.descricao, 1, 100) as descricao')
	    	->select('c.nome as categoria, c.permalink as permalink_categoria,p.codcategoria')
	    	->order( $order )
	    	->limit($offset, $limit)
	    	->find();
    }

Pronto, nossas controllers e configurações básicas estão criadas.
Agora precisamos criar a parte visual.

Criando a parte visual

Vamos seguir a mesma linha de raciocínio da parte administrativa para a parte pública.
Criaremos um arquivo base que receberá outras views. Crie o arquivo application/views/site/template.php com o conteúdo abaixo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
 
	<title>HUFERSIL.WEBGAMES - Os melhores games pra você!</title>
 
	<link rel="stylesheet" type="text/css" media="all" href="<?php echo base_url('assets/css/site.css'); ?>" />
 
</head>
<!--[if lt IE 7 ]> <body class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <body class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <body class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <body class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <body> <!--<![endif]-->
		<div id="header-wrapper">
 
		        <div id="header">
		            <a href="<?php echo site_url(); ?>">
		            	<img src="<?php echo base_url('assets/imagens/logo.png'); ?>" alt="Food Recipes" class="logo" />
		            </a>
				</div>
 
		        <div id="nav-wrap">
						<div class="inn-nav clearfix">
								<ul class="nav">
										<?php 
 
										$linkCategoria = site_url('categorias/listar/:codcategoria-:permalink');
										echo fncImprimeConteudoAninhado(
											$_categorias
											, '<li><a href="'.$linkCategoria.'">:nome</a> :_conteudoFilho</li>'
											, '_filhos'
											, ''
											, 0
											, '<ul>'
											, '</ul>'
										);
 
										?>
										<li><a href="<?php echo site_url('contato/form'); ?>">Contato</a></li>
								</ul>
						</div>
				</div>
				<span class="w-pet-border"></span>
		</div>
 
        <div id="container">
 
       <?php
        // o arquivo de template a ser incluido foi informado?
		if(!empty($_template)){
			// procuramos ele a partir deste arquivo
			$_template = dirname(__FILE__) . '/' . $_template;
			// se existir, fazemos o include
			if(file_exists($_template)){
				include $_template;
 
			// se nao existir, enviamos uma mensagem
			} else {
				echo 'Template "', $_template, '" não existe!';
			}
 
		// se nao informou, enviamos uma mensagem
		} else {
			echo 'Template nao informado!';
		}
        ?>
		</div>
		<div class="w-pet-border"></div>
 
	    <div id="bottom-wrap">
		    	<ul id="bottom" class="clearfix">
			        	<li>
								<h2>Quem <span>Somos</span></h2>
				            	<div class="about">
					                    <p>Por conseguinte, o desenvolvimento contínuo de distintas formas de atuação prepara-nos para enfrentar situações atípicas decorrentes das novas proposições.</p>
					                    <a href="#" class="readmore">Leia mais</a>
				                </div>
						</li>
						<li>
								<h2>Outros <span>Produtos</span></h2>
								<ul class="recent-posts">
								<?php
								$sliced = array_splice($_outrosProdutosRodape, 0, 2);
								$tpl = '<li>
												<a class="img-box" href="'.site_url('produtos/detalhes/:codproduto-:permalink').'"><img src="'.base_url(':thumb').'" alt=":nome" /></a>
												<h5><a href="'.site_url('produtos/detalhes/:codproduto-:permalink').'">:nome</a></h5>
												<p>:descricao</p>
										</li>';
 
								echo fncImprimeConteudoAninhado($sliced, $tpl, '');
								?>
								</ul>
						</li>
						<li>
								<h2> </h2>
								<ul class="recent-posts">
								<?php
								$sliced = array_splice($_outrosProdutosRodape, 0, 2);
								$tpl = '<li>
												<a class="img-box" href="'.site_url('produtos/detalhes/:codproduto-:permalink').'"><img src="'.base_url(':thumb').'" alt=":nome" /></a>
												<h5><a href="'.site_url('produtos/detalhes/:codproduto-:permalink').'">:nome</a></h5>
												<p>:descricao</p>
										</li>';
 
								echo fncImprimeConteudoAninhado($sliced, $tpl, '');
								?>
								</ul>
						</li>
				</ul>
	    </div>
 
</body>
</html>

Este arquivo será a base de toda a nossa vitrine virtual.
Veja que em seu “miolo”, há uma verificação para analisar se o argumento $_template foi passado e se é um arquivo válido. Dessa forma, precisaremos em nossas outras views criar somente este “miolo”.

Para a home, vamos criar o “miolo” de entrada no site.
Crie um arquivo na estrutura application/views/site/home/index.php com o seguinte conteúdo:

<div class="top-search clearfix">
	<h3 class="head-pet">
		<span>Pesquisa de Produtos</span>
	</h3>
	<form action="#" id="searchform" method="post">
		<p>
			<input type="text" name="2" id="s" class="field"
				value="Pesquisar Por" onfocus="this.value=''" /> <input
				type="submit" name="s_submit" id="s-submit" value="" />
		</p>
	</form>
	<p class="statement">
		<span class="fireRed">Ultimas notícias :</span> <a href="#">Brasil
			perde a copa do mundo (de novo)</a>
	</p>
</div>
 
<div id="content">
	<div id="whats-hot">
		<h2 class="w-bot-border">
			Produtos em <span>Destaque</span>
		</h2>
 
		<ul class="cat-list clearfix">
 
		<?php
		$linkProduto = site_url('produtos/detalhes/:codproduto-:permalink');
		$linkCategoria = site_url('categorias/listar/:codcategoria-:permalink_categoria');
		$tpl =  '<li>
		                    	<h3><a href="'.$linkProduto.'">:nome</a></h3>
		                        <a href="'.$linkProduto.'" class="img-box"><img src=":grande" alt=":nome" /></a>
		                        <h4><a href="'.$linkCategoria.'">:categoria</a></h4>
		                        <p>:descricao<a href="#">... mais</a></p>
	                    </li>';
 
		echo fncImprimeConteudoAninhado($destaques, $tpl, 'idx');
		?>
		</ul>
	</div>
</div>

Para não estender muito facilitar, os arquivos CSS / imagens podem ser baixados aqui.

Se todos os passos foram seguidos corretamente, deverá ficar semelhante a este.

Na próxima, vamos fazer o detalhamento do produto.

@braços e fique com Deus!

Deixar uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *

*

Pode usar estas etiquetas HTML e atributos: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">