• Filtro Dinâmico Imóveis

Objetivo
Exibir filtros dinâmicos nas listagem de imóveis. Exemplo: Casa, Apartamento...

Como Utilizar
1- Importar o arquivo filtro.js, exibido em Complementos, Item 1;
2- Inserir o Filtro, exibido em Complementos, Item 2;
3- Dentro do foreach de exibição de Imóveis, criar uma <ul> e fechar </ul>;
4- Dentro da <ul>, criar uma <li> e fechar </li>;
5- Dentro da <ul> inserir a ID, id="itemContainer", ficando assim: <ul id="itemContainer">
6- Dentro da <li> inserir a clase, class="{$rs2.tipo|strip:''}, ficando assim: <li class="{$rs2.tipo|strip:''}">
6.1- A classe tem como objetivo gerar os tipos de imóveis para que o filtro do item 2, consiga filtrar, foi inserido uma função (strip) para remover espaços em brancos, uma vez que o código não consegue filtrar com espaços.

Complementos

Código: Selecionar todos

1- filtro.js
(function($) {
$.fn.filtrogz = function(settings) {
settings = $.extend({
useHash: true,
animationSpeed: 1000,
show: { width: 'show', opacity: 'show' },
hide: { width: 'hide', opacity: 'hide' },
useTags: true,
tagSelector: '#filtro a',
selectedTagClass: 'current',
allTag: 'todos'
}, settings);
 
return $(this).each(function(){

FILTRO: FILTRO: seleciona TAG e Filtro

Código: Selecionar todos

$(this).bind("filter", function( e, tagToShow ){
if(settings.useTags){
$(settings.tagSelector).removeClass(settings.selectedTagClass);
$(settings.tagSelector + '[href=' + tagToShow + ']').addClass(settings.selectedTagClass);
}
$(this).trigger("filtroimoveis", [ tagToShow.substr(1) ]);
});

FILTRO: passar class para exibir, restante esconde

Código: Selecionar todos

$(this).bind("filtroimoveis", function( e, classToShow ){
if(classToShow == settings.allTag){
$(this).trigger("show");
}else{
$(this).trigger("show", [ '.' + classToShow ] );
$(this).trigger("hide", [ ':not(.' + classToShow + ')' ] );
}
if(settings.useHash){
location.hash = '#' + classToShow;
}
});

EXIBIR: exibe class

Código: Selecionar todos

$(this).bind("show", function( e, selectorToShow ){
$(this).children(selectorToShow).animate(settings.show, settings.animationSpeed);
});

/* EXIBIR: esconde class*/

Código: Selecionar todos

$(this).bind("hide", function( e, selectorToHide ){
$(this).children(selectorToHide).animate(settings.hide, settings.animationSpeed);
});

============ Checar URL ====================

Código: Selecionar todos

if(settings.useHash){
if(location.hash != '')
$(this).trigger("filter", [ location.hash ]);
else
$(this).trigger("filter", [ '#' + settings.allTag ]);
}

============ Configurações TAGS ====================

Código: Selecionar todos

if(settings.useTags){
$(settings.tagSelector).click(function(){
$('#itemContainer').trigger("filter", [ $(this).attr('href') ]);
 
$(settings.tagSelector).removeClass('current');
$(this).addClass('current');
});
}
});
}
})(jQuery);
 
$(document).ready(function(){
 
$('#itemContainer').filtrogz();
 
});

2- Menu Filtro

Código: Selecionar todos

<ul id="filtro">
<li><a href="#todos">Todos</a></li>
<li><a href="#CASA">Casa</a></li>
<li><a href="#APARTAMENTO">Apartamento</a></li>
<li><a href="#IMÓVEISRURAIS">Imóveis Rurais</a></li>
</ul>