In order to avoid having to replicate the same code in several files and even in more than one place in the same file, I transformed my function that rendered products into the literal object below:
produtoObj = function() {
return {
titulo: response.produto[i].dados.nome,
preco: parseFloat(response.produto[i].dados.por),
parcela: parseFloat(response.produto[i].dados.qtdParcela),
valorParcela: parseFloat(response.produto[i].dados.por) / parseFloat(response.produto[0].dados.qtdParcela).toFixed(2),
classe : response.produto[i].dados.id,
imagem : produtos[i].dados.imgNome,
renderiza: function () {
var tagFig = "<piicture>" + "</piicture>";
var tagPicture = $(tagFig).attr("class", "produtos-organizados a" + this.classe);
var tagTituloProduto = "<figcaption>" + this.titulo + "</figcaption>";
var tagPreco = "<p>" + "R$ " + this.preco + "</p>";
var parcela = this.parcela;
var converteTotal = this.valorParcela;
var tagParcela = "<p>" + "at\u00e9 " + this.parcela + "x" + " de " + converteTotal + "</p>";
var tagDiv = "<div>" + "</div>";
var divP = $(tagDiv).append(tagPreco, tagParcela);
var btnId = "<i class='large material-icons' id='response.produto[0].dados.id'>" + "shopping_cart" + "</i>";
var test = "<img src='img/produtos/" + this.imagem + ".jpg' />";
var teste = $('.produtos');
var add1 = $(tagPicture).append(test, tagTituloProduto, divP, btnId);
var add2 = $(teste).append(add1);
}
};
};
But after I did this, I started to have problems in both trying to load more products, and to use .sort
in another part of the code, and instead of rendering products normally when calling load more products, and calling the renderizaData
, renderizaMaiorPreco
or renderizaMenorPreco
(the functions that receive .sort
) is always called the same values as my json
:
$(".add-produtos").on("click", function(){
for(var i = 7; i < 9; i++) {
var testar = produtoObj();
testar.renderiza();
};
$('.carregar').removeClass("add-produtos"); //tentativa de limitar o numero de vezes que é possivel chamar a função de adicionar os produtos.
});
Above the code that loads more products, and below the one that reorganizes the products:
function ordenarData() {
$("#mais-recente").on("click", function(){
remover();
renderizaProdutoPorData();
});
function renderizaProdutoPorData(){
var response = JSON.parse(produto.responseText);
var produtos = response.produto;
produtos.sort(compareData);
for(var i = 0; i < 6; i++) {
var testar = produtoObj();
testar.renderiza();
}
$(".carregar").on("click", function(){
for(var i = 7; i< 10; i++) {
var testar = produtoObj();
testar.renderiza();
};
})
}
function remover(){
$(".produtos-organizados").remove();
};
};
function compareData(a, b) {
return (a.dados.data) < (b.dados.data);
}